/* ═══════════════════════════════════════════════════════════
   VOODOO · готика-страшилка · voodooo.mooo.com
   Кости, запёкшаяся кровь, ядовитый свет и вечный цикл.
   ═══════════════════════════════════════════════════════════ */
:root{
  --ink:#050409; --ink-2:#0a0712; --ink-3:#120b18;
  --bone:#e8dfcd; --bone-dim:#9a8fa6;
  --gold:#e9c07a; --bronze:#8a5a2a;
  --blood:#c33a4b; --blood-hot:#ff2d3f; --blood-deep:#3a0d1c;
  --toxic:#5fd6c0; --plum:#4a1a5e;
  --line:rgba(232,223,205,.1);
  --ff-display:"Cinzel Decorative",Georgia,serif;
  --ff-goth:"Cormorant Gothic","Cormorant SC",Georgia,serif;
  --ff-body:"Manrope",system-ui,sans-serif;
  --ff-mono:"JetBrains Mono",ui-monospace,monospace;
  --loop:48s;
  --ease-soft:cubic-bezier(.22,.61,.36,1);
  --pad:clamp(18px,5vw,84px);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--ink);color:var(--bone);font-family:var(--ff-body);font-weight:300;line-height:1.65;
  overflow-x:hidden;
  background-image:
    radial-gradient(120% 80% at 50% -12%,rgba(58,13,28,.75),transparent 60%),
    radial-gradient(90% 60% at 88% 112%,rgba(74,26,94,.4),transparent 66%),
    linear-gradient(180deg,var(--ink-2),var(--ink) 42%,#0b0713);
  background-attachment:fixed;
}
::selection{background:var(--blood-hot);color:#fff}
h1,h2,h3{margin:0;font-weight:700;line-height:1.05}
p{margin:0} a{color:inherit;text-decoration:none}
ul,ol{margin:0;padding:0;list-style:none}
.mono{font-family:var(--ff-mono);font-variant-numeric:tabular-nums}
:focus-visible{outline:2px solid var(--blood-hot);outline-offset:3px;border-radius:4px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}

/* ── завеса-крышка ───────────────────────────────────────── */
.veil{position:fixed;inset:0;z-index:95;display:grid;place-items:center;pointer-events:none}
.veil__half{position:absolute;top:0;height:100%;width:51%;
  background:linear-gradient(90deg,#0a0710,#020104);
  box-shadow:inset 0 0 120px rgba(0,0,0,.9);transition:transform 1.4s cubic-bezier(.76,0,.24,1)}
.veil__half--l{left:0}.veil__half--r{right:0}
.veil__mark{display:grid;place-items:center;gap:16px;color:var(--blood);z-index:2;transition:opacity .5s ease .4s}
.veil__mark em{font-family:var(--ff-goth);font-size:13px;letter-spacing:.4em;text-transform:uppercase;font-style:normal;opacity:.85}
.veil__eye{display:flex;gap:10px}
.veil__eye i{width:22px;height:13px;border-radius:50%;border:1px solid rgba(255,45,63,.5);background:radial-gradient(circle at 50% 50%,#ff2d3f 0 22%,#3a0d1c 60%,#050409);
  animation:watchBlink 3.4s infinite}
@keyframes watchBlink{0%,42%,100%{transform:scaleY(1)}47%{transform:scaleY(.08)}52%{transform:scaleY(1)}}
.is-veiled .veil__half--l{transform:translateX(-101%)}
.is-veiled .veil__half--r{transform:translateX(101%)}
.is-veiled .veil__mark{opacity:0}
.veil.is-done{display:none}

/* ── зерно / виньетка / дым ──────────────────────────────── */
.grain{position:fixed;inset:-120%;z-index:62;pointer-events:none;opacity:.075;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grainShift .9s steps(3) infinite}
@keyframes grainShift{0%{transform:translate(0,0)}25%{transform:translate(-2%,1%)}50%{transform:translate(1%,-2%)}75%{transform:translate(-1%,-1%)}100%{transform:translate(0,0)}}
.vignette{position:fixed;inset:0;z-index:61;pointer-events:none;
  background:radial-gradient(115% 85% at 50% 45%,transparent 42%,rgba(2,1,5,.72) 82%,#020104 100%);
  animation:vigBreathe calc(var(--loop)/2) ease-in-out infinite}
@keyframes vigBreathe{0%,100%{opacity:.9}50%{opacity:.62}}
.smoke{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.smoke__puff{position:absolute;border-radius:50%;filter:blur(72px);mix-blend-mode:screen}
.smoke__puff--1{width:54vw;height:54vw;left:-14vw;top:6vh;background:radial-gradient(circle,rgba(58,13,28,.85),transparent 68%);animation:drift1 34s var(--ease-soft) infinite}
.smoke__puff--2{width:46vw;height:46vw;right:-12vw;top:24vh;background:radial-gradient(circle,rgba(74,26,94,.55),transparent 68%);animation:drift2 46s var(--ease-soft) infinite}
.smoke__puff--3{width:40vw;height:40vw;left:26vw;bottom:-16vh;background:radial-gradient(circle,rgba(20,10,30,.9),transparent 66%);animation:drift3 40s var(--ease-soft) infinite}
.smoke__puff--4{width:26vw;height:26vw;left:52vw;top:48vh;background:radial-gradient(circle,rgba(95,214,192,.12),transparent 64%);animation:drift1 58s var(--ease-soft) infinite reverse}
@keyframes drift1{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(9vw,-6vh) scale(1.18)}66%{transform:translate(-4vw,7vh) scale(.9)}}
@keyframes drift2{0%,100%{transform:translate(0,0) scale(1.05)}50%{transform:translate(-11vw,9vh) scale(.85)}}
@keyframes drift3{0%,100%{transform:translate(0,0) scale(.9)}40%{transform:translate(7vw,-9vh) scale(1.2)}70%{transform:translate(-6vw,-3vh) scale(1)}}
.motes{position:fixed;inset:0;z-index:1;pointer-events:none}

/* ── молнии вспышками ────────────────────────────────────── */
.lightning{position:fixed;inset:0;z-index:63;pointer-events:none;opacity:0;
  background:radial-gradient(80% 55% at 30% 0%,rgba(255,240,235,.5),transparent 60%),linear-gradient(180deg,rgba(232,223,205,.16),transparent 40%)}
.lightning.is-flash{animation:flash 1.1s steps(1) forwards}
@keyframes flash{0%{opacity:0}4%{opacity:.95}8%{opacity:.1}12%{opacity:.8}20%{opacity:0}100%{opacity:0}}

/* ── трещины на стекле ───────────────────────────────────── */
.cracks{position:fixed;inset:0;z-index:64;width:100%;height:100%;pointer-events:none;mix-blend-mode:screen}
.crack{fill:none;stroke:rgba(232,223,205,.55);stroke-width:1.1;stroke-linecap:round;
  stroke-dasharray:1;stroke-dashoffset:1;pathLength:1;
  filter:drop-shadow(0 0 4px rgba(255,45,63,.35));
  animation:crackGrow var(--loop) linear infinite;animation-delay:var(--dl)}
@keyframes crackGrow{
  0%{stroke-dashoffset:1;opacity:0}
  40%{stroke-dashoffset:1;opacity:0}
  52%{stroke-dashoffset:0;opacity:.85}
  62%{stroke-dashoffset:0;opacity:.6}
  78%{stroke-dashoffset:0;opacity:.35}
  88%{stroke-dashoffset:0;opacity:0}
  100%{stroke-dashoffset:1;opacity:0}}
.cracks__g{animation:crackShake var(--loop) steps(1) infinite}
@keyframes crackShake{0%,49%,100%{transform:translate(0,0)}50%{transform:translate(-3px,2px)}51.5%{transform:translate(4px,-2px)}53%{transform:translate(-2px,-3px)}54.5%{transform:translate(0,0)}}

/* ── глаза в темноте (их создаёт JS) ──────────────────────── */
.watchers{position:fixed;inset:0;z-index:2;pointer-events:none}
.watcher{position:absolute;width:var(--w);height:calc(var(--w)*.42);opacity:0;
  transition:opacity 1.6s ease;animation:watchFade var(--wd) linear infinite;animation-delay:var(--wdel)}
.watcher.is-on{opacity:1}
.watcher i{position:absolute;top:0;width:50%;height:100%;border-radius:50%/45%;
  background:radial-gradient(circle at 50% 50%,#ff2d3f 0 18%,#7a0f1c 45%,#1a0409 78%);
  box-shadow:0 0 18px rgba(255,45,63,.55),inset 0 0 8px rgba(0,0,0,.9);overflow:hidden}
.watcher i:nth-child(1){left:0}.watcher i:nth-child(2){right:0}
.watcher i::after{content:"";position:absolute;left:50%;top:50%;width:26%;height:52%;translate:-50% -50%;
  border-radius:50%;background:#050409;translate:calc(-50% + var(--ex,0px)) calc(-50% + var(--ey,0px));
  transition:translate .5s cubic-bezier(.2,.8,.2,1)}
@keyframes watchFade{0%,6%{opacity:0}12%,26%{opacity:.9}34%,100%{opacity:0}}

/* ── шапка ───────────────────────────────────────────────── */
.topbar{position:sticky;top:0;z-index:70;display:flex;align-items:center;gap:clamp(10px,2.6vw,34px);
  padding:12px var(--pad);backdrop-filter:blur(16px) saturate(1.1);
  background:linear-gradient(180deg,rgba(5,4,9,.94),rgba(5,4,9,.42));border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:11px;color:var(--blood);flex:0 0 auto}
.brand__mark{width:32px;height:32px;color:var(--bone)}
.brand__mark .pupil{fill:var(--blood-hot);animation:pupilPulse 3s ease-in-out infinite}
@keyframes pupilPulse{0%,100%{opacity:.55}50%{opacity:1}}
.spin-slow{transform-box:fill-box;transform-origin:center;animation:spin calc(var(--loop)/2) linear infinite}
.brand__txt{font-family:var(--ff-display);font-size:17px;color:var(--bone)}
.brand__txt i{font-style:normal;color:var(--bone-dim);font-size:12px;letter-spacing:.14em}
.nav{display:flex;gap:clamp(12px,2.4vw,30px);margin-left:auto;font-family:var(--ff-goth);font-size:13px;letter-spacing:.16em;text-transform:uppercase}
.nav a{position:relative;padding:6px 2px;color:var(--bone-dim);transition:color .3s,text-shadow .3s}
.nav a::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:1px;background:var(--blood-hot);transition:right .45s var(--ease-soft)}
.nav a:hover{color:var(--bone);text-shadow:0 0 14px rgba(255,45,63,.6)}.nav a:hover::after{right:0}
.topbar__right{display:flex;align-items:center;gap:10px}
.langs{display:flex;border:1px solid var(--line);border-radius:100px;overflow:hidden}
.langs button{background:transparent;border:0;color:var(--bone-dim);font-family:var(--ff-mono);font-size:10px;letter-spacing:.12em;
  padding:7px 9px;cursor:pointer;transition:.3s}
.langs button:hover{color:var(--bone)}
.langs button[aria-pressed="true"]{background:var(--blood-deep);color:#ffd9dd;box-shadow:inset 0 0 12px rgba(255,45,63,.4)}
.clock{font-size:12px;color:var(--toxic);letter-spacing:.06em;opacity:.8}
.icon-btn{display:flex;align-items:center;gap:8px;background:transparent;border:1px solid var(--line);color:var(--bone-dim);
  font-family:var(--ff-mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;padding:7px 12px;border-radius:100px;cursor:pointer;transition:.3s}
.icon-btn:hover{border-color:var(--blood);color:var(--bone)}
.icon-btn svg{width:16px;height:16px}
.icon-btn .wave1,.icon-btn .wave2{opacity:.25;transition:opacity .3s}
.icon-btn[aria-pressed="true"]{border-color:var(--blood);color:var(--blood-hot);box-shadow:0 0 22px -6px rgba(255,45,63,.7)}
.icon-btn[aria-pressed="true"] .wave1{opacity:1;animation:wavePulse 1.4s ease-in-out infinite}
.icon-btn[aria-pressed="true"] .wave2{opacity:.7;animation:wavePulse 1.4s ease-in-out .25s infinite}
@keyframes wavePulse{0%,100%{opacity:.2}50%{opacity:1}}
.motion-toggle__dot{width:7px;height:7px;border-radius:50%;background:var(--toxic);animation:ping 2s infinite}
@keyframes ping{0%{box-shadow:0 0 0 0 rgba(95,214,192,.5)}70%,100%{box-shadow:0 0 0 9px rgba(95,214,192,0)}}

/* ── HERO ────────────────────────────────────────────────── */
.hero{position:relative;z-index:3;display:grid;grid-template-columns:minmax(280px,46%) 1fr;align-items:center;
  gap:clamp(24px,5vw,70px);padding:clamp(30px,6vh,80px) var(--pad) clamp(40px,8vh,96px);min-height:min(96vh,880px)}
.hero__glow{position:absolute;left:8%;top:50%;width:560px;height:560px;translate:-50% -50%;pointer-events:none;
  background:radial-gradient(circle,rgba(255,45,63,.16),rgba(74,26,94,.14) 45%,transparent 66%);filter:blur(28px);
  animation:breathe var(--loop) ease-in-out infinite}
@keyframes breathe{0%,100%{opacity:.45;transform:scale(.88)}50%{opacity:1;transform:scale(1.14)}}

.sigil-wrap{position:relative;width:100%;max-width:520px;margin-inline:auto;aspect-ratio:1;transform-style:preserve-3d}
.sigil{width:100%;height:100%;overflow:visible;filter:drop-shadow(0 0 44px rgba(255,45,63,.22))}
.ring-ring{transform-box:view-box;transform-origin:200px 200px;animation:spin var(--loop) linear infinite}
.ring-glyphs{transform-box:view-box;transform-origin:200px 200px;animation:spin calc(var(--loop)*1.5) linear infinite reverse}
.snake{transform-box:view-box;transform-origin:200px 200px;will-change:transform}
.prog-dot{transform-box:view-box;transform-origin:200px 200px;will-change:transform}
@keyframes spin{to{transform:rotate(360deg)}}
.skull{animation:skullBob 7s ease-in-out infinite}
@keyframes skullBob{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-5px) rotate(-1.2deg)}}
.iris{animation:irisGlow 3.6s ease-in-out infinite}
@keyframes irisGlow{0%,100%{opacity:.7}50%{opacity:1}}
.veve-stars .star{transform-box:fill-box;transform-origin:center;animation:twinkle 3.4s ease-in-out infinite;animation-delay:var(--s);opacity:.5}
@keyframes twinkle{0%,100%{opacity:.12;transform:scale(.7) rotate(0)}50%{opacity:.95;transform:scale(1.3) rotate(90deg)}}
.flame{transform-box:fill-box;transform-origin:bottom center;animation:flicker 1.6s ease-in-out infinite;animation-delay:var(--f,0s)}
@keyframes flicker{0%,100%{transform:scale(1) translateY(0);opacity:.95}22%{transform:scale(.84,1.18) translateY(-1px);opacity:.6}
  48%{transform:scale(1.12,.88) translateY(1px);opacity:1}72%{transform:scale(.9,1.1) translateY(-2px);opacity:.72}}
.tongue{animation:dart 3.2s steps(1) infinite;animation-delay:.6s}
@keyframes dart{0%,88%{opacity:0}90%,94%{opacity:1}96%,100%{opacity:0}}
.veve .v{stroke-dasharray:1;stroke-dashoffset:1;animation:draw var(--loop) cubic-bezier(.5,0,.5,1) infinite;animation-delay:var(--d)}
@keyframes draw{0%{stroke-dashoffset:1;opacity:.2}22%{stroke-dashoffset:0;opacity:1}70%{stroke-dashoffset:0;opacity:1}
  84%{opacity:.1}100%{stroke-dashoffset:1;opacity:0}}
#corePulse{transform-box:fill-box;transform-origin:center;animation:pulseHeart calc(var(--loop)/12) ease-in-out infinite}
@keyframes pulseHeart{0%,100%{opacity:.3;transform:scale(.8)}45%{opacity:.95;transform:scale(1.12)}}

.sigil__phase{position:absolute;left:50%;bottom:-6px;translate:-50% 0;display:flex;align-items:baseline;gap:10px;
  padding:8px 18px;border:1px solid rgba(255,45,63,.25);border-radius:100px;background:rgba(5,4,9,.8);backdrop-filter:blur(6px);white-space:nowrap}
.sigil__phase-n{font-size:11px;color:var(--blood-hot);letter-spacing:.1em}
.sigil__phase-name{font-family:var(--ff-goth);font-size:16px;letter-spacing:.06em}
.sigil__phase.is-flip .sigil__phase-name{animation:flipIn .7s var(--ease-soft)}
@keyframes flipIn{0%{opacity:0;transform:translateY(9px) rotateX(-70deg)}100%{opacity:1;transform:none}}

.hero__copy{max-width:660px}
.eyebrow{display:flex;align-items:center;gap:14px;font-family:var(--ff-mono);font-size:11px;letter-spacing:.34em;
  text-transform:uppercase;color:var(--blood-hot);margin-bottom:18px;opacity:.85}
.eyebrow__line{flex:1;height:1px;background:linear-gradient(90deg,transparent,var(--blood),transparent)}
.title{font-family:var(--ff-display);font-weight:900;font-size:clamp(50px,11vw,132px);line-height:.9;position:relative;isolation:isolate;
  background:linear-gradient(180deg,#fffaf0,#e9c07a 42%,#8a5a2a 72%,#4a1a1a);-webkit-background-clip:text;background-clip:text;color:transparent}
.title::before,.title::after{content:attr(data-text);position:absolute;inset:0;z-index:-1;pointer-events:none}
.title::before{color:var(--blood-hot);animation:glitchA 5.5s steps(1) infinite;text-shadow:0 0 24px rgba(255,45,63,.8)}
.title::after{color:var(--toxic);animation:glitchB 5.5s steps(1) infinite}
@keyframes glitchA{0%,86%,100%{clip-path:inset(100% 0 0 0);transform:none;opacity:0}
  87%{opacity:.9;clip-path:inset(10% 0 60% 0);transform:translate(-7px,2px)}
  89%{clip-path:inset(55% 0 20% 0);transform:translate(6px,-3px)}
  91%{clip-path:inset(30% 0 45% 0);transform:translate(-4px,3px)}
  93%{clip-path:inset(70% 0 6% 0);transform:translate(5px,1px)}
  95%{opacity:0}}
@keyframes glitchB{0%,86%,100%{clip-path:inset(100% 0 0 0);transform:none;opacity:0}
  88%{opacity:.85;clip-path:inset(42% 0 32% 0);transform:translate(7px,-2px)}
  90%{clip-path:inset(6% 0 76% 0);transform:translate(-6px,3px)}
  92%{clip-path:inset(64% 0 10% 0);transform:translate(4px,2px)}
  94%{opacity:0}}
body.is-jolt .title{animation:jolt .55s steps(2) 1}
@keyframes jolt{0%{transform:translate(0,0) skewX(0)}25%{transform:translate(-6px,2px) skewX(-3deg)}50%{transform:translate(5px,-3px) skewX(2deg)}75%{transform:translate(-3px,1px)}100%{transform:none}}

/* ── вечный знак вместо даты ─────────────────────────────── */
.forever{display:flex;align-items:center;gap:16px;margin-top:24px;padding:12px 20px 12px 12px;
  border:1px solid var(--line);border-radius:100px;background:rgba(18,11,24,.6);width:max-content;max-width:100%}
.forever__sign{width:104px;height:46px;flex:0 0 auto;overflow:visible}
.inf-track{fill:none;stroke:rgba(232,223,205,.16);stroke-width:2.4}
.inf-run{fill:none;stroke:url(#infGrad);stroke-width:2.8;stroke-linecap:round;stroke-dasharray:.22 .78;
  animation:infRun 6s linear infinite;filter:drop-shadow(0 0 8px rgba(255,45,63,.6))}
@keyframes infRun{to{stroke-dashoffset:-1}}
.forever__txt{display:grid;gap:2px}
.forever__label{font-family:var(--ff-goth);font-size:17px;letter-spacing:.06em;color:var(--bone)}
.forever__sub{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--bone-dim)}
.forever:hover .forever__sign{animation:foreverShake .5s ease}
@keyframes foreverShake{0%,100%{transform:rotate(0)}25%{transform:rotate(-4deg) scale(1.06)}75%{transform:rotate(4deg)}}

.lede{margin-top:22px;font-size:clamp(15px,1.7vw,18px);color:var(--bone-dim);max-width:52ch}
.statusline{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:26px;padding:11px 16px;
  border:1px solid var(--line);border-radius:100px;background:rgba(10,7,18,.7);font-size:13px;width:max-content;max-width:100%}
.statusline strong{color:var(--blood-hot);letter-spacing:.12em;text-transform:uppercase;font-size:11px;font-family:var(--ff-goth)}
.statusline .sep{color:var(--bone-dim);opacity:.45}
.pulse-dot{width:9px;height:9px;border-radius:50%;background:var(--blood-hot);flex:0 0 auto;animation:pingRed 1.6s infinite}
.pulse-dot--sm{width:7px;height:7px;display:inline-block;margin-right:8px;vertical-align:middle}
@keyframes pingRed{0%{box-shadow:0 0 0 0 rgba(255,45,63,.65)}70%,100%{box-shadow:0 0 0 13px rgba(255,45,63,0)}}
.cta-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}
.btn{display:inline-flex;align-items:center;gap:9px;padding:15px 28px;border-radius:100px;font-size:14px;font-weight:600;
  cursor:pointer;border:1px solid transparent;position:relative;overflow:hidden;font-family:var(--ff-goth);letter-spacing:.08em;
  transition:transform .35s var(--ease-soft),box-shadow .35s,color .3s,border-color .3s}
.btn--blood{background:linear-gradient(120deg,#8e1f2d,var(--blood) 45%,#5e1420);color:#ffe9ec;
  box-shadow:0 12px 34px -16px rgba(255,45,63,.95)}
.btn--blood::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 32%,rgba(255,255,255,.4) 50%,transparent 68%);
  transform:translateX(-130%);transition:transform .8s var(--ease-soft)}
.btn--blood:hover{transform:translateY(-3px);box-shadow:0 20px 46px -16px rgba(255,45,63,.95)}
.btn--blood:hover::after{transform:translateX(130%)}
.btn--ghost{border-color:var(--line);color:var(--bone);background:rgba(255,255,255,.02)}
.btn--ghost:hover{border-color:var(--blood);color:var(--blood-hot);transform:translateY(-3px)}
.btn--wide{width:100%;justify-content:center}
.hero__meta{display:flex;flex-wrap:wrap;gap:clamp(18px,4vw,46px);margin-top:44px;padding-top:26px;border-top:1px solid var(--line)}
.hero__meta li{display:grid;gap:3px}
.hero__meta b{font-size:24px;color:var(--bone);font-weight:700}
.hero__meta span{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--bone-dim)}

/* ── бегущая строка ──────────────────────────────────────── */
.marquee{position:relative;z-index:3;overflow:hidden;padding:14px 0;border-block:1px solid var(--line);
  background:linear-gradient(90deg,rgba(58,13,28,.5),rgba(10,7,18,.6),rgba(58,13,28,.5))}
.marquee__track{display:flex;width:max-content;animation:slide 26s linear infinite}
.marquee__track span{padding-right:64px;font-family:var(--ff-goth);font-size:clamp(15px,2.2vw,22px);color:var(--bone-dim);white-space:nowrap;letter-spacing:.06em}
@keyframes slide{to{transform:translateX(-50%)}}
.marquee:hover .marquee__track{animation-play-state:paused}

/* ── секции ──────────────────────────────────────────────── */
section{position:relative;z-index:3;padding:clamp(60px,10vh,120px) var(--pad)}
.section-head{display:grid;gap:16px;margin-bottom:clamp(30px,5vh,58px);max-width:1100px}
.h2{font-family:var(--ff-display);font-size:clamp(26px,5vw,54px);line-height:1.06}
.h2 em{font-style:normal;color:var(--blood-hot);display:block;text-shadow:0 0 30px rgba(255,45,63,.45)}
.section-head__note{color:var(--bone-dim);max-width:58ch;font-size:15px}

/* ── фазы ────────────────────────────────────────────────── */
.phases{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:20px;overflow:hidden}
.phase{position:relative;padding:clamp(20px,2.8vw,32px);overflow:hidden;
  background:linear-gradient(180deg,rgba(18,11,24,.94),rgba(8,6,14,.97));transition:background .6s,opacity .6s}
.phase::before{content:"";position:absolute;inset:0;opacity:0;transition:opacity .7s;
  background:radial-gradient(120% 90% at 18% 0%,rgba(255,45,63,.2),transparent 66%)}
.phase.is-active::before{opacity:1}
.phase.is-active{background:linear-gradient(180deg,rgba(48,12,24,.96),rgba(12,7,16,.98));box-shadow:inset 0 0 0 1px rgba(255,45,63,.35)}
.phase.is-done{opacity:.5}
.phase__idx{display:block;font-size:11px;letter-spacing:.24em;color:var(--bone-dim);margin-bottom:14px}
.phase.is-active .phase__idx{color:var(--blood-hot)}
.phase__name{font-family:var(--ff-goth);font-size:clamp(18px,2.2vw,24px);margin-bottom:10px}
.phase__desc{font-size:14px;color:var(--bone-dim);min-height:3.4em}
.phase__bar{display:block;height:2px;background:rgba(232,223,205,.1);border-radius:2px;overflow:hidden;margin-top:18px}
.phase__bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--plum),var(--blood-hot));transition:width .28s linear}
.phase.is-active .phase__bar i{box-shadow:0 0 14px rgba(255,45,63,.9)}
.loop__legend{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px;margin-top:26px}
.legend-card{display:flex;flex-direction:column;gap:8px;padding:18px 20px;border:1px solid var(--line);border-radius:14px;
  background:rgba(10,7,18,.65);transition:border-color .4s,transform .4s var(--ease-soft)}
