:root{
  --tinta:#16181A;--apoio:#5A5F63;--linha:#E4E4E0;--suave:#F4F4F1;
  --mesa:#0B4F3C;--coral:#FF5A36;--coral-claro:#FF7A5C;
  --titulo:'Parkinsans',system-ui,sans-serif;--corpo:'Hanken Grotesk',system-ui,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#fff;color:var(--tinta);font:400 17px/1.55 var(--corpo)}
h1,h2,h3{font-family:var(--titulo);font-weight:800;line-height:1.12;letter-spacing:-.02em;margin:0;text-wrap:balance}
h1{font-size:clamp(30px,5vw,46px)}
h2{font-size:clamp(22px,3vw,28px);margin:56px 0 18px}
p{margin:0 0 14px}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
:focus-visible{outline:3px solid var(--coral);outline-offset:2px;border-radius:4px}

.topo{position:sticky;top:0;z-index:10;background:#fff;border-bottom:1px solid var(--linha)}
.topo-in{max-width:1080px;margin:auto;padding:0 20px;display:flex;align-items:center;gap:28px}
.topo-logo{height:21px;flex:none}
.abas{display:flex;gap:22px;overflow-x:auto;scrollbar-width:none}
.abas::-webkit-scrollbar{display:none}
.abas button{padding:17px 0 15px;white-space:nowrap;color:var(--apoio);font-weight:600;border-bottom:3px solid transparent}
.abas button[aria-selected=true]{color:var(--tinta);border-color:var(--coral)}

main{max-width:1080px;margin:auto;padding:0 20px 90px}
.painel{display:none;padding-top:36px}
.painel.ativo{display:block}
.intro{max-width:64ch;color:var(--apoio);margin-top:12px}
.nota{color:var(--apoio);font-size:15px;max-width:72ch;margin-top:18px}

/* resumo */
.hero{background:var(--mesa);color:#fff;border-radius:18px;padding:clamp(34px,7vw,76px) clamp(22px,6vw,72px) 26px}
.logo-anim{display:block;width:min(100%,640px)}
.logo-anim svg{display:block;width:100%;overflow:visible}
.hero-slogan{font:700 clamp(21px,3.4vw,32px)/1.2 var(--titulo);margin:26px 0 10px}
.hero-nota{font-size:14px;opacity:.75;margin:0}
.alerta{margin-top:18px;background:var(--tinta);color:#fff;border-radius:18px;padding:clamp(24px,5vw,44px)}
.alerta h1{font-size:clamp(24px,3.6vw,34px);margin-bottom:12px}
.alerta p{max-width:68ch}
.link-aba{text-decoration:underline;font-weight:600}
.linha{list-style:none;margin:26px 0;padding:0;display:grid;grid-template-columns:repeat(6,1fr);position:relative}
.linha::before{content:"";position:absolute;left:0;right:0;top:6px;height:2px;background:#555}
.linha li{position:relative;padding:22px 12px 0 0;font-size:14px;line-height:1.3}
.linha li::before{content:"";position:absolute;left:0;top:0;width:14px;height:14px;border-radius:50%;background:#fff}
.linha li.voce::before{background:var(--coral)}
.linha b{display:block;font:700 18px var(--titulo);margin-bottom:2px}
.linha span{color:#CFCFCF}
.tres{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:2px solid var(--tinta)}
.rec{text-align:left;padding:18px 22px 22px 0;display:flex;flex-direction:column;gap:6px;color:var(--apoio);font-size:16px}
.rec+.rec{padding-left:22px;border-left:1px solid var(--linha)}
.rec strong{font:800 clamp(21px,2.6vw,26px)/1.15 var(--titulo);color:var(--tinta)}
.rec-t{font-weight:600;font-size:14px}
.rec:hover strong{color:var(--mesa)}
.decidir{margin:0;padding:0 0 0 24px;max-width:66ch}
.decidir li{padding:5px 0}

/* nome */
.tabela{margin-top:28px;border-top:2px solid var(--tinta)}
.linha-t{display:grid;grid-template-columns:230px 1fr;gap:20px;padding:16px 0;border-bottom:1px solid var(--linha)}
.nome-t{font:800 22px/1.2 var(--titulo)}
.linha-t.destaque .nome-t{color:var(--mesa)}
.arquitetura{display:flex;align-items:center;gap:18px;padding:26px 0}
.arquitetura>div{display:flex;flex-direction:column;gap:6px;flex:1 1 0}
.arquitetura img{height:34px;width:auto;align-self:flex-start}
.arquitetura strong{font:800 21px/1.15 var(--titulo)}
.arquitetura span{color:var(--apoio);font-size:15px}
.arquitetura>svg{width:40px;flex:none;color:var(--coral)}
.refs{display:grid;grid-template-columns:repeat(2,1fr);gap:0 36px}
.refs a{display:block;text-decoration:none;padding:13px 0;border-top:1px solid var(--linha)}
.refs b{display:block;font:700 18px var(--titulo)}
.refs a:hover b{color:var(--mesa);text-decoration:underline}
.refs span{color:var(--apoio);font-size:16px}

/* slogan */
.tese{font:700 clamp(21px,3vw,28px)/1.3 var(--titulo);max-width:30em;margin-top:16px}
.cadeia-fig{margin:28px 0 0;background:var(--suave);border-radius:18px;padding:26px clamp(18px,4vw,40px)}
.cadeia-fig svg{display:block;width:100%}
.cadeia-fig figcaption{color:var(--apoio);font-size:16px;margin-top:14px;max-width:70ch}
.slogans{border-top:2px solid var(--tinta)}
.slogan{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:center;padding:20px 0;border-bottom:1px solid var(--linha)}
.slogan p{margin:0;font:800 clamp(24px,3.4vw,34px)/1.12 var(--titulo);letter-spacing:-.02em}
.slogan span{color:var(--apoio)}
.slogan.destaque p{color:var(--mesa)}
.regras{display:grid;grid-template-columns:1fr 2fr;gap:28px}

/* visual */
.seletor{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:24px 0 30px}
.sel{border:2px solid var(--linha);border-radius:14px;padding:18px 16px 12px;text-align:left;display:flex;flex-direction:column;gap:12px;background:#fff}
.sel img{height:clamp(24px,4.4vw,46px);width:auto;max-width:100%;align-self:flex-start;object-fit:contain}
.sel span{font-weight:600;font-size:15px;color:var(--apoio)}
.sel[aria-selected=true]{border-color:var(--tinta)}
.sel[aria-selected=true] span{color:var(--tinta)}

.dir h2{margin-top:0}
.dir-topo{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.campo{border-radius:16px;min-height:230px;display:grid;place-items:center;padding:30px}
.campo img{max-width:78%;max-height:130px}
.ideia{font:700 clamp(21px,3vw,27px)/1.25 var(--dt);max-width:26em;margin:30px 0 20px}
.prosc{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.prosc b{display:block;margin-bottom:4px}
.prosc ul{margin:0;padding-left:18px}
.prosc li{padding:3px 0}
.base{display:grid;grid-template-columns:1.3fr 1fr auto;gap:30px;margin-top:34px;padding-top:22px;border-top:1px solid var(--linha);align-items:start}
.cores{display:flex;flex-wrap:wrap;gap:12px}
.cor{display:flex;flex-direction:column;gap:6px;font-size:13px;line-height:1.25;width:86px}
.cor i{display:block;height:54px;border-radius:10px;border:1px solid rgba(0,0,0,.08)}
.tipo{display:flex;flex-direction:column;gap:2px}
.tipo strong{font-family:var(--dt);font-size:30px;line-height:1.1;font-weight:var(--dp)}
.tipo span{font-family:var(--db)}
.tipo small{color:var(--apoio);font-size:13px;margin-top:6px}
.tam{display:flex;gap:16px;align-items:center}
.tam img{display:block;width:auto}

.ap-grade{display:grid;grid-template-columns:repeat(12,1fr);gap:14px;margin-top:14px}
.ap{container-type:inline-size;border-radius:12px;overflow:hidden;position:relative}
.ap-post{grid-column:span 4;aspect-ratio:4/5}
.ap-fone{grid-column:span 3;background:#fff;border:7px solid #1C1C1C;border-radius:30px}
.ap-col{grid-column:span 5;display:flex;flex-direction:column;gap:14px}
.ap-slide{aspect-ratio:16/9}
.ap-foto{grid-column:span 7}
.ap-foto.m{grid-column:span 5}
.ap-foto img{display:block;width:100%;height:100%;object-fit:cover}
.ap-in{position:absolute;inset:0;padding:7cqw;display:flex;flex-direction:column}
.ap-post .ap-in{background:var(--d-esc);color:#fff}
.ap-post img{height:6.5cqw;width:auto;align-self:flex-start}
.ap-post h3{font-family:var(--dt);font-weight:var(--dp);font-size:11.5cqw;line-height:1.06;letter-spacing:-.02em;margin-top:9cqw}
.ap-post .ch{margin-top:auto;width:100%}
.fone-in{position:absolute;inset:0;padding:10cqw 8cqw 8cqw;display:flex;flex-direction:column}
.ap-fone img{height:7.5cqw;width:auto;align-self:flex-start}
.ap-fone h3{font-family:var(--dt);font-weight:var(--dp);font-size:12.5cqw;line-height:1.06;color:var(--d-tx);letter-spacing:-.02em;margin-top:14cqw}
.ap-fone p{font-size:6.6cqw;line-height:1.35;color:var(--apoio);margin:6cqw 0}
.ap-fone .bt{background:var(--d-ac);color:var(--d-bt);font-weight:700;font-size:6.6cqw;text-align:center;padding:4.5cqw;border-radius:99px}
.ap-fone .ch{margin-top:auto;padding-top:10cqw;width:100%}
.ap-slide .ap-in{background:#fff;border:1px solid var(--linha);border-radius:12px;padding:5.5cqw;color:var(--d-tx)}
.ap-slide img{height:3.6cqw;width:auto;align-self:flex-start}
.ap-slide h3{font-family:var(--dt);font-weight:var(--dp);font-size:6.8cqw;letter-spacing:-.02em;line-height:1.06;margin-top:6cqw;max-width:62%}
.ap-slide .ch{position:absolute;right:4cqw;bottom:4cqw;width:46%}
.ap-slide small{position:absolute;left:5.5cqw;bottom:5cqw;font-size:2.5cqw;color:var(--apoio)}
.perfil-in{background:var(--suave);padding:6cqw;display:flex;gap:5cqw;align-items:center}
.ap-perfil .av{width:26cqw;height:26cqw;border-radius:50%;background:var(--d-esc);display:grid;place-items:center;flex:none;overflow:hidden}
.ap-perfil .av img{height:48%;max-width:64%}
.ap-perfil strong{font:700 4.6cqw var(--corpo);display:block}
.ap-perfil p{margin:1cqw 0 0;font-size:3.9cqw;line-height:1.35;color:var(--apoio)}
.rotulo{font-size:14px;color:var(--apoio);margin:30px 0 0}

/* dominios */
.vence{display:flex;gap:24px;align-items:center;background:#FFF0EB;border-radius:18px;padding:clamp(20px,4vw,32px);margin-top:26px}
.vence h2{margin:0 0 8px}
.vence p{margin:0;max-width:66ch}
.vence-n{flex:none;text-align:center;color:#C93A1B}
.vence-n b{display:block;font:800 66px/1 var(--titulo)}
.dom,.inpi{border-top:2px solid var(--tinta)}
.d{display:grid;grid-template-columns:minmax(0,1.1fr) 160px minmax(0,1.6fr);gap:14px;padding:12px 0;border-bottom:1px solid var(--linha);align-items:baseline}
.d code{font:600 16px var(--corpo);overflow-wrap:anywhere}
.d em,.i em{font-style:normal;font-weight:600;font-size:15px}
.d.ok em{color:var(--mesa)}
.d.nao em{color:var(--apoio)}
.d span,.i span{color:var(--apoio);font-size:16px}
.d.rec-d{background:#EAF3EF;margin:0 -14px;padding-left:14px;padding-right:14px;border-radius:8px}
.i{display:grid;grid-template-columns:minmax(0,1.3fr) 170px minmax(0,2fr);gap:14px;padding:13px 0;border-bottom:1px solid var(--linha);align-items:baseline}
.i.alto em{color:#C93A1B}
.i.medio em{color:#946200}
.i.baixo em{color:var(--mesa)}
.fontes{padding-left:18px;color:var(--apoio);font-size:15px}

@media (max-width:820px){
  body{font-size:16px}
  .topo-logo{display:none}
  .linha{grid-template-columns:1fr;gap:0}
  .linha::before{left:6px;right:auto;top:6px;bottom:6px;width:2px;height:auto}
  .linha li{padding:0 0 14px 28px}
  .linha li::before{top:3px}
  .linha b{display:inline;font-size:16px;margin-right:8px}
  .tres{grid-template-columns:1fr}
  .rec{padding:16px 0;border-bottom:1px solid var(--linha)}
  .rec+.rec{padding-left:0;border-left:0}
  .linha-t{grid-template-columns:1fr;gap:4px}
  .arquitetura{flex-direction:column;align-items:flex-start}
  .arquitetura>svg{transform:rotate(90deg);width:26px}
  .refs{grid-template-columns:1fr}
  .slogan{grid-template-columns:1fr;gap:6px}
  .regras{grid-template-columns:1fr;gap:12px}
  .seletor{gap:8px}
  .sel{padding:12px 10px 10px}
  .sel span{font-size:13px}
  .dir-topo{grid-template-columns:1fr}
  .campo{min-height:170px}
  .prosc{grid-template-columns:1fr;gap:16px}
  .base{grid-template-columns:1fr;gap:22px}
  .ap-post,.ap-col,.ap-foto,.ap-foto.m{grid-column:span 12}
  .ap-fone{grid-column:span 12;max-width:280px;justify-self:center;width:100%;height:540px}
  .d,.i{grid-template-columns:1fr;gap:2px}
  .vence{flex-direction:column;align-items:flex-start}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
