/* ════════════════════════════════════════════════════════════════
   ANDRE · NEON DISCO  — 2026 redesign
   Paleta zaczerpnięta z fotografii: głęboki granat/fiolet,
   elektryczny błękit, gorąca magenta, lustrzany cyan.
   ════════════════════════════════════════════════════════════════ */

:root {
  /* — tła — */
  --bg:        #06010f;
  --bg2:       #0b0420;
  --bg3:       #130833;
  --panel:     rgba(255,255,255,0.04);
  --panel-bd:  rgba(255,255,255,0.10);

  /* — tekst — */
  --ink:       #f4eefe;
  --ink-dim:   #b6a8d6;
  --ink-mute:  #7c6fa0;

  /* — neon — */
  --blue:      #3d6bff;
  --blue-2:    #5b8cff;
  --magenta:   #ff1fae;
  --magenta-2: #ff63c9;
  --cyan:      #4fe6ff;
  --violet:    #8a3dff;
  --gold:      #ffcf5c;

  /* — glow rgba — */
  --blue-glow:    rgba(61,107,255,0.55);
  --magenta-glow: rgba(255,31,174,0.55);
  --cyan-glow:    rgba(79,230,255,0.45);

  --grad-neon: linear-gradient(110deg,#ff1fae 0%,#a13dff 38%,#3d6bff 70%,#4fe6ff 100%);
  --grad-hot:  linear-gradient(100deg,#ff1fae,#ff63c9 60%,#ffae00);

  --sh:   1340px;
  --gap:  clamp(20px,4vw,60px);
  --hdr:  76px;

  --ease: cubic-bezier(.22,1,.36,1);
}

/* ── Reset ─────────────────────────────────────────────── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; font-size:16px; -webkit-text-size-adjust:100%; }
body {
  background:var(--bg);
  color:var(--ink);
  font-family:"Manrope",system-ui,sans-serif;
  font-weight:400;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  cursor:none;
}
body.is-loading { overflow:hidden; }
img,video { display:block; width:100%; height:100%; object-fit:cover; }
a { color:inherit; text-decoration:none; }
button { background:none; border:none; cursor:none; color:inherit; font:inherit; }
em { font-style:normal; background:var(--grad-neon); -webkit-background-clip:text;
     background-clip:text; color:transparent; }
::selection { background:var(--magenta); color:#fff; }

.shell { width:min(calc(100% - var(--gap)*2),var(--sh)); margin-inline:auto; }

/* fonts */
.display { font-family:"Anton",sans-serif; font-weight:400; letter-spacing:.01em;
           text-transform:uppercase; line-height:.9; }
.syne { font-family:"Syne",sans-serif; }

/* ── Eyebrow ──────────────────────────────────────────── */
.eyebrow {
  font-family:"Syne",sans-serif;
  font-weight:700;
  font-size:.78rem;
  letter-spacing:.34em;
  text-transform:uppercase;
  display:inline-flex; align-items:center; gap:.7em;
  color:var(--cyan);
  margin-bottom:18px;
}
.eyebrow::before {
  content:""; width:30px; height:1px;
  background:linear-gradient(90deg,transparent,var(--cyan));
}
.eyebrow-pink { color:var(--magenta-2); }
.eyebrow-pink::before { background:linear-gradient(90deg,transparent,var(--magenta-2)); }

/* ════════════════════════════════════════════════════════
   ATMOSPHERE — gradient mesh + mirror-ball orbs + grain
   ════════════════════════════════════════════════════════ */
.atmos { position:fixed; inset:0; z-index:-2; overflow:hidden; background:var(--bg); }
.atmos::before {
  content:""; position:absolute; inset:-20%;
  background:
    radial-gradient(40% 50% at 18% 22%, rgba(138,61,255,.40), transparent 60%),
    radial-gradient(45% 55% at 82% 30%, rgba(255,31,174,.32), transparent 62%),
    radial-gradient(50% 60% at 50% 92%, rgba(61,107,255,.40), transparent 60%),
    radial-gradient(40% 50% at 92% 80%, rgba(79,230,255,.18), transparent 60%);
  filter:blur(10px);
  animation:mesh 22s ease-in-out infinite alternate;
}
@keyframes mesh {
  0%   { transform:translate3d(0,0,0) scale(1); }
  50%  { transform:translate3d(-3%,2%,0) scale(1.08); }
  100% { transform:translate3d(2%,-2%,0) scale(1.04); }
}
.orb {
  position:fixed; border-radius:50%; z-index:-1; pointer-events:none;
  background-image:
    radial-gradient(circle at 30% 30%, rgba(255,255,255,.9), transparent 18%),
    conic-gradient(from 0deg, #4fe6ff,#3d6bff,#8a3dff,#ff1fae,#4fe6ff);
  background-size:auto, 14px 14px;
  background-blend-mode:screen;
  opacity:.16; filter:blur(2px) saturate(1.4);
  mix-blend-mode:screen;
  box-shadow:0 0 80px var(--blue-glow);
  animation:floatOrb 18s ease-in-out infinite;
}
.orb-1 { width:340px; height:340px; top:6%;  left:-90px;  animation-delay:-2s; }
.orb-2 { width:240px; height:240px; top:64%; right:-70px; animation-delay:-7s;
         box-shadow:0 0 80px var(--magenta-glow); }
.orb-3 { width:160px; height:160px; top:34%; right:14%;   animation-delay:-12s;
         box-shadow:0 0 60px var(--cyan-glow); opacity:.12; }
@keyframes floatOrb {
  0%,100% { transform:translateY(0) rotate(0deg); }
  50%     { transform:translateY(-40px) rotate(180deg); }
}
.grain {
  position:fixed; inset:-50%; width:200%; height:200%; z-index:9990;
  pointer-events:none; opacity:.05; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:200px 200px; animation:grain 8s steps(8) 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%,-2%)} 100%{transform:translate(0,0)}
}

/* ── Scroll progress ──────────────────────────────────── */
.scroll-bar {
  position:fixed; top:0; left:0; height:2px; width:0%;
  background:var(--grad-neon); z-index:9999;
  box-shadow:0 0 14px var(--magenta-glow); transition:width 80ms linear;
}

/* ════════════════════════════════════════════════════════
   PRELOADER
   ════════════════════════════════════════════════════════ */
.preloader {
  position:fixed; inset:0; z-index:9998; background:var(--bg);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:30px; transition:opacity .7s ease .2s, visibility .7s ease .2s;
}
.preloader.is-done { opacity:0; visibility:hidden; pointer-events:none; }
.pl-letters { display:flex; gap:clamp(6px,2vw,20px); }
.pl-letters span {
  font-family:"Anton",sans-serif; font-size:clamp(48px,12vw,140px);
  line-height:1; color:transparent;
  background:var(--grad-neon); background-size:200% 100%;
  -webkit-background-clip:text; background-clip:text;
  opacity:0; transform:translateY(60px) rotate(8deg);
  animation:plIn .7s var(--ease) forwards, plShine 3s linear infinite;
}
.pl-letters span:nth-child(1){animation-delay:.05s,.7s}
.pl-letters span:nth-child(2){animation-delay:.15s,.7s}
.pl-letters span:nth-child(3){animation-delay:.25s,.7s}
.pl-letters span:nth-child(4){animation-delay:.35s,.7s}
.pl-letters span:nth-child(5){animation-delay:.45s,.7s}
@keyframes plIn { to{opacity:1; transform:translateY(0) rotate(0)} }
@keyframes plShine { to{background-position:200% 0} }
.pl-line { width:0; height:2px; background:var(--grad-neon); box-shadow:0 0 14px var(--magenta-glow);
           animation:plLine 1.8s ease .6s forwards; }
@keyframes plLine { to{width:min(280px,60vw)} }

/* ── Custom cursor ───────────────────────────────────── */
.cur-dot,.cur-ring { position:fixed; top:0; left:0; border-radius:50%;
  pointer-events:none; z-index:9997; transform:translate(-50%,-50%); }
.cur-dot  { width:7px; height:7px; background:var(--cyan); box-shadow:0 0 12px var(--cyan); }
.cur-ring { width:38px; height:38px; border:1.5px solid var(--magenta-2);
  box-shadow:0 0 18px var(--magenta-glow), inset 0 0 10px var(--magenta-glow);
  transition:width .3s var(--ease),height .3s var(--ease),opacity .3s,border-color .3s,background .3s; opacity:0; }
body.cur-hover .cur-ring { width:64px; height:64px; border-color:var(--cyan);
  background:rgba(79,230,255,.08); box-shadow:0 0 26px var(--cyan-glow); }
body.cur-click .cur-ring { width:28px; height:28px; }
@media (hover:none),(pointer:coarse) { body{cursor:auto} .cur-dot,.cur-ring{display:none} }

/* ════════════════════════════════════════════════════════
   HEADER
   ════════════════════════════════════════════════════════ */
.hdr {
  position:fixed; inset:0 0 auto 0; height:var(--hdr); z-index:900;
  display:flex; align-items:center; justify-content:space-between;
  padding-inline:clamp(18px,4vw,44px); gap:24px;
  transition:background .4s,backdrop-filter .4s,border-color .4s;
  border-bottom:1px solid transparent;
}
.hdr.is-scrolled {
  background:rgba(8,2,22,.72); backdrop-filter:blur(16px) saturate(1.4);
  border-bottom-color:var(--panel-bd);
}
.hdr-logo { display:flex; align-items:center; gap:10px; text-decoration:none; }

.hdr-logo .logo-img {
  height:44px; width:auto;
  filter: drop-shadow(0 0 6px rgba(255,255,255,0.15));
  animation: logo-reveal .8s var(--ease) both, logo-glow 3s ease-in-out 1s infinite;
  transform-origin: left center;
}

@media (hover: hover) {
  .hdr-logo:hover .logo-img {
    animation: logo-reveal .8s var(--ease) both, logo-glitch .4s steps(1) infinite;
  }
}

.hdr-logo .dot { width:7px; height:7px; border-radius:50%; background:var(--magenta);
  box-shadow:0 0 12px var(--magenta-glow); animation:pulse 2s ease-in-out infinite;
  flex-shrink:0; }

@keyframes pulse { 0%,100%{transform:scale(1);opacity:1} 50%{transform:scale(1.5);opacity:.5} }

@keyframes logo-reveal {
  0%   { opacity:0; transform:scaleX(.7) translateX(-10px); filter:drop-shadow(0 0 20px var(--cyan-glow)) brightness(2); }
  60%  { opacity:1; transform:scaleX(1.04) translateX(2px); filter:drop-shadow(0 0 12px var(--cyan-glow)) brightness(1.3); }
  100% { opacity:1; transform:scaleX(1) translateX(0); filter:drop-shadow(0 0 6px rgba(255,255,255,0.15)); }
}

@keyframes logo-glow {
  0%,100% { filter:drop-shadow(0 0 4px rgba(255,255,255,0.10)) drop-shadow(0 0 0px transparent); }
  50%     { filter:drop-shadow(0 0 10px rgba(79,230,255,0.45)) drop-shadow(0 0 20px rgba(138,61,255,0.30)); }
}

@keyframes logo-glitch {
  0%   { filter:drop-shadow(-3px 0 0 var(--magenta)) drop-shadow(3px 0 0 var(--cyan)); clip-path:inset(10% 0 80% 0); }
  25%  { filter:drop-shadow(3px 0 0 var(--cyan)) drop-shadow(-3px 0 0 var(--magenta)); clip-path:inset(60% 0 10% 0); transform:translateX(2px); }
  50%  { filter:drop-shadow(-2px 0 0 var(--violet)) drop-shadow(2px 0 0 var(--gold)); clip-path:inset(30% 0 50% 0); transform:translateX(-2px); }
  75%  { filter:drop-shadow(0 0 8px var(--magenta-glow)); clip-path:inset(0); transform:translateX(0); }
  100% { filter:drop-shadow(0 0 6px rgba(255,255,255,.15)); clip-path:inset(0); }
}

.hdr-nav { display:flex; align-items:center; gap:clamp(14px,2vw,30px); }
.hdr-nav a { font-family:"Syne",sans-serif; font-weight:600; font-size:.86rem;
  letter-spacing:.02em; color:var(--ink-dim); position:relative; padding:6px 0;
  transition:color .3s; }
.hdr-nav a::after { content:""; position:absolute; left:0; bottom:0; height:1.5px; width:0;
  background:var(--grad-neon); transition:width .35s var(--ease); }
.hdr-nav a:hover { color:var(--ink); }
.hdr-nav a:hover::after { width:100%; }

.hdr-book {
  font-family:"Syne",sans-serif; font-weight:700; font-size:.82rem; letter-spacing:.04em;
  padding:11px 22px; border-radius:100px; color:#fff;
  background:var(--grad-hot); background-size:160% 160%;
  box-shadow:0 6px 24px var(--magenta-glow); position:relative; overflow:hidden;
  transition:box-shadow .4s,transform .3s; white-space:nowrap;
}
.hdr-book:hover { box-shadow:0 8px 34px var(--magenta-glow); }

.hdr-burger { display:none; width:42px; height:42px; flex-direction:column;
  justify-content:center; align-items:center; gap:5px; }
.hdr-burger span { width:24px; height:2px; background:var(--ink); border-radius:2px;
  transition:.3s var(--ease); }
.hdr-burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.hdr-burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.hdr-burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ── Mobile nav ──────────────────────────────────────── */
.mob {
  position:fixed; inset:0; z-index:880; background:rgba(6,1,15,.97);
  backdrop-filter:blur(20px); display:flex; flex-direction:column;
  justify-content:center; padding:90px 32px 40px;
  opacity:0; visibility:hidden; transform:translateY(-12px);
  transition:opacity .4s,visibility .4s,transform .4s var(--ease);
}
.mob.is-open { opacity:1; visibility:visible; transform:translateY(0); }
.mob-nav { display:flex; flex-direction:column; gap:6px; }
.mob-nav a { font-family:"Anton",sans-serif; font-size:clamp(30px,9vw,52px);
  color:var(--ink); padding:6px 0; transition:color .3s,padding-left .3s; text-transform:uppercase; }
.mob-nav a:hover { color:var(--magenta-2); padding-left:14px; }
.mob-book { margin-top:24px !important; background:var(--grad-hot);
  -webkit-background-clip:text; background-clip:text; color:transparent; }
.mob-footer { margin-top:auto; display:flex; gap:20px; padding-top:30px; }
.mob-footer a { font-family:"Syne",sans-serif; font-weight:700; font-size:.9rem;
  letter-spacing:.1em; color:var(--cyan); }

/* ════════════════════════════════════════════════════════
   HERO
   ════════════════════════════════════════════════════════ */
.hero { position:relative; min-height:100svh; display:flex; align-items:center;
  padding-top:var(--hdr); overflow:hidden; }
.hero-video-wrap { position:absolute; inset:0; z-index:0; }
.hero-video { opacity:.34; transform:scale(1.05); filter:saturate(1.2) contrast(1.05); }
.hero-video-wrap::after {
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(6,1,15,.4) 0%, rgba(6,1,15,.1) 40%, var(--bg) 96%),
    radial-gradient(70% 80% at 30% 40%, transparent, rgba(6,1,15,.7));
}

