@font-face{font-family:"Bebas Neue";font-style:normal;font-weight:400;font-display:swap;src:url("/fonts/bebas-neue-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Manrope";font-style:normal;font-weight:300;font-display:swap;src:url("/fonts/manrope-latin-300-normal.woff2") format("woff2")}
@font-face{font-family:"Manrope";font-style:normal;font-weight:400;font-display:swap;src:url("/fonts/manrope-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Manrope";font-style:normal;font-weight:500;font-display:swap;src:url("/fonts/manrope-latin-500-normal.woff2") format("woff2")}
@font-face{font-family:"Manrope";font-style:normal;font-weight:600;font-display:swap;src:url("/fonts/manrope-latin-600-normal.woff2") format("woff2")}
/* página inicial no mesmo estilo da proposta: escuro, vidro, fonte condensada */
:root{
  --ink:#f4f1ec; --ink2:#14110e; --paper:#0b0a09; --paper2:#14110e; --wood:#c9a074; --mute:#b8b2a8; --line:rgba(244,241,236,.16);
  --display:"Bebas Neue","Oswald","Arial Narrow",Impact,sans-serif;
  --serif:"Manrope","Helvetica Neue",Helvetica,Arial,system-ui,sans-serif; --sans:"Manrope","Helvetica Neue",Helvetica,Arial,system-ui,sans-serif;
}
html,body{background:#0b0a09;color:#f4f1ec}
h1,h2,h3,.big,[class*="title"]{font-family:var(--display);font-weight:400;text-transform:uppercase;letter-spacing:.01em}
button,input{color:inherit}
input{background:rgba(255,255,255,.06)}

/* ---- topo: ao rolar vira vidro escuro (antes ficava claro e o texto sumia) ---- */
.top.solid{background:rgba(11,10,9,.72);-webkit-backdrop-filter:blur(18px) saturate(1.2);backdrop-filter:blur(18px) saturate(1.2);color:#f4f1ec;border-bottom:1px solid rgba(244,241,236,.12)}
.top.solid .logo{filter:none}
.top nav a,.top .mini,.top .adm{color:#f4f1ec}

/* ---- fundos escuros em todas as seções ---- */
.manifesto,.sec,.proc,.amb{background:#0b0a09;color:#f4f1ec;position:relative;overflow:hidden}
.manifesto::before,.sec::before,.proc::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(60% 50% at 85% 10%,rgba(201,160,116,.13),transparent 70%),radial-gradient(50% 40% at 5% 90%,rgba(201,160,116,.08),transparent 70%)}
.manifesto>*,.sec>*,.proc>*{position:relative}
.proc{background:#100e0c}
.split p,.steps span,.note{color:#b8b2a8}
.split .eyebrow,.eyebrow{color:var(--wood)}
.amb h2,.sec h2,.split h3,.manifesto .big{color:#f4f1ec}

/* ---- hero: a foto da sala com TV, brilho quente e vidro ---- */
.hero{background:#0b0a09 url("/sala-tv.jpg") center/cover no-repeat}
.hero .media{display:none}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(45% 35% at 50% 42%,rgba(201,160,116,.22),transparent 70%);mix-blend-mode:screen;animation:respira 7s ease-in-out infinite alternate;z-index:1}
@keyframes respira{from{opacity:.55}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.hero::before{animation:none}}
.hero h1{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:clamp(50px,13vw,132px);line-height:.9;letter-spacing:.005em}
.hero h1 em{color:var(--wood)}
.hero p.sub{color:rgba(244,241,236,.82)}
.hero .eyebrow{color:var(--wood)}

/* ---- vidro nos botões, números e etapas ---- */
.btn{background:rgba(255,255,255,.06);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-color:rgba(244,241,236,.35);color:#f4f1ec}
.btn:hover{background:rgba(244,241,236,.16)}
.btn.solid{background:#f4f1ec;color:#0b0a09;border-color:#f4f1ec}
.btn.dark{background:#f4f1ec;color:#0b0a09}
.facts>div{background:linear-gradient(160deg,rgba(255,255,255,.09),rgba(255,255,255,.03));border:1px solid rgba(244,241,236,.14);border-radius:18px;padding:20px 18px;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.facts{border-top:0;padding-top:0;gap:14px}
.facts b{font-family:var(--display);font-weight:400;font-size:34px;letter-spacing:.02em;text-transform:uppercase}
.steps li{background:rgba(255,255,255,.04);border:1px solid rgba(244,241,236,.12);border-radius:18px;padding:22px 20px;margin-bottom:10px}
@media (min-width:900px){.steps li{margin-bottom:0}}
.steps li::before{font-family:var(--display)}
.card{border-radius:20px;border:1px solid rgba(244,241,236,.14)}
.card h3,.card .num{font-family:var(--display);text-transform:uppercase}
.ph,.gal figure{border-radius:18px}
.arw{background:rgba(255,255,255,.06);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.arw:hover{background:#f4f1ec;color:#0b0a09}

/* botão Início (ícone da casa) no topo */
.top .home{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border:1px solid rgba(244,241,236,.35);border-radius:50%;color:#f4f1ec;background:rgba(255,255,255,.06)}
.top .home svg{width:16px;height:16px}
.top .home:hover{background:#f4f1ec;color:#0b0a09}

/* fechamento: escuro, botão grande e o WhatsApp ao lado dele */
.final{background:#0b0a09;color:#f4f1ec;position:relative;overflow:hidden}
.final::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(55% 45% at 80% 20%,rgba(201,160,116,.16),transparent 70%)}
.final>*{position:relative}
.final h2{color:#f4f1ec;font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:clamp(46px,11vw,112px);line-height:.92;max-width:14ch}
.final h2 em{color:var(--wood)}
.ctarow{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.btn.big{min-height:68px;padding:0 38px;font-size:19px;letter-spacing:.05em;gap:12px}
.btn.big svg{width:24px;height:24px}
.waic{width:68px;height:68px;border-radius:50%;background:#25d366;color:#fff;display:grid;place-items:center;box-shadow:0 10px 30px rgba(37,211,102,.35);transition:transform .25s}
.waic:hover{transform:scale(1.07)}
.waic svg{width:32px;height:32px}
.foot{color:#b8b2a8}
.ctarow{flex-wrap:nowrap}
.btn.big{flex:1 1 auto;white-space:nowrap;max-width:420px}
@media (max-width:480px){.btn.big{padding:0 16px;font-size:16px;letter-spacing:.02em;gap:8px;min-height:62px}.waic{flex:none;width:62px;height:62px}}
.wa{transition:opacity .3s,transform .3s}
.wa.some{opacity:0;pointer-events:none;transform:scale(.8)}

/* encaixe do WhatsApp dentro do botão branco */
.btn.big{gap:14px;padding-left:12px}
.slot{flex:none;width:46px;height:46px;border-radius:50%;border:1.5px dashed rgba(11,10,9,.35);background:rgba(11,10,9,.05);box-shadow:inset 0 2px 6px rgba(0,0,0,.18);transition:border-color .4s,background-color .4s}
.slot.cheio{border-color:transparent;animation:encaixe .7s ease-out both}
@keyframes encaixe{0%{box-shadow:0 0 0 0 rgba(37,211,102,.55)}100%{box-shadow:0 0 0 16px rgba(37,211,102,0)}}
.wa.voando{transition:transform .9s cubic-bezier(.2,.8,.2,1)}
.wa.preso{transition:none}
@media (prefers-reduced-motion:reduce){.wa.voando{transition:none}.slot.cheio{animation:none}}
@media (max-width:480px){.slot{width:42px;height:42px}.btn.big{padding-left:10px}}