:root {
  --black: #030303;
  --ink: #080808;
  --panel: #0c0b0b;
  --paper: #e7e2d9;
  --muted: #8f8b85;
  --blood: #b10018;
  --blood-bright: #f01832;
  --line: rgba(255,255,255,.12);
  --fear: 0;
  --mouse-x: 50vw;
  --mouse-y: 50vh;
  --header-h: 84px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--black); }
body {
  margin: 0;
  color: var(--paper);
  background:
    radial-gradient(circle at 50% 8%, rgba(100,0,12,.16), transparent 34%),
    var(--black);
  font-family: Inter, Arial, sans-serif;
  overflow-x: hidden;
  cursor: default;
}
body.intro-active { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
img, svg { display: block; max-width: 100%; }
::selection { background: var(--blood); color: white; }

.noscript { position: fixed; inset: 0; z-index: 99999; display:grid; place-items:center; background:#000; color:#fff; padding:30px; text-align:center; }

/* Global atmosphere */
.noise-layer,
.intro-static,
.final-static {
  pointer-events: none;
  position: fixed;
  inset: -50%;
  width: 200%;
  height: 200%;
  opacity: .055;
  z-index: 70;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.9'/%3E%3C/svg%3E");
  animation: grain .18s steps(2) infinite;
}
@keyframes grain {
  0% { transform: translate(0,0) }
  25% { transform: translate(2%,-3%) }
  50% { transform: translate(-3%,2%) }
  75% { transform: translate(3%,4%) }
  100% { transform: translate(-2%,-2%) }
}
.flashlight {
  position: fixed;
  inset: 0;
  z-index: 65;
  pointer-events: none;
  background: radial-gradient(circle 170px at var(--mouse-x) var(--mouse-y), transparent 0, rgba(0,0,0,.08) 42%, rgba(0,0,0,.83) 100%);
  opacity: clamp(0, calc((var(--fear) - 32) / 70), .72);
  transition: opacity .35s ease;
  mix-blend-mode: multiply;
}
.blood-drip { position:fixed; top:-30px; z-index:64; width:2px; height:0; background:linear-gradient(var(--blood-bright), var(--blood)); border-radius:0 0 50% 50%; pointer-events:none; opacity:calc((var(--fear) - 58) / 42); animation:drip 11s ease-in infinite; }
.drip-one { left:18%; animation-delay:2s; }
.drip-two { right:13%; animation-delay:7s; }
@keyframes drip { 0%,20%{height:0;transform:translateY(0)} 36%{height:120px} 48%{height:120px;transform:translateY(0)} 55%{height:20px;transform:translateY(70vh)} 100%{height:0;transform:translateY(100vh)} }

/* Intro */
.intro {
  position: fixed;
  inset: 0;
  z-index: 10000;
  overflow: hidden;
  background:#000;
  display:grid;
  place-items:center;
  transition: opacity .7s ease, visibility .7s ease;
}
.intro.done { opacity:0; visibility:hidden; }
.intro-vignette { position:absolute; inset:0; background:radial-gradient(circle, transparent 0, rgba(0,0,0,.25) 36%, #000 82%); z-index:2; }
.intro-static { position:absolute; z-index:1; opacity:.12; }
.intro-whisper { position:absolute; left:6vw; top:8vh; z-index:6; font: 2.2vw Creepster, cursive; letter-spacing:.18em; color:rgba(255,255,255,.1); transform:rotate(-4deg); animation:whisper 2.6s ease-in-out infinite; }
@keyframes whisper { 50%{opacity:.8; text-shadow:0 0 14px var(--blood)} }
.intro-ghost {
  position:absolute;
  left:50%; top:53%;
  width:min(82vw, 780px); aspect-ratio:.82;
  transform:translate(-50%,-50%) scale(.22);
  filter:blur(6px) drop-shadow(0 0 35px rgba(255,255,255,.18));
  opacity:.12;
  z-index:4;
  animation:ghostArrival 3.2s cubic-bezier(.62,0,.27,1) forwards;
}
@keyframes ghostArrival {
  0%{transform:translate(-50%,-50%) scale(.18); opacity:0; filter:blur(18px)}
  38%{opacity:.25; filter:blur(8px)}
  72%{transform:translate(-50%,-50%) scale(.86); opacity:.74; filter:blur(2px)}
  88%{transform:translate(-49%,-49%) scale(1.06) rotate(.6deg)}
  92%{transform:translate(-51%,-51%) scale(1.1) rotate(-.6deg)}
  100%{transform:translate(-50%,-50%) scale(1.02); opacity:1; filter:blur(0)}
}
.ghost-face { position:absolute; inset:8% 18% 4%; border-radius:46% 46% 55% 55% / 42% 42% 65% 65%; background:linear-gradient(105deg,#d3d3c8 0,#f5f4ea 36%,#aaa99f 65%,#f1efe2 100%); box-shadow:inset 18px -12px 38px rgba(0,0,0,.42), inset -20px 0 30px rgba(255,255,255,.22); clip-path:polygon(16% 0,84% 0,97% 25%,91% 52%,100% 83%,77% 100%,51% 93%,25% 100%,3% 82%,10% 54%,2% 27%); }
.ghost-hair { position:absolute; inset:0 8% 26%; z-index:3; background:linear-gradient(110deg,#010101,#171717 40%,#020202 75%); clip-path:polygon(3% 0,98% 1%,91% 25%,97% 48%,84% 41%,91% 75%,72% 55%,72% 85%,54% 61%,39% 90%,32% 57%,14% 78%,21% 44%,2% 55%,12% 24%); filter:drop-shadow(0 10px 14px #000); }
.ghost-eye { position:absolute; z-index:5; top:38%; width:12%; height:8%; border-radius:50%; background:#fff; box-shadow:0 0 18px #fff,0 0 45px rgba(255,255,255,.82),0 0 80px rgba(180,0,20,.55); animation:eyeFlicker .13s infinite alternate; }
.ghost-eye-left { left:31%; transform:rotate(7deg); }
.ghost-eye-right { right:31%; transform:rotate(-7deg); }
@keyframes eyeFlicker { to{opacity:.74; filter:brightness(2)} }
.ghost-mouth { position:absolute; z-index:6; left:38%; top:58%; width:24%; height:20%; background:#020202; border-radius:45% 48% 50% 50%; clip-path:polygon(15% 4%,50% 20%,86% 2%,99% 41%,75% 100%,51% 80%,23% 100%,0 42%); box-shadow:0 0 15px rgba(100,0,10,.8); }
.ghost-mouth:before,.ghost-mouth:after { content:"";position:absolute;left:8%;right:8%;height:25%;background:repeating-linear-gradient(90deg,#e7e4d4 0 7%,#353535 7% 9%);clip-path:polygon(0 0,100% 0,94% 100%,7% 80%); }
.ghost-mouth:before{top:8%}.ghost-mouth:after{bottom:6%;transform:rotate(180deg)}
.ghost-hand { position:absolute; z-index:7; top:42%; width:18%; height:50%; border-radius:60% 30% 50% 50%; background:linear-gradient(90deg,#8c8c83,#ecebdd); filter:drop-shadow(0 0 18px rgba(255,255,255,.16)); }
.ghost-hand:before { content:""; position:absolute; top:-32%; left:16%; width:17%; height:58%; background:#d7d6ca; border-radius:50% 50% 30% 30%; box-shadow:28px -10px 0 -1px #c6c5ba,55px 2px 0 -2px #dfded2,82px 20px 0 -3px #aaa99f; }
.ghost-hand-left { left:4%; transform:rotate(-18deg); }
.ghost-hand-right { right:4%; transform:scaleX(-1) rotate(-18deg); }
.screen-cracks { position:absolute; inset:0; z-index:8; pointer-events:none; opacity:0; animation:crackIn .15s 2.85s forwards; }
.screen-cracks span { position:absolute; left:50%; top:50%; height:2px; width:65vmax; transform-origin:left; background:linear-gradient(90deg,rgba(255,255,255,.85),transparent); filter:drop-shadow(0 0 2px white); }
.screen-cracks span:nth-child(1){transform:rotate(14deg)} .screen-cracks span:nth-child(2){transform:rotate(71deg)} .screen-cracks span:nth-child(3){transform:rotate(152deg)} .screen-cracks span:nth-child(4){transform:rotate(218deg)} .screen-cracks span:nth-child(5){transform:rotate(303deg)}
@keyframes crackIn{to{opacity:.5}}
.enter-site { position:absolute; z-index:10; bottom:10vh; min-width:260px; padding:18px 28px; border:1px solid rgba(255,255,255,.5); color:white; background:rgba(0,0,0,.55); backdrop-filter:blur(9px); letter-spacing:.2em; font-weight:800; opacity:0; transform:translateY(20px); animation:buttonIn .8s 3.05s forwards; cursor:pointer; transition:.3s ease; }
.enter-site:hover { background:var(--blood); border-color:var(--blood-bright); box-shadow:0 0 35px rgba(177,0,24,.45); transform:translateY(-2px); }
@keyframes buttonIn{to{opacity:1;transform:translateY(0)}}
.skip-intro { position:absolute; z-index:10; right:24px; top:22px; border:0; color:rgba(255,255,255,.45); background:transparent; font-size:12px; letter-spacing:.12em; text-transform:uppercase; cursor:pointer; }
.skip-intro:hover { color:white; }

/* Header */
.site-header { position:fixed; inset:0 0 auto; height:var(--header-h); z-index:100; display:flex; align-items:center; justify-content:space-between; gap:24px; padding:0 clamp(20px,4.5vw,78px); border-bottom:1px solid transparent; transition:.35s ease; }
.site-header.scrolled { height:68px; background:rgba(3,3,3,.82); backdrop-filter:blur(18px); border-color:rgba(255,255,255,.09); }
.brand { display:flex; align-items:center; gap:13px; min-width:220px; }
.brand-mark { width:42px; color:var(--blood-bright); filter:drop-shadow(0 0 10px rgba(240,24,50,.4)); }
.brand-copy { display:flex; flex-direction:column; }
.brand-copy strong { font-size:15px; letter-spacing:.19em; }
.brand-copy small { margin-top:3px; color:#777; font-size:9px; letter-spacing:.13em; text-transform:uppercase; }
.desktop-nav { display:flex; align-items:center; gap:34px; }
.desktop-nav a { position:relative; color:#aaa; font-size:12px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; }
.desktop-nav a:after { content:"";position:absolute;left:0;bottom:-8px;width:0;height:1px;background:var(--blood-bright);transition:.25s; }
.desktop-nav a:hover { color:white; } .desktop-nav a:hover:after{width:100%}
.header-actions { min-width:220px; display:flex; justify-content:flex-end; align-items:center; gap:12px; }
.icon-button { width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:rgba(0,0,0,.5);color:#aaa;display:grid;place-items:center;cursor:pointer; }
.icon-button svg{width:18px;fill:currentColor}.icon-button[aria-pressed="true"]{color:var(--blood-bright);border-color:rgba(240,24,50,.5)}
.follow-mini { padding:11px 18px; border:1px solid rgba(255,255,255,.24); font-size:11px; font-weight:800; letter-spacing:.13em; text-transform:uppercase; transition:.25s; }
.follow-mini:hover { background:white;color:black; }

/* Common */
main { position:relative; z-index:2; }
section { position:relative; overflow:hidden; }
.reveal { opacity:0; transform:translateY(42px); transition:opacity .9s ease, transform .9s cubic-bezier(.2,.8,.2,1); }
.reveal.in { opacity:1; transform:none; }
.kicker,.eyebrow { margin:0 0 18px; color:var(--blood-bright); font-size:11px; font-weight:800; letter-spacing:.23em; text-transform:uppercase; }
.kicker:before { content:""; display:inline-block; width:27px; height:1px; background:currentColor; margin:0 10px 3px 0; }
h1,h2,h3,p { margin-top:0; }
h1,h2 { line-height:.93; text-transform:uppercase; letter-spacing:-.045em; }
h2 { margin:0; font-size:clamp(44px,6vw,96px); font-weight:800; }
h1 em,h2 em { color:transparent; -webkit-text-stroke:1px rgba(255,255,255,.75); font-family:Creepster, cursive; font-style:normal; letter-spacing:.015em; text-shadow:0 0 25px rgba(177,0,24,.22); }
.section-number { position:absolute; left:clamp(20px,4.5vw,78px); top:42px; color:#555; font-size:10px; letter-spacing:.18em; }
.section-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:40px; max-width:1400px; margin:0 auto 58px; }
.section-heading>p { max-width:330px; margin:0 0 4px; color:#888; line-height:1.75; font-size:14px; }

/* Hero */
.hero { min-height:100svh; display:flex; align-items:center; padding:calc(var(--header-h) + 70px) clamp(20px,7vw,120px) 80px; background:
  linear-gradient(90deg,rgba(0,0,0,.98) 0%,rgba(0,0,0,.72) 40%,rgba(0,0,0,.15) 72%,rgba(0,0,0,.7) 100%),
  radial-gradient(ellipse at 76% 45%, rgba(127,0,18,.23), transparent 40%), #080808;
}
.hero:after { content:"";position:absolute;inset:auto 0 0;height:200px;background:linear-gradient(transparent,var(--black));z-index:5;pointer-events:none; }
.hero-content { position:relative; z-index:8; max-width:860px; }
.eyebrow span { display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--blood-bright);box-shadow:0 0 12px var(--blood-bright);margin-right:10px;animation:pulse 1.4s infinite; }
@keyframes pulse{50%{opacity:.2}}
.hero h1 { margin:0 0 28px; font-size:clamp(64px,9.4vw,152px); font-weight:800; }
.hero h1 span,.hero h1 em { display:block; }
.hero-copy { max-width:560px; color:#aaa; font-size:clamp(15px,1.5vw,20px); line-height:1.7; }
.hero-actions { display:flex; align-items:center; gap:28px; margin-top:38px; }
.primary-button { position:relative; display:inline-flex; padding:18px 25px; overflow:hidden; background:var(--blood); border:1px solid var(--blood-bright); font-size:12px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.primary-button:before { content:"";position:absolute;inset:0;background:white;transform:translateX(-103%);transition:.35s; }.primary-button:hover:before{transform:none}.primary-button span{position:relative;z-index:1}.primary-button:hover{color:#000}
.text-link { color:#aaa; font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }.text-link span{color:var(--blood-bright)}.text-link:hover{color:white}
.scroll-warning { display:flex;align-items:center;gap:10px;margin:48px 0 0;color:#666;font-size:10px;letter-spacing:.12em;text-transform:uppercase; }
.mouse { width:18px;height:29px;border:1px solid #555;border-radius:12px;position:relative; }.mouse:after{content:"";position:absolute;left:50%;top:6px;width:2px;height:6px;background:#888;animation:scrollDot 1.5s infinite}@keyframes scrollDot{to{transform:translateY(9px);opacity:0}}
.corridor { position:absolute; z-index:2; right:0; top:0; width:59%; height:100%; perspective:1000px; overflow:hidden; }
.corridor:before,.corridor:after { content:"";position:absolute;top:0;bottom:0;width:45%;background:linear-gradient(90deg,#050505,#161313); }.corridor:before{left:0;clip-path:polygon(0 0,100% 24%,100% 76%,0 100%)}.corridor:after{right:0;transform:scaleX(-1);clip-path:polygon(0 0,100% 24%,100% 76%,0 100%)}
.corridor-door { position:absolute; left:50%; top:23%; width:25%; height:54%; transform:translateX(-50%); background:#030303; border:5px solid #1c1717; box-shadow:0 0 90px rgba(130,0,16,.22),inset 0 0 50px black; }
.door-gap { position:absolute;inset:0;background:linear-gradient(90deg,#010101 47%,rgba(180,0,20,.25) 50%,#010101 53%);animation:doorBreath 4s infinite}@keyframes doorBreath{50%{filter:brightness(2)}}
.corridor-figure { position:absolute; left:50%; top:39%; width:9%; height:35%; transform:translateX(-50%); background:#010101; border-radius:50% 50% 20% 20%; filter:drop-shadow(0 0 12px black); opacity:.86; }
.corridor-figure:before{content:"";position:absolute;left:16%;top:-17%;width:68%;aspect-ratio:1;border-radius:50%;background:#000}.corridor-figure:after{content:"";position:absolute;left:22%;top:-2%;width:12%;height:5%;border-radius:50%;background:#fff;box-shadow:33px 0 0 #fff,0 0 12px #fff,33px 0 12px #fff;opacity:calc(.2 + (var(--fear) / 160))}
.hanging-light { position:absolute; z-index:5; right:27.5%; top:-5px; width:2px; height:21%; background:#222; }
.hanging-light span{position:absolute;left:50%;bottom:-20px;width:70px;height:35px;transform:translateX(-50%);border-radius:50% 50% 15% 15%;background:#191919;box-shadow:0 25px 70px rgba(255,236,195,.22)}
.hero-fog { position:absolute; z-index:4; width:70%; height:25%; border-radius:50%; background:rgba(220,220,220,.06); filter:blur(35px); animation:fogMove 12s linear infinite; }.fog-a{left:30%;bottom:5%}.fog-b{left:55%;bottom:20%;animation-delay:-7s}@keyframes fogMove{50%{transform:translateX(-20%) scale(1.2);opacity:.7}}
.hero-scratches { position:absolute; right:4vw; bottom:9vh; z-index:7; color:rgba(255,255,255,.07); font:38px/1 Creepster,cursive; text-align:right; transform:rotate(-5deg); }

/* Threshold */
.threshold { min-height:78vh; padding:150px clamp(20px,7vw,120px); background:linear-gradient(180deg,#030303,#090707 52%,#030303); display:flex; align-items:center; }
.threshold-grid { width:100%; max-width:1400px; margin:auto; display:grid; grid-template-columns:1.4fr .7fr; gap:12vw; align-items:end; }
.threshold-copy h2 em { display:inline-block; margin-top:8px; }
.threshold-note { border-left:1px solid var(--line); padding-left:30px; color:#999; font-size:16px; line-height:1.75; }
.threshold-note .scribble { margin:35px 0 0; color:rgba(255,255,255,.62); font:25px/1.25 Creepster,cursive; transform:rotate(-2deg); }
.shadow-crawl { position:absolute;right:-14%;bottom:-3%;width:55%;height:50%;opacity:calc((var(--fear) - 15)/80);filter:blur(4px);transform:rotate(-8deg); }
.shadow-crawl span{position:absolute;right:0;bottom:0;width:60%;height:40%;border-radius:80% 0 0;background:#000;box-shadow:-60px -25px 70px #000}.shadow-crawl:before,.shadow-crawl:after{content:"";position:absolute;bottom:16%;right:36%;width:8%;height:65%;background:#000;border-radius:90%;transform:rotate(62deg);transform-origin:bottom}.shadow-crawl:after{right:48%;height:75%;transform:rotate(76deg)}

/* Reels */
.reels-section { padding:140px clamp(20px,5.5vw,95px) 160px; background:#050505; }
.reel-grid { max-width:1400px; margin:auto; display:grid; grid-template-columns:repeat(12,1fr); gap:18px; }
.reel-card { position:relative; grid-column:span 4; min-height:500px; overflow:hidden; background:#111; border:1px solid rgba(255,255,255,.09); cursor:pointer; isolation:isolate; transition:transform .4s ease,border-color .4s ease; }
.reel-card:nth-child(1),.reel-card:nth-child(5){grid-column:span 5}.reel-card:nth-child(2),.reel-card:nth-child(6){grid-column:span 3}.reel-card:nth-child(3),.reel-card:nth-child(4){grid-column:span 4}
.reel-card:hover{transform:translateY(-8px);border-color:rgba(240,24,50,.55)}
.reel-card:after{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(180deg,transparent 38%,rgba(0,0,0,.3) 57%,#050505 100%)}
.reel-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s ease,filter .8s ease;filter:saturate(.65) contrast(1.12)}.reel-card:hover img{transform:scale(1.055);filter:saturate(.95) contrast(1.12)}
.reel-card-top { position:absolute;z-index:4;left:18px;right:18px;top:18px;display:flex;justify-content:space-between;align-items:center; }
.case-id,.reel-tag { font-size:9px;font-weight:800;letter-spacing:.17em;text-transform:uppercase; }.case-id{color:rgba(255,255,255,.6)}.reel-tag{padding:7px 9px;background:rgba(0,0,0,.62);border:1px solid rgba(255,255,255,.14);backdrop-filter:blur(5px)}
.play-button { position:absolute;z-index:4;left:50%;top:45%;width:62px;height:62px;border:1px solid rgba(255,255,255,.7);border-radius:50%;transform:translate(-50%,-50%);display:grid;place-items:center;background:rgba(0,0,0,.27);backdrop-filter:blur(5px);transition:.3s; }.play-button:before{content:"";border-left:14px solid white;border-top:9px solid transparent;border-bottom:9px solid transparent;margin-left:4px}.reel-card:hover .play-button{background:var(--blood);border-color:var(--blood-bright);box-shadow:0 0 35px rgba(177,0,24,.55);transform:translate(-50%,-50%) scale(1.08)}
.reel-info { position:absolute;z-index:4;left:22px;right:22px;bottom:22px; }.reel-info h3{margin:0 0 8px;font-size:clamp(21px,2vw,32px);line-height:1.05;text-transform:uppercase;letter-spacing:-.025em}.reel-info p{margin:0;color:#999;font-size:12px;line-height:1.5}
.reel-card:before{content:"";position:absolute;z-index:5;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 45%,rgba(255,255,255,.18) 50%,transparent 55%);transform:translateX(-120%);transition:.7s}.reel-card:hover:before{transform:translateX(120%)}
.reels-footer { max-width:1400px;margin:52px auto 0;text-align:center}.outline-button{display:inline-flex;gap:12px;padding:17px 24px;border:1px solid rgba(255,255,255,.22);color:#bbb;font-size:11px;font-weight:700;letter-spacing:.11em;text-transform:uppercase;transition:.3s}.outline-button:hover{color:white;border-color:white;background:rgba(255,255,255,.04)}.outline-button span{color:var(--blood-bright)}

/* Hallway */
.hallway { height:92vh; min-height:680px; background:#000; display:grid; place-items:center; perspective:900px; }
.hallway-depth { position:absolute;inset:0;overflow:hidden;background:radial-gradient(ellipse at 50% 54%,rgba(120,0,16,.18),transparent 20%),#000; }
.hall-wall{position:absolute;top:0;bottom:0;width:55%;background:linear-gradient(90deg,#050505,#151212)}.wall-left{left:0;clip-path:polygon(0 0,100% 35%,100% 65%,0 100%)}.wall-right{right:0;transform:scaleX(-1);clip-path:polygon(0 0,100% 35%,100% 65%,0 100%)}
.hall-door{position:absolute;left:43%;top:31%;width:14%;height:38%;border:4px solid #211919;background:#020202;box-shadow:0 0 80px rgba(150,0,20,.18)}
.hall-figure{position:absolute;left:48%;top:43%;width:4%;height:25%;background:#000;border-radius:50% 50% 10% 10%;animation:figureSway 5s ease-in-out infinite}@keyframes figureSway{50%{transform:translateX(8px) rotate(1deg)}}
.hall-figure:before{content:"";position:absolute;left:10%;top:-18%;width:80%;aspect-ratio:1;border-radius:50%;background:#000}.hall-figure:after{content:"";position:absolute;left:19%;top:-7%;width:9%;height:4%;background:white;box-shadow:18px 0 white,0 0 8px white,18px 0 8px white;opacity:calc((var(--fear) - 45)/30)}
.hallway-message{position:relative;z-index:5;text-align:center}.hallway-message p{color:var(--blood-bright);font:clamp(24px,3vw,48px) Creepster,cursive;letter-spacing:.06em}.hallway-message h2{font-size:clamp(42px,6vw,88px)}
.eye{position:absolute;z-index:4;width:15px;height:7px;border-radius:50%;background:white;box-shadow:0 0 10px white;opacity:calc((var(--fear) - 48)/40)}.eye-one{left:12%;top:44%}.eye-two{right:17%;top:59%}

/* Entities */
.entities { padding:150px clamp(20px,5.5vw,95px) 170px; background:linear-gradient(180deg,#030303,#0a0707 50%,#030303); }
.entity-grid { max-width:1400px;margin:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:18px; }
.entity-card { position:relative;min-height:570px;border:1px solid rgba(255,255,255,.09);overflow:hidden;background:#0a0a0a;transition:.4s; }.entity-card:hover{transform:translateY(-7px);border-color:rgba(240,24,50,.45)}
.entity-card:before{content:attr(data-entity);position:absolute;left:-4px;top:12%;font-size:clamp(60px,7vw,112px);font-weight:900;letter-spacing:-.07em;color:rgba(255,255,255,.025);writing-mode:vertical-rl;z-index:1}
.entity-index{position:absolute;z-index:5;right:18px;top:18px;color:#555;font-size:10px;letter-spacing:.16em}
.entity-portrait{position:absolute;inset:0 0 120px;overflow:hidden;background:radial-gradient(circle at 50% 44%,#24191a,transparent 30%),linear-gradient(#0b0b0b,#141010)}.entity-portrait:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 45%,#0a0a0a)}
.entity-portrait span{position:absolute;left:23%;bottom:0;width:54%;height:75%;background:#020202;border-radius:45% 45% 8% 8%;filter:drop-shadow(0 0 24px black)}.entity-portrait span:before{content:"";position:absolute;left:23%;top:-21%;width:54%;aspect-ratio:.82;border-radius:47% 47% 44% 44%;background:linear-gradient(90deg,#050505,#222 45%,#050505)}.entity-portrait span:after{content:"";position:absolute;left:31%;top:-8%;width:8%;height:2.5%;background:white;border-radius:50%;box-shadow:38px 0 white,0 0 8px white,38px 0 8px white;opacity:.65}
.portrait-teenu span{transform:scale(.94) translateY(10px)}.portrait-chintu span{transform:scale(1.07) translateY(18px)}
.entity-copy{position:absolute;z-index:4;left:24px;right:24px;bottom:24px}.entity-copy h3{font-size:31px;text-transform:uppercase;letter-spacing:.02em;margin-bottom:8px}.entity-copy p{margin:0;color:#777;font-size:13px;line-height:1.6}

/* Manifesto and CTA */
.manifesto { min-height:85vh;display:grid;place-items:center;padding:120px 24px;background:radial-gradient(circle at 50% 50%,#16070a,#020202 66%); }
.manifesto-inner{position:relative;z-index:4;text-align:center}.manifesto blockquote{margin:0;font:clamp(39px,6vw,92px)/1.05 Creepster,cursive;text-transform:uppercase;letter-spacing:.025em;text-shadow:0 0 30px rgba(177,0,24,.25)}
.manifesto-meta{display:flex;justify-content:center;flex-wrap:wrap;gap:13px 28px;margin-top:42px;color:#777;font-size:10px;letter-spacing:.18em}.manifesto-meta span:before{content:"✦";color:var(--blood);margin-right:28px}.manifesto-meta span:first-child:before{display:none}
.handprint{position:absolute;width:240px;height:330px;opacity:.12;background:radial-gradient(ellipse at 50% 62%,var(--blood) 0 24%,transparent 25%),radial-gradient(ellipse at 15% 16%,var(--blood) 0 8%,transparent 9%),radial-gradient(ellipse at 36% 7%,var(--blood) 0 9%,transparent 10%),radial-gradient(ellipse at 58% 4%,var(--blood) 0 9%,transparent 10%),radial-gradient(ellipse at 79% 11%,var(--blood) 0 8%,transparent 9%),radial-gradient(ellipse at 94% 26%,var(--blood) 0 7%,transparent 8%);filter:blur(2px)}.handprint-one{left:4%;top:9%;transform:rotate(-20deg)}.handprint-two{right:3%;bottom:3%;transform:rotate(160deg)}
.final-cta { min-height:100vh;display:flex;align-items:center;justify-content:center;padding:120px 25px;background:#020202;text-align:center; }
.final-static{position:absolute;opacity:calc((var(--fear) - 75)/300);z-index:1}
.final-face{position:absolute;z-index:2;width:min(85vw,860px);aspect-ratio:1;opacity:calc((var(--fear) - 74)/38);filter:blur(1px);transform:scale(calc(.7 + var(--fear)/400))}.final-face span{position:absolute;inset:10%;border-radius:49% 49% 38% 38%;background:radial-gradient(ellipse at 34% 43%,#fff 0 1.2%,#000 1.5% 7%,transparent 7.5%),radial-gradient(ellipse at 66% 43%,#fff 0 1.2%,#000 1.5% 7%,transparent 7.5%),radial-gradient(ellipse at 50% 68%,#000 0 12%,transparent 12.5%),radial-gradient(ellipse,#777,#090909 67%);opacity:.25;filter:contrast(1.7)}
.final-copy{position:relative;z-index:5}.final-copy h2{font-size:clamp(59px,9vw,140px)}.final-copy p:not(.kicker){max-width:560px;margin:28px auto;color:#888;line-height:1.7}
.instagram-button{display:inline-flex;align-items:center;gap:12px;padding:18px 25px;margin-top:8px;background:var(--blood);border:1px solid var(--blood-bright);font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;box-shadow:0 0 30px rgba(177,0,24,.25);transition:.3s}.instagram-button svg{width:20px;fill:currentColor}.instagram-button:hover{transform:translateY(-4px);box-shadow:0 12px 45px rgba(177,0,24,.48)}

/* Footer and meter */
.site-footer{position:relative;z-index:4;min-height:150px;padding:42px clamp(20px,4.5vw,78px);display:flex;align-items:center;justify-content:space-between;gap:25px;border-top:1px solid rgba(255,255,255,.09);background:#020202;color:#666;font-size:11px}.footer-brand{min-width:auto}.site-footer>div{display:flex;gap:25px}.site-footer a:hover{color:white}
.fear-meter{position:fixed;z-index:90;left:22px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;gap:10px;pointer-events:none}.fear-label{font-size:8px;letter-spacing:.17em;color:#666;writing-mode:vertical-rl;transform:rotate(180deg)}.fear-track{width:2px;height:115px;background:#2a2a2a;display:flex;align-items:flex-end}.fear-fill{display:block;width:100%;height:0;background:linear-gradient(var(--blood-bright),var(--blood));box-shadow:0 0 9px var(--blood);transition:height .12s}.fear-number{font:17px Creepster,cursive;color:var(--blood-bright)}

/* Dialog */
.reel-dialog { width:min(920px,94vw);height:min(88vh,900px);padding:0;border:1px solid rgba(255,255,255,.2);background:#080808;color:white;box-shadow:0 0 100px rgba(0,0,0,.9);overflow:hidden; }
.reel-dialog::backdrop{background:rgba(0,0,0,.9);backdrop-filter:blur(10px)}
.dialog-close{position:absolute;z-index:9;right:12px;top:10px;width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,.2);background:rgba(0,0,0,.76);color:white;font-size:26px;cursor:pointer}.dialog-content{height:calc(100% - 58px);display:grid;place-items:center;padding:18px;overflow:auto}.dialog-content iframe{width:min(500px,100%);height:100%;min-height:680px;border:0;background:white}.dialog-fallback{height:58px;display:flex;align-items:center;justify-content:center;gap:16px;border-top:1px solid var(--line);font-size:11px;color:#777}.dialog-fallback p{margin:0}.dialog-fallback a{color:white;font-weight:700}
.jumpscare{position:fixed;inset:0;z-index:9000;display:grid;place-items:center;background:#000;opacity:0;visibility:hidden;pointer-events:none}.jumpscare.show{visibility:visible;animation:jump .75s ease}.jumpscare-face{position:absolute;width:min(110vw,950px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 38%,white 0 1%,black 2% 8%,transparent 9%),radial-gradient(circle at 65% 38%,white 0 1%,black 2% 8%,transparent 9%),radial-gradient(ellipse at 50% 68%,black 0 15%,transparent 16%),radial-gradient(circle,#c8c5bb,#050505 68%);filter:contrast(2)}.jumpscare p{position:relative;z-index:2;font:clamp(40px,8vw,110px) Creepster,cursive;color:var(--blood-bright)}@keyframes jump{0%{opacity:0}8%{opacity:1;transform:scale(.7)}18%{transform:scale(1.1) translateX(10px)}28%{transform:scale(1.25) translateX(-8px)}56%{opacity:1}100%{opacity:0;transform:scale(1.7)}}

/* Mobile */
@media (max-width: 900px) {
  :root{--header-h:72px}.desktop-nav{display:none}.header-actions{min-width:auto}.brand{min-width:auto}.brand-copy small{display:none}.fear-meter{left:8px}.flashlight{display:none}
  .hero{padding-left:28px;padding-right:28px}.hero h1{font-size:clamp(62px,15vw,112px)}.corridor{width:100%;opacity:.56}.hero-content{max-width:690px}.hero-copy{max-width:500px}.hero-scratches{display:none}
  .threshold-grid{grid-template-columns:1fr;gap:50px}.threshold-note{max-width:500px}
  .section-heading{align-items:flex-start;flex-direction:column}.section-heading>p{max-width:540px}
  .reel-card,.reel-card:nth-child(n){grid-column:span 6;min-height:470px}
  .entity-grid{grid-template-columns:1fr}.entity-card{min-height:520px}.entity-portrait span{left:34%;width:32%}
  .site-footer{flex-direction:column;text-align:center}.site-footer>div{justify-content:center}
}
@media (max-width: 600px) {
  .site-header{padding:0 16px}.brand-mark{width:34px}.brand-copy strong{font-size:11px}.icon-button{display:none}.follow-mini{padding:9px 12px}
  .intro-whisper{font-size:18px}.intro-ghost{width:110vw}.enter-site{bottom:12vh;min-width:230px;padding:16px}.ghost-eye-right{right:29%}.ghost-eye-left{left:29%}
  .hero{min-height:100svh;padding:115px 22px 75px}.hero h1{font-size:clamp(55px,17.5vw,94px)}.hero-copy{font-size:14px}.hero-actions{align-items:flex-start;flex-direction:column;gap:18px}.scroll-warning{margin-top:32px}
  h2{font-size:clamp(43px,13vw,69px)}.threshold,.reels-section,.entities{padding-left:22px;padding-right:22px}.threshold{padding-top:120px;padding-bottom:110px}.section-number{left:22px}
  .reel-grid{display:block}.reel-card{min-height:520px;margin-bottom:17px}.reel-card:nth-child(even){min-height:460px}
  .hallway{min-height:620px}.hallway-message{padding:0 22px}.hall-door{left:38%;width:24%}.hall-figure{left:47%;width:7%}
  .entity-portrait span{left:24%;width:52%}.manifesto{min-height:75vh}.manifesto-meta{gap:10px 18px}.manifesto-meta span:before{margin-right:18px}.final-copy h2{font-size:clamp(56px,17vw,95px)}
  .dialog-content{padding:8px}.dialog-content iframe{min-height:610px}.dialog-fallback p{display:none}.fear-meter{display:none}
}
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}.intro-ghost{transform:translate(-50%,-50%) scale(1);opacity:1}.enter-site{opacity:1;transform:none}
}

/* =========================================================
   V3 — V1 visual direction, rebuilt for smooth rendering
   ========================================================= */

/* Video intro: the supplied film replaces the generated CSS ghost. */
.intro {
  transition: opacity .22s ease, visibility .22s linear;
  contain: strict;
}
.intro.done { opacity: 0; visibility: hidden; }
.intro-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  background: #000;
  transform: translateZ(0);
}
.intro-vignette {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background: radial-gradient(circle at 50% 46%, transparent 0 38%, rgba(0,0,0,.18) 64%, #000 112%);
}
.intro-flash {
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  opacity: 0;
  background: rgba(255,255,255,.12);
}
.intro.ending .intro-flash { animation: introFlash .2s steps(2) both; }
@keyframes introFlash { 40% { opacity: .18; } 100% { opacity: 0; } }
.play-intro {
  position: absolute;
  z-index: 10;
  left: 50%;
  bottom: 11vh;
  transform: translateX(-50%);
  min-width: 220px;
  padding: 16px 24px;
  border: 1px solid rgba(255,255,255,.48);
  color: white;
  background: rgba(0,0,0,.78);
  font-weight: 800;
  letter-spacing: .16em;
  text-transform: uppercase;
  cursor: pointer;
}

/* The exact V1 typography returns automatically after the intro ends. */
.hero-word,
.hero-line {
  opacity: 0;
  will-change: transform, opacity;
}
.hero-word {
  display: block;
  transform: translate3d(0,48px,0) skewY(4deg) scaleY(.88);
  clip-path: inset(0 0 100% 0);
}
.hero-line { transform: translate3d(0,22px,0); }
body.site-ready .hero-word { animation: v1TitleReveal .78s cubic-bezier(.16,.82,.2,1) forwards; }
body.site-ready .hero-word-one { animation-delay: .04s; }
body.site-ready .hero-word-two { animation-delay: .23s; }
body.site-ready .hero-word-three { animation-delay: .42s; }
body.site-ready .hero-line { animation: v1LineReveal .58s ease forwards; }
body.site-ready .eyebrow { animation-delay: .03s; }
body.site-ready .hero-copy { animation-delay: .67s; }
body.site-ready .hero-actions { animation-delay: .83s; }
body.site-ready .scroll-warning { animation-delay: 1s; }
@keyframes v1TitleReveal {
  70% { opacity: 1; clip-path: inset(0); transform: translate3d(0,-3px,0) skewY(-.8deg) scaleY(1.03); }
  100% { opacity: 1; clip-path: inset(0); transform: none; }
}
@keyframes v1LineReveal { to { opacity: 1; transform: none; } }

/* Static tiled texture keeps V1's gritty film surface without regenerating
   SVG turbulence several times every second. Only opacity flickers. */
.noise-layer,
.final-static {
  inset: 0;
  width: 100%;
  height: 100%;
  background-image: url("assets/textures/noise.webp");
  background-repeat: repeat;
  background-size: 192px 192px;
  opacity: .038;
  animation: noisePulse 3.2s steps(2,end) infinite;
  transform: translateZ(0);
}
@keyframes noisePulse { 50% { opacity: .06; } }

/* A smaller movable light plus a large outside shadow keeps the V1 cursor
   effect while avoiding a full-viewport gradient repaint on every event. */
.flashlight {
  inset: auto;
  left: 0;
  top: 0;
  width: 350px;
  height: 350px;
  margin: -175px 0 0 -175px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(0,0,0,0) 0 33%, rgba(0,0,0,.08) 58%, rgba(0,0,0,.31) 100%);
  box-shadow: 0 0 0 180vmax rgba(0,0,0,.46);
  opacity: 0;
  transform: translate3d(50vw,50vh,0);
  transition: opacity .45s ease;
  mix-blend-mode: multiply;
  will-change: transform, opacity;
}
body.fear-dark .flashlight { opacity: .62; }

/* Same blood drips, but only transform/opacity are animated. */
.blood-drip {
  top: -130px;
  height: 120px;
  transform: translate3d(0,-150px,0) scaleY(.03);
  transform-origin: top;
  opacity: 0;
  animation: dripSmooth 12s cubic-bezier(.45,0,.55,1) infinite;
  will-change: transform, opacity;
}
body.fear-deep .blood-drip { opacity: .72; }
@keyframes dripSmooth {
  0%,22% { transform: translate3d(0,-150px,0) scaleY(.03); }
  35%,48% { transform: translate3d(0,120px,0) scaleY(1); }
  58% { transform: translate3d(0,72vh,0) scaleY(.18); }
  78%,100% { transform: translate3d(0,112vh,0) scaleY(.03); }
}

/* V1 fog and figures remain, with compositor-only movement. */
.hero-fog {
  filter: none;
  background: radial-gradient(ellipse, rgba(220,220,220,.085) 0, rgba(220,220,220,.035) 46%, transparent 72%);
  animation: fogGlide 13s ease-in-out infinite;
  will-change: transform, opacity;
}
@keyframes fogGlide { 50% { transform: translate3d(-18%,0,0) scale(1.16); opacity: .68; } }
.door-gap { animation: doorGlow 4s ease-in-out infinite; }
@keyframes doorGlow { 50% { opacity: .66; } }

/* Avoid expensive live backdrop blur while preserving the dark glass look. */
.site-header.scrolled { background: rgba(3,3,3,.94); backdrop-filter: none; }

/* Scroll-triggered fear elements transition between coarse progress stages,
   instead of repainting for every pixel of scrolling. */
.shadow-crawl,
.eye,
.final-static,
.final-face,
.corridor-figure::after,
.hall-figure::after {
  transition: opacity .6s ease, transform .8s ease;
}

/* The fear meter is now a transform animation rather than changing height. */
.fear-track { overflow: hidden; }
.fear-fill {
  height: 100%;
  transform: scaleY(0);
  transform-origin: bottom;
  transition: none;
  will-change: transform;
}

/* Skip below-the-fold paint work until a section approaches the viewport. */
.threshold,
.reels-section,
.hallway,
.entities,
.manifesto,
.final-cta {
  content-visibility: auto;
  contain-intrinsic-size: 900px;
}
.reel-card img { backface-visibility: hidden; }

/* Low-resource devices keep the full V1 design but drop only continuously
   moving atmosphere. Static horror artwork and all reveal/scare moments stay. */
body.lite-mode .flashlight { display: none; }
body.lite-mode .noise-layer { animation: none; opacity: .035; }
body.lite-mode .hero-fog { animation: none; }
body.lite-mode .blood-drip { animation-duration: 18s; }

@media (hover: none), (pointer: coarse), (max-width: 900px) {
  .flashlight { display: none; }
  .noise-layer { animation-duration: 5s; opacity: .032; }
  .hero-fog { animation-duration: 18s; }
  .blood-drip { animation-duration: 15s; }
}

@media (max-width: 600px) {
  .intro-video { object-position: center center; }
  .skip-intro { right: 14px; top: max(14px, env(safe-area-inset-top)); }
}

@media (prefers-reduced-motion: reduce) {
  .intro-video { display: none; }
  .hero-word,.hero-line { opacity: 1; transform: none; clip-path: none; }
  .noise-layer,.hero-fog,.blood-drip { animation: none !important; }
}

.reels-empty{grid-column:1/-1;margin:0;padding:42px 20px;border:1px dashed rgba(255,255,255,.16);color:#aaa09b;text-align:center}