:root{
  --amarelo:#F7C600; --preto:#000000; --azul:#12325B; --azul-claro:#E8EEF6; --tinta:#1E1E1E; --tinta-fraca:#5F6670;
  --papel:#FFFFFF; --fundo:#F5F6F4; --faixa:#DDE1E6; --vermelho:#C8102E; --verde:#0E7C3A; --nota:#FFF4C2;
  box-sizing:border-box; padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){ --tinta:#F0F0F0; --tinta-fraca:#A9B0B8; --papel:#171A1F; --fundo:#101216; --faixa:#2B3037; --azul-claro:#1B2A3F; --nota:#3B3410; }
}
:root[data-theme="dark"]{ --tinta:#F0F0F0; --tinta-fraca:#A9B0B8; --papel:#171A1F; --fundo:#101216; --faixa:#2B3037; --azul-claro:#1B2A3F; --nota:#3B3410; }
html{scroll-padding-top:calc(72px + env(safe-area-inset-top,0px)); scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto} }
*,*::before,*::after{box-sizing:inherit}
[hidden]{display:none !important}
body{margin:0; background:var(--papel); color:var(--tinta); font-family:Barlow,"Helvetica Neue",Arial,sans-serif; font-size:18px; line-height:1.5; -webkit-font-smoothing:antialiased}
button{font:inherit; color:inherit; cursor:pointer; background:none; border:0; padding:0}
img{max-width:100%; height:auto}
h1,h2,h3{font-family:"Barlow Condensed",Barlow,sans-serif; font-weight:700; line-height:1.02; margin:0}
h1{font-size:clamp(44px,7vw,74px); letter-spacing:-.01em}
h2{font-size:clamp(34px,4.5vw,50px); margin-bottom:14px}
h3{font-size:24px; margin-bottom:6px}
p{margin:0 0 14px; max-width:62ch}
.fraca{color:var(--tinta-fraca)}
.mini{font-size:15px}
.wrap{max-width:1120px; margin:0 auto; padding:0 20px}
section{padding:72px 0}
section.cinza{background:var(--fundo)}
.botao{display:inline-block; border:2px solid var(--preto); background:var(--amarelo); color:#000; font-family:"Barlow Condensed",Barlow,sans-serif; font-weight:700; font-size:24px; padding:16px 28px; text-align:center; text-decoration:none; border-radius:8px}
.botao.largo{display:block; width:100%}
.botao.azul{background:var(--azul); color:#fff; border-color:var(--azul)}
.botao.secundario{background:transparent; color:var(--tinta); border-color:var(--tinta)}
.botao:focus-visible,.opcao:focus-visible,a:focus-visible{outline:3px solid var(--amarelo); outline-offset:3px}

.topo{position:sticky; top:0; z-index:10; background:var(--papel); border-bottom:1px solid var(--faixa); padding:calc(12px + env(safe-area-inset-top,0px)) 0 12px}
.topo .wrap{display:flex; align-items:center; gap:14px}
.losango{width:18px; height:18px; background:var(--amarelo); transform:rotate(45deg); border:2px solid #000; box-shadow:0 0 0 2px var(--amarelo); margin:0 8px 0 4px; flex:none}
.marca{font-family:"Barlow Condensed",Barlow,sans-serif; font-weight:700; font-size:24px; flex:1}
.topo nav{display:none; gap:22px; font-weight:500}
.topo nav a{text-decoration:none; color:var(--tinta)}
.topo .botao{font-size:20px; padding:10px 18px}
@media (min-width:860px){ .topo nav{display:flex} }

.hero{padding:56px 0 64px}
.hero .wrap{display:grid; gap:40px}
@media (min-width:900px){ .hero .wrap{grid-template-columns:1.05fr .95fr; align-items:start} }
.hero p.sub{font-size:22px; margin:18px 0 26px}
.selo{display:inline-block; background:var(--azul-claro); color:var(--azul); font-weight:600; font-size:15px; padding:6px 12px; border-radius:20px; margin-bottom:18px}
:root[data-theme="dark"] .selo{color:#BFD3F0}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .selo{color:#BFD3F0} }
.fatos{display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-top:28px}
.fatos div{border-top:3px solid var(--azul); padding-top:8px}
.fatos b{font-family:"Barlow Condensed",Barlow,sans-serif; font-size:34px; font-weight:700; display:block; line-height:1}
.fatos span{font-size:14px; color:var(--tinta-fraca)}
@media (max-width:520px){ .fatos{grid-template-columns:repeat(2,1fr)} }

/* quiz embutido */
.quiz{background:var(--papel); border:2px solid var(--tinta); border-radius:14px; padding:22px; box-shadow:0 12px 30px rgba(0,0,0,.08)}
.quiz .cab{display:flex; justify-content:space-between; align-items:center; font-size:14px; color:var(--tinta-fraca); margin-bottom:8px}
.quiz .tela{display:none} .quiz .tela.ativa{display:block}
.progresso{display:flex; gap:4px; margin:4px 0 14px}
.progresso i{flex:1; height:7px; background:var(--faixa); border-radius:2px}
.progresso i.feita{background:var(--tinta)} .progresso i.atual{background:var(--amarelo); outline:1px solid var(--preto)}
.figura img{width:120px; display:block; margin:0 0 12px}
.enunciado{font-family:"Barlow Condensed",Barlow,sans-serif; font-weight:600; font-size:24px; line-height:1.15; margin:0 0 14px}
.opcoes{display:grid; gap:8px; margin:0 0 12px}
.opcao{text-align:left; width:100%; background:transparent; border:2px solid var(--tinta); border-radius:8px; padding:11px 14px; line-height:1.35; font-size:16px}
.opcao[disabled]{cursor:default; opacity:.55}
.opcao.certa{background:var(--verde); border-color:var(--verde); color:#fff; opacity:1}
.opcao.errada{background:var(--vermelho); border-color:var(--vermelho); color:#fff; opacity:1}
.comentario{background:var(--nota); border-left:4px solid var(--amarelo); padding:10px 12px; margin:0 0 12px; border-radius:0 6px 6px 0; font-size:16px}
.comentario b{display:block; font-family:"Barlow Condensed",Barlow,sans-serif; font-size:19px; margin-bottom:2px}
.resultado-num{font-family:"Barlow Condensed",Barlow,sans-serif; font-weight:700; font-size:96px; line-height:.9; letter-spacing:-.02em}
.resultado-num small{font-size:28px; font-weight:600; margin-left:6px}
.veredito{font-family:"Barlow Condensed",Barlow,sans-serif; font-weight:700; font-size:28px; margin:8px 0 12px}
.veredito.reprova{color:var(--vermelho)} .veredito.aprova{color:var(--verde)}
.regua{display:grid; grid-template-columns:repeat(30,1fr); gap:3px; margin:6px 0 4px}
.regua i{height:22px; background:var(--faixa); border-radius:2px}
.regua i.cheio.fraco{background:var(--vermelho)} .regua i.cheio.forte{background:var(--verde)}
.corte{position:relative; height:20px; font-size:13px; color:var(--tinta-fraca); margin-bottom:12px}
.corte span{position:absolute; left:calc(20 / 30 * 100% - 1px); transform:translateX(-100%); padding-right:6px; border-right:3px solid var(--tinta); line-height:20px; white-space:nowrap}
.modulos{list-style:none; padding:0; margin:0 0 16px}
.modulos li{display:flex; justify-content:space-between; gap:12px; padding:7px 0; border-bottom:1px solid var(--faixa); font-size:16px}
.modulos li.ruim span{color:var(--vermelho); font-weight:600}

/* blocos de recursos */
.recursos{display:grid; gap:18px}
@media (min-width:700px){ .recursos{grid-template-columns:repeat(3,1fr)} }
.recurso{background:var(--papel); border:1px solid var(--faixa); border-radius:12px; padding:22px}
section.cinza .recurso{border-color:transparent}
.recurso svg{width:36px; height:36px; display:block; margin-bottom:12px; color:var(--azul)}
.recurso p{font-size:16px; margin:0}
.passos{display:grid; gap:18px; counter-reset:p}
@media (min-width:700px){ .passos{grid-template-columns:repeat(3,1fr)} }
.passo{position:relative; padding-top:64px}
.passo::before{counter-increment:p; content:counter(p); position:absolute; top:0; left:0; width:48px; height:48px; border-radius:50%; background:var(--amarelo); border:2px solid #000; color:#000; font-family:"Barlow Condensed",Barlow,sans-serif; font-weight:700; font-size:26px; display:flex; align-items:center; justify-content:center}
.passo p{font-size:16px}

table{width:100%; border-collapse:collapse; font-size:16px}
th,td{padding:12px 10px; border-bottom:1px solid var(--faixa); text-align:left; vertical-align:top}
th{font-family:"Barlow Condensed",Barlow,sans-serif; font-size:20px; font-weight:700}
td.sim{color:var(--verde); font-weight:600} td.nao{color:var(--tinta-fraca)}
.tabela-scroll{overflow-x:auto}

.preco-box{border:2px solid var(--tinta); border-radius:14px; padding:28px; display:grid; gap:22px}
@media (min-width:800px){ .preco-box{grid-template-columns:1.2fr .8fr; align-items:center} }
.preco{font-family:"Barlow Condensed",Barlow,sans-serif; font-weight:700; font-size:72px; line-height:.9}
.preco small{font-size:20px; font-weight:400; font-family:Barlow,sans-serif; color:var(--tinta-fraca); display:block; margin-top:8px}
.preco-box ul{padding-left:20px; margin:0 0 6px; font-size:16px}
.preco-box li{margin-bottom:6px}
.garantia{display:flex; gap:16px; align-items:flex-start; background:var(--nota); border-radius:12px; padding:18px 20px; margin-top:22px}
.garantia svg{flex:none; width:40px; height:40px}
.garantia p{margin:0; font-size:16px}

.faq details{border-top:1px solid var(--faixa); padding:14px 0}
.faq details:last-child{border-bottom:1px solid var(--faixa)}
.faq summary{cursor:pointer; font-family:"Barlow Condensed",Barlow,sans-serif; font-size:22px; font-weight:600}
.faq p{margin:10px 0 0; font-size:16px}
footer{padding:36px 0 60px; border-top:1px solid var(--faixa); font-size:14px; color:var(--tinta-fraca)}
footer p{max-width:none}

/* páginas de conteúdo */
.artigo{max-width:760px}
.artigo h1{font-size:clamp(36px,5.5vw,56px); margin-bottom:16px}
.artigo p{font-size:19px}
.artigo .resposta{background:var(--fundo); border-left:4px solid var(--amarelo); padding:18px 20px; border-radius:0 10px 10px 0; margin:18px 0 26px}
.relacionadas{list-style:none; padding:0; margin:0; columns:2; column-gap:24px; font-size:16px}
.relacionadas li{break-inside:avoid; padding:6px 0; border-bottom:1px solid var(--faixa)}
.relacionadas a{text-decoration:none; color:var(--tinta)}
.relacionadas a:hover{text-decoration:underline}
@media (max-width:640px){ .relacionadas{columns:1} }
.ufs{display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:8px; font-size:15px}
.ufs a{display:block; padding:10px 12px; background:var(--fundo); border-radius:8px; text-decoration:none; color:var(--tinta)}
.quiz-fixo{margin:34px 0}