.legend-card:hover{border-color:rgba(255,45,63,.45);transform:translateY(-4px)}
.legend-card__k{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--bone-dim)}
.legend-card__v{font-size:20px;display:flex;align-items:center}
.inf svg{width:58px;height:26px;overflow:visible}
.inf-mini{fill:none;stroke:var(--blood-hot);stroke-width:2.4;stroke-dasharray:.25 .75;animation:infRun 4s linear infinite;
  filter:drop-shadow(0 0 6px rgba(255,45,63,.7))}

/* ── знамения ────────────────────────────────────────────── */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:clamp(14px,2vw,22px)}
.card{position:relative;padding:clamp(20px,2.6vw,30px);border:1px solid var(--line);border-radius:22px;overflow:hidden;
  background:linear-gradient(165deg,rgba(24,14,26,.92),rgba(8,6,14,.96));
  transition:transform .55s var(--ease-soft),box-shadow .55s,border-color .55s}
.card::after{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;opacity:0;transition:opacity .5s;
  background:conic-gradient(from var(--a,0deg),transparent 0 52%,var(--blood-hot) 72%,var(--gold) 86%,transparent 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
  animation:orbit 5s linear infinite}
@property --a{syntax:'<angle>';inherits:false;initial-value:0deg}
@keyframes orbit{to{--a:360deg}}
.card:hover{transform:translateY(-8px) rotate(-.4deg);border-color:transparent;box-shadow:0 30px 60px -30px #000,0 0 40px -18px rgba(255,45,63,.5)}
.card:hover::after{opacity:1}
.card h3{font-family:var(--ff-goth);font-size:22px;margin:16px 0 10px;letter-spacing:.02em}
.card p{font-size:14px;color:var(--bone-dim)}
.card__tag{display:inline-block;margin-top:16px;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--bone-dim);
  border:1px solid var(--line);border-radius:100px;padding:5px 11px;transition:.4s}
.card:hover .card__tag{border-color:rgba(255,45,63,.4);color:var(--blood-hot)}
.card__art{width:88px;height:88px;display:grid;place-items:center;border-radius:50%;color:var(--bone);
  border:1px solid rgba(255,45,63,.22);background:radial-gradient(circle at 50% 30%,rgba(58,13,28,.7),transparent 72%);
  transition:transform .6s var(--ease-soft),color .5s,box-shadow .5s}
.card__art svg{width:56px;height:56px;overflow:visible}
.card:hover .card__art{transform:rotate(-8deg) scale(1.08);color:var(--blood-hot);box-shadow:0 0 34px -8px rgba(255,45,63,.8)}
.card:nth-child(2):hover .card__art{color:var(--toxic);box-shadow:0 0 34px -8px rgba(95,214,192,.7)}
.draw{stroke-dasharray:1;stroke-dashoffset:0}
.card:hover .draw{animation:redraw 2.2s var(--ease-soft) infinite}
@keyframes redraw{0%{stroke-dashoffset:1}55%,100%{stroke-dashoffset:0}}
.card-eye{opacity:.35;transition:opacity .4s}
.card:hover .card-eye{opacity:1;animation:irisGlow 1.6s ease-in-out infinite}
.eye{transform-box:fill-box;transform-origin:center;animation:eyeJab 4s steps(1) infinite}
.eye--r{animation-delay:.2s}
@keyframes eyeJab{0%,90%,100%{transform:scaleY(1)}93%{transform:scaleY(.06)}}
.drip{transform-box:fill-box;transform-origin:top center;animation:dripGrow 4.5s ease-in-out infinite}
@keyframes dripGrow{0%,60%{transform:scaleY(0);opacity:0}75%{transform:scaleY(1);opacity:1}100%{transform:scaleY(1.4) translateY(6px);opacity:0}}

/* ── призыв ──────────────────────────────────────────────── */
.summon__panel{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(26px,5vw,60px);align-items:center;
  padding:clamp(26px,4.6vw,58px);border:1px solid var(--line);border-radius:28px;position:relative;overflow:hidden;
  background:linear-gradient(140deg,rgba(40,12,24,.85),rgba(8,6,14,.96))}
.summon__panel::before{content:"";position:absolute;width:360px;height:360px;right:-100px;top:-100px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,45,63,.22),transparent 66%);filter:blur(14px);
  animation:breathe calc(var(--loop)*.75) ease-in-out infinite}
