/* Нейрофизиология внимания — кинематографичная дека (Apple-класс) на Vitrine.
   Один синий = «ток внимания». Кинетик-тайп, сквозная нить, тёмные контрастные блоки. */

:root{
  --ink:#1d1d1f; --fog:#f5f5f7; --ash:#e8e8ed; --white:#fff;
  --graphite:#86868b; --slate:#6e6e73; --hair:#d6d6d6;
  --blue:#0071e3; --blue-hi:#0077ed; --link:#0066cc;
  --fdisp:'Inter Tight','Inter',system-ui,sans-serif;
  --ftext:'Inter',system-ui,sans-serif;
}
*{ margin:0; padding:0; box-sizing:border-box; }
html,body{ height:100%; background:#000; }
body{ font-family:var(--ftext); color:var(--ink); -webkit-font-smoothing:antialiased; }
deck-stage:not(:defined){ visibility:hidden; }
a{ color:var(--link); text-decoration:none; }

/* сквозной холст поля + нити — над слайдами, клики проходят */
#field{ position:fixed; inset:0; width:100vw; height:100vh; z-index:40; pointer-events:none; }

/* ---------- базовый слайд ---------- */
section{ background:var(--fog); color:var(--ink); display:flex; flex-direction:column;
  justify-content:center; align-items:center; text-align:center; padding:130px 160px; position:relative; overflow:hidden; }
.dark{ background:#000; color:var(--fog); }
.blue{ color:var(--blue); }

/* ---------- сквозной плавный переход слайдов (кроссфейд) ----------
   Уходящий слайд плавно гаснет (visibility скрывается с задержкой, поэтому
   остаётся видимым во время затухания), новый — проявляется и «собирается»
   своими внутренними анимациями. Никаких резких переключений. */
@media (prefers-reduced-motion: no-preference){
  deck-stage > section{ transition: opacity .6s ease, visibility 0s linear .6s; }
  deck-stage > section[data-deck-active]{ transition: opacity .75s ease, visibility 0s linear 0s; }
}

/* ---------- типографика ---------- */
h1,h2,h3{ font-family:var(--fdisp); font-weight:600; letter-spacing:-0.02em; line-height:1.04; }
.eyebrow{ font-family:var(--fdisp); font-weight:600; font-size:24px; letter-spacing:.02em; color:var(--slate); margin-bottom:30px; }
.dark .eyebrow{ color:#6a6a72; }
.kicker{ position:absolute; top:96px; left:160px; font-family:var(--fdisp); font-weight:600; font-size:20px; letter-spacing:.16em; color:var(--graphite); text-transform:uppercase; }
.dark .kicker{ color:#54545c; }
.lead{ font-size:32px; line-height:1.5; color:var(--slate); max-width:1000px; }
.dark .lead{ color:#9a9aa2; }
.small{ font-size:26px; color:var(--graphite); }

/* ---------- кинетик-тайп (по буквам) ---------- */
.wd{ display:inline-block; white-space:nowrap; }
.ltr{ display:inline-block; opacity:0; filter:blur(14px); transform:translateY(.28em) scale(1.03); }
[data-deck-active] .ltr{ animation:ltrin .82s cubic-bezier(.2,.65,.2,1) forwards; }
@keyframes ltrin{ to{ opacity:1; filter:blur(0); transform:none; } }

/* мягкое проявление блоков */
.rise{ opacity:0; filter:blur(10px); transform:translateY(18px); }
[data-deck-active] .rise{ opacity:1; filter:blur(0); transform:none; transition:opacity 1s ease, filter 1s ease, transform 1s ease; }
[data-deck-active] .rise.d1{ transition-delay:.5s; }
[data-deck-active] .rise.d2{ transition-delay:.85s; }
[data-deck-active] .rise.d3{ transition-delay:1.15s; }
@media (prefers-reduced-motion: reduce){
  .ltr{ opacity:1; filter:none; transform:none; animation:none; }
  .rise{ opacity:1; filter:none; transform:none; }
}

/* ---------- обложка (кино-открытие) ---------- */
.cover h1{ font-family:var(--fdisp); font-weight:600; font-size:132px; letter-spacing:-0.03em; line-height:1.05; max-width:1500px; }
.cover .eyebrow{ margin-bottom:40px; }
.cover .sign{ position:absolute; bottom:120px; font-size:24px; color:#8a8a93; opacity:0; }
[data-deck-active].cover .sign{ opacity:1; transition:opacity 1s ease 1.8s; }

/* ---------- одно слово ---------- */
.word h1{ font-size:300px; letter-spacing:-0.04em; }
.word.smaller h1{ font-size:200px; }

/* ---------- цикл слов ---------- */
.cycle{ }
.cycle .rot{ position:relative; height:1.2em; }
.cycle .rot span{ position:absolute; left:0; right:0; font-family:var(--fdisp); font-weight:600; font-size:150px; opacity:0; }
.cycle .rot span.on{ opacity:1; }

/* ---------- крупная цифра (счётчик со сменой скорости) ---------- */
.stat .num{ font-family:var(--fdisp); font-weight:600; font-size:300px; line-height:.9; letter-spacing:-0.04em; white-space:nowrap; font-variant-numeric:tabular-nums; font-feature-settings:"tnum" 1; display:flex; align-items:baseline; justify-content:center; }
.stat .num .plus{ color:var(--blue); }
.stat .odo{ font-variant-numeric:tabular-nums; font-feature-settings:"tnum" 1; }
.stat .odo .sp{ display:inline-block; width:.22em; }
.stat .sub{ margin-top:36px; font-size:34px; color:var(--slate); }

/* ---------- тихий вопрос / фраза ---------- */
.quiet h2, .phrase h2{ font-size:112px; max-width:1560px; }
.quiet.photobg{ background:#0a0d0a; }
.quiet.photobg::before{ content:''; position:absolute; inset:0; z-index:0; background:url(../assets/q5-bg.jpg) center/cover no-repeat; }
.quiet.photobg::after{ content:''; position:absolute; inset:0; z-index:0; pointer-events:none; background:radial-gradient(64% 54% at 50% 50%, rgba(6,10,6,.52), rgba(6,10,6,.34) 48%, rgba(6,10,6,.66)); }
.quiet.photobg h2{ position:relative; z-index:2; color:#fff; text-shadow:0 2px 34px rgba(0,0,0,.5); }
.quiet .sub{ margin-top:34px; font-size:32px; color:var(--graphite); }

/* ---------- бренды-созвездие ---------- */
.brands canvas{ position:absolute; inset:0; width:100%; height:100%; }
.brands h3{ position:relative; z-index:2; font-size:40px; color:var(--slate); font-weight:600; }

/* ---------- эксперимент: 4 шага (рука → телефон вправо → таймер → финал) ---------- */
.exp{ position:relative; overflow:hidden; }
.exp .exp-bg{ position:absolute; inset:0; background:#131316; opacity:0; transition:opacity .9s ease; z-index:0; pointer-events:none; }
.exp.invert .exp-bg{ opacity:1; }

/* инструкция (шаг 0) */
.exp .exp-intro{ position:absolute; left:50%; top:52px; transform:translateX(-50%); width:1300px; max-width:88%; text-align:center; z-index:4;
  opacity:0; transition:opacity .7s ease; }
.exp.s0 .exp-intro{ opacity:1; }
.exp .exp-kick{ font-family:var(--fdisp); font-weight:600; font-size:24px; letter-spacing:.2em; text-transform:uppercase; color:var(--graphite); margin-bottom:26px; }
.exp .exp-title{ font-size:76px; line-height:1.04; letter-spacing:-0.03em; }
.exp .exp-note{ font-size:30px; color:var(--slate); margin-top:24px; }

/* таймер (слева, шаги 1–2) */
.exp .exp-timer{ position:absolute; left:50%; top:50%; transform:translate(-50%, -50%) scale(.9); z-index:4;
  width:300px; height:300px; text-align:center; pointer-events:none;
  opacity:0; transition:opacity .7s ease, transform .7s cubic-bezier(.4,0,.15,1); }
.exp.s1 .exp-timer, .exp.s2 .exp-timer{ opacity:1; transform:translate(-50%, -50%) scale(1); }
.exp .exp-timer .tinner{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.exp .exp-timer .ring{ position:absolute; inset:0; width:100%; height:100%; transform:rotate(-90deg); }
.exp .exp-timer .ring-bg{ fill:none; stroke:var(--ash); stroke-width:6; }
.exp .exp-timer .ring-fg{ fill:none; stroke:var(--blue); stroke-width:6; stroke-linecap:round; stroke-dasharray:691; stroke-dashoffset:0; }
.exp.running .exp-timer .ring-fg{ animation:exp-ring 10s linear forwards; }
@keyframes exp-ring{ from{ stroke-dashoffset:0; } to{ stroke-dashoffset:691; } }
.exp .exp-timer .tnum{ position:absolute; inset:0; display:grid; place-items:center; font-family:var(--fdisp); font-weight:600; font-size:104px; line-height:1; letter-spacing:-0.02em; font-variant-numeric:tabular-nums; }
.exp .exp-timer .tlabel{ position:absolute; left:0; right:0; top:calc(100% + 18px); text-align:center; font-size:24px; letter-spacing:.18em; text-transform:uppercase; color:var(--graphite); }

/* сцена: реальная кисть с телефоном (фото) + экран-оверлей (центр → вправо → центр) */
.exp .exp-stage{ position:absolute; left:50%; top:50%; transform:translate(calc(-50% + 163px), calc(-50% + 320px)); z-index:3;
  opacity:0; transition:opacity .7s ease, transform 1s cubic-bezier(.5,0,.15,1); }
.exp.s0 .exp-stage{ opacity:1; transform:translate(calc(-50% + 163px), calc(-50% + 180px)); animation:exp-raise 1.15s cubic-bezier(.34,0,.2,1) both; }
@keyframes exp-raise{ from{ transform:translate(calc(-50% + 163px), calc(-50% + 340px)) rotate(-3deg); opacity:0; } to{ transform:translate(calc(-50% + 163px), calc(-50% + 180px)) rotate(0); opacity:1; } }

.exp .device{ position:relative; height:800px; filter:drop-shadow(0 42px 60px rgba(17,17,20,.20)); transition:filter .8s ease; }
.exp .handphone{ display:block; height:800px; width:auto; -webkit-user-drag:none; user-select:none; }
.exp.invert .device{ filter:drop-shadow(0 30px 66px rgba(0,0,0,.55)); }

/* экран — вписан в дисплей фото */
.exp .screen{ position:absolute; left:11.0%; top:2.4%; width:33.9%; height:65.8%; overflow:hidden; border-radius:18px; background:var(--white); transition:background .8s ease; }
.exp.invert .screen{ background:#0b0b0c; }
.exp .screen::before{ content:''; position:absolute; top:9px; left:50%; transform:translateX(-50%); width:34%; height:14px; border-radius:999px; background:#111; z-index:5; }
.exp.invert .screen::before{ background:rgba(255,255,255,.42); }

.feed{ position:absolute; inset:0; overflow:hidden; transition:opacity .7s ease; }
.exp.invert .feed{ opacity:0; }
.feed .strip{ position:absolute; top:0; left:0; right:0; padding:40px 14px 14px; display:flex; flex-direction:column; gap:12px; }
[data-deck-active].exp.s2 .feed .strip{ animation:feed 4.5s linear infinite; }
@keyframes feed{ from{ transform:translateY(0);} to{ transform:translateY(-50%);} }
.feed .card{ flex:0 0 auto; height:150px; border-radius:16px; background:var(--fog); border:1px solid var(--ash); padding:14px; display:flex; flex-direction:column; justify-content:flex-end; }
.feed .card b{ font-family:var(--fdisp); font-weight:600; font-size:26px; } .feed .card span{ font-size:24px; color:var(--graphite); }

/* финал: «эксперимент окончен» по центру слайда */
.exp .exp-final{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%) scale(.96); text-align:center;
  font-family:var(--fdisp); font-weight:600; font-size:100px; line-height:1.05; letter-spacing:-0.03em; color:var(--white);
  opacity:0; transition:opacity .8s ease .2s, transform .8s cubic-bezier(.4,0,.15,1) .2s; z-index:5; }
.exp.invert .exp-final{ opacity:1; transform:translate(-50%,-50%) scale(1); }

/* инверсия: текст светлеет */
.exp.invert .exp-title, .exp.invert .exp-note{ color:var(--white); }

/* ---------- наука (тёмный пролёт) ---------- */
.sci canvas{ position:absolute; inset:0; width:100%; height:100%; }
.sci .word2{ position:relative; z-index:2; font-family:var(--fdisp); font-weight:600; font-size:116px; letter-spacing:.02em; color:#fff; text-shadow:0 0 60px rgba(0,113,227,.55),0 0 22px rgba(255,255,255,.3); }
.sci h2{ position:relative; z-index:2; font-size:92px; max-width:1480px; text-wrap:balance; color:#f5f5f7; }
.sci .note{ position:absolute; bottom:120px; z-index:2; font-size:26px; color:#8a8a93; }
.sci .rot{ position:relative; z-index:2; height:1.3em; width:900px; }
.sci .rot span{ position:absolute; left:0; right:0; text-align:center; font-family:var(--fdisp); font-weight:600; font-size:120px; color:#fff; opacity:0; text-shadow:0 0 50px rgba(0,113,227,.6); }
.sci .rot span.on{ opacity:1; }
.tick{ position:absolute; z-index:2; font-family:var(--fdisp); font-weight:600; font-size:15px; letter-spacing:.16em; color:rgba(0,150,255,.5); }

/* ---------- путь сигнала: схема-нейросеть (пошаговый разбор пробелом/стрелками) ---------- */
.sigcar{ background:#000; padding:0; overflow:hidden; }
.sigcar::before{ content:''; position:absolute; inset:0; z-index:0;
  background:url(../assets/sig-bg.jpeg) center/cover no-repeat; }
.sigcar::after{ content:''; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    radial-gradient(92% 82% at 50% 45%, rgba(0,0,0,.66), rgba(0,0,0,.44) 70%, rgba(0,0,0,.52) 100%),
    linear-gradient(180deg, rgba(0,0,0,.42), rgba(0,0,0,.30) 45%, rgba(0,0,0,.64)); }
.sigcar .kicker{ z-index:6; top:78px; left:50%; transform:translateX(-50%); letter-spacing:.3em; color:rgba(255,255,255,.55); white-space:nowrap; }
.sigcar .sig{ position:absolute; inset:0; z-index:2; }
.sigcar .dgm{ position:absolute; inset:0; width:100%; height:100%; }

/* аксоны */
.sigcar .dgm .edge, .sigcar .dgm .mod{ fill:none; stroke:rgba(255,255,255,.12); stroke-width:2.5; stroke-linecap:round;
  color:rgba(255,255,255,.12); transition:stroke .55s ease, stroke-width .55s ease, color .55s ease; }
.sigcar .dgm .mod{ stroke-dasharray:5 7; }
.sigcar .dgm .edge.on, .sigcar .dgm .mod.on{ stroke:var(--blue); stroke-width:3; color:var(--blue); }

/* узлы */
.sigcar .dgm .node .ring{ fill:#000; stroke:rgba(255,255,255,.24); stroke-width:2.5; transition:stroke .55s ease, filter .55s ease; }
.sigcar .dgm .node .core{ fill:rgba(255,255,255,.16); transition:fill .55s ease, filter .55s ease; }
.sigcar .dgm .node .n-label{ fill:rgba(255,255,255,.42); font-family:var(--fdisp); font-weight:600; font-size:32px; letter-spacing:-0.01em; text-anchor:middle; transition:fill .55s ease; }
.sigcar .dgm .node .n-desc{ fill:rgba(255,255,255,.3); font-family:var(--ftext); font-size:26px; letter-spacing:.01em; text-anchor:middle; transition:fill .55s ease; }
.sigcar .dgm .node.on .ring{ stroke:var(--blue); filter:drop-shadow(0 0 14px rgba(0,113,227,.7)); }
.sigcar .dgm .node.on .core{ fill:var(--blue); filter:drop-shadow(0 0 10px rgba(0,113,227,.95)); }
.sigcar .dgm .node.on .n-label{ fill:#fff; }
.sigcar .dgm .node.on .n-desc{ fill:rgba(255,255,255,.72); }

/* нейромодуляторы (появляются на этапе памяти) */
.sigcar .dgm .modgrp{ opacity:0; transition:opacity .55s ease; }
.sigcar .dgm .modgrp.on{ opacity:1; }
.sigcar .dgm .mod-label{ fill:rgba(255,255,255,.7); font-family:var(--ftext); font-size:26px; letter-spacing:.01em; text-anchor:middle; }

/* импульс + отсев */
.sigcar .dgm .spark{ fill:#fff; filter:drop-shadow(0 0 9px rgba(0,113,227,.95)); }
.sigcar .dgm .cull{ fill:rgba(255,255,255,.55); }

/* подпись-озвучка */
.sigcar .cap{ position:absolute; left:50%; transform:translateX(-50%); bottom:132px; width:1440px; text-align:center; z-index:6; }
.sigcar .cap-term{ font-family:var(--fdisp); font-weight:600; font-size:26px; letter-spacing:.16em; text-transform:uppercase; color:var(--blue); margin-bottom:16px; }
.sigcar .cap-say{ font-family:var(--fdisp); font-weight:600; font-size:46px; line-height:1.16; letter-spacing:-0.02em; color:#fff; text-wrap:balance; }
.sigcar .ctr{ position:absolute; left:50%; transform:translateX(-50%); bottom:60px; z-index:7;
  font-family:var(--fdisp); font-weight:600; font-size:24px; letter-spacing:.14em; color:rgba(255,255,255,.5); }
.sigcar .ctr .i{ color:#fff; }

/* досье-выноска (спай-муви): линия от узла (SVG) → HTML-фотокарточка */
.sigcar .dossier{ opacity:0; transition:opacity .28s ease; }
.sigcar .dossier.show{ opacity:1; }
.sigcar .dossier .lead{ stroke:var(--blue); stroke-width:2.5; fill:none; stroke-linecap:round;
  filter:drop-shadow(0 0 6px rgba(0,113,227,.85)); transition:stroke-dashoffset .34s ease; }
.sigcar .dossier .lead-dot{ fill:var(--blue); filter:drop-shadow(0 0 9px rgba(0,113,227,1)); }

.sigcar .dcard{ position:absolute; left:90px; top:48px; width:540px; height:360px;
  padding:9px; box-sizing:border-box; background:#0a0a0c; border:2.5px solid var(--blue);
  border-radius:4px; box-shadow:0 0 30px rgba(0,113,227,.42);
  z-index:5; opacity:0; transform:translateY(14px) scale(.955); transform-origin:50% 50%;
  transition:opacity .5s ease, transform .5s cubic-bezier(.2,.7,.2,1); pointer-events:none; }
.sigcar .dcard.show{ opacity:1; transform:translateY(0) scale(1); }
.sigcar .dcard.exit{ opacity:0; transform:scale(1.04); transition:opacity .28s ease, transform .28s ease; }
.sigcar .dcard-in{ position:absolute; inset:8px; overflow:hidden; }
.sigcar .dcard-img{ width:100%; height:100%; object-fit:cover; display:block; filter:saturate(.92) contrast(1.03); }
.sigcar .dcard-tag{ position:absolute; left:0; right:0; bottom:0; padding:11px 15px;
  background:linear-gradient(to top, rgba(0,0,0,.78), rgba(0,0,0,0));
  color:#eaf4ff; font-family:var(--fdisp); font-weight:600; font-size:27px; letter-spacing:.12em; }
.sigcar .dcard-scan{ position:absolute; left:0; right:0; top:0; height:3px; background:#cfe6ff;
  mix-blend-mode:screen; opacity:0; }
.sigcar .dcard.show .dcard-scan{ animation:dscan 1.05s ease .18s 1; }
@keyframes dscan{ 0%{opacity:0; transform:translateY(0)} 12%{opacity:.6} 88%{opacity:.6} 100%{opacity:0; transform:translateY(340px)} }
.sigcar .dcard .tk{ position:absolute; width:18px; height:18px; border:2px solid #fff; }
.sigcar .dcard .tk1{ left:-1px; top:-1px; border-right:0; border-bottom:0; }
.sigcar .dcard .tk2{ right:-1px; top:-1px; border-left:0; border-bottom:0; }
.sigcar .dcard .tk3{ right:-1px; bottom:-1px; border-left:0; border-top:0; }
.sigcar .dcard .tk4{ left:-1px; bottom:-1px; border-right:0; border-top:0; }
@media (prefers-reduced-motion: reduce){
  .sigcar .dcard{ transition:opacity .2s ease; transform:none; }
  .sigcar .dcard.show{ transform:none; }
  .sigcar .dcard.show .dcard-scan{ animation:none; }
  .sigcar .dossier .lead{ transition:none; }
}

/* ---------- ролик-виджет (стиль Vitrine-слайдера): большая карточка + пик следующей ---------- */
.reel{ justify-content:center; align-items:stretch; text-align:left; padding:110px 140px; }
.reel .rl-head{ margin-bottom:32px; }
.reel .rl-title{ font-size:84px; letter-spacing:-0.02em; line-height:1.04; color:var(--ink); }
.reel .rl-viewport{ flex:1; min-height:0; overflow:hidden; -webkit-mask-image:linear-gradient(90deg, transparent 0, #000 10%, #000 90%, transparent 100%); mask-image:linear-gradient(90deg, transparent 0, #000 10%, #000 90%, transparent 100%); }
.reel .rl-track{ display:flex; gap:24px; height:100%; transition:transform .55s cubic-bezier(.3,0,.2,1); }
/* активная карточка по центру; соседние — размыты и приглушены, «ждут» своей очереди */
.reel .rl-card{ position:relative; flex:none; width:calc(100% - 380px); height:100%; border-radius:24px; overflow:hidden; background:var(--ash); filter:blur(7px); opacity:.5; transform:scale(.92); transition:filter .55s cubic-bezier(.3,0,.2,1), opacity .55s ease, transform .55s cubic-bezier(.3,0,.2,1); }
.reel .rl-card[data-active]{ filter:none; opacity:1; transform:scale(1); }
.reel .rl-card video{ width:100%; height:100%; object-fit:cover; display:block; }
.reel .rl-controls{ display:flex; align-items:center; justify-content:center; gap:18px; margin-top:26px; }
.reel .rl-dots{ display:flex; align-items:center; gap:6px; padding:8px 14px; background:var(--ash); border-radius:999px; }
.reel .rl-dot{ width:34px; height:34px; border:none; background:transparent; padding:0; display:flex; align-items:center; justify-content:center; cursor:pointer; }
.reel .rl-dot::after{ content:""; width:10px; height:10px; border-radius:999px; background:var(--graphite); opacity:.45; transition:width .24s ease, opacity .18s ease; }
.reel .rl-dot[data-active]::after{ width:30px; opacity:1; background:var(--ink); }
.reel .rl-next{ width:60px; height:60px; border:none; border-radius:50%; background:var(--ash); color:var(--ink); cursor:pointer; display:flex; align-items:center; justify-content:center; }
.reel .rl-next:hover{ background:var(--hair); }
.reel .rl-next span{ font-family:var(--ftext); font-size:32px; line-height:1; transform:translateY(-2px); }
@media (prefers-reduced-motion: reduce){ .reel .rl-track, .reel .rl-card{ transition:none; } }

/* ---------- законы восприятия: карусель-виджеты (место под фото) ---------- */
.laws .rl-title .blue{ color:var(--blue); }
.laws .lw-eb{ font-family:var(--fdisp); font-weight:600; font-size:26px; letter-spacing:.16em; text-transform:uppercase; color:var(--graphite); margin-bottom:18px; }
.laws .lw-card{ background:var(--ash); border:1px solid var(--hair); }
.laws .lw-media{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; background:repeating-linear-gradient(135deg, rgba(0,0,0,.014) 0 22px, rgba(0,0,0,0) 22px 44px); }
.laws .lw-media .lw-ph{ font-family:var(--ftext); font-size:19px; letter-spacing:.16em; text-transform:uppercase; color:var(--graphite); opacity:.34; }
.laws .lw-no{ position:absolute; top:28px; left:32px; z-index:2; font-family:var(--fdisp); font-weight:600; font-size:24px; color:var(--blue); }
.laws .lw-cap{ position:absolute; left:0; right:0; bottom:0; z-index:2; padding:46px 44px 40px; font-family:var(--fdisp); font-weight:600; font-size:46px; line-height:1.06; letter-spacing:-0.02em; color:var(--ink); text-wrap:balance; background:linear-gradient(180deg, rgba(245,245,247,0) 0%, rgba(245,245,247,.6) 55%, rgba(245,245,247,.92) 100%); }
/* карточка с фото */
.laws .lw-card.has-photo{ background:#0b0b0f; border-color:transparent; }
.laws .lw-card.has-photo .lw-media{ background:none; }
.laws .lw-card.has-photo .lw-media img{ width:100%; height:100%; object-fit:cover; display:block; }
.laws .lw-card.has-photo .lw-no{ color:#fff; text-shadow:0 1px 12px rgba(0,0,0,.5); }
.laws .lw-card.has-photo .lw-cap{ color:#fff; text-shadow:0 2px 22px rgba(0,0,0,.4); background:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.28) 45%, rgba(0,0,0,.72) 100%); }

/* название + пояснение внутри подписи */
.laws .lw-cap .lw-nm{ display:block; }
.laws .lw-sub{ display:block; margin-top:12px; font-family:var(--ftext); font-weight:400; font-size:22px; line-height:1.2; letter-spacing:0; }
.laws .lw-card:not(.has-photo) .lw-sub{ color:var(--slate); }
.laws .lw-card.has-photo .lw-sub{ color:rgba(255,255,255,.82); }

/* ---------- двухъярусная карусель: законы (верх) → технические параметры (низ) ---------- */
.laws{ padding:64px 140px 70px; }
.laws .laws-tier{ display:flex; flex-direction:column; min-height:0; width:100%; overflow:hidden; }
.laws .laws-t1{ flex:0 0 auto; height:946px; transition:height .85s cubic-bezier(.4,0,.2,1), margin-top .85s cubic-bezier(.4,0,.2,1); }
.laws .laws-t2{ flex:0 0 auto; height:0; opacity:0; pointer-events:none; transition:height .85s cubic-bezier(.4,0,.2,1), margin-top .85s cubic-bezier(.4,0,.2,1), opacity .55s ease .12s; }
.laws .laws-t3{ flex:0 0 auto; height:0; opacity:0; pointer-events:none; transition:height .85s cubic-bezier(.4,0,.2,1), margin-top .85s cubic-bezier(.4,0,.2,1), opacity .55s ease .12s; }
.laws .laws-t4{ flex:0 0 auto; height:0; opacity:0; pointer-events:none; transition:height .85s cubic-bezier(.4,0,.2,1), margin-top .85s cubic-bezier(.4,0,.2,1), opacity .55s ease .12s; }
.laws .laws-t5{ flex:0 0 auto; height:0; opacity:0; pointer-events:none; transition:height .85s cubic-bezier(.4,0,.2,1), margin-top .85s cubic-bezier(.4,0,.2,1), opacity .55s ease .12s; }
.laws .laws-t6{ flex:0 0 auto; height:0; opacity:0; pointer-events:none; transition:height .85s cubic-bezier(.4,0,.2,1), margin-top .85s cubic-bezier(.4,0,.2,1), opacity .55s ease .12s; }
.laws .laws-t7{ flex:0 0 auto; height:0; opacity:0; pointer-events:none; transition:height .85s cubic-bezier(.4,0,.2,1), margin-top .85s cubic-bezier(.4,0,.2,1), opacity .55s ease .12s; }
.laws[data-tier="2"] .laws-t1{ height:196px; }
.laws[data-tier="2"] .laws-t2{ height:712px; opacity:1; pointer-events:auto; margin-top:36px; }
/* три яруса: при аудио-ярусе (3) оба верхних ряда сжаты в полоски-референсы */
.laws[data-tier="3"] .laws-t1{ height:150px; }
.laws[data-tier="3"] .laws-t2{ height:150px; opacity:1; pointer-events:auto; margin-top:26px; }
.laws[data-tier="3"] .laws-t3{ height:586px; opacity:1; pointer-events:auto; margin-top:26px; }
/* ярус 4 — три полоски-референса сверху + активный нейро-ряд снизу */
.laws[data-tier="4"] .laws-t1{ height:126px; }
.laws[data-tier="4"] .laws-t2{ height:126px; opacity:1; pointer-events:auto; margin-top:20px; }
.laws[data-tier="4"] .laws-t3{ height:126px; opacity:1; pointer-events:auto; margin-top:20px; }
.laws[data-tier="4"] .laws-t4{ height:508px; opacity:1; pointer-events:auto; margin-top:20px; }
/* ярус 5 — финальный вопрос: четыре ряда законов сжаты в полоски, внизу — вопрос */
.laws[data-tier="5"] .laws-t1{ height:80px; }
.laws[data-tier="5"] .laws-t2{ height:80px; opacity:1; pointer-events:auto; margin-top:16px; }
.laws[data-tier="5"] .laws-t3{ height:80px; opacity:1; pointer-events:auto; margin-top:16px; }
.laws[data-tier="5"] .laws-t4{ height:80px; opacity:1; pointer-events:auto; margin-top:16px; }
.laws .laws-q{ display:none; flex:1 1 auto; min-height:0; align-items:center; justify-content:center; }
.laws[data-tier="5"] .laws-q{ display:flex; }
.laws .laws-q h3{ font-family:var(--fdisp); font-weight:600; font-size:88px; letter-spacing:-0.025em; line-height:1.08; text-align:center; text-wrap:balance; max-width:1400px; opacity:0; transform:translateY(20px); filter:blur(12px); animation:lq-in .95s cubic-bezier(.4,0,.2,1) .5s forwards; }
.laws .laws-q h3 .blue{ color:var(--blue); }
@keyframes lq-in{ to{ opacity:1; transform:none; filter:blur(0); } }
@media (prefers-reduced-motion: reduce){ .laws .laws-q h3{ animation:none; opacity:1; transform:none; filter:none; } }
/* бизнес-модель в режиме полоски: страницы прячем, остаётся подпись */
.laws .laws-tier.is-strip .fin-pages{ display:none; }
/* ярус 7 — виджет метрик (тизер следующего слайда) */
.laws .laws-t7 .rl-title{ font-size:52px; }
.laws .laws-t7 .rl-head{ margin-bottom:20px; }
.laws .laws-t7 .met-grid{ flex:1; min-height:0; display:grid; grid-template-columns:repeat(4, 1fr); grid-auto-rows:1fr; gap:16px; }
.laws .laws-t7 .met-card{ display:flex; flex-direction:column; align-items:flex-start; justify-content:center; background:var(--white); border:1px solid var(--hair); border-radius:22px; padding:22px 30px; overflow:hidden; }
.laws .laws-t7 .met-big{ font-family:var(--fdisp); font-weight:600; font-size:58px; letter-spacing:-0.03em; line-height:1; color:var(--blue); }
.laws .laws-t7 .met-k{ font-family:var(--ftext); font-size:19px; color:var(--slate); margin-top:10px; }
.laws .laws-t7 .met-note{ margin:16px 0 0; font-family:var(--ftext); font-size:20px; color:var(--graphite); }
/* ярус 6 — постраничные текстовые виджеты (без фото): каждая секция борда — своя страница */
.laws .laws-t6 .rl-title{ font-size:52px; }
.laws .laws-t6 .rl-head{ margin-bottom:20px; }
.laws .laws-t6 .fin-pages{ flex:1; min-height:0; position:relative; }
.laws .laws-t6 .fin-page{ position:absolute; inset:0; display:flex; opacity:0; pointer-events:none; transition:opacity .38s ease; }
.laws .laws-t6 .fin-page.is-on{ opacity:1; pointer-events:auto; }
.laws .laws-t6 .fin-grid{ flex:1; min-height:0; display:grid; grid-auto-rows:1fr; gap:16px; }
.laws .laws-t6 .fin-grid.g1{ grid-template-columns:1fr; }
.laws .laws-t6 .fin-grid.g2{ grid-template-columns:repeat(2, 1fr); }
.laws .laws-t6 .fin-grid.g3{ grid-template-columns:repeat(3, 1fr); }
.laws .laws-t6 .fin-grid.g4{ grid-template-columns:repeat(4, 1fr); }
.laws .laws-t6 .fin-grid.g5{ grid-template-columns:repeat(5, 1fr); }
.laws .laws-t6 .fin-card{ display:flex; flex-direction:column; background:var(--white); border:1px solid var(--hair); border-radius:22px; padding:22px 26px; overflow:hidden; min-width:0; }
.laws .laws-t6 .fin-k{ font-family:var(--fdisp); font-weight:600; font-size:16px; letter-spacing:.1em; text-transform:uppercase; color:var(--graphite); }
.laws .laws-t6 .fin-big{ font-family:var(--fdisp); font-weight:600; font-size:64px; letter-spacing:-0.03em; line-height:1.05; color:var(--blue); margin-top:10px; }
.laws .laws-t6 .g3 .fin-big{ font-size:96px; }
.laws .laws-t6 .g5 .fin-big{ font-size:42px; }
.laws .laws-t6 .fin-s{ font-family:var(--ftext); font-size:18px; line-height:1.3; color:var(--slate); margin-top:8px; text-wrap:pretty; }
.laws .laws-t6 .fin-body{ font-family:var(--ftext); font-size:19px; line-height:1.36; color:var(--slate); margin:12px 0 0; text-wrap:pretty; }
.laws .laws-t6 .g3 .fin-body, .laws .laws-t6 .g4 .fin-body, .laws .laws-t6 .g5 .fin-body{ font-size:18px; }
.laws .laws-t6 .fin-pts{ margin:12px 0 0; padding:0; list-style:none; display:flex; flex-direction:column; gap:8px; }
.laws .laws-t6 .fin-pts li{ font-family:var(--ftext); font-size:18px; line-height:1.3; color:var(--slate); padding-left:24px; position:relative; text-wrap:pretty; }
.laws .laws-t6 .fin-pts li::before{ content:""; position:absolute; left:4px; top:10px; width:7px; height:7px; border-radius:50%; background:var(--blue); }
.laws .laws-t6 .g4 .fin-pts{ gap:6px; }
.laws .laws-t6 .g4 .fin-pts li{ font-size:17px; line-height:1.26; }
/* свёрнутые ряды-референсы: t1 при ярусах 2–3, t2 при ярусе 3 */
.laws[data-tier="2"] .laws-t1 .rl-title,
.laws[data-tier="3"] .laws-t1 .rl-title,
.laws[data-tier="3"] .laws-t2 .rl-title{ display:none; }
.laws[data-tier="2"] .laws-t1 .rl-head,
.laws[data-tier="3"] .laws-t1 .rl-head,
.laws[data-tier="3"] .laws-t2 .rl-head{ margin-bottom:10px; }
.laws[data-tier="2"] .laws-t1 .lw-eb,
.laws[data-tier="3"] .laws-t1 .lw-eb,
.laws[data-tier="3"] .laws-t2 .lw-eb{ font-size:15px; margin-bottom:0; }
.laws[data-tier="2"] .laws-t1 .rl-controls,
.laws[data-tier="3"] .laws-t1 .rl-controls,
.laws[data-tier="3"] .laws-t2 .rl-controls{ display:none; }
.laws[data-tier="2"] .laws-t1 .rl-viewport,
.laws[data-tier="3"] .laws-t1 .rl-viewport,
.laws[data-tier="3"] .laws-t2 .rl-viewport{ -webkit-mask-image:none; mask-image:none; }
.laws[data-tier="2"] .laws-t1 .rl-track,
.laws[data-tier="3"] .laws-t1 .rl-track,
.laws[data-tier="3"] .laws-t2 .rl-track{ transform:none !important; width:100%; justify-content:center; gap:14px; }
.laws[data-tier="2"] .laws-t1 .rl-card,
.laws[data-tier="3"] .laws-t1 .rl-card,
.laws[data-tier="3"] .laws-t2 .rl-card{ width:160px; border-radius:14px; filter:none !important; opacity:1 !important; transform:none !important; }
.laws[data-tier="2"] .laws-t1 .lw-cap,
.laws[data-tier="3"] .laws-t1 .lw-cap,
.laws[data-tier="3"] .laws-t2 .lw-cap{ font-size:12px; padding:8px 10px; line-height:1.12; }
.laws[data-tier="2"] .laws-t1 .lw-cap .lw-sub,
.laws[data-tier="3"] .laws-t1 .lw-cap .lw-sub,
.laws[data-tier="3"] .laws-t2 .lw-cap .lw-sub{ display:none; }
.laws[data-tier="2"] .laws-t1 .lw-no,
.laws[data-tier="3"] .laws-t1 .lw-no,
.laws[data-tier="3"] .laws-t2 .lw-no{ display:none; }
/* универсальный свёрнутый ряд-референс (is-strip) — для любого яруса выше активного (вкл. 4-й) */
.laws .laws-tier.is-strip .rl-title{ display:none; }
.laws .laws-tier.is-strip .rl-head{ margin-bottom:10px; }
.laws .laws-tier.is-strip .lw-eb{ font-size:15px; margin-bottom:0; }
.laws .laws-tier.is-strip .rl-controls{ display:none; }
.laws .laws-tier.is-strip .rl-viewport{ -webkit-mask-image:none; mask-image:none; }
.laws .laws-tier.is-strip .rl-track{ transform:none !important; width:100%; justify-content:center; gap:14px; }
.laws .laws-tier.is-strip .rl-card{ width:150px; border-radius:14px; filter:none !important; opacity:1 !important; transform:none !important; }
.laws .laws-tier.is-strip .lw-cap{ font-size:12px; padding:8px 10px; line-height:1.12; }
.laws .laws-tier.is-strip .lw-cap .lw-sub{ display:none; }
.laws .laws-tier.is-strip .lw-no{ display:none; }
.laws .laws-tier.is-strip .lw-ghost-num{ font-size:44px; }
.laws .laws-tier.is-strip .lw-ghost-cap{ display:none; }

/* призрачная финальная карточка «+N законов» (неактивные, изучать не будем) — контрастная к светлому фону */
.laws .lw-ghost{ background:#26262b; border:1px dashed rgba(255,255,255,.22); box-shadow:16px 0 0 -1px #34343a, 32px 0 0 -2px #3f3f46; display:flex; align-items:center; justify-content:center; }
.laws .lw-ghost .lw-media, .laws .lw-ghost .lw-no, .laws .lw-ghost .lw-cap, .laws .lw-ghost .lw-more{ display:none; }
.laws .lw-ghost .lw-ghost-inner{ text-align:center; padding:0 56px; }
.laws .lw-ghost-num{ font-family:var(--fdisp); font-weight:600; font-size:172px; line-height:.88; letter-spacing:-0.04em; color:#c6c6cc; }
.laws .lw-ghost-cap{ font-family:var(--fdisp); font-weight:600; font-size:34px; letter-spacing:-0.01em; color:#8c8c94; margin-top:18px; }
.laws[data-tier="2"] .laws-t1 .lw-ghost-num,
.laws[data-tier="3"] .laws-t1 .lw-ghost-num,
.laws[data-tier="3"] .laws-t2 .lw-ghost-num{ font-size:44px; }
.laws[data-tier="2"] .laws-t1 .lw-ghost-cap,
.laws[data-tier="3"] .laws-t1 .lw-ghost-cap,
.laws[data-tier="3"] .laws-t2 .lw-ghost-cap{ display:none; }

/* ---------- слайд «Два проекта-примера» ---------- */
.projx{ flex-direction:column; justify-content:center; align-items:stretch; text-align:left; padding:0 140px; }
.projx-head{ margin-bottom:52px; }
.projx-eb{ font-family:var(--fdisp); font-weight:600; font-size:26px; letter-spacing:.16em; text-transform:uppercase; color:var(--graphite); margin-bottom:18px; }
.projx-title{ font-family:var(--fdisp); font-weight:600; font-size:88px; letter-spacing:-0.03em; line-height:1; color:var(--ink); }
.projx-title .blue, .projx-sub .blue{ color:var(--blue); }
.projx-sub{ font-family:var(--ftext); font-size:30px; color:var(--slate); margin-top:22px; }
.projx-grid{ display:grid; grid-template-columns:1fr 1fr; gap:40px; }
.projx-card{ margin:0; border-radius:26px; overflow:hidden; background:var(--white); border:1px solid var(--hair); box-shadow:0 30px 80px rgba(0,0,0,.10); }
.projx-media{ position:relative; aspect-ratio:16 / 9; overflow:hidden; background:#0b0b0f; }
.projx-media img{ width:100%; height:100%; object-fit:cover; display:block; }
.projx-media::before{ content:""; position:absolute; inset:0 0 auto 0; height:190px; background:linear-gradient(180deg, rgba(0,0,0,.5), rgba(0,0,0,0)); z-index:1; pointer-events:none; }
.projx-media .projx-logo{ position:absolute; top:30px; left:36px; z-index:2; height:82px; width:auto; max-width:66%; object-fit:contain; object-position:left center; filter:brightness(0) invert(1) drop-shadow(0 2px 12px rgba(0,0,0,.6)); }
.projx-no{ position:absolute; top:24px; right:30px; z-index:2; margin:0; font-family:var(--fdisp); font-weight:600; font-size:26px; color:#fff; text-shadow:0 2px 10px rgba(0,0,0,.55); }
.projx-bar{ display:flex; align-items:center; padding:24px 32px; }
.projx-camp{ font-family:var(--fdisp); font-weight:600; font-size:25px; letter-spacing:-0.01em; line-height:1.25; color:var(--ink); text-wrap:balance; }
.projx-camp-dim{ color:var(--slate); font-weight:500; }

/* «Подробнее» на активной технической карточке с детальной панелью */
.laws .laws-t2 .rl-card.has-detail,
.laws .laws-t3 .rl-card.has-detail,
.laws .laws-t6 .rl-card.has-detail{ cursor:pointer; }
.laws .lw-more{ position:absolute; right:44px; bottom:44px; z-index:3; font-family:var(--fdisp); font-weight:600; font-size:24px; color:var(--blue); opacity:0; transform:translateY(8px); transition:opacity .4s ease, transform .4s ease; }
.laws .laws-t2 .rl-card[data-active].has-detail .lw-more,
.laws .laws-t3 .rl-card[data-active].has-detail .lw-more,
.laws .laws-t6 .rl-card[data-active].has-detail .lw-more{ opacity:1; transform:none; }

/* ---------- детальная панель технического закона ---------- */
.laws-detail{ position:absolute; inset:0; z-index:40; display:flex; background:rgba(20,20,22,.34); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); opacity:0; pointer-events:none; transition:opacity .42s cubic-bezier(.4,0,.2,1); }
.laws-detail[data-open]{ opacity:1; pointer-events:auto; }
.laws-detail .ld-scroll{ margin:auto; width:1560px; max-height:948px; overflow-y:auto; background:var(--white); border:1px solid var(--hair); border-radius:30px; box-shadow:0 48px 130px rgba(0,0,0,.22); transform:translateY(18px) scale(.985); transition:transform .42s cubic-bezier(.4,0,.2,1); }
.laws-detail[data-open] .ld-scroll{ transform:none; }
.laws-detail .ld-body{ padding:52px 68px 60px; }
.laws-detail .ld-close{ position:absolute; top:44px; right:56px; z-index:2; width:60px; height:60px; border:none; border-radius:50%; background:rgba(255,255,255,.9); color:var(--ink); font-size:30px; line-height:1; cursor:pointer; box-shadow:0 6px 20px rgba(0,0,0,.14); transition:background .2s ease; }
.laws-detail .ld-close:hover{ background:#fff; }
.laws-detail .ld-eb{ font-family:var(--fdisp); font-weight:600; font-size:22px; letter-spacing:.16em; text-transform:uppercase; color:var(--graphite); }
.laws-detail .ld-title{ font-family:var(--fdisp); font-weight:600; font-size:64px; letter-spacing:-0.03em; line-height:1; color:var(--ink); margin-top:10px; }
.laws-detail .ld-def{ font-family:var(--ftext); font-size:26px; line-height:1.45; color:var(--slate); margin-top:18px; max-width:1240px; text-wrap:pretty; }
.laws-detail .ld-measure{ margin-top:28px; padding-top:24px; border-top:1px solid var(--hair); }
.laws-detail .ld-measure h3{ font-family:var(--fdisp); font-weight:600; font-size:26px; color:var(--ink); }
.laws-detail .ld-measure ul{ margin-top:12px; padding:0; list-style:none; display:flex; flex-direction:column; gap:8px; }
.laws-detail .ld-measure li{ font-family:var(--ftext); font-size:22px; line-height:1.4; color:var(--slate); padding-left:28px; position:relative; }
.laws-detail .ld-measure li::before{ content:""; position:absolute; left:4px; top:13px; width:8px; height:8px; border-radius:50%; background:var(--blue); }
.laws-detail .ld-levels{ margin-top:32px; display:grid; grid-template-columns:repeat(3, 1fr); gap:28px; }
.laws-detail .ld-lvl{ display:flex; flex-direction:column; }
.laws-detail .ld-deg{ font-family:var(--fdisp); font-weight:600; font-size:44px; letter-spacing:-0.03em; line-height:1; color:var(--ink); }
.laws-detail .ld-lname{ font-family:var(--fdisp); font-weight:600; font-size:22px; color:var(--blue); margin-top:6px; margin-bottom:14px; }
.laws-detail .ld-yt{ position:relative; aspect-ratio:16 / 9; border-radius:16px; overflow:hidden; background:#0b0b0f center/cover no-repeat; display:flex; align-items:center; justify-content:center; }
.laws-detail .ld-yt:not(.empty){ cursor:pointer; }
.laws-detail .ld-yt:not(.empty):hover .ld-play{ background:#c00; transform:scale(1.06); }
.laws-detail .ld-yt.empty{ background:var(--ash); }
.laws-detail .ld-yt.empty span{ font-family:var(--ftext); font-size:18px; letter-spacing:.14em; text-transform:uppercase; color:var(--graphite); opacity:.5; }
.laws-detail .ld-yt iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.laws-detail .ld-play{ width:76px; height:76px; border:none; border-radius:50%; background:rgba(0,0,0,.55); cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background .2s ease, transform .2s ease; }
.laws-detail .ld-play:hover{ background:#c00; transform:scale(1.06); }
.laws-detail .ld-play svg{ width:30px; height:30px; margin-left:4px; fill:#fff; }

/* ---------- лайтбокс с видео (крупное окно, не на весь экран) ---------- */
.laws .ld-video{ position:absolute; inset:0; z-index:60; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:22px; background:rgba(10,10,12,.82); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); opacity:0; pointer-events:none; transition:opacity .32s ease; }
.laws .ld-video[data-open]{ opacity:1; pointer-events:auto; }
.laws .ld-video-box{ position:relative; width:1180px; max-width:82%; aspect-ratio:16 / 9; border-radius:18px; overflow:hidden; background:#000; box-shadow:0 44px 120px rgba(0,0,0,.6); transform:scale(.96); transition:transform .32s cubic-bezier(.4,0,.2,1); }
.laws .ld-video[data-open] .ld-video-box{ transform:none; }
.laws .ld-video-frame{ position:absolute; inset:0; }
.laws .ld-video-frame iframe{ width:100%; height:100%; border:0; display:block; }
.laws .ld-video-close{ position:absolute; top:-66px; right:0; width:52px; height:52px; border:none; border-radius:50%; background:rgba(255,255,255,.94); color:#111; font-size:28px; line-height:1; cursor:pointer; z-index:2; box-shadow:0 6px 20px rgba(0,0,0,.3); }
.laws .ld-video-close:hover{ background:#fff; }
.laws .ld-video-yt{ display:inline-flex; align-items:center; gap:8px; font-family:var(--ftext); font-size:22px; color:#fff; text-decoration:none; padding:12px 24px; border:1px solid rgba(255,255,255,.4); border-radius:999px; background:rgba(255,255,255,.08); transition:background .2s ease; }
.laws .ld-video-yt:hover{ background:rgba(255,255,255,.18); }
.laws-detail .ld-film{ font-family:var(--fdisp); font-weight:600; font-size:15px; letter-spacing:.02em; color:var(--graphite); margin-top:12px; }
.laws-detail .ld-note{ font-family:var(--ftext); font-size:20px; line-height:1.4; color:var(--slate); margin-top:14px; text-wrap:pretty; }
.laws-detail .ld-bullets{ margin-top:18px; padding:0; list-style:none; display:flex; flex-direction:column; gap:12px; }
.laws-detail .ld-bullets li{ font-family:var(--ftext); font-size:20px; line-height:1.4; color:var(--slate); padding-left:26px; position:relative; text-wrap:pretty; }
.laws-detail .ld-bullets li::before{ content:""; position:absolute; left:2px; top:11px; width:7px; height:7px; border-radius:50%; background:var(--blue); }

/* ---------- термин / решётка ---------- */
.term h2{ font-size:96px; } .term .lead{ margin-top:26px; }
/* attention intelligence — три дисциплины, поднимаются снизу по пробелу */
.term.ai .disc{ display:grid; grid-template-columns:repeat(3, 360px); gap:48px; margin-top:78px; }
.term.ai .dcol{ text-align:left; border-top:3px solid var(--ink); padding-top:24px;
  opacity:0; transform:translateY(74px); filter:blur(8px);
  transition:opacity .6s ease, transform .78s cubic-bezier(.2,.7,.2,1), filter .6s ease; }
.term.ai .dcol.on{ opacity:1; transform:none; filter:none; }
.term.ai .dn{ font-family:var(--fdisp); font-weight:600; font-size:44px; color:var(--blue); line-height:1; }
.term.ai .dt{ font-family:var(--fdisp); font-weight:600; font-size:36px; margin-top:14px; }
.term.ai .dd{ font-size:24px; color:var(--slate); margin-top:12px; line-height:1.45; }
.term.ai .hint{ position:absolute; bottom:70px; left:50%; transform:translateX(-50%); font-family:var(--fdisp); font-weight:600; font-size:24px; letter-spacing:.04em; color:var(--graphite); opacity:0; transition:opacity .5s ease; }
[data-deck-active].term.ai .hint{ opacity:.7; }
.term.ai.complete .hint{ opacity:0; }
@media (prefers-reduced-motion: reduce){ .term.ai .dcol{ transition:none; } }
/* слайд 13 — визуал-фон (gif) + читаемый адаптивный текст */
.term.ai{ background:#0c0c14; color:#fff; }
.term.ai::before{ content:''; position:absolute; inset:0; z-index:0;
  background:url(../assets/ai-bg.gif) center/cover no-repeat; }
.term.ai::after{ content:''; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    radial-gradient(120% 92% at 50% 45%, rgba(8,8,16,.60), rgba(8,8,16,.26) 46%, rgba(8,8,16,.50) 100%),
    linear-gradient(180deg, rgba(8,8,16,.44), rgba(8,8,16,.28) 40%, rgba(8,8,16,.56)); }
.term.ai > *{ position:relative; z-index:2; }
.term.ai .eyebrow{ color:rgba(255,255,255,.80); }
.term.ai h2{ color:#fff; text-shadow:0 2px 34px rgba(0,0,0,.45); }
.term.ai .lead{ color:rgba(255,255,255,.88); text-shadow:0 1px 20px rgba(0,0,0,.4); }
.term.ai .dcol{ border-top-color:rgba(255,255,255,.62); }
.term.ai .dn{ color:#fff; }
.term.ai .dt{ color:#fff; }
.term.ai .dd{ color:rgba(255,255,255,.74); }
.term.ai .hint{ color:#fff; }
.lattice canvas{ position:absolute; inset:0; width:100%; height:100%; }
.lattice .veil{ position:absolute; inset:0; z-index:1; pointer-events:none; background:radial-gradient(58% 40% at 50% 48%, var(--fog) 0%, var(--fog) 30%, rgba(245,245,247,0) 74%); }
.lattice h2{ position:relative; z-index:2; font-size:92px; }
.lattice .lead{ position:relative; z-index:2; margin-top:22px; }

/* ---------- четыре подхода ---------- */
.appr{ align-items:flex-start; text-align:left; }
.appr h2{ font-size:60px; margin-bottom:54px; }
.appr .row{ display:flex; align-items:baseline; gap:44px; padding:24px 0; border-bottom:1px solid var(--hair); width:100%; max-width:1500px; }
.appr .row:last-child{ border-bottom:none; }
.appr .no{ font-family:var(--fdisp); font-weight:600; font-size:60px; width:110px; color:var(--slate); }
.appr .nm{ font-family:var(--fdisp); font-weight:600; font-size:52px; }
.appr .ds{ margin-left:auto; text-align:right; font-size:24px; color:var(--graphite); max-width:640px; }
/* методы размыты и проявляются по одному по пробелу */
.appr .row.mth{ opacity:0; filter:blur(13px); transform:translateY(22px);
  transition:opacity .6s ease, filter .7s ease, transform .78s cubic-bezier(.2,.7,.2,1); }
.appr .row.mth.on{ opacity:1; filter:none; transform:none; }
.appr .hint{ position:absolute; bottom:70px; left:50%; transform:translateX(-50%); font-family:var(--fdisp); font-weight:600; font-size:24px; letter-spacing:.04em; color:var(--graphite); opacity:0; transition:opacity .5s ease; }
[data-deck-active].appr .hint{ opacity:.7; }
.appr.complete .hint{ opacity:0; }
/* ---------- инструменты: айтрекинг → ЭЭГ ---------- */
.tools{ display:flex; flex-direction:column; align-items:center; justify-content:center; }
.tools .eyebrow{ font-family:var(--fdisp); font-weight:600; font-size:26px; letter-spacing:.16em; text-transform:uppercase; color:var(--graphite); margin-bottom:52px; }
.tools .tgrid{ display:flex; gap:56px; justify-content:center; align-items:stretch; }
.tools .tcard{ margin:0; width:640px; background:var(--white); border-radius:28px; overflow:hidden; text-align:left;
  opacity:0; transform:translateY(48px) scale(.97); filter:blur(10px);
  transition:opacity .7s ease, transform .9s cubic-bezier(.2,.7,.2,1), filter .7s ease; }
.tools .tcard.on{ opacity:1; transform:none; filter:none; }
.tools .tcard .ph{ width:100%; height:400px; overflow:hidden; background:var(--ash); }
.tools .tcard .ph img{ width:100%; height:100%; object-fit:cover; display:block; }
.tools .tcard figcaption{ padding:28px 32px 32px; }
.tools .tcard .tt{ font-family:var(--fdisp); font-weight:600; font-size:40px; letter-spacing:-0.01em; }
.tools .tcard .td{ margin-top:12px; font-size:24px; line-height:1.45; color:var(--slate); }
.tools .hint{ position:absolute; bottom:70px; left:50%; transform:translateX(-50%); font-family:var(--fdisp); font-weight:600; font-size:24px; letter-spacing:.04em; color:var(--graphite); opacity:0; transition:opacity .5s ease; }
[data-deck-active].tools .hint{ opacity:.7; }
.tools.complete .hint{ opacity:0; }
@media (prefers-reduced-motion: reduce){ .tools .tcard{ transition:none; opacity:1; transform:none; filter:none; } }
@media (prefers-reduced-motion: reduce){ .appr .row.mth{ transition:none; opacity:1; filter:none; transform:none; } }

/* ---------- вердикт по подходу (доп. слайды к «Четыре подхода») ---------- */
.verdict .vd-eb, .corr .vd-eb{ font-family:var(--fdisp); font-weight:600; font-size:26px; letter-spacing:.16em; text-transform:uppercase; color:var(--graphite); margin-bottom:44px; }
.verdict h2{ font-size:100px; line-height:1.06; max-width:1560px; text-wrap:balance; }
.verdict .vd-sub{ margin-top:46px; font-size:32px; line-height:1.5; color:var(--slate); max-width:1080px; text-wrap:pretty; }
.verdict .vd-big{ font-family:var(--fdisp); font-weight:600; font-size:220px; line-height:.9; letter-spacing:-0.04em; white-space:nowrap; }

/* ---------- корреляция ---------- */
.corr h2{ font-size:100px; }
.corr .cc{ display:flex; align-items:center; justify-content:center; gap:56px; margin-bottom:56px; position:relative; z-index:2; }
.corr .chart-card{ display:flex; flex-direction:column; align-items:center; }
.corr .chart{ width:500px; height:300px; }
.corr .chart .grid line{ stroke:var(--hair); stroke-width:1; }
.corr .chart .axis{ stroke:var(--graphite); stroke-width:1.6; }
.corr .chart .ytick text{ fill:var(--slate); font-family:var(--ftext); font-size:18px; text-anchor:end; }
.corr .chart .xtick text{ fill:var(--slate); font-family:var(--ftext); font-size:18px; text-anchor:middle; }
.corr .chart .line{ fill:none; stroke-width:3.5; stroke-linecap:round; stroke-linejoin:round; }
.corr .chart .line1{ stroke:var(--ink); } .corr .chart .line2{ stroke:var(--blue); }
.corr .chart .area{ stroke:none; }
.corr .chart .area1{ fill:var(--ink); opacity:.06; } .corr .chart .area2{ fill:var(--blue); opacity:.08; }
.corr .chart .dot1 circle{ fill:var(--white); stroke:var(--ink); stroke-width:2.5; }
.corr .chart .dot2 circle{ fill:var(--white); stroke:var(--blue); stroke-width:2.5; }
.corr .rel{ font-family:var(--fdisp); font-weight:600; font-size:112px; color:var(--blue); line-height:1; align-self:center; }
.corr .cc .lbl{ text-align:center; margin-top:18px; font-size:24px; color:var(--slate); }

/* ---------- чертёж / тезис ---------- */
.thesis{ display:flex; flex-direction:column; align-items:center; justify-content:center; }
.thesis .thesis-eb{ position:relative; z-index:2; font-family:var(--fdisp); font-weight:600; font-size:46px; letter-spacing:-0.01em; color:var(--slate); margin-bottom:30px; text-align:center; text-wrap:balance; }
.thesis .frame{ position:relative; padding:66px 90px; }
.thesis::before{ content:''; position:absolute; inset:0; z-index:0;
  background:url(../assets/thesis-bg.webp) center/cover no-repeat; }
.thesis::after{ content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:radial-gradient(72% 62% at 50% 52%, rgba(245,245,247,.74), rgba(245,245,247,.36) 58%, rgba(245,245,247,.10)); }
.thesis h2{ font-size:120px; max-width:1500px; position:relative; z-index:2; }
.thesis .dim{ position:absolute; inset:0; z-index:1; opacity:0; }
[data-deck-active].thesis .dim{ opacity:1; transition:opacity 1s ease .6s; }
.thesis .dim line,.thesis .dim path{ stroke:var(--hair); stroke-width:1.5; fill:none; }
.thesis .dim text{ fill:var(--graphite); font-family:var(--ftext); font-size:18px; letter-spacing:.1em; }

/* ---------- хук ---------- */
.hook h2{ font-size:96px; max-width:1500px; text-wrap:balance; } .hook .sub{ margin-top:26px; font-size:30px; color:var(--slate); }
/* ---------- небольшой перерыв ---------- */
.pause .breath{ position:absolute; left:50%; top:50%; width:560px; height:560px; margin:-280px 0 0 -280px; border-radius:50%; background:radial-gradient(circle, rgba(29,29,31,.07), rgba(29,29,31,0) 70%); z-index:0; }
@media (prefers-reduced-motion: no-preference){ [data-deck-active].pause .breath{ animation:breathe 6.5s ease-in-out infinite; } }
@keyframes breathe{ 0%,100%{ transform:scale(.82); opacity:.55; } 50%{ transform:scale(1.16); opacity:1; } }
.pause h2{ position:relative; z-index:2; font-size:112px; }
.pause .sub{ position:relative; z-index:2; margin-top:26px; font-size:34px; color:var(--slate); }
/* ---------- методология: ряд → поле текста → сборка в 2754 ---------- */
.method{ display:flex; align-items:center; justify-content:center; overflow:hidden; }
/* шаг 0 — направления как сетка-виджеты */
.method .mrow{ position:absolute; inset:0; z-index:3; display:grid; grid-template-columns:repeat(6, 1fr); grid-template-rows:repeat(8, 1fr); grid-auto-flow:row dense; gap:11px; padding:36px 56px 78px; box-sizing:border-box; counter-reset:mdir; transition:opacity .9s ease, transform 1.5s cubic-bezier(.5,0,.2,1), filter 1.1s ease; }
.method .mrow .mi{ position:relative; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:6px; padding:12px 15px; height:100%; box-sizing:border-box; border:1px solid var(--hair); border-radius:14px; background:var(--white); overflow:hidden; transition:filter .8s ease, opacity .8s ease, transform .8s ease, border-color .6s ease; }
.method .mrow .mi::before{ counter-increment:mdir; content:counter(mdir, decimal-leading-zero); font-family:var(--fdisp); font-weight:600; font-size:12px; color:var(--blue); }
.method .mrow .mi .t{ font-family:var(--fdisp); font-weight:600; font-size:15px; line-height:1.08; letter-spacing:-0.01em; color:var(--ink); text-wrap:balance; }
/* периферия — приглушена (их «много»); ядро (наши 8) — по центру и ярче */
.method .mrow > .mi{ background:var(--ash); border-color:transparent; }
.method .mrow > .mi .t{ color:var(--slate); }
.method .mrow > .mi::before{ color:var(--graphite); opacity:.6; }
.method .mcore{ grid-column:2 / 6; grid-row:4 / 6; z-index:2; display:grid; grid-template-columns:repeat(4, 1fr); grid-template-rows:repeat(2, 1fr); gap:12px; transition:transform 1s cubic-bezier(.4,0,.2,1); }
.method .mcore .mi{ background:var(--white); border-color:var(--hair); box-shadow:0 10px 30px rgba(0,0,0,.07); }
.method .mcore .mi .t{ font-size:19px; color:var(--ink); }
.method .mcore .mi::before{ font-size:13px; }
/* шаг 1 — периферия размывается, ядро остаётся резким и в центре */
.method.blurred .mrow > .mi{ filter:blur(9px) saturate(.9); opacity:.3; }
.method.blurred .mcore{ transform:scale(1.05); }
.method.blurred .mcore .mi{ box-shadow:0 16px 46px rgba(0,0,0,.13); }
.method.field .mrow, .method.count .mrow{ opacity:0; transform:scale(1.6); filter:blur(9px); pointer-events:none; }
/* шаг 1 — камера отъезжает: гигантская стена текста заполняет и затемняет весь экран */
.method .mwall{ position:absolute; left:50%; top:50%; z-index:2; width:9600px; height:3756px; column-width:150px; column-gap:10px; column-fill:auto; font-family:var(--ftext); font-size:16px; line-height:1.4; color:var(--ink); overflow:hidden;
  opacity:0; transform-origin:50% 50%; transform:translate(-50%,-50%) scale(1); will-change:transform, opacity;
  transition:transform 4s cubic-bezier(.42,0,.12,1), opacity 1.1s ease; }
.method .mwall .wl{ break-inside:avoid; white-space:nowrap; overflow:hidden; text-overflow:clip; }
.method.field .mwall{ opacity:1; transform:translate(-50%,-50%) scale(.32); }
.method.count .mwall{ opacity:0; transform:translate(-50%,-50%) scale(.2); transition:transform 1s cubic-bezier(.5,0,.2,1), opacity .5s ease; }
/* шаг 2 — частицы собираются в число 2754 */
.method .mcanvas{ position:absolute; inset:0; z-index:4; width:100%; height:100%; opacity:0; transition:opacity .3s ease; pointer-events:none; }
.method.count .mcanvas{ opacity:1; }
.method .mnum-word{ position:absolute; left:50%; top:50%; z-index:5; transform:translate(-50%, 250px); font-family:var(--fdisp); font-weight:600; font-size:92px; letter-spacing:-0.01em; color:var(--ink); opacity:0; transition:opacity .7s ease .45s; }
.method.count .mnum-word{ opacity:1; }
.method .hint{ position:absolute; bottom:70px; left:50%; transform:translateX(-50%); font-family:var(--fdisp); font-weight:600; font-size:24px; letter-spacing:.04em; color:var(--graphite); opacity:0; z-index:5; transition:opacity .5s ease; }
[data-deck-active].method .hint{ opacity:.7; }
.method.count .hint{ opacity:0; }

/* ---------- 5 секунд (тёмный таймер) ---------- */
.timer .ring{ width:200px; height:200px; margin-bottom:56px; }
.timer .ring circle{ fill:none; stroke:#20202a; stroke-width:5; }
.timer .ring .run{ stroke:var(--blue); stroke-linecap:round; stroke-dasharray:596; stroke-dashoffset:0; transform:rotate(-90deg); transform-origin:center; }
[data-deck-active].timer .ring .run{ animation:deplete 5s linear forwards; }
@keyframes deplete{ from{ stroke-dashoffset:0;} to{ stroke-dashoffset:596;} }
.timer h2{ font-size:96px; color:#f5f5f7; }

/* ---------- находит своих ---------- */
.finds canvas{ position:absolute; inset:0; width:100%; height:100%; }
.finds h2{ position:relative; z-index:2; font-size:100px; }

/* ---------- дырявое ведро ---------- */
.bucket{ flex-direction:row; justify-content:center; gap:160px; }
.bucket .txt{ text-align:left; max-width:560px; }
.bucket h2{ font-size:76px; } .bucket .small{ margin-top:22px; }
.bucket .vessel{ position:relative; width:540px; height:600px; flex:0 0 auto; }
.bucket .water{ position:absolute; inset:0; z-index:1; clip-path:polygon(22% 15%,78% 15%,70% 87%,30% 87%); }
.bucket .fill{ position:absolute; left:0; right:0; bottom:0; height:0; background:var(--blue); opacity:.92; transition:height 2.4s cubic-bezier(.5,0,.2,1); }
[data-deck-active].bucket .fill{ height:72%; }
.bucket .outline{ position:absolute; inset:0; width:100%; height:100%; z-index:2; overflow:visible; }
.bucket .stream{ position:absolute; width:7px; height:0; border-radius:999px; background:var(--blue); opacity:0; transform-origin:top center; z-index:1; }
.bucket .s1{ left:32%; top:70%; transform:rotate(-16deg);} .bucket .s2{ left:49.5%; top:85%;} .bucket .s3{ left:67%; top:70%; transform:rotate(16deg);}
[data-deck-active].bucket .stream{ animation:leak .7s ease forwards; }
[data-deck-active].bucket .s1{ animation-delay:1.3s;} [data-deck-active].bucket .s2{ animation-delay:1.6s;} [data-deck-active].bucket .s3{ animation-delay:1.9s;}
@keyframes leak{ from{ opacity:0; height:0;} to{ opacity:.85; height:110px;} }
.bucket .leak{ position:absolute; font-family:var(--fdisp); font-weight:600; font-size:24px; color:var(--blue); white-space:nowrap; opacity:0; z-index:3; }
.bucket .l1{ left:0; top:80%; transform:translateX(-112%);} .bucket .l2{ left:50%; top:103%; transform:translateX(-50%);} .bucket .l3{ right:0; top:80%; transform:translateX(112%);}
[data-deck-active].bucket .leak{ animation:bkf .6s ease forwards; }
[data-deck-active].bucket .l1{ animation-delay:1.3s;} [data-deck-active].bucket .l2{ animation-delay:1.6s;} [data-deck-active].bucket .l3{ animation-delay:1.9s;}
@keyframes bkf{ to{ opacity:1; } }

/* ---------- слои ---------- */
.layers{ flex-direction:row; justify-content:center; gap:150px; }
.layers .txt{ text-align:left; max-width:620px; } .layers h2{ font-size:80px; } .layers .small{ margin-top:22px; }
.layers .stack{ flex:0 0 520px; height:440px; position:relative; }
.layers .lyr{ position:absolute; left:30px; top:20px; width:460px; height:150px; border-radius:22px; background:rgba(255,255,255,.94); border:1px solid var(--hair); display:flex; align-items:flex-start; padding:22px 28px; font-family:var(--fdisp); font-weight:600; font-size:26px; color:var(--slate); opacity:0; transform:translateY(40px); }
[data-deck-active].layers .lyr{ opacity:1; transition:transform .9s cubic-bezier(.4,0,.2,1), opacity .7s ease; }
[data-deck-active].layers .l0{ transform:translateY(0);} [data-deck-active].layers .l1{ transform:translateY(64px); transition-delay:.12s;}
[data-deck-active].layers .l2{ transform:translateY(128px); transition-delay:.24s;} [data-deck-active].layers .l3{ transform:translateY(192px); transition-delay:.36s;}
.layers .l3{ color:var(--blue); border-color:rgba(0,113,227,.35); }

/* ---------- валюта / спасибо ---------- */
.currency h2{ font-size:130px; }
.thanks h2{ font-size:170px; }
[data-deck-active].thanks .evap{ animation:evap 2.6s ease 1.4s forwards; }
@keyframes evap{ to{ opacity:0; filter:blur(24px); transform:translateY(-30px) scale(1.04); } }

/* ---------- продукт ---------- */
.prod .card{ background:var(--white); border-radius:28px; padding:88px 100px; width:1120px; }
.prod h2{ font-size:92px; margin-bottom:24px; } .prod .lead{ margin:0 auto 46px; color:var(--slate); max-width:760px; }
.prod .cta{ display:flex; justify-content:center; opacity:0; }
[data-deck-active].prod .cta{ opacity:1; transition:opacity .8s ease 1s; }