/* ================= TOKENS =================
     Derivados do Manual da Marca v1.0. Contraste conferido:
     #996922 sobre areia = 4,50:1 (texto pequeno OK)
     #BE832D sobre areia = 3,06:1 (só título ≥18pt e fios)
     #EDD08A sobre navy  = uso exclusivo em fundo escuro
     Regra dos 3%: ouro é acento, nunca massa.
  ================================================ */
  :root{
    --navy:#0D2137;
    --areia:#FAF8F5;
    --grafite:#2E3944;
    --cinza:#677381;
    --ouro-texto:#996922;
    --ouro-fio:#BE832D;
    --champanhe:#EDD08A;

    --ground:var(--areia);
    --surface:#FFFFFF;
    --surface-2:#F4F0E9;
    --ink:var(--grafite);
    --ink-strong:var(--navy);
    --muted:var(--cinza);
    --rule:#E4DDD2;
    --rule-strong:#CFC0A6;
    --accent:var(--ouro-texto);
    --accent-line:var(--ouro-fio);
    --focus:#7A5218;

    --fio-ouro:linear-gradient(90deg,#C2862E 0%,#E3BE7B 26%,#F4E7D7 46%,#D9AC5E 68%,#C2862E 100%);
    --tipo-ui:Poppins,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    --tipo-leitura:Lora,Georgia,"Times New Roman",serif;
    --medida:66ch;
  }
  @media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]){
      --ground:#0A1726; --surface:#0E1F32; --surface-2:#13273D;
      --ink:#D9D5CE; --ink-strong:#F3EFE8; --muted:#96A5B6;
      --rule:#1D3149; --rule-strong:#33506D;
      --accent:var(--champanhe); --accent-line:#C2862E; --focus:var(--champanhe);
    }
  }
  :root[data-theme="dark"]{
    --ground:#0A1726; --surface:#0E1F32; --surface-2:#13273D;
    --ink:#D9D5CE; --ink-strong:#F3EFE8; --muted:#96A5B6;
    --rule:#1D3149; --rule-strong:#33506D;
    --accent:var(--champanhe); --accent-line:#C2862E; --focus:var(--champanhe);
  }

  *{box-sizing:border-box}
  ::selection{background:#EDD08A; color:#0D2137}
  :root[data-theme="dark"] ::selection{background:#BE832D; color:#0A1726}
  html{scroll-behavior:smooth}
  @media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto}
    *,*::before,*::after{animation-duration:.01ms!important; transition-duration:.01ms!important}
  }
  body{
    margin:0; background:var(--ground); color:var(--ink);
    font-family:var(--tipo-leitura); font-size:1.0625rem; line-height:1.7;
    -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
    font-kerning:normal; font-variant-ligatures:common-ligatures;
  }
  .wrap{max-width:73rem; margin:0 auto; padding:0 1.75rem}

  /* foco visível — WCAG 2.4.7 e 2.4.13 */
  a:focus-visible,button:focus-visible,input:focus-visible,
  select:focus-visible,textarea:focus-visible,summary:focus-visible{
    outline:3px solid var(--focus); outline-offset:3px; border-radius:2px;
  }
  .pular{
    position:absolute; left:-9999px; top:0; z-index:100;
    background:var(--champanhe); color:var(--navy); font-weight:500; padding:.75rem 1.25rem;
    font-family:var(--tipo-ui); font-size:.875rem; text-decoration:none;
  }
  .pular:focus{left:1rem; top:1rem}

  /* ================= CABEÇALHO =================
     Faixa navy nos dois temas, com a assinatura horizontal negativa
     do kit. Contraste medido sobre #0D2137: #C6D2DE 10,6:1 ·
     champanhe 10,85:1 · #F3EFE8 14,2:1. */
  .topo{background:var(--navy); border-bottom:0; position:relative; z-index:50}
  .topo::after{content:""; position:absolute; left:0; right:0; bottom:0; height:3px; background:var(--fio-ouro)}
  .topo-in{
    display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;
    gap:1rem 2.5rem; padding:1.5rem 0;
  }
  .marca{display:inline-flex; align-items:center; text-decoration:none; min-height:2.75rem}
  .marca img{height:3.25rem; width:auto; display:block}

  /* Cabeçalho fixo — só onde ele cabe em uma linha.
     Abaixo disso o menu precisa de botão, que é escopo do desenvolvedor. */
  @media(min-width:62rem){
    .topo{position:sticky; top:0}
    .topo-in{transition:padding .28s ease}
    .marca img{transition:height .28s ease}
    .topo.compacto{box-shadow:0 8px 24px -14px rgba(0,0,0,.7)}
    .topo.compacto .topo-in{padding:.625rem 0}
    .topo.compacto .marca img{height:2.25rem}
    section{scroll-margin-top:5.5rem}
    :target{scroll-margin-top:5.5rem}
  }
  @media(min-width:62rem) and (prefers-reduced-motion: reduce){
    .topo-in,.marca img{transition:none}
  }
  nav.principal ul{
    list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:.25rem 1.375rem;
  }
  nav.principal a{
    font-family:var(--tipo-ui); font-size:.8125rem; font-weight:400; letter-spacing:.015em;
    color:#C6D2DE; text-decoration:none; padding:.625rem .125rem;
    display:inline-block; min-height:2.75rem; line-height:1.5rem;
    border-bottom:2px solid transparent;
  }
  nav.principal a:hover{color:var(--champanhe); border-bottom-color:var(--champanhe)}
  .topo a:focus-visible{outline-color:var(--champanhe)}

  .nav-contato{
    border:1px solid rgba(237,208,138,.45); border-radius:2px;
    padding:.5rem 1.125rem!important; color:#F3EFE8!important;
  }
  .nav-contato:hover{
    border-color:var(--champanhe)!important; color:var(--champanhe)!important;
    background:rgba(237,208,138,.08);
  }

  /* ---- menu suspenso Áreas ---- */
  .tem-menu{position:relative}
  .nav-areas{
    font-family:var(--tipo-ui); font-size:.8125rem; font-weight:400; letter-spacing:.015em;
    color:#C6D2DE; background:none; border:0; border-bottom:2px solid transparent;
    padding:.625rem .125rem; min-height:2.75rem; line-height:1.5rem;
    display:inline-flex; align-items:center; gap:.375rem; cursor:pointer;
  }
  .nav-areas:hover{color:var(--champanhe); border-bottom-color:var(--champanhe)}
  .nav-areas .cv{width:.75rem; height:.75rem; transition:transform .2s ease}
  .nav-areas[aria-expanded="true"]{color:var(--champanhe); border-bottom-color:var(--champanhe)}
  .nav-areas[aria-expanded="true"] .cv{transform:rotate(180deg)}
  .topo button:focus-visible{outline:3px solid var(--champanhe); outline-offset:3px}
  nav.principal ul.submenu{display:block; flex-wrap:nowrap; gap:0}
  nav.principal ul.submenu[hidden]{display:none}
  .submenu{
    position:absolute; top:calc(100% + .25rem); left:-.875rem; z-index:60;
    min-width:18rem; background:#12283F; border:1px solid #1D3149;
    padding:.375rem 0; margin:0; list-style:none;
    box-shadow:0 16px 36px -18px rgba(0,0,0,.8);
  }
  .submenu::before{content:""; position:absolute; left:-1px; right:-1px; top:-1px;
    height:2px; background:var(--fio-ouro)}
  .submenu li{display:block}
  .submenu a{
    display:block; padding:.6875rem 1.125rem; border-bottom:0;
    font-size:.8125rem; color:#C6D2DE; min-height:2.75rem; line-height:1.375rem;
  }
  .submenu a:hover{background:rgba(237,208,138,.09); color:var(--champanhe); border-bottom-color:transparent}
  .submenu .todas{border-bottom:1px solid #1D3149; margin-bottom:.25rem; padding-bottom:.25rem}
  .submenu .todas a{color:var(--champanhe); font-weight:500}
  @media(max-width:61.99rem){
    .submenu{position:static; min-width:0; box-shadow:none; border:0;
      background:transparent; padding:.125rem 0 .5rem .875rem}
    .submenu::before{display:none}
    .submenu a{padding:.5rem 0}
    .submenu .todas{border-bottom:0; padding-bottom:0}
  }
  @media (prefers-reduced-motion: reduce){.nav-areas .cv{transition:none}}

  .nav-restrito{
    display:inline-flex!important; align-items:center; gap:.4375rem;
    color:#8FA2B6!important; font-size:.75rem!important; letter-spacing:.02em;
  }
  .nav-restrito .ic{width:.875rem; height:.875rem; color:#8FA2B6}
  .nav-restrito:hover{color:var(--champanhe)!important; border-bottom-color:transparent!important}
  .nav-restrito:hover .ic{color:var(--champanhe)}

  /* ================= TIPOGRAFIA ================= */
  h1,h2,h3{font-family:var(--tipo-ui); color:var(--ink-strong); text-wrap:balance; margin:0}
  h1{font-weight:300; font-size:clamp(2rem,4.6vw,3.125rem); line-height:1.1; letter-spacing:-.022em}
  h1 .virada{display:block; color:var(--ink-strong)}
  h1 .premissa{display:block; color:var(--muted)}
  h2{font-weight:400; font-size:clamp(1.5rem,3.2vw,2rem); line-height:1.18; letter-spacing:-.018em}
  h3{font-weight:500; font-size:1.125rem; line-height:1.35; letter-spacing:-.005em}
  p{margin:0 0 1rem; max-width:var(--medida)}
  .fio{height:3px; width:5.5rem; background:var(--fio-ouro); border:0; margin:0}
  .rotulo{
    font-family:var(--tipo-ui); font-weight:500; font-size:.6875rem;
    letter-spacing:.19em; text-transform:uppercase; color:var(--accent); margin:0 0 1.25rem;
  }

  section{padding:4.5rem 0; scroll-margin-top:1.5rem}
  section + section{border-top:1px solid var(--rule)}

  /* ================= ABERTURA ================= */
  .abertura{padding:6rem 0 5rem}
  .lead{
    font-family:var(--tipo-ui); font-weight:300; font-size:clamp(1.0625rem,1.9vw,1.1875rem);
    line-height:1.55; color:var(--ink-strong); max-width:46ch; margin:1.75rem 0 0;
  }
  .escopo{
    font-family:var(--tipo-leitura); font-style:italic;
    font-size:clamp(1.0625rem,1.9vw,1.1875rem); line-height:1.5;
    color:var(--ink-strong); max-width:46ch; margin:2.25rem 0 0;
  }
  .abertura .corpo{margin-top:2.25rem; max-width:var(--medida)}
  .abertura .corpo p:last-child{margin-bottom:0}

  /* ================= PORTAS ================= */
  .portas{display:grid; gap:1px; background:var(--rule); border:1px solid var(--rule); margin-top:2.5rem}
  @media(min-width:44rem){.portas{grid-template-columns:1fr 1fr}}
  .porta{background:var(--surface); padding:1.75rem 1.875rem; display:flex; flex-direction:column}
  .porta h3{margin-bottom:.5rem}
  .porta p{font-size:.9375rem; color:var(--ink); margin-bottom:1.125rem; flex:1}
  .porta a{
    font-family:var(--tipo-ui); font-size:.8125rem; font-weight:500; letter-spacing:.02em;
    color:var(--accent); text-decoration:none; align-self:flex-start;
    min-height:2.75rem; display:inline-flex; align-items:center;
    border-bottom:1px solid transparent;
  }
  .porta a:hover{border-bottom-color:var(--accent-line)}
  .porta a::after{content:" →"; white-space:pre}

  /* ================= ÍCONES DO KIT ================= */
  .ic{width:1.75rem; height:1.75rem; display:block; color:var(--ink-strong); flex:none}
  .porta .ic{margin-bottom:1rem; color:var(--accent-line)}
  .porta:hover .ic{color:var(--accent)}
  .ic-linha{display:inline-flex; align-items:center; gap:.625rem}
  .ic-linha .ic{width:1.125rem; height:1.125rem; color:var(--accent-line)}

  /* ================= COMPLEXIDADE ================= */
  .citacao{
    position:relative; font-family:var(--tipo-leitura); font-style:italic;
    font-size:clamp(1.3rem,2.7vw,1.75rem); line-height:1.4; color:var(--ink-strong);
    padding-left:3.25rem; margin:2.75rem 0 1rem; max-width:44ch;
    hanging-punctuation:first; text-wrap:balance;
  }
  .citacao::before{
    content:"\201C"; position:absolute; left:0; top:-.35em;
    font-family:var(--tipo-leitura); font-size:3.75rem; line-height:1;
    color:var(--accent-line); opacity:.5;
  }
  .citacao-fonte{
    font-family:var(--tipo-ui); font-size:.75rem; letter-spacing:.08em; color:var(--muted);
    padding-left:3.25rem; margin:0 0 2.25rem; text-transform:uppercase;
  }
  .sinais{
    list-style:none; margin:2.25rem 0 0; padding:0;
    display:grid; gap:1px; background:var(--rule); border:1px solid var(--rule);
  }
  .sinais li{
    position:relative; background:var(--surface);
    padding:1.375rem 1.5rem 1.375rem 2.875rem;
    font-family:var(--tipo-ui); font-size:.9375rem; font-weight:300; line-height:1.6;
    color:var(--ink);
  }
  /* No celular a grade vira carrossel: doze cartões empilhados são
     doze telas de rolagem. No desktop a grade fica, porque a força
     desta lista está em ver o conjunto de uma vez. */
  @media(max-width:43.99rem){
    .sinais{
      display:flex; overflow-x:auto; scroll-snap-type:x mandatory; scroll-behavior:smooth;
      scrollbar-width:thin;
    }
    .sinais li{flex:0 0 min(19rem,82%); scroll-snap-align:start}
    .sinais:focus-visible{outline:3px solid var(--focus); outline-offset:3px}
    .desliza{
      display:block; font-family:var(--tipo-ui); font-size:.75rem; color:var(--muted);
      margin:.75rem 0 0;
    }
  }
  @media(prefers-reduced-motion: reduce){.sinais{scroll-behavior:auto}}
  .desliza{display:none}
  @media(min-width:44rem){.sinais{grid-template-columns:1fr 1fr}}
  @media(min-width:68rem){.sinais{grid-template-columns:repeat(3,1fr)}}
  .sinais li::before{
    content:""; position:absolute; left:1.5rem; top:1.875rem;
    width:.5rem; height:.5rem; border:1px solid var(--accent-line); transform:rotate(45deg);
  }
  .sinais li b{color:var(--ink-strong); font-weight:500}
  .grupo{
    font-family:var(--tipo-ui); font-weight:500; font-size:.6875rem;
    letter-spacing:.19em; text-transform:uppercase; color:var(--accent);
    margin:2.5rem 0 0;
  }
  .grupo + .sinais{margin-top:1rem}
  .fecho-forte{
    font-family:var(--tipo-ui); font-weight:300; font-size:clamp(1.0625rem,2vw,1.25rem);
    line-height:1.45; color:var(--ink-strong); max-width:46ch; margin:2.25rem 0 0;
  }

  /* ================= MANIFESTO ================= */
  .manifesto{background:var(--navy); color:#D9D5CE; position:relative; overflow:hidden;
    padding:5.5rem 0; border-top:none}
  .manifesto .moldura-bg{display:none}
  .manifesto > .wrap{position:relative; z-index:1}
  .manifesto::after{
    content:""; position:absolute; z-index:0; right:6%; top:50%; transform:translateY(-50%);
    width:min(21rem,28%); aspect-ratio:1; pointer-events:none; opacity:.07;
    background:url(../img/simbolo-branco-cheio.svg) center/contain no-repeat;
  }
  @media(max-width:56rem){.manifesto::after{display:none}}
  .manifesto .rotulo{color:var(--champanhe)}
  .manifesto h2{
    color:#F3EFE8; font-weight:300; font-size:clamp(1.75rem,4vw,2.625rem);
    line-height:1.14; letter-spacing:-.022em; max-width:22ch;
  }
  .manifesto .fio{background:var(--fio-ouro); margin:1.5rem 0 2rem}
  .manifesto .enumeracao{
    font-family:var(--tipo-leitura); font-size:clamp(1.0625rem,1.9vw,1.1875rem);
    line-height:1.75; color:#C6D2DE; max-width:56ch; margin:0 0 2rem;
  }
  .manifesto .virada{
    font-family:var(--tipo-ui); font-weight:300;
    font-size:clamp(1.125rem,2.1vw,1.375rem); line-height:1.42;
    color:#F3EFE8; max-width:40ch; margin:0 0 2.25rem;
    border-left:2px solid var(--champanhe); padding-left:1.5rem;
  }
  .manifesto .acao{color:var(--champanhe); border-bottom-color:var(--champanhe)}
  .manifesto .acao:hover{color:#F3EFE8; border-bottom-color:#F3EFE8}
  .manifesto a:focus-visible{outline-color:var(--champanhe)}

  /* ================= MÉTODO ================= */
  .metodo{background:var(--navy); color:#D9D5CE; border-top:none}
  .metodo h2{color:#F3EFE8}
  .metodo .rotulo{color:var(--champanhe)}
  .metodo .fio{background:var(--fio-ouro)}
  .metodo strong{color:var(--champanhe); font-weight:500}
  .metodo a{color:var(--champanhe)}
  .metodo .tese{
    font-family:var(--tipo-leitura); font-style:italic; font-size:1.25rem; line-height:1.5;
    color:#F3EFE8; border-left:2px solid var(--champanhe); padding-left:1.5rem;
    margin:1.75rem 0; max-width:52ch;
  }
  .metodo .simb{position:absolute; right:0; top:0; opacity:.07; width:22rem; pointer-events:none}
  .metodo-in{position:relative; overflow:hidden}

  /* ================= FATOS ================= */
  .fatos dl{margin:2rem 0 0; display:grid; gap:1.5rem 3rem}
  @media(min-width:44rem){.fatos dl{grid-template-columns:repeat(3,1fr)}}
  .fatos dt{
    font-family:var(--tipo-ui); font-size:.6875rem; letter-spacing:.15em; text-transform:uppercase;
    color:var(--muted); font-weight:500; margin-bottom:.375rem;
  }
  .fatos dd{margin:0; font-size:.9375rem; font-family:var(--tipo-ui); font-weight:300; color:var(--ink)}
  .fatos dd b{color:var(--ink-strong); font-weight:500}

  /* ================= JORNADA ================= */
  .jornada{counter-reset:passo; list-style:none; margin:2.25rem 0 0; padding:0;
    display:grid; gap:1px; background:var(--rule); border:1px solid var(--rule)}
  @media(min-width:56rem){.jornada{grid-template-columns:repeat(4,1fr)}}
  .jornada li{background:var(--surface); padding:1.5rem 1.5rem 1.625rem; counter-increment:passo}
  .jornada li::before{
    content:counter(passo,decimal-leading-zero);
    font-family:var(--tipo-ui); font-weight:300; font-size:1.5rem; color:var(--rule-strong);
    display:block; margin-bottom:.625rem; font-variant-numeric:tabular-nums;
  }
  .jornada h3{font-size:.9375rem; margin-bottom:.375rem}
  .jornada p{font-size:.875rem; margin:0; color:var(--muted)}

  /* ================= ARTIGOS ================= */
  .artigos-lista{list-style:none; margin:2.25rem 0 0; padding:0;
    display:grid; gap:1px; background:var(--rule); border:1px solid var(--rule)}
  @media(min-width:44rem){.artigos-lista{grid-template-columns:1fr 1fr}}
  @media(min-width:64rem){.artigos-lista{grid-template-columns:repeat(3,1fr)}}
  .artigos-lista li{background:var(--surface)}
  .artigos-lista a{
    display:block; padding:1.375rem 1.5rem; text-decoration:none; height:100%;
    border-left:2px solid transparent;
  }
  .artigos-lista a:hover{border-left-color:var(--accent-line); background:var(--surface-2)}
  .artigos-lista .area{
    font-family:var(--tipo-ui); font-size:.625rem; letter-spacing:.14em; text-transform:uppercase;
    color:var(--accent); font-weight:500; display:block; margin-bottom:.5rem;
  }
  .artigos-lista .tit{
    font-family:var(--tipo-leitura); font-size:1rem; line-height:1.4; color:var(--ink-strong);
    display:block; margin-bottom:.5rem;
  }
  .artigos-lista .dur{font-family:var(--tipo-ui); font-size:.75rem; color:var(--muted)}

  /* ================= CONTATO ================= */
  .contato-grid{display:grid; gap:3rem; margin-top:2.5rem}
  @media(min-width:56rem){.contato-grid{grid-template-columns:1fr 1.15fr}}
  address{font-style:normal; font-family:var(--tipo-ui); font-size:.9375rem; font-weight:300}
  address .unidade{margin-bottom:1.5rem}
  address b{
    display:flex; font-family:var(--tipo-ui); font-weight:500; font-size:.6875rem;
    letter-spacing:.15em; text-transform:uppercase; color:var(--accent); margin-bottom:.375rem;
  }
  address a{color:var(--ink); text-decoration:none; border-bottom:1px solid var(--rule-strong);
    display:inline-block; padding:.25rem 0; min-height:2.75rem; line-height:2.25rem}
  address a:hover{color:var(--ink-strong); border-bottom-color:var(--accent-line)}

  form{display:grid; gap:1.125rem}
  .campo{display:grid; gap:.375rem}
  .campo label,legend{
    font-family:var(--tipo-ui); font-size:.8125rem; font-weight:500; color:var(--ink-strong);
  }
  .dica{font-family:var(--tipo-ui); font-size:.75rem; color:var(--muted); font-weight:300}
  input[type=text],input[type=email],select,textarea{
    font-family:var(--tipo-ui); font-size:.9375rem; font-weight:300; color:var(--ink);
    background:var(--surface); border:1px solid var(--rule-strong); border-radius:2px;
    padding:.75rem .875rem; width:100%; min-height:2.75rem;
  }
  textarea{min-height:7rem; resize:vertical}
  fieldset{border:1px solid var(--rule); border-radius:2px; padding:1rem 1.125rem; margin:0}
  .radios{display:flex; flex-wrap:wrap; gap:.5rem 1.5rem; margin-top:.625rem}
  .radios span{display:inline-flex; align-items:center; gap:.5rem;
    font-family:var(--tipo-ui); font-size:.875rem; font-weight:300; min-height:2.75rem}
  input[type=radio],input[type=checkbox]{width:1.125rem; height:1.125rem; accent-color:var(--ouro-fio)}
  .consent{display:flex; gap:.75rem; align-items:flex-start;
    font-family:var(--tipo-ui); font-size:.8125rem; font-weight:300; line-height:1.5}
  .consent input{margin-top:.2rem; flex:none}
  button[type=submit]{
    font-family:var(--tipo-ui); font-size:.9375rem; font-weight:500; letter-spacing:.01em;
    background:var(--navy); color:#FAF8F5; border:2px solid var(--navy); border-radius:2px;
    padding:.875rem 1.75rem; min-height:2.75rem; cursor:pointer; justify-self:start;
  }
  button[type=submit]:hover{background:transparent; color:var(--ink-strong)}
  :root[data-theme="dark"] button[type=submit],
  :root:not([data-theme="light"]) button[type=submit]{}
  @media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]) button[type=submit]{
      background:var(--champanhe); color:var(--navy); border-color:var(--champanhe);
    }
    :root:not([data-theme="light"]) button[type=submit]:hover{background:transparent; color:var(--champanhe)}
  }
  :root[data-theme="dark"] button[type=submit]{
    background:var(--champanhe); color:var(--navy); border-color:var(--champanhe);
  }
  :root[data-theme="dark"] button[type=submit]:hover{background:transparent; color:var(--champanhe)}

  /* ================= REVISTA ================= */
  .revista-band{background:var(--surface-2); border-top:1px solid var(--rule);
    border-bottom:1px solid var(--rule); padding:4rem 0}
  .revista-in{display:grid; gap:2.5rem; align-items:center}
  @media(min-width:56rem){.revista-in{grid-template-columns:16rem 1fr; gap:4rem}}
  .revista-band .fio{margin:14px 0 22px}
  .rev-capa{margin:0; position:relative; max-width:16rem}
  .rev-capa img{width:100%; height:auto; display:block;
    box-shadow:0 20px 40px -22px rgba(13,33,55,.55)}
  .rev-capa::after{content:""; position:absolute; left:0; right:0; bottom:0; height:3px;
    background:var(--fio-ouro)}

  /* ================= RODAPÉ ================= */
  footer{background:var(--navy); color:#9FB0C2; padding:3.5rem 0 2.5rem; position:relative}
  footer::before{content:""; position:absolute; left:0; right:0; top:0; height:3px; background:var(--fio-ouro)}
  footer .sig{width:9rem; height:auto; display:block; margin-bottom:2rem}
  .rodape-grid{display:grid; gap:2rem 3rem}
  @media(min-width:44rem){.rodape-grid{grid-template-columns:auto 1fr auto; align-items:start}}
  footer nav ul{list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:.25rem 1.5rem}
  footer a{color:#C6D2DE; font-family:var(--tipo-ui); font-size:.8125rem; text-decoration:none;
    display:inline-block; padding:.5rem 0; min-height:2.75rem; line-height:1.75rem}
  footer a:hover{color:var(--champanhe)}
  footer a:focus-visible{outline-color:var(--champanhe)}
  .rod-restrito{display:inline-flex; align-items:center; gap:.4375rem}
  .rod-restrito .ic{width:.875rem; height:.875rem}
  .a11y-selo{display:inline-flex; align-items:center; gap:.625rem;
    font-family:var(--tipo-ui); font-size:.8125rem; color:#C6D2DE; text-decoration:none}
  .a11y-selo svg{width:1.75rem; height:1.75rem; flex:none}
  .legal{
    border-top:1px solid #1D3149; margin-top:2.5rem; padding-top:1.5rem;
    font-family:var(--tipo-ui); font-size:.75rem; font-weight:300; line-height:1.8; color:#8B9CAE;
  }
  .legal b{color:#C6D2DE; font-weight:500}

  /* ================= REVELAÇÃO SUAVE ================= */
  .reveal{opacity:0; transform:translateY(12px)}
  .reveal.vis{opacity:1; transform:none;
    transition:opacity .65s cubic-bezier(.22,.61,.36,1), transform .65s cubic-bezier(.22,.61,.36,1)}
  .reveal.d1.vis{transition-delay:.08s} .reveal.d2.vis{transition-delay:.16s}
  .reveal.d3.vis{transition-delay:.24s} .reveal.d4.vis{transition-delay:.32s}
  .fio.reveal{transform:scaleX(0); transform-origin:left}
  .fio.reveal.vis{transform:scaleX(1); transition:transform .7s cubic-bezier(.22,.61,.36,1)}
  @media (prefers-reduced-motion: reduce){
    .reveal,.fio.reveal{opacity:1!important; transform:none!important; transition:none!important}
  }

  /* ================= HERO EM DUAS COLUNAS ================= */
  .hero{display:grid; gap:3rem; align-items:center}
  @media(min-width:62rem){.hero{grid-template-columns:1.05fr .85fr; gap:4.5rem}}
  .acoes{display:flex; flex-wrap:wrap; gap:.5rem 2rem; margin-top:2.5rem}
  .acao{
    font-family:var(--tipo-ui); font-size:.875rem; font-weight:500; letter-spacing:.01em;
    color:var(--accent); text-decoration:none; display:inline-flex; align-items:center;
    min-height:2.75rem; border-bottom:1px solid var(--accent-line);
  }
  .acao::after{content:" →"; white-space:pre}
  .acao:hover{color:var(--ink-strong); border-bottom-color:var(--ink-strong)}
  .acao.secundaria{color:var(--muted); border-bottom-color:var(--rule-strong)}
  .acao.secundaria:hover{color:var(--ink-strong)}

  /* vaga de fotografia — espera o ensaio */
  .foto{
    position:relative; background:var(--navy); overflow:hidden;
    display:flex; flex-direction:column; justify-content:flex-end;
    aspect-ratio:4/5; padding:1.5rem;
  }
  .foto.paisagem{aspect-ratio:3/2}
  .foto .marca-dagua{
    position:absolute; inset:0; display:grid; place-items:center; opacity:.09; pointer-events:none;
  }
  .foto .marca-dagua img{width:58%; height:auto}
  .foto .moldura{
    position:absolute; inset:1.25rem; width:calc(100% - 2.5rem); height:calc(100% - 2.5rem);
    opacity:.22; pointer-events:none;
  }
  .foto.retrato{padding:0; background:var(--navy)}
  .foto.retrato img{
    position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
    object-position:50% 22%; display:block;
  }
  .foto.retrato::after{
    content:""; position:absolute; left:0; right:0; bottom:0; height:3px;
    background:var(--fio-ouro); z-index:2;
  }
  .foto .spec{
    position:relative; z-index:2; font-family:var(--tipo-ui); font-size:.75rem; line-height:1.55;
    color:#9FB0C2; background:var(--navy); border-left:2px solid var(--champanhe);
    padding:.625rem .875rem .625rem .875rem; max-width:30ch;
  }
  .foto .spec b{
    display:block; color:var(--champanhe); font-weight:500; font-size:.625rem;
    letter-spacing:.16em; text-transform:uppercase; margin-bottom:.375rem;
  }

  /* ================= RETRATOS NA SEÇÃO INSTITUCIONAL ================= */
  .institucional{display:grid; gap:3rem}
  @media(min-width:62rem){.institucional{grid-template-columns:.8fr 1.2fr; gap:4rem; align-items:start}}
  .retratos{display:grid; gap:1rem}
  .credito{font-family:var(--tipo-ui); font-weight:300; font-size:.75rem; line-height:1.6;
    color:var(--muted); margin:.875rem 0 0; border-left:2px solid var(--rule-strong); padding-left:.875rem}
  .credito b{color:var(--ink-strong); font-weight:500}
  .retratos .foto{aspect-ratio:4/5}
  .retratos .foto.equipe{aspect-ratio:3/2}

  /* ================= CARROSSEL DE ARTIGOS ================= */
  .destaque{
    display:grid; gap:0; border:1px solid var(--rule); background:var(--surface); margin-top:2.5rem;
  }
  @media(min-width:56rem){.destaque{grid-template-columns:1.1fr 1fr}}
  .destaque .txt{padding:2.25rem 2.25rem 2rem; display:flex; flex-direction:column; justify-content:center}
  .destaque .area{
    font-family:var(--tipo-ui); font-size:.625rem; letter-spacing:.14em; text-transform:uppercase;
    color:var(--accent); font-weight:500; margin:0 0 .75rem;
  }
  .destaque h3{font-size:1.5rem; font-weight:400; line-height:1.22; margin-bottom:.875rem}
  .destaque p{font-size:.9375rem; color:var(--muted); margin-bottom:1.25rem}
  .destaque .foto{aspect-ratio:auto; min-height:15rem}

  .car{position:relative; margin-top:1.5rem}
  .car-topo{
    display:flex; align-items:baseline; justify-content:space-between; gap:1rem; margin-bottom:1rem;
  }
  .car-legenda{font-family:var(--tipo-ui); font-size:.75rem; color:var(--muted); margin:0}
  .car-ctrl{display:flex; gap:.5rem; flex:none}
  .car-ctrl button{
    width:2.75rem; height:2.75rem; border:1px solid var(--rule-strong); background:var(--surface);
    color:var(--ink-strong); border-radius:2px; cursor:pointer; display:grid; place-items:center;
    font-size:1rem; line-height:1; transition:border-color .2s, background .2s;
  }
  .car-ctrl button:hover:not(:disabled){border-color:var(--accent-line); background:var(--surface-2)}
  .car-ctrl button:disabled{opacity:.35; cursor:default}
  .car-trilho{
    display:flex; gap:1px; overflow-x:auto; scroll-snap-type:x mandatory;
    scroll-behavior:smooth; background:var(--rule); border:1px solid var(--rule);
    scrollbar-width:thin;
  }
  @media (prefers-reduced-motion: reduce){.car-trilho{scroll-behavior:auto}}
  .car-trilho:focus-visible{outline:3px solid var(--focus); outline-offset:3px}
  .car-item{
    flex:0 0 min(20.5rem,82%); scroll-snap-align:start; background:var(--surface);
  }
  .car-item a{
    display:flex; flex-direction:column; height:100%; text-decoration:none;
  }
  .car-txt{
    display:flex; flex-direction:column; flex:1; padding:1.25rem 1.5rem 1.5rem;
    border-left:2px solid transparent;
  }
  .car-item a:hover .car-txt{border-left-color:var(--accent-line); background:var(--surface-2)}
  .car-item .area{
    font-family:var(--tipo-ui); font-size:.625rem; letter-spacing:.14em; text-transform:uppercase;
    color:var(--accent); font-weight:500; margin-bottom:.625rem;
  }
  .car-item .tit{
    font-family:var(--tipo-leitura); font-size:1.0625rem; line-height:1.4; color:var(--ink-strong);
    margin-bottom:.875rem; flex:1;
  }
  .car-item a:hover .tit{color:var(--accent)}
  .car-item .dur{font-family:var(--tipo-ui); font-size:.75rem; color:var(--muted)}

  /* ---- capa do artigo: sistema tipográfico, sem banco de imagem ---- */
  .capa{
    position:relative; display:block; aspect-ratio:16/10; overflow:hidden;
    background:var(--navy);
  }
  .capa.b{background:#12283F} .capa.c{background:#2E3944} .capa.d{background:#193450}
  .capa::before{
    content:""; position:absolute; left:1.375rem; top:1.375rem;
    width:2rem; height:2px; background:var(--champanhe);
  }
  .capa .simb{
    position:absolute; right:-14%; bottom:-34%; width:66%; opacity:.11; pointer-events:none;
  }
  .capa .simb img{width:100%; height:auto; display:block}
  .capa .termo{
    position:absolute; left:1.375rem; right:1.375rem; bottom:1.125rem;
    font-family:var(--tipo-ui); font-weight:300; font-size:1.5rem; line-height:1.15;
    letter-spacing:-.02em; color:var(--champanhe);
  }
  /* ---- cartão de vídeo ---- */
  .capa .play{
    position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
    width:3.25rem; height:3.25rem; z-index:2; pointer-events:none;
  }
  .capa .play circle{fill:rgba(13,33,55,.55); stroke:var(--champanhe); stroke-width:1.25}
  .capa .play path{fill:var(--champanhe)}
  .car-item a:hover .capa .play circle{fill:rgba(13,33,55,.8)}
  .car-item .tipo::before{content:" · "}
  .car-item .dur .fmt{color:var(--accent)}
  .car-item a:hover .capa .simb{opacity:.18; transition:opacity .4s}
  @media (prefers-reduced-motion: reduce){.car-item a:hover .capa .simb{transition:none}}

  /* ================= CONTATO: WHATSAPP ================= */
  .rapido{
    background:var(--surface); border:1px solid var(--rule); border-left:2px solid var(--accent-line);
    padding:1.5rem 1.75rem; margin-bottom:2rem;
  }
  .rapido p{margin:0 0 .875rem; font-size:.9375rem}
  .rapido .ou{
    font-family:var(--tipo-ui); font-size:.8125rem; color:var(--muted); margin:1rem 0 0;
  }
  /* alvo de toque e contraste conferidos: navy sobre areia */
  .zap{
    font-family:var(--tipo-ui); font-size:.875rem; font-weight:500;
    display:inline-flex; align-items:center; gap:.625rem; min-height:2.75rem;
    color:var(--ink-strong); text-decoration:none;
    border:1px solid var(--rule-strong); border-radius:2px; padding:.625rem 1.125rem;
  }
  .zap:hover{border-color:var(--accent-line); background:var(--surface-2)}
  .zap svg{width:1.125rem; height:1.125rem; flex:none}

  /* ================= ROTEADOR (primeira dobra) ================= */
  .roteador{background:var(--surface-2); border-top:1px solid var(--rule); border-bottom:1px solid var(--rule)}
  .roteador-in{
    display:grid; gap:1.25rem; padding:2rem 0; align-items:end;
  }
  @media(min-width:56rem){
    .roteador-in{grid-template-columns:auto 1fr auto; gap:2rem; align-items:end}
  }
  .roteador h2{
    font-size:1.25rem; font-weight:400; letter-spacing:-.01em; margin:0;
    font-family:var(--tipo-ui); white-space:nowrap;
  }
  .roteador .sub{
    font-family:var(--tipo-ui); font-size:.8125rem; color:var(--muted); margin:.375rem 0 0;
    font-weight:300; white-space:normal;
  }
  .roteador .campo{gap:.375rem}
  .roteador select{background:var(--surface)}
  .roteador button{
    font-family:var(--tipo-ui); font-size:.875rem; font-weight:500;
    background:var(--navy); color:#FAF8F5; border:2px solid var(--navy); border-radius:2px;
    padding:.75rem 1.5rem; min-height:2.75rem; cursor:pointer; white-space:nowrap;
  }
  .roteador button:hover{background:transparent; color:var(--ink-strong)}
  @media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]) .roteador button{
      background:var(--champanhe); color:var(--navy); border-color:var(--champanhe)}
    :root:not([data-theme="light"]) .roteador button:hover{background:transparent; color:var(--champanhe)}
  }
  :root[data-theme="dark"] .roteador button{
    background:var(--champanhe); color:var(--navy); border-color:var(--champanhe)}
  :root[data-theme="dark"] .roteador button:hover{background:transparent; color:var(--champanhe)}

  /* ================= NOTA DO PROTÓTIPO ================= */
  .nota-proto{
    background:var(--surface-2); border-top:1px solid var(--rule); border-bottom:1px solid var(--rule);
    font-family:var(--tipo-ui); font-size:.8125rem; font-weight:300; color:var(--muted);
    padding:1rem 0; line-height:1.6; max-width:none;
  }
  .nota-proto b{color:var(--ink-strong); font-weight:500}
  .nota-proto p{max-width:none; margin:0}