/* ============================================================
   Paulo Henrique — Nutricionista · v5
   Direção de arte: DESIGN.md (dark editorial)
   Sentient (display) + Switzer (corpo) — Fontshare
   ============================================================ */

/* ---------- 0. FONTES LOCAIS ----------
   Baixadas do Fontshare (licenca comercial livre) e servidas pelo proprio
   dominio: tira duas conexoes externas do caminho critico e garante que o
   site nao dependa de um CDN de terceiros para renderizar. */
@font-face{font-family:'Sentient';src:url('../assets/fonts/sentient-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Sentient';src:url('../assets/fonts/sentient-400-italic.woff2') format('woff2');font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:'Sentient';src:url('../assets/fonts/sentient-500.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Switzer';src:url('../assets/fonts/switzer-300.woff2') format('woff2');font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:'Switzer';src:url('../assets/fonts/switzer-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Switzer';src:url('../assets/fonts/switzer-500.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Switzer';src:url('../assets/fonts/switzer-600.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}

/* ---------- 1. TOKENS ---------- */
:root{
  /* superfícies */
  --base:#0A0D0B;
  --raised:#121815;
  --deep:#060806;
  --inverse:#F2EEE4;

  /* tinta */
  --ink:#F2EEE4;
  --ink-inv:#0A0D0B;
  --muted:#8B938C;
  --muted-inv:#5A625A;

  /* acentos — um de ação, um de dado */
  --action:#CBAE6B;
  --action-quente:#E0C88C;
  --signal:#9DBF7A;

  /* estrutura */
  --hair:rgba(242,238,228,.13);
  --hair-inv:rgba(10,13,11,.14);

  /* tipografia */
  --display:'Sentient','Iowan Old Style',Georgia,serif;
  --corpo:'Switzer','Helvetica Neue',Arial,sans-serif;

  /* espaçamento — ratio 1.5 */
  --e1:8px; --e2:12px; --e3:18px; --e4:28px; --e5:42px; --e6:64px; --e7:96px; --e8:144px;
  --gutter:clamp(1.25rem,6vw,7.5rem);
  --secao:clamp(5.5rem,12vw,11rem);
  --max:1320px;

  /* curva de movimento */
  --saida:cubic-bezier(.16,1,.3,1);
}
/* ---------- 2. RESET ---------- */
*,*::before,*::after{box-sizing:border-box}
*{margin:0;padding:0}
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth }
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} }

body{
  background:var(--base);
  color:var(--ink);
  font-family:var(--corpo);
  font-weight:300;
  font-size:clamp(1rem,.96rem + .2vw,1.125rem);
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}

/* grão fotográfico — background de pseudo-elemento, nunca filter: no elemento */
body::before{
  content:'';
  position:fixed; inset:0; z-index:9999;
  pointer-events:none; opacity:.05; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
}
.fonte-ruido{position:absolute;width:0;height:0;overflow:hidden}

img,picture,svg{display:block;max-width:100%}
img{height:auto}
button,input,select{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer}
a{color:inherit;text-decoration:none}
::selection{background:var(--action);color:var(--ink-inv)}

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

.pular{
  position:absolute; left:var(--gutter); top:-100px; z-index:1000;
  background:var(--action); color:var(--ink-inv);
  padding:.75rem 1.25rem; border-radius:999px; font-weight:500; font-size:.9rem;
  transition:top .2s var(--saida);
}
.pular:focus{top:1rem}

/* ---------- 3. TIPOGRAFIA ---------- */
.rotulo{
  font-family:var(--corpo); font-size:.72rem; font-weight:500;
  letter-spacing:.24em; text-transform:uppercase;
  color:var(--muted);
}
.rotulo--escuro{color:var(--muted-inv)}

.titulo-secao{
  font-family:var(--display); font-weight:400;
  font-size:clamp(2.1rem,5.4vw,4rem); line-height:1.06;
  letter-spacing:-.028em; margin-top:var(--e3);
}
.titulo-secao--escuro{color:var(--ink-inv)}
.titulo-secao em,.hero__titulo em,.ruptura__frase em,.fecho__titulo em,.trilha__titulo em{
  font-style:italic; font-weight:400; color:var(--action);
}
.titulo-secao--escuro em{color:#9A7C33}

.secao__cabeca{max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter)}
.secao__cabeca--centro{text-align:center;max-width:760px}
.secao__lede{
  margin-top:var(--e4); color:var(--muted); font-size:1.0625rem; line-height:1.72;
  max-width:60ch; margin-inline:auto;
}

/* ---------- 4. BOTÕES ---------- */
.botao{
  --fundo:transparent; --tinta:var(--ink); --borda:transparent;
  display:inline-flex; align-items:center; gap:.6rem;
  background:var(--fundo); color:var(--tinta);
  border:1px solid var(--borda); border-radius:999px;
  padding:.95rem 1.65rem;
  font-family:var(--corpo); font-size:.93rem; font-weight:500;
  letter-spacing:.005em; line-height:1;
  cursor:pointer; position:relative; overflow:hidden;
  transition:transform .45s var(--saida), background-color .35s ease, color .35s ease, border-color .35s ease;
}
.botao svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;transition:transform .45s var(--saida)}
.botao:hover svg{transform:translateX(4px)}
.botao:active{transform:scale(.97)}

.botao--acao{--fundo:var(--action);--tinta:#0A0D0B;--borda:var(--action);font-weight:600}
.botao--acao:hover{--fundo:var(--action-quente);--borda:var(--action-quente)}

.botao--fantasma{--borda:var(--hair);--tinta:var(--ink)}
.botao--fantasma:hover{--borda:rgba(242,238,228,.4);background:rgba(242,238,228,.05)}

.botao--contorno{--borda:var(--hair-inv);--tinta:var(--ink-inv)}
.botao--contorno:hover{--fundo:var(--ink-inv);--tinta:var(--inverse);--borda:var(--ink-inv)}

.botao--grande{padding:1.15rem 2.1rem;font-size:1rem}

.link-sublinhado{
  display:inline-flex; align-items:center; gap:.45rem;
  font-size:.92rem; font-weight:500; letter-spacing:.01em;
  padding-bottom:3px; border-bottom:1px solid currentColor;
  transition:opacity .3s ease, gap .35s var(--saida);
}
.link-sublinhado:hover{opacity:.62;gap:.75rem}
.link-sublinhado svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}

/* ---------- 5. TOPO ---------- */
.topo{
  position:fixed; top:0; left:0; right:0; z-index:100;
  display:flex; align-items:center; justify-content:space-between; gap:var(--e4);
  padding:1.1rem var(--gutter);
  transition:background-color .5s ease, backdrop-filter .5s ease, border-color .5s ease, padding .5s ease;
  border-bottom:1px solid transparent;
}
.topo--fixo{
  background:rgba(10,13,11,.82); backdrop-filter:blur(14px) saturate(1.2);
  border-bottom-color:var(--hair); padding-block:.8rem;
}
.topo__marca{display:flex;align-items:center;gap:.7rem}
.topo__mono{
  display:grid; place-items:center; width:38px; height:38px; flex:none;
  border:1px solid var(--hair); border-radius:50%;
  font-family:var(--display); font-size:1.05rem; font-style:italic; color:var(--action);
  transition:border-color .4s ease;
}
.topo__marca:hover .topo__mono{border-color:var(--action)}
.topo__nome{font-size:.9rem;font-weight:500;line-height:1.25;letter-spacing:.005em}
.topo__nome em{display:block;font-style:normal;font-size:.68rem;font-weight:400;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}

.topo__nav{display:flex;gap:var(--e4)}
.topo__nav a{
  font-size:.86rem; font-weight:400; color:var(--muted);
  position:relative; padding-bottom:2px; transition:color .3s ease;
}
.topo__nav a::after{
  content:''; position:absolute; left:0; bottom:0; height:1px; width:100%;
  background:currentColor; transform:scaleX(0); transform-origin:right;
  transition:transform .45s var(--saida);
}
.topo__nav a:hover{color:var(--ink)}
.topo__nav a:hover::after{transform:scaleX(1);transform-origin:left}
.topo__nav a[aria-current="true"]{color:var(--ink)}
.topo__nav a[aria-current="true"]::after{transform:scaleX(1);background:var(--action)}

@media (max-width:1024px){ .topo__nav{display:none} }
@media (max-width:600px){
  .topo__cta{display:none}
  .topo{justify-content:flex-start}
}

/* ---------- 6. HERO ---------- */
.hero{
  min-height:100svh;
  display:grid; align-items:center;
  grid-template-columns:minmax(0,1.1fr) minmax(0,.8fr);
  gap:clamp(1.5rem,3vw,3.5rem);
  max-width:1560px; margin-inline:auto;
  padding:8.5rem var(--gutter) var(--e7);
  position:relative;
}
.hero__texto{min-width:0}
.hero__titulo{
  font-family:var(--display); font-weight:400;
  font-size:clamp(2.45rem,5.1vw,5rem); line-height:1.0;
  letter-spacing:-.038em; margin-top:var(--e4);
}
.hero__lede{
  margin-top:var(--e4); color:var(--muted);
  font-size:clamp(1rem,1.05vw,1.1rem); line-height:1.72; max-width:44ch;
}
.hero__texto .rotulo{max-width:none;white-space:nowrap}
.hero__acoes{display:flex;flex-wrap:wrap;gap:var(--e2);margin-top:var(--e5)}

.hero__retrato{position:relative;justify-self:end;width:100%;max-width:640px}
.hero__retrato img{
  width:100%; height:auto; border-radius:0;
  /* o preto do estúdio funde com o canvas: a foto não tem moldura */
  -webkit-mask-image:radial-gradient(76% 68% at 58% 42%,#000 34%,transparent 88%);
  mask-image:radial-gradient(76% 68% at 58% 42%,#000 34%,transparent 88%);
}
/* véu do canvas: apaga o que sobra do retângulo nas bordas de baixo e da esquerda */
.hero__retrato::after{
  content:''; position:absolute; inset:0; pointer-events:none;
  background:
    linear-gradient(to top, var(--base) 2%, transparent 34%),
    linear-gradient(to right, var(--base) 0%, transparent 26%);
}

@media (max-width:900px){
  .hero{
    grid-template-columns:1fr; gap:var(--e3);
    padding-top:5.5rem; padding-bottom:var(--e6); min-height:auto; text-align:left;
  }
  .hero__texto{max-width:none;order:2}
  /* Retrato menor no celular para o titulo entrar na primeira tela. */
  .hero__retrato{order:1;justify-self:center;max-width:min(300px,62vw)}
  .hero__titulo{margin-top:var(--e3)}
  .hero__acoes{margin-top:var(--e4)}
  .hero__acoes .botao{flex:1 1 auto;justify-content:center}
  .hero__texto .rotulo{white-space:normal}
}

/* ---------- 7. CREDENCIAL ---------- */
.credencial{max-width:var(--max);margin-inline:auto;padding:0 var(--gutter) var(--secao)}
.credencial__fio{height:1px;background:var(--hair);transform-origin:left;margin-bottom:var(--e5)}
.credencial__lista{
  display:grid; grid-template-columns:repeat(4,1fr); gap:var(--e4);
}
.credencial__lista dt{
  font-size:.68rem; font-weight:500; letter-spacing:.22em; text-transform:uppercase;
  color:var(--muted); margin-bottom:.55rem;
}
.credencial__lista dd{font-size:.98rem;font-weight:400;line-height:1.45}
.credencial__lista strong{font-weight:600;color:var(--action)}
@media (max-width:820px){ .credencial__lista{grid-template-columns:repeat(2,1fr);gap:var(--e4) var(--e3)} }

/* ---------- 8. DOR ---------- */
.dor{padding-block:var(--secao);background:var(--deep)}
.dor__lista{
  max-width:var(--max); margin:var(--e7) auto 0; padding-inline:var(--gutter);
  list-style:none; counter-reset:none;
}
.dor__lista li{
  display:grid; grid-template-columns:auto 1fr; gap:var(--e4);
  align-items:baseline;
  padding:var(--e4) 0; border-top:1px solid var(--hair);
  transition:padding-left .5s var(--saida);
}
.dor__lista li:last-child{border-bottom:1px solid var(--hair)}
.dor__lista li:hover{padding-left:var(--e2)}
.dor__num{
  font-family:var(--display); font-style:italic; font-size:1.05rem;
  color:var(--action); min-width:2.2ch; opacity:.85;
}
.dor__lista p{font-size:clamp(1.05rem,2.2vw,1.45rem);line-height:1.5;font-weight:300;max-width:52ch}
.dor__lista strong{font-weight:500;color:var(--ink)}

/* ---------- 9. RUPTURA (creme) ---------- */
.ruptura{
  background:var(--inverse); color:var(--ink-inv);
  padding:var(--secao) var(--gutter);
  text-align:center;
}
.ruptura__frase{
  font-family:var(--display); font-weight:400;
  font-size:clamp(1.95rem,5.2vw,4.1rem); line-height:1.1; letter-spacing:-.03em;
  margin:var(--e4) auto 0; max-width:19ch;
}
.ruptura__frase em{color:#9A7C33}
.ruptura__nota{
  margin:var(--e5) auto 0; max-width:58ch;
  color:var(--muted-inv); font-size:1.03rem; line-height:1.78;
}

/* ---------- 10. RAIO-X ---------- */
.raiox{padding-block:var(--secao);background:var(--base)}
.raiox__painel{
  max-width:940px; margin:var(--e7) auto 0;
  margin-inline:auto; width:calc(100% - var(--gutter) * 2);
  background:var(--raised); border:1px solid var(--hair); border-radius:14px;
  padding:clamp(1.5rem,4vw,3.2rem);
}

.passos{
  display:flex; gap:var(--e3); list-style:none;
  padding-bottom:var(--e4); margin-bottom:var(--e5);
  border-bottom:1px solid var(--hair);
}
.passos li{
  display:flex; align-items:center; gap:.55rem;
  font-size:.78rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--muted); transition:color .4s ease;
}
.passos li span{
  display:grid; place-items:center; width:26px; height:26px; flex:none;
  border:1px solid var(--hair); border-radius:50%;
  font-size:.72rem; letter-spacing:0;
  transition:all .4s var(--saida);
}
.passos--ativo{color:var(--ink)}
.passos--ativo span{background:var(--action);border-color:var(--action);color:var(--ink-inv);font-weight:600}
.passos--feito span{border-color:var(--action);color:var(--action)}

.passo{border:0}
.passo[hidden]{display:none}
.passo__legenda{
  font-family:var(--display); font-size:clamp(1.35rem,2.6vw,1.9rem);
  font-weight:400; letter-spacing:-.02em; margin-bottom:var(--e5); float:left; width:100%;
}
.passo__rodape{display:flex;justify-content:flex-end;margin-top:var(--e5)}
.passo__rodape--duplo{justify-content:space-between;gap:var(--e2)}

.campo{display:block;margin-bottom:var(--e4)}
.campo-linha{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--e3)}
.campo__rotulo{
  display:block; margin-bottom:.6rem;
  font-size:.82rem; font-weight:500; letter-spacing:.02em; color:var(--ink);
}
.campo__rotulo em{
  display:block; font-style:normal; font-size:.72rem; font-weight:300;
  letter-spacing:.01em; color:var(--muted); margin-top:2px;
}
.entrada{
  width:100%; background:var(--base); color:var(--ink);
  border:1px solid var(--hair); border-radius:4px;
  padding:.9rem 1rem; font-size:1.05rem; font-weight:400;
  transition:border-color .3s ease, background-color .3s ease;
  -moz-appearance:textfield;
}
.entrada::-webkit-outer-spin-button,.entrada::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.entrada::placeholder{color:#69726A}
.entrada:focus{border-color:var(--action);outline:none;background:#0D1110}
.entrada[aria-invalid="true"]{border-color:#C8674F}

.opcoes{display:grid;gap:.6rem}
.opcoes--duplo{grid-template-columns:repeat(2,1fr)}
.opcoes--pilha{grid-template-columns:1fr}
.opcao{position:relative;cursor:pointer;display:block}
.opcao input{position:absolute;opacity:0;width:0;height:0}
.opcao span{
  display:block; padding:.85rem 1.1rem;
  border:1px solid var(--hair); border-radius:4px;
  font-size:.95rem; color:var(--muted);
  transition:border-color .35s ease, color .35s ease, background-color .35s ease, transform .35s var(--saida);
}
.opcao--larga span{padding:1.05rem 1.25rem}
.opcao span strong{display:block;font-weight:500;color:var(--ink);font-size:1rem;margin-bottom:.15rem;transition:color .35s ease}
.opcao:hover span{border-color:rgba(242,238,228,.32)}
.opcao input:checked + span{
  border-color:var(--action); background:rgba(203,174,107,.07); color:var(--ink);
}
.opcao input:checked + span strong{color:var(--action)}
.opcao input:focus-visible + span{outline:2px solid var(--action);outline-offset:2px}

.erro{
  color:#DE8A70; font-size:.88rem; margin-top:calc(var(--e2) * -1);
  display:flex; align-items:center; gap:.4rem;
}
.erro[hidden]{display:none}

/* laudo */
.laudo[hidden]{display:none}
.laudo__chapeu{
  font-size:.7rem; letter-spacing:.24em; text-transform:uppercase;
  color:var(--muted); margin-bottom:var(--e4);
}
.laudo__numeros{
  display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
  background:var(--hair); border:1px solid var(--hair); border-radius:8px; overflow:hidden;
}
.metrica{background:var(--raised);padding:var(--e4) var(--e3);display:flex;flex-direction:column}
.metrica--destaque{background:#161D19}
.metrica__valor{
  font-family:var(--display); font-weight:400;
  font-size:clamp(1.9rem,4vw,2.9rem); line-height:1; letter-spacing:-.03em;
  color:var(--signal);
}
.metrica--destaque .metrica__valor{color:var(--action)}
.metrica__unidade{
  font-size:.68rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--muted); margin-top:.45rem;
}
.metrica__nome{font-size:.9rem;font-weight:500;color:var(--ink);margin-top:var(--e3);line-height:1.35}
.metrica__nota{font-size:.78rem;color:var(--muted);margin-top:.35rem;line-height:1.45}

.macros{margin-top:var(--e5)}
.macros__titulo{
  font-size:.7rem; letter-spacing:.24em; text-transform:uppercase;
  color:var(--muted); margin-bottom:var(--e4);
}
.macro + .macro{margin-top:var(--e3)}
.macro__cabeca{display:flex;justify-content:space-between;align-items:baseline;font-size:.92rem;margin-bottom:.5rem}
.macro__cabeca b{font-family:var(--display);font-size:1.15rem;font-weight:400;color:var(--signal)}
.macro__cabeca span:first-child{color:var(--ink);font-weight:400}
.macro__cabeca span:last-child{color:var(--muted);font-size:.82rem}
.barra{height:6px;background:rgba(242,238,228,.07);border-radius:999px;overflow:hidden}
.barra i{display:block;height:100%;width:0;border-radius:999px;background:var(--signal);opacity:.9}
[data-macro="carb"] .barra i{opacity:.62}
[data-macro="gord"] .barra i{opacity:.38}

.laudo__leitura{
  margin-top:var(--e5); padding:var(--e4) var(--e4) var(--e4) var(--e5);
  border-left:1px solid var(--action); background:rgba(203,174,107,.05); border-radius:0 8px 8px 0;
}
.laudo__leitura p{
  font-family:var(--display); font-size:clamp(1.05rem,2.2vw,1.35rem);
  line-height:1.55; font-weight:400; letter-spacing:-.012em;
}
.laudo__leitura cite{
  display:block; margin-top:var(--e3); font-style:normal;
  font-size:.74rem; letter-spacing:.2em; text-transform:uppercase; color:var(--muted);
}
.laudo__aviso{
  display:flex; gap:.75rem; align-items:flex-start;
  margin-top:var(--e4); font-size:.82rem; line-height:1.6; color:var(--muted);
}
.laudo__aviso svg{width:17px;height:17px;flex:none;margin-top:2px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.laudo__acoes{display:flex;flex-wrap:wrap;gap:var(--e2);margin-top:var(--e5)}

@media (max-width:860px){
  .laudo__numeros{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:560px){
  .campo-linha{grid-template-columns:1fr;gap:var(--e3)}
  .laudo__numeros{grid-template-columns:1fr}
  .passos li{font-size:.68rem;gap:.4rem}
  .passo__rodape--duplo{flex-direction:column-reverse}
  .passo__rodape--duplo .botao{width:100%;justify-content:center}
  .laudo__acoes .botao{width:100%;justify-content:center}
}

/* ---------- 11. TRILHAS ---------- */
.trilhas{padding-block:var(--secao);background:var(--deep)}
.trilhas__abas{
  max-width:var(--max); margin:var(--e6) auto 0; padding-inline:var(--gutter);
  display:flex; flex-wrap:wrap; gap:.6rem;
}
.trilhas__abas button{
  padding:.75rem 1.4rem; border:1px solid var(--hair); border-radius:999px;
  font-size:.9rem; font-weight:400; color:var(--muted);
  transition:all .4s var(--saida);
}
.trilhas__abas button:hover{border-color:rgba(242,238,228,.35);color:var(--ink)}
.trilhas__abas button[aria-selected="true"]{
  background:var(--action); border-color:var(--action); color:var(--ink-inv); font-weight:600;
}
.trilhas__palco{max-width:var(--max);margin-inline:auto;padding:var(--e5) var(--gutter) 0}
.trilha[hidden]{display:none}
/* Argumento à esquerda, provas à direita: preenche a largura sem adensar o texto. */
.trilha{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
  /* a terceira linha absorve a sobra para o chapeu e o titulo nao esticarem */
  grid-template-rows:auto auto 1fr;
  gap:var(--e3) clamp(2rem,5vw,5rem);
  align-content:start;
}
.trilha__chapeu{grid-area:1 / 1}
.trilha__titulo{grid-area:2 / 1;margin-top:0}
.trilha__texto{grid-area:3 / 1;max-width:52ch;margin-top:var(--e2)}
.trilha__itens{
  grid-area:1 / 2 / 4 / 3; align-self:start;
  margin-top:.45rem; padding-top:var(--e4); border-top:1px solid var(--hair);
}
@media (max-width:900px){
  .trilha{grid-template-columns:1fr;gap:var(--e4)}
  .trilha__chapeu,.trilha__titulo,.trilha__texto,.trilha__itens{grid-column:1}
  .trilha__itens{grid-row:auto;margin-top:var(--e3)}
}
.trilha__chapeu{
  font-size:.7rem; letter-spacing:.24em; text-transform:uppercase; color:var(--action);
}
.trilha__titulo{
  font-family:var(--display); font-weight:400;
  font-size:clamp(1.65rem,4vw,2.9rem); line-height:1.13; letter-spacing:-.028em;
  margin-top:var(--e3);
}
.trilha__texto{margin-top:var(--e4);color:var(--muted);line-height:1.78}
.trilha__itens{margin-top:var(--e4);list-style:none;display:grid;gap:.8rem}
.trilha__itens li{
  position:relative; padding-left:1.7rem; font-size:.97rem; color:var(--ink); font-weight:300;
}
.trilha__itens li::before{
  content:''; position:absolute; left:0; top:.62em;
  width:9px; height:1px; background:var(--action);
}

/* ---------- 12. PAULO (creme) ---------- */
.paulo{
  background:var(--inverse); color:var(--ink-inv);
  padding:var(--secao) var(--gutter);
  display:grid; grid-template-columns:minmax(0,.92fr) minmax(0,1fr); gap:clamp(2rem,5vw,4.5rem);
  align-items:center; max-width:1440px; margin-inline:auto;
}
.paulo__galeria{position:relative;display:grid;grid-template-columns:repeat(2,1fr);gap:var(--e3);align-items:start}
.paulo__foto{overflow:hidden;background:#E4DFD2}
.paulo__foto img{width:100%;height:100%;object-fit:cover}
.paulo__foto--alta{grid-row:span 2;aspect-ratio:3/5}
.paulo__foto--baixa{aspect-ratio:3/4;margin-top:var(--e6)}

.paulo__credencial{
  margin-top:var(--e3); font-size:.85rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--muted-inv);
}
.paulo__corpo{margin-top:var(--e5);display:grid;gap:var(--e3);max-width:56ch}
.paulo__corpo p{color:#3C433C;line-height:1.8}
.paulo__assinatura{
  font-family:var(--display); font-size:1.12rem; line-height:1.6;
  color:var(--ink-inv) !important; padding-top:var(--e3); border-top:1px solid var(--hair-inv);
}
.paulo .link-sublinhado{margin-top:var(--e5);color:var(--ink-inv)}

@media (max-width:900px){
  .paulo{grid-template-columns:1fr;gap:var(--e5)}
  .paulo__galeria{order:2;max-width:520px}
  .paulo__texto{order:1}
}

/* ---------- 13. JORNADA ---------- */
.jornada{padding:var(--secao) 0 calc(var(--secao) * .62);background:var(--base);overflow:hidden}
.jornada__intro{max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter)}
.jornada__controles{
  max-width:var(--max); margin:var(--e6) auto 0; padding-inline:var(--gutter);
  display:flex; align-items:center; justify-content:space-between; gap:var(--e4);
}
.jornada__progresso{flex:1;height:1px;background:var(--hair);position:relative;overflow:hidden}
.jornada__progresso i{
  position:absolute; left:0; top:0; height:100%; width:22%;
  background:var(--action); transition:transform .18s linear; transform-origin:left;
}
.jornada__setas{display:flex;gap:.6rem;flex:none}
.jornada__setas button{
  display:grid; place-items:center; width:46px; height:46px;
  border:1px solid var(--hair); border-radius:50%; color:var(--ink);
  transition:all .4s var(--saida);
}
.jornada__setas button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.jornada__setas button:hover:not(:disabled){background:var(--action);border-color:var(--action);color:var(--ink-inv)}
.jornada__setas button:active:not(:disabled){transform:scale(.92)}
.jornada__setas button:disabled{opacity:.28;cursor:not-allowed}
@media (max-width:700px){ .jornada__setas{display:none} }

.jornada__trilho{
  margin-top:var(--e5);
  overflow-x:auto; overflow-y:hidden;
  scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch;
  scrollbar-width:none; cursor:grab;
}
.jornada__trilho::-webkit-scrollbar{display:none}
.jornada__trilho.arrastando{cursor:grabbing;scroll-snap-type:none}
.jornada__faixa{
  display:flex; gap:var(--e4); width:max-content;
  padding-inline:var(--gutter);
}
.marco{
  flex:0 0 clamp(270px,29vw,380px);
  scroll-snap-align:center;
  display:flex; flex-direction:column;
  border-top:1px solid var(--hair);
  padding:var(--e4) var(--e4) var(--e5) 0;
  transition:border-top-color .5s ease, background-color .5s ease, padding-left .5s ease;
}
.marco:hover{border-top-color:var(--action);background:var(--raised);padding-left:var(--e3)}
.marco__dia{
  font-size:.72rem; letter-spacing:.22em; text-transform:uppercase; color:var(--muted);
}
.marco__dia b{font-family:var(--display);font-size:1.6rem;font-weight:400;letter-spacing:0;color:var(--action);text-transform:none;vertical-align:-2px;margin-left:.15rem}
.marco h3{
  font-family:var(--display); font-weight:400; font-size:clamp(1.3rem,2.4vw,1.75rem);
  letter-spacing:-.02em; margin-top:var(--e3); line-height:1.15;
}
.marco p{margin-top:var(--e3);color:var(--muted);font-size:.95rem;line-height:1.72}
.marco--final h3{color:var(--action)}
.jornada__dica{
  max-width:var(--max); margin:var(--e4) auto 0; padding-inline:var(--gutter);
  font-size:.7rem; letter-spacing:.22em; text-transform:uppercase; color:var(--muted); opacity:.6;
}
@media (min-width:701px){ .jornada__dica{display:none} }

/* ---------- 14. INCLUSO ---------- */
.incluso{padding-block:var(--secao);background:var(--deep)}
.incluso__grade{
  max-width:var(--max); margin:var(--e7) auto 0; padding-inline:var(--gutter);
  display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr));
  gap:1px; background:var(--hair); border:1px solid var(--hair);
}
.item{
  background:var(--deep); padding:var(--e5) var(--e4);
  transition:background-color .45s ease;
}
.item:hover{background:var(--raised)}
.item h3{
  font-family:var(--display); font-weight:400; font-size:1.22rem;
  letter-spacing:-.018em; line-height:1.25;
}
.item p{margin-top:var(--e2);color:var(--muted);font-size:.92rem;line-height:1.68}

/* ---------- 15. VALORES (creme) ---------- */
.valores{background:var(--inverse);color:var(--ink-inv);padding-block:var(--secao)}
.valores__par{
  max-width:1100px; margin:var(--e7) auto 0; padding-inline:var(--gutter);
  display:grid; grid-template-columns:repeat(2,1fr); gap:var(--e4); align-items:start;
}
.plano{
  border:1px solid var(--hair-inv); border-radius:2px;
  padding:clamp(1.6rem,3.5vw,2.6rem);
  background:transparent; position:relative;
  transition:transform .55s var(--saida), box-shadow .55s ease;
}
.plano:hover{transform:translateY(-4px)}
.plano--destaque{
  background:var(--ink-inv); color:var(--inverse); border-color:var(--ink-inv);
  border-radius:12px;
}
.plano--destaque:hover{box-shadow:0 26px 60px -30px rgba(10,13,11,.55)}
.plano__selo{
  position:absolute; top:-11px; left:clamp(1.6rem,3.5vw,2.6rem);
  background:var(--action); color:var(--ink-inv);
  font-size:.66rem; font-weight:600; letter-spacing:.18em; text-transform:uppercase;
  padding:.35rem .8rem; border-radius:999px;
}
.plano__nome{font-size:.76rem;letter-spacing:.22em;text-transform:uppercase;color:var(--muted-inv)}
.plano--destaque .plano__nome{color:var(--muted)}
.plano__preco{
  font-family:var(--display); font-weight:400; font-size:clamp(3rem,7vw,4.6rem);
  line-height:1; letter-spacing:-.04em; margin-top:var(--e3);
}
.plano__preco span{font-size:.36em;vertical-align:.75em;margin-right:.12em;letter-spacing:0}
.plano__linha{font-size:.88rem;color:var(--muted-inv);margin-top:.6rem}
.plano--destaque .plano__linha{color:var(--action)}
.plano__lista{list-style:none;margin:var(--e5) 0;display:grid;gap:.75rem}
.plano__lista li{
  position:relative; padding-left:1.6rem; font-size:.95rem; font-weight:300; line-height:1.55;
}
/* lados desiguais: e o que transforma o "L" girado num traco de confirmacao */
.plano__lista li::before{
  content:''; position:absolute; left:2px; top:.42em; width:5px; height:9px;
  border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor;
  transform:rotate(42deg); opacity:.5;
}
.plano--destaque .plano__lista li::before{border-color:var(--action);opacity:1}
.plano__lista strong{font-weight:600}
.plano .botao{width:100%;justify-content:center}
.plano__nota{margin-top:var(--e3);font-size:.84rem;color:var(--muted-inv);line-height:1.6}
.plano--destaque .plano__nota{color:var(--muted)}

@media (max-width:840px){
  .valores__par{grid-template-columns:1fr;gap:var(--e5)}
}

/* ---------- 16. FAQ ---------- */
.faq{padding-block:var(--secao);background:var(--base)}
.faq__lista{max-width:900px;margin:var(--e6) auto 0;padding-inline:var(--gutter)}
.pergunta{border-bottom:1px solid var(--hair)}
.pergunta:first-child{border-top:1px solid var(--hair)}
.pergunta summary{
  display:flex; align-items:flex-start; justify-content:space-between; gap:var(--e4);
  padding:var(--e4) 0; cursor:pointer; list-style:none;
  font-size:clamp(1rem,2vw,1.2rem); font-weight:400; line-height:1.45;
  transition:color .35s ease;
}
.pergunta summary::-webkit-details-marker{display:none}
.pergunta summary:hover{color:var(--action)}
.pergunta summary i{
  position:relative; flex:none; width:15px; height:15px; margin-top:.45em;
}
.pergunta summary i::before,.pergunta summary i::after{
  content:''; position:absolute; left:0; top:7px; width:15px; height:1px; background:currentColor;
  transition:transform .45s var(--saida);
}
.pergunta summary i::after{transform:rotate(90deg)}
.pergunta[open] summary{color:var(--action)}
.pergunta[open] summary i::after{transform:rotate(0)}
.pergunta__corpo{padding-bottom:var(--e4);max-width:64ch}
.pergunta__corpo p{color:var(--muted);line-height:1.8;font-size:.98rem}

/* ---------- 17. FECHO ---------- */
.fecho{
  background:var(--deep); padding:var(--secao) var(--gutter);
  position:relative; overflow:hidden;
}
.fecho::after{
  content:''; position:absolute; inset:auto -10% -40% auto; width:min(760px,90vw); aspect-ratio:1;
  background:radial-gradient(circle,rgba(203,174,107,.12),transparent 66%);
  pointer-events:none;
}
.fecho__texto{max-width:var(--max);margin-inline:auto;position:relative;z-index:1}
.fecho__titulo{
  font-family:var(--display); font-weight:400;
  font-size:clamp(2.1rem,6.2vw,5rem); line-height:1.04; letter-spacing:-.035em;
  max-width:16ch;
}
.fecho__lede{margin-top:var(--e5);color:var(--muted);max-width:52ch;line-height:1.75}
.fecho__acoes{display:flex;flex-wrap:wrap;align-items:center;gap:var(--e4);margin-top:var(--e5)}

/* ---------- 18. RODAPÉ ---------- */
.rodape{background:var(--deep);border-top:1px solid var(--hair);padding:var(--e6) var(--gutter) var(--e4)}
.rodape__topo{
  max-width:var(--max); margin-inline:auto;
  display:grid; grid-template-columns:1.3fr repeat(3,1fr); gap:var(--e5) var(--e4);
  padding-bottom:var(--e6);
}
.rodape__marca{display:flex;gap:.8rem;align-items:flex-start}
.rodape__marca p{font-size:.88rem;line-height:1.6;color:var(--muted)}
.rodape__marca strong{color:var(--ink);font-weight:500}
.rodape__titulo{
  font-size:.68rem; letter-spacing:.22em; text-transform:uppercase;
  color:var(--ink); margin-bottom:var(--e2);
}
.rodape__bloco p,.rodape__bloco a{display:block;font-size:.88rem;color:var(--muted);line-height:1.85}
.rodape__bloco a{transition:color .3s ease}
.rodape__bloco a:hover{color:var(--action)}
.rodape__base{
  max-width:var(--max); margin-inline:auto; padding-top:var(--e4);
  border-top:1px solid var(--hair);
  display:flex; flex-wrap:wrap; justify-content:space-between; gap:var(--e3);
  font-size:.76rem; color:var(--muted); line-height:1.65;
}
.rodape__base p:first-child{max-width:74ch}
.rodape__credito a{border-bottom:1px solid var(--hair);transition:color .3s ease,border-color .3s ease}
.rodape__credito a:hover{color:var(--action);border-color:var(--action)}
@media (max-width:820px){ .rodape__topo{grid-template-columns:repeat(2,1fr)} }
@media (max-width:480px){ .rodape__topo{grid-template-columns:1fr} }

/* ---------- 19. WHATSAPP FLUTUANTE ---------- */
.wa-flutuante{
  position:fixed; right:clamp(1rem,3vw,2rem); bottom:clamp(1rem,3vw,2rem); z-index:90;
  display:grid; place-items:center; width:54px; height:54px;
  background:var(--action); color:var(--ink-inv); border-radius:50%;
  box-shadow:0 12px 34px -12px rgba(0,0,0,.8);
  opacity:0; transform:scale(.6) translateY(12px); pointer-events:none;
  transition:opacity .45s var(--saida), transform .45s var(--saida), background-color .3s ease;
}
.wa-flutuante svg{width:26px;height:26px;fill:currentColor;stroke:none}
.wa-flutuante--visivel{opacity:1;transform:none;pointer-events:auto}
.wa-flutuante:hover{background:var(--action-quente)}
.wa-flutuante:active{transform:scale(.93)}

/* ---------- 20. ESTADOS DE ANIMAÇÃO ---------- */
html.anim [data-reveal]{opacity:0;transform:translateY(22px)}
html.anim [data-linhas]{opacity:0}
html.anim [data-fio]{transform:scaleX(0)}
html.anim [data-foto] img{opacity:0}
.linha-mascara{display:block;overflow:hidden}
.linha-mascara > span{display:block;will-change:transform}

@media (prefers-reduced-motion:reduce){
  html.anim [data-reveal],html.anim [data-linhas],html.anim [data-foto] img{opacity:1!important;transform:none!important}
  html.anim [data-fio]{transform:none!important}
  .botao,.opcao span,.marco,.item,.plano{transition:none!important}
}

/* ---------- 21. IMPRESSÃO ---------- */
@media print{
  .topo,.wa-flutuante,.pular,body::before{display:none!important}
  body{background:#fff;color:#000}
}

/* ---------- 22. PÁGINAS DE DOCUMENTO (termos / privacidade) ---------- */
.doc{max-width:820px;margin-inline:auto;padding:9rem var(--gutter) var(--secao)}
.doc__volta{margin-bottom:var(--e5)}
.doc h1{
  font-family:var(--display); font-weight:400;
  font-size:clamp(2rem,5vw,3.4rem); line-height:1.08; letter-spacing:-.03em;
}
.doc__data{margin-top:var(--e3);font-size:.8rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.doc h2{
  font-family:var(--display); font-weight:400; font-size:clamp(1.3rem,2.6vw,1.75rem);
  letter-spacing:-.02em; margin-top:var(--e6); padding-top:var(--e4);
  border-top:1px solid var(--hair); color:var(--action);
}
.doc p,.doc li{color:var(--muted);line-height:1.85;margin-top:var(--e3)}
.doc ul{margin-top:var(--e2);padding-left:1.2rem}
.doc li{margin-top:.5rem}
.doc strong{color:var(--ink);font-weight:500}
.doc a{color:var(--action);border-bottom:1px solid rgba(203,174,107,.4)}
.doc a:hover{border-bottom-color:var(--action)}