/* ══════════════════════════════════════════════════
   Gabriel Nasajon — v2
   Objetivo único da página: captar e-mail.
   ══════════════════════════════════════════════════ */

:root{
  --ink:#08080a;
  --ink-2:#0d0d11;
  --ink-3:#131318;
  --line:rgba(255,255,255,.09);
  --line-2:rgba(255,255,255,.16);
  --paper:#f2efe9;
  --mute:#9a978f;
  --mute-2:#6f6d68;
  --gold:#d9a441;
  --gold-hi:#f0c877;
  --gold-dim:rgba(217,164,65,.14);

  --wrap:1180px;
  --r:14px;
  --ease:cubic-bezier(.22,.61,.36,1);

  --f-body:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-disp:"Instrument Serif",Georgia,serif;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

body{
  margin:0;
  background:var(--ink);
  color:var(--paper);
  font-family:var(--f-body);
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img{max-width:100%;display:block}
a{color:inherit}

.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:-9999px;top:0;background:var(--gold);color:#000;padding:12px 18px;z-index:200;border-radius:0 0 8px 0}
.skip:focus{left:0}

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

.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:24px}
.wrap.narrow{max-width:760px}

.grain{
  position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.028;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ───────── reveal ───────── */
.js [data-rv]{opacity:0;transform:translateY(22px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.js [data-rv].in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.js [data-rv]{opacity:1!important;transform:none!important;transition:none}}

/* ══════════ NAV ══════════ */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  display:flex;align-items:center;gap:28px;
  padding:18px 24px;
  /* nada de animar padding: causa reflow a cada frame do scroll */
  transition:background .35s var(--ease),border-color .35s var(--ease);
  border-bottom:1px solid transparent;
}
.nav.stuck{
  background:rgba(8,8,10,.82);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom-color:var(--line);
  /* altura constante: encolher a barra no scroll deslocava o conteúdo */
}
.nav__logo{
  display:inline-flex;align-items:center;gap:10px;
  text-decoration:none;font-weight:600;font-size:14px;letter-spacing:.01em;
  margin-right:auto;
}
.nav__logo span{
  display:grid;place-items:center;width:30px;height:30px;flex:0 0 30px;
  border:1px solid var(--line-2);border-radius:9px;
  font-family:var(--f-disp);font-size:15px;color:var(--gold);
}
.nav__links{display:flex;gap:26px}
.nav__links a{
  text-decoration:none;font-size:14px;color:var(--mute);
  transition:color .25s var(--ease);
}
.nav__links a:hover{color:var(--paper)}
@media (max-width:900px){.nav__links{display:none}}
@media (max-width:520px){
  .nav{padding-inline:16px}
  .nav__logo span{display:none}
  .nav .btn--sm{padding-block:13px}
}

/* ══════════ BOTÕES ══════════ */
.btn{
  --bg:transparent;--fg:var(--paper);--bd:var(--line-2);
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:14px 26px;border-radius:999px;border:1px solid var(--bd);
  background:var(--bg);color:var(--fg);
  font:600 15px/1 var(--f-body);text-decoration:none;cursor:pointer;
  transition:transform .2s var(--ease),background .25s var(--ease),border-color .25s var(--ease),box-shadow .25s var(--ease);
  white-space:nowrap;
}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0)}
.btn--sm{padding:10px 18px;font-size:13.5px}
.btn--lg{padding:18px 34px;font-size:16.5px}
.btn--full{width:100%}
.btn--gold{--bg:var(--gold);--fg:#0a0a0a;--bd:var(--gold);box-shadow:0 8px 30px -10px rgba(217,164,65,.55)}
.btn--gold:hover{--bg:var(--gold-hi);--bd:var(--gold-hi);box-shadow:0 14px 40px -10px rgba(217,164,65,.7)}
.btn--ghost:hover{background:rgba(255,255,255,.05);border-color:var(--paper)}

/* ── linha de oferta ───────────────────────────────────────────
   Tratamento tipográfico, não "pílula". Sem badge, sem ponto
   piscando, sem glow: um rótulo em versalete, um filete e o preço
   na serifa de display. Compartilhado com a página do Clube. */
.offer{
  display:inline-flex;align-items:baseline;gap:16px;flex-wrap:wrap;
  margin:0;padding:0;
}
.offer__k{
  font-size:11.5px;letter-spacing:.17em;text-transform:uppercase;
  color:var(--mute-2);white-space:nowrap;
}
.offer__rule{
  width:28px;height:1px;flex:0 0 28px;
  background:linear-gradient(90deg,var(--line-2),transparent);
  align-self:center;
}
.offer__v{font-size:14.5px;color:var(--mute);white-space:nowrap}
.offer__v b{
  font-family:var(--f-disp);font-weight:400;font-size:26px;
  color:var(--gold);letter-spacing:-.01em;margin-right:3px;
}
.offer--center{justify-content:center}
@media (max-width:520px){
  .offer{gap:10px;justify-content:center}
  .offer__rule{display:none}
  .offer__k{flex-basis:100%;text-align:center}
}

/* ══════════ TIPOGRAFIA DE SEÇÃO ══════════ */
.sec{position:relative;z-index:2;padding-block:clamp(80px,11vw,140px)}
.label{
  display:flex;align-items:center;gap:12px;
  font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--mute-2);
  margin:0 0 22px;
}
.label i{
  font-style:normal;font-family:var(--f-disp);font-size:15px;color:var(--gold);
  letter-spacing:0;
}
.h2{
  font-family:var(--f-disp);font-weight:400;
  font-size:clamp(34px,5.4vw,60px);line-height:1.08;letter-spacing:-.01em;
  margin:0 0 22px;
}
.h2 em{font-style:italic;color:var(--gold)}
.lede{max-width:620px;color:var(--mute);font-size:18px;margin:0 0 46px}