.summon__copy p{margin-top:16px;color:var(--bone-dim);max-width:44ch}
.ticks{margin-top:20px;display:grid;gap:10px}
.ticks li{position:relative;padding-left:26px;font-size:14px;color:var(--bone-dim)}
.ticks li::before{content:"✝";position:absolute;left:0;top:0;color:var(--blood-hot);animation:twinkle 3s ease-in-out infinite}
.ticks li:nth-child(2)::before{animation-delay:.5s}.ticks li:nth-child(3)::before{animation-delay:1s}
.summon__mail{margin-top:22px;font-size:13px;color:var(--bone-dim);display:flex;flex-wrap:wrap;gap:8px;align-items:baseline}
.summon__mail a{color:var(--gold);border-bottom:1px dashed rgba(233,192,122,.4);transition:.3s;font-size:14px}
.summon__mail a:hover{color:var(--blood-hot);border-color:var(--blood-hot);text-shadow:0 0 16px rgba(255,45,63,.6)}
.summon__form{display:grid;gap:16px;position:relative}
.field{display:grid;gap:8px}
.field__label{font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--bone-dim)}
.field__input{background:transparent;border:0;border-bottom:1px solid var(--line);color:var(--bone);
  font-family:var(--ff-body);font-size:16px;padding:12px 2px;transition:border-color .4s}
