/* fontes servidas daqui (só o conjunto latino, que cobre o português) */
@font-face{font-family:"Instrument Serif";font-style:normal;font-weight:400;font-display:swap;src:url(../assets/fonts/instrument-serif-400.woff2) format("woff2")}
@font-face{font-family:"Inter Tight";font-style:normal;font-weight:300 700;font-display:swap;src:url(../assets/fonts/inter-tight-var.woff2) format("woff2")}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:400 500;font-display:swap;src:url(../assets/fonts/jetbrains-mono-var.woff2) format("woff2")}
/* =========================================================
   AgêncIA Imob · A nova era do corretor
   ========================================================= */
:root{
  --bg:#04030a;
  --ink:#eef0ff;
  --ink-2:rgba(226,230,255,.74);
  --ink-3:rgba(210,216,255,.5);
  --line:rgba(150,170,255,.18);
  --blue:#5b8cff;
  --violet:#9d6bff;
  --cyan:#8fdcff;
  --gold:#ffd9a0;
  --warn:#ffb36b;
  --ok:#7dffc1;
  --glass:rgba(10,10,28,.55);
  --f-display:"Instrument Serif", "Times New Roman", serif;
  --f-body:"Inter Tight", system-ui, sans-serif;
  --f-mono:"JetBrains Mono", ui-monospace, monospace;
  --gutter:clamp(16px, 4vw, 64px);
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
html.lenis, html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto !important}
body{background:var(--bg);font-family:var(--f-body);font-size:clamp(15px,1.05vw,17px);line-height:1.55;overflow-x:hidden}
img,video{display:block;max-width:100%;height:auto}
a{color:inherit}
b,strong{font-weight:600}
em{font-style:normal}
.mono{font-family:var(--f-mono);letter-spacing:.02em}
.accent{background:linear-gradient(92deg,var(--cyan),var(--blue) 40%,var(--violet));-webkit-background-clip:text;background-clip:text;color:transparent}
.sep{opacity:.35;margin:0 .5em}
.display{font-family:var(--f-display);font-weight:400;letter-spacing:-.02em;line-height:.95}
.kicker{font-size:12px;text-transform:uppercase;letter-spacing:.18em;color:var(--ink-3)}

