/* =====================================================================
   THE DEVIL'S DOOR — CORE
   The design system carried over from the original site (tokens, type,
   fog, grain, vignette, candle, blood type, magnetic buttons, cursor)
   plus the shared chrome every page uses: nav, fullscreen menu, door
   transition, loader, footer, reveal utilities and shared components.
   Page-specific scenes live in css/pages.css.
   ===================================================================== */
:root{
  color-scheme:dark;
  --void:#070506;
  --soot:#100c0d;
  --char:#1c1617;
  --ash:#8a7d77;
  --blood:#a3141c;
  --blood-hi:#d01a22;
  --burgundy:#4a0c14;
  --ember:#c95e27;
  --bone:#d9cdb3;
  --moon:#eef0f3;
  --gold:#c9a25a;
  --violet:#3a1d5c;
  --violet-hi:#6a2a8a;
  --abyss:#0b0d1a;
  --line:rgba(217,205,179,.14);
  --line-2:rgba(217,205,179,.3);
  --f-display:"Bodoni Moda", Didot, "Bodoni 72", Georgia, serif;
  --f-gothic:"Pirata One", "Old English Text MT", Georgia, serif;
  --f-blood:"Grenze Gotisch", "Pirata One", Georgia, serif;
  --f-ui:"Archivo", "Helvetica Neue", Arial, sans-serif;
  --f-mono:"IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
  --gut:clamp(16px,4vw,64px);
  --navh:76px;
  --ease:cubic-bezier(.2,.7,.1,1);
  --ease-io:cubic-bezier(.7,0,.2,1);
}
*{box-sizing:border-box}
html{background:var(--void);-webkit-text-size-adjust:100%}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
body{margin:0;background:var(--void);color:var(--bone);font-family:var(--f-ui);font-size:16px;line-height:1.6;overflow-x:hidden;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
html.locked,html.locked body{overflow:hidden;height:100%}
::selection{background:var(--blood);color:var(--moon)}
img,svg{display:block;max-width:100%}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
:focus-visible{outline:1px solid var(--ember);outline-offset:4px}
em{font-style:italic}
p{margin:0}
h1,h2,h3,h4{margin:0;font-weight:inherit}
ul,ol{margin:0;padding:0;list-style:none}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:fixed;left:12px;top:12px;z-index:300;padding:10px 16px;background:var(--bone);color:var(--void);text-decoration:none;font-weight:700;transform:translateY(-200%)}
.skip:focus{transform:none}