/* ══════════ HERO ══════════ */
.hero{
  position:relative;z-index:2;
  min-height:100svh;display:flex;align-items:center;
  padding:132px 0 90px;overflow:hidden;
}
.hero__aura{
  position:absolute;left:50%;top:-10%;transform:translateX(-50%);
  width:min(1100px,140vw);aspect-ratio:1;pointer-events:none;
  background:radial-gradient(circle at 50% 40%,rgba(217,164,65,.20),rgba(217,164,65,.05) 38%,transparent 66%);
  filter:blur(20px);
  animation:breathe 11s ease-in-out infinite;
}
@keyframes breathe{0%,100%{opacity:.75;transform:translateX(-50%) scale(1)}50%{opacity:1;transform:translateX(-50%) scale(1.07)}}
@media (prefers-reduced-motion:reduce){.hero__aura{animation:none}}

.hero__in{position:relative;text-align:center;display:flex;flex-direction:column;align-items:center}
.eyebrow{
  font-size:12.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--mute-2);
  margin:0 0 26px;
}
.eyebrow i{font-style:normal;color:var(--gold);margin-inline:6px}
.eyebrow__face{
  display:inline-block;width:44px;height:44px;border-radius:50%;object-fit:cover;
  object-position:50% 32%;vertical-align:middle;margin-right:12px;
  border:1px solid var(--line-2);
}

/* ── hero em duas colunas (versão institucional com retrato) ──
   .hero é flex row: com mais de um filho, eles disputariam a largura.
   Empilhar é obrigatório aqui, não estético. */
.hero--split{flex-direction:column;justify-content:center;align-items:stretch}
.hero--split .hero__in{
  display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
  gap:60px;align-items:center;text-align:left;
}
.hero--split .hero__txt{display:flex;flex-direction:column;align-items:flex-start;min-width:0}
/* em coluna estreita, o corpo de 104px estourava a dobra e empurrava o CTA para fora */
.hero--split .hero__h{font-size:clamp(38px,4.5vw,64px);margin-bottom:20px}
.hero--split .hero__sub{margin-bottom:28px;font-size:17px}
.hero--split .hero__for{margin-top:12px}
.hero--split .hero__cta{justify-content:flex-start}
.hero--split .hero__cred{justify-content:flex-start;margin-top:54px}
.hero--split .hero__cred li:first-child{padding-left:0}

