/* Páginas de conteúdo do site (docs/site/paginas.md). Depois de design-tokens.css e nova-home.min.css; antes do CSS da página e de paginas-responsivo.css. */
:root{--r-sm:var(--radius-sm);--r-md:var(--radius-md);--r-lg:var(--radius-lg);--r-xl:var(--radius-xl);--r-full:var(--radius-full);--t1:var(--duration-fast);--t2:var(--duration-normal);--t3:var(--duration-slow);--g50:var(--emerald-50);--g800:var(--emerald-700);--warn50:var(--amber-50);--warn800:var(--amber-800);--danger50:var(--red-50)}

.pg{background:var(--page);color:var(--n700)}
.pg main{--gutter:32px;padding-top:var(--nav-h)}
main :where(h1,h2,h3,p,ul,ol,dl,dd,figure){margin:0}
main :where(ul,ol){padding:0;list-style:none}
main :where(strong,b){font-weight:600;color:var(--n900)}
.skip{position:absolute;left:12px;top:-60px;z-index:1100;padding:10px 16px;border-radius:var(--r-md);background:var(--n900);color:var(--white);font-size:13.5px;font-weight:600}
.skip:focus{top:12px}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* cabeçalho e rodapé da home: ajustes do estado sólido (como na 404) */
@media (min-width:1024px){.pg .nav .nav-right{border-left:0}}
.fa .wrap{width:min(var(--wrap),calc(100% - 2 * var(--gutter)));max-width:none;padding:0}
.nav .ico,.fa .ico{stroke-width:1.8}
.pg .fa li{text-wrap:balance}
@media (min-width:768px){.pg .fa-brand p{text-wrap:pretty}}

.ico{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.wrap{width:100%;max-width:1200px;margin:0 auto;padding:0 var(--gutter)}
.lk{color:var(--p700);font-weight:600;text-decoration:underline;text-underline-offset:3px;transition:color var(--t1)}
.lk .ico{width:16px;height:16px;vertical-align:-3px}
@media (hover:hover){.lk:hover{color:var(--p800)}}
.num{font-variant-numeric:tabular-nums}
.lnav ol>li{display:flex}
.sprite{position:absolute;width:0;height:0;overflow:hidden}

/* botões (DESIGN: button 14/600 40px; cta 15/600 48px) */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:40px;padding:0 22px;border:1.5px solid transparent;border-radius:var(--r-md);font-size:14px;font-weight:600;line-height:1.2;text-align:center;white-space:normal;text-wrap:balance;cursor:pointer;transition:background var(--t1),border-color var(--t1),color var(--t1)}
.btn .ico{width:18px;height:18px}
.btn-p{background:var(--p500);color:var(--white);box-shadow:var(--sh-primary)}
.btn-o{padding:0 16px;background:var(--white);border-color:var(--p300);color:var(--p700)}
.btn-lg{min-height:48px;font-size:15px}
@media (hover:hover){.btn-p:hover{background:var(--p600)}.btn-o:hover{background:var(--p50);border-color:var(--p500)}}

/* textos */
.h1{font-size:26px;font-weight:600;line-height:1.2;letter-spacing:-.01em;color:var(--n900);text-wrap:balance}
.h2{font-size:20px;font-weight:600;line-height:1.3;letter-spacing:-.01em;color:var(--n900);text-wrap:balance}
.h3{font-size:16px;font-weight:600;line-height:1.4;color:var(--n900)}
.lead{font-size:16px;line-height:1.6;color:var(--n700);max-width:60ch;text-wrap:pretty}
.txt{max-width:68ch;color:var(--n700)}
.txt p+p{margin-top:12px}
.sup{font-size:13px;line-height:1.5;color:var(--n600)}
.tg{display:inline-block;padding:2px 10px;border-radius:var(--r-full);background:var(--p100);color:var(--p800);font-size:12.5px;font-weight:600;font-style:normal;line-height:1.5;white-space:nowrap}

/* etiquetas de fato */
.pills{display:flex;flex-wrap:wrap;gap:12px}
.pill{display:inline-flex;align-items:center;gap:6px;min-height:28px;padding:0 12px;background:var(--white);border:1px solid var(--n200);border-radius:var(--r-full);font-size:12.5px;font-weight:500;color:var(--n700);white-space:nowrap}
.pill b{font-weight:600;color:var(--n900)}
.pill .ico{width:14px;height:14px;color:var(--p600)}

