/* =========================================================
   MEGA · SAMUEL — design system
   Samuel  → claro: branco, dourado, ciano
   Mega    → escuro: roxo escuro, preto, azul escuro
   ========================================================= */
:root{
  --gold:#d4a62a; --gold-d:#8a6504; --gold-l:#f2d37a;
  --cyan:#12cfe8; --cyan-d:#00788f;
  --pur:#9b5cff; --pur-l:#b99bff; --pur-d:#2a0b52;
  --blue:#2f5bff; --navy:#08123a; --black:#05030b;
  --f-display:'Oswald','Arial Narrow','Impact',sans-serif;
  --f-body:'Space Grotesk','Segoe UI',system-ui,sans-serif;
  --ease:cubic-bezier(.77,0,.18,1);
  --out:cubic-bezier(.16,1,.3,1);
}
.theme-light{
  --bg:#fbfdff; --ink:#0a1226; --mut:#55637d; --acc:var(--gold-d); --acc2:var(--cyan-d);
  --line:rgba(10,18,38,.16); --chip:rgba(18,207,232,.1); --chip-b:rgba(138,101,4,.45);
  --card:#fff;
}
.theme-dark{
  --bg:#06030f; --ink:#f3ecff; --mut:#a89cc8; --acc:var(--pur-l); --acc2:#6f94ff;
  --line:rgba(185,155,255,.26); --chip:rgba(155,92,255,.14); --chip-b:rgba(185,155,255,.5);
  --card:rgba(20,10,44,.6);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--f-body);background:#06030f;color:#f3ecff;line-height:1.55;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