/* ---------- filme ---------- */
#film{position:fixed;inset:0;z-index:0;background:#000;overflow:hidden}
#film .film-clip,#film .film-still{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .35s linear;transform-origin:50% 45%}
#film .on{opacity:1}
#film::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 50%,rgba(0,0,0,0) 45%,rgba(2,1,8,.55) 100%),linear-gradient(to bottom,rgba(2,1,8,.35),rgba(2,1,8,0) 18%,rgba(2,1,8,0) 80%,rgba(2,1,8,.45))}
/* clarão da iluminação: nasce no ponto onde a partícula toca a testa e toma a tela */
#flash{position:fixed;inset:0;z-index:15;pointer-events:none;opacity:0;
  background:radial-gradient(circle at var(--fx,60%) var(--fy,25%),#ffffff 0%,#f4efff 18%,#d9c9ff 38%,#a98bff 62%,rgba(91,140,255,.85) 100%)}
#grain{position:fixed;inset:-50%;z-index:1;pointer-events:none;opacity:.06;
  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='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain 1.2s steps(6) infinite}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-3%)}60%{transform:translate(-2%,-1%)}80%{transform:translate(3%,3%)}100%{transform:translate(0,0)}}

/* ---------- loader ---------- */
#loader{position:fixed;inset:0;z-index:50;display:grid;place-content:center;justify-items:center;gap:22px;background:var(--bg);transition:opacity 1.2s ease,visibility 1.2s}
#loader p{font-size:12px;color:var(--ink-3)}
.loader-dot{width:8px;height:8px;border-radius:50%;background:#fff;box-shadow:0 0 12px 3px #8fb4ff,0 0 40px 10px #7a5cff;animation:breathe 1.6s ease-in-out infinite}
@keyframes breathe{50%{transform:scale(1.6);box-shadow:0 0 18px 5px #8fb4ff,0 0 70px 20px #7a5cff}}
body:not(.is-loading) #loader{opacity:0;visibility:hidden}

/* ---------- topo ---------- */
.top{position:fixed;top:0;left:0;right:0;z-index:20;display:flex;justify-content:space-between;align-items:center;padding:18px var(--gutter);pointer-events:none}
.top > *{pointer-events:auto}
/* Black November (até 30/11/2026): faixa fixa de uma linha acima do topo; o topo desce a altura dela */
.black-barra{position:fixed;top:0;left:0;right:0;z-index:21;height:34px;display:flex;align-items:center;justify-content:center;padding:0 var(--gutter);white-space:nowrap;overflow:hidden;font-size:13px;font-weight:500;color:#1a1206;background:linear-gradient(100deg,#ffe6bf,#ffc98a)}
.black-barra b{font-weight:700;margin:0 .3em}
.black-barra s{margin:0 .3em;opacity:.6;text-decoration-thickness:1.5px}
.black-selo{display:inline-block;margin:0 6px 0 0;padding:2px 9px;border-radius:999px;background:#000;color:var(--gold);font-family:var(--f-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase}
body:has(.black-barra) .top{top:34px}
.faixa-de{color:var(--ink-2);margin-top:6px}
.faixa-de s,.ancora s{text-decoration-color:#ff8f7a;text-decoration-thickness:2px}
.brand{font-weight:500;font-size:15px;text-decoration:none}
.brand b{color:var(--cyan);font-weight:600}
.top-nav{display:flex;align-items:center;gap:26px;font-size:14px}
.top-nav a:not(.btn){text-decoration:none;color:var(--ink-2);transition:color .2s}
.top-nav a:not(.btn):hover{color:var(--ink)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6em;text-decoration:none;font-weight:600;color:#07061a;text-align:center;
  background:linear-gradient(100deg,#c8e6ff,#8fb4ff 45%,#b18cff);border-radius:999px;padding:.95em 1.7em;
  box-shadow:0 0 0 1px rgba(255,255,255,.25) inset,0 10px 40px -8px rgba(122,92,255,.7);transition:transform .25s,box-shadow .25s}
.btn:hover{transform:translateY(-2px);box-shadow:0 0 0 1px rgba(255,255,255,.4) inset,0 16px 60px -6px rgba(122,92,255,.95)}
.btn:focus-visible{outline:2px solid var(--cyan);outline-offset:4px}
.btn-sm{padding:.6em 1.15em;font-size:13px}
.btn-xl{font-size:clamp(15px,1.2vw,18px);padding:1.1em 2em;width:100%}
.btn-pro{background:linear-gradient(100deg,#ffe7c2,#ffc98a 45%,#ff9f6b);box-shadow:0 0 0 1px rgba(255,255,255,.3) inset,0 10px 40px -8px rgba(255,160,90,.6)}

/* ---------- HUD ---------- */
.hud{position:fixed;z-index:20;right:var(--gutter);bottom:24px;display:grid;justify-items:end;gap:6px;font-size:11px;color:var(--ink-3);pointer-events:none;transition:opacity .6s}
.hud-nivel{font-size:12px;color:var(--ink-2);padding:6px 12px;border:1px solid var(--line);border-radius:999px;background:rgba(6,6,18,.55);backdrop-filter:blur(8px)}
.hud-nivel b{color:var(--cyan);font-weight:500}
.hud-k,.hud-sep{color:var(--ink-3)}
.hud-nivel.sobe{animation:sobe .9s ease}
@keyframes sobe{0%{box-shadow:0 0 0 0 rgba(143,220,255,.6)}100%{box-shadow:0 0 0 14px rgba(143,220,255,0)}}
.hud-bar{width:160px;height:1px;background:var(--line);position:relative;overflow:hidden}
.hud-bar i{position:absolute;inset:0;background:linear-gradient(90deg,var(--blue),var(--violet));transform-origin:left;transform:scaleX(0)}
body.after-journey .hud{opacity:0}

/* ---------- jornada ---------- */
main{position:relative;z-index:3}
.stage{position:relative;height:var(--h,220vh)}
.panel{position:fixed;inset:0;height:100vh;height:100svh;padding:96px var(--gutter) 70px;opacity:0;will-change:opacity;pointer-events:none}
.panel.on{pointer-events:auto}

/* hero */
.panel-hero{display:flex;flex-direction:column;justify-content:center;gap:24px}
.panel-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(4,3,10,.75),rgba(4,3,10,.35) 45%,rgba(4,3,10,0) 65%)}
.selo{display:inline-flex;align-items:center;gap:10px;align-self:flex-start;font-size:13px;color:var(--ink-2);padding:8px 14px;border:1px solid var(--line);border-radius:999px;background:rgba(10,10,28,.5);backdrop-filter:blur(8px)}
.selo b{color:var(--ink);font-weight:500}
.selo-ponto{width:7px;height:7px;border-radius:50%;background:var(--ok);box-shadow:0 0 10px var(--ok);flex:none}
.hero-title{font-size:clamp(2.6rem,5.4vw,6.2rem);max-width:17ch}
.hero-title .line{display:block}
.hero-sub{max-width:44ch;color:var(--ink-2);font-size:clamp(16px,1.2vw,19px)}
.hero-sub b{color:var(--ink);font-weight:500}
.hero-acoes{display:flex;align-items:center;gap:26px;flex-wrap:wrap}
.scroll-cue{display:flex;align-items:center;gap:12px;font-size:11px;color:var(--ink-3);text-transform:uppercase;letter-spacing:.2em}
.scroll-cue i{width:1px;height:40px;background:linear-gradient(var(--cyan),transparent);animation:cue 2s ease-in-out infinite;transform-origin:top}
/* dica de rolagem: só no celular (o computador tem a .scroll-cue ao lado do botão) */
.role{display:none;position:fixed;z-index:30;left:50%;bottom:calc(18px + env(safe-area-inset-bottom));translate:-50% 0;flex-direction:column;align-items:center;gap:6px;padding:0;border:0;background:none;color:#fff;cursor:pointer;opacity:0;pointer-events:none;transition:opacity .5s ease}
.role.on{opacity:1;pointer-events:auto}
.role-txt{font-size:11px;letter-spacing:.2em;text-transform:uppercase;padding:10px 16px;border-radius:999px;background:rgba(4,3,10,.6);border:1px solid rgba(143,220,255,.35);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 0 24px rgba(122,92,255,.25)}
.role-setas{display:flex;flex-direction:column;align-items:center;height:26px}
.role-setas i{display:block;width:12px;height:12px;margin-top:-4px;border-right:2px solid var(--cyan);border-bottom:2px solid var(--cyan);rotate:45deg;animation:role 1.5s ease-in-out infinite}
.role-setas i:nth-child(2){animation-delay:.18s}
@keyframes role{0%{opacity:0;translate:0 -6px}50%{opacity:1}100%{opacity:0;translate:0 8px}}
@keyframes cue{0%{transform:scaleY(0)}50%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}

/* centro */
.panel-center{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:20px}
.giant{font-size:clamp(3.6rem,10vw,11rem);text-shadow:0 6px 60px rgba(0,0,0,.55)}
.giant.soft{text-shadow:0 0 60px rgba(255,217,160,.35)}
.mega{font-size:clamp(4rem,12vw,13rem);text-shadow:0 0 80px rgba(157,107,255,.35)}
.center-sub{color:var(--ink-2);font-size:clamp(17px,1.6vw,24px)}
.center-sub.big{font-family:var(--f-display);font-size:clamp(2rem,4.4vw,4.6rem);line-height:1;color:var(--ink)}
.accent-txt{background:linear-gradient(92deg,var(--cyan),var(--blue) 40%,var(--violet));-webkit-background-clip:text;background-clip:text;color:transparent}
.center-note{max-width:56ch;color:var(--ink);font-size:clamp(15px,1.15vw,18px);padding:16px 22px;border-radius:16px;background:rgba(4,3,10,.6);backdrop-filter:blur(10px);border:1px solid var(--line)}
.panel-side{align-items:flex-end;text-align:right;padding-right:calc(var(--gutter) + 2vw)}
.panel-side::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(270deg,rgba(4,3,10,.78) 0%,rgba(4,3,10,.45) 35%,rgba(4,3,10,0) 60%)}
.panel-side .giant,.panel-side .mega{font-size:clamp(3.6rem,9vw,10rem)}
/* "Uma ideia entra": do lado da janela, o rosto fica livre à direita */
.panel-left{align-items:flex-start;text-align:left;padding-left:calc(var(--gutter) + 2vw)}
.panel-left::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(4,3,10,.72) 0%,rgba(4,3,10,.35) 38%,rgba(4,3,10,0) 58%)}
.panel-left .giant{font-size:clamp(3.4rem,8vw,9rem)}
/* "Começa a nova era": centralizado sobre o fundo novo */
.panel-era::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 65% 60% at 50% 50%,rgba(4,3,10,.6),rgba(4,3,10,.2) 70%,rgba(4,3,10,0))}

/* topo: assinatura curta */
.hero-autor{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3)}
/* o diferencial: AgêncIA Imob Auto-Pilot (vídeo largo à direita) */
.panel-trilha.panel-autopilot{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}
.visual.v-autopilot{width:min(980px,100%);display:grid;gap:10px;padding:10px;background:rgba(8,8,22,.7);backdrop-filter:blur(12px)}
.ap-tela{position:relative;border-radius:14px;overflow:hidden;aspect-ratio:1024/492;background:#000}
.ap-tela video{width:100%;height:100%;object-fit:cover;display:block}
.ap-cta{margin-top:24px}

/* trilhas */
.panel-trilha{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(24px,5vw,80px);align-items:center}
.panel-trilha.flip .trilha{order:2}
.panel-trilha.flip .visual{order:1;justify-self:start}
.panel-trilha::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(4,3,10,.86) 0%,rgba(4,3,10,.6) 42%,rgba(4,3,10,.15) 70%)}
.panel-trilha.flip::before{background:linear-gradient(270deg,rgba(4,3,10,.86) 0%,rgba(4,3,10,.6) 42%,rgba(4,3,10,.15) 70%)}
.trilha{max-width:640px}
.trilha-wide{max-width:900px;grid-column:1/-1}
.panel-trilha.flip .trilha-wide{justify-self:end}
.trilha-num{display:flex;flex-wrap:wrap;align-items:center;gap:4px;font-size:12px;color:var(--cyan);text-transform:uppercase;letter-spacing:.18em;margin-bottom:16px}
.tag-k{margin-left:12px;color:var(--ink-2);letter-spacing:.12em}
.tag-api{margin-left:10px;font-size:10px;padding:3px 8px;border-radius:999px;border:1px solid rgba(125,255,193,.4);color:var(--ok);letter-spacing:.08em}
.trilha-title{font-size:clamp(2.3rem,4.1vw,4.5rem);line-height:1;margin-bottom:18px}
.trilha-lead{font-size:clamp(16px,1.25vw,20px);color:var(--ink);max-width:44ch;margin-bottom:22px}
.trilha-close{margin-top:22px;font-family:var(--f-display);font-size:clamp(1.4rem,2vw,2rem);line-height:1.1;color:var(--ink)}
.trilha-list{list-style:none;display:grid;gap:9px;color:var(--ink-2);font-size:clamp(14px,.98vw,16px)}
.trilha-list li,.stack li,.sistemas li,.niveis li{opacity:0;transform:translateY(10px);transition:opacity .6s,transform .6s}
.trilha-list li{position:relative;padding-left:20px}
.trilha-list li::before{content:"";position:absolute;left:0;top:.7em;width:8px;height:1px;background:var(--cyan)}
.trilha-list b{color:var(--ink);font-weight:500}
.panel.on li{opacity:1;transform:none}
.panel.on li:nth-child(2){transition-delay:.06s}.panel.on li:nth-child(3){transition-delay:.12s}.panel.on li:nth-child(4){transition-delay:.18s}
.panel.on li:nth-child(5){transition-delay:.24s}.panel.on li:nth-child(6){transition-delay:.3s}.panel.on li:nth-child(n+7){transition-delay:.36s}

/* pilha de valor */
.stack{list-style:none;display:grid;gap:0;font-size:13.5px;border-top:1px solid var(--line)}
.stack li{display:grid;grid-template-columns:auto 1fr auto;gap:2px 14px;align-items:baseline;padding:7px 0;border-bottom:1px solid var(--line)}
.stack b{color:var(--ink);font-weight:500}
.stack span{color:var(--ink-3)}
.stack i{font-style:normal;font-family:var(--f-mono);font-size:12.5px;color:var(--warn);text-decoration:line-through;text-decoration-color:rgba(255,179,107,.5)}
.stack .soma{border-bottom-color:rgba(255,179,107,.4)}
.stack .soma b,.stack .soma i{color:var(--warn);text-decoration:none;font-size:14px}
.stack .master{grid-template-columns:1fr;margin-top:10px;padding:12px 14px;border:1px solid rgba(177,140,255,.5);border-radius:12px;background:linear-gradient(100deg,rgba(91,140,255,.16),rgba(157,107,255,.2))}
.stack .master b{color:#fff}
.stack .master span{color:var(--ink-2)}

/* big bang: chat de IA × Claude Code */
.panel-bang{gap:26px}
.panel-bang::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 70% 65% at 50% 50%,rgba(4,3,10,.78),rgba(4,3,10,.45) 70%,rgba(4,3,10,.2))}
.panel-bang .center-sub{color:var(--ink);text-shadow:0 2px 20px rgba(0,0,0,.8)}
@media (min-width: 901px) and (max-height: 820px){
  .panel{padding-top:80px;padding-bottom:50px}

  .sistemas span{font-size:12px}
  .trilha-title{font-size:clamp(2rem,3.4vw,3.6rem)}
  .vs-resposta{font-size:12px}
  .stack li{padding:5px 0}
}
.panel-bang .giant{font-size:clamp(2.6rem,5.4vw,6rem);max-width:16ch;line-height:1}
.versus{display:grid;grid-template-columns:1fr 1.15fr;gap:16px;width:min(1000px,100%);text-align:left}
.vs-col{position:relative;padding:20px 22px;border-radius:20px;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);display:flex;flex-direction:column;gap:12px}
.vs-chat{background:rgba(14,14,26,.72);border:1px solid rgba(255,255,255,.1)}
.vs-claude{background:linear-gradient(160deg,rgba(40,26,90,.82),rgba(8,10,30,.9));border:1px solid rgba(177,140,255,.55);box-shadow:0 30px 90px -30px rgba(122,92,255,.8),inset 0 1px 0 rgba(255,255,255,.08)}
.vs-rot{font-size:11px;text-transform:uppercase;letter-spacing:.16em;color:var(--ink-3)}
.vs-claude .vs-rot{color:#e8a27f}
.vs-pedido{font-size:14px;color:var(--ink);padding:10px 14px;border-radius:12px;background:rgba(255,255,255,.06)}
.vs-pedido span:not(.pchev){display:block;font-size:10.5px;text-transform:uppercase;letter-spacing:.14em;color:var(--ink-3);margin-bottom:3px}
.vs-claude .vs-pedido{font-size:12.5px;background:rgba(0,0,0,.35)}
.vs-resposta{font-size:13px;line-height:1.6;color:var(--ink-3);padding:10px 14px;border-radius:12px;border:1px dashed rgba(255,255,255,.12)}
.vs-passos{list-style:none;display:grid;gap:7px;font-size:12.5px;color:var(--ink-2)}
.vs-passos li{position:relative;padding-left:22px;opacity:0;transform:translateX(-8px);transition:opacity .45s,transform .45s}
.vs-passos li::before{content:"✓";position:absolute;left:0;color:var(--ok)}
.vs-passos .vs-ok{color:var(--ok);padding:8px 12px 8px 30px;margin-top:4px;border-radius:10px;background:rgba(125,255,193,.08);border:1px solid rgba(125,255,193,.3)}
.vs-passos .vs-ok::before{left:11px;top:8px}
.panel.on .vs-passos li{opacity:1;transform:none}
.panel.on .vs-passos li:nth-child(1){transition-delay:.5s}.panel.on .vs-passos li:nth-child(2){transition-delay:.9s}.panel.on .vs-passos li:nth-child(3){transition-delay:1.3s}
.panel.on .vs-passos li:nth-child(4){transition-delay:1.7s}.panel.on .vs-passos li:nth-child(5){transition-delay:2.2s}
.vs-fim{margin-top:auto;font-family:var(--f-display);font-size:clamp(1.3rem,1.8vw,1.8rem);line-height:1;color:var(--ink-2)}
.vs-claude .vs-fim{color:var(--ink)}
.vs-claude .vs-fim b{background:linear-gradient(92deg,var(--cyan),var(--violet));-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:400}

/* sistemas + níveis */
.sistemas{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.sistemas li{display:flex;flex-direction:row;min-height:118px;overflow:hidden;border:1px solid rgba(255,255,255,.12);border-radius:16px;background:rgba(8,8,22,.82);backdrop-filter:blur(10px);box-shadow:0 20px 60px -30px rgba(0,0,0,.9)}
.sistemas img{width:40%;flex:none;height:auto;object-fit:cover;transform:scale(1.06);transition:transform 4s ease-out}
.panel.on .sistemas img{transform:scale(1)}
.sistemas li > div{padding:12px 14px;display:flex;flex-direction:column;justify-content:center;gap:4px}
#sistemas .trilha-title{font-size:clamp(2rem,3.4vw,3.8rem)}
#sistemas .trilha-lead{max-width:60ch;font-size:clamp(15px,1.1vw,18px);margin-bottom:18px}
#sistemas .trilha-wide{max-width:1180px}
.sistemas b{color:var(--ink);font-weight:500}
.sistemas span{font-size:13px;color:var(--ink-2);line-height:1.4}
.sistemas i{font-style:normal;font-size:11px;color:var(--ok);margin-top:4px}
.niveis{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.niveis li{position:relative;padding:16px 16px 18px;border:1px solid var(--line);border-radius:14px;background:var(--glass);backdrop-filter:blur(10px)}
.niveis li span{font-size:11px;color:var(--cyan);text-transform:uppercase;letter-spacing:.14em}
.niveis li b{display:block;font-family:var(--f-display);font-weight:400;font-size:clamp(1.5rem,2vw,2.1rem);line-height:1;margin:8px 0 10px}
.niveis li p{font-size:13.5px;color:var(--ink-2)}
.niveis li:nth-child(4){border-color:rgba(255,217,160,.55);background:linear-gradient(160deg,rgba(255,217,160,.14),rgba(10,10,28,.6))}
.niveis li:nth-child(4) b{color:var(--gold)}
/* a transformação: 3 ações que só o corretor faz (a última em destaque) */
.niveis.niveis-3{grid-template-columns:repeat(3,1fr)}
.niveis-3 li:nth-child(3){border-color:rgba(255,217,160,.55);background:linear-gradient(160deg,rgba(255,217,160,.14),rgba(10,10,28,.6))}
.niveis-3 li:nth-child(3) b{color:var(--gold)}

/* cartão de foto */
.visual{justify-self:end;width:min(440px,100%);position:relative;border-radius:22px;overflow:hidden;border:1px solid rgba(255,255,255,.12);
  box-shadow:0 40px 120px -30px rgba(0,0,0,.8),0 0 0 1px rgba(143,180,255,.08);transform:translateY(24px) scale(.97);transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.panel.on .visual{transform:none}
.v-foto img{width:100%;aspect-ratio:4/5;object-fit:cover;transform:scale(1.08);transition:transform 6s ease-out}
.panel.on .v-foto img{transform:scale(1)}
.chip{position:absolute;left:14px;right:14px;bottom:14px;font-size:11.5px;line-height:1.6;color:var(--ink);padding:10px 14px;border-radius:12px;background:rgba(6,6,18,.72);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.12);
  opacity:0;transform:translateY(10px);transition:all .7s .5s}
.panel.on .chip{opacity:1;transform:none}
.chip b{color:var(--ok);font-weight:500}
.chip i{display:inline-block;width:7px;height:7px;border-radius:50%;margin:0 8px 1px 0;vertical-align:middle}
.chip i.ok{background:var(--ok);box-shadow:0 0 8px var(--ok)}
.chip i.warn{background:var(--warn);box-shadow:0 0 8px var(--warn);margin-left:12px}
.chip i.live{background:#ff5f7a;box-shadow:0 0 8px #ff5f7a;animation:pisca 1.4s infinite}
@keyframes pisca{50%{opacity:.3}}
.pchev{color:var(--cyan)}

/* ---------- depois da viagem ---------- */
.after{position:relative;z-index:3;padding-top:30vh;background:linear-gradient(to bottom,rgba(4,3,10,0) 0,rgba(4,3,10,.82) 45vh,rgba(4,3,10,.95) 80vh)}
.block{padding:clamp(80px,13vh,150px) var(--gutter);max-width:1320px;margin:0 auto}
.h-xl{font-size:clamp(2.8rem,6vw,6.4rem);margin:14px 0 40px;max-width:16ch}
.realce{font-family:var(--f-display);font-size:clamp(1.5rem,2.3vw,2.4rem);line-height:1.15;color:var(--ink);max-width:34ch}
.lead{font-size:clamp(18px,1.5vw,22px);color:var(--ink-2);margin-bottom:22px}
.nota{font-size:12.5px;color:var(--ink-3);margin-top:26px;max-width:70ch}
.sub-h{font-family:var(--f-display);font-weight:400;font-size:clamp(1.8rem,2.8vw,2.8rem);margin:80px 0 26px}

.videos{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.videos figure{display:grid;gap:12px}
.videos video{width:100%;border-radius:18px;border:1px solid var(--line);background:#000;aspect-ratio:16/9;object-fit:cover}
.videos .num{font-size:clamp(2rem,3.4vw,3.4rem);line-height:1}
.videos figcaption{color:var(--ink-2)}
.videos figcaption span{display:block;margin-top:4px;font-size:13px;color:var(--ink-3)}
.depo-track{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:start}
.depo-track figure{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:18px;padding:12px;display:grid;gap:12px}
.depo-track img{border-radius:10px;width:100%;max-height:480px;object-fit:cover;object-position:top}
.depo-track figcaption{font-size:14px;color:var(--ink-2);padding:0 6px 6px}

.quem{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(30px,6vw,90px);align-items:center}
.quem-foto img{border-radius:22px;box-shadow:0 40px 120px -40px rgba(122,92,255,.6)}
.quem-txt p{color:var(--ink-2);font-size:clamp(16px,1.2vw,19px);max-width:54ch;margin-bottom:22px}
.quem-txt .realce{color:var(--ink)}

.conta-intro{font-size:clamp(17px,1.35vw,21px);color:var(--ink-2);max-width:62ch;margin-bottom:34px}
.calc{display:grid;grid-template-columns:1fr 1fr;gap:0 48px;max-width:1100px}
.calc-row{display:grid;grid-template-columns:1fr auto;gap:8px 20px;align-items:center;padding:18px 0;border-top:1px solid var(--line);font-size:clamp(15px,1.1vw,17px);cursor:pointer}
.calc-row output{font-size:clamp(16px,1.3vw,20px);color:var(--cyan);white-space:nowrap}
.calc-row input{grid-column:1/-1;width:100%;height:24px;cursor:pointer;-webkit-appearance:none;appearance:none;background:transparent}
.calc-row input::-webkit-slider-runnable-track{height:3px;border-radius:3px;background:linear-gradient(90deg,#8fb4ff var(--p,50%),rgba(255,255,255,.15) var(--p,50%))}
.calc-row input::-moz-range-track{height:3px;border-radius:3px;background:linear-gradient(90deg,#8fb4ff var(--p,50%),rgba(255,255,255,.15) var(--p,50%))}
.calc-row input::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;margin-top:-7.5px;border-radius:50%;background:#fff;box-shadow:0 0 0 4px rgba(143,180,255,.35)}
.calc-row input::-moz-range-thumb{width:18px;height:18px;border:0;border-radius:50%;background:#fff;box-shadow:0 0 0 4px rgba(143,180,255,.35)}
.calc-total{grid-column:1/-1;border-top:1px solid var(--line);padding-top:30px;margin-top:6px;display:grid;gap:6px}
.calc-total span{color:var(--ink-2)}
.calc-total b{color:var(--ink);font-weight:500}
.calc-total strong{font-size:clamp(3.4rem,9vw,9rem);line-height:.95;background:linear-gradient(92deg,#fff,#ffc98a);-webkit-background-clip:text;background-clip:text;color:transparent}
.calc-total small{color:var(--ink-3);font-size:15px;max-width:60ch}

.faixas{display:grid;grid-template-columns:minmax(0,620px);justify-content:center;gap:24px;align-items:stretch}
.faixa{display:flex;flex-direction:column;gap:12px;padding:clamp(26px,3vw,42px);border-radius:26px;border:1px solid rgba(143,180,255,.3);background:radial-gradient(ellipse at 50% 0%,rgba(91,140,255,.2),rgba(10,10,30,.85) 65%)}
.faixa-pro{border-color:rgba(255,190,130,.45);background:radial-gradient(ellipse at 50% 0%,rgba(255,170,100,.2),rgba(14,10,24,.9) 65%);box-shadow:0 40px 140px -50px rgba(255,150,90,.55)}
.faixa-rot{font-size:12px;text-transform:uppercase;letter-spacing:.16em;color:var(--cyan)}
.faixa-pro .faixa-rot{color:var(--gold)}
.faixa h3{font-size:clamp(2rem,3vw,3rem)}
.faixa-preco{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-top:6px}
.faixa-preco span{color:var(--ink-2)}
.faixa-preco strong{font-size:clamp(2.8rem,4.6vw,4.6rem);line-height:.9}
.faixa-vista{color:var(--ink-2);margin-bottom:6px}
.faixa-lista{list-style:none;display:grid;gap:8px;margin:6px 0 8px}
.faixa-lista li{position:relative;padding-left:22px;color:var(--ink-2)}
.faixa-lista li::before{content:"✓";position:absolute;left:0;color:var(--ok)}
.faixa-lista b{color:var(--ink);font-weight:500}
.faixa-txt{color:var(--ink-2)}
.faixa-nota{font-size:13px;color:var(--ink-3)}
.faixa .btn{margin-top:auto}
.faixa-whats{font-size:14px;color:var(--gold);text-align:center}
.garantia{display:grid;grid-template-columns:auto 1fr;gap:20px;align-items:baseline;margin-top:28px;padding:22px 26px;border-radius:18px;border:1px solid rgba(125,255,193,.3);background:rgba(125,255,193,.05)}
.garantia .mono{font-size:12px;text-transform:uppercase;letter-spacing:.16em;color:var(--ok)}
.garantia p:last-child{color:var(--ink-2)}
.garantia b{color:var(--ink)}

.bonus-tag{display:block;font-size:14px;color:var(--ink-2);max-width:56ch}
.bonus-tag b{color:var(--gold);font-weight:500}
.bonus-ponto{display:inline-block;vertical-align:middle;margin:0 10px 2px 0;width:8px;height:8px;border-radius:50%;background:var(--gold);box-shadow:0 0 10px var(--gold);animation:pisca 1.6s infinite}
.bonus{margin-bottom:28px;padding:26px 30px;border-radius:22px;border:1px solid rgba(255,217,160,.5);background:linear-gradient(110deg,rgba(255,190,110,.16),rgba(14,10,24,.8) 60%);box-shadow:0 30px 100px -40px rgba(255,170,90,.6)}
.bonus-rot{font-size:12px;text-transform:uppercase;letter-spacing:.16em;color:var(--gold);margin-bottom:10px}
.bonus h3{font-size:clamp(1.8rem,3vw,3rem);line-height:1.02;margin-bottom:10px;max-width:24ch}
.bonus p:last-child{color:var(--ink-2);max-width:70ch}
.faixa-lista .li-bonus{color:var(--gold)}
.faixa-lista .li-bonus::before{content:"★";color:var(--gold)}
.faixa-lista .li-bonus b{color:var(--gold)}
.doze-nota{margin-top:14px;font-size:12px;color:var(--gold)}
/* trilha de vídeos: foto → vídeo + clone */
.v-videos{display:grid;gap:10px;padding:10px;background:rgba(8,8,22,.7);backdrop-filter:blur(12px)}
.vv-tile{position:relative;border-radius:14px;overflow:hidden;aspect-ratio:16/9;background:#000}
.vv-tile video{width:100%;height:100%;object-fit:cover}
.vv-tag{position:absolute;left:10px;bottom:10px;font-size:11px;padding:6px 10px;border-radius:999px;background:rgba(6,6,18,.75);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.14);color:var(--ink)}
.vv-tag b{color:var(--gold);font-weight:500}
.vv-tag i.rec{display:inline-block;width:7px;height:7px;border-radius:50%;background:#ff5f7a;box-shadow:0 0 8px #ff5f7a;margin-right:7px;vertical-align:middle;animation:pisca 1.2s infinite}
.vv-nota{font-size:10px;color:var(--ink-3);text-align:right;padding:0 4px}

/* dia a dia, versão compacta */
.diaadia{padding-top:40px;padding-bottom:40px}
.h-md{font-size:clamp(2.2rem,4vw,3.8rem);margin:12px 0 26px}
.dia-lista{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.dia-lista li{padding:18px 18px 20px;border-radius:16px;border:1px solid var(--line);background:rgba(10,10,28,.6);color:var(--ink-2);font-size:14.5px}
.dia-lista b{display:block;color:var(--ink);font-weight:500;margin-bottom:6px}

.janela{max-width:40ch;color:var(--ink-2);font-size:clamp(15px,1.15vw,18px)}
.janela b{color:var(--ink);font-weight:500}
.ancora{display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:wrap;margin-top:40px;padding:26px 30px;border-radius:20px;border:1px solid rgba(255,201,138,.35);background:linear-gradient(100deg,rgba(255,170,100,.1),rgba(10,10,28,.6))}
.ancora p{max-width:60ch;font-size:clamp(16px,1.25vw,19px);color:var(--ink-2)}
.ancora b{color:var(--gold);font-weight:600}
.faixa-garantia{font-size:12px;text-align:center;color:var(--ok)}
.cenarios{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:34px}
.cenario{padding:26px 28px;border-radius:20px;border:1px solid rgba(255,255,255,.1);background:rgba(16,14,22,.7)}
.cenario .mono{font-size:12px;text-transform:uppercase;letter-spacing:.16em;color:var(--warn);margin-bottom:14px}
.cenario ul{list-style:none;display:grid;gap:10px}
.cenario li{position:relative;padding-left:24px;color:var(--ink-3)}
.cenario li::before{content:"×";position:absolute;left:0;color:var(--warn)}
.cenario-sim{border-color:rgba(143,180,255,.45);background:linear-gradient(160deg,rgba(91,140,255,.16),rgba(10,10,28,.7));box-shadow:0 30px 100px -40px rgba(122,92,255,.7)}
.cenario-sim .mono{color:var(--cyan)}
.cenario-sim li{color:var(--ink)}
.cenario-sim li::before{content:"✓";color:var(--ok)}
.doze-cta{display:flex;max-width:520px;margin-bottom:16px}
.doze-nota{display:block;max-width:520px;text-align:center;line-height:1.5}

.final{display:grid;gap:50px}
.naoe h3{font-family:var(--f-display);font-weight:400;font-size:clamp(2rem,3vw,3rem);margin-bottom:16px}
.naoe ul{list-style:none;display:grid;gap:10px}
.naoe li{position:relative;padding-left:24px;color:var(--ink-2)}
.naoe li::before{content:"×";position:absolute;left:0;color:var(--warn)}
.faq{display:grid;grid-template-columns:1fr 1fr;gap:0 40px}
.faq > div{padding:20px 0;border-top:1px solid var(--line)}
.faq dt{font-weight:500;margin-bottom:6px}
.faq dd{color:var(--ink-2)}
.final-cta{max-width:520px;justify-self:center}

.rodape{display:flex;flex-wrap:wrap;gap:10px;padding:40px var(--gutter) 60px;border-top:1px solid var(--line);font-size:13px;color:var(--ink-3);max-width:1320px;margin:0 auto}
.rodape button{background:none;border:0;color:inherit;font:inherit;cursor:pointer;text-decoration:underline}
.credits{flex-basis:100%;font-size:11.5px}

/* ---------- responsivo ---------- */
@media (max-width: 1100px){
  .sistemas{grid-template-columns:1fr 1fr}
  .niveis{grid-template-columns:1fr 1fr}
}
@media (max-width: 900px){
  .top-nav a:not(.btn){display:none}
  .black-barra .aviso-extra{display:none}
  /* no celular o primeiro painel é justo: faixa mais baixa e topo mais enxuto, para o botão não encostar no selo do título */
  .black-barra{height:28px;font-size:12px}
  body:has(.black-barra) .top{top:28px;padding-top:10px;padding-bottom:10px}
  /* no celular o texto das trilhas rola por baixo do topo: depois do primeiro scroll ele ganha fundo */
  .top::before{content:"";position:absolute;inset:0;z-index:-1;background:rgba(4,3,10,.84);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);opacity:0;transition:opacity .35s}
  .top::after{content:"";position:absolute;left:0;right:0;top:100%;height:26px;z-index:-1;background:linear-gradient(180deg,rgba(4,3,10,.84),rgba(4,3,10,0));opacity:0;transition:opacity .35s}
  body.rolou .top::before,body.rolou .top::after{opacity:1}
  .stage{height:auto}
  .stage[data-stage="atomo"]{min-height:150vh}
  .stage[data-stage="bang"],.stage[data-stage="mente"],.stage[data-stage="era"]{min-height:140vh}
  .panel-trilha{position:relative;inset:auto;height:auto;display:flex;flex-direction:column;align-items:stretch;gap:30px;padding:40vh 16px 40vh}
  .panel-trilha.flip .trilha{order:0}.panel-trilha.flip .visual{order:1}
  .panel-trilha::before,.panel-trilha.flip::before{background:linear-gradient(180deg,rgba(4,3,10,0) 0%,rgba(4,3,10,.78) 18%,rgba(4,3,10,.78) 82%,rgba(4,3,10,0) 100%)}
  .visual{justify-self:stretch;width:100%;max-width:440px;margin:0 auto}
  .panel-hero::before{background:linear-gradient(0deg,rgba(4,3,10,.85),rgba(4,3,10,.3) 60%,rgba(4,3,10,0))}
  .panel-hero{justify-content:flex-end;padding-bottom:12vh}
  .panel-side,.panel-left{align-items:center;text-align:center;justify-content:flex-end;padding:0 16px 18vh}
  .panel-side::before,.panel-left::before{background:linear-gradient(0deg,rgba(4,3,10,.85) 0%,rgba(4,3,10,.4) 40%,rgba(4,3,10,0) 65%)}
  .sistemas,.niveis,.videos,.depo-track,.quem,.calc,.faixas,.faq,.versus,.cenarios,.dia-lista{grid-template-columns:1fr}
  .niveis.niveis-3{grid-template-columns:1fr}
  .panel-bang{position:relative;inset:auto;height:auto;min-height:100svh;padding:90px 16px 60px;justify-content:center}
  .stage[data-stage="bang"]{min-height:auto;padding:40vh 0 30vh}
  .vs-resposta{display:none}
  .stack li{grid-template-columns:1fr auto}
  .stack span{grid-column:1/-1;grid-row:2}
  .hud{bottom:14px}
  .hud-bar{width:100px}
  .role{display:flex}
  .hero-acoes .scroll-cue{display:none}
  body.role-visivel .hud{opacity:0}
  .garantia{grid-template-columns:1fr}
}
@media (prefers-reduced-motion: reduce){
  #grain{animation:none !important}
  .role-setas i{animation:none;opacity:1}
}
