/* SYNCRO, home v2: claro, quente, editorial. Compartilhado pelas variações A e B. */
:root{
  --bg:#FAF8F4;        /* off-white */
  --sand:#EFE8DD;      /* bege das faixas */
  --line:#DDD3C4;
  --ink:#2A2622;       /* marrom quase preto */
  --ink-2:#6B6157;
  --terra:#B5603A;     /* detalhes: ícones, números, sublinhados */
  --terra-btn:#A65530; /* botão (contraste 5:1 com branco) */
  --terra-txt:#9C4D2A; /* texto pequeno em terracota */
  --paper:#ECE4D7;
  --serif:'Instrument Serif', 'Times New Roman', serif;
  --sans:'DM Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --r-lg:28px;
  --grain:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .16 0 0 0 0 .14 0 0 0 0 .12 0 0 0 .6 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth; -webkit-text-size-adjust:100%;}
body{font-family:var(--sans); font-size:17px; line-height:1.65; color:var(--ink); background:var(--bg);}
img,video{display:block; max-width:100%;}
a{color:inherit;}
:focus-visible{outline:2px solid var(--terra); outline-offset:3px;}
::selection{background:#E9D3C4;}

h1,h2,h3.serif{font-family:var(--serif); font-weight:400; letter-spacing:-.005em; color:var(--ink);}
h1 em,h2 em,h3 em{font-style:italic; color:var(--terra-txt);}
h1{font-size:clamp(46px, 12.4vw, 104px); line-height:.98;}
h2{font-size:clamp(38px, 9vw, 68px); line-height:1.02; max-width:16ch;}
h3{font-family:var(--sans); font-weight:500; font-size:19px; line-height:1.35;}
p{max-width:60ch;}
.wrap{max-width:1240px; margin:0 auto; padding:0 20px;}
section{padding:88px 0;}
.sand{background:var(--sand);}
.label{display:block; font-size:14px; font-weight:500; letter-spacing:.16em; text-transform:uppercase; color:var(--terra-txt); margin-bottom:18px;}
.lead{font-size:19px; color:var(--ink-2); margin-top:20px;}
.muted{color:var(--ink-2);}
.ul{text-decoration:underline; text-decoration-color:var(--terra); text-decoration-thickness:1.5px; text-underline-offset:5px;}

/* ícones de traço fino, terracota */
.i{width:28px; height:28px; fill:none; stroke:var(--terra); stroke-width:1.3; stroke-linecap:round; stroke-linejoin:round; flex:none;}

/* botões em pílula */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:52px; padding:14px 26px; border-radius:999px; background:var(--terra-btn); color:#fff; font-weight:500; font-size:17px; text-decoration:none; border:1.5px solid var(--terra-btn); transition:background .2s, color .2s;}
.btn:hover{background:#8F4727; border-color:#8F4727;}
.btn.dark{background:transparent; color:var(--ink); border-color:var(--ink);}
.btn.dark:hover{background:var(--ink); color:var(--bg);}
.btn svg{width:20px; height:20px; fill:currentColor;}
.ctas{display:flex; flex-wrap:wrap; gap:12px; margin-top:32px;}

/* MENU EM PÍLULA FLUTUANTE */
.pill{position:fixed; top:12px; left:50%; transform:translateX(-50%); z-index:60; width:calc(100% - 24px); max-width:720px; display:flex; align-items:center; justify-content:space-between; gap:10px; background:var(--ink); color:var(--bg); border-radius:999px; padding:6px 6px 6px 20px; box-shadow:0 10px 30px -12px rgba(42,38,34,.45);}
.pill .logo-full{height:20px; width:auto;}
.pill nav{display:flex; align-items:center; gap:6px;}
.pill .link{font-size:16px; text-decoration:none; padding:0 12px; min-height:44px; display:flex; align-items:center; white-space:nowrap; color:#EDE6DA;}
.pill .link:hover{color:#fff; text-decoration:underline; text-underline-offset:5px; text-decoration-color:var(--terra);}
.pill .btn{min-height:44px; padding:8px 18px; font-size:16px; gap:0;}
@media (max-width:430px){ .pill{padding-left:16px;} .pill .logo-full{height:17px;} .pill .link{padding:0 8px;} .hide-sm{display:none;} }

/* FOTO / PAPEL COM EFEITO APAGADO */
.photo{position:relative; overflow:hidden; border-radius:var(--r-lg); background:var(--paper); isolation:isolate;}
.photo img,.photo .paper{width:100%; height:100%; object-fit:cover; filter:saturate(.75) contrast(.95) sepia(.08);}
.photo .paper{position:absolute; inset:0; background:
   radial-gradient(120% 80% at 18% 12%, rgba(255,255,255,.6), transparent 60%),
   radial-gradient(90% 70% at 90% 95%, rgba(181,96,58,.09), transparent 55%),
   linear-gradient(160deg, #EFE7DA, #E6DCCC);}
.photo::before{content:""; position:absolute; inset:0; background:rgba(239,232,221,.16); z-index:1; pointer-events:none;}
.photo::after{content:""; position:absolute; inset:0; background-image:var(--grain); opacity:.22; mix-blend-mode:multiply; z-index:1; pointer-events:none;}
.photo .cap{position:absolute; z-index:2; left:20px; top:18px; right:20px; font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-2);}
.photo .cap span{display:block; letter-spacing:0; text-transform:none; font-size:15px; margin-top:2px;}
.frame{background:var(--sand); padding:10px; border-radius:calc(var(--r-lg) + 10px);}
.sand .frame{background:var(--bg);}

/* foto real da Ana: sem efeito apagado, sem grão */
.photo.natural::before,.photo.natural::after{display:none;}
.photo.natural img,.js .photo.natural img,.js .photo.natural.in img{filter:none;}
.js .photo.natural img{transform:scale(1.03); transition:transform 1.6s ease;}
.js .photo.natural.in img{transform:scale(1);}

/* CARTÃO "CLIENTE NOVO" */
.call{background:var(--bg); border:1px solid var(--line); border-radius:22px; padding:16px 18px 18px; width:100%; max-width:330px; box-shadow:0 18px 40px -22px rgba(42,38,34,.35);}
.call-top{display:flex; align-items:center; gap:12px;}
.call-ic{width:40px; height:40px; border-radius:50%; border:1px solid var(--line); display:grid; place-items:center;}
.call-ic .i{width:20px; height:20px;}
.call-top b{display:block; font-weight:500; font-size:16px;}
.call-top small{display:block; font-size:14px; color:var(--ink-2);}
.call .tag{margin-left:auto; font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-2); border:1px solid var(--line); border-radius:999px; padding:2px 10px;}
.call .en{font-family:var(--serif); font-size:24px; line-height:1.15; margin-top:14px;}
.call .pt{font-size:16px; color:var(--ink-2); margin-top:6px;}

/* FATOS */
.facts{display:grid; grid-template-columns:1fr 1fr; border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.fact{padding:24px 14px 24px 0; font-size:16px; color:var(--ink-2); line-height:1.45;}
.fact:nth-child(even){padding-left:16px; border-left:1px solid var(--line);}
.fact:nth-child(-n+2){border-bottom:1px solid var(--line);}
.fact b{display:block; font-family:var(--serif); font-weight:400; font-size:32px; line-height:1.05; color:var(--ink); margin-bottom:6px;}

/* PROBLEMA */
.split{display:grid; gap:36px;}
.pains{list-style:none; border-top:1px solid var(--line);}
.pain{display:grid; grid-template-columns:auto 1fr; gap:18px; padding:28px 0; border-bottom:1px solid var(--line);}
.pain h3{margin-bottom:6px;}
.pain p{color:var(--ink-2);}

/* RAMOS */
.ramos{list-style:none; display:grid; margin-top:40px; border-top:1px solid var(--line);}
.ramo{display:grid; grid-template-columns:auto 1fr; gap:18px; padding:24px 0; border-bottom:1px solid var(--line);}
.ramo h3{font-family:var(--serif); font-size:28px; line-height:1.1; margin-bottom:6px;}
.ramo p{color:var(--ink-2);}

/* PASSOS: lista editorial numerada */
.steps{list-style:none; margin-top:44px; border-top:1px solid var(--ink);}
.step{display:grid; grid-template-columns:64px 1fr; gap:8px 16px; padding:28px 0; border-bottom:1px solid var(--line);}
.step .n{font-family:var(--serif); font-size:44px; line-height:.9; color:var(--terra);}
.step h3{font-family:var(--serif); font-size:30px; line-height:1.05;}
.step p{color:var(--ink-2); grid-column:2;}

/* PRINCÍPIO */
.principio-grid{display:grid; gap:40px; align-items:center;}
.principio .photo{aspect-ratio:4/3;}
@media (min-width:760px){ .principio .photo{aspect-ratio:4/5;} }
.principio p{font-size:19px; color:var(--ink-2); margin-top:22px;}

/* VOCABULÁRIO */
.gloss{display:grid; margin-top:40px; border-top:1px solid var(--line);}
.term{display:flex; flex-wrap:wrap; justify-content:space-between; align-items:baseline; gap:4px 18px; padding:18px 0; border-bottom:1px solid var(--line);}
.term dt{font-family:var(--serif); font-size:30px; line-height:1.1;}
.term dd{font-size:16px; color:var(--ink-2);}

/* PLANOS: uma folha só, colunas divididas por linhas */
.planos{margin-top:44px; background:var(--bg); border:1px solid var(--line); border-radius:var(--r-lg); display:grid;}
.plano{padding:30px 24px; display:flex; flex-direction:column; border-bottom:1px solid var(--line); position:relative;}
.plano:last-child{border-bottom:none;}
.plano .tagline{font-size:14px; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-2); min-height:20px;}
.plano.destaque .tagline{color:var(--terra-txt);}
.plano.destaque::before{content:""; position:absolute; left:24px; right:24px; top:0; height:2px; background:var(--terra);}
.plano h3{font-family:var(--serif); font-size:34px; line-height:1.05; margin-top:8px;}
.plano .quem{font-size:16px; color:var(--ink-2); margin:8px 0 22px;}
.preco{font-family:var(--serif); font-size:56px; line-height:1;}
.preco span{font-family:var(--sans); font-size:16px; color:var(--ink-2);}
.pp{font-size:16px; color:var(--terra-txt); margin:8px 0 22px;}
.plano ul{list-style:none; flex:1; margin-bottom:26px; border-top:1px solid var(--line);}
.plano li{padding:10px 0 10px 26px; border-bottom:1px solid var(--line); font-size:16px; position:relative;}
.plano li::before{content:""; position:absolute; left:2px; top:20px; width:12px; height:1.5px; background:var(--terra);}
.plano .btn{width:100%; padding:12px 8px; font-size:16px; white-space:nowrap;}
.planos-nota{font-size:16px; color:var(--ink-2); margin-top:24px;}

/* DEPOIMENTOS */
.videos{display:grid; gap:36px; margin-top:44px;}
.vid{margin:0;}
.vid .frame{border-radius:32px;}
.vid video{width:100%; aspect-ratio:16/9; object-fit:cover; background:#000; border-radius:24px;}
.vid.vert{max-width:320px;}
.vid.vert video{aspect-ratio:9/16;}
.vid figcaption{margin-top:16px;}
.vid figcaption b{display:block; font-family:var(--serif); font-weight:400; font-size:30px; line-height:1.1;}
.vid figcaption span{font-size:14px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-2);}

/* SOBRE */
.sobre{display:grid; gap:40px; align-items:start;}
.sobre .photo{aspect-ratio:4/5; max-width:440px;}
.sobre .bio p{color:var(--ink-2); font-size:18px; margin-top:18px;}

/* FAQ */
.faq-list{margin-top:36px; border-top:1px solid var(--line);}
details.faq{border-bottom:1px solid var(--line);}
details.faq summary{list-style:none; cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:18px; padding:22px 0; min-height:48px; font-size:18px; font-weight:500;}
details.faq summary::-webkit-details-marker{display:none;}
details.faq summary .i{width:22px; height:22px; transition:transform .3s;}
details.faq[open] summary .i{transform:rotate(45deg);}
details.faq p{color:var(--ink-2); padding-bottom:22px;}

/* CTA FINAL */
.final h2{max-width:18ch;}
.final p{font-size:19px; color:var(--ink-2); margin-top:20px;}

footer{background:var(--ink); color:#CFC6B8; font-size:16px; padding:32px 0 100px;}
footer .wrap{display:flex; flex-wrap:wrap; align-items:center; gap:6px 22px;}
footer img{height:20px; width:auto; margin-right:auto;}
footer a{color:#FAF8F4; display:inline-flex; align-items:center; min-height:44px; text-underline-offset:5px; text-decoration-color:var(--terra);}

.js .zap{opacity:0; transform:translateY(12px); pointer-events:none; transition:opacity .4s, transform .4s;}
.js .zap.show{opacity:1; transform:none; pointer-events:auto;}
.zap{position:fixed; right:16px; bottom:16px; z-index:59; width:56px; height:56px; border-radius:50%; background:var(--ink); display:grid; place-items:center; box-shadow:0 10px 26px -10px rgba(42,38,34,.6);}
.zap svg{width:28px; height:28px; fill:#FAF8F4;}

/* MOVIMENTO (só com JS; sem JS tudo aparece) */
.js .rv{opacity:0; transform:translateY(20px); transition:opacity .9s ease, transform .9s cubic-bezier(.2,.7,.2,1); transition-delay:calc(var(--d,0) * 110ms);}
.js .rv.in{opacity:1; transform:none;}
.js .photo img,.js .photo .paper{filter:saturate(.45) contrast(.92) sepia(.08) blur(6px); transform:scale(1.04); transition:filter 1.8s ease, transform 2.6s ease;}
.js .photo.in img,.js .photo.in .paper{filter:saturate(.75) contrast(.95) sepia(.08) blur(0); transform:scale(1);}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  .js .rv{opacity:1; transform:none; transition:none;}
  .js .photo img,.js .photo .paper{filter:saturate(.75) contrast(.95) sepia(.08); transform:none; transition:none;}
  details.faq summary .i{transition:none;}
  .js .photo.natural img{transform:none; transition:none;}
}

@media (min-width:760px){
  section{padding:128px 0;}
  .facts{grid-template-columns:repeat(4,1fr);}
  .fact,.fact:nth-child(even){padding:30px 24px; border-bottom:none; border-left:1px solid var(--line);}
  .fact:first-child{border-left:none; padding-left:0;}
  .split{grid-template-columns:5fr 6fr; gap:72px;}
  .split .sticky{position:sticky; top:110px; align-self:start;}
  .ramos{grid-template-columns:1fr 1fr; column-gap:64px;}
  .step{grid-template-columns:120px 1fr 1.2fr; gap:24px; align-items:baseline; padding:36px 0;}
  .step .n{font-size:64px;}
  .step p{grid-column:auto;}
  .principio-grid{grid-template-columns:5fr 6fr; gap:80px;}
  .gloss{grid-template-columns:1fr 1fr; column-gap:64px;}
  .planos{grid-template-columns:1fr 1fr;}
  .plano{border-bottom:1px solid var(--line);}
  .plano:nth-child(odd){border-right:1px solid var(--line);}
  .plano:nth-child(n+3){border-bottom:none;}
  .videos{grid-template-columns:3.1fr 1fr; align-items:end;}
  .sobre{grid-template-columns:5fr 6fr; gap:80px; align-items:center;}
  .faq-grid{display:grid; grid-template-columns:5fr 6fr; gap:72px;}
  .faq-grid .faq-list{margin-top:0;}
}
@media (min-width:1180px){
  .planos{grid-template-columns:repeat(4,1fr);}
  .plano,.plano:nth-child(odd){border-bottom:none; border-right:1px solid var(--line);}
  .plano:last-child{border-right:none;}
}