/* avisos */
.nt{display:flex;gap:10px;align-items:flex-start;padding:12px 16px;border-radius:var(--r-md);background:var(--p50);color:var(--n800);font-size:13.5px;line-height:1.5}
.nt>.ico{width:18px;height:18px;margin-top:1px;color:var(--p600)}
.nt.warn{background:var(--warn50);color:var(--warn800)}
.nt.warn>.ico{color:var(--warn800)}
.nt.warn b,.nt.warn .lk{color:inherit}

/* tabela dos planos */
.pl-w{margin:0 -12px}
.pl{width:calc(100% + 0px);border-collapse:separate;border-spacing:12px 0;table-layout:fixed}
.pl th,.pl td{padding:0;vertical-align:middle;font-weight:inherit}
.pl .c0{width:34%}
.pl-l0{padding:0 0 14px!important;vertical-align:bottom!important;font-size:13px;color:var(--n600)}
.pl-h{text-align:center;background:var(--white);border:1.5px solid var(--n200);border-bottom:0;border-radius:var(--r-lg) var(--r-lg) 0 0;vertical-align:top!important}
.pl-n{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px 8px;padding:13px 14px;border-radius:calc(var(--r-lg) - 1.5px) calc(var(--r-lg) - 1.5px) 0 0;background:var(--p50);color:var(--p800);font-size:16px;font-weight:600;line-height:1.35}
.pl-pr{display:block;padding:16px 18px 14px}
.pl-pr b{display:block;font-size:22px;font-weight:600;line-height:1.2;letter-spacing:-.01em;color:var(--n900)}
.pl-pr i{margin-left:2px;font-style:normal;font-size:13.5px;font-weight:400;letter-spacing:0;color:var(--n600);white-space:nowrap}
.pl-pr small{display:block;margin-top:4px;font-size:13px;color:var(--n600)}
.pl tbody th{padding:10px 0;border-top:1px solid var(--n200);text-align:left;font-size:13.5px;font-weight:600;line-height:1.35;color:var(--n800)}
.pl tbody th small{display:block;margin-top:1px;font-size:13px;font-weight:400;line-height:1.4;color:var(--n600)}
.pl tbody td{position:relative;padding:10px 18px;text-align:center;background:var(--white);border-left:1.5px solid var(--n200);border-right:1.5px solid var(--n200);font-size:14.5px;font-weight:500;line-height:1.35;color:var(--n900)}
.pl tbody td::before{content:'';position:absolute;top:0;left:18px;right:18px;height:1px;background:var(--n200)}
.pl tbody tr:last-child td{padding-bottom:16px;border-bottom:1.5px solid var(--n200);border-radius:0 0 var(--r-lg) var(--r-lg)}
.pl td>span{display:inline-flex;align-items:center;gap:8px}
.pl td small{display:block;margin-top:2px;font-size:13px;font-weight:400;color:var(--n600)}
.pl td.big>span{font-size:17px;font-weight:600}
.pl td .ico{width:22px;height:22px;padding:4px;border-radius:50%;stroke-width:2.4}
.pl td.y .ico{background:var(--p100);color:var(--p600)}
.pl td.n .ico{background:var(--n100);color:var(--n400)}
.pl-k{display:none}
.pl-f td{padding:0 18px 18px!important}
.pl-f td::before{display:none}
.pl-f .btn{width:100%;min-height:44px}

/* comparação e situações */
.cmp-w{background:var(--white);border:1px solid var(--n200);border-radius:var(--r-lg);box-shadow:var(--sh-sm);overflow:hidden}
.cmp{width:100%;border-collapse:collapse;font-size:14.5px;line-height:1.4}
.cmp th,.cmp td{padding:12px 16px;text-align:left;vertical-align:top;border-top:1px solid var(--n200)}
.cmp thead th{border-top:0;padding-top:13px;padding-bottom:13px;background:var(--p50);font-size:13.5px;font-weight:600;color:var(--p800)}
.cmp thead th:first-child{font-weight:400;color:var(--n600)}
.cmp tbody th{width:26%;font-size:13.5px;font-weight:600;color:var(--n800)}
.cmp th small{display:block;margin-top:1px;font-size:13px;font-weight:400;color:var(--n600)}
.cmp td{font-weight:500;color:var(--n900)}
.cmp td>span{display:inline-flex;gap:8px;align-items:center}
.cmp td .ico{width:22px;height:22px;padding:4px;border-radius:50%;stroke-width:2.4}
.cmp td.y .ico{background:var(--p100);color:var(--p600)}
.cmp td.n{color:var(--n600)}
.cmp td.n .ico{background:var(--n100);color:var(--n400)}
.cmp td small{display:block;margin-top:2px;font-size:13px;font-weight:400;color:var(--n600)}