.field__input::placeholder{color:rgba(154,143,166,.4)}
.field__input:focus{outline:none}
.field__line{height:1px;background:linear-gradient(90deg,var(--blood-hot),var(--gold));transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease-soft)}
.field__input:focus~.field__line{transform:scaleX(1)}
.form-msg{min-height:1.2em;font-size:13px;color:var(--toxic)}
.form-msg.is-error{color:var(--blood-hot)}
.form-fine{font-size:11px;color:var(--bone-dim);opacity:.6;text-align:center}
.stamp{width:16px;height:16px;border-radius:50%;border:2px solid rgba(255,233,236,.25);border-top-color:#ffe9ec;opacity:0;animation:spin .8s linear infinite}
.summon__form.is-busy .stamp{opacity:1}
.summon__form.is-done .btn--blood{background:linear-gradient(120deg,#2f7d6d,var(--toxic));color:#04120f;box-shadow:0 12px 34px -16px rgba(95,214,192,.9)}

/* ── футер ───────────────────────────────────────────────── */
.footer{position:relative;z-index:3;padding:32px var(--pad) 46px;border-top:1px solid var(--line);background:linear-gradient(180deg,transparent,rgba(2,1,5,.9))}
.footer__row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;font-size:13px;color:var(--bone-dim)}
.footer__row--links{margin-top:16px;gap:22px}
.footer__row--links a{transition:color .3s}.footer__row--links a:hover{color:var(--blood-hot)}
.footer__dots{display:flex;gap:7px}
.footer__dots i{width:5px;height:5px;border-radius:50%;background:var(--blood-hot);opacity:.3;animation:wave 1.8s ease-in-out infinite}
.footer__dots i:nth-child(2){animation-delay:.2s}.footer__dots i:nth-child(3){animation-delay:.4s}
@keyframes wave{0%,100%{opacity:.25;transform:translateY(0)}50%{opacity:1;transform:translateY(-5px)}}
.footer__curse{margin-top:22px;font-size:10px;letter-spacing:.3em;text-transform:uppercase;opacity:.3;transition:opacity .4s,color .4s}
.footer:hover .footer__curse{opacity:.85;color:var(--blood-hot)}

/* ── reveal ──────────────────────────────────────────────── */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .9s var(--ease-soft),transform .9s var(--ease-soft)}
.reveal.is-in{opacity:1;transform:none}
.phases .phase{opacity:0;transform:translateY(20px);transition:opacity .8s var(--ease-soft),transform .8s var(--ease-soft),background .6s,box-shadow .6s}
.phases.is-in .phase{opacity:1;transform:none;transition-delay:calc(var(--i,0)*70ms)}
.phases.is-in .phase.is-done{opacity:.5}.phases.is-in .phase.is-active{opacity:1}

/* ── адаптив ─────────────────────────────────────────────── */
@media (max-width:980px){
  .hero{grid-template-columns:1fr;text-align:center;min-height:auto}
  .hero__copy{margin-inline:auto}
  .statusline,.cta-row,.hero__meta,.forever,.eyebrow{margin-inline:auto;justify-content:center}
  .summon__panel{grid-template-columns:1fr}
  .nav{display:none}
}
@media (max-width:560px){
  .clock{display:none}.motion-toggle__label{display:none}
  .phase__desc{min-height:0}.forever{flex-direction:column;align-items:center;text-align:center;border-radius:22px}
}

/* ── покой: prefers-reduced-motion + тумблер ─────────────── */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}
body.is-still *,body.is-still *::before,body.is-still *::after{animation-play-state:paused!important}
body.is-still .motes,body.is-still .cracks,body.is-still .lightning,body.is-still .watchers{opacity:0}
body.is-still .motion-toggle__dot{background:var(--bone-dim);animation:none}