/* ---------- type ---------- */
.eyebrow{font-family:var(--f-ui);font-stretch:112%;font-size:11px;font-weight:600;letter-spacing:.32em;text-transform:uppercase;color:var(--ash)}
.eyebrow.red{color:var(--blood-hi)}
.mono{font-family:var(--f-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;font-variant-numeric:tabular-nums}
.rune{font-family:var(--f-gothic);color:var(--blood);letter-spacing:0;text-transform:none}
.display{font-family:var(--f-display);font-weight:500;line-height:.9;letter-spacing:-.02em;text-wrap:balance}
.display em{font-style:italic;color:var(--blood-hi)}
.h-xxl{font-size:clamp(56px,11vw,200px)}
.h-xl{font-size:clamp(46px,8.4vw,150px)}
.h-l{font-size:clamp(40px,6vw,104px)}
.h-m{font-size:clamp(32px,4.2vw,68px)}
.h-s{font-size:clamp(26px,2.6vw,40px)}
.lede{font-size:clamp(16px,1.3vw,19px);max-width:40ch;color:rgba(217,205,179,.8);text-wrap:pretty}
.body{max-width:58ch;color:rgba(217,205,179,.72);text-wrap:pretty}
.gothic-blood{font-family:var(--f-blood);font-weight:800;line-height:.92;letter-spacing:.01em;color:#b3161f;
  background:linear-gradient(176deg,#ff4a43 0%,#c4161f 30%,#8e1016 62%,#4a0710 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  text-shadow:0 0 50px rgba(163,20,28,.3);filter:url(#rough)}
.kicker{display:flex;align-items:center;gap:14px}
.kicker::before{content:"";width:28px;height:1px;background:var(--blood)}

/* blood title: letters + drips (built by Components.bloodify) */
.blood-title{font-family:var(--f-blood);font-weight:850;line-height:.86;margin:0;letter-spacing:.005em;position:relative;
  filter:url(#rough) drop-shadow(0 0 34px rgba(163,20,28,.38));text-wrap:balance}
.blood-title .bw{display:inline-block;white-space:nowrap}
.blood-title .bl{position:relative;display:inline-block;color:#b3161f;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 .55 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"),
    linear-gradient(176deg,#ff5148 0%,#d01a22 26%,#9a1119 55%,#5a0810 82%,#2e0408 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.bl .drip{position:absolute;left:var(--x);top:var(--top,75%);width:var(--w);height:var(--h);transform:translateX(-50%);pointer-events:none;-webkit-text-fill-color:initial}
.bl .drip i{display:block;width:100%;height:100%;background:linear-gradient(180deg,#b3161f,#8e1016 60%,#5a0910);border-radius:0 0 999px 999px;transform-origin:50% 0;position:relative}
.bl .drip i::after{content:"";position:absolute;left:50%;bottom:-.05em;width:190%;aspect-ratio:1/1.2;transform:translateX(-50%);background:radial-gradient(circle at 36% 34%,#e2353b,#8e1016 58%,#5a0910);border-radius:50% 50% 50% 50%/42% 42% 58% 58%}
.bl .drip::after{content:"";position:absolute;left:50%;top:calc(100% + .05em);width:120%;aspect-ratio:1/1.35;margin-left:-60%;border-radius:50% 50% 50% 50%/40% 40% 60% 60%;background:radial-gradient(circle at 35% 30%,#d6262d,#7a0d14);opacity:0}
.blood-title.live .bl .drip::after{animation:dropfall 9s var(--d,0s) infinite cubic-bezier(.6,0,.9,.5)}
.blood-title.live{animation:titleflick 11s infinite}
@keyframes dropfall{0%,68%{transform:translateY(0) scale(.3);opacity:0}72%{opacity:1;transform:translateY(0) scale(1)}100%{transform:translateY(40vh) scale(.75,1.2);opacity:0}}
@keyframes titleflick{0%,91%,100%{opacity:1}92%{opacity:.55}92.6%{opacity:1}93.4%{opacity:.7}94%{opacity:1}}

/* ---------- atmosphere ---------- */
#fog{position:fixed;inset:0;width:100%;height:100%;z-index:40;pointer-events:none;mix-blend-mode:screen}
.grain{position:fixed;inset:-60%;z-index:41;pointer-events:none;opacity:.075;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 1.2 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");animation:grain .9s steps(6) infinite}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-4%,3%)}40%{transform:translate(3%,-5%)}60%{transform:translate(-6%,-2%)}80%{transform:translate(5%,4%)}100%{transform:translate(0,0)}}
.vignette{position:fixed;inset:0;z-index:42;pointer-events:none;background:radial-gradient(120% 90% at 50% 45%,transparent 50%,rgba(0,0,0,.5) 82%,rgba(0,0,0,.85) 100%)}
.flash{position:fixed;inset:0;z-index:43;pointer-events:none;background:radial-gradient(80% 60% at 60% 10%,rgba(238,240,243,.5),rgba(238,240,243,.06) 60%,transparent);opacity:0}
.sweep{position:fixed;inset:0;z-index:43;pointer-events:none;background:linear-gradient(100deg,transparent 30%,rgba(208,26,34,.22) 48%,rgba(208,26,34,.05) 56%,transparent 70%);transform:translateX(-120%);mix-blend-mode:screen}

/* ---------- loader (first visit only) ---------- */
#loader{position:fixed;inset:0;z-index:250;background:var(--void);display:none;place-items:center;padding:24px}
html.first #loader{display:grid}
#loader .ld-inner{display:grid;justify-items:center;gap:26px;text-align:center}
.ld-door{width:64px;height:100px;position:relative;border-radius:32px 32px 2px 2px;box-shadow:0 0 0 1px var(--line-2);overflow:hidden}
.ld-door::before{content:"";position:absolute;left:50%;top:10%;bottom:0;width:2px;margin-left:-1px;background:linear-gradient(transparent,#ff5148 30%,#ff5148 70%,transparent);box-shadow:0 0 18px 4px rgba(208,26,34,.6);animation:crackflick 3s steps(1) infinite}
@keyframes crackflick{0%{opacity:.3}8%{opacity:1}10%{opacity:.4}11%{opacity:.95}40%{opacity:.7}42%{opacity:.2}44%{opacity:.9}100%{opacity:.8}}
.ld-count{font-family:var(--f-display);font-size:clamp(64px,12vw,140px);font-weight:400;font-style:italic;line-height:1;color:var(--bone);font-variant-numeric:tabular-nums;min-width:3ch}
.ld-choice{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 28px;opacity:0;transform:translateY(10px);transition:opacity .8s,transform .8s var(--ease)}
.ld-choice.show{opacity:1;transform:none}
.ld-choice button{font-stretch:112%;font-size:12px;font-weight:600;letter-spacing:.3em;text-transform:uppercase;padding:16px 4px;border-bottom:1px solid var(--line-2);transition:color .3s,border-color .3s}
.ld-choice button:hover{color:var(--moon);border-color:var(--blood)}
.ld-choice .primary{color:var(--moon)}
.ld-hint{font-size:12px;color:var(--ash);letter-spacing:.06em}

/* ---------- door transition between pages ---------- */
.wipe{position:fixed;inset:0;z-index:220;pointer-events:none;display:flex}
.wipe i{flex:1;height:100%;transition:transform .9s var(--ease-io);background:
  radial-gradient(circle at 50% 50%,#2a2020 0 2px,transparent 3px) 0 0/22px 34px,
  repeating-linear-gradient(90deg,#0e0a0b 0 2px,#161112 2px 26px,#120d0e 26px 28px),#140f10;box-shadow:inset 0 0 120px rgba(0,0,0,.95)}
.wipe i:first-child{transform:translateX(-101%);border-right:1px solid #000}
.wipe i:last-child{transform:translateX(101%);border-left:1px solid #000}
.wipe::after{content:"";position:absolute;left:50%;top:0;bottom:0;width:2px;margin-left:-1px;background:linear-gradient(transparent,#ff5148 20%,#ff5148 80%,transparent);box-shadow:0 0 30px 6px rgba(208,26,34,.55);opacity:0;transition:opacity .3s}
html.wipe-hold .wipe i,.wipe.closed i{transform:none}
html.wipe-hold .wipe::after,.wipe.closed::after{opacity:1;transition-delay:.7s}
html.wipe-hold .wipe{pointer-events:auto}

/* ---------- cursor ---------- */
.cur-dot,.cur-ring{position:fixed;left:0;top:0;z-index:260;pointer-events:none;border-radius:50%;display:none}
.cursor-on .cur-dot,.cursor-on .cur-ring{display:block}
.cur-dot{width:6px;height:6px;margin:-3px 0 0 -3px;background:var(--moon);box-shadow:0 0 12px 2px rgba(238,240,243,.6)}
.cur-ring{width:36px;height:36px;margin:-18px 0 0 -18px;border:1px solid rgba(217,205,179,.35);place-items:center;transition:width .35s var(--ease),height .35s var(--ease),margin .35s var(--ease),background .35s,border-color .35s}
.cursor-on .cur-ring{display:grid}
.cur-ring span{font-stretch:115%;font-size:9.5px;font-weight:700;letter-spacing:.22em;color:var(--void);opacity:0;transition:opacity .25s;padding-left:.22em;text-align:center;line-height:1.1}
.cur-ring.big{width:88px;height:88px;margin:-44px 0 0 -44px;background:rgba(217,205,179,.94);border-color:transparent;border-radius:46% 54% 52% 48%/52% 46% 54% 48%;animation:morph 3s ease-in-out infinite}
.cur-ring.big span{opacity:1}
@keyframes morph{50%{border-radius:54% 46% 45% 55%/45% 55% 46% 54%}}
@media (pointer:fine){html.cursor-on,html.cursor-on *{cursor:none!important}}

/* ---------- buttons ---------- */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:54px;padding:16px 30px;font-family:var(--f-ui);font-stretch:115%;font-size:12px;font-weight:700;letter-spacing:.26em;text-transform:uppercase;text-decoration:none;color:var(--void);background:var(--bone);border-radius:999px;overflow:hidden;isolation:isolate;transition:color .4s;white-space:nowrap}
.btn::before{content:"";position:absolute;inset:0;background:var(--blood);transform:translateY(101%);border-radius:50% 50% 0 0;transition:transform .6s var(--ease),border-radius .6s;z-index:-1}
.btn:hover{color:var(--moon)}
.btn:hover::before{transform:translateY(0);border-radius:0}
.btn.ghost{background:transparent;color:var(--bone);box-shadow:inset 0 0 0 1px var(--line-2)}
.btn.blood{background:var(--blood);color:var(--moon)}
.btn.blood::before{background:var(--bone)}
.btn.blood:hover{color:var(--void)}
.btn.sm{min-height:42px;padding:11px 20px;font-size:10.5px;letter-spacing:.24em}
.arr{width:18px;height:10px;flex:none}
.ctas{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.magnetic{will-change:transform}
.tlink{font-family:var(--f-ui);font-stretch:112%;font-size:11px;font-weight:700;letter-spacing:.28em;text-transform:uppercase;text-decoration:none;display:inline-flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--line-2);transition:border-color .3s,color .3s,gap .4s var(--ease)}
.tlink:hover{color:var(--moon);border-color:var(--blood);gap:18px}

/* ---------- NAV ---------- */
.nav{position:fixed;left:0;right:0;top:0;z-index:80;height:var(--navh);display:flex;align-items:center;gap:24px;padding:0 var(--gut);padding-top:env(safe-area-inset-top,0px);transition:background .6s,height .5s var(--ease),transform .6s var(--ease),border-color .6s;border-bottom:1px solid transparent}
.nav::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(7,5,6,.82),rgba(7,5,6,0));transition:opacity .6s}
.nav.scrolled{--navh:62px;background:rgba(9,6,7,.72);backdrop-filter:blur(14px) saturate(1.2);-webkit-backdrop-filter:blur(14px) saturate(1.2);border-color:var(--line)}
.nav.scrolled::before{opacity:0}
.nav.away{transform:translateY(-110%)}
.nav-logo{display:flex;align-items:center;gap:12px;text-decoration:none;flex:none}
.nav-logo svg{width:20px;height:30px;flex:none;overflow:visible}
.nav-logo .crack{animation:crackflick 4s steps(1) infinite}
.nav-logo span{font-family:var(--f-display);font-weight:700;font-size:14px;letter-spacing:.3em;color:var(--moon);white-space:nowrap;transition:letter-spacing .6s var(--ease)}
.nav.scrolled .nav-logo span{letter-spacing:.22em}
.nav-links{display:flex;align-items:center;gap:clamp(18px,2.4vw,40px);margin:0 auto}
.nav-links a{position:relative;font-family:var(--f-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;text-decoration:none;color:rgba(217,205,179,.7);padding:8px 0;transition:color .3s;white-space:nowrap}
.nav-links a::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:1px;background:var(--blood-hi);transform:scaleX(0);transform-origin:100% 50%;transition:transform .5s var(--ease)}
.nav-links a:hover{color:var(--moon)}
.nav-links a:hover::after{transform:scaleX(1);transform-origin:0 50%}
.nav-links a[aria-current="page"]{color:var(--moon)}
.nav-links a[aria-current="page"]::before{content:"";position:absolute;left:50%;top:-4px;width:4px;height:4px;margin-left:-2px;border-radius:50%;background:var(--blood-hi);box-shadow:0 0 10px 2px rgba(208,26,34,.7)}
.nav-right{display:flex;align-items:center;gap:14px;flex:none}
.nav-snd{display:flex;align-items:center;gap:8px;padding:10px 4px;font-family:var(--f-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ash)}
.nav-snd .bars{display:flex;align-items:flex-end;gap:2px;height:12px}
.nav-snd .bars i{display:block;width:2px;height:3px;background:var(--bone)}
.nav-snd.on{color:var(--bone)}
.nav-snd.on .bars i{animation:eq 1.1s ease-in-out infinite}
.nav-snd.on .bars i:nth-child(2){animation-delay:-.3s}.nav-snd.on .bars i:nth-child(3){animation-delay:-.6s}.nav-snd.on .bars i:nth-child(4){animation-delay:-.9s}
@keyframes eq{0%,100%{height:3px}50%{height:12px}}
.nav-burger{display:flex;align-items:center;gap:12px;height:46px;padding:0 4px 0 12px;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--bone)}
.nav-burger .lines{display:grid;gap:6px;width:26px}
.nav-burger .lines i{display:block;height:1px;background:var(--bone);transition:transform .5s var(--ease),width .5s var(--ease)}
.nav-burger .lines i:last-child{width:60%;margin-left:auto}
.nav-burger:hover .lines i:last-child{width:100%}
.nav-prog{position:absolute;left:0;bottom:-1px;height:1px;width:100%;background:linear-gradient(90deg,var(--burgundy),var(--blood-hi));transform-origin:0 50%;transform:scaleX(0);opacity:0;transition:opacity .6s}
.nav.scrolled .nav-prog{opacity:1}
@media (max-width:1023px){
  .nav-links{display:none}
  .nav-right{margin-left:auto}
}
@media (max-width:640px){
  :root{--navh:64px}
  .nav.scrolled{--navh:58px}
  .nav-logo span{font-size:12px;letter-spacing:.22em}
  .nav-burger .t{display:none}
  .nav-cta{min-height:36px;padding:9px 14px;font-size:10px;letter-spacing:.2em}
  .nav-right{gap:8px}
}

/* fullscreen menu */
.fsm{position:fixed;inset:0;z-index:90;display:grid;grid-template-rows:auto 1fr auto;background:var(--void);clip-path:circle(0% at calc(100% - 44px) 36px);visibility:hidden;transition:clip-path 1s var(--ease-io),visibility 0s 1s;overflow:hidden}
.fsm.open{clip-path:circle(150% at calc(100% - 44px) 36px);visibility:visible;transition:clip-path 1s var(--ease-io),visibility 0s}
.fsm::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 50% at 80% 110%,rgba(163,20,28,.35),transparent 70%),radial-gradient(50% 40% at 0% 0%,rgba(58,29,92,.35),transparent 70%);pointer-events:none}
.fsm-top{display:flex;align-items:center;justify-content:space-between;height:var(--navh);padding:0 var(--gut);padding-top:env(safe-area-inset-top,0px);position:relative}
.fsm-close{display:flex;align-items:center;gap:12px;height:46px;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase}
.fsm-close .x{width:22px;height:22px;position:relative}
.fsm-close .x::before,.fsm-close .x::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:var(--bone);transform:rotate(45deg)}
.fsm-close .x::after{transform:rotate(-45deg)}
.fsm-body{position:relative;overflow-y:auto;overscroll-behavior:contain;padding:2vh var(--gut) 4vh;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:4vw;align-items:center}
.fsm-list{display:grid;counter-reset:m}
.fsm-list a{display:grid;grid-template-columns:52px 1fr auto;align-items:baseline;gap:12px;text-decoration:none;padding:clamp(4px,.9vh,10px) 0;border-bottom:1px solid var(--line);transition:padding .5s var(--ease),color .3s;opacity:0;transform:translateY(24px)}
.fsm.open .fsm-list a{opacity:1;transform:none;transition:opacity .7s var(--d),transform .9s var(--ease) var(--d),padding .5s var(--ease),color .3s}
.fsm-list .n{font-family:var(--f-gothic);font-size:20px;color:var(--ash);transition:color .3s}
.fsm-list .t{font-family:var(--f-display);font-size:clamp(28px,4.6vh,48px);font-weight:500;line-height:1.05;letter-spacing:-.01em}
.fsm-list .s{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.14em;color:var(--ash);text-transform:uppercase}
.fsm-list a:hover,.fsm-list a:focus-visible{padding-left:14px;color:var(--moon)}
.fsm-list a:hover .n,.fsm-list a[aria-current="page"] .n{color:var(--blood-hi)}
.fsm-list a[aria-current="page"] .t{font-style:italic;color:var(--moon)}
.fsm-side{display:grid;gap:22px;justify-items:start;align-content:center}
.fsm-door{width:min(260px,40vw);aspect-ratio:3/5;border-radius:50% 50% 2px 2px/30% 30% 2px 2px;position:relative;overflow:hidden;box-shadow:0 0 0 8px #151011,0 0 0 9px rgba(217,205,179,.18),0 30px 90px rgba(0,0,0,.8)}
.fsm-door .glow{position:absolute;inset:0;background:radial-gradient(60% 50% at 50% 62%,#ff5148,#a3141c 35%,#2a0508 75%,#0a0304)}
.fsm-door .word{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--f-blood);font-size:clamp(28px,4vw,48px);color:rgba(7,5,6,.85);text-align:center;line-height:.9;padding:0 12px;transition:opacity .4s}
.fsm-door .lf{position:absolute;top:0;bottom:0;width:50%;background:inherit;transition:transform 1.1s var(--ease)}
.fsm-door .lf{background:radial-gradient(circle at 50% 50%,#3b3030 0 2px,transparent 3px) 0 0/22px 34px,repeating-linear-gradient(90deg,#140f10 0 2px,#1f1818 2px 26px,#171112 26px 28px),#1a1415;box-shadow:inset 0 0 40px rgba(0,0,0,.9)}
.fsm-door .lf.l{left:0;transform-origin:0 50%}.fsm-door .lf.r{right:0;transform-origin:100% 50%}
.fsm-door{perspective:700px}
.fsm.peek .fsm-door .lf.l{transform:rotateY(-62deg)}
.fsm.peek .fsm-door .lf.r{transform:rotateY(62deg)}
.fsm-meta{display:grid;gap:6px}
.fsm-foot{position:relative;display:flex;flex-wrap:wrap;gap:12px 28px;justify-content:space-between;align-items:center;padding:16px var(--gut) calc(env(safe-area-inset-bottom,0px) + 18px);border-top:1px solid var(--line)}
@media (max-width:860px){
  .fsm-body{grid-template-columns:1fr;align-items:start}
  .fsm-side{display:none}
  .fsm-list .s{display:none}
  .fsm-list a{grid-template-columns:40px 1fr}
}

/* ---------- layout primitives ---------- */
main{position:relative;z-index:1;display:block}
.wrap{width:100%;max-width:1520px;margin:0 auto;padding:0 var(--gut)}
.sec{position:relative;padding:clamp(96px,16vh,200px) 0}
.sec.tight{padding:clamp(64px,10vh,120px) 0}
.pin{height:100vh;height:100svh;overflow:hidden;position:relative}
.hairline{height:1px;background:var(--line);border:0;margin:0}
.dark-fade{position:absolute;left:0;right:0;height:30vh;pointer-events:none;z-index:2}
.dark-fade.top{top:0;background:linear-gradient(var(--void),transparent)}
.dark-fade.bot{bottom:0;background:linear-gradient(transparent,var(--void))}
.grid-2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,110px);align-items:center}
@media (max-width:900px){.grid-2{grid-template-columns:1fr}}

/* ---------- page hero (inner pages) ---------- */
.phero{position:relative;min-height:100vh;min-height:100svh;display:grid;align-items:end;padding:calc(var(--navh) + 8vh) 0 clamp(48px,9vh,110px);overflow:hidden;isolation:isolate}
.phero-bg{position:absolute;inset:-8% 0 0;z-index:-1}
.phero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,5,6,.55),rgba(7,5,6,.15) 40%,rgba(7,5,6,.92) 92%,var(--void))}
.phero-in{display:grid;gap:clamp(18px,3vh,30px)}
.phero .crumb{display:flex;gap:14px;align-items:center}
.phero .crumb .num{font-family:var(--f-gothic);font-size:22px;color:var(--blood-hi)}
.phero h1{max-width:14ch}
.phero .row{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:28px}
.phero .scroll-cue{display:flex;align-items:center;gap:14px;color:var(--ash)}
.scroll-cue .drip{width:1px;height:46px;background:linear-gradient(var(--line-2),transparent);position:relative;overflow:hidden}
.scroll-cue .drip::after{content:"";position:absolute;left:-1px;width:3px;height:10px;background:var(--blood);border-radius:2px;animation:drip 1.8s var(--ease) infinite}
@keyframes drip{from{top:-10px}to{top:46px}}

/* ---------- reveal utilities (JS adds .in) ---------- */
.js [data-reveal]{opacity:0;transform:translateY(34px)}
.js [data-reveal="fade"]{transform:none}
.js [data-reveal="dark"]{filter:brightness(0) blur(6px);transform:scale(1.02)}
.js [data-reveal].in{opacity:1;transform:none;filter:none;transition:opacity 1.2s var(--ease) var(--rd,0s),transform 1.4s var(--ease) var(--rd,0s),filter 1.6s var(--ease) var(--rd,0s)}
.lines .ln{display:block;overflow:hidden;padding-bottom:.06em;margin-bottom:-.06em}
.lines .ln > span{display:inline-block}
.js .lines:not(.in) .ln > span{transform:translateY(105%)}
.js .lines.in .ln > span{transform:none;transition:transform 1.3s var(--ease) calc(var(--i) * .09s + var(--rd,0s))}
.js [data-mask]{clip-path:inset(100% 0 0 0)}
.js [data-mask].in{clip-path:inset(0 0 0 0);transition:clip-path 1.6s var(--ease-io) var(--rd,0s)}
.js [data-mask] .plate-art,.js [data-mask] img{transform:scale(1.18)}
.js [data-mask].in .plate-art,.js [data-mask].in img{transform:scale(1);transition:transform 2.2s var(--ease) var(--rd,0s)}

/* ---------- plates: art or photo in a frame ---------- */
.plate{position:relative;overflow:hidden;background:#0b0809;isolation:isolate}
.plate-art,.plate img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.plate-art svg{width:100%;height:100%}
.plate::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(120% 90% at 50% 40%,transparent 50%,rgba(0,0,0,.55));z-index:2}
.plate .cap{position:absolute;left:14px;bottom:12px;z-index:3;color:rgba(217,205,179,.6)}


/* ---------- CTA band (shared) ---------- */
.cta-band{position:relative;padding:clamp(120px,22vh,260px) 0;text-align:center;overflow:hidden;isolation:isolate}
.cta-band::before{content:"";position:absolute;left:50%;top:50%;width:min(420px,70vw);aspect-ratio:3/5;transform:translate(-50%,-50%);border-radius:50% 50% 2px 2px/30% 30% 2px 2px;background:radial-gradient(60% 50% at 50% 70%,rgba(208,26,34,.4),rgba(74,12,20,.25) 50%,transparent 75%);box-shadow:0 0 0 1px rgba(217,205,179,.08);z-index:-1}
.cta-band .in{display:grid;justify-items:center;gap:26px}
.cta-band h2{padding-bottom:.14em}
.cta-band .meta{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 26px;color:var(--ash)}

/* ---------- section heads ---------- */
.shead{display:grid;gap:18px;margin-bottom:clamp(40px,8vh,90px)}
.shead.split{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:end;gap:28px 6vw}
@media (max-width:900px){.shead.split{grid-template-columns:1fr}}

/* chips */
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{font-family:var(--f-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;padding:7px 12px;border:1px solid var(--line-2);border-radius:999px;color:rgba(217,205,179,.8)}

/* ---------- horizontal track (pinned on desktop, swipe on touch) ---------- */
.htrack{position:relative}
.htrack .hviewport{overflow:hidden;height:100vh;height:100svh;position:relative}
.htrack .hrow{display:flex;height:100%;width:max-content;will-change:transform}
.htrack .hprog{position:absolute;left:var(--gut);right:max(var(--gut),88px);bottom:calc(env(safe-area-inset-bottom,0px) + 22px);display:flex;align-items:center;gap:16px;z-index:5;color:var(--ash)}
.htrack .hprog .bar{flex:1;height:1px;background:var(--line);position:relative;overflow:hidden}
.htrack .hprog .bar i{position:absolute;inset:0;background:var(--blood-hi);transform-origin:0 50%;transform:scaleX(0)}
html.touch .htrack .hviewport{overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;scrollbar-width:none;height:auto;min-height:100svh}
html.touch .htrack .hviewport::-webkit-scrollbar{display:none}
html.touch .htrack .hrow > *{scroll-snap-align:start}

/* ---------- footer ---------- */
.foot{position:relative;z-index:1;padding:clamp(90px,14vh,160px) 0 calc(env(safe-area-inset-bottom,0px) + 28px);border-top:1px solid var(--line);overflow:hidden;background:linear-gradient(180deg,var(--void),#0b0708)}
.foot-title{font-size:clamp(52px,12.5vw,230px);text-align:center;line-height:.82;margin-bottom:clamp(30px,6vh,60px)}
.foot-dare{text-align:center;font-family:var(--f-display);font-style:italic;font-size:clamp(20px,2vw,28px);color:var(--ash);margin-bottom:clamp(60px,10vh,110px)}
.foot-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:40px 4vw;padding-bottom:48px;border-bottom:1px solid var(--line)}
.foot h4{margin-bottom:16px}
.foot ul{display:grid;gap:8px}
.foot a:not(.btn){text-decoration:none;color:rgba(217,205,179,.75);transition:color .3s}
.foot a:not(.btn):hover{color:var(--moon)}
.foot .fine{display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px 28px;padding-top:24px;color:var(--ash);font-size:12px}
.foot .fine p{max-width:80ch}
@media (max-width:900px){.foot-grid{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.foot-grid{grid-template-columns:1fr}}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.2s!important}
  .grain{animation:none}
  .js [data-reveal],.js .lines .ln > span,.js [data-mask]{opacity:1!important;transform:none!important;filter:none!important;clip-path:none!important}
}

/* ---------- nav: tickets pill state ---------- */
.nav-cta[aria-current="page"]{box-shadow:0 0 0 1px var(--bone)}
.fsm-legal{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:10px}
.fsm-legal a{color:var(--ash);text-decoration:none}.fsm-legal a:hover{color:var(--bone)}
.fsm-list{max-height:100%}

/* ---------- floating WhatsApp ---------- */
.wa-float{position:fixed;right:max(16px,env(safe-area-inset-right));bottom:calc(env(safe-area-inset-bottom,0px) + 18px);z-index:70;display:flex;align-items:center;gap:0;height:52px;min-width:52px;padding:0 15px;border-radius:999px;background:rgba(12,9,10,.78);border:1px solid rgba(37,211,102,.38);color:#25d366;text-decoration:none;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 10px 30px rgba(0,0,0,.45);transition:gap .5s var(--ease),border-color .3s,background .3s,transform .4s var(--ease),opacity .4s}
.wa-float svg{width:22px;height:22px;flex:none}
.wa-float .wa-t{max-width:0;overflow:hidden;white-space:nowrap;font-family:var(--f-mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--bone);transition:max-width .5s var(--ease)}
.wa-float:hover,.wa-float:focus-visible{gap:10px;border-color:#25d366;background:rgba(18,30,22,.9)}
.wa-float:hover .wa-t,.wa-float:focus-visible .wa-t{max-width:120px}
html.locked .wa-float,html.first .wa-float{opacity:0;pointer-events:none}

/* ---------- footer: operator ---------- */
.foot-op{display:flex;flex-direction:column;align-items:center;gap:6px;margin:-10px 0 18px;text-align:center}
.foot-op b{font-family:var(--f-display);font-weight:500;font-size:clamp(20px,2vw,28px);letter-spacing:.06em;color:var(--moon)}
.foot .fine b{color:var(--bone);font-weight:600}
@media (max-width:640px){.foot{padding-bottom:calc(env(safe-area-inset-bottom,0px) + 90px)}}