/* exemplos com valores do Tarifário */
.ex-g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.ex{display:flex;flex-direction:column;padding:18px 20px;background:var(--white);border:1px solid var(--n200);border-radius:var(--r-lg);box-shadow:var(--sh-sm)}
.ex-h{display:grid;grid-template-columns:40px minmax(0,1fr);gap:12px;align-items:center}
.ex-i{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--p100);color:var(--p700)}
.ex-h h3{font-size:16px;font-weight:600;line-height:1.35;color:var(--n900)}
.ex-h p{font-size:13px;line-height:1.4;color:var(--n600)}
.ex dl{display:grid;margin-top:12px}
.ex dl div{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;align-items:center;padding:8px 0;border-top:1px solid var(--n200)}
.ex dt{font-size:13.5px;color:var(--n700)}
.ex dd{text-align:right;font-size:17px;font-weight:700;line-height:1.3;color:var(--n900);white-space:nowrap}
.ex dd small{display:block;font-size:13px;font-weight:400;color:var(--n600)}
.ex dd.y{color:var(--p700)}
.ex-nt{margin-top:auto;padding-top:12px;font-size:13px;line-height:1.5;color:var(--n600)}

/* grau do dano: três barras */
.sev{display:inline-flex;align-items:flex-end;gap:3px;height:16px}
.sev i{display:block;width:5px;border-radius:2px;background:var(--n200)}
.sev i:nth-child(1){height:7px}.sev i:nth-child(2){height:11px}.sev i:nth-child(3){height:16px}
.sev.s1 i:nth-child(-n+1),.sev.s2 i:nth-child(-n+2),.sev.s3 i{background:var(--p500)}

/* listas */
.ls{display:grid;gap:6px;font-size:16px;line-height:1.5;color:var(--n700)}
.ls li{display:grid;grid-template-columns:18px minmax(0,1fr);gap:10px}
.ls li::before{content:'';width:6px;height:6px;margin:10px 0 0 6px;border-radius:50%;background:var(--p300)}
.ls.no li{grid-template-columns:22px minmax(0,1fr)}
.ls.no li::before{display:none}
.ls.no .ico{width:22px;height:22px;padding:4px;margin-top:1px;border-radius:50%;background:var(--n100);color:var(--n400);stroke-width:2.4}

/* passo a passo */
.st{counter-reset:st;display:grid}
.st li{position:relative;display:grid;grid-template-columns:28px minmax(0,1fr);gap:16px;padding-bottom:20px;counter-increment:st}
.st li::before{content:counter(st);position:relative;z-index:1;display:grid;place-items:center;width:28px;height:28px;border:2px solid var(--p500);border-radius:50%;background:var(--white);color:var(--p700);font-size:12.5px;font-weight:600}
.st li::after{content:'';position:absolute;left:13px;top:30px;bottom:2px;width:2px;background:var(--p100)}
.st li:last-child{padding-bottom:0}
.st li:last-child::after{display:none}
.st b{display:block;padding-top:2px;font-size:15px;line-height:1.4}
.st p{margin-top:2px;font-size:16px;line-height:1.6;color:var(--n700)}

/* perguntas */
.faq{padding:0 20px;background:var(--white);border:1px solid var(--n200);border-radius:var(--r-lg);box-shadow:var(--sh-sm)}
.faq details+details{border-top:1px solid var(--n200)}
.faq summary{display:grid;grid-template-columns:minmax(0,1fr) 20px;gap:12px;align-items:center;min-height:56px;padding:12px 0;font-size:16px;font-weight:600;line-height:1.4;color:var(--n900);cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary .ico{color:var(--p600);transition:transform var(--t2) var(--ease)}
.faq details[open] summary .ico{transform:rotate(180deg)}
.faq .a{padding:0 32px 18px 0;font-size:16px;line-height:1.6;color:var(--n700)}
@media (hover:hover){.faq summary:hover{color:var(--p700)}}

/* .stamp da home (selo verde) zerado para o carimbo da Proteção e das regionais */
.stamp{display:block;gap:0;margin:0;padding:0;background:none;border-radius:0;color:inherit;font-size:inherit;font-weight:inherit}

/* convite final */
.cta-b{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:14px}

/* quebra de linha: sem palavra sozinha na última linha */
main :where(p,li,dd,dt,figcaption,summary,small,blockquote,td,th,span){text-wrap:pretty}
main :where(h1,h2,h3,h4,th,small,.end p,.cf p,.sh .ans,.rv-s,li p,.ben b,.ben p){text-wrap:balance}
.cmp td{text-wrap:balance}
