/* ══ GesFix — folha única ══════════════════════════════════════════ */

:root{
  color-scheme: light;
  --laranja:#E67E22;      /* acento — do logótipo */
  --laranja-e:#C4610A;    /* acento escuro, texto sobre claro */
  --laranja-l:#FCEEE0;    /* lavagem de acento */
  --ouro:#F1C40F;         /* usado uma única vez, no marcador */
  --aco:#7F8C8D;          /* cinza-aço do logótipo */
  --tinta:#151D1E;
  --corpo:#3F4B4C;
  --suave:#78878A;
  --fundo:#F1F4F4;
  --cartao:#FFFFFF;
  --linha:#D7DEDE;
  --fina:#E7ECEC;
  --ok:#1E8E5A;
  --alerta:#B4700B;

  --disp:"Archivo","Archivo Black",system-ui,sans-serif;
  --texto:"Public Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --dados:"Azeret Mono",ui-monospace,"SFMono-Regular",Menlo,monospace;
  --sombra:0 1px 2px rgba(21,29,30,.05), 0 8px 24px -14px rgba(21,29,30,.22);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    color-scheme: dark;
    --laranja:#F0903A; --laranja-e:#F7B172; --laranja-l:#2A1D11;
    --ouro:#E8C547;
    --aco:#8FA0A2;
    --tinta:#ECF1F1; --corpo:#AFBBBC; --suave:#77878A;
    --fundo:#101618; --cartao:#192023; --linha:#2B3437; --fina:#222A2D;
    --ok:#4CC38A; --alerta:#E3A63C;
    --sombra:0 1px 2px rgba(0,0,0,.4), 0 8px 24px -14px rgba(0,0,0,.7);
  }
}
:root[data-theme="dark"]{
  color-scheme: dark;
  --laranja:#F0903A; --laranja-e:#F7B172; --laranja-l:#2A1D11;
  --ouro:#E8C547;
  --aco:#8FA0A2;
  --tinta:#ECF1F1; --corpo:#AFBBBC; --suave:#77878A;
  --fundo:#101618; --cartao:#192023; --linha:#2B3437; --fina:#222A2D;
  --ok:#4CC38A; --alerta:#E3A63C;
  --sombra:0 1px 2px rgba(0,0,0,.4), 0 8px 24px -14px rgba(0,0,0,.7);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{animation-duration:.001ms!important;transition-duration:.001ms!important}
}
body{
  margin:0; background:var(--fundo); color:var(--corpo);
  font-family:var(--texto); font-size:16px; line-height:1.62;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; height:auto; display:block}
[hidden]{display:none!important}
a{color:var(--laranja-e)}
:focus-visible{outline:2px solid var(--laranja); outline-offset:3px; border-radius:2px}

.env{max-width:70rem; margin:0 auto; padding-inline:1.25rem}

/* ── Tipografia ─────────────────────────────────────── */
h1,h2,h3,h4{font-family:var(--disp); color:var(--tinta); text-wrap:balance; margin:0}
h1{font-size:clamp(2.3rem,5.6vw,3.9rem); font-weight:700; line-height:1.02; letter-spacing:-.028em}
h2{font-size:clamp(1.7rem,3.4vw,2.3rem); font-weight:700; line-height:1.1; letter-spacing:-.02em}
h3{font-size:1.12rem; font-weight:600; line-height:1.3; letter-spacing:-.008em}
h4{font-size:.98rem; font-weight:600}
p{margin:0}

.eyebrow{
  font-family:var(--dados); font-size:.7rem; font-weight:500;
  letter-spacing:.16em; text-transform:uppercase; color:var(--laranja-e);
  display:flex; align-items:center; gap:.6rem;
}
.eyebrow::before{content:""; width:1.6rem; height:2px; background:var(--laranja); flex:none}
.lede{font-size:1.12rem; color:var(--corpo); max-width:38rem}
.mono{font-family:var(--dados)}

/* ── Barra de navegação ─────────────────────────────── */
.barra{
  background:var(--cartao);
  border-bottom:1px solid var(--linha);
}
.barra .env{display:flex; align-items:center; gap:1.5rem; height:5.2rem}
.logo{display:flex; align-items:center; flex:none}
.logo img{height:3.1rem; width:auto}
.navlinks{display:flex; gap:1.4rem; margin-left:auto; align-items:center}
/* :not(.btn) para os links da barra não roubarem o estilo ao botão laranja */
.navlinks a:not(.btn){
  font-size:.92rem; font-weight:500; color:var(--corpo); text-decoration:none;
  padding:.2rem 0; border-bottom:2px solid transparent;
}
.navlinks a:not(.btn):hover{color:var(--tinta); border-bottom-color:var(--laranja)}
.navlinks a:not(.btn)[aria-current="page"]{color:var(--tinta); border-bottom-color:var(--laranja)}
.navlinks .btn{flex:none}
@media (max-width:760px){
  .navlinks{gap:1rem; width:100%; margin-left:0; order:3; overflow-x:auto; padding-bottom:.4rem}
  .navlinks a:not(.btn){white-space:nowrap; font-size:.86rem}
  .navlinks .btn{white-space:nowrap}
  .barra .env{height:auto; padding-block:.7rem; flex-wrap:wrap}
  .logo img{height:2.6rem}
}