.hero-inner { position:relative; z-index:2; width:min(calc(100% - var(--gap)*2),var(--sh));
  margin-inline:auto; display:grid; grid-template-columns:1.25fr .9fr;
  gap:clamp(30px,5vw,70px); align-items:center; padding-block:6vh; }

.kicker { display:flex; flex-wrap:wrap; align-items:center; gap:10px;
  font-family:"Syne",sans-serif; font-weight:600; font-size:.8rem; letter-spacing:.22em;
  text-transform:uppercase; color:var(--cyan); margin-bottom:24px; }
.kicker .dot { width:5px; height:5px; border-radius:50%; background:var(--magenta);
  box-shadow:0 0 8px var(--magenta-glow); }

.hero-name { position:relative; margin-bottom:8px; }
.hero-name .nm {
  font-family:"Anton",sans-serif; text-transform:uppercase;
  font-size:clamp(86px,20vw,260px); line-height:.82; letter-spacing:.005em;
  background:var(--grad-neon); background-size:220% 100%;
  -webkit-background-clip:text; background-clip:text; color:transparent;
  filter:drop-shadow(0 0 38px rgba(255,31,174,.35));
  animation:nameShine 6s linear infinite;
}
@keyframes nameShine { to{background-position:220% 0} }
.hero-name .echo { position:absolute; inset:0; z-index:-1;
  font-family:"Anton",sans-serif; text-transform:uppercase;
  font-size:clamp(86px,20vw,260px); line-height:.82; letter-spacing:.005em;
  color:transparent; -webkit-text-stroke:1.5px rgba(79,230,255,.30);
  transform:translate(8px,8px); }

