/* =========================================================
   Gabriela Ferreira · Psicóloga — folha de estilo única
   Paleta extraída do logotipo: rosa-antigo + carvão + creme
   ========================================================= */

:root{
  --rosa:#c08b84;
  --rosa-escuro:#a9736c;
  --rosa-medio:#d2a49d;
  --rosa-claro:#e8cdc8;
  --rosa-vel:#f6e9e6;
  --carvao:#3a3438;
  --carvao-suave:#554d52;
  --creme:#fbf7f3;
  --creme-2:#f4ece5;
  --branco:#fffdfb;
  --taupe:#a79385;
  --texto:#4a4348;
  --texto-suave:#7d7278;
  --borda:rgba(58,52,56,.11);
  --borda-rosa:rgba(192,139,132,.28);
  --verde-zap:#25d366;
  --sombra:0 18px 46px -20px rgba(58,52,56,.32);
  --sombra-forte:0 26px 64px -24px rgba(58,52,56,.4);
  --raio:18px;
  --ritmo:clamp(3.75rem,10vw,7rem);
  --serif:'Cormorant Garamond',Georgia,'Times New Roman',serif;
  --sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
}

*{box-sizing:border-box;margin:0;padding:0}

html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
  scroll-padding-top:8rem;
}

body{
  font-family:var(--sans);
  font-size:17px;
  font-weight:300;
  line-height:1.75;
  color:var(--texto);
  background:var(--creme);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}

img{max-width:100%;height:auto;display:block}

a{color:var(--rosa-escuro);text-decoration:none;transition:color .3s ease}
a:hover{color:var(--carvao)}

:focus-visible{
  outline:2px solid var(--rosa-escuro);
  outline-offset:3px;
  border-radius:4px;
}

/* ---------- Tipografia ---------- */
h1,h2,h3,h4,.serif{
  font-family:var(--serif);
  font-weight:400;
  color:var(--carvao);
  letter-spacing:-.01em;
  line-height:1.16;
}
h1{font-size:clamp(2.3rem,5.6vw,3.75rem);line-height:1.08}
h2{font-size:clamp(1.85rem,4.2vw,2.7rem);margin-bottom:1rem}
h3{font-size:clamp(1.3rem,2.6vw,1.55rem);margin-bottom:.55rem}
h4{font-size:1.14rem;margin-bottom:.4rem}

p{margin-bottom:1.15rem}
p:last-child{margin-bottom:0}

strong{font-weight:500;color:var(--carvao)}

.olho{
  display:block;
  font-family:var(--sans);
  font-size:.7rem;
  font-weight:500;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--rosa);
  margin-bottom:.9rem;
}

.lead{
  font-size:clamp(1.06rem,2.4vw,1.2rem);
  line-height:1.7;
  color:var(--texto-suave);
}

/* ---------- Estrutura ---------- */
.envolve{width:100%;max-width:1140px;margin:0 auto;padding:0 1.5rem}
.estreito{max-width:760px;margin-left:auto;margin-right:auto}
.secao{padding:var(--ritmo) 0;position:relative}
.secao-creme{background:var(--creme-2)}
.secao-rosa{background:var(--rosa-vel)}
.centro{text-align:center}

.cabecalho-secao{max-width:640px;margin:0 auto clamp(2.5rem,6vw,3.75rem);text-align:center}
.cabecalho-secao .lead{margin-top:1rem}

/* ---------- Cabeçalho / navegação ---------- */
.topo{
  position:sticky;
  top:0;
  z-index:60;
  background:rgba(251,247,243,.86);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid transparent;
  transition:border-color .35s ease,box-shadow .35s ease;
}
.topo.rolou{
  border-bottom-color:var(--borda);
  box-shadow:0 6px 24px -18px rgba(58,52,56,.5);
}
.topo .envolve{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1.5rem;
  min-height:108px;
}
.marca{display:flex;align-items:center;flex-shrink:0}
.marca img{height:clamp(52px,6vw,72px);width:auto;flex-shrink:0;max-width:none;mix-blend-mode:multiply}