.hero__fig{margin:0;position:relative}
.hero__fig img{
  width:100%;height:auto;border-radius:18px;
  /* a foto tem fundo preto: o fade dissolve a borda no fundo da página */
  -webkit-mask-image:radial-gradient(120% 100% at 60% 45%,#000 42%,transparent 88%);
  mask-image:radial-gradient(120% 100% at 60% 45%,#000 42%,transparent 88%);
}
@media (max-width:960px){
  .hero--split .hero__in{grid-template-columns:1fr;gap:0;text-align:center}
  .hero--split .hero__txt{align-items:center}
  .hero--split .hero__cta{justify-content:center}
  .hero--split .hero__cred{justify-content:center;margin-top:40px}
  .hero--split .hero__cred li:first-child{padding-left:16px}
  /* no celular a foto grande empurraria o CTA para fora da dobra;
     o rosto continua presente no avatar do eyebrow */
  .hero__fig{display:none}
}
@media (min-width:961px){.eyebrow__face{display:none}}

.hero__h{
  font-family:var(--f-disp);font-weight:400;
  font-size:clamp(44px,8.6vw,104px);line-height:1.02;letter-spacing:-.02em;
  margin:0 0 26px;
}
/* cor sólida: gradiente em texto é decorativo e é um tell de UI gerada por IA */
.hero__h em{font-style:italic;color:var(--gold)}
.hero__sub{
  max-width:620px;color:var(--mute);font-size:clamp(16px,2vw,19px);
  margin:0 0 38px;
}

.hero__for{display:block;margin-top:14px;color:var(--paper);font-weight:500}
.hero__cta{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-bottom:14px}
.hero__micro{margin:0;font-size:13.5px;color:var(--mute-2);max-width:52ch}
/* a linha da oferta é o argumento de menor atrito do funil: não pode
   ficar na tipografia mais apagada da paleta.
   No hero a coluna é estreita e a linha quebrava sozinha, com o filete
   caindo no meio — então empilha de propósito, rótulo sobre valor. */
.hero--split .offer{
  flex-direction:column;align-items:flex-start;gap:7px;
  margin-top:16px;padding-top:16px;border-top:1px solid var(--line);
  align-self:stretch;
}
.hero--split .offer__rule{display:none}
@media (max-width:960px){
  .hero--split .offer{align-items:center;max-width:none;align-self:center;text-align:center}
}

/* ── o hero tem de caber na primeira tela ──────────────────────
   O ritmo vertical é medido em vh, não em px: assim o bloco inteiro
   encolhe junto quando a janela é baixa, em vez de vazar para fora. */
.hero--split{padding:clamp(96px,13vh,150px) 0 clamp(36px,6vh,72px)}
.hero--split .hero__h{
  font-size:min(5.4vw,7.4vh,64px);
  margin-bottom:clamp(12px,2.2vh,20px);
}
.hero--split .hero__sub{margin-bottom:clamp(16px,3vh,28px)}
.hero--split .hero__for{margin-top:clamp(8px,1.4vh,12px)}
.hero--split .offer{margin-top:clamp(10px,1.8vh,16px);padding-top:clamp(10px,1.8vh,16px)}
.hero--split .hero__cred{margin-top:clamp(20px,4vh,54px)}
@media (max-height:720px){
  .hero--split .hero__sub{font-size:15.5px}
  .hero--split .hero__cred{display:none} /* repetido logo abaixo, na seção "Agora" */
}

/* no celular, CTA e preço precisam caber na primeira tela */
@media (max-width:600px){
  /* a barra fixa tem ~66px: 74 é o mínimo que ainda deixa respiro */
  .hero{padding-top:clamp(74px,9.4vh,100px);padding-bottom:clamp(24px,5vh,64px)}
  .hero--split .eyebrow{margin-bottom:clamp(12px,2.4vh,18px)}
  .hero--split .hero__h{font-size:clamp(29px,7.6vw,44px);margin-bottom:clamp(10px,1.7vh,16px)}
  .hero--split .hero__sub{margin-bottom:clamp(12px,2.2vh,22px);font-size:15.5px}
  .hero--split .hero__for{margin-top:clamp(7px,1.3vh,10px)}
  .hero--split .offer{
    margin:clamp(9px,1.6vh,14px) 0 clamp(12px,2.2vh,22px);
    padding-top:clamp(9px,1.6vh,14px);
  }
  .hero--split .hero__cred{margin-top:clamp(12px,1.5vh,30px)}
  .hero--split .hero__cred li{padding-inline:9px;font-size:11px}
  /* o preço sobe acima dos botões: no celular ele ancora melhor
     a decisão do que o botão secundário, que empurrava tudo para
     fora da primeira tela */
  .hero--split .hero__cta{order:1;margin-bottom:0}
  .hero--split .offer{order:0}
  /* o botão secundário só rola a página: a seta de rolagem já faz isso,
     e ele era o que impedia o hero de caber na primeira tela */
  .hero--split .hero__cta .btn--ghost{display:none}
  .hero{padding-bottom:clamp(14px,2.2vh,64px)}
}
/* celular baixo (iPhone SE/8): só o essencial na primeira tela.
   O botão secundário some — a seta de rolagem já cumpre o papel dele. */
@media (max-width:600px) and (max-height:700px){
  .hero{padding-top:68px;padding-bottom:18px}
  .eyebrow__face{width:36px;height:36px;margin-right:10px}
  .hero--split .hero__cta .btn--ghost{display:none}
  .hero--split .hero__sub{font-size:15px;line-height:1.45}
}

.hero__cred{
  list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:10px 0;
  margin:46px 0 0;padding:0;
}
.hero__cred li{
  font-size:12px;letter-spacing:.13em;text-transform:uppercase;color:var(--mute-2);
  padding-inline:16px;
}
.hero__cred li+li{border-left:1px solid var(--line)}

.hero__cue{
  position:absolute;bottom:26px;left:50%;transform:translateX(-50%);
  width:1px;height:52px;background:linear-gradient(var(--line-2),transparent);
}
.hero__cue span{
  position:absolute;top:0;left:-1px;width:3px;height:14px;border-radius:2px;background:var(--gold);
  animation:cue 2.2s var(--ease) infinite;
}
@keyframes cue{0%{transform:translateY(0);opacity:0}30%{opacity:1}100%{transform:translateY(38px);opacity:0}}
@media (max-width:720px){.hero__cue{display:none}}

/* ══════════ CAPTURA ══════════ */
.cap{width:100%;max-width:560px}
.cap__row{
  display:flex;gap:8px;padding:7px;
  background:rgba(255,255,255,.045);
  border:1px solid var(--line-2);border-radius:999px;
  transition:border-color .25s var(--ease),box-shadow .25s var(--ease);
}
.cap__row:focus-within{border-color:var(--gold);box-shadow:0 0 0 4px var(--gold-dim)}
.cap__input{
  flex:1;min-width:0;
  background:transparent;border:0;outline:0;
  padding:0 18px;color:var(--paper);
  font:400 16px/1 var(--f-body);
}
.cap__input::placeholder{color:var(--mute-2)}
.cap__micro{margin:14px 0 0;font-size:13px;color:var(--mute-2);text-align:center}
.cap__msg{margin:12px 0 0;font-size:14px;text-align:center;min-height:1em}
.cap__msg.ok{color:var(--gold-hi)}
.cap__msg.err{color:#ef8a7a}
.cap.done .cap__row{display:none}
.cap.done .cap__micro{display:none}
.cap.done .cap__msg{font-family:var(--f-disp);font-size:24px;line-height:1.3}

@media (max-width:560px){
  .cap__row{flex-direction:column;border-radius:20px;padding:10px;gap:10px}
  .cap__input{padding:15px 12px;text-align:center;font-size:16px}
  .cap .btn{width:100%;padding-block:17px}
}

/* ══════════ ESPELHO ══════════ */
.sec--mirror{border-top:1px solid var(--line)}
/* sem barra colorida na lateral. A hierarquia vem do corpo do texto e de
   um filete neutro, que é como uma revista marca um bloco destacado. */
.mirror{padding-top:22px;border-top:1px solid var(--line-2);margin:0 0 34px}
.mirror p{margin:0 0 16px;font-size:clamp(17px,2.2vw,20px);color:#d8d5cd}
.mirror p:first-child{font-family:var(--f-disp);font-size:clamp(22px,3vw,28px);line-height:1.3;color:var(--paper)}
.mirror p:last-child{margin-bottom:0}
.mirror strong{color:var(--paper)}
.mirror__close{color:var(--mute);font-size:17px;margin:0}

/* ══════════ AGORA ══════════ */
.sec--now{background:var(--ink-2);border-block:1px solid var(--line)}
.prose.lg p{font-size:clamp(17px,2.1vw,19px);color:#cfccc4}
.nowbox{
  margin-top:40px;display:flex;align-items:center;gap:26px;flex-wrap:wrap;
  padding:26px 30px;border:1px solid var(--gold);border-radius:var(--r);
  background:rgba(217,164,65,.06);
}
.nowbox__l{flex:1 1 260px}
.nowbox__k{margin:0 0 6px;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--mute-2)}
.nowbox__v{margin:0 0 6px;font-family:var(--f-disp);font-size:30px;line-height:1;color:var(--gold)}
.nowbox__d{margin:0;font-size:14.5px;color:var(--mute)}

/* ══════════ TRAJETÓRIA ══════════ */
.path{list-style:none;margin:0;padding:0;position:relative}
.path::before{
  content:"";position:absolute;left:7px;top:10px;bottom:10px;width:1px;background:var(--line);
}
.path li{position:relative;padding:0 0 34px 40px}
.path li:last-child{padding-bottom:0}
.path li::before{
  content:"";position:absolute;left:0;top:7px;width:15px;height:15px;border-radius:50%;
  background:var(--ink);border:1px solid var(--line-2);
}
.path li.in::before{border-color:var(--gold)}
.path--now::before{background:var(--gold)!important;box-shadow:0 0 0 5px var(--gold-dim)}
.path b{display:block;font-family:var(--f-disp);font-weight:400;font-size:25px;margin-bottom:8px}
.path--now b{color:var(--gold)}
.path p{margin:0;color:var(--mute);font-size:16px}

/* ══════════ MÍDIA ══════════ */
.sec--media{background:var(--ink-2);border-block:1px solid var(--line)}
.media{list-style:none;margin:0;padding:0}
.media li{border-top:1px solid var(--line)}
.media li:first-child{border-top:0}
.media a,.media__row{
  display:flex;align-items:baseline;gap:18px;flex-wrap:wrap;
  padding:22px 0;text-decoration:none;
  /* transform em vez de padding: não força reflow no hover */
  transition:transform .3s var(--ease);
}
.media a:hover{transform:translateX(10px)}
.media b{font-family:var(--f-disp);font-weight:400;font-size:26px;flex:0 0 auto;min-width:150px}
.media span{flex:1 1 220px;color:var(--mute);font-size:15px}
.media i{font-style:normal;color:var(--gold);font-size:14px}
.media__note{margin:28px 0 0;font-size:15px;color:var(--mute-2)}
.media__note a{color:var(--gold)}
@media (max-width:560px){.media b{min-width:0;flex-basis:100%}}

/* ══════════ PITCH DO CLUBE ══════════ */
.sec--pitch{
  border-block:1px solid var(--line);
  background:radial-gradient(ellipse at 50% -20%,rgba(217,164,65,.17),transparent 60%),var(--ink);
}
.pitch{text-align:center;display:flex;flex-direction:column;align-items:center}
.pitch__h{
  font-family:var(--f-disp);font-weight:400;
  font-size:clamp(32px,5vw,58px);line-height:1.08;margin:0 0 20px;max-width:16ch;
}
.pitch__h em{font-style:italic;color:var(--gold)}
.pitch__sub{max-width:620px;color:var(--mute);font-size:17.5px;margin:0 0 44px}
.pitch__grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:1px;width:100%;text-align:left;
  background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;
  margin-bottom:44px;
}
@media (max-width:900px){.pitch__grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:540px){.pitch__grid{grid-template-columns:1fr}}
.pitch__grid article{background:var(--ink);padding:26px 24px}
.pitch__grid b{display:block;font-family:var(--f-disp);font-weight:400;font-size:23px;color:var(--gold);margin-bottom:9px}
.pitch__grid p{margin:0;color:var(--mute);font-size:15px}

.pitch__cta{display:flex;align-items:center;gap:30px;flex-wrap:wrap;justify-content:center}
.pitch__price{text-align:left}
.pitch__now{margin:0;display:flex;align-items:flex-start;gap:3px}
.pitch__now span{font-size:17px;color:var(--mute);margin-top:10px}
.pitch__now span:last-child{align-self:flex-end;margin:0 0 8px}
.pitch__now b{font-family:var(--f-disp);font-weight:400;font-size:62px;line-height:.9}
.pitch__note{margin:2px 0 0;font-size:13px;color:var(--mute-2);max-width:30ch}
.pitch__micro{margin:18px 0 0;font-size:13.5px;color:var(--mute-2)}
@media (max-width:560px){.pitch__cta{flex-direction:column;gap:20px}.pitch__price{text-align:center}.pitch__now{justify-content:center}.pitch__note{max-width:none}.pitch__cta .btn{width:100%}}

/* ══════════ CARTA (secundária) ══════════ */
.sec--letter{background:var(--ink-2);border-block:1px solid var(--line)}
.letter{display:flex;flex-direction:column;align-items:flex-start}
.letter .lede{margin-bottom:32px}

/* ══════════ CARTA (layout legado de cards) ══════════ */
.sec--carta{background:var(--ink-2);border-block:1px solid var(--line)}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media (max-width:860px){.grid3{grid-template-columns:1fr}}
.card{
  position:relative;padding:34px 28px 30px;
  background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.015));
  border:1px solid var(--line);border-radius:var(--r);
  transition:border-color .3s var(--ease),transform .3s var(--ease);
}
.card:hover{border-color:var(--line-2);transform:translateY(-4px)}
.card__n{
  font-family:var(--f-disp);font-size:14px;color:var(--gold);
  display:block;margin-bottom:14px;letter-spacing:.1em;
}
.card h3{font-family:var(--f-disp);font-weight:400;font-size:26px;margin:0 0 10px}
.card p{margin:0;color:var(--mute);font-size:15.5px}

.peek{margin-top:44px;border:1px dashed var(--line-2);border-radius:var(--r);padding:28px}
.peek__ttl{
  margin:0 0 16px;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--mute-2);
}
.peek__list{list-style:none;margin:0;padding:0}
.peek__list li{
  display:flex;gap:14px;padding:12px 0;font-size:16.5px;color:#d8d5cd;
  border-top:1px solid var(--line);
}
.peek__list li:first-child{border-top:0}
.peek__list span{color:var(--gold);font-family:var(--f-disp)}

