/* ================================================================
   Tokens
   ================================================================ */
:root{
  --bg:#09090b;
  --surface:#0e0e11;
  --surface-2:#131316;
  --line:rgba(255,255,255,.08);
  --line-strong:rgba(255,255,255,.14);
  --text:#ffffff;
  --muted:#a1a1aa;
  --orange:#ff6b2c;
  --amber:#ff6b2c;
  --grad:linear-gradient(90deg,#ff6b2c,#ff6b2c);
  /* Versão do gradiente para texto: laranja e âmbar já têm contraste AA no fundo escuro, então começa em 0% */
  --grad-text:linear-gradient(90deg,#ff6b2c 0%,#ff6b2c 100%);
  /* Texto sobre o gradiente: o laranja é claro demais para texto branco (2,8:1), o quase-preto dá 6,8:1 */
  --on-grad:#140b04;
  --wa:#25D366;

  --f-display:"Space Grotesk",system-ui,sans-serif;
  --f-body:"Inter",system-ui,sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,monospace;

  --r-card:14px;
  --r-input:10px;
  --ease-out:cubic-bezier(0.23,1,0.32,1);
  --ease-in-out:cubic-bezier(0.77,0,0.175,1);

  --container:1160px;
  --gutter:20px;
  --header-h:64px;
}

*,*::before,*::after{box-sizing:border-box}
html{color-scheme:dark;-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0;background:var(--bg);color:var(--text);
  font-family:var(--f-body);font-size:1rem;line-height:1.6;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
  -webkit-tap-highlight-color:transparent;
}
img,svg{display:block;max-width:100%}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
button,a,summary,select{touch-action:manipulation}
:focus-visible{outline:2px solid var(--amber);outline-offset:3px;border-radius:6px}
::selection{background:rgba(255,107,44,.28)}

.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:fixed;left:16px;top:-60px;z-index:100;background:var(--surface-2);border:1px solid var(--line-strong);padding:10px 16px;border-radius:999px;text-decoration:none;font-weight:600;transition:transform .2s var(--ease-out)}
.skip:focus-visible{transform:translateY(76px)}

.container{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:var(--gutter)}
@media (min-width:768px){:root{--gutter:32px}}

section{position:relative;scroll-margin-top:96px}
/* clip (e não hidden) para conter os glows sem quebrar o position:sticky */
main,.footer{overflow-x:clip}
main{position:relative}
.section{padding-block:64px}
@media (min-width:1024px){.section{padding-block:80px}}

/* ================================================================
   Tipografia
   ================================================================ */
h1,h2,h3{font-family:var(--f-display);font-weight:600;margin:0;text-wrap:balance}
h1{font-size:clamp(2.1rem,1.2rem + 3.3vw,3.4rem);line-height:1.06;letter-spacing:-.035em}
h2{font-size:clamp(1.85rem,1.2rem + 2.4vw,2.9rem);line-height:1.08;letter-spacing:-.03em}
h3{font-size:1.2rem;line-height:1.25;letter-spacing:-.015em}
p{margin:0;text-wrap:pretty}

.eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--f-mono);font-size:.78rem;font-weight:500;letter-spacing:.08em;
  text-transform:uppercase;color:var(--orange-ink);margin-bottom:18px;
}
.eyebrow::before{content:"";width:22px;height:1px;background:var(--grad)}
.lead{color:var(--muted);font-size:1.075rem;max-width:58ch;margin-top:18px}
.section-head{max-width:760px;margin-bottom:40px;position:relative}
@media (min-width:1024px){.section-head{margin-bottom:48px}}

/* Gradiente + inclinação controlada. A Space Grotesk não tem itálico real e o navegador
   inclinaria a fonte à força (bem mais), então o itálico é um skewX de 8 graus. */
.grad-italic{
  background:var(--grad-text);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  display:inline-block;transform:skewX(-8deg);
  padding:0 .1em .1em .02em;margin:0 -.04em -.1em 0; /* reserva para descendentes: "g", "p", "q" */
}


/* ================================================================
   Botões
   ================================================================ */