.menu{display:flex;align-items:center;gap:1.9rem}
.menu a{
  font-size:.86rem;
  font-weight:400;
  color:var(--texto);
  position:relative;
  padding:.35rem 0;
}
.menu a::after{
  content:"";
  position:absolute;
  left:0;bottom:0;
  width:100%;height:1px;
  background:var(--rosa);
  transform:scaleX(0);
  transform-origin:right;
  transition:transform .4s cubic-bezier(.2,.7,.3,1);
}
.menu a:hover::after,
.menu a[aria-current="page"]::after{transform:scaleX(1);transform-origin:left}
.menu a[aria-current="page"]{color:var(--carvao);font-weight:500}

/* O CTA do menu e um botao, nao um link de navegacao:
   `.menu a` tem especificidade maior que `.btn-*` e sobrescreveria a cor. */
.menu a.btn{padding:.72rem 1.4rem;font-size:.84rem}
.menu a.btn::after{display:none}
.menu a.btn-primario{color:var(--branco)}
.menu a.btn-primario:hover{color:var(--branco)}

.abrir-menu{
  display:none;
  width:44px;height:44px;
  border:1px solid var(--borda);
  border-radius:11px;
  background:transparent;
  cursor:pointer;
  align-items:center;
  justify-content:center;
  color:var(--carvao);
}
.abrir-menu svg{width:20px;height:20px}

/* ---------- Botões ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.6rem;
  padding:.92rem 1.75rem;
  border-radius:999px;
  font-family:var(--sans);
  font-size:.9rem;
  font-weight:500;
  letter-spacing:.01em;
  border:1px solid transparent;
  cursor:pointer;
  text-align:center;
  transition:transform .35s cubic-bezier(.2,.7,.3,1),box-shadow .35s ease,background .35s ease,color .35s ease,border-color .35s ease;
}
.btn svg{width:18px;height:18px;flex-shrink:0}
.btn:hover{transform:translateY(-2px)}

.btn-primario{
  background:var(--rosa-escuro);
  color:var(--branco);
  box-shadow:0 12px 28px -14px rgba(169,115,108,.85);
}
.btn-primario:hover{background:var(--carvao);color:var(--branco);box-shadow:var(--sombra)}

.btn-zap{
  background:var(--verde-zap);
  color:#0b2e18;
  box-shadow:0 12px 28px -14px rgba(37,211,102,.9);
}
.btn-zap:hover{background:#1fbb59;color:#062a12}

.btn-contorno{
  background:transparent;
  color:var(--carvao);
  border-color:var(--borda-rosa);
}
.btn-contorno:hover{background:var(--branco);border-color:var(--rosa);color:var(--carvao)}

.grupo-btn{
  display:flex;
  flex-wrap:wrap;
  gap:.85rem;
  align-items:center;
}
.centro .grupo-btn{justify-content:center}

/* ---------- Herói ---------- */
.heroi{
  position:relative;
  padding:clamp(3rem,7vw,5rem) 0 clamp(3.5rem,8vw,6rem);
  overflow:hidden;
}
.heroi::before{
  content:"";
  position:absolute;
  width:58vmax;height:58vmax;
  top:-30vmax;right:-22vmax;
  border-radius:50%;
  background:radial-gradient(circle,rgba(232,205,200,.5),rgba(232,205,200,0) 66%);
  pointer-events:none;
}
.heroi .envolve{position:relative;z-index:1}

.heroi-grade{
  display:grid;
  grid-template-columns:1.08fr .92fr;
  gap:clamp(2.5rem,6vw,4.5rem);
  align-items:center;
}

.selo-crp{
  display:inline-flex;
  align-items:center;
  gap:.6rem;
  padding:.42rem 1.05rem;
  border:1px solid var(--borda-rosa);
  border-radius:999px;
  background:rgba(255,255,255,.7);
  font-size:.7rem;
  font-weight:500;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--rosa-escuro);
  margin-bottom:1.5rem;
}
.selo-crp .ponto{
  width:6px;height:6px;
  border-radius:50%;
  background:var(--verde-zap);
  box-shadow:0 0 0 3px rgba(37,211,102,.2);
}

.heroi h1{margin-bottom:1.25rem}
.heroi h1 em{font-style:italic;color:var(--rosa-escuro)}
.heroi .lead{margin-bottom:1.9rem;max-width:34rem}