/* ═══════════ НОВЫЙ СЛОЙ СТРАХА ═══════════ */

/* ── плавающий док звука: всегда на виду ─────────────────── */
.sounddock{position:fixed;right:clamp(12px,2.4vw,26px);bottom:clamp(12px,2.4vw,26px);z-index:88;
  display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.sounddock__btn{display:flex;align-items:center;gap:11px;padding:13px 20px 13px 15px;border-radius:100px;cursor:pointer;
  border:1px solid rgba(255,45,63,.5);color:#ffe9ec;font-family:var(--ff-goth);font-size:14px;letter-spacing:.06em;
  background:linear-gradient(120deg,#3a0d1c,#0a0710 60%);box-shadow:0 14px 40px -14px #000,0 0 0 0 rgba(255,45,63,.5);
  transition:transform .35s var(--ease-soft),box-shadow .35s,border-color .35s,color .3s;position:relative;overflow:hidden}
.sounddock__btn:hover{transform:translateY(-3px) scale(1.02);border-color:var(--blood-hot);color:#fff}
.sounddock__ring{position:absolute;inset:-2px;border-radius:100px;border:1px solid rgba(255,45,63,.45);
  animation:dockPing 2.4s ease-out infinite;pointer-events:none}
@keyframes dockPing{0%{opacity:.9;transform:scale(1)}70%,100%{opacity:0;transform:scale(1.18)}}
.sounddock__ico{flex:0 0 auto;filter:drop-shadow(0 0 6px rgba(255,45,63,.6))}
.sounddock__ico .wave1,.sounddock__ico .wave2{opacity:.2;transition:opacity .3s}
.sounddock__ico .slash{stroke:var(--blood-hot);stroke-width:2.2;opacity:1;transition:opacity .3s}
.sounddock__btn[aria-pressed="true"]{background:linear-gradient(120deg,#8e1f2d,#3a0d1c 70%);border-color:var(--gold);color:#fff;
  box-shadow:0 14px 44px -12px rgba(255,45,63,.9),0 0 34px -6px rgba(255,45,63,.7)}
.sounddock__btn[aria-pressed="true"] .slash{opacity:0}
.sounddock__btn[aria-pressed="true"] .wave1{opacity:1;animation:wavePulse 1.3s ease-in-out infinite}
.sounddock__btn[aria-pressed="true"] .wave2{opacity:.75;animation:wavePulse 1.3s ease-in-out .22s infinite}
.sounddock__btn[aria-pressed="true"] .sounddock__ring{animation-duration:1.1s}
.sounddock__hint{font-family:var(--ff-mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--bone-dim);
  background:rgba(5,4,9,.7);border:1px solid var(--line);border-radius:100px;padding:5px 11px;backdrop-filter:blur(6px);
  transition:opacity .5s,transform .5s}
.sounddock.is-loud .sounddock__hint{opacity:0;transform:translateY(6px)}
@media (max-width:560px){.sounddock__txt{display:none}.sounddock__btn{padding:13px}}

/* ── VHS-помехи и строб ──────────────────────────────────── */
.vhs{position:fixed;inset:0;z-index:65;pointer-events:none;opacity:0;mix-blend-mode:screen;
  background:repeating-linear-gradient(180deg,rgba(255,255,255,.06) 0 1px,transparent 1px 3px)}
.vhs::after{content:"";position:absolute;left:0;right:0;height:22%;
  background:linear-gradient(180deg,transparent,rgba(255,45,63,.14),rgba(255,255,255,.07),transparent);
  transform:translateY(-140%);animation:vhsRoll 7s linear infinite}
.vhs.is-glitch{opacity:1;animation:vhsJitter .18s steps(2) 6}
@keyframes vhsRoll{to{transform:translateY(560%)}}
@keyframes vhsJitter{0%{transform:translate(0,0)}50%{transform:translate(-6px,2px)}100%{transform:translate(4px,-3px)}}
.darkness{position:fixed;inset:0;z-index:66;pointer-events:none;background:#020104;opacity:0;transition:opacity .12s steps(1)}
.darkness.is-black{opacity:1}

/* ── шёпот ──────────────────────────────────────────────── */
.whisper{position:fixed;left:50%;top:50%;translate:-50% -50%;z-index:67;pointer-events:none;
  font-family:var(--ff-goth);font-size:clamp(20px,4.6vw,54px);letter-spacing:.14em;color:#ff2d3f;
  text-shadow:0 0 30px rgba(255,45,63,.85),0 0 4px rgba(255,255,255,.4);opacity:0;white-space:nowrap;
  filter:blur(6px)}
.whisper.is-on{animation:whisperIn 2.6s ease-out forwards}
@keyframes whisperIn{
  0%{opacity:0;filter:blur(14px);transform:scale(.9) skewX(-6deg)}
  18%{opacity:.95;filter:blur(0);transform:scale(1) skewX(0)}
  30%{opacity:.4}36%{opacity:1}
  70%{opacity:.9;filter:blur(1px)}
  100%{opacity:0;filter:blur(18px);transform:scale(1.14)}}

/* ── сталкер: счётчик времени на странице ───────────────── */
.stalker{position:fixed;left:clamp(12px,2.4vw,26px);bottom:clamp(12px,2.4vw,26px);z-index:87;margin:0;
  font-size:11px;letter-spacing:.14em;color:var(--bone-dim);background:rgba(5,4,9,.72);border:1px solid var(--line);
  border-radius:100px;padding:8px 14px;backdrop-filter:blur(8px);transition:color .6s,border-color .6s,opacity .6s}
.stalker b{color:var(--blood-hot)}
.stalker.is-near{color:#ffd9dd;border-color:rgba(255,45,63,.5)}
.stalker.is-near b{animation:irisGlow 1s ease-in-out infinite}

/* ── кровь с заголовка ──────────────────────────────────── */
.bloodrun{position:absolute;left:0;right:0;top:100%;height:0;pointer-events:none}
.bloodrun i{position:absolute;top:0;width:3px;border-radius:0 0 3px 3px;background:linear-gradient(180deg,#ff2d3f,#5e0d16);
  height:0;animation:dripDown var(--dur,9s) cubic-bezier(.4,0,.6,1) infinite;animation-delay:var(--del,0s)}
.bloodrun i::after{content:"";position:absolute;left:-1.5px;bottom:-4px;width:6px;height:6px;border-radius:50%;background:#8e1f2d}
@keyframes dripDown{0%{height:0;opacity:0}8%{opacity:1}55%{height:var(--h,120px)}100%{height:var(--h,120px);opacity:0}}
.title-wrap{position:relative;display:inline-block}

/* ═══════════ ВЗРОСЛЫЙ УЖАС ═══════════ */

/* ── сублиминальное слово: один кадр, и его уже нет ──────── */
.sublim{position:fixed;left:50%;top:44%;translate:-50% -50%;z-index:70;pointer-events:none;opacity:0;
  font-family:var(--ff-display);font-weight:900;font-size:clamp(40px,11vw,150px);letter-spacing:.04em;
  color:#f6efe4;text-shadow:0 0 40px rgba(255,45,63,.75),3px 0 0 rgba(255,45,63,.55),-3px 0 0 rgba(95,214,192,.4)}
.sublim.is-on{animation:sublimFlash .34s steps(2) forwards}
@keyframes sublimFlash{0%,26%{opacity:.92;transform:scale(1.02) translateX(-4px)}
  27%,46%{opacity:0}47%,62%{opacity:.7;transform:scale(.99) translateX(5px)}100%{opacity:0}}

/* ── присутствие: силуэт в глубине, у края экрана ────────── */
.presence{position:fixed;top:20%;width:12vw;max-width:150px;height:var(--h,32vh);z-index:64;pointer-events:none;opacity:0}
.presence i{position:absolute;inset:0;background:radial-gradient(60% 45% at 50% 18%,rgba(255,45,63,.5),transparent 70%),
  linear-gradient(180deg,rgba(4,2,6,.98),rgba(4,2,6,.86) 55%,transparent);
  border-radius:48% 48% 40% 40%/60% 60% 30% 30%;filter:blur(7px)}
.presence i:nth-child(2){inset:14% 22% -6% 22%;filter:blur(12px);background:linear-gradient(180deg,rgba(2,1,4,.99),transparent 78%)}
.presence.is-on{animation:presenceIn 6.5s ease-in-out forwards}
@keyframes presenceIn{0%{opacity:0;transform:translateY(14px) scale(.94)}
  22%{opacity:.55}55%{opacity:.72;transform:translateY(-6px) scale(1.02)}
  100%{opacity:0;transform:translateY(-18px) scale(1.06)}}

/* ── жёсткий VHS-сдвиг (накапливается по dread) ──────────── */
.vhs.is-hard{mix-blend-mode:normal;opacity:1;
  background:repeating-linear-gradient(180deg,rgba(255,255,255,.14) 0 1px,transparent 1px 4px)}
.vhs.is-hard::after{height:38%;background:linear-gradient(180deg,transparent,rgba(255,45,63,.3),rgba(255,255,255,.16),transparent)}
body.is-fractured .cracks{filter:drop-shadow(0 0 6px rgba(255,45,63,.25))}
.crack.is-eternal{animation:none!important;stroke-dashoffset:0!important;opacity:.5!important}

/* ── журнал наблюдений ───────────────────────────────────── */
.ledger__grid{display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(20px,3.4vw,44px);align-items:start}
.ledger__list{border-left:1px solid var(--line);padding-left:clamp(16px,2.4vw,28px);display:grid;gap:2px}
.ledger__list li{display:grid;grid-template-columns:64px 1fr;gap:14px;align-items:baseline;padding:13px 0;
  border-bottom:1px dashed rgba(232,223,205,.07);transition:color .4s,background .4s}
.ledger__list li:hover{background:linear-gradient(90deg,rgba(58,13,28,.5),transparent);color:#fff}
.ledger__list time{font-size:12px;color:var(--blood-hot);opacity:.8}
.ledger__list span{font-family:var(--ff-goth);font-size:16px;color:var(--bone-dim);letter-spacing:.01em}
.ledger__list li:hover span{color:var(--bone)}
.ledger__live{position:relative;padding:clamp(20px,2.6vw,30px);border:1px solid var(--line);border-radius:22px;
  background:linear-gradient(160deg,rgba(24,10,20,.92),rgba(6,4,11,.96))}
.ledger__tag{display:inline-block;font-size:10px;letter-spacing:.26em;text-transform:uppercase;color:var(--toxic);
  border:1px solid rgba(95,214,192,.28);border-radius:100px;padding:5px 12px;margin-bottom:16px}
.ledger__now{min-height:3.4em;font-family:var(--ff-goth);font-size:clamp(16px,2vw,20px);color:var(--bone);line-height:1.45}
.ledger__now::after{content:"▌";color:var(--blood-hot);animation:cursorBlink 1s steps(1) infinite}
@keyframes cursorBlink{0%,49%{opacity:1}50%,100%{opacity:0}}
.ledger__stats{display:grid;gap:12px;margin-top:20px;padding-top:18px;border-top:1px solid var(--line)}
.ledger__stats li{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:11px;
  letter-spacing:.14em;text-transform:uppercase;color:var(--bone-dim)}
.ledger__stats b{font-size:17px;color:var(--gold);letter-spacing:0;text-transform:none}
.ledger__foot{margin-top:20px;font-size:12px;color:var(--bone-dim);opacity:.75;font-style:italic}
@media (max-width:900px){.ledger__grid{grid-template-columns:1fr}}