/* ── Botões ─────────────────────────────────────────── */
.btn{
  display:inline-flex; align-items:center; gap:.5rem; justify-content:center;
  font-family:var(--texto); font-size:.95rem; font-weight:600;
  padding:.72rem 1.3rem; border-radius:3px; text-decoration:none;
  border:1px solid transparent; cursor:pointer; transition:transform .12s, background .15s;
}
.btn:active{transform:translateY(1px)}
.btn-p{background:var(--laranja); color:#FFF8F1; border-color:var(--laranja)}
.btn-p:hover{background:var(--laranja-e); border-color:var(--laranja-e)}
.btn-s{background:transparent; color:var(--tinta); border-color:var(--linha)}
.btn-s:hover{border-color:var(--aco); background:var(--cartao)}
.btn-sm{padding:.5rem 1rem; font-size:.88rem}
.acoes{display:flex; flex-wrap:wrap; gap:.7rem}

/* ── Secções ────────────────────────────────────────── */
section{padding-block:4.4rem}
.sep{border-top:1px solid var(--linha)}
.cab{display:flex; flex-direction:column; gap:.85rem; margin-bottom:2.6rem; max-width:44rem}

/* ── Etiquetas de dados ─────────────────────────────── */
.rotulo{
  font-family:var(--dados); font-size:.66rem; font-weight:500;
  letter-spacing:.14em; text-transform:uppercase; color:var(--suave);
}
.pastilha{
  display:inline-flex; align-items:center; gap:.35rem;
  font-family:var(--dados); font-size:.68rem; font-weight:500;
  letter-spacing:.05em; padding:.16rem .5rem; border-radius:2px;
  background:var(--fina); color:var(--corpo); white-space:nowrap;
}
.pastilha.ac{background:var(--laranja-l); color:var(--laranja-e)}
.pastilha.ok{background:color-mix(in srgb,var(--ok) 14%,transparent); color:var(--ok)}

/* ── Cartão base ────────────────────────────────────── */
.cartao{background:var(--cartao); border:1px solid var(--linha); border-radius:4px}

/* ── Grelhas utilitárias ────────────────────────────── */
.g2{display:grid; grid-template-columns:repeat(auto-fit,minmax(20rem,1fr)); gap:1.3rem}
.g3{display:grid; grid-template-columns:repeat(auto-fit,minmax(16.5rem,1fr)); gap:1.3rem}

/* ── Rodapé ─────────────────────────────────────────── */
.rodape{border-top:1px solid var(--linha); background:var(--cartao); padding-block:3rem 2rem}
.rodape .env{display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:2.2rem}
.rodape img{height:3.4rem; width:auto; margin-bottom:1rem}
.rodape h4{font-family:var(--dados); font-size:.66rem; font-weight:500;
  letter-spacing:.14em; text-transform:uppercase; color:var(--suave); margin-bottom:.8rem}
.rodape ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.5rem}
.rodape a{color:var(--corpo); text-decoration:none; font-size:.92rem}
.rodape a:hover{color:var(--laranja-e)}
.creditos{
  margin-top:2.4rem; padding-top:1.2rem; border-top:1px solid var(--fina);
  font-size:.82rem; color:var(--suave); display:flex; flex-wrap:wrap; gap:.4rem 1.4rem;
}
@media (max-width:700px){ .rodape .env{grid-template-columns:1fr} }

/* ── Consentimento ──────────────────────────────────── */
.gf-consent{
  position:fixed; inset:auto 0 0 0; z-index:80;
  padding:1rem; display:flex; justify-content:center;
  background:linear-gradient(to top, rgba(21,29,30,.24), transparent);
}
.gf-consent-caixa{
  width:100%; max-width:46rem; background:var(--cartao);
  border:1px solid var(--linha); border-top:3px solid var(--laranja);
  border-radius:5px; box-shadow:0 10px 40px -12px rgba(21,29,30,.45);
  padding:1.4rem 1.5rem; max-height:80vh; overflow-y:auto;
}
.gf-consent h2{font-family:var(--disp); font-size:1.08rem; color:var(--tinta); margin:0 0 .5rem}
.gf-consent p{font-size:.92rem; margin:0 0 1rem; max-width:44rem}
.gf-consent-botoes{display:flex; gap:.6rem; flex-wrap:wrap; margin-top:1.1rem}

.gf-opcao{
  display:grid; grid-template-columns:1fr auto; gap:.6rem 1.4rem; align-items:start;
  padding:.9rem 0; border-bottom:1px solid var(--fina);
}
.gf-opcao b{display:block; font-family:var(--disp); font-size:.98rem; color:var(--tinta); margin-bottom:.2rem}
.gf-opcao span{font-size:.86rem; color:var(--suave); display:block; max-width:36rem}
.gf-fixo{
  font-family:var(--dados); font-size:.64rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--ok); white-space:nowrap; padding-top:.25rem;
}

.gf-interruptor{position:relative; display:inline-block; width:2.6rem; height:1.45rem; flex:none; cursor:pointer}
.gf-interruptor input{position:absolute; opacity:0; width:0; height:0}
.gf-interruptor span{
  position:absolute; inset:0; background:var(--linha); border-radius:1rem; transition:background .15s;
}
.gf-interruptor span::before{
  content:""; position:absolute; left:3px; top:3px; width:1.05rem; height:1.05rem;
  background:var(--cartao); border-radius:50%; transition:transform .15s;
  box-shadow:0 1px 3px rgba(21,29,30,.3);
}
.gf-interruptor input:checked + span{background:var(--laranja)}
.gf-interruptor input:checked + span::before{transform:translateX(1.15rem)}
.gf-interruptor input:focus-visible + span{outline:2px solid var(--laranja); outline-offset:3px}

@media (max-width:560px){
  .gf-consent{padding:.6rem}
  .gf-consent-caixa{padding:1.2rem}
  .gf-consent-botoes .btn{flex:1 1 100%}
  .gf-opcao{grid-template-columns:1fr}
}