.heroi-provas{
  display:flex;
  flex-wrap:wrap;
  gap:1.6rem;
  margin-top:2.25rem;
  padding-top:1.75rem;
  border-top:1px solid var(--borda);
}
.prova .num{
  display:block;
  font-family:var(--serif);
  font-size:1.45rem;
  color:var(--carvao);
  line-height:1.2;
}
.prova .txt{
  display:block;
  font-size:.78rem;
  color:var(--texto-suave);
  letter-spacing:.02em;
}

/* Retrato */
.retrato{position:relative}
.retrato img{
  width:100%;
  border-radius:200px 200px var(--raio) var(--raio);
  box-shadow:var(--sombra-forte);
  position:relative;
  z-index:1;
}
.retrato::after{
  content:"";
  position:absolute;
  inset:16px -16px -16px 16px;
  border:1px solid var(--rosa-claro);
  border-radius:200px 200px var(--raio) var(--raio);
  z-index:0;
}

/* ---------- Cartões ---------- */
.grade{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(272px,1fr));
  gap:1.15rem;
}
.grade-2{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
.grade-4{grid-template-columns:repeat(4,1fr)}
@media (max-width:1040px){.grade-4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.grade-4{grid-template-columns:1fr}}

.cartao{
  position:relative;
  padding:2.1rem 1.75rem;
  background:var(--branco);
  border:1px solid var(--borda);
  border-radius:var(--raio);
  overflow:hidden;
  transition:transform .5s cubic-bezier(.2,.7,.3,1),box-shadow .5s ease,border-color .5s ease;
}
.cartao::after{
  content:"";
  position:absolute;
  top:0;left:0;
  width:100%;height:2px;
  background:linear-gradient(90deg,var(--rosa-claro),var(--rosa));
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .55s cubic-bezier(.2,.7,.3,1);
}
.cartao:hover{transform:translateY(-5px);box-shadow:var(--sombra);border-color:var(--borda-rosa)}
.cartao:hover::after{transform:scaleX(1)}
.cartao p{font-size:.95rem;color:var(--texto-suave);line-height:1.68}
.cartao .saiba{
  display:inline-flex;
  align-items:center;
  gap:.45rem;
  margin-top:1.15rem;
  font-size:.84rem;
  font-weight:500;
  color:var(--rosa-escuro);
}
.cartao .saiba svg{width:14px;height:14px;transition:transform .35s ease}
.cartao:hover .saiba svg{transform:translateX(4px)}

.icone{
  width:48px;height:48px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:14px;
  background:var(--rosa-vel);
  color:var(--rosa-escuro);
  margin-bottom:1.25rem;
}
.icone svg{width:23px;height:23px}

/* ---------- CTA contextual (a cada 2 seções) ---------- */
.cta-faixa{
  padding:clamp(2.75rem,6vw,3.75rem) 0;
  background:linear-gradient(135deg,var(--carvao),#4b4247);
  color:rgba(255,255,255,.8);
  position:relative;
  overflow:hidden;
}
.cta-faixa::before{
  content:"";
  position:absolute;
  width:38vmax;height:38vmax;
  top:-19vmax;right:-12vmax;
  border-radius:50%;
  background:radial-gradient(circle,rgba(192,139,132,.28),rgba(192,139,132,0) 68%);
}
.cta-faixa .envolve{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:2rem;
  flex-wrap:wrap;
}
.cta-faixa h2,.cta-faixa h3{color:var(--branco);margin-bottom:.5rem;font-size:clamp(1.55rem,3.4vw,2.05rem)}
.cta-faixa p{color:rgba(255,255,255,.72);font-size:.98rem;max-width:44ch;margin:0}
.cta-faixa .texto{flex:1 1 300px}

/* ---------- Botão flutuante do WhatsApp ---------- */
.zap-flutua{
  position:fixed;
  right:clamp(1rem,3vw,1.75rem);
  bottom:clamp(1rem,3vw,1.75rem);
  z-index:70;
  display:inline-flex;
  align-items:center;
  gap:.65rem;
  padding:.85rem 1.3rem .85rem 1.05rem;
  border-radius:999px;
  background:var(--verde-zap);
  color:#0b2e18;
  font-size:.87rem;
  font-weight:500;
  box-shadow:0 14px 34px -10px rgba(37,211,102,.65);
  transform:translateY(120%);
  opacity:0;
  transition:transform .55s cubic-bezier(.2,.7,.3,1),opacity .4s ease,box-shadow .35s ease;
}
.zap-flutua.aparece{transform:none;opacity:1}
.zap-flutua:hover{color:#062a12;box-shadow:0 18px 42px -10px rgba(37,211,102,.8)}
.zap-flutua svg{width:22px;height:22px;flex-shrink:0}
.zap-flutua .rotulo{white-space:nowrap}

@media (max-width:520px){
  .zap-flutua{padding:.85rem 1.1rem}
  .zap-flutua .rotulo{display:none}
}

/* ---------- Breadcrumb ---------- */
.trilha{
  padding:1.1rem 0 0;
  font-size:.79rem;
  color:var(--texto-suave);
}
.trilha ol{
  list-style:none;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:.5rem;
}
.trilha li{display:flex;align-items:center;gap:.5rem}
.trilha li+li::before{content:"›";color:var(--rosa);font-size:.95rem;line-height:1}
.trilha a{color:var(--texto-suave)}
.trilha a:hover{color:var(--rosa-escuro)}
.trilha [aria-current="page"]{color:var(--carvao)}

/* ---------- Cabeçalho de página interna ---------- */
.capa{
  padding:clamp(2rem,4vw,3rem) 0 clamp(2.5rem,6vw,4rem);
  background:linear-gradient(180deg,var(--rosa-vel),var(--creme));
  position:relative;
}
.capa h1{margin-bottom:1.15rem;max-width:20ch}
.capa .lead{max-width:60ch}
.capa .atualizado{
  margin-top:1.5rem;
  font-size:.78rem;
  color:var(--texto-suave);
  display:flex;
  align-items:center;
  gap:.5rem;
}
.capa .atualizado svg{width:14px;height:14px;color:var(--rosa)}

/* ---------- Corpo de artigo ---------- */
.artigo{padding:clamp(2.75rem,7vw,4.5rem) 0}
.artigo h2{margin-top:2.75rem}
.artigo h2:first-child{margin-top:0}
.artigo h3{margin-top:1.9rem}
.artigo ul,.artigo ol{margin:0 0 1.25rem 1.25rem}
.artigo li{margin-bottom:.55rem;padding-left:.3rem}
.artigo li::marker{color:var(--rosa)}

.resposta-curta{
  padding:1.4rem 1.6rem;
  background:var(--rosa-vel);
  border-left:3px solid var(--rosa);
  border-radius:0 var(--raio) var(--raio) 0;
  margin-bottom:1.75rem;
}
.resposta-curta p{font-size:1.04rem;color:var(--carvao);margin:0}
.resposta-curta .rotulo{
  display:block;
  font-size:.66rem;
  font-weight:500;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--rosa-escuro);
  margin-bottom:.5rem;
}

.destaque{
  padding:1.6rem 1.75rem;
  background:var(--branco);
  border:1px solid var(--borda);
  border-radius:var(--raio);
  margin:1.75rem 0;
}
.destaque p:last-child{margin-bottom:0}

.aviso{
  padding:1.35rem 1.6rem;
  background:#fdf4ec;
  border:1px solid #eddac6;
  border-radius:var(--raio);
  margin:1.75rem 0;
  font-size:.94rem;
  color:#7a5a3a;
}
.aviso strong{color:#6b4a2c}

/* Lista de fontes */
.fontes{
  margin-top:3rem;
  padding-top:1.75rem;
  border-top:1px solid var(--borda);
}
.fontes h2{font-size:1.2rem;margin:0 0 .9rem}
.fontes ol{margin-left:1.15rem;font-size:.88rem;color:var(--texto-suave)}
.fontes li{margin-bottom:.5rem}
.fontes a{word-break:break-word}

/* ---------- FAQ (accordion) ---------- */
.faq{display:flex;flex-direction:column;gap:.7rem}
.faq details{
  background:var(--branco);
  border:1px solid var(--borda);
  border-radius:14px;
  overflow:hidden;
  transition:border-color .35s ease,box-shadow .35s ease;
}
.faq details[open]{border-color:var(--borda-rosa);box-shadow:var(--sombra)}
.faq summary{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:1rem;
  padding:1.15rem 1.4rem;
  cursor:pointer;
  list-style:none;
  font-family:var(--serif);
  font-size:1.16rem;
  color:var(--carvao);
  line-height:1.35;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"";
  flex-shrink:0;
  width:11px;height:11px;
  margin-top:.42rem;
  border-right:1.5px solid var(--rosa);
  border-bottom:1.5px solid var(--rosa);
  transform:rotate(45deg);
  transition:transform .4s cubic-bezier(.2,.7,.3,1);
}
.faq details[open] summary::after{transform:rotate(-135deg)}
.faq .resposta{padding:0 1.4rem 1.35rem;font-size:.96rem;color:var(--texto-suave)}
.faq .resposta p{margin-bottom:.85rem}

/* ---------- Lista com marcador ornamental ---------- */
.lista-check{list-style:none;margin:0 0 1.25rem}
.lista-check li{
  position:relative;
  padding-left:1.85rem;
  margin-bottom:.7rem;
}
.lista-check li::before{
  content:"";
  position:absolute;
  left:0;top:.62rem;
  width:9px;height:9px;
  border-radius:50%;
  border:1.5px solid var(--rosa);
}

/* ---------- Linha do tempo (formação) ---------- */
.tempo{list-style:none;margin:2rem 0 0}
.tempo li{
  position:relative;
  padding:0 0 1.75rem 2rem;
  border-left:1px solid var(--rosa-claro);
}
.tempo li:last-child{padding-bottom:0;border-left-color:transparent}
.tempo li::before{
  content:"";
  position:absolute;
  left:-5px;top:.6rem;
  width:9px;height:9px;
  border-radius:50%;
  background:var(--creme);
  border:1.5px solid var(--rosa);
}
.tempo .titulo{
  display:block;
  font-family:var(--serif);
  font-size:1.22rem;
  color:var(--carvao);
  line-height:1.32;
}
.tempo .detalhe{
  display:block;
  font-size:.86rem;
  color:var(--texto-suave);
  margin-top:.2rem;
}

/* ---------- Painel duas colunas ---------- */
.painel{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(2.25rem,6vw,4.5rem);
  align-items:center;
}
.painel-imagem img{border-radius:var(--raio);box-shadow:var(--sombra)}

/* ---------- Rodapé ---------- */
.rodape{
  background:var(--carvao);
  color:rgba(255,255,255,.62);
  padding:clamp(3rem,7vw,4.5rem) 0 2rem;
  font-size:.9rem;
}
.rodape a{color:rgba(255,255,255,.72)}
.rodape a:hover{color:var(--rosa-medio)}
.rodape-grade{
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr;
  gap:2.5rem;
  padding-bottom:2.5rem;
  border-bottom:1px solid rgba(255,255,255,.12);
}
.rodape h2,.rodape h3{
  color:var(--branco);
  font-size:1.05rem;
  font-family:var(--sans);
  font-weight:500;
  letter-spacing:.03em;
  margin-bottom:1.1rem;
}
.rodape ul{list-style:none}
.rodape li{margin-bottom:.6rem}
.rodape .marca-rodape{
  font-family:var(--serif);
  font-size:1.6rem;
  color:var(--branco);
  line-height:1.2;
  margin-bottom:.35rem;
}
.rodape .crp{
  font-size:.76rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--rosa-medio);
  margin-bottom:1.1rem;
}
.rodape .sobre-curto{max-width:38ch;font-size:.88rem;line-height:1.7}
.rodape .nap{
  display:flex;
  flex-direction:column;
  gap:.2rem;
  margin-top:1.35rem;
  font-style:normal;
  font-size:.88rem;
  line-height:1.6;
  max-width:38ch;
}
.rodape .nap strong{
  font-size:.76rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--rosa-medio);
  font-weight:500;
  margin-bottom:.3rem;
}
.rodape .nap a{
  margin-top:.35rem;
  align-self:flex-start;
  border-bottom:1px solid rgba(255,255,255,.28);
}
.rodape-base{
  padding-top:1.75rem;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:.75rem 1.75rem;
  flex-wrap:wrap;
  font-size:.78rem;
  color:rgba(255,255,255,.45);
}
.rodape-base .credito a{
  color:rgba(255,255,255,.62);
  border-bottom:1px solid rgba(255,255,255,.2);
  padding-bottom:1px;
}
.rodape-base .credito a:hover{color:var(--rosa-medio);border-bottom-color:var(--rosa-medio)}

@media (max-width:720px){
  .rodape-base{justify-content:flex-start;gap:.6rem}
}

/* ---------- Página 404 ---------- */
.pagina-404{
  min-height:72svh;
  display:flex;
  align-items:center;
  padding:var(--ritmo) 0;
  text-align:center;
}
.pagina-404 .codigo{
  font-family:var(--serif);
  font-size:clamp(5rem,18vw,9rem);
  line-height:1;
  color:var(--rosa-claro);
  margin-bottom:.5rem;
}
.mapa-404{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  gap:.8rem;
  margin-top:2.75rem;
  text-align:left;
}
.mapa-404 a{
  display:block;
  padding:1rem 1.25rem;
  background:var(--branco);
  border:1px solid var(--borda);
  border-radius:13px;
  font-size:.92rem;
  color:var(--carvao);
  transition:border-color .35s ease,transform .35s ease;
}
.mapa-404 a:hover{border-color:var(--rosa);transform:translateY(-3px)}

/* ---------- Revelação na rolagem ---------- */
.reveal{
  opacity:0;
  transform:translateY(24px);
  transition:opacity .9s cubic-bezier(.2,.7,.3,1),transform .9s cubic-bezier(.2,.7,.3,1);
  transition-delay:var(--atraso,0ms);
}
.reveal.visivel{opacity:1;transform:none}

/* ---------- Utilidades ---------- */
.nao-quebra{white-space:nowrap}

.visualmente-oculto{
  position:absolute!important;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;
  clip:rect(0 0 0 0);
  white-space:nowrap;
  border:0;
}
.pular-para{
  position:absolute;
  left:-9999px;
  z-index:100;
  padding:.75rem 1.25rem;
  background:var(--carvao);
  color:var(--branco);
  border-radius:0 0 10px 0;
}
.pular-para:focus{left:0;top:0;color:var(--branco)}

/* ---------- Responsivo ---------- */
@media (max-width:960px){
  .heroi-grade{grid-template-columns:1fr;gap:2.75rem}
  .retrato{max-width:400px;margin:0 auto}
  .painel{grid-template-columns:1fr;gap:2.5rem}
  .rodape-grade{grid-template-columns:1fr 1fr;gap:2rem}
}

@media (max-width:1140px){
  .abrir-menu{display:flex}
  .menu{
    position:fixed;
    inset:108px 0 auto;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    padding:1rem 1.5rem 1.75rem;
    background:var(--creme);
    border-bottom:1px solid var(--borda);
    box-shadow:var(--sombra);
    transform:translateY(-130%);
    transition:transform .45s cubic-bezier(.2,.7,.3,1);
    max-height:calc(100svh - 108px);
    overflow-y:auto;
  }
  .menu.aberto{transform:none}
  .menu a{padding:.85rem 0;border-bottom:1px solid var(--borda);font-size:.98rem}
  .menu a::after{display:none}
  .menu .btn{margin-top:1.1rem;width:100%}
}

@media (max-width:640px){
  body{font-size:16.5px}
  .rodape-grade{grid-template-columns:1fr}
  .cta-faixa .envolve{flex-direction:column;align-items:flex-start;text-align:left}
  .heroi-provas{gap:1.15rem}
  .prova{flex:1 1 40%}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .reveal{opacity:1;transform:none;transition:none}
  .zap-flutua{transition:none}
  *{animation-duration:.001ms!important;transition-duration:.001ms!important}
}

@media print{
  .topo,.zap-flutua,.cta-faixa,.rodape{display:none}
  body{background:#fff;color:#000}
}