ul{list-style:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
.wrap{width:min(1240px,100% - 2*clamp(20px,4vw,56px));margin-inline:auto}

/* ---------- NAV ---------- */
.nav{
  position:fixed;inset:0 0 auto 0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding:18px clamp(20px,4vw,56px);color:var(--nav-ink,#0a1226);
  transition:color .5s var(--ease) .35s,background .5s,padding .4s,backdrop-filter .4s;
}
.nav[data-mode="samuel"]{--nav-ink:#0a1226;--nav-acc:var(--gold-d)}
.nav[data-mode="mega"]{--nav-ink:#f3ecff;--nav-acc:var(--pur-l)}
.nav[data-mode="glass"]{--nav-ink:#f3ecff;--nav-acc:var(--gold-l);
  background:rgba(8,4,20,.72);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);
  padding-block:12px;border-bottom:1px solid rgba(185,155,255,.18)}
.brand{display:flex;align-items:center;gap:12px}
.brand-mark{font:700 1.9rem/1 var(--f-display);letter-spacing:.02em}
.brand-mark i{font-style:normal;color:var(--nav-acc,var(--gold))}
.brand-sub{font:600 .62rem/1.25 var(--f-body);letter-spacing:.14em;opacity:.85}
.nav-links{display:flex;gap:clamp(18px,3vw,40px);font:600 .78rem var(--f-body);letter-spacing:.16em;text-transform:uppercase}
.nav-links a{position:relative;padding-block:6px;opacity:.85;transition:opacity .2s}
.nav-links a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1.5px;background:var(--nav-acc);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--out)}
.nav-links a:hover{opacity:1}.nav-links a:hover::after{transform:scaleX(1)}
.switch{display:flex;border:1.5px solid currentColor;border-radius:99px;padding:3px;gap:2px}
.switch button{font:600 .7rem var(--f-body);letter-spacing:.14em;text-transform:uppercase;padding:7px 15px;border-radius:99px;transition:background .3s,color .3s}
.switch button[aria-pressed="true"]{background:var(--nav-ink);color:var(--nav-bg-inv,#fff)}
.nav[data-mode="samuel"]{--nav-bg-inv:#fff}
.nav[data-mode="mega"],.nav[data-mode="glass"]{--nav-bg-inv:#14072c}

/* ---------- HERO ---------- */
.hero{position:relative;display:grid;min-height:100svh;overflow:hidden;isolation:isolate;--rx:0deg;--ry:0deg;--mx:0;--my:0}
.scene{
  grid-area:1/1;position:relative;display:grid;place-items:center;
  padding:clamp(96px,13vh,150px) clamp(20px,4vw,64px) clamp(84px,12vh,120px);
  color:var(--ink);overflow:hidden;
  clip-path:circle(0% at var(--ox,50%) var(--oy,58%));transition:clip-path .9s var(--ease);
  pointer-events:none;z-index:0;
}
.scene.is-leaving{clip-path:circle(170% at var(--ox,50%) var(--oy,58%));z-index:1}
.scene.is-active{clip-path:circle(170% at var(--ox,50%) var(--oy,58%));z-index:2;pointer-events:auto}
.scene-samuel{
  --ink:#0a1226;--mut:#55637d;--acc:var(--gold-d);--acc2:var(--cyan-d);--line:rgba(10,18,38,.16);--topo:rgba(138,101,4,.2);
  background:
    radial-gradient(60% 55% at 78% 22%,rgba(18,207,232,.16),transparent 70%),
    radial-gradient(55% 50% at 12% 88%,rgba(212,166,42,.2),transparent 70%),
    linear-gradient(135deg,#ffffff 0%,#f4fbfd 55%,#fff9e8 100%);
}
.scene-mega{
  --ink:#f3ecff;--mut:#a89cc8;--acc:var(--pur-l);--acc2:#6f94ff;--line:rgba(185,155,255,.28);--topo:rgba(155,92,255,.3);
  background:
    radial-gradient(55% 55% at 80% 20%,rgba(120,60,230,.38),transparent 70%),
    radial-gradient(60% 60% at 8% 90%,rgba(30,60,200,.34),transparent 72%),
    linear-gradient(160deg,#0b0420 0%,#06030f 55%,#070d2a 100%);
}
.topo{position:absolute;inset:0;width:100%;height:100%;color:var(--topo);z-index:0;pointer-events:none}
/* linhas topográficas que acendem junto ao cursor (como na referência) */
.topo-hot{--topo:var(--topo-hot);stroke-width:1.8;-webkit-mask-image:radial-gradient(260px 260px at var(--px,-400px) var(--py,-400px),#000 0%,transparent 100%);
  mask-image:radial-gradient(260px 260px at var(--px,-400px) var(--py,-400px),#000 0%,transparent 100%)}
.scene-samuel{--topo-hot:rgba(0,150,180,.85)}
.scene-mega{--topo-hot:rgba(185,140,255,.95)}
.scene::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(340px 340px at var(--px,-400px) var(--py,-400px),var(--glow),transparent 70%)}
.scene-samuel{--glow:rgba(18,207,232,.16)}
.scene-mega{--glow:rgba(140,80,255,.28)}
.scene-mega::after{ /* grão + linhas de scan muito subtis */
  content:"";position:absolute;inset:0;pointer-events:none;z-index:0;opacity:.35;
  background:repeating-linear-gradient(0deg,rgba(255,255,255,.025) 0 1px,transparent 1px 4px);
}
.scene-inner{
  position:relative;z-index:1;width:100%;max-width:1480px;
  display:grid;grid-template-columns:minmax(0,1.12fr) minmax(300px,.82fr) minmax(0,.9fr);
  gap:clamp(16px,3vw,52px);align-items:center;
}

/* left */
.kicker{display:flex;align-items:center;gap:10px;font:600 .8rem var(--f-body);letter-spacing:.22em;color:var(--mut)}
.kicker .dot{width:9px;height:9px;border-radius:50%;background:var(--acc2);box-shadow:0 0 0 4px color-mix(in srgb,var(--acc2) 22%,transparent)}
.name{
  font:700 clamp(4.4rem,10.4vw,10.5rem)/.86 var(--f-display);letter-spacing:-.005em;margin:.12em 0 .1em;
  text-transform:uppercase;
}
.scene-samuel .name{background:linear-gradient(100deg,#0a1226 30%,#8a6504 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.scene-mega .name{background:linear-gradient(100deg,#fff 20%,#b99bff 70%,#6f94ff 100%);-webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 0 28px rgba(140,80,255,.45))}
.role{font:500 clamp(1.05rem,1.7vw,1.45rem) var(--f-body);letter-spacing:.04em;color:var(--ink)}
.role b{color:var(--acc);font-weight:700}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0 18px}
.chips li{font:600 .72rem var(--f-body);letter-spacing:.14em;text-transform:uppercase;padding:7px 13px;border:1px solid var(--chip-b);
  background:var(--chip);border-radius:99px;color:var(--ink)}
.scene-samuel{--chip-b:rgba(138,101,4,.5);--chip:rgba(18,207,232,.1)}
.scene-mega{--chip-b:rgba(185,155,255,.5);--chip:rgba(155,92,255,.14)}
.lede{max-width:46ch;color:var(--mut);font-size:1.02rem}
.lede strong{color:var(--ink);font-weight:600}
.cta{
  display:inline-flex;align-items:center;gap:14px;margin-top:26px;padding:15px 26px;border-radius:4px;
  font:600 .88rem var(--f-body);letter-spacing:.16em;text-transform:uppercase;
  position:relative;overflow:hidden;transition:transform .3s var(--out),box-shadow .3s;
}
.cta svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s var(--out)}
.cta:hover{transform:translateY(-3px)}.cta:hover svg{transform:translateX(5px)}
.scene-samuel .cta{background:#0a1226;color:var(--gold-l);box-shadow:0 12px 30px -12px rgba(10,18,38,.6),inset 0 0 0 1px rgba(242,211,122,.5)}
.scene-mega .cta{background:linear-gradient(100deg,#6c2bd9,#2f5bff);color:#fff;box-shadow:0 12px 40px -10px rgba(110,60,255,.8)}

/* stage / portrait */
.stage{position:relative;width:100%;max-width:470px;margin-inline:auto;aspect-ratio:4/5.15;display:grid;place-items:center}
.frame{
  position:relative;z-index:2;width:100%;height:100%;overflow:hidden;border-radius:999px 999px 26px 26px;
  transform:perspective(1100px) rotateY(var(--ry)) rotateX(var(--rx));transition:transform .25s ease-out;
  background:#111;
}
.frame img{width:100%;height:100%;object-fit:cover;object-position:50% 20%;transform:scale(1.04) translate(calc(var(--mx)*-8px),calc(var(--my)*-6px));transition:transform .3s ease-out}
.frame canvas.fx{position:absolute;inset:0;width:100%;height:100%;display:none;transform:scale(1.04) translate(calc(var(--mx)*-8px),calc(var(--my)*-6px));transition:transform .3s ease-out}
.frame.gl canvas.fx{display:block}
.frame.gl img{visibility:hidden}
.scene-samuel .frame{box-shadow:0 40px 80px -30px rgba(10,18,38,.5),0 0 0 6px #fff,0 0 0 7.5px rgba(138,101,4,.7)}
.scene-samuel .frame img{filter:saturate(1.05) contrast(1.03)}
.scene-samuel .frame::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 60%,rgba(255,249,232,.6));}
.scene-mega .frame{box-shadow:0 40px 90px -20px rgba(110,60,255,.65),0 0 0 6px #0b0420,0 0 0 7.5px rgba(185,155,255,.85)}
.scene-mega .frame img{filter:saturate(1.15) contrast(1.05)}
.scene-mega .frame::after{content:"";position:absolute;inset:0;background:
  linear-gradient(180deg,rgba(40,10,90,.15) 0%,transparent 40%,rgba(5,3,11,.55) 100%)}
.ring{position:absolute;border-radius:999px 999px 36px 36px;pointer-events:none;z-index:1}
.ring-a{inset:-22px;border:1.5px solid var(--acc2);opacity:.75;transform:translate(calc(var(--mx)*12px),calc(var(--my)*10px));transition:transform .35s ease-out}
.ring-b{inset:-40px;border:1px dashed var(--line);transform:translate(calc(var(--mx)*-10px),calc(var(--my)*-8px));transition:transform .45s ease-out}
.ghost{
  position:absolute;z-index:0;left:50%;top:50%;transform:translate(calc(-50% + var(--mx)*-26px),calc(-50% + var(--my)*-18px));
  font:700 clamp(9rem,26vw,24rem)/.8 var(--f-display);color:transparent;-webkit-text-stroke:1.5px var(--line);white-space:nowrap;
  transition:transform .4s ease-out;user-select:none;
}
.tag{position:absolute;z-index:3;right:-6px;bottom:12%;font:700 .72rem var(--f-body);letter-spacing:.28em;padding:9px 14px;writing-mode:vertical-rl;transform:rotate(180deg)}
.scene-samuel .tag{background:var(--cyan);color:#05252c}
.scene-mega .tag{background:var(--pur);color:#fff}

/* panels (cantos tipo mira) */
.panels{display:grid;gap:clamp(18px,3vh,34px);justify-self:end;width:min(100%,360px)}
.panel{position:relative;padding:26px 30px;
  --b:var(--ink);
  background:
    linear-gradient(var(--b),var(--b)) top left/16px 1.5px no-repeat,
    linear-gradient(var(--b),var(--b)) top left/1.5px 16px no-repeat,
    linear-gradient(var(--b),var(--b)) top right/16px 1.5px no-repeat,
    linear-gradient(var(--b),var(--b)) top right/1.5px 16px no-repeat,
    linear-gradient(var(--b),var(--b)) bottom left/16px 1.5px no-repeat,
    linear-gradient(var(--b),var(--b)) bottom left/1.5px 16px no-repeat,
    linear-gradient(var(--b),var(--b)) bottom right/16px 1.5px no-repeat,
    linear-gradient(var(--b),var(--b)) bottom right/1.5px 16px no-repeat;
}
.plabel{font:600 .74rem var(--f-body);letter-spacing:.2em;color:var(--acc);text-transform:uppercase}
.pbig{font:700 2.1rem/1.1 var(--f-display);letter-spacing:.02em;margin-top:8px}
.psmall{font-size:.9rem;color:var(--mut);margin-top:2px;max-width:24ch}
.picon{position:absolute;right:22px;top:50%;width:54px;height:54px;transform:translateY(-50%);fill:none;stroke:var(--acc2);stroke-width:2}
.panel:first-child{padding-right:90px}
.trio{display:flex;gap:clamp(14px,2vw,26px);margin-top:12px}
.trio div{display:grid}
.trio span{font:500 .66rem var(--f-body);letter-spacing:.16em;color:var(--mut);white-space:nowrap}
.trio b{font:700 clamp(2.1rem,3.4vw,3.2rem)/1 var(--f-display);color:var(--ink)}

/* hero ui */
.hero-ui{position:absolute;z-index:6;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:0 clamp(20px,4vw,64px) 26px;color:var(--ui,#0a1226);transition:color .5s var(--ease) .35s;pointer-events:none;font:600 .7rem var(--f-body);letter-spacing:.2em}
.hero[data-active="samuel"]{--ui:#0a1226;--uiacc:var(--gold-d)}
.hero[data-active="mega"]{--ui:#f3ecff;--uiacc:var(--pur-l)}
.hint{display:flex;align-items:center;gap:10px;text-transform:uppercase;opacity:.8}
.hint i{width:26px;height:26px;border-radius:50%;border:1.5px solid currentColor;position:relative}
.hint i::after{content:"";position:absolute;inset:7px;border-radius:50%;background:var(--uiacc);animation:pulse 1.6s infinite}
@keyframes pulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(.4);opacity:.5}}
.cycle{display:flex;align-items:center;gap:14px}
.cycle-n{opacity:.4;transition:opacity .4s,color .4s}
.hero[data-active="samuel"] .cycle-n[data-n="samuel"],.hero[data-active="mega"] .cycle-n[data-n="mega"]{opacity:1;color:var(--uiacc)}
.bar{display:block;width:clamp(70px,10vw,140px);height:2px;background:color-mix(in srgb,var(--ui) 20%,transparent);overflow:hidden}
.bar i{display:block;height:100%;width:100%;background:var(--uiacc);transform:scaleX(0);transform-origin:left}
.bar i.run{animation:fill 8s linear forwards}
@keyframes fill{to{transform:scaleX(1)}}
.scroll{display:flex;align-items:center;gap:10px;opacity:.8}
.scroll i{display:block;width:1.5px;height:30px;background:currentColor;transform-origin:top;animation:drip 1.8s var(--out) infinite}
@keyframes drip{0%{transform:scaleY(0)}60%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}

/* entrada escalonada dentro da cena ativa */
.rv{opacity:0;transform:translateY(24px);transition:opacity .7s var(--out),transform .8s var(--out)}
.scene.is-active .rv{opacity:1;transform:none;transition-delay:calc(var(--d,0s) + .35s)}
.scene.is-leaving .rv{opacity:1;transform:none}

/* ---------- TICKER ---------- */
.ticker{overflow:hidden;background:linear-gradient(90deg,#14072c,#08123a 50%,#14072c);border-block:1px solid rgba(185,155,255,.22);padding:15px 0;position:relative;z-index:3}
.ticker-track{display:flex;width:max-content;gap:30px;animation:marquee 32s linear infinite;font:600 1.2rem var(--f-display);letter-spacing:.12em;color:#f3ecff}
.ticker-track em{font-style:normal;color:var(--gold)}
.ticker-track em:nth-of-type(even){color:var(--cyan)}
@keyframes marquee{to{transform:translateX(-50%)}}

/* ---------- SECÇÕES ---------- */
.sec{position:relative;padding:clamp(80px,12vw,170px) 0}
.sec-dark{
  background:
    radial-gradient(50% 40% at 85% 8%,rgba(120,60,230,.3),transparent 70%),
    radial-gradient(50% 40% at 5% 60%,rgba(30,60,200,.26),transparent 70%),
    linear-gradient(180deg,#07030f,#0a0522 60%,#06030f);
  color:var(--ink);
}
.eyebrow{font:600 .78rem var(--f-body);letter-spacing:.26em;color:var(--acc);text-transform:uppercase}
.sec-head h2,.story-head h2{font:700 clamp(2.8rem,7.4vw,6.4rem)/.94 var(--f-display);text-transform:uppercase;margin:.25em 0 .3em;letter-spacing:.005em}
.sec-head h2 span{background:linear-gradient(100deg,#b99bff,#5c8bff);-webkit-background-clip:text;background-clip:text;color:transparent}
.sec-lede{max-width:56ch;color:var(--mut);font-size:1.08rem}

/* reveal */
.reveal{opacity:0;transform:translateY(40px);transition:opacity .9s var(--out),transform 1s var(--out);transition-delay:calc(var(--i,0)*.1s)}
.reveal.in{opacity:1;transform:none}

/* cards */
.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:clamp(40px,6vw,80px)}
.card{
  position:relative;padding:30px 26px 30px;background:var(--card);border:1px solid var(--line);border-radius:6px;
  display:flex;flex-direction:column;gap:12px;min-height:280px;overflow:hidden;
  transition:transform .5s var(--out),border-color .3s,box-shadow .5s;
}
.card::before{content:"";position:absolute;inset:-1px;background:radial-gradient(260px 200px at var(--cx,80%) var(--cy,0%),rgba(140,90,255,.35),transparent 70%);opacity:0;transition:opacity .4s}
.card:hover{transform:translateY(-8px);border-color:var(--pur);box-shadow:0 30px 60px -30px rgba(120,70,255,.8)}
.card:hover::before{opacity:1}
.card>*{position:relative}
.card-big{font:700 clamp(3.4rem,5vw,5rem)/.95 var(--f-display);display:flex;align-items:baseline;gap:8px;margin-top:auto;
  background:linear-gradient(100deg,#fff,#b99bff 70%,#6f94ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.card-big small{font:600 1rem var(--f-body);letter-spacing:.24em;-webkit-text-fill-color:var(--acc)}
.card-big.word{font-size:clamp(2.2rem,3.3vw,3.4rem);letter-spacing:.01em;word-break:break-word}
.card-txt{color:var(--mut);font-size:.97rem}

/* bandeiras */
.flags{margin-top:clamp(70px,10vw,140px)}
.flags ul{margin-top:24px;border-top:1px solid var(--line)}
.flags li{position:relative;display:flex;align-items:center;gap:clamp(16px,3vw,40px);padding:clamp(14px,2vw,26px) 4px;border-bottom:1px solid var(--line);overflow:hidden;cursor:default}
.flags li span{font:600 .9rem var(--f-body);letter-spacing:.2em;color:var(--acc);min-width:2.4em}
.flags li b{font:700 clamp(2.4rem,8vw,6.6rem)/1 var(--f-display);color:transparent;-webkit-text-stroke:1.4px rgba(243,236,255,.55);letter-spacing:.01em;
  transition:color .4s,-webkit-text-stroke-color .4s,transform .5s var(--out)}
.flags li i{margin-left:auto;width:clamp(36px,5vw,64px);height:2px;background:var(--acc);transition:width .5s var(--out)}
.flags li:hover b{color:#fff;-webkit-text-stroke-color:transparent;transform:translateX(18px);text-shadow:0 0 40px rgba(140,90,255,.7)}
.flags li:hover i{width:clamp(80px,14vw,200px)}

/* ---------- HISTÓRIA ---------- */
.story{position:relative}
.story-head{color:var(--ink);padding:clamp(90px,12vw,160px) 0 clamp(70px,9vw,120px);
  background:radial-gradient(50% 60% at 85% 20%,rgba(18,207,232,.14),transparent 70%),radial-gradient(40% 50% at 8% 80%,rgba(212,166,42,.16),transparent 70%),linear-gradient(180deg,#fbfdff,#f1fafc);}
.story-head .g{color:var(--gold-d)}.story-head .c{color:var(--cyan-d)}
.timeline{position:relative}
.tl-line{position:absolute;z-index:5;left:50%;top:0;bottom:0;width:2px;margin-left:-1px;background:rgba(138,101,4,.25);pointer-events:none}
.tl-line i{position:absolute;left:0;top:0;width:100%;height:calc(var(--p,0)*100%);background:linear-gradient(180deg,var(--cyan),var(--gold) 55%,var(--pur));box-shadow:0 0 14px rgba(18,207,232,.7)}
.tl-line i::after{content:"";position:absolute;left:50%;bottom:-7px;width:14px;height:14px;margin-left:-7px;border-radius:50%;background:#fff;box-shadow:0 0 0 3px var(--gold),0 0 22px var(--cyan)}
.ch{position:relative;padding:clamp(70px,10vw,150px) 0;background:var(--bg);color:var(--ink)}
.ch.alt{background:linear-gradient(180deg,#f3fbfd,#fff8e6)}
.theme-dark.ch{background:
  radial-gradient(45% 50% at 90% 15%,rgba(110,60,230,.28),transparent 70%),
  radial-gradient(45% 50% at 5% 85%,rgba(30,60,200,.24),transparent 70%),
  linear-gradient(180deg,#07030f,#0a0522)}
.ch.cut{margin-top:-5vw;padding-top:calc(clamp(70px,10vw,150px) + 5vw);clip-path:polygon(0 5vw,100% 0,100% 100%,0 100%)}
.ch-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,8vw,140px);align-items:center}
.ch-grid.flip .ch-text{order:2}
.ch-text{position:relative}
.ch-num{position:absolute;top:-.55em;left:-.05em;font:700 clamp(7rem,16vw,15rem)/1 var(--f-display);color:transparent;-webkit-text-stroke:1.4px var(--line);z-index:0;user-select:none}
.ch-text>*:not(.ch-num){position:relative;z-index:1}
.ch-text h3{font:700 clamp(2.4rem,5vw,4.4rem)/1 var(--f-display);text-transform:uppercase;margin:.3em 0 .45em}
.ch-text h3 .pl{background:linear-gradient(100deg,#b99bff,#5c8bff);-webkit-background-clip:text;background-clip:text;color:transparent}
.ch-text p:not(.eyebrow){color:var(--mut);font-size:1.08rem;max-width:48ch}
.ch-text strong{color:var(--ink);font-weight:600}
.ch-text{padding-top:clamp(40px,6vw,90px)}
.ch-vis{display:grid;place-items:center}
.vis-frame{width:min(100%,420px);aspect-ratio:4/5;border-radius:999px 999px 26px 26px;overflow:hidden;position:relative}
.vis-frame img{width:100%;height:100%;object-fit:cover;object-position:50% 20%}
.vf-samuel{box-shadow:0 40px 80px -30px rgba(10,18,38,.5),0 0 0 6px #fff,0 0 0 7.5px rgba(138,101,4,.7),0 0 0 22px rgba(18,207,232,.12)}
.vf-mega{box-shadow:0 40px 90px -20px rgba(110,60,255,.7),0 0 0 6px #0b0420,0 0 0 7.5px rgba(185,155,255,.85),0 0 0 22px rgba(120,70,255,.15)}
.quote-card{position:relative;padding:clamp(34px,5vw,64px);border-radius:8px;background:#fff;font:600 clamp(1.7rem,3.2vw,2.8rem)/1.15 var(--f-display);text-transform:uppercase;color:var(--ink);
  box-shadow:0 30px 70px -30px rgba(10,18,38,.35),inset 0 0 0 1px rgba(138,101,4,.35);border-left:6px solid var(--gold)}
.quote-card .qm{position:absolute;top:-.1em;right:.3em;font:700 9rem/1 var(--f-display);color:var(--cyan);opacity:.35}
.quote-card cite{display:block;margin-top:18px;font:600 .8rem var(--f-body);letter-spacing:.24em;font-style:normal;color:var(--gold-d)}
.big-nums{display:grid;gap:26px;width:100%}
.big-nums div{position:relative;padding:20px 28px;border-left:2px solid var(--pur);background:linear-gradient(90deg,rgba(120,70,255,.16),transparent);display:grid}
.big-nums small{font:600 .85rem var(--f-body);letter-spacing:.3em;color:var(--acc)}
.big-nums b{font:700 clamp(4.4rem,9vw,8rem)/.95 var(--f-display);background:linear-gradient(100deg,#fff,#b99bff);-webkit-background-clip:text;background-clip:text;color:transparent}
.big-nums span{font:600 .75rem var(--f-body);letter-spacing:.2em;color:var(--mut)}
.name-stack{display:grid;gap:4px;width:100%}
.name-stack li{font:700 clamp(2.4rem,6vw,5.4rem)/1.02 var(--f-display);color:transparent;-webkit-text-stroke:1.4px rgba(243,236,255,.6);transition:all .45s var(--out);cursor:default}
.name-stack li:nth-child(odd){padding-left:1.2em}
.name-stack li:hover{color:#fff;-webkit-text-stroke-color:transparent;text-shadow:0 0 40px rgba(140,90,255,.8);padding-left:1.6em}
.vis-split{position:relative;width:min(100%,500px);aspect-ratio:1/1.12;border-radius:999px 999px 26px 26px;overflow:hidden;box-shadow:0 0 0 6px #0b0420,0 0 0 7.5px var(--gold),0 40px 90px -20px rgba(110,60,255,.6),0 0 0 22px rgba(18,207,232,.1)}
/* cada pessoa centrada na sua metade (rosto/personagem ao centro) */
.vis-split img{position:absolute;top:0;height:100%;width:62%;object-fit:cover}
.vs-a{left:0;object-position:46% 12%;clip-path:polygon(0 0,83.9% 0,64.5% 100%,0 100%)}
.vs-b{right:0;object-position:50% 10%;clip-path:polygon(22.6% 0,100% 0,100% 100%,3.2% 100%)}
.vs-line{position:absolute;inset:0;z-index:2;background:linear-gradient(var(--gold),var(--cyan));
  clip-path:polygon(51% 0,52.4% 0,40.4% 100%,39% 100%)}

/* ---------- DUO ---------- */
.duo{background:linear-gradient(180deg,#06030f,#0a0522);color:#f3ecff}
.duo .eyebrow{color:var(--pur-l)}
.duo-grid{display:flex;gap:18px;height:clamp(460px,62vw,640px);margin-top:clamp(40px,6vw,70px)}
.duo-card{position:relative;flex:1;overflow:hidden;border-radius:10px;display:flex;align-items:flex-end;transition:flex .8s var(--ease);cursor:pointer;outline-offset:4px}
.duo-card:hover,.duo-card:focus-visible{flex:2.2}
.duo-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 18%;transition:transform 1.2s var(--out),filter .6s}
.duo-card:hover img{transform:scale(1.07)}
.duo-card::after{content:"";position:absolute;inset:0}
.d-samuel{box-shadow:inset 0 0 0 1.5px rgba(212,166,42,.85)}
.d-samuel::after{background:linear-gradient(180deg,rgba(255,255,255,0) 20%,rgba(255,255,255,.92) 92%)}
.d-mega{box-shadow:inset 0 0 0 1.5px rgba(185,155,255,.7)}
.d-mega::after{background:linear-gradient(180deg,rgba(10,4,32,0) 20%,rgba(7,3,18,.95) 92%)}
.duo-body{position:relative;z-index:2;padding:clamp(22px,3vw,40px);color:var(--ink);width:100%}
.d-samuel .eyebrow{color:var(--gold-d)}
.duo-body h3{font:700 clamp(3rem,7vw,6rem)/.9 var(--f-display);margin:.1em 0 .3em}
.duo-body ul{display:grid;gap:5px;font-size:.98rem;color:var(--mut);max-height:0;opacity:0;overflow:hidden;transition:max-height .8s var(--ease),opacity .6s}
.duo-card:hover ul,.duo-card:focus-visible ul{max-height:160px;opacity:1}
.duo-body li::before{content:"✦ ";color:var(--acc2)}
.d-samuel .duo-body ul{color:#3b4968}

/* ---------- FOOTER ---------- */
.foot{padding:clamp(80px,12vw,160px) 0 36px;background:radial-gradient(60% 80% at 50% 0%,rgba(110,60,230,.28),transparent 70%),#06030f;color:var(--ink);text-align:center}
.foot-q{font:700 clamp(2.4rem,7vw,6.2rem)/1 var(--f-display);text-transform:uppercase;max-width:15ch;margin:0 auto}
.foot-q span{background:linear-gradient(100deg,var(--gold-l),var(--cyan));-webkit-background-clip:text;background-clip:text;color:transparent}
.foot-row{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:clamp(70px,10vw,130px);padding-top:26px;border-top:1px solid var(--line);font:600 .7rem var(--f-body);letter-spacing:.2em;color:var(--mut)}
.foot-row .brand-mark{color:var(--ink);font-size:1.6rem}
.foot-row .brand-mark i{color:var(--gold)}
.foot-row a:hover{color:var(--ink)}

/* ---------- RESPONSIVO ---------- */
@media (max-width:1100px){
  .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .scene-inner{grid-template-columns:minmax(0,1fr) minmax(260px,.8fr)}
  .panels{grid-column:1/-1;grid-template-columns:1fr 1fr;justify-self:stretch;width:100%}
  .panel:first-child{padding-right:90px}
}
@media (max-width:860px){
  .nav-links,.brand-sub{display:none}
  .scene{padding-top:92px;padding-bottom:110px}
  .scene-inner{grid-template-columns:1fr;gap:18px;text-align:center}
  .left{display:contents}
  .kicker{order:1;justify-content:center}
  .name{order:2;margin:0;font-size:clamp(4.6rem,24vw,8rem)}
  .role{order:3}
  .stage{order:4;max-width:min(76vw,340px);margin-block:26px 20px}
  .chips{order:5;justify-content:center;margin:0}
  .lede{order:6;margin-inline:auto}
  .cta{order:7;justify-self:center;margin-top:6px}
  .panels{order:8;grid-template-columns:1fr;margin-top:18px;text-align:left}
  .ring-b{display:none}
  .tag{right:-4px}
  .hero-ui{padding-bottom:18px}
  .scroll{display:none}
  .tl-line{left:20px}
  .ch-grid,.ch-grid.flip{grid-template-columns:1fr;gap:50px}
  .ch-grid.flip .ch-text{order:0}
  .ch .wrap{padding-left:34px}
  .ch-text{padding-top:60px}
  .duo-grid{flex-direction:column;height:auto}
  .duo-card{min-height:380px;flex:none}
  .duo-card:hover{flex:none}
  .duo-body ul{max-height:160px;opacity:1}
}
@media (max-width:560px){
  .cards{grid-template-columns:1fr}
  .card{min-height:220px}
  .switch button{padding:6px 11px}
  .hint{display:none}
  .hero-ui{justify-content:center}
  .hero-ui .cycle-n{font-size:.6rem}
  .bar{width:50px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .scene{clip-path:none;opacity:0;transition:opacity .6s}
  .scene.is-active,.scene.is-leaving{opacity:1;clip-path:none}
  .ticker-track{animation-duration:90s}
  .reveal,.rv{transition-duration:.01s}
}