.hero-tagline { font-family:"Syne",sans-serif; font-weight:600;
  font-size:clamp(1.05rem,2vw,1.5rem); color:var(--ink); max-width:30ch;
  margin-bottom:34px; line-height:1.35; }
.hero-tagline b { color:var(--magenta-2); }

.hero-btns { display:flex; flex-wrap:wrap; gap:16px; margin-bottom:36px; }

.btn { font-family:"Syne",sans-serif; font-weight:700; font-size:.92rem; letter-spacing:.02em;
  padding:16px 30px; border-radius:100px; display:inline-flex; align-items:center; gap:10px;
  position:relative; transition:transform .3s,box-shadow .4s,background .4s; white-space:nowrap; }
.btn-neon { color:#fff; background:var(--grad-hot); background-size:180% 180%;
  box-shadow:0 8px 30px var(--magenta-glow); }
.btn-neon:hover { box-shadow:0 12px 44px var(--magenta-glow); }
.btn-ghost { color:var(--ink); border:1.5px solid var(--panel-bd);
  background:rgba(255,255,255,.02); backdrop-filter:blur(6px); }
.btn-ghost:hover { border-color:var(--cyan); color:var(--cyan); box-shadow:0 0 26px var(--cyan-glow); }

.hero-pills { display:flex; flex-wrap:wrap; gap:12px; }
.pill { display:inline-flex; align-items:center; gap:9px;
  font-family:"Syne",sans-serif; font-weight:600; font-size:.8rem; letter-spacing:.04em;
  padding:9px 16px; border-radius:100px; color:var(--ink-dim);
  border:1px solid var(--panel-bd); background:var(--panel); backdrop-filter:blur(8px); }
.pill .y { font-family:"Anton",sans-serif; color:var(--gold); letter-spacing:.04em; }

/* hero right — photo stack */
.hero-right { position:relative; aspect-ratio:3/4; }
.himg { position:absolute; border-radius:20px; overflow:hidden;
  box-shadow:0 30px 80px rgba(0,0,0,.6); }
.himg::after { content:""; position:absolute; inset:0;
  background:linear-gradient(160deg,transparent 55%,rgba(255,31,174,.18)); }
.himg-main { inset:0; border:1px solid rgba(79,230,255,.22);
  box-shadow:0 30px 90px rgba(61,107,255,.35), 0 0 0 1px rgba(255,255,255,.04); }
.himg-float { width:46%; aspect-ratio:3/4; right:-7%; bottom:-7%;
  border:1px solid rgba(255,31,174,.3); box-shadow:0 24px 60px var(--magenta-glow); z-index:3; }
.himg-tag { position:absolute; top:-14px; left:-14px; z-index:4;
  font-family:"Syne",sans-serif; font-weight:700; font-size:.7rem; letter-spacing:.18em;
  text-transform:uppercase; color:#06010f; padding:7px 14px; border-radius:100px;
  background:var(--cyan); box-shadow:0 0 24px var(--cyan-glow); }

.hero-cue { position:absolute; left:50%; bottom:24px; transform:translateX(-50%); z-index:3;
  display:flex; flex-direction:column; align-items:center; gap:8px;
  font-family:"Syne",sans-serif; font-weight:600; font-size:.66rem; letter-spacing:.3em;
  text-transform:uppercase; color:var(--ink-mute); }
.hero-cue .rail { width:1.5px; height:46px; background:rgba(255,255,255,.12);
  border-radius:2px; overflow:hidden; }