.btn{
  --bp:0%;
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:52px;padding:0 26px;border-radius:999px;border:0;cursor:pointer;
  font-family:var(--f-body);font-weight:600;font-size:1rem;white-space:nowrap;text-decoration:none;color:var(--on-grad);
  /* Texto escuro: contraste AA em toda a faixa do gradiente (6,8:1 no laranja, 11:1 no âmbar) */
  background:linear-gradient(90deg,#ff6b2c 0%,#ff6b2c 100%);
  background-size:200% 100%;background-position:var(--bp) 0;
  box-shadow:0 10px 30px -10px rgba(255,107,44,.55),inset 0 1px 0 rgba(23,18,14,.28);
  transition:background-position .45s var(--ease-out),box-shadow .3s ease,transform .16s var(--ease-out),filter .3s ease;
}
.btn svg{width:18px;height:18px;flex:none;transition:transform .25s var(--ease-out)}
@media (hover:hover) and (pointer:fine){
  .btn:hover{--bp:28%;filter:brightness(1.08);box-shadow:0 14px 40px -10px rgba(255,107,44,.4),0 10px 30px -12px rgba(255,107,44,.6),inset 0 1px 0 rgba(23,18,14,.35)}
  .btn:hover svg{transform:translateX(3px)}
}
.btn:active{transform:scale(.97)}
.btn-sm{min-height:42px;padding:0 18px;font-size:.92rem}
.btn-block{width:100%}

/* ================================================================
   Header
   ================================================================ */
.header{position:sticky;top:0;z-index:40;padding:12px var(--gutter) 0}
.header-bar{
  max-width:var(--container);margin-inline:auto;height:var(--header-h);
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:0 10px 0 20px;border-radius:999px;
  background:rgba(247,245,242,.62);border:1px solid var(--line);
  backdrop-filter:blur(18px) saturate(160%);-webkit-backdrop-filter:blur(18px) saturate(160%);
  box-shadow:inset 0 1px 0 rgba(23,18,14,.05);
  transition:background-color .3s ease,box-shadow .3s ease,border-color .3s ease;
}
.header.is-scrolled .header-bar{background:rgba(255,255,255,.82);border-color:var(--line-strong);box-shadow:0 18px 50px -20px rgba(23,18,14,0.22),inset 0 1px 0 rgba(23,18,14,.06)}
@media (prefers-reduced-transparency:reduce){.header-bar{background:#f7f5f2;backdrop-filter:none;-webkit-backdrop-filter:none}}
.logo{font-family:var(--f-display);font-weight:700;font-size:1.3rem;letter-spacing:-.03em;text-decoration:none;display:inline-flex;align-items:center;gap:9px}
.logo-mark{width:22px;height:22px;border-radius:7px;background:var(--grad);position:relative}
.logo-mark::after{content:"";position:absolute;inset:6px;border-radius:3px;background:var(--bg)}
.logo b{font-weight:700;background:var(--grad-text);-webkit-background-clip:text;background-clip:text;color:transparent}
.nav{display:none;gap:8px}
.nav a{padding:10px 14px;border-radius:999px;text-decoration:none;color:#3b342e;font-size:1rem;font-weight:500;transition:color .2s ease,background-color .2s ease}
/* seção que está na tela: marcada pelo IntersectionObserver no fim do script */
.nav a[aria-current="true"],.nav a[aria-current="page"]{color:#17120e;background:rgba(23,18,14,.08)}
@media (hover:hover) and (pointer:fine){.nav a:hover{color:#17120e;background:rgba(23,18,14,.06)}}
@media (min-width:1060px){.nav{display:flex}}
/* com folga na barra, os links respiram mais: o menu ocupa o espaço em vez de flutuar no meio dele */
@media (min-width:1240px){.nav a{padding:12px 20px}}
.cta-short{display:inline}.cta-long{display:none}
@media (min-width:560px){.cta-short{display:none}.cta-long{display:inline}}

/* ================================================================
   Hero
   ================================================================ */
.hero{padding:56px 0 64px;isolation:isolate}
@media (min-width:1024px){.hero{padding:72px 0 80px}}
.hero-grid{display:grid;gap:48px;align-items:center}
@media (min-width:1024px){.hero-grid{grid-template-columns:1.08fr .92fr;gap:56px}}
.hero .glow.g1{width:560px;height:420px;left:-180px;top:-60px}
.hero .glow.g2{width:420px;height:420px;right:-120px;top:120px;opacity:.35}
.hero-sub{color:var(--muted);font-size:1.1rem;max-width:54ch;margin-top:22px}
.hero-cta{margin-top:32px;display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.btn-row{display:flex;flex-wrap:wrap;gap:12px}
.micro{font-size:.88rem;color:var(--muted);display:flex;align-items:center;gap:8px}
.micro svg{width:16px;height:16px;color:var(--orange-ink)}

/* Entrada do hero ao carregar (sem depender de scroll) */
.js .hero-in{opacity:0;transform:translateY(14px);animation:heroIn .8s var(--ease-out) forwards;animation-delay:calc(var(--i,0) * 80ms + 60ms)}
@keyframes heroIn{to{opacity:1;transform:none}}

/* Conversa simulada (demonstração do produto) */
.chat{
  position:relative;border-radius:var(--r-card);background:rgba(255,255,255,.94);
  border:1px solid var(--line-strong);overflow:hidden;
  box-shadow:0 40px 80px -30px rgba(23,18,14,0.22),0 0 0 1px rgba(255,107,44,.05),0 0 80px -30px rgba(255,107,44,.35);
}
.chat::before{content:"";position:absolute;inset:0 0 auto;height:1px;background:var(--grad);opacity:.7;z-index:2}
.chat-bar{display:flex;align-items:center;gap:12px;padding:12px 14px;border-bottom:1px solid var(--line);background:rgba(23,18,14,.025)}
.chat-avatar{width:38px;height:38px;border-radius:50%;flex:none;display:grid;place-items:center;background:var(--grad)}
.chat-avatar i{width:14px;height:14px;border-radius:4px;border:3px solid #ffffff}
.chat-who{min-width:0;flex:1}
.chat-who strong{display:block;font-size:.95rem;font-weight:600;line-height:1.2}
.chat-who span{display:flex;align-items:center;gap:6px;font-size:.78rem;color:var(--muted)}
.chat-who span::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--amber)}
.chat-tag{font-family:var(--f-mono);font-size:.75rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);border:1px solid var(--line-strong);border-radius:999px;padding:4px 9px;white-space:nowrap}
.chat-body{
  height:400px;padding:18px 14px 20px;overflow:hidden;position:relative;
  background:radial-gradient(80% 60% at 100% 100%,rgba(255,107,44,.12),transparent 70%);
}
@media (min-width:480px){.chat-body{padding:20px 20px 22px;height:420px}}
.chat-body.is-scrolling{-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 48px);mask-image:linear-gradient(to bottom,transparent 0,#000 48px)}
.chat-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.chat-live .chat-list{transition:transform .5s var(--ease-out)}
.chat-day{align-self:center;font-family:var(--f-mono);font-size:.75rem;letter-spacing:.06em;color:var(--muted);background:rgba(23,18,14,.05);border-radius:999px;padding:4px 10px;margin-bottom:4px}
.msg{max-width:84%;padding:9px 12px 7px;border-radius:14px;font-size:.92rem;line-height:1.45}
.msg time{display:block;text-align:right;font-family:var(--f-mono);font-size:.75rem;color:var(--muted);margin-top:3px}
.msg-in{align-self:flex-start;background:#efebe6;border:1px solid var(--line);border-bottom-left-radius:4px;transform-origin:bottom left}
.msg-out{align-self:flex-end;background:linear-gradient(160deg,rgba(255,107,44,.55),rgba(255,107,44,.28));border:1px solid rgba(255,107,44,.3);border-bottom-right-radius:4px;transform-origin:bottom right}
.msg-out time{color:#5c554f}
.msg-by{display:block;font-family:var(--f-mono);font-size:.75rem;letter-spacing:.06em;text-transform:uppercase;color:var(--orange-ink);margin-bottom:3px}
.chat-done{align-self:center;display:inline-flex;align-items:center;gap:8px;margin-top:6px;font-size:.8rem;font-weight:500;color:#17120e;background:rgba(255,107,44,.1);border:1px solid rgba(255,107,44,.35);border-radius:999px;padding:6px 12px}
.chat-done svg{width:14px;height:14px;color:var(--orange-ink)}
.typing{align-self:flex-end;display:inline-flex;gap:4px;padding:12px 14px;border-radius:14px;border-bottom-right-radius:4px;background:rgba(255,107,44,.3);border:1px solid rgba(255,107,44,.2)}
.typing i{width:6px;height:6px;border-radius:50%;background:#c7d2fe;animation:typing 1s ease-in-out infinite}
.chat.is-paused .typing i{animation-play-state:paused}
.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
@keyframes typing{0%,60%,100%{opacity:.35;transform:none}30%{opacity:1;transform:translateY(-3px)}}
.chat-live .pop{animation:pop .32s var(--ease-out) both}
@keyframes pop{from{opacity:0;transform:translateY(8px) scale(.97)}}
.chat-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;border-top:1px solid var(--line);font-size:.8rem;color:var(--muted)}
/* Botão de pausa das animações automáticas (WCAG 2.2.2) */
.pause-btn{
  display:none;align-items:center;gap:6px;min-height:32px;padding:0 12px;border-radius:999px;cursor:pointer;
  background:transparent;border:1px solid var(--line-strong);color:var(--muted);font-size:.78rem;font-weight:500;
  transition:border-color .2s ease,color .2s ease,transform .16s var(--ease-out)
}
.pause-btn svg{width:12px;height:12px}
.js .pause-btn{display:inline-flex}
@media (hover:hover) and (pointer:fine){.pause-btn:hover{color:#17120e;border-color:rgba(255,107,44,.6)}}
.pause-btn:active{transform:scale(.97)}
.pause-btn .i-play{display:none}
.pause-btn[aria-pressed="true"] .i-play{display:block}
.pause-btn[aria-pressed="true"] .i-pause{display:none}
.chat-live{display:none}
.js .chat-live{display:block}
.chat-static{height:auto}
.js .chat-static{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* Movimento reduzido: conversa inteira estática, sem botão de pausa */
@media (prefers-reduced-motion:reduce){
  .js .chat-live{display:none}
  .js .chat-static{position:static;width:auto;height:auto;margin:0;padding:18px 14px 20px;overflow:visible;clip:auto;white-space:normal}
  .js .pause-btn{display:none}
  .typing i{animation:none}
}

/* ================================================================
   01 Problema
   ================================================================ */
.pain-grid{display:grid;gap:14px}
@media (min-width:768px){.pain-grid{grid-template-columns:1fr 1fr;gap:16px}}
.card{
  position:relative;border-radius:var(--r-card);background:var(--surface);border:1px solid var(--line);
  padding:28px 26px;
  transition:transform .35s var(--ease-out),border-color .3s ease,box-shadow .35s ease;
}
@media (hover:hover) and (pointer:fine){
  .card:hover{transform:translateY(-4px);border-color:rgba(255,107,44,.55);box-shadow:0 18px 50px -24px rgba(255,107,44,.45),0 0 0 1px rgba(255,107,44,.12)}
}
.card p{color:var(--muted);margin-top:10px;max-width:46ch}

/* Cada dor mostra o sintoma acontecendo no WhatsApp (ilustrativo, escondido de leitores de tela) */
.pain .card{
  display:flex;flex-direction:column;padding:0;overflow:hidden;
  background:radial-gradient(120% 90% at 100% 0%,rgba(255,107,44,.14),transparent 60%),var(--surface);
}
.pain .card h3{font-size:1.3rem}
.pain-txt{padding:22px 24px 26px}
.sym{
  height:156px;padding:22px 24px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:10px;
  border-bottom:1px solid var(--line);
  background:radial-gradient(rgba(23,18,14,.05) 1px,transparent 1px) 0 0 / 14px 14px,
    rgba(255,255,255,.55);
}
.sym svg{flex:none}
.s-bubble{
  max-width:240px;padding:9px 12px 7px;border-radius:14px;border-bottom-left-radius:4px;
  background:#efebe6;border:1px solid var(--line);font-size:.92rem;line-height:1.4
}
.s-bubble time{display:block;text-align:right;font-family:var(--f-mono);font-size:.75rem;color:var(--muted);margin-top:2px}
.s-chip{
  display:inline-flex;align-items:center;gap:7px;padding:5px 11px;border-radius:999px;
  font-family:var(--f-mono);font-size:.75rem;color:#2b2520;background:rgba(23,18,14,.06);border:1px dashed rgba(23,18,14,.22)
}
.s-chip svg{width:13px;height:13px;color:var(--muted)}
.s-slot{display:flex;align-items:stretch;border-radius:12px;border:1px dashed rgba(23,18,14,.22);overflow:hidden;min-width:min(100%,280px)}
.s-slot-time{display:grid;place-items:center;padding:0 14px;font-family:var(--f-mono);font-size:.95rem;color:var(--muted);text-decoration:line-through;background:rgba(23,18,14,.04);border-right:1px dashed rgba(23,18,14,.18)}
.s-slot-body{padding:10px 14px;line-height:1.35}
.s-slot-body strong{display:block;font-size:.92rem;font-weight:600}
.s-slot-body span{font-size:.82rem;color:var(--muted)}
.s-inbox{display:flex;align-items:center;gap:14px}
.s-ic{position:relative;width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:#efebe6;border:1px solid var(--line)}
.s-ic svg{width:24px;height:24px;color:#2b2520}
.s-badge{position:absolute;top:-8px;right:-10px;min-width:24px;height:24px;padding:0 6px;border-radius:999px;display:grid;place-items:center;background:var(--grad);color:var(--on-grad);font-family:var(--f-mono);font-size:.75rem;font-weight:700;box-shadow:0 0 0 3px #0d0d10}
.s-inbox strong{display:block;font-size:.95rem;font-weight:600;line-height:1.3}
.s-inbox span.sub{font-size:.82rem;color:var(--muted)}
.s-stats{display:grid;grid-template-columns:repeat(3,auto);gap:8px;margin:0}
.s-stats div{padding:9px 14px;border-radius:12px;background:#efebe6;border:1px solid var(--line)}
.s-stats dd{margin:0;font-family:var(--f-mono);font-size:1.35rem;font-weight:500;line-height:1.1}
.s-stats dt{font-size:.76rem;color:var(--muted);margin-top:2px}
.s-stats div{display:flex;flex-direction:column-reverse}
.s-stats .q{background:none;border-style:dashed;border-color:rgba(23,18,14,.22)}
.s-stats .q dd{color:var(--muted)}
.closer{
  position:relative;margin-top:48px;font-family:var(--f-display);font-weight:500;
  font-size:clamp(1.35rem,1rem + 1.4vw,2rem);line-height:1.25;letter-spacing:-.02em;
}
/* desktop: a frase principal em uma linha só, sem quebrar "dinheiro na mesa" */
@media (min-width:900px){.closer .grad-italic{white-space:nowrap}}
/* no fecho, só o gradiente: sem inclinação, para as linhas ficarem alinhadas */
.closer .grad-italic{display:block;width:fit-content;transform:none;padding:0 0 .08em;margin:0}
/* a segunda frase lê como conclusão: tamanho de subtítulo */
.closer .rest{display:block;margin-top:14px;max-width:52ch;font-family:var(--f-body);font-size:1.075rem;font-weight:400;line-height:1.6;letter-spacing:0;color:var(--muted)}

/* ================================================================
   02 Método
   ================================================================ */
.method{background:linear-gradient(180deg,transparent,rgba(247,245,242,.7) 18%,rgba(247,245,242,.7) 82%,transparent)}
.steps{display:grid;gap:14px;position:relative;list-style:none;margin:0;padding:0}
@media (min-width:900px){.steps{grid-template-columns:repeat(3,1fr);gap:16px}}
.step{position:relative;padding:28px 26px 30px;border-radius:var(--r-card);border:1px solid var(--line);background:rgba(255,255,255,.6)}
.step-n{
  font-family:var(--f-mono);font-weight:600;font-size:2.6rem;line-height:1;letter-spacing:-.04em;
  background:var(--grad-text);-webkit-background-clip:text;background-clip:text;color:transparent;
  display:inline-block;margin-bottom:26px;
}
.step p{color:var(--muted);margin-top:10px}
.steps-wrap{position:relative}
.step-rail{display:none}
@media (min-width:900px){
  /* top = metade da altura do .step-n (2.6rem, line-height 1): a régua corta o centro do número, nunca o título */
  .step-rail{display:block;position:absolute;left:26px;right:26px;top:1.3rem;height:1px;background:var(--line);z-index:0}
  .step-rail i{position:absolute;inset:0;background:var(--grad);transform-origin:left;transform:scaleX(1)}
  .js .step-rail i{transform:scaleX(0);transition:transform 1.4s var(--ease-in-out) .2s}
  .js .steps-wrap.in .step-rail i{transform:scaleX(1)}
  .step{background:transparent;border:0;padding:0 26px 0 0}
  .step-n{position:relative;background-color:var(--bg);padding-right:14px}
}
.method-close{margin-top:44px;display:flex;flex-wrap:wrap;align-items:center;gap:18px 28px}
.method-close p{font-family:var(--f-display);font-size:1.35rem;font-weight:500;letter-spacing:-.02em}

/* CTA intermediário depois de "Para quem": sem caixa, só uma linha fina acima */
.who-cta{margin-top:40px;padding-top:28px;border-top:1px solid var(--line);display:flex;flex-direction:column;align-items:flex-start;gap:20px}
.who-cta p{font-family:var(--f-display);font-weight:500;font-size:clamp(1.2rem,1rem + .8vw,1.5rem);line-height:1.3;letter-spacing:-.02em;max-width:34ch}
@media (min-width:900px){.who-cta{flex-direction:row;align-items:center;justify-content:space-between;gap:32px}}

/* ================================================================
   03 Comparação
   ================================================================ */
.compare{position:relative}
.compare .glow{width:520px;height:360px;right:-160px;top:40px;opacity:.4}
.cmp{position:relative;display:grid;gap:14px}
.cmp-row{display:grid;gap:10px}
.cmp-head{display:none}
.cmp-aspect{font-family:var(--f-mono);font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:var(--orange-ink)}
.cmp-cell{border-radius:12px;padding:16px 18px;font-size:.98rem}
.cmp-cell .tag{display:block;font-family:var(--f-mono);font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;margin-bottom:6px}
.cmp-sem{background:rgba(23,18,14,.02);border:1px solid var(--line);color:#8b8b95}
.cmp-sem .tag{color:#8b8b95}
.cmp-com{background:linear-gradient(180deg,rgba(255,107,44,.18),rgba(247,245,242,.9));border:1px solid rgba(255,107,44,.45);box-shadow:0 0 30px -12px rgba(255,107,44,.5);color:#17120e}
.cmp-com .tag{color:var(--orange-ink)}
.cmp-row{padding:18px;border:1px solid var(--line);border-radius:var(--r-card);background:var(--surface)}
.cmp-hl{display:none}
.x-ic,.ok-ic{display:none}
@media (min-width:900px){
  .cmp{grid-template-columns:.7fr 1.15fr 1.15fr;gap:0;column-gap:16px}
  .cmp-row{display:contents}
  .cmp-head{display:contents}
  .cmp-head > div{padding:20px 24px;font-family:var(--f-mono);font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
  .cmp-head .h-com{color:var(--orange-ink);font-weight:600}
  .cmp-hl{
    display:block;grid-column:3;grid-row:1 / span 6;border-radius:var(--r-card);
    border:1px solid rgba(255,107,44,.5);
    background:linear-gradient(180deg,rgba(255,107,44,.2),rgba(247,245,242,.85) 60%);
    box-shadow:0 0 0 1px rgba(255,107,44,.08),0 30px 80px -30px rgba(255,107,44,.5),inset 0 1px 0 rgba(23,18,14,.08);
    position:relative;
  }
  .cmp-hl::before{content:"";position:absolute;left:24px;right:24px;top:-1px;height:2px;border-radius:2px;background:var(--grad)}
  /* filhos de .cmp: 1 = destaque, 2 = cabeçalho, 3 a 7 = linhas */
  .cmp > .cmp-row:nth-child(3) > *{grid-row:2}
  .cmp > .cmp-row:nth-child(4) > *{grid-row:3}
  .cmp > .cmp-row:nth-child(5) > *{grid-row:4}
  .cmp > .cmp-row:nth-child(6) > *{grid-row:5}
  .cmp > .cmp-row:nth-child(7) > *{grid-row:6}
  .cmp-aspect{grid-column:1}
  .cmp-sem{grid-column:2}
  .cmp-com{grid-column:3}
  .cmp-aspect,.cmp-cell{position:relative;z-index:1;display:flex;align-items:center;gap:12px;padding:22px 24px;border-radius:0;border:0;background:none;box-shadow:none}
  .cmp-aspect{font-size:.82rem;border-top:1px solid var(--line)}
  .cmp-sem{border-top:1px solid var(--line)}
  .cmp-com{border-top:1px solid rgba(255,107,44,.14)}
  .cmp-cell .tag{display:none}
  .x-ic,.ok-ic{display:block;flex:none;width:18px;height:18px}
  .x-ic{color:#c9c2bb}
  .ok-ic{color:var(--orange-ink)}
}

/* ================================================================
   04 Para quem
   ================================================================ */
.who-rows{display:grid;gap:12px}
.who-row{display:grid;gap:14px;padding:24px 22px;align-items:center}
.who-label{font-family:var(--f-mono);font-size:.76rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.who-row h3{font-size:1.3rem}
.who-row p{max-width:56ch}
.who-row .who-fit{margin:0;max-width:none}
@media (min-width:900px){
  .who-row{grid-template-columns:190px minmax(0,1fr) auto;gap:36px;padding:28px 32px}
  .who-row .who-fit{justify-self:end}
}
.who-fit span{
  display:inline-flex;align-items:center;gap:8px;padding:7px 13px;border-radius:999px;
  font-size:.84rem;font-weight:500;color:#17120e;white-space:nowrap;background:rgba(255,107,44,.08);border:1px solid rgba(255,107,44,.35)
}
.who-fit svg{width:14px;height:14px;color:var(--orange-ink)}
.who-fit b{font-family:var(--f-mono);font-weight:500;font-size:.75rem;letter-spacing:.06em;text-transform:uppercase;color:var(--orange-ink)}

/* Prova social (seção comentada no HTML até ter clientes reais) */
.proof-grid{display:grid;gap:14px}
@media (min-width:900px){.proof-grid{grid-template-columns:1.2fr .8fr;gap:16px}}
.proof-card{margin:0;display:flex;flex-direction:column;justify-content:space-between;gap:24px}
.proof-card blockquote{margin:0;font-family:var(--f-display);font-size:clamp(1.3rem,1rem + 1vw,1.7rem);line-height:1.3;letter-spacing:-.015em}
.proof-card figcaption{display:flex;align-items:center;gap:12px}
.proof-card figcaption img{width:48px;height:48px;border-radius:50%;object-fit:cover}
.proof-card figcaption strong{display:block;color:#17120e}
.proof-card figcaption span{color:var(--muted);font-size:.9rem;line-height:1.35}
.proof-print{width:100%;height:auto;border-radius:10px}

/* ================================================================
   05 Fundador
   ================================================================ */
.founder-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:20px;align-items:end}
@media (min-width:600px){.founder-grid{gap:32px}}
@media (min-width:900px){.founder-grid{grid-template-columns:1.25fr 1fr;gap:64px}}
.photo-wrap{position:relative;isolation:isolate}
.photo-frame{padding:1px;border-radius:22px;background:linear-gradient(140deg,rgba(255,107,44,.9),rgba(255,107,44,.6) 35%,rgba(23,18,14,.06) 70%)}
/* Placeholder da foto: trocar por <img src="henrique.jpg" alt="Henrique Pozzobon" width="960" height="1200"> */
.photo{
  aspect-ratio:4 / 5;width:100%;border-radius:21px;
  background:linear-gradient(160deg,#e4dfd9,#efebe6 60%,#efebe6);
  position:relative;overflow:hidden;
}
.photo::after{content:"";position:absolute;inset:0;background:radial-gradient(60% 50% at 50% 40%,rgba(23,18,14,.05),transparent 70%)}
.photo img{width:100%;height:100%;object-fit:cover}
@media (min-width:900px){.photo{aspect-ratio:5 / 6}}
.founder-meta{padding-bottom:8px}
.founder-name{font-family:var(--f-display);font-weight:600;font-size:clamp(1.7rem,1rem + 3.8vw,4.4rem);line-height:1;letter-spacing:-.04em}
.founder-line{height:2px;width:clamp(64px,12vw,120px);background:var(--grad);border-radius:2px;margin:clamp(14px,3vw,28px) 0 clamp(10px,2vw,20px);transform-origin:left}
.founder-meta .eyebrow{font-size:clamp(.66rem,.6rem + .3vw,.78rem)}
@media (max-width:599px){.founder-meta .eyebrow::before{display:none}.founder-role{font-size:.82rem}}
.js .founder-line{transform:scaleX(0);transition:transform 1.1s var(--ease-in-out) .25s}
.js .founder-meta.in .founder-line{transform:scaleX(1)}
.founder-role{font-family:var(--f-mono);font-size:1rem;color:var(--muted);letter-spacing:.02em}

/* ================================================================
   06 Na prática: prévia do CRM (a IA move os contatos sozinha)
   ================================================================ */
.crm-sec .glow{width:560px;height:380px;left:-200px;top:0;opacity:.35}
.crm{border-radius:18px;border:1px solid var(--line-strong);background:rgba(247,245,242,.85);overflow:hidden;box-shadow:0 40px 90px -40px rgba(23,18,14,0.22)}
.crm-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;border-bottom:1px solid var(--line);background:rgba(23,18,14,.02)}
.crm-title{display:flex;align-items:center;gap:10px;font-weight:600;font-size:.95rem}
.crm-title .chat-tag{font-weight:400}
.crm-board{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line)}
@media (min-width:900px){.crm-board{grid-template-columns:repeat(4,minmax(0,1fr))}}
.crm-col{background:var(--surface);padding:14px 10px 16px;min-width:0}
@media (min-width:600px){.crm-col{padding:16px 14px 18px}}
.crm-col header{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 4px 12px}
.crm-col h3{font-family:var(--f-body);font-size:.84rem;font-weight:600;letter-spacing:0;color:#2b2520}
.crm-col .count{font-family:var(--f-mono);font-size:.75rem;color:var(--muted);min-width:22px;height:22px;padding:0 6px;border-radius:999px;display:grid;place-items:center;background:rgba(23,18,14,.05)}
.crm-col[data-col="agendado"] h3{color:var(--orange-ink)}
.crm-col[data-col="agendado"] .count{color:var(--orange-ink);background:rgba(255,107,44,.1)}
.crm-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;min-height:238px}
@media (min-width:900px){.crm-list{min-height:236px}}
.crm-card{
  position:relative;display:flex;align-items:flex-start;gap:10px;padding:11px 12px;border-radius:12px;
  background:#f1eee9;border:1px solid var(--line);
  transition:border-color .6s ease,box-shadow .6s ease;will-change:transform
}
.crm-card.flash{border-color:rgba(255,107,44,.65);box-shadow:0 0 0 1px rgba(255,107,44,.18),0 10px 30px -12px rgba(255,107,44,.55);transition:border-color .15s ease,box-shadow .15s ease}
.crm-av{width:30px;height:30px;flex:none;border-radius:50%;display:grid;place-items:center;font-size:.75rem;font-weight:600;color:#2b2520;background:#efebe6;border:1px solid var(--line-strong)}
.crm-card > div{min-width:0}
.crm-card strong{display:block;font-size:.88rem;font-weight:600;line-height:1.3}
.crm-st{display:block;font-size:.78rem;line-height:1.35;color:var(--muted);margin-top:2px}
.crm-st .ia{display:inline-block;font-family:var(--f-mono);font-size:.75rem;font-weight:600;letter-spacing:.04em;color:var(--on-grad);background:var(--grad);border-radius:4px;padding:1px 5px;margin-right:4px;vertical-align:1px}
.crm-col[data-col="retomar"] .crm-card{border-style:dashed;border-color:rgba(23,18,14,.2)}
.crm-col[data-col="retomar"] .crm-card.flash{border-style:solid;border-color:rgba(255,107,44,.65)}
.crm-log{display:flex;align-items:center;gap:10px;min-height:46px;padding:12px 18px;border-top:1px solid var(--line);font-size:.86rem;color:#2b2520}
.crm-log i{width:8px;height:8px;flex:none;border-radius:50%;background:var(--amber)}
.crm-log span{transition:opacity .25s ease}
.crm-log span.swap{opacity:0}
.js .crm.live .crm-log i{animation:pulse 2s ease-out infinite}
@keyframes pulse{70%{box-shadow:0 0 0 8px rgba(255,107,44,0)}100%{box-shadow:0 0 0 0 rgba(255,107,44,0)}}
.crm-card.enter{animation:pop .35s var(--ease-out) both}
@media (prefers-reduced-motion:reduce){.js .crm.live .crm-log i{animation:none}.crm-card.enter{animation:none}}
/* celular: sem avatar e card mais compacto, para caber em 2 colunas sem quebrar demais */
@media (max-width:599px){
  .crm-av{display:none}
  .crm-list{min-height:250px}
  .crm-card{padding:9px 10px}
  .crm-card strong{font-size:.84rem}
  .crm-st{font-size:.75rem}
  .crm-top{padding:12px 14px}
  .crm-log{padding:12px 14px;font-size:.8rem}
}

/* ================================================================
   07 FAQ
   ================================================================ */
.faq-grid{display:grid;gap:40px}
@media (min-width:900px){.faq-grid{grid-template-columns:.8fr 1.2fr;gap:64px;align-items:start}.faq-grid .section-head{position:sticky;top:120px}}
.faq-list{display:grid;gap:10px}
.faq-item{border-radius:var(--r-card);border:1px solid var(--line);background:var(--surface);transition:border-color .3s ease,background-color .3s ease}
.faq-item[open]{border-color:rgba(255,107,44,.4);background:linear-gradient(180deg,rgba(255,107,44,.1),var(--surface) 70%)}
@media (hover:hover) and (pointer:fine){.faq-item:not([open]):hover{border-color:var(--line-strong)}}
.faq-item summary{
  list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:20px 22px;font-family:var(--f-display);font-weight:500;font-size:1.1rem;letter-spacing:-.01em;border-radius:var(--r-card);
}
.faq-item summary::-webkit-details-marker{display:none}
.plus{position:relative;width:28px;height:28px;flex:none;border-radius:50%;border:1px solid var(--line-strong);transition:transform .3s var(--ease-out),border-color .3s ease}
.plus::before,.plus::after{content:"";position:absolute;left:50%;top:50%;width:11px;height:1.5px;background:currentColor;transform:translate(-50%,-50%)}
.plus::after{transform:translate(-50%,-50%) rotate(90deg);transition:transform .3s var(--ease-out)}
.faq-item[open] .plus{transform:rotate(180deg);border-color:rgba(255,107,44,.6);color:var(--orange-ink)}
.faq-item[open] .plus::after{transform:translate(-50%,-50%) rotate(0deg)}
.faq-body{padding:0 22px 22px;color:var(--muted);max-width:62ch}
.faq-item[open] .faq-body{animation:faqIn .35s var(--ease-out)}
@keyframes faqIn{from{opacity:0;transform:translateY(-6px)}}
@media (prefers-reduced-motion:reduce){.faq-item[open] .faq-body{animation:none}}

/* ================================================================
   08 CTA + Formulário
   ================================================================ */
.final{isolation:isolate}
.final .glow.g1{width:640px;height:460px;left:-220px;top:40px;opacity:.55}
.final .glow.g2{width:420px;height:420px;right:-160px;bottom:0;opacity:.3}
.final-grid{display:grid;gap:40px}
@media (min-width:1024px){.final-grid{grid-template-columns:.9fr 1.1fr;gap:64px;align-items:start}.final-copy{position:sticky;top:120px}}
.final-copy .micro{margin-top:24px}
.form-card{position:relative;border-radius:18px;padding:1px;background:linear-gradient(150deg,rgba(255,107,44,.55),rgba(255,107,44,.35) 40%,rgba(23,18,14,.07) 75%)}
.form-inner{border-radius:17px;background:rgba(247,245,242,.96);padding:26px 20px}
@media (min-width:600px){.form-inner{padding:34px 32px}}
.form-grid{display:grid;gap:18px}
@media (min-width:600px){.form-grid{grid-template-columns:1fr 1fr}.form-grid .full{grid-column:1 / -1}}
.field{display:flex;flex-direction:column;gap:8px;min-width:0}
.field label{font-size:.9rem;font-weight:500;color:#2b2520}
.field label .opt{color:var(--muted);font-weight:400}
.input{
  width:100%;min-height:50px;padding:12px 14px;border-radius:var(--r-input);
  background:#ffffff;color:#17120e;border:1px solid rgba(23,18,14,.14);
  transition:border-color .2s ease,box-shadow .2s ease,background-color .2s ease;
  -webkit-appearance:none;appearance:none;font-size:1rem;
}
.input::placeholder{color:#8b8b95}
.input:hover{border-color:rgba(23,18,14,.24)}
.input:focus{outline:none;border-color:var(--amber);box-shadow:0 0 0 3px rgba(255,107,44,.22);background:#ffffff}
textarea.input{min-height:112px;resize:vertical;line-height:1.5}
select.input{
  cursor:pointer;padding-right:42px;background-color:#ffffff;color:#17120e;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23a1a1aa' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 16px center;
}
select.input option{background:#f7f5f2;color:#17120e}
select.input:has(option[value=""]:checked){color:#8b8b95}
.input[aria-invalid="true"]{border-color:#fff;box-shadow:0 0 0 3px rgba(23,18,14,.14)}
.err{display:none;font-size:.85rem;font-weight:500;color:#17120e;align-items:center;gap:8px}
.err::before{content:"!";display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#fff;color:#17120e;font-size:.75rem;font-weight:700;flex:none}
.field.has-err .err{display:flex}
.form-foot{margin-top:24px;display:grid;gap:12px}
.form-foot .micro{justify-content:center;text-align:center}
.privacy-note{display:block;font-size:.8rem;margin-top:-4px}
.privacy-note a{color:#2b2520;text-underline-offset:3px}
@media (hover:hover) and (pointer:fine){.privacy-note a:hover{color:var(--orange-ink)}}

/* Política de privacidade (dialog nativo) */
.policy{
  width:min(680px,calc(100vw - 32px));max-height:min(86vh,860px);padding:0;border-radius:18px;
  border:1px solid var(--line-strong);background:var(--surface);color:var(--text);overscroll-behavior:contain;
  box-shadow:0 40px 100px -30px rgba(23,18,14,0.22);
}
.policy[open]{animation:policyIn .24s var(--ease-out)}
@keyframes policyIn{from{opacity:0;transform:translateY(10px) scale(.98)}}
.policy::backdrop{background:rgba(4,4,6,.72);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.policy-head{position:sticky;top:0;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 24px;background:var(--surface);border-bottom:1px solid var(--line)}
.policy-head h2{font-size:1.4rem}
.policy-close{width:40px;height:40px;flex:none;border-radius:50%;border:1px solid var(--line-strong);background:transparent;color:#17120e;cursor:pointer;display:grid;place-items:center;transition:border-color .2s ease}
.policy-close:hover{border-color:rgba(255,107,44,.6)}
.policy-close svg{width:16px;height:16px}
.policy-body{padding:8px 24px 28px;color:var(--muted);font-size:.95rem}
.policy-body h3{color:#17120e;font-size:1.02rem;margin:22px 0 6px}
.policy-body ul{margin:6px 0 0;padding-left:20px}
.policy-body li{margin-top:4px}
.policy-body a{color:#17120e}
.policy-updated{font-family:var(--f-mono);font-size:.78rem;margin-top:14px}
@media (prefers-reduced-motion:reduce){.policy[open]{animation:none}}
.btn[aria-busy="true"]{pointer-events:none;filter:saturate(.8)}

.success{display:none;text-align:left}
.success:focus{outline:none}
.success-ic{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;background:var(--grad);box-shadow:0 12px 30px -10px rgba(255,107,44,.6);margin-bottom:22px}
.success-ic svg{width:26px;height:26px;color:var(--on-grad)}
.success h3{font-size:1.6rem}
.success p{color:var(--muted);margin-top:10px}
.success-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.btn-ghost{
  display:inline-flex;align-items:center;min-height:52px;padding:0 22px;border-radius:999px;cursor:pointer;
  background:transparent;border:1px solid var(--line-strong);color:#17120e;font-weight:500;text-decoration:none;
  transition:border-color .2s ease,background-color .2s ease,transform .16s var(--ease-out)
}
@media (hover:hover) and (pointer:fine){.btn-ghost:hover{border-color:rgba(255,107,44,.6);background:rgba(255,107,44,.06)}}
.btn-ghost:active{transform:scale(.97)}
.form-card.done .form-view{display:none}
.form-card.done .success{display:block}
.js .form-card.done .success{animation:heroIn .5s var(--ease-out) both}

/* ================================================================
   Footer
   ================================================================ */
.footer{border-top:1px solid var(--line);padding:40px 0 calc(40px + env(safe-area-inset-bottom))}
@media (max-width:767px){.footer{padding-bottom:calc(104px + env(safe-area-inset-bottom))}} /* espaço para o botão do WhatsApp */
.footer-inner{display:flex;flex-direction:column;gap:20px}
@media (min-width:768px){.footer-inner{flex-direction:row;align-items:center;justify-content:space-between}}
.footer p{color:var(--muted);font-size:.9rem}
.footer .legal{font-size:.8rem;margin-top:4px;color:#8b8b95}
.footer-links{display:flex;flex-wrap:wrap;gap:20px;align-items:center}
@media (max-width:767px){.footer-links{flex-direction:column;align-items:flex-start;gap:12px}}
.footer-links a{color:var(--muted);text-decoration:none;font-size:.9rem;transition:color .2s ease}
@media (hover:hover) and (pointer:fine){.footer-links a:hover{color:#17120e}}

/* ================================================================
   Widget WhatsApp
   ================================================================ */
/* a moldura não recebe toque (senão engole cliques em tudo que passa por baixo dela, mesmo com o balão escondido);
   só o botão e o balão visível recebem */
.wa{position:fixed;right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));z-index:50;display:flex;flex-direction:column;align-items:flex-end;gap:12px;pointer-events:none}
.wa-btn,.wa-bubble.show{pointer-events:auto}
.wa-btn{
  width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:var(--wa);color:#17120e;text-decoration:none;
  box-shadow:0 12px 30px -8px rgba(37,211,102,.55),0 4px 12px rgba(23,18,14,0.10);
  transition:transform .2s var(--ease-out),box-shadow .3s ease;
}
.wa-btn svg{width:30px;height:30px}
@media (hover:hover) and (pointer:fine){.wa-btn:hover{transform:scale(1.06);box-shadow:0 16px 40px -8px rgba(37,211,102,.7),0 4px 12px rgba(23,18,14,0.10)}}
.wa-btn:active{transform:scale(.96)}
.wa-bubble{
  position:relative;width:min(290px,calc(100vw - 32px));padding:16px 16px 16px 18px;border-radius:16px 16px 4px 16px;
  background:#f4f4f5;color:#17120e;box-shadow:0 24px 60px -18px rgba(23,18,14,0.22);
  transform-origin:bottom right;
  opacity:0;transform:translateY(8px) scale(.96);visibility:hidden;
  transition:opacity .28s var(--ease-out),transform .28s var(--ease-out),visibility 0s linear .28s;
}
.wa-bubble.show{opacity:1;transform:none;visibility:visible;transition:opacity .28s var(--ease-out),transform .28s var(--ease-out),visibility 0s}
.wa-bubble p{font-size:.93rem;line-height:1.45;padding-right:24px}
.wa-bubble strong{display:block;font-family:var(--f-display);font-size:1rem;margin-bottom:4px}
.wa-bubble a{
  display:inline-flex;align-items:center;gap:8px;margin-top:12px;padding:9px 14px;border-radius:999px;
  background:var(--wa);color:#17120e;font-weight:600;font-size:.9rem;text-decoration:none;transition:filter .2s ease,transform .16s var(--ease-out)
}
.wa-bubble a:active{transform:scale(.97)}
@media (hover:hover) and (pointer:fine){.wa-bubble a:hover{filter:brightness(1.06)}}
.wa-close{position:absolute;top:8px;right:8px;width:32px;height:32px;border-radius:50%;border:0;background:transparent;color:#c9c2bb;cursor:pointer;display:grid;place-items:center}
.wa-close:hover{background:rgba(0,0,0,.06)}
.wa-close svg{width:14px;height:14px}
/* Balão some enquanto o formulário está na tela, para não cobrir os campos */
.wa.is-muted .wa-bubble.show{opacity:0;visibility:hidden;transform:translateY(8px) scale(.96);transition:opacity .2s ease,transform .2s ease,visibility 0s linear .2s}
@media (prefers-reduced-motion:reduce){.wa-bubble,.wa-bubble.show,.wa.is-muted .wa-bubble.show{transform:none}}

/* ================================================================
   Reveal no scroll
   ================================================================ */
.js .reveal{opacity:0;transform:translateY(18px);transition:opacity .75s var(--ease-out),transform .75s var(--ease-out);transition-delay:calc(var(--d,0) * 70ms)}
.js .reveal.in{opacity:1;transform:none}

/* Movimento reduzido: só opacidade, sem deslocamento */
@media (prefers-reduced-motion:reduce){
  .js .hero-in{animation:fadeOnly .4s ease forwards;transform:none}
  @keyframes fadeOnly{from{opacity:0}to{opacity:1}}
  .js .reveal{transform:none;transition:opacity .4s ease}
  .card,.btn,.wa-btn{transition-property:border-color,box-shadow,background-position,filter}
  .card:hover{transform:none!important}
  .js .step-rail i,.js .founder-line{transition:none;transform:scaleX(1)}
  .chart .dot,.chart .dot-halo{transition:none}
}
/* logo novo (kit pozzia-logo): SVG embutido, altura fixa, largura proporcional */
.logo-svg{display:block;height:30px;width:auto;flex:none}
.logo-svg-footer{height:34px}
@media (max-width:420px){.logo-svg{height:26px}}

/* avatar da conversa: símbolo novo em carvão sobre o laranja */
.chat-avatar svg{width:64%;height:64%;color:#171E19;display:block}

/* ================================================================
   Multi-página: migalhas, produtos, combo, busca com IA, entregas
   ================================================================ */
.crumb{margin-bottom:26px;font-size:.88rem;color:var(--muted)}
.crumb ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.crumb li+li::before{content:"/";margin-right:8px;color:#c9c2bb}
.crumb a{text-underline-offset:3px}
@media (hover:hover) and (pointer:fine){.crumb a:hover{color:#17120e}}

.checks{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:10px}
.checks li{display:flex;gap:12px;color:#3b342e;line-height:1.5}
.checks li::before{
  content:"";flex:none;width:18px;height:18px;margin-top:3px;background:var(--amber);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Produtos: dois blocos de peso igual, cada um com sua prévia */
.prod-grid{display:grid;gap:16px}
@media (min-width:900px){.prod-grid{grid-template-columns:1fr 1fr}}
.prod{display:flex;flex-direction:column;border-radius:var(--r-card);border:1px solid var(--line);background:var(--surface);overflow:hidden;transition:border-color .3s ease,box-shadow .35s ease}
@media (hover:hover) and (pointer:fine){.prod:hover{border-color:rgba(255,107,44,.45);box-shadow:0 18px 50px -24px rgba(255,107,44,.4)}}
.prod-vis{
  min-height:200px;padding:22px 24px;display:flex;flex-direction:column;justify-content:center;gap:10px;border-bottom:1px solid var(--line);
  background:radial-gradient(100% 120% at 100% 0%,rgba(255,107,44,.2),transparent 60%),radial-gradient(rgba(23,18,14,.05) 1px,transparent 1px) 0 0 / 14px 14px,rgba(255,255,255,.55);
}
.prod-vis.alt{background:radial-gradient(100% 120% at 0% 100%,rgba(255,107,44,.18),transparent 60%),radial-gradient(rgba(23,18,14,.05) 1px,transparent 1px) 0 0 / 14px 14px,rgba(255,255,255,.55)}
.prod-body{display:flex;flex-direction:column;flex:1;padding:28px 26px 30px}
.prod-body h3{font-size:1.5rem}
.prod-body > p{color:var(--muted);margin-top:10px;max-width:50ch}
.prod-badge{align-self:flex-start;display:inline-flex;align-items:center;gap:8px;margin-top:18px;padding:6px 12px;border-radius:999px;font-size:.82rem;font-weight:500;color:#17120e;background:rgba(255,107,44,.08);border:1px solid rgba(255,107,44,.35)}
.prod-badge b{font-family:var(--f-mono);font-weight:500;font-size:.75rem;letter-spacing:.06em;text-transform:uppercase;color:var(--orange-ink)}
.prod-go{margin-top:auto;padding-top:26px}
.mini-bubble{max-width:82%;padding:8px 12px 7px;border-radius:14px;font-size:.9rem;line-height:1.4}
.mini-bubble.in{align-self:flex-start;background:#efebe6;border:1px solid var(--line);border-bottom-left-radius:4px}
.mini-bubble.out{align-self:flex-end;background:linear-gradient(160deg,rgba(255,107,44,.55),rgba(255,107,44,.28));border:1px solid rgba(255,107,44,.3);border-bottom-right-radius:4px}
.mini-tag{align-self:flex-start;margin-bottom:2px}
.mini-search{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:999px;background:#efebe6;border:1px solid var(--line-strong);font-size:.9rem;line-height:1.35}
.mini-search svg{width:16px;height:16px;flex:none;color:var(--muted)}

.combo{
  margin-top:16px;display:grid;gap:20px;align-items:center;padding:26px 24px;border-radius:var(--r-card);
  border:1px solid rgba(255,107,44,.4);background:linear-gradient(120deg,rgba(255,107,44,.22),rgba(247,245,242,.92) 62%);
  box-shadow:0 30px 80px -40px rgba(255,107,44,.45),inset 0 1px 0 rgba(23,18,14,.06);
}
@media (min-width:900px){.combo{grid-template-columns:minmax(0,1fr) auto;gap:40px;padding:32px 36px}}
.combo h3{font-size:clamp(1.3rem,1rem + 1vw,1.75rem);line-height:1.2;letter-spacing:-.02em;max-width:30ch}
.combo p{color:var(--muted);margin-top:10px;max-width:58ch}

/* Problema: o quinto cartão ocupa a linha inteira */
.s-search{display:flex;align-items:center;gap:10px;padding:10px 16px;border-radius:999px;background:#efebe6;border:1px solid var(--line-strong);font-size:.92rem;max-width:100%}
.s-search svg{width:16px;height:16px;flex:none;color:var(--muted)}
@media (min-width:768px){
  .pain .card.wide{grid-column:1 / -1;flex-direction:row}
  .pain .card.wide .sym{flex:0 0 46%;height:auto;min-height:156px;border-bottom:0;border-right:1px solid var(--line)}
  .pain .card.wide .pain-txt{align-self:center;padding:26px 32px}
}

/* Duas colunas de definição + exemplos de como a busca mudou */
.defs{display:grid;gap:14px}
@media (min-width:900px){.defs{grid-template-columns:1fr 1fr;gap:16px}}
.def{padding:30px 28px}
.def-k{
  font-family:var(--f-mono);font-weight:600;font-size:2.6rem;line-height:1;letter-spacing:-.04em;display:inline-block;margin-bottom:18px;
  background:var(--grad-text);-webkit-background-clip:text;background-clip:text;color:transparent;
}
.def p{color:#3b342e;font-size:1.05rem;max-width:44ch;margin-top:0}
.pairs{margin-top:40px;display:grid;gap:12px}
.pairs-head{display:none}
.pair{display:grid;gap:8px;padding:18px 20px;border-radius:var(--r-card);border:1px solid var(--line);background:var(--surface)}
.pair .was{font-family:var(--f-mono);font-size:.86rem;color:var(--muted)}
.pair .now{font-size:1.02rem;color:#17120e}
.pair .lbl{display:block;font-family:var(--f-mono);font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--orange-ink);margin-bottom:4px}
@media (min-width:900px){
  .pairs{gap:0;border:1px solid var(--line);border-radius:var(--r-card);background:var(--surface);overflow:hidden}
  .pairs-head,.pair{display:grid;grid-template-columns:.7fr 1.3fr;gap:32px;padding:20px 28px;border:0;border-radius:0;background:none;align-items:center}
  .pairs-head{font-family:var(--f-mono);font-size:.76rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding-block:16px;background:rgba(23,18,14,.02)}
  .pairs-head span:last-child{color:var(--orange-ink)}
  .pair{border-top:1px solid var(--line)}
  .pair .lbl{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
}

/* Prévia: a resposta de uma IA, sem e com a estrutura do site */
.ans .chat-bar .chat-avatar{background:#efebe6;border:1px solid var(--line-strong);box-shadow:none}
.ans .chat-avatar svg{color:var(--orange-ink)}
.ans-body{padding:18px 14px 20px;display:flex;flex-direction:column;gap:14px;background:radial-gradient(80% 60% at 100% 100%,rgba(255,107,44,.12),transparent 70%)}
@media (min-width:480px){.ans-body{padding:20px 20px 22px}}
.ans-q{align-self:flex-start;max-width:90%;padding:10px 14px;border-radius:14px;border-bottom-left-radius:4px;background:#efebe6;border:1px solid var(--line);font-size:.95rem;line-height:1.45}
.seg{display:none;position:relative;align-self:flex-start;grid-template-columns:1fr 1fr;padding:4px;border-radius:999px;background:rgba(23,18,14,.05);border:1px solid var(--line-strong)}
.js .seg{display:inline-grid}
.seg::before{content:"";position:absolute;top:4px;bottom:4px;left:4px;width:calc(50% - 4px);border-radius:999px;background:linear-gradient(90deg,#ff6b2c,#ff6b2c);transition:transform .3s var(--ease-in-out)}
.seg[data-state="com"]::before{transform:translateX(100%)}
.seg button{position:relative;z-index:1;min-height:40px;padding:0 16px;border:0;border-radius:999px;background:none;cursor:pointer;font-size:.88rem;font-weight:500;color:#3b342e;white-space:nowrap;transition:color .2s ease,transform .16s var(--ease-out)}
.seg button:active{transform:scale(.97)}
.seg button[aria-pressed="true"]{color:var(--on-grad);font-weight:600}
.ans-stack{display:grid}
.ans-stack > div{grid-area:1 / 1;display:flex;flex-direction:column;gap:8px}
.ans-stack > div:not(.on){display:none}
.js .ans-stack > div:not(.on){display:flex}
.js .ans-stack > div{opacity:0;transform:translateY(6px);visibility:hidden;transition:opacity .22s ease,transform .3s var(--ease-out),visibility 0s linear .3s}
.js .ans-stack > div.on{opacity:1;transform:none;visibility:visible;transition:opacity .22s ease .06s,transform .3s var(--ease-out) .06s,visibility 0s}
.ans-lead{font-size:.82rem;color:var(--muted)}
.ans-item{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;background:#f1eee9;border:1px solid var(--line)}
.ans-av{width:34px;height:34px;flex:none;border-radius:50%;display:grid;place-items:center;font-size:.75rem;font-weight:600;color:#2b2520;background:#efebe6;border:1px solid var(--line-strong)}
.ans-item strong{display:block;font-size:.92rem;font-weight:600;line-height:1.3}
.ans-item span.sub{display:block;font-size:.8rem;color:var(--muted);line-height:1.35}
.ans-item.you{border-style:dashed;border-color:rgba(23,18,14,.26);background:none}
.ans-item.you .ans-av{background:none;border-style:dashed;color:var(--muted)}
.ans-item.you.hit{border-style:solid;border-color:rgba(255,107,44,.6);background:linear-gradient(180deg,rgba(255,107,44,.2),#f1eee9);box-shadow:0 0 0 1px rgba(255,107,44,.12),0 10px 30px -14px rgba(255,107,44,.5)}
.ans-item.you.hit .ans-av{background:var(--grad);border:0;color:var(--on-grad)}
.ans-note{font-size:.78rem;color:var(--muted);padding:10px 14px;border-top:1px solid var(--line)}
@media (prefers-reduced-motion:reduce){
  .seg::before{transition:none}
  .js .ans-stack > div,.js .ans-stack > div.on{transform:none;transition:opacity .2s ease}
}

/* Entregas do site: cinco células, duas largas e três estreitas */
.dl-grid{display:grid;gap:14px}
@media (min-width:900px){.dl-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}.dl-grid .c3{grid-column:span 3}.dl-grid .c2{grid-column:span 2}}
.dl{display:flex;flex-direction:column;gap:12px;padding:28px 26px;border-radius:var(--r-card);border:1px solid var(--line);background:var(--surface);transition:transform .35s var(--ease-out),border-color .3s ease,box-shadow .35s ease}
@media (hover:hover) and (pointer:fine){.dl:hover{transform:translateY(-4px);border-color:rgba(255,107,44,.55);box-shadow:0 18px 50px -24px rgba(255,107,44,.45)}}
@media (prefers-reduced-motion:reduce){.dl:hover{transform:none!important}}
.dl.tint{background:radial-gradient(110% 90% at 100% 0%,rgba(255,107,44,.22),transparent 60%),var(--surface)}
.dl.dots{background:radial-gradient(rgba(23,18,14,.06) 1px,transparent 1px) 0 0 / 14px 14px,var(--surface)}
.dl.glow-b{background:radial-gradient(100% 90% at 0% 100%,rgba(255,107,44,.16),transparent 60%),var(--surface)}
.dl-ic{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:rgba(255,107,44,.1);border:1px solid rgba(255,107,44,.3);color:var(--orange-ink)}
.dl-ic svg{width:22px;height:22px}
.dl h3{font-size:1.25rem}
.dl p{color:var(--muted);max-width:52ch}
.code{margin:6px 0 0;padding:14px 16px;border-radius:10px;background:#ffffff;border:1px solid var(--line);font-family:var(--f-mono);font-size:.78rem;line-height:1.65;color:#3b342e;white-space:pre-wrap;word-break:break-word}
.code .k{color:var(--orange-ink)}
.honest{margin-top:20px;display:flex;gap:14px;align-items:flex-start;padding:20px 22px;border-radius:var(--r-card);border:1px dashed rgba(23,18,14,.22)}
.honest svg{width:22px;height:22px;flex:none;margin-top:2px;color:var(--orange-ink)}
.honest p{color:#3b342e;max-width:70ch}
.honest strong{color:#17120e}

/* IA: lista de capacidades ao lado do título fixo */
.caps-grid{display:grid;gap:36px}
@media (min-width:900px){.caps-grid{grid-template-columns:.8fr 1.2fr;gap:64px;align-items:start}.caps-grid .section-head{position:sticky;top:120px;margin-bottom:0}}
.caps{list-style:none;margin:0;padding:0;display:grid}
.caps li{padding:22px 0;border-bottom:1px solid var(--line)}
.caps li:first-child{padding-top:0}
.caps li:last-child{border-bottom:0;padding-bottom:0}
.caps h3{font-size:1.25rem}
.caps p{color:var(--muted);margin-top:6px;max-width:54ch}

/* Rodapé com os produtos */
.footer-links .sep{width:1px;height:16px;background:var(--line-strong)}
@media (max-width:767px){.footer-links .sep{display:none}}

/* ================================================================
   Visual v2: superfícies planas, bordas finas, sem brilho.
   Referências de estrutura: Sales Land (escuro, títulos em dois tons,
   rótulos numerados, divisórias finas) e Rampex (planos, uma cor só).
   Raios: cartões 12px, botões e campos 10px, só etiquetas são pílula.
   ================================================================ */
:root{
  --bg:#09090b;--surface:#0e0e11;--surface-2:#131316;
  --line:rgba(255,255,255,.09);--line-strong:rgba(255,255,255,.16);
  --text:#f4f3f1;--muted:#a8a5a0;--dim:#8f8c87;
  --r-card:12px;--r-btn:10px;
}
body{background:var(--bg);color:var(--text);counter-reset:sec}
main{counter-reset:sec}
.glow{display:none}
.dim{color:var(--dim)}

/* Tipografia: peso médio, tracking apertado, destaque em cor chapada */
h1,h2,h3{font-weight:500}
h1{font-weight:600;letter-spacing:-.04em}
h2{font-size:clamp(2rem,1.2rem + 2.7vw,3.2rem);letter-spacing:-.035em;line-height:1.06}
.grad-italic{
  background:none;-webkit-background-clip:border-box;background-clip:border-box;color:var(--orange-ink);
  display:inline;transform:none;padding:0;margin:0;
}
.lead{color:var(--muted)}

/* Ritmo: mais ar entre seções e divisória fina de ponta a ponta */
.section{padding-block:88px;border-top:1px solid var(--line)}
@media (min-width:1024px){.section{padding-block:128px}}
.section-head{margin-bottom:48px}
@media (min-width:1024px){.section-head{margin-bottom:64px}}
.hero{padding:64px 0 80px}
@media (min-width:1024px){.hero{padding:88px 0 96px}}
.hero::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(rgba(255,107,44,.38) 1.2px,transparent 1.5px) 0 0 / 24px 24px;
  -webkit-mask-image:radial-gradient(55% 75% at 8% 45%,#000,transparent 72%);mask-image:radial-gradient(55% 75% at 8% 45%,#000,transparent 72%);
}
.method{background:var(--surface)}
@media (min-width:900px){.step-n{background-color:var(--surface)}}

/* Rótulos numerados: 01 - TEMA */
.eyebrow{display:flex;align-items:center;gap:14px;margin-bottom:22px;font-size:.75rem;letter-spacing:.14em;color:var(--muted)}
.eyebrow::before{
  order:-2;counter-increment:sec;content:counter(sec,decimal-leading-zero);
  width:auto;height:auto;background:none;color:var(--orange-ink);font-weight:600;
}
.eyebrow::after{order:-1;content:"";width:56px;height:1px;background:var(--line-strong)}
.founder-meta .eyebrow::before{display:inline}

/* Cabeçalho: barra plana de ponta a ponta com divisória */
.header{padding:0;background:rgba(255,255,255,.82);backdrop-filter:blur(14px) saturate(140%);-webkit-backdrop-filter:blur(14px) saturate(140%);border-bottom:1px solid var(--line)}
.header-bar,.header.is-scrolled .header-bar{border:0;border-radius:0;background:none;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;padding:0 var(--gutter)}
@media (prefers-reduced-transparency:reduce){.header{background:#ffffff;backdrop-filter:none;-webkit-backdrop-filter:none}}
.nav a{border-radius:8px}
.nav a[aria-current="true"],.nav a[aria-current="page"]{background:rgba(23,18,14,.07)}

/* Botões: laranja chapado, sem sombra luminosa */
.btn{
  border-radius:var(--r-btn);min-height:50px;padding:0 24px;background:var(--orange);background-size:auto;background-position:0 0;
  box-shadow:none;color:var(--on-grad);transition:background-color .2s ease,transform .16s var(--ease-out);
}
@media (hover:hover) and (pointer:fine){.btn:hover{background:#ff7d45;filter:none;box-shadow:none}}
.btn-sm{min-height:40px;padding:0 16px;border-radius:8px}
.btn-ghost{border-radius:var(--r-btn);border-color:var(--line-strong)}
.btn[aria-busy="true"]{filter:none;opacity:.8}

/* Cartões: planos, borda fina, sem elevação nem brilho no hover */
.card,.prod,.dl,.pair,.cmp-row{background:var(--surface);border:1px solid var(--line);box-shadow:none}
@media (hover:hover) and (pointer:fine){
  .card:hover,.prod:hover,.dl:hover{transform:none;border-color:var(--line-strong);box-shadow:none}
}
.pain .card{background:var(--surface)}
.dl.tint,.dl.glow-b{background:var(--surface)}
.dl.dots{background:radial-gradient(rgba(23,18,14,.07) 1px,transparent 1px) 0 0 / 14px 14px,var(--surface)}
.dl-ic{background:rgba(255,107,44,.08);border-color:rgba(255,107,44,.3)}
.prod-vis,.prod-vis.alt{background:radial-gradient(rgba(23,18,14,.06) 1px,transparent 1px) 0 0 / 14px 14px,#ffffff}
.sym{background:radial-gradient(rgba(23,18,14,.06) 1px,transparent 1px) 0 0 / 14px 14px,#ffffff}
.s-chip{border-radius:999px}
.combo{
  background:radial-gradient(rgba(255,107,44,.2) 1.2px,transparent 1.5px) 100% 0 / 22px 22px,var(--surface);
  border:1px solid var(--line-strong);box-shadow:none;
}
.honest{border-radius:var(--r-card)}

/* Comparação: coluna "Com PozzIA" em laranja chapado */
.cmp-hl{background:rgba(255,107,44,.05);border-color:rgba(255,107,44,.5);box-shadow:none}
.cmp-hl::before{border-radius:0;left:0;right:0;height:2px}
.cmp-com{background:rgba(255,107,44,.05);box-shadow:none;border-color:rgba(255,107,44,.4)}
@media (min-width:900px){.cmp-com{background:none;border-color:rgba(255,107,44,.16)}}

/* Demonstrações: janela de aplicativo, sem halo */
.chat,.crm{box-shadow:0 30px 60px -30px rgba(23,18,14,0.22);background:var(--surface)}
.chat::before{display:none}
.chat-bar{background:rgba(23,18,14,.02)}
.chat-body,.ans-body{background:none}
.chat-avatar{box-shadow:none}
.msg-out,.mini-bubble.out{background:rgba(255,107,44,.2);border-color:rgba(255,107,44,.38)}
.typing{background:rgba(255,107,44,.2);border-color:rgba(255,107,44,.3)}
.msg-out time{color:#3b342e}
.chat-done{background:rgba(255,107,44,.08);border-color:rgba(255,107,44,.4)}
.ans-item.you.hit{background:rgba(255,107,44,.07);box-shadow:none}
.crm-title::before{content:"";width:9px;height:9px;border-radius:50%;background:#e4dfd9;box-shadow:15px 0 0 #e4dfd9,30px 0 0 #e4dfd9;margin-right:38px}
.crm-card.flash{box-shadow:none}
.seg{border-radius:10px}
.seg::before{border-radius:7px;background:var(--orange)}
.seg button{border-radius:7px}
.pause-btn{border-radius:8px}

/* FAQ: linhas finas numeradas, sem caixas */
.faq-list{gap:0;border-top:1px solid var(--line);counter-reset:faq}
.faq-item,.faq-item[open]{border:0;border-bottom:1px solid var(--line);border-radius:0;background:none}
.faq-item summary{justify-content:flex-start;gap:18px;padding:24px 0;border-radius:0;font-size:1.15rem}
.faq-item summary::before{counter-increment:faq;content:counter(faq,decimal-leading-zero);flex:none;width:26px;font-family:var(--f-mono);font-size:.75rem;font-weight:600;color:var(--orange-ink)}
.faq-item summary .plus{margin-left:auto}
.faq-body{padding:0 0 26px 44px}
@media (hover:hover) and (pointer:fine){.faq-item:not([open]):hover{border-color:var(--line)}}

/* Formulário e painel final */
.final-grid{
  position:relative;overflow:hidden;padding:28px 20px;border:1px solid var(--line-strong);border-radius:16px;background:var(--surface);gap:36px;
}
@media (min-width:768px){.final-grid{padding:44px 40px}}
@media (min-width:1024px){.final-grid{padding:56px 56px;gap:64px}}
.final-grid::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(rgba(255,107,44,.3) 1.2px,transparent 1.5px) 0 0 / 22px 22px;
  -webkit-mask-image:radial-gradient(60% 55% at 0% 0%,#000,transparent 75%);mask-image:radial-gradient(60% 55% at 0% 0%,#000,transparent 75%);
}
.final-grid > *{position:relative;z-index:1}
.form-card{background:var(--line-strong);border-radius:14px}
.form-inner{background:var(--bg);border-radius:13px}
.success-ic{box-shadow:none;border-radius:12px}
.input{background:#ffffff}

/* Fundador */
.photo-wrap::before{display:none}
.photo-frame{background:var(--line-strong);border-radius:16px}
.photo{border-radius:15px}

/* Faixa de fórmula no hero: peças somam um resultado */
.flow{margin-top:64px;display:grid;gap:8px}
.flow-chip{display:flex;flex-direction:column;gap:2px;padding:14px 18px;border:1px solid var(--line-strong);border-radius:var(--r-card);background:var(--surface)}
.flow-chip strong{font-size:.98rem;font-weight:600;line-height:1.3}
.flow-chip span{font-size:.82rem;color:var(--muted);line-height:1.4}
.flow-chip.res{border-color:rgba(255,107,44,.55);background:rgba(255,107,44,.06)}
.flow-op{text-align:center;font-family:var(--f-mono);font-size:1rem;color:var(--muted);line-height:1}
@media (min-width:900px){
  .flow{grid-template-columns:1fr auto 1fr auto 1.15fr auto 1fr;align-items:stretch;gap:14px}
  .flow-op{align-self:center}
}

/* Rodapé */
.footer{background:var(--bg)}
.final-grid{width:min(100% - 2 * var(--gutter),calc(var(--container) - 2 * var(--gutter)));max-width:none;margin-inline:auto}

/* Hero centralizado: título, botões e fórmula no centro; demonstração logo abaixo */
.hero-grid{grid-template-columns:1fr;justify-items:center;text-align:center;gap:56px}
@media (min-width:1024px){.hero-grid{grid-template-columns:1fr;gap:64px}}
.hero-grid > div:first-child{display:flex;flex-direction:column;align-items:center}
.hero h1{max-width:22ch;margin-inline:auto}
.hero-sub{margin-inline:auto;max-width:56ch}
.hero-cta{align-items:center}
.btn-row{justify-content:center}
.crumb ol{justify-content:center}
.hero .flow{width:100%;margin-top:0}
.hero .chat{width:100%;max-width:560px;text-align:left}
.hero .chat.ans{max-width:620px}
.hero::before{
  -webkit-mask-image:radial-gradient(60% 70% at 50% 30%,#000,transparent 72%);
  mask-image:radial-gradient(60% 70% at 50% 30%,#000,transparent 72%);
}
.def-k i{display:block;margin:10px 0 0;font:500 1rem/1.3 var(--f-body, Inter, sans-serif);font-style:normal;letter-spacing:0;color:var(--muted)}

/* Faixa de fórmula: chips iguais, ícone + texto alinhado à esquerda */
.flow-chip{flex-direction:row;align-items:center;gap:14px;text-align:left;padding:16px 18px;min-height:76px}
.flow-chip > div{display:flex;flex-direction:column;gap:3px;min-width:0}
.flow-ic{flex:none;width:22px;height:22px;color:var(--muted)}
.flow-chip.res .flow-ic{color:var(--orange-ink)}
.flow-op{font-size:1.1rem}
@media (min-width:1100px){
  .flow{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1.1fr) auto minmax(0,1.1fr);align-items:stretch;gap:12px}
}

/* Pausa: só o ícone, discreto (o texto fica para leitores de tela) */
.pause-btn{width:32px;height:32px;padding:0;justify-content:center;border-radius:8px;border-color:transparent;flex:none}
.pause-btn svg{width:13px;height:13px}
.pause-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media (hover:hover) and (pointer:fine){.pause-btn:hover{background:rgba(23,18,14,.06);border-color:var(--line-strong)}}

/* Hero: canvas de pontos animados (substitui a textura estática) */
.hero{position:relative}
.hero-dots{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}
.hero.has-dots::before{display:none}

/* Alvos de toque maiores nos links do rodapé */
.footer-links a{display:inline-block;padding-block:6px}

/* Menu no celular e tablet (abaixo de 1060px) */
.menu-btn{display:grid;place-items:center;flex:none;width:40px;height:40px;margin-left:10px;border:1px solid var(--line-strong);border-radius:8px;background:none;color:#17120e;cursor:pointer;transition:background-color .2s ease,transform .16s var(--ease-out)}
.menu-btn:active{transform:scale(.97)}
.menu-btn svg{width:20px;height:20px}
.menu-btn .m-close,.menu-btn[aria-expanded="true"] .m-open{display:none}
.menu-btn[aria-expanded="true"] .m-close{display:block}
@media (hover:hover) and (pointer:fine){.menu-btn:hover{background:rgba(23,18,14,.06)}}
@media (min-width:1060px){.menu-btn{display:none}}
@media (max-width:1059px){
  .nav{position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:2px;padding:10px var(--gutter) 18px;background:#ffffff;border-bottom:1px solid var(--line)}
  .header.menu-open .nav{display:flex}
  .nav a{padding:14px 12px;font-size:1.05rem}
}
@media (max-width:1059px){.header-bar .btn-sm{margin-left:auto}}

/* Hero: texto principal mais ao centro da primeira tela */
.hero{padding-top:96px}
@media (min-width:1024px){.hero{padding-top:136px}}
.chat-who span{align-items:flex-start}
.chat-who span::before{flex:none;margin-top:.5em}

/* ================================================================
   Visual v3 (critique de 2026-11): linguagem de WhatsApp e agenda.
   Títulos de uma cor só, sem rótulos acima dos títulos, sem brilhos.
   A resposta da PozzIA aparece como mensagem enviada (com os dois tiques)
   e os passos do método como horários de agenda.
   ================================================================ */
:root{
  --f-display:"Bricolage Grotesque",system-ui,sans-serif;
  --f-body:"Figtree",system-ui,sans-serif;
  /* aliases do laranja da marca (antes eram "gradientes" de uma cor só) */
  --amber:var(--orange);--grad:var(--orange);
  --out:rgba(255,107,44,.15);--out-line:rgba(255,107,44,.38);
}
h1,h2,h3{font-optical-sizing:auto}
.dim{color:inherit}
.eyebrow{display:none}
/* cor chapada no lugar do texto em gradiente */
.step-n,.def-k{background-image:none;-webkit-background-clip:border-box;background-clip:border-box;color:var(--orange-ink)}

/* Hero da home: texto à esquerda, a conversa das 02:14 à direita e acima da dobra */
.hero.hero-home{padding:56px 0 72px}
@media (min-width:1024px){.hero.hero-home{padding:88px 0 96px}}
.hero-home .hero-grid{justify-items:stretch;text-align:left;gap:40px}
.hero-home .hero-grid > div:first-child{align-items:flex-start}
.hero-home h1{margin-inline:0;max-width:13ch}
.hero-home .hero-sub{margin-inline:0;max-width:46ch}
.hero-home .hero-cta{align-items:flex-start}
.hero-home .btn-row{justify-content:flex-start}
.hero-home .chat{max-width:520px}
@media (min-width:1024px){
  .hero-home .hero-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:64px;align-items:center}
  .hero-home .chat{justify-self:end}
}

/* Tiques de mensagem lida nas respostas da IA */
.msg-out time::after{
  content:"";display:inline-block;width:16px;height:11px;margin-left:5px;vertical-align:-1px;background:var(--orange);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 12' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1.5 6.5 5 10l7-8.5M8.5 9.6l.4.4 7-8.5'/%3E%3C/svg%3E") center / contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 12' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1.5 6.5 5 10l7-8.5M8.5 9.6l.4.4 7-8.5'/%3E%3C/svg%3E") center / contain no-repeat;
}
.ticks{display:inline-block;width:16px;height:11px;color:var(--orange-ink);vertical-align:-1px}
.mini-bubble time{display:block;text-align:right;font-family:var(--f-mono);font-size:.72rem;color:var(--muted);margin-top:2px}
.mini-bubble time .ticks{margin-left:4px}

/* Produtos: "Indicado para" dentro de cada cartão (absorve a antiga seção "Para quem é") */
.prod-fit{margin-top:18px;font-size:.94rem;line-height:1.5;color:var(--muted);max-width:52ch}
.prod-fit strong{color:var(--text);font-weight:600}
.combo{background:var(--surface);border:1px solid var(--out-line)}
.combo .prod-fit{margin-top:14px}

/* Problema: cada dor termina com a resposta da PozzIA, como mensagem enviada */
.pain-txt{display:flex;flex-direction:column;flex:1}
.pain-txt > p:not(.pain-fix){margin-bottom:20px}
.card p.pain-fix{
  margin-top:auto;max-width:none;align-self:flex-end;padding:10px 14px 9px;
  border-radius:14px 14px 4px 14px;background:var(--out);border:1px solid var(--out-line);
  color:var(--text);font-size:.95rem;line-height:1.45
}
.fix-by{display:block;font-size:.8rem;font-weight:600;color:var(--orange-ink);margin-bottom:2px}
.pain-fix .ticks{margin-left:6px}
@media (min-width:768px){.pain .card.wide .pain-txt{align-self:stretch;justify-content:center}}

/* Método: três horários de agenda, no mesmo desenho do horário perdido das dores */
.agenda{list-style:none;margin:0;padding:0;display:grid;gap:12px}
@media (min-width:900px){.agenda{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}}
.slot{display:flex;border:1px solid var(--line-strong);border-radius:var(--r-card);background:var(--bg);overflow:hidden}
.slot-when{
  flex:none;width:92px;display:flex;flex-direction:column;gap:4px;padding:20px 14px;
  border-right:1px dashed rgba(23,18,14,.18);background:rgba(23,18,14,.03);
  font-family:var(--f-mono);font-size:.78rem;color:var(--muted)
}
.slot-when b{font-family:var(--f-body);font-size:.95rem;font-weight:600;color:var(--orange-ink)}
.slot-body{padding:20px 20px 22px;min-width:0}
.slot-body p{color:var(--muted);margin-top:8px}
.method-close{margin-top:40px;gap:14px 24px}

/* FAQ sem numeração */
.faq-item summary::before{content:none}
.faq-body{padding:0 0 26px}

/* Diagnóstico: sem textura, lista de garantias */
.final-grid::before{display:none}
.final-list{margin-top:24px}

/* Formulário: 3 campos obrigatórios à vista, o resto recolhido */
.form-more{margin-top:20px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.form-more summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:56px;padding:12px 0;font-size:.95rem;font-weight:500;color:#2b2520}
.form-more summary::-webkit-details-marker{display:none}
.form-more .opt{color:var(--muted);font-weight:400}
.form-more[open] .plus{transform:rotate(180deg);border-color:var(--out-line);color:var(--orange-ink)}
.form-more[open] .plus::after{transform:translate(-50%,-50%) rotate(0deg)}
.form-more > .form-grid{padding:6px 0 22px}
.privacy-note a{display:inline-block;padding-block:8px}

/* Botão do WhatsApp: sombra com deslocamento (sem halo verde) e some enquanto o formulário está na tela */
.wa-btn{box-shadow:0 10px 24px -8px rgba(23,18,14,0.20),0 2px 6px rgba(23,18,14,0.11);transition:transform .2s var(--ease-out),opacity .2s ease,visibility 0s}
@media (hover:hover) and (pointer:fine){.wa-btn:hover{box-shadow:0 14px 30px -8px rgba(23,18,14,0.21),0 2px 6px rgba(23,18,14,0.11)}}
.wa.is-muted .wa-btn{opacity:0;visibility:hidden;pointer-events:none;transform:scale(.85);transition:transform .2s ease,opacity .2s ease,visibility 0s linear .2s}

/* Alvos de toque no celular */
@media (pointer:coarse){.pause-btn{width:40px;height:40px}}

/* CRM no celular: colunas sem altura sobrando */
@media (max-width:599px){.crm-list{min-height:196px}}
/* Ajustes da revisão visual: tracking da Bricolage, CTA do método, horários empilhados no desktop */
h1{letter-spacing:-.03em}
h2{letter-spacing:-.028em}
h3{letter-spacing:-.01em}
.method-close .micro{font-family:var(--f-body);font-size:.88rem;font-weight:400;letter-spacing:0}
@media (min-width:900px){
  .slot{flex-direction:column}
  .slot-when{width:auto;flex-direction:row;align-items:baseline;justify-content:space-between;gap:10px;padding:14px 20px;border-right:0;border-bottom:1px dashed rgba(23,18,14,.18)}
}