/* ══════════════════════════════════════════════════════════════
   captura.css · inscrição, obrigado e páginas legais
   Usa os tokens e componentes de style.css (New Era) e acrescenta
   faixa de avisos, hero com a Dra. recortada, formulário, passos do
   obrigado e o layout dos textos legais. O anel de partículas fica
   reservado à página de vendas (e, discreto, ao obrigado).
   ══════════════════════════════════════════════════════════════ */

/* ───────────── hero da captura ───────────── */
.cap{position:relative;padding:clamp(28px,3.5vw,48px) 0 0;overflow:hidden}
.cap__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(24px,4vw,56px);align-items:end}
.cap__txt{display:grid;gap:16px;justify-items:start;padding-bottom:clamp(32px,4vw,56px)}
.cap__title{position:relative;font-family:var(--f-display);font-weight:600;font-size:clamp(36px,3.9vw,58px);line-height:1.02;letter-spacing:-.025em;max-width:19ch;text-shadow:0 2px 30px rgba(0,0,0,.6)}
.cap__title .grad{filter:drop-shadow(0 0 28px rgba(255,160,145,.35))}
.cap__sub{font-family:var(--f-display);font-size:clamp(18px,1.55vw,21px);line-height:1.45;color:rgba(255,255,255,.86);max-width:40ch;text-shadow:0 1px 12px #000}
.cap__sub b{color:#fff;font-weight:600}
.cap__note{display:flex;align-items:center;gap:8px;font-size:13.5px;color:rgba(255,255,255,.65)}
.cap__note svg{width:15px;height:15px;color:var(--accent-gold);flex:none}

/* Dra. recortada, grande, apagando na base */
.cap__dra{position:relative;margin:0;justify-self:center;width:100%;max-width:520px;display:grid}
.cap__dra::before{content:"";position:absolute;left:50%;top:8%;width:92%;aspect-ratio:1;transform:translateX(-50%);border-radius:50%;z-index:-1;
  background:radial-gradient(closest-side,rgba(255,160,145,.38),rgba(255,210,122,.12) 55%,transparent 75%)}
/* marcador invisível do anel: um quadrado em volta do rosto e do busto */
.cap__ring{position:absolute;left:50%;top:6%;width:84%;aspect-ratio:1;transform:translateX(-50%);pointer-events:none}
.cap__dra img{width:100%;height:auto;max-height:calc(100vh - 110px);object-fit:contain;object-position:bottom;
  -webkit-mask:linear-gradient(to bottom,#000 80%,transparent 100%);mask:linear-gradient(to bottom,#000 80%,transparent 100%);
  animation:surge 1.6s var(--spring) .2s both}
.cap__sig{position:absolute;left:50%;bottom:9%;transform:translateX(-50%);white-space:nowrap;display:grid;gap:1px;text-align:center;
  padding:10px 20px;border-radius:999px;background:rgba(12,14,22,.72);border:1px solid var(--border-glass-strong);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}
.cap__sig strong{font-family:var(--f-display);font-weight:600;font-size:16px;line-height:1.2}
.cap__sig span{font-size:12px;color:var(--muted)}

/* ───────────── formulário ───────────── */
.form{width:100%;max-width:560px;padding:clamp(18px,2.2vw,26px);border-radius:24px;display:grid;gap:12px}
.form__open{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:13px;color:rgba(255,255,255,.7)}
.form__open .clock{height:34px}
/* destaque quando a pessoa chega ao formulário por um botão */
.form.is-alvo{animation:alvo 1.6s var(--spring) .45s both}
@keyframes alvo{0%{box-shadow:0 0 0 0 rgba(255,160,145,0)}35%{box-shadow:0 0 0 3px rgba(255,160,145,.55),0 0 60px -6px rgba(255,160,145,.45)}100%{box-shadow:0 0 0 0 rgba(255,160,145,0)}}
.field{display:grid;gap:4px}
.field--row{grid-template-columns:auto 1fr;gap:8px}
.field input{width:100%;height:54px;padding:0 18px;border-radius:14px;font:400 16px/1 var(--f-sans);color:#fff;
  background:rgba(255,255,255,.05);border:1px solid var(--border-glass-strong);outline:0;transition:border-color .25s,background .25s,box-shadow .25s}
.field input::placeholder{color:rgba(255,255,255,.45)}
.field input:focus{border-color:rgba(255,160,145,.7);background:rgba(255,255,255,.07);box-shadow:0 0 0 4px rgba(255,160,145,.12)}
.field.is-bad input{border-color:#ff6b5a}
.field__err{font-size:12.5px;color:#ff8a7a}
.field__err:empty{display:none}
.ddi{display:flex;align-items:center;gap:6px;height:54px;padding:0 14px;border-radius:14px;background:rgba(255,255,255,.05);border:1px solid var(--border-glass-strong);font-size:15px;color:rgba(255,255,255,.8)}
.form .btn{width:100%;height:58px;margin-top:2px;font-size:16px}
.form .btn[disabled]{opacity:.6;pointer-events:none}
.form__msg{font-size:14px;color:#ff8a7a;text-align:center}
.form__msg:empty{display:none}
.form__legal{font-size:12px;color:rgba(255,255,255,.55);line-height:1.5}
.form__legal a{color:#fff;text-decoration:underline;text-underline-offset:2px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* campo-isca para robôs: fora da tela, não aparece para pessoas */
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}

/* ───────────── o que você recebe ───────────── */
.gets{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.get{padding:26px;display:grid;gap:10px;align-content:start}
.get h3{font-family:var(--f-display);font-size:21px;font-weight:600}
.gets__cta{display:flex;justify-content:center;margin-top:clamp(36px,5vw,56px)}
.get p{font-size:15px;color:rgba(255,255,255,.7);line-height:1.55}

/* ───────────── especialista ───────────── */
.esp{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(36px,6vw,96px);align-items:center}
.esp__foto{position:relative;margin:0;justify-self:center;width:100%;max-width:460px;aspect-ratio:1}
.esp__foto::before{content:"";position:absolute;inset:6%;border-radius:50%;z-index:-1;background:radial-gradient(closest-side,rgba(255,160,145,.3),transparent 75%)}
.esp__foto img{width:100%;height:100%;object-fit:cover;object-position:center 25%;
  -webkit-mask:radial-gradient(50% 52% at 50% 46%,#000 64%,transparent 100%);mask:radial-gradient(50% 52% at 50% 46%,#000 64%,transparent 100%)}
.esp__txt{display:grid;gap:18px;justify-items:start}
.esp__txt p{font-size:16.5px;line-height:1.7;color:rgba(255,255,255,.78)}
.esp__txt p b{color:#fff;font-weight:600}
.esp__fatos{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;width:100%;margin:6px 0 4px}
.esp__fatos li{display:grid;gap:2px;padding:14px 12px;border-radius:16px;background:var(--surface-glass);border:1px solid var(--border-glass)}
.esp__fatos strong{font-family:var(--f-display);font-weight:600;font-size:20px;background:var(--grad-accent);-webkit-background-clip:text;background-clip:text;color:transparent}
.esp__fatos span{font-size:12.5px;color:rgba(255,255,255,.65);line-height:1.35}

/* ───────────── última chamada ───────────── */
.fim__card{display:grid;justify-items:center;text-align:center;gap:22px;padding:clamp(32px,5vw,64px) clamp(20px,4vw,56px);border-radius:32px;overflow:hidden;max-width:920px;margin:0 auto}
.fim__card::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(70% 60% at 50% 0%,rgba(255,160,145,.16),transparent 70%),radial-gradient(50% 50% at 50% 110%,rgba(255,210,122,.1),transparent 70%)}
.fim__card .lead{margin:0 auto;color:rgba(255,255,255,.75)}
.fim__clock{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;width:100%;max-width:560px}
.fim__clock div{display:grid;gap:4px;padding:18px 8px;border-radius:20px;background:rgba(255,255,255,.04);border:1px solid var(--border-glass-strong)}
.fim__clock b{font-family:var(--f-display);font-weight:600;font-size:clamp(34px,4.4vw,56px);line-height:1;font-variant-numeric:tabular-nums;
  background:var(--grad-accent);-webkit-background-clip:text;background-clip:text;color:transparent}
.fim__clock span{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.6)}
.fim__card .btn{min-width:min(100%,340px)}
.fim__chips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.fim__chips li{display:inline-flex;align-items:center;gap:8px;height:32px;padding:0 14px;border-radius:999px;background:var(--surface-glass);border:1px solid var(--border-glass);font-size:13px;color:rgba(255,255,255,.75)}
.fim__chips li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--grad-accent)}

/* ───────────── obrigado ───────────── */
.thanks{min-height:100vh;min-height:100svh;display:grid;align-items:center;padding:64px 0 64px;text-align:center}
.thanks__in{display:grid;justify-items:center;gap:22px;max-width:640px;margin:0 auto}
.thanks__check{position:relative;width:72px;height:72px;border-radius:50%;display:grid;place-items:center;background:var(--surface-icon)}
.thanks__check::before{content:"";position:absolute;inset:0;border-radius:50%;padding:1.5px;background:var(--grad-accent);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.thanks__check svg{width:28px;height:28px;color:var(--accent-gold)}
.thanks h1{font-family:var(--f-display);font-weight:600;font-size:clamp(34px,5vw,60px);line-height:1.04;letter-spacing:-.02em}
.thanks .lead{color:rgba(255,255,255,.75)}
.steps{display:grid;gap:14px;width:100%;margin-top:6px}
/* passo: número pequeno em cima, conteúdo centralizado embaixo */
.step{display:grid;justify-items:center;gap:10px;padding:26px 22px;border-radius:24px;text-align:center}
.step__n{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;font-family:var(--f-display);font-weight:600;font-size:15px;color:#030305;background:var(--grad-accent)}
.step h2{font-family:var(--f-display);font-weight:600;font-size:22px;line-height:1.2}
.step p{font-size:15px;color:rgba(255,255,255,.72);max-width:44ch}
.step p b{color:#fff;font-weight:500}
.step .btn{margin-top:6px}

/* ───────────── páginas legais ───────────── */
.legal{padding:clamp(56px,8vw,96px) 0 clamp(64px,8vw,110px)}
.legal__in{max-width:780px;margin:0 auto}
.legal__back{display:inline-flex;align-items:center;gap:8px;font-size:14px;color:rgba(255,255,255,.7);margin-bottom:28px}
.legal__back:hover{color:#fff}
.legal h1{font-family:var(--f-display);font-weight:600;font-size:clamp(36px,4.6vw,56px);line-height:1.05;letter-spacing:-.02em;margin-bottom:10px}
.legal__date{font-size:14px;color:rgba(255,255,255,.55);margin-bottom:36px}
.legal__doc{padding:clamp(24px,4vw,48px);border-radius:28px}
.legal__doc h2{font-family:var(--f-display);font-weight:600;font-size:clamp(21px,2vw,25px);line-height:1.25;margin:36px 0 12px}
.legal__doc h2:first-child{margin-top:0}
.legal__doc p,.legal__doc li{font-size:15.5px;line-height:1.7;color:rgba(255,255,255,.78)}
.legal__doc p+p{margin-top:12px}
.legal__doc ul{list-style:none;display:grid;gap:8px;margin:12px 0}
.legal__doc li{position:relative;padding-left:20px}
.legal__doc li::before{content:"";position:absolute;left:2px;top:.72em;width:6px;height:6px;border-radius:50%;background:var(--accent-warm)}
.legal__doc b{color:#fff;font-weight:600}
.legal__doc a{color:var(--accent-gold);text-decoration:underline;text-underline-offset:2px}
.legal__box{margin:14px 0;padding:16px 18px;border-radius:16px;background:rgba(255,255,255,.04);border:1px solid var(--border-glass)}
.pendente{color:#ffd27a;background:rgba(255,210,122,.12);padding:0 6px;border-radius:6px}

.mini-foot{padding:28px 0 36px;border-top:1px solid var(--border-glass)}
.mini-foot .foot__row{font-size:13px}

/* ───────────── responsivo ───────────── */
@media (max-width:1000px){
  .cap__grid{grid-template-columns:minmax(0,1fr);align-items:start}
  .cap__dra{order:-1;max-width:380px;margin-bottom:-90px}
  .cap__dra img{max-height:none}
  .cap__sig{display:none}
  .cap__txt{justify-items:center;text-align:center;position:relative;z-index:1}
  .cap__title{margin:0 auto}
  .form{margin:0 auto;text-align:left}
  .gets{grid-template-columns:minmax(0,1fr)}
  .esp{grid-template-columns:minmax(0,1fr)}
  .esp__foto{max-width:340px}
  .esp__txt{justify-items:center;text-align:center}
  .esp__fatos{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:680px){
  .cap{padding-top:8px}
  /* no celular a Dra. aparece da cabeça até as mãos. A foto fica um pouco mais
     estreita que o quadro (o braço não encosta na borda) e o próprio quadro
     esmaece: a base se dissolve no fundo, como no PC, e as laterais suavizam. */
  .cap__dra{width:min(92vw,370px);height:clamp(300px,48vh,440px);height:clamp(300px,48svh,440px);overflow:hidden;margin-bottom:-40px;
    -webkit-mask:linear-gradient(to bottom,#000 50%,transparent 97%);mask:linear-gradient(to bottom,#000 50%,transparent 97%)}
  .cap__dra::before{top:2%;width:100%}
  .cap__ring{top:40%;width:88%;transform:translate(-50%,-50%)}
  .cap__dra img{width:86%;height:auto;max-height:none;justify-self:center;object-fit:contain;-webkit-mask:none;mask:none}
  .cap__txt{gap:14px}
  .cap__title{font-size:8.4vw;line-height:1.06;max-width:none}
  .cap__sub{font-size:16px;max-width:none}
  .form{border-radius:22px;padding:14px;gap:10px}
  .field input,.ddi{height:50px}
  .form .btn{height:54px}
  .form__open{font-size:12px}
  .form__open{justify-content:center}
  .thanks{align-items:start;padding-top:56px}
  .step{padding:22px 18px}
  .step .btn{width:100%}
  .legal__doc{border-radius:22px}
  .fim__clock{gap:8px}
  .fim__clock div{padding:14px 4px;border-radius:16px}
  .fim__card .btn{width:100%}
  .gets__cta .btn{width:100%}
}