.hero-cue .thumb { width:100%; height:40%; background:var(--grad-neon);
  animation:cue 2.2s var(--ease) infinite; }
@keyframes cue { 0%{transform:translateY(-110%)} 100%{transform:translateY(260%)} }

/* ════════════════════════════════════════════════════════
   MARQUEE
   ════════════════════════════════════════════════════════ */
.marquee { overflow:hidden; padding:26px 0; border-block:1px solid var(--panel-bd);
  background:linear-gradient(180deg,rgba(138,61,255,.06),transparent); position:relative; }
.marquee-track { display:flex; gap:34px; width:max-content;
  animation:marq 32s linear infinite; }
.marquee:hover .marquee-track { animation-play-state:paused; }
.marquee span { font-family:"Anton",sans-serif; font-size:clamp(26px,4vw,48px);
  text-transform:uppercase; color:transparent; -webkit-text-stroke:1px rgba(244,238,254,.35); }
.marquee span.fill { -webkit-text-stroke:0; background:var(--grad-neon);
  -webkit-background-clip:text; background-clip:text; }
.marquee .sep { color:var(--magenta); -webkit-text-stroke:0; }
@keyframes marq { to{transform:translateX(-50%)} }

/* ════════════════════════════════════════════════════════
   STATS
   ════════════════════════════════════════════════════════ */
.stats-sec { padding:clamp(60px,9vw,120px) 0; }
.stats-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(16px,3vw,30px); }
.stat { padding:30px 24px; border-radius:20px; position:relative; overflow:hidden;
  border:1px solid var(--panel-bd); background:var(--panel); backdrop-filter:blur(10px); }
.stat::before { content:""; position:absolute; inset:0; opacity:0; transition:opacity .5s;
  background:radial-gradient(60% 80% at 50% 0%,rgba(255,31,174,.18),transparent); }
.stat:hover::before { opacity:1; }
.stat-n { font-family:"Anton",sans-serif; font-size:clamp(40px,6vw,72px); line-height:1;
  background:var(--grad-neon); -webkit-background-clip:text; background-clip:text;
  color:transparent; margin-bottom:8px; }
.stat-l { font-family:"Syne",sans-serif; font-weight:600; font-size:.82rem; letter-spacing:.04em;
  color:var(--ink-dim); text-transform:uppercase; }

/* ════════════════════════════════════════════════════════
   SECTION HEADS
   ════════════════════════════════════════════════════════ */
.sec-head { margin-bottom:clamp(40px,6vw,72px); max-width:760px; }
.sec-h2 { font-family:"Anton",sans-serif; text-transform:uppercase;
  font-size:clamp(40px,8vw,104px); line-height:.92; letter-spacing:.005em; }
.sec-sub { font-family:"Syne",sans-serif; color:var(--ink-dim); font-size:1.05rem;
  max-width:54ch; margin-top:18px; }

/* ════════════════════════════════════════════════════════
   BIO
   ════════════════════════════════════════════════════════ */
.bio-sec { padding:clamp(40px,8vw,120px) 0; }
.bio-grid { width:min(calc(100% - var(--gap)*2),var(--sh)); margin-inline:auto;
  display:grid; grid-template-columns:.85fr 1fr; gap:clamp(34px,6vw,90px); }
.bio-sticky { position:sticky; top:calc(var(--hdr) + 20px); height:max-content; }
.bio-photo { position:relative; border-radius:24px; overflow:hidden; aspect-ratio:3/4;
  border:1px solid rgba(79,230,255,.2);
  box-shadow:0 40px 90px rgba(61,107,255,.30), 0 0 0 1px rgba(255,255,255,.04); }
.bio-photo::after { content:""; position:absolute; inset:0;
  background:linear-gradient(180deg,transparent 50%,rgba(255,31,174,.22)); }
.bio-badge { position:absolute; left:18px; bottom:18px; z-index:2;
  font-family:"Syne",sans-serif; font-weight:700; font-size:.74rem; letter-spacing:.14em;
  text-transform:uppercase; color:#fff; padding:9px 16px; border-radius:100px;
  background:rgba(6,1,15,.55); backdrop-filter:blur(10px); border:1px solid var(--panel-bd); }
.bio-badge b { color:var(--cyan); }

.bio-mob-photo { display:none; }
.bio-h2 { font-family:"Anton",sans-serif; text-transform:uppercase;
  font-size:clamp(38px,6vw,78px); line-height:.94; margin-bottom:28px; }
.bio-body { color:var(--ink-dim); font-size:1.06rem; margin-bottom:18px; max-width:56ch; }
.bio-body b { color:var(--ink); }
.bio-socials { display:flex; flex-wrap:wrap; gap:12px; margin-top:32px; }
.social-link { display:inline-flex; align-items:center; gap:9px; padding:11px 18px;
  border-radius:100px; font-family:"Syne",sans-serif; font-weight:600; font-size:.84rem;
  color:var(--ink-dim); border:1px solid var(--panel-bd); background:var(--panel);
  transition:color .3s,border-color .3s,box-shadow .4s; }
.social-link:hover { color:var(--ink); border-color:var(--cyan); box-shadow:0 0 22px var(--cyan-glow); }
.social-link svg { width:17px; height:17px; }

/* ════════════════════════════════════════════════════════
   SCENE — fullbleed live
   ════════════════════════════════════════════════════════ */
.scene { position:relative; min-height:88vh; display:flex; align-items:flex-end;
  overflow:hidden; isolation:isolate; }
.scene-media { position:absolute; inset:-8% 0; z-index:0; will-change:transform; }
.scene-media img {
  transform:scale(1.12) translate3d(0,var(--scene-shift,0px),0);
  object-position:50% 22%;
  filter:saturate(1.18) contrast(1.04);
  will-change:transform,filter;
  transition:filter .35s var(--ease);
}
.scene-media::after { content:""; position:absolute; inset:0;
  background:linear-gradient(180deg,rgba(6,1,15,.5) 0%,transparent 30%,rgba(6,1,15,.92) 100%),
             radial-gradient(60% 60% at 70% 30%,rgba(61,107,255,.25),transparent);
  z-index:3; }