/* ══════════ QUEM SOU ══════════ */
.who{display:grid;grid-template-columns:1.35fr .8fr;gap:64px;align-items:start}
@media (max-width:940px){.who{grid-template-columns:1fr;gap:44px}}
.prose p{color:var(--mute);margin:0 0 18px;font-size:17px}
.prose strong{color:var(--paper);font-weight:600}
.who .btn{margin-top:14px}

.who__side{display:flex;flex-direction:column;gap:18px}
.who__fig{margin:0;border-radius:var(--r);overflow:hidden;border:1px solid var(--line)}
.who__fig img{width:100%;height:auto;display:block}

.who__stats{display:grid;gap:2px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.who__stats>div{background:var(--ink);padding:26px 24px}
.who__stats b{
  display:block;font-family:var(--f-disp);font-weight:400;font-size:44px;line-height:1;
  color:var(--gold);margin-bottom:8px;
}
.who__stats b i{font-style:normal;font-size:26px}
/* só o rótulo. Sem o `>div>`, esta regra também atingia os <span>
   dentro do número e os derrubava para 14px em cinza. */
.who__stats>div>span{font-size:14px;color:var(--mute)}

/* Todos os números do painel usam a mesma face, o mesmo corpo e a mesma cor.
   O primeiro se destaca pelo fundo, não por um tratamento tipográfico à parte. */
.stat--hero{background:rgba(217,164,65,.08)!important}
.stat--hero>span{color:#d8d5cd}
/* mesmo corpo dos demais; só não pode quebrar em duas linhas */
.stat--hero b{white-space:nowrap}
@media (max-width:380px){.stat--hero b{font-size:38px}}

/* ══════════ PROVA ══════════ */
.sec--proof{background:var(--ink-2);border-block:1px solid var(--line)}
.proof{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:repeat(4,1fr);
  gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;
}
@media (max-width:960px){.proof{grid-template-columns:repeat(2,1fr)}}
@media (max-width:480px){.proof{grid-template-columns:1fr}}
.proof li{
  background:var(--ink-2);padding:24px 22px;
  transition:background .3s var(--ease);
}
.proof li:hover{background:var(--ink-3)}
.proof b{display:block;font-size:16px;font-weight:600;margin-bottom:5px}
.proof span{font-size:13.5px;color:var(--gold);letter-spacing:.02em}
.proof__bridge{
  margin:34px 0 0;max-width:64ch;color:var(--mute);font-size:17px;
}
.proof__bridge strong{color:var(--paper)}
.proof__bridge a{color:var(--gold);text-decoration:none;white-space:nowrap;border-bottom:1px solid transparent;transition:border-color .25s var(--ease)}
.proof__bridge a:hover{border-bottom-color:var(--gold)}

/* ══════════ FAQ ══════════ */
.faq details{border-bottom:1px solid var(--line)}
.faq summary{
  list-style:none;cursor:pointer;padding:22px 40px 22px 0;position:relative;
  font-size:18px;font-weight:500;
  transition:color .25s var(--ease);
}
.faq summary::-webkit-details-marker{display:none}
.faq summary:hover{color:var(--gold-hi)}
.faq summary::after{
  content:"";position:absolute;right:6px;top:50%;
  width:11px;height:11px;margin-top:-7px;
  border-right:1.5px solid var(--gold);border-bottom:1.5px solid var(--gold);
  transform:rotate(45deg);transition:transform .3s var(--ease);
}
.faq details[open] summary::after{transform:rotate(-135deg);margin-top:-2px}
.faq p{margin:0 0 24px;color:var(--mute);font-size:16.5px;max-width:62ch}

/* ══════════ CTA FINAL ══════════ */
.sec--final{
  border-top:1px solid var(--line);
  background:radial-gradient(ellipse at 50% 120%,rgba(217,164,65,.16),transparent 62%),var(--ink);
}
.final{display:flex;flex-direction:column;align-items:center;text-align:center}
.final__h{
  font-family:var(--f-disp);font-weight:400;
  font-size:clamp(30px,4.6vw,52px);line-height:1.1;margin:0 0 18px;
}
.final__h em{font-style:italic;color:var(--gold)}
.final__sub{color:var(--mute);margin:0 0 34px;font-size:18px}

/* ══════════ PORTAS SECUNDÁRIAS ══════════ */
.sec--doors{padding-block:clamp(56px,7vw,84px);border-top:1px solid var(--line);background:var(--ink-2)}
.doors{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media (max-width:860px){.doors{grid-template-columns:1fr}}
.door{
  display:block;text-decoration:none;padding:26px 24px;
  border:1px solid var(--line);border-radius:var(--r);
  transition:border-color .3s var(--ease),background .3s var(--ease);
}
.door:hover{border-color:var(--gold);background:rgba(217,164,65,.05)}
.door--hot{border-color:var(--gold);background:rgba(217,164,65,.06)}
.door b{display:block;font-size:17px;margin-bottom:8px}
.door span{display:block;color:var(--mute);font-size:14.5px;margin-bottom:16px}
.door i{font-style:normal;font-size:13.5px;color:var(--gold);letter-spacing:.03em}

/* ══════════ RODAPÉ ══════════ */
.foot{position:relative;z-index:2;border-top:1px solid var(--line);padding-top:56px}
.foot__in{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:40px}
@media (max-width:760px){.foot__in{grid-template-columns:1fr;gap:32px}}
.foot__brand p{color:var(--mute-2);font-size:14.5px;margin:14px 0 0;max-width:34ch}
.foot__ttl{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--mute-2);margin:0 0 14px}
.foot__col a{display:block;text-decoration:none;color:var(--mute);font-size:15px;padding:5px 0;transition:color .25s var(--ease)}
.foot__col a:hover{color:var(--gold)}
.foot__legal{
  margin:48px 0 0;padding:22px 24px;border-top:1px solid var(--line);
  text-align:center;font-size:13px;color:var(--mute-2);
}

/* ── nav com três itens ────────────────────────────────────────────
   Ao entrar o botão "Acesso", o nome da marca passou a quebrar em duas
   linhas abaixo de ~560px. Apertar o gap e o padding dos botões
   devolve o espaço necessário para ele caber numa linha só. */
@media (max-width:560px){
  .nav{gap:10px}
  .nav .btn--sm{padding-inline:12px;font-size:12.5px}
  .nav__logo{white-space:nowrap}
}