.scene-media::before {
  content:""; position:absolute; inset:0; z-index:2; pointer-events:none;
  background:
    linear-gradient(105deg,transparent 8%,rgba(255,31,174,.18) 18%,transparent 32%),
    linear-gradient(72deg,transparent 58%,rgba(79,230,255,.16) 68%,transparent 78%);
  mix-blend-mode:screen;
  opacity:.55;
  transform:translate3d(var(--scene-light-x,-8%),0,0);
  transition:transform .22s linear;
}
.scene-sweep,
.scene-spark {
  position:absolute;
  pointer-events:none;
  mix-blend-mode:screen;
}
.scene-sweep {
  z-index:1;
  width:34vw;
  min-width:260px;
  height:150%;
  top:-22%;
  border-radius:999px;
  filter:blur(16px);
  opacity:.42;
  transform-origin:50% 0;
  animation:sceneSweep 9s ease-in-out infinite alternate;
}
.scene-sweep-one {
  left:58%;
  background:linear-gradient(180deg,rgba(79,230,255,.02),rgba(79,230,255,.34),rgba(255,255,255,.08),transparent);
  transform:rotate(12deg);
}
.scene-sweep-two {
  left:80%;
  background:linear-gradient(180deg,rgba(255,207,92,.03),rgba(255,207,92,.32),rgba(255,31,174,.12),transparent);
  transform:rotate(18deg);
  animation-delay:-4.5s;
}
.scene-spark {
  z-index:4;
  width:clamp(72px,9vw,136px);
  height:clamp(72px,9vw,136px);
  background:
    linear-gradient(90deg,transparent 0 42%,rgba(255,255,255,.72) 49%,rgba(255,255,255,.72) 51%,transparent 58%),
    linear-gradient(0deg,transparent 0 42%,rgba(79,230,255,.68) 49%,rgba(79,230,255,.68) 51%,transparent 58%),
    radial-gradient(circle at 50% 50%,rgba(255,255,255,.92) 0 4px,rgba(255,31,174,.34) 5px 18px,transparent 46px);
  filter:drop-shadow(0 0 18px rgba(79,230,255,.68)) drop-shadow(0 0 30px rgba(255,31,174,.24));
  animation:scenePulse 4.8s ease-in-out infinite;
}
.scene-spark-one { top:22%; right:15%; }
.scene-spark-two {
  width:clamp(46px,6vw,86px);
  top:67%;
  left:40%;
  animation-delay:-2.2s;
}
.scene.is-active .scene-media img { filter:saturate(1.26) contrast(1.07) brightness(1.04); }
.scene-copy { position:relative; z-index:2; padding-block:clamp(50px,8vw,110px); }
.scene-h2 { font-family:"Anton",sans-serif; text-transform:uppercase;
  font-size:clamp(44px,9vw,128px); line-height:.9; margin-bottom:30px; }
@keyframes sceneSweep {
  0% { opacity:.26; transform:translate3d(-8%,0,0) rotate(10deg); }
  50% { opacity:.58; }
  100% { opacity:.34; transform:translate3d(12%,3%,0) rotate(18deg); }
}
@keyframes scenePulse {
  0%,100% { opacity:.34; transform:scale(.78); }
  45% { opacity:.82; transform:scale(1.08); }
  70% { opacity:.48; transform:scale(.92); }
}

/* ════════════════════════════════════════════════════════
   HITS
   ════════════════════════════════════════════════════════ */
.hits-sec { padding:clamp(70px,10vw,150px) 0; position:relative; }
.hits-list { border-top:1px solid var(--panel-bd); }
.hit-row { position:relative; display:grid; grid-template-columns:auto 1fr auto;
  align-items:center; gap:clamp(16px,3vw,40px); padding:clamp(22px,3.4vw,38px) 6px;
  border-bottom:1px solid var(--panel-bd); transition:padding-left .4s var(--ease); }
.hit-row::before { content:""; position:absolute; left:0; top:0; bottom:0; width:0;
  background:var(--grad-neon); transition:width .4s var(--ease); }
.hit-row:hover { padding-left:24px; }
.hit-row:hover::before { width:3px; }
.hit-n { font-family:"Anton",sans-serif; font-size:clamp(20px,2.4vw,30px);
  color:var(--ink-mute); transition:color .3s; }
.hit-row:hover .hit-n { color:var(--magenta-2); }
.hit-body h3 { font-family:"Syne",sans-serif; font-weight:700;
  font-size:clamp(1.3rem,3.4vw,2.4rem); line-height:1.05; transition:color .3s; }
.hit-row:hover .hit-body h3 { background:var(--grad-neon); -webkit-background-clip:text;
  background-clip:text; color:transparent; }
.hit-body p { color:var(--ink-mute); font-size:.96rem; margin-top:6px; max-width:54ch; }
.hit-yt { display:inline-flex; align-items:center; gap:8px; padding:10px 18px;
  border-radius:100px; font-family:"Syne",sans-serif; font-weight:600; font-size:.8rem;
  color:var(--ink-dim); border:1px solid var(--panel-bd);
  transition:color .3s,border-color .3s,box-shadow .4s; white-space:nowrap; }
.hit-yt:hover { color:#fff; border-color:var(--magenta); box-shadow:0 0 22px var(--magenta-glow); }
.hit-yt svg { width:16px; height:16px; }

.hit-preview { position:fixed; top:0; left:0; width:300px; aspect-ratio:16/9; z-index:60;
  border-radius:14px; overflow:hidden; pointer-events:none; opacity:0; transform:scale(.85);
  transition:opacity .3s,transform .3s var(--ease); transform-origin:top left;
  border:1px solid rgba(79,230,255,.4); box-shadow:0 20px 60px rgba(0,0,0,.6),0 0 30px var(--magenta-glow); }
.hit-preview.is-vis { opacity:1; transform:scale(1); }

/* ════════════════════════════════════════════════════════
   VIDEO GRID  — premium featured layout
   ════════════════════════════════════════════════════════ */
.video-sec { padding:clamp(60px,9vw,130px) 0; }

.vid-head { display:flex; align-items:flex-end; justify-content:space-between;
  gap:30px; flex-wrap:wrap; margin-bottom:clamp(34px,5vw,60px); }
.vid-head-copy { max-width:760px; }
.vid-channel { display:inline-flex; align-items:center; gap:14px; padding:11px 20px 11px 13px;
  border-radius:100px; border:1px solid var(--panel-bd); background:var(--panel);
  backdrop-filter:blur(10px); transition:border-color .4s,box-shadow .4s,transform .4s var(--ease); }
.vid-channel:hover { border-color:var(--magenta); box-shadow:0 0 30px var(--magenta-glow);
  transform:translateY(-2px); }
.vid-channel-ic { display:grid; place-items:center; width:38px; height:38px; flex:none;
  border-radius:50%; color:#fff; background:linear-gradient(135deg,#ff1fae,#ff0000); }
.vid-channel-ic svg { width:20px; height:20px; }
.vid-channel-txt { display:flex; flex-direction:column; line-height:1.2; }
.vid-channel-txt strong { font-family:"Syne",sans-serif; font-weight:700; font-size:.95rem; }
.vid-channel-txt span { font-size:.74rem; color:var(--ink-mute); letter-spacing:.01em; }

.vid-grid { display:grid; grid-template-columns:1.55fr 1fr;
  grid-template-rows:repeat(2,minmax(0,1fr)); gap:clamp(14px,1.6vw,22px);
  height:clamp(380px,40vw,540px); }
.vid-feat { grid-row:1 / span 2; }

.vid-frame { position:relative; border-radius:20px; overflow:hidden; height:100%;
  border:1px solid var(--panel-bd); display:block; isolation:isolate;
  transition:transform .5s var(--ease),box-shadow .5s; }
.vid-frame img { transition:transform .9s var(--ease),filter .5s; filter:saturate(1.15); }
.vid-frame::after { content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(190deg,rgba(6,1,15,.05) 30%,rgba(6,1,15,.55) 68%,rgba(6,1,15,.92)); }
/* gradient neon ring */
.vid-frame::before { content:""; position:absolute; inset:0; z-index:3; border-radius:inherit;
  padding:1.5px; background:var(--grad-neon); opacity:.45; transition:opacity .4s;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude; pointer-events:none; }
.vid-frame:hover { transform:translateY(-6px); box-shadow:0 28px 70px var(--blue-glow); }
.vid-frame:hover::before { opacity:1; }
.vid-frame:hover img { transform:scale(1.07); }

.vid-badge { position:absolute; top:16px; left:16px; z-index:4;
  font-family:"Syne",sans-serif; font-weight:700; font-size:.66rem; letter-spacing:.14em;
  text-transform:uppercase; color:#06010f; padding:7px 13px; border-radius:100px;
  background:var(--grad-hot); box-shadow:0 6px 22px var(--magenta-glow); }

.vid-play { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%) scale(.82);
  z-index:4; display:inline-flex; align-items:center; gap:9px; padding:12px 22px;
  border-radius:100px; font-family:"Syne",sans-serif; font-weight:700; font-size:.78rem;
  color:#fff; background:rgba(6,1,15,.42); backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.28); white-space:nowrap;
  opacity:0; transition:opacity .4s,transform .4s var(--ease); }
.vid-play-ic { display:grid; place-items:center; width:26px; height:26px; border-radius:50%;
  background:var(--grad-hot); color:#fff; font-size:.6rem; padding-left:2px;
  box-shadow:0 0 18px var(--magenta-glow); }
.vid-frame:hover .vid-play { opacity:1; transform:translate(-50%,-50%) scale(1); }

.vid-meta { position:absolute; left:18px; right:18px; bottom:16px; z-index:4;
  display:flex; flex-direction:column; gap:2px; }
.vid-label { font-family:"Syne",sans-serif; font-weight:700; font-size:1.05rem; color:#fff;
  line-height:1.15; }
.vid-sub { font-size:.74rem; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-dim); }
.vid-feat .vid-label { font-size:clamp(1.3rem,2.4vw,2rem); }

.vid-more { margin-top:40px; }

/* ════════════════════════════════════════════════════════
   PREMIERY  — release shelf with vinyl covers
   ════════════════════════════════════════════════════════ */
.rel-sec { position:relative; padding:clamp(54px,8vw,118px) 0 clamp(70px,9vw,140px);
  overflow:hidden; }
.rel-sec::before { content:""; position:absolute; inset:8% 0 auto; height:74%;
  background:
    linear-gradient(90deg,transparent,rgba(255,31,174,.12) 28%,rgba(79,230,255,.10) 72%,transparent),
    radial-gradient(46% 70% at 82% 18%,rgba(255,31,174,.22),transparent 68%);
  pointer-events:none; opacity:.9; }
.rel-grid { position:relative; display:grid; grid-template-columns:1.18fr repeat(3,1fr);
  align-items:end; gap:clamp(16px,2vw,28px); }

.rel-card { position:relative; display:flex; flex-direction:column; min-width:0; }
.rel-feature { transform:translateY(-18px); }
.rel-art { position:relative; aspect-ratio:1/1; border-radius:22px; overflow:hidden;
  display:block; isolation:isolate;
  background:
    radial-gradient(130% 120% at 18% 0%,rgba(255,255,255,.20),transparent 46%),
    linear-gradient(150deg,var(--c1),var(--c2));
  box-shadow:0 18px 50px rgba(6,1,15,.55), 0 0 0 1px rgba(255,255,255,.06);
  transition:transform .5s var(--ease),box-shadow .5s; }
.rel-art img { position:absolute; inset:0; z-index:1; width:100%; height:100%;
  object-fit:cover; object-position:center; filter:saturate(1.12) contrast(1.06) brightness(.86);
  transition:transform .8s var(--ease),filter .5s; }
.rel-feature .rel-art { aspect-ratio:1/1.12; border-radius:26px; }
.rel-art::before { content:""; position:absolute; inset:0; z-index:2;
  background:
    linear-gradient(180deg,rgba(6,1,15,.05) 16%,rgba(6,1,15,.22) 48%,rgba(6,1,15,.92)),
    radial-gradient(90% 80% at 12% 10%,rgba(255,255,255,.24),transparent 42%),
    linear-gradient(135deg,rgba(255,31,174,.36),transparent 42%,rgba(79,230,255,.24)); }
.rel-art::after { content:""; position:absolute; inset:0; z-index:5; border-radius:inherit;
  padding:1.5px; background:linear-gradient(150deg,rgba(255,255,255,.62),transparent 44%,rgba(79,230,255,.42));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude; pointer-events:none; opacity:.75; }
.rel-card:hover .rel-art { transform:translateY(-8px); box-shadow:0 34px 80px rgba(255,31,174,.38); }
.rel-card:hover .rel-art img { transform:scale(1.07); filter:saturate(1.22) contrast(1.1) brightness(.92); }

.rel-disc { position:absolute; z-index:0; top:50%; right:-44%; width:78%; aspect-ratio:1/1;
  transform:translateY(-50%); border-radius:50%;
  background:
    radial-gradient(circle at 50% 50%,#f4eefe 0 3%,var(--c1) 3.5% 12%,#140724 12.5% 18%,transparent 18.5%),
    repeating-radial-gradient(circle at 50% 50%,rgba(255,255,255,.08) 0 1px,rgba(0,0,0,.55) 1px 4px),
    conic-gradient(from 0deg,#2a1747,#070211,#40215e,#0c0620,#2a1747);
  box-shadow:0 14px 40px rgba(0,0,0,.62), inset 0 0 0 1px rgba(255,255,255,.08);
  transition:right .55s var(--ease); animation:relSpin 10s linear infinite; }
.rel-feature .rel-disc { right:-36%; width:70%; }
.rel-card:hover .rel-disc { right:-24%; }
@keyframes relSpin { to { transform:translateY(-50%) rotate(360deg); } }

.rel-cover { position:absolute; inset:0; z-index:4; padding:clamp(17px,1.8vw,26px);
  display:flex; flex-direction:column; justify-content:flex-end;
  text-shadow:0 2px 18px rgba(6,1,15,.62); }
.rel-cover b { font-family:"Anton",sans-serif; text-transform:uppercase; letter-spacing:.08em;
  font-size:.9rem; color:rgba(255,255,255,.86); margin-bottom:auto; }
.rel-cover i { font-family:"Anton",sans-serif; font-style:normal; text-transform:uppercase;
  line-height:.88; font-size:clamp(1.45rem,2.6vw,2.35rem); color:#fff; max-width:8ch; }
.rel-feature .rel-cover i { font-size:clamp(2.5rem,5.2vw,5.2rem); max-width:7ch; }
.rel-cover small { display:inline-flex; width:max-content; margin-top:10px; padding:6px 10px;
  border-radius:100px; font-family:"Syne",sans-serif; font-weight:800; font-size:.62rem;
  letter-spacing:.14em; text-transform:uppercase; color:#06010f; background:var(--gold);
  box-shadow:0 0 24px rgba(255,207,92,.34); }

.rel-badge { position:absolute; top:14px; right:14px; z-index:6;
  font-family:"Syne",sans-serif; font-weight:800; font-size:.6rem; letter-spacing:.14em;
  text-transform:uppercase; color:#06010f; padding:7px 12px; border-radius:100px;
  background:#fff; box-shadow:0 4px 18px rgba(0,0,0,.34); }

.rel-art-play { position:absolute; z-index:6; top:50%; left:50%;
  transform:translate(-50%,-50%) scale(.7); width:56px; height:56px; border-radius:50%;
  display:grid; place-items:center; font-size:.9rem; padding-left:3px; color:#fff;
  background:rgba(6,1,15,.46); backdrop-filter:blur(10px); border:1px solid rgba(255,255,255,.44);
  opacity:0; transition:opacity .4s,transform .4s var(--ease); }
.rel-card:hover .rel-art-play { opacity:1; transform:translate(-50%,-50%) scale(1); }

.rel-body { display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:18px 4px 2px; }
.rel-cat { font-family:"Syne",sans-serif; font-weight:700; font-size:.68rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--cyan); }
.rel-body h3 { font-family:"Syne",sans-serif; font-weight:800; font-size:1.08rem; line-height:1.12;
  margin-top:4px; }
.rel-feature .rel-body h3 { font-size:clamp(1.25rem,2.1vw,1.8rem); }
.rel-play { display:inline-flex; align-items:center; flex:none; font-family:"Syne",sans-serif;
  font-weight:800; font-size:.8rem; color:var(--ink-dim);
  transition:color .3s,transform .3s var(--ease); white-space:nowrap; }
.rel-card:hover .rel-play { color:#fff; transform:translateX(3px); }

/* ════════════════════════════════════════════════════════
   GALLERY — horizontal drag
   ════════════════════════════════════════════════════════ */
.gal-sec { padding:clamp(60px,9vw,120px) 0; overflow:hidden; }
.gal-head { display:flex; justify-content:space-between; align-items:flex-end;
  margin-bottom:34px; }
.gal-hint { font-family:"Syne",sans-serif; font-weight:600; font-size:.78rem;
  letter-spacing:.16em; text-transform:uppercase; color:var(--cyan); }
.gal-track { display:flex; gap:clamp(14px,2vw,24px); padding-inline:clamp(20px,4vw,60px);
  overflow-x:auto; scrollbar-width:none; cursor:grab; scroll-snap-type:x proximity; }
.gal-track::-webkit-scrollbar { display:none; }
.gal-track.is-dragging { cursor:grabbing; }
.gal-item { flex:0 0 auto; width:clamp(240px,30vw,380px); border-radius:18px; overflow:hidden;
  position:relative; scroll-snap-align:center; border:1px solid var(--panel-bd);
  box-shadow:0 20px 50px rgba(0,0,0,.4); }
.gal-item::after { content:""; position:absolute; inset:0; opacity:0; transition:opacity .4s;
  background:linear-gradient(160deg,rgba(79,230,255,.18),transparent 60%,rgba(255,31,174,.2)); }
.gal-item:hover::after { opacity:1; }
.gal-item img { pointer-events:none; transition:transform .8s var(--ease); }
.gal-item:hover img { transform:scale(1.06); }
.gal-badge { position:absolute; top:14px; right:14px; z-index:3;
  display:inline-flex; align-items:center; gap:7px; padding:7px 11px;
  border-radius:100px; font-family:"Syne",sans-serif; font-weight:800;
  font-size:.62rem; letter-spacing:.12em; text-transform:uppercase;
  color:#fff; background:rgba(6,1,15,.62); border:1px solid rgba(255,255,255,.30);
  backdrop-filter:blur(10px); box-shadow:0 0 22px rgba(255,31,174,.28); }
.gal-badge::before { content:""; width:0; height:0; border-top:5px solid transparent;
  border-bottom:5px solid transparent; border-left:7px solid currentColor; }
.gal-badge-photo::before { width:8px; height:8px; border:1.5px solid currentColor;
  border-radius:2px; border-left:1.5px solid currentColor; border-top:1.5px solid currentColor;
  border-bottom:1.5px solid currentColor; }
.gal-tall  { aspect-ratio:3/4.4; }
.gal-mid   { aspect-ratio:3/4; }
.gal-short { aspect-ratio:4/3.4; align-self:center; }

/* ════════════════════════════════════════════════════════
   AWARDS
   ════════════════════════════════════════════════════════ */
.awards-sec { padding:clamp(70px,10vw,140px) 0; }
.awards-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(16px,2.4vw,28px); }
.award { position:relative; padding:38px 30px 34px; border-radius:22px; overflow:hidden;
  border:1px solid var(--panel-bd); background:var(--panel); backdrop-filter:blur(10px);
  transition:transform .5s var(--ease),border-color .4s,box-shadow .5s; }
.award::before { content:""; position:absolute; inset:0; opacity:0; transition:opacity .5s;
  background:radial-gradient(70% 80% at 50% 0%,rgba(255,31,174,.16),transparent); }
.award:hover { transform:translateY(-8px); border-color:rgba(255,31,174,.4);
  box-shadow:0 30px 70px var(--magenta-glow); }
.award:hover::before { opacity:1; }
.aw-year { font-family:"Anton",sans-serif; font-size:1.4rem; color:var(--gold);
  letter-spacing:.04em; }
.award-accent .aw-year { color:var(--cyan); }
.award h3 { font-family:"Syne",sans-serif; font-weight:800; font-size:1.7rem;
  margin:12px 0 18px; line-height:1.05; }
.aw-divider { width:46px; height:2px; background:var(--grad-neon); margin-bottom:18px;
  box-shadow:0 0 12px var(--magenta-glow); }
.award p { color:var(--ink-dim); font-size:.98rem; }

/* ════════════════════════════════════════════════════════
   CTA / BOOKING
   ════════════════════════════════════════════════════════ */
.cta { position:relative; padding:clamp(80px,14vw,180px) 0; overflow:hidden; }
.cta-bg { position:absolute; inset:0; z-index:0; }
.cta-bg img { opacity:.38; transform:scale(1.05); filter:saturate(1.18) contrast(1.04);
  object-position:50% 38%; }
.cta-bg::after { content:""; position:absolute; inset:0;
  background:linear-gradient(180deg,var(--bg) 0%,transparent 40%,var(--bg) 100%),
             radial-gradient(60% 80% at 50% 50%,transparent,rgba(6,1,15,.7)); }
.cta-inner { position:relative; z-index:2; text-align:center; }
.cta-h2 { font-family:"Anton",sans-serif; text-transform:uppercase;
  font-size:clamp(44px,9vw,128px); line-height:.9; margin-bottom:22px; }
.cta-h2 em { filter:drop-shadow(0 0 30px var(--magenta-glow)); }
.cta-sub { font-family:"Syne",sans-serif; color:var(--ink-dim); font-size:1.1rem;
  max-width:46ch; margin:0 auto 44px; }
.cta-contacts { display:flex; flex-wrap:wrap; justify-content:center; gap:18px; margin-bottom:36px; }
.cta-card { display:flex; flex-direction:column; gap:6px; padding:22px 34px; border-radius:18px;
  border:1px solid var(--panel-bd); background:var(--panel); backdrop-filter:blur(12px);
  transition:border-color .4s,box-shadow .4s,transform .3s; min-width:240px; }
.cta-card:hover { border-color:var(--cyan); box-shadow:0 0 30px var(--cyan-glow); transform:translateY(-4px); }
.cta-card .lbl { font-family:"Syne",sans-serif; font-weight:700; font-size:.7rem;
  letter-spacing:.2em; text-transform:uppercase; color:var(--cyan); }
.cta-card .val { font-family:"Anton",sans-serif; font-size:clamp(1.4rem,3vw,2rem);
  letter-spacing:.01em; }
.cta-social { display:flex; justify-content:center; gap:14px; }
.cta-social a { width:50px; height:50px; border-radius:50%; display:grid; place-items:center;
  border:1px solid var(--panel-bd); background:var(--panel); color:var(--ink-dim);
  transition:color .3s,border-color .3s,box-shadow .4s,transform .3s; }
.cta-social a:hover { color:#fff; border-color:var(--magenta); transform:translateY(-4px);
  box-shadow:0 0 26px var(--magenta-glow); }
.cta-social svg { width:21px; height:21px; }

/* ════════════════════════════════════════════════════════
   FOOTER
   ════════════════════════════════════════════════════════ */
.footer { border-top:1px solid var(--panel-bd); padding:clamp(46px,6vw,72px) 0 40px;
  background:linear-gradient(180deg,transparent,rgba(138,61,255,.05)); }
.footer-inner { display:grid; grid-template-columns:1fr auto auto; gap:30px; align-items:center; }
.footer-brand { display:flex; flex-direction:column; gap:6px; }
.footer-logo { height:36px; width:auto; align-self:flex-start; opacity:.7; filter:drop-shadow(0 0 6px rgba(79,230,255,0.2)); transition:opacity .3s, filter .3s; }
.footer-logo:hover { opacity:1; filter:drop-shadow(0 0 10px rgba(79,230,255,0.5)); }
.footer-brand strong { font-family:"Anton",sans-serif; font-size:1.7rem;
  background:var(--grad-neon); -webkit-background-clip:text; background-clip:text; color:transparent; }
.footer-brand small { font-family:"Syne",sans-serif; color:var(--ink-mute); letter-spacing:.06em; }
.footer-nav { display:flex; gap:22px; }
.footer-nav a,.footer-social a { font-family:"Syne",sans-serif; font-weight:600; font-size:.86rem;
  color:var(--ink-dim); transition:color .3s; }
.footer-nav a:hover,.footer-social a:hover { color:var(--cyan); }
.footer-social { display:flex; gap:18px; }
.footer-copy { grid-column:1/-1; margin-top:28px; padding-top:24px; border-top:1px solid var(--panel-bd);
  font-family:"Syne",sans-serif; font-size:.78rem; color:var(--ink-mute); letter-spacing:.02em; }

/* ════════════════════════════════════════════════════════
   REVEAL
   ════════════════════════════════════════════════════════ */
[data-reveal] { opacity:0; transform:translateY(34px); filter:blur(6px);
  transition:opacity .9s var(--ease),transform .9s var(--ease),filter .9s var(--ease); }
[data-reveal].is-vis { opacity:1; transform:none; filter:none; }
body.is-loading [data-reveal] { transition:none; }

/* ════════════════════════════════════════════════════════
   RESPONSIVE
   ════════════════════════════════════════════════════════ */
@media (max-width:1024px) {
  .hdr-nav { display:none; }
  .hdr-burger { display:flex; }
  .hdr-book { display:none; }
  .hero-inner { grid-template-columns:1fr; gap:40px; }
  .hero-right { max-width:420px; margin-inline:auto; width:100%; }
  .bio-grid { grid-template-columns:1fr; }
  .bio-sticky { display:none; }
  .bio-mob-photo { display:block; position:relative; border-radius:22px; overflow:hidden;
    aspect-ratio:4/3; margin-bottom:30px; border:1px solid rgba(79,230,255,.2); }
  .vid-grid { grid-template-columns:1fr 1fr; grid-template-rows:auto; height:auto; }
  .vid-feat { grid-column:1 / -1; grid-row:auto; aspect-ratio:16/9; }
  .vid-frame:not(.vid-feat) { aspect-ratio:4/3; }
  .rel-grid { grid-template-columns:repeat(2,1fr); align-items:start; }
  .rel-feature { grid-column:1 / -1; transform:none; }
  .rel-feature .rel-art { aspect-ratio:16/10; }
  .awards-grid { grid-template-columns:1fr; max-width:520px; }
  .footer-inner { grid-template-columns:1fr; gap:24px; }
}
@media (max-width:640px) {
  .stats-grid { grid-template-columns:repeat(2,1fr); }
  .vid-head { gap:18px; }
  .vid-channel { width:100%; }
  .vid-grid { grid-template-columns:1fr; }
  .vid-frame:not(.vid-feat) { aspect-ratio:16/9; }
  .rel-grid { grid-template-columns:1fr; gap:20px; }
  .rel-feature .rel-art,.rel-art { aspect-ratio:4/3; }
  .rel-body { flex-direction:column; align-items:flex-start; gap:6px; }
  .hit-row { grid-template-columns:auto 1fr; }
  .hit-yt { grid-column:2; justify-self:start; margin-top:8px; }
  .hero-name .echo { display:none; }
  .cta-card { min-width:0; width:100%; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation-duration:.01ms !important; animation-iteration-count:1 !important;
    transition-duration:.01ms !important; }
  [data-reveal] { opacity:1; transform:none; filter:none; }
  .scene-media img { transform:scale(1.06); }
  .scene-media::before,.scene-sweep,.scene-spark { opacity:.18; }
}