/* ============================================================
   „За мен“: сцените (по „Никой“ от прототипа). Само черно, бяло и топло светло.
   Променливи (CSS на страницата може да ги смени):
     --nk-warm  топлото светло (#F2F0EB)   --nk-ink  черното (#121212)   --nk-dim  тихият текст
     --len      дължината на сцената (от полето „Дължина“)
   zamen.js слага на всяка сцена числа от 0 до 1 (докъде е стигнал скролът в нея) като променливи;
   при „намалено движение“ сцената е с data-static и стои в крайния си вид.
   Селекторите са поне (0,2,0), защото .pfx нулира стиловете на Salient.
   ============================================================ */

.pfx.nk { --nk-warm: #F2F0EB; --nk-ink: #121212; --nk-dim: rgba(18, 18, 18, .55); margin: 0; background: var(--nk-warm); color: var(--nk-ink); font-size: 17px; line-height: 1.6; font-weight: 400; }
.pfx.nk :where(p, li) { font-size: inherit; line-height: inherit; }

/* ---------- лепкавата сцена: висока секция, а кадърът стои закачен горе ---------- */
.pfx.nk-scene { position: relative; height: var(--len, 300svh); }
.pfx.nk-scene > .sc-stage { position: sticky; top: 0; height: 100svh; overflow: clip; }

/* думите на цитатите (разделя ги скриптът): светват една след друга (--q) */
.pfx .sc-qw { display: inline-block; margin-right: .24em; opacity: calc(.12 + var(--q, 0) * .88); }
.pfx .sc-qw.b { font-weight: 800; }
/* думи, които изобщо не се виждат, докато не дойде редът им */
.pfx .nk-hidden .sc-qw { opacity: var(--q, 0); filter: blur(calc((1 - var(--q, 0)) * 8px)); transform: translateY(calc((1 - var(--q, 0)) * .3em)); }
/* докато скриптът не е разделил думите, цитатът не се показва (иначе би примигнал) */
[data-js] .pfx.nk .nk-hidden:not([data-split]) { visibility: hidden; }

/* ---------- фон-текстура на цял екран ---------- */
.pfx .tex { position: absolute; inset: 0; overflow: clip; container-type: size; pointer-events: none; }
.pfx.nk .tex img { position: absolute; left: 50%; top: 50%; width: 100%; height: 100%; max-width: none; margin: 0; object-fit: cover; translate: -50% -50%; }
/* вертикалната снимка на широк екран: обърната на 90° (ширината ѝ става височина), по желание и огледана */
@media (orientation: landscape) {
  .pfx.nk .tex[data-tall] img { width: 100cqh; height: 100cqw; rotate: 90deg; }
  .pfx.nk .tex[data-tall][data-flip] img { scale: -1 1; }
}

/* ---------- снимка на цял екран, черно-бяла ---------- */
.pfx :is(.nk-hero-bg, .nk-num-ph, .nk-cta-bg, .nk-idle-ph) { position: absolute; inset: 0; overflow: clip; pointer-events: none; }
.pfx.nk :is(.nk-hero-bg, .nk-num-ph, .nk-cta-bg, .nk-idle-ph) img { width: 100%; height: 100%; max-width: none; margin: 0; object-fit: cover; filter: grayscale(1) contrast(1.05); }

/* ===== I. някой → никой ===== */
.pfx.nk-someone .sc-stage { display: grid; place-items: center; background: var(--nk-warm); }
/* бледата снимка зад името: при скрол се скрива навътре в тунела */
.pfx .nk-hero-bg { opacity: calc(.22 * (1 - var(--h, 0))); }
.pfx.nk .nk-hero-bg img { object-position: 50% 46%; transform-origin: 49% 46%; transform: scale(calc(1.02 + var(--h, 0) * 1.5)); }
/* фонът-текстура идва, докато името изчезва */
.pfx .nk-tex-hero { opacity: calc(var(--to, .9) * var(--tx, 0)); }
.pfx :is(.nk-name, .nk-who) { grid-area: 1 / 1; position: relative; z-index: 1; }
.pfx .nk-name { display: flex; flex-direction: column; align-items: center; text-align: center; font-size: clamp(46px, 8.6vw, 168px); line-height: .95; letter-spacing: -.055em; font-weight: 700; opacity: calc(1 - var(--a, 0)); filter: blur(calc(var(--a, 0) * 14px)); transform: translateY(calc(var(--a, 0) * -.4em)); }
.pfx .nk-name .thin { font-size: .42em; letter-spacing: -.03em; margin-bottom: .1em; font-weight: 200; }
.pfx .nk-name b { font-weight: 900; }
.pfx .nk-who { display: flex; align-items: baseline; font-size: clamp(90px, 21vw, 420px); line-height: 1; letter-spacing: -.06em; font-weight: calc(900 - var(--k, 0) * 800); opacity: var(--b, 0); filter: blur(calc((1 - var(--b, 0)) * 18px)); transform: translateY(calc((1 - var(--b, 0)) * .12em)); }
/* преди скрипта (и без него) се вижда само втората дума */
.pfx .nk-who .nk-w-from { display: none; }
.pfx .nk-flip { display: inline-grid; perspective: 600px; }
.pfx .nk-flip i { grid-area: 1 / 1; font-style: normal; text-align: center; transform-origin: 50% 60%; backface-visibility: hidden; }
/* първо „я“ се обръща и изчезва, после „и“ се обръща на мястото ѝ */
.pfx .nk-flip .ya { transform: rotateX(calc(min(var(--k, 0) * 2, 1) * 90deg)); opacity: calc(1 - min(var(--k, 0) * 2, 1)); }
.pfx .nk-flip .ii { transform: rotateX(calc((1 - max(var(--k, 0) * 2 - 1, 0)) * -90deg)); opacity: max(var(--k, 0) * 2 - 1, 0); }
.pfx .nk-q { position: absolute; left: var(--pad); right: var(--pad); bottom: clamp(50px, 11vh, 120px); text-align: center; font-size: clamp(22px, 2.6vw, 44px); line-height: 1.2; letter-spacing: -.03em; font-weight: 200; }

/* ===== II. уязвим → себе си: портрет от разпилени парчета, които се сглобяват ===== */
.pfx.nk-vuln .sc-stage { display: flex; align-items: center; background: var(--nk-ink); color: #F2F0EB; }
/* пръстта: постоянно, без избледняване */
.pfx .nk-tex-vuln { opacity: var(--to, .8); }
.pfx.nk .nk-tex-vuln img { filter: brightness(1.5) contrast(1.05); }
.pfx .nk-vuln-in { position: relative; display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(30px, 6vw, 110px); align-items: center; }
.pfx .nk-vuln-q { font-size: clamp(30px, 4.2vw, 76px); line-height: 1.06; letter-spacing: -.045em; font-weight: 200; }
/* парчетата се появяват чак когато започне сглобяването (--ti), после се събират (--qe) */
.pfx .nk-tiles { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: repeat(3, minmax(0, 1fr)); gap: calc((1 - var(--qe, 0)) * 22px); aspect-ratio: 4 / 5; width: min(86%, 480px); justify-self: center; opacity: var(--ti, 0); }
.pfx .nk-tile { position: relative; overflow: clip; transform: translate(calc(var(--dx) * (1 - var(--qe, 0)) * 1%), calc(var(--dy) * (1 - var(--qe, 0)) * 1%)) rotate(calc(var(--r) * (1 - var(--qe, 0)) * 1deg)); will-change: transform; }
.pfx .nk-tile.is-miss { opacity: clamp(0, calc(var(--qe, 0) * 2.2 - 1.2), 1); }
.pfx.nk .nk-tile img { position: absolute; left: calc(var(--c) * -100%); top: calc(var(--w) * -100%); width: 300%; height: 300%; max-width: none; margin: 0; object-fit: cover; object-position: var(--pos, 50% 22%); filter: grayscale(1) contrast(1.08); }
/* когато парчетата се съберат, отгоре се появява цялата снимка, за да няма шевове */
.pfx .nk-tile-full { position: absolute; inset: 0; z-index: 1; opacity: clamp(0, calc((var(--qe, 0) - .95) * 22), 1); pointer-events: none; }
.pfx.nk .nk-tile-full img { width: 100%; height: 100%; max-width: none; margin: 0; object-fit: cover; object-position: var(--pos, 50% 22%); filter: grayscale(1) contrast(1.08); }
/* светлият квадрат: обръща снимката под себе си */
.pfx .nk-tile-mark { position: absolute; z-index: 2; left: -15%; bottom: 9%; width: 33.4%; aspect-ratio: 1; background: #F2F0EB; mix-blend-mode: difference; transform: translate(calc((1 - var(--qe, 0)) * -70%), calc((1 - var(--qe, 0)) * 50%)); }

/* ===== III. числата ===== */
.pfx.nk-nums .sc-stage { display: grid; place-items: center; background: #fff; }
/* отдолу прелива в бяло, за да се слее със „Старанието“ (тя прелива в бяло отгоре) */
.pfx.nk-nums .sc-stage::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; z-index: 1; height: 30%; background: linear-gradient(to bottom, rgba(255, 255, 255, 0), #fff); pointer-events: none; }
/* зад всяко число бледа снимка, която бавно се приближава */
.pfx .nk-num-phs { position: absolute; inset: 0; }
.pfx .nk-num-ph { opacity: 0; transition: opacity 1.4s var(--ease); }
.pfx .nk-num-ph[data-on] { opacity: .2; }
.pfx.nk .nk-num-ph img { transform: scale(1.1); transition: transform 7s var(--ease-out); }
.pfx.nk .nk-num-ph[data-on] img { transform: none; }
.pfx .nk-num { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; text-align: center; }
.pfx .nk-num-n { font-size: clamp(150px, 34vw, 600px); line-height: .82; letter-spacing: -.08em; font-weight: calc(100 + var(--w, 0) * 800); font-variant-numeric: tabular-nums; }
.pfx .nk-num-ls { display: grid; margin-top: clamp(10px, 2vh, 24px); }
.pfx .nk-num-l { grid-area: 1 / 1; font-size: clamp(18px, 2vw, 30px); line-height: 1.6; font-weight: 300; letter-spacing: -.01em; opacity: 0; transform: translateY(12px); transition: opacity .7s var(--ease-out), transform .9s var(--ease-out); }
.pfx .nk-num-l[data-on] { opacity: 1; transform: none; }
.pfx .nk-ticks { position: absolute; z-index: 1; left: 0; right: 0; bottom: clamp(70px, 13vh, 130px); display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 10px; }
.pfx .nk-tick { height: 2px; background: rgba(18, 18, 18, .14); }
.pfx .nk-tick::after { content: ''; display: block; height: 100%; background: var(--nk-ink); transform: scaleX(0); transform-origin: left; transition: transform 1s var(--ease-out); }
.pfx .nk-tick[data-on]::after { transform: none; }
.pfx .nk-wink { position: absolute; left: 0; right: 0; bottom: clamp(26px, 5vh, 50px); text-align: center; font-size: 15px; line-height: 1.6; font-style: italic; font-weight: 300; color: var(--nk-dim); opacity: var(--end, 0); }

/* ===== IV. старанието определя нивото: нивото (вода) се покачва и носи думата ===== */
.pfx.lv { --lv-bg: #fff; --lv-water: #2AC4EA; --lv-ink: #0B2530; --lv-dot: #2AC4EA; --lv-sub: #0B2530; --lv-text: #16181B; }
.pfx.lv-ink { --lv-bg: #F2F0EB; --lv-water: #121212; --lv-ink: #121212; --lv-dot: #121212; --lv-sub: #F2F0EB; --lv-text: #121212; }
.pfx.lv .sc-stage { background: var(--lv-bg); color: var(--lv-text); }
.pfx .lv-t { position: relative; z-index: 2; display: flex; flex-direction: column; padding-top: clamp(110px, 16vh, 180px); font-size: clamp(46px, 8.4vw, 160px); line-height: .96; letter-spacing: -.055em; font-weight: 200; transition: color .6s; }
/* фон-текстура зад всичко; прелива в бяло отгоре, за да се слее с предишната секция */
.pfx .lv-tex { opacity: var(--to, .9); }
.pfx .lv-fade { position: absolute; left: 0; right: 0; top: 0; height: 32%; background: linear-gradient(#fff, rgba(255, 255, 255, 0)); pointer-events: none; }
.pfx .lv-water { position: absolute; left: 0; right: 0; bottom: 0; z-index: 1; height: calc(var(--lv, 0) * 100%); background: var(--lv-water); }
.pfx .lv-water::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 2px; background: var(--lv-ink); opacity: .35; }
/* думата плава върху нивото, докато стигне под текста; после нивото я залива и продължава нагоре */
.pfx .lv-word { position: absolute; left: var(--pad); z-index: 2; bottom: calc(var(--rise, 0px) - .14em); font-size: clamp(64px, 15vw, 290px); line-height: 1; font-weight: 800; letter-spacing: -.06em; color: var(--lv-ink); transition: color .6s; }
.pfx .lv-word span { color: var(--lv-dot); transition: color .6s; }
.pfx.lv[data-sub] .lv-word, .pfx.lv[data-sub] .lv-word span { color: var(--lv-sub); }
/* черно-бялото: горният текст се „обръща“ спрямо фона; думата е тъмна, докато плава, а светлото ѝ
   копие се показва отдолу нагоре само в потопената част и чак когато водата започне да я залива */
.pfx.lv-ink .sc-stage { isolation: isolate; }
.pfx.lv-ink .lv-t { color: #F2F0EB; mix-blend-mode: difference; }
.pfx.lv-ink .lv-word, .pfx.lv-ink .lv-word span, .pfx.lv-ink[data-sub] .lv-word, .pfx.lv-ink[data-sub] .lv-word span { color: #121212; }
.pfx.lv-ink .lv-word-sub, .pfx.lv-ink .lv-word-sub span, .pfx.lv-ink[data-sub] .lv-word-sub, .pfx.lv-ink[data-sub] .lv-word-sub span { color: #F2F0EB; }
.pfx .lv-word-sub { clip-path: inset(var(--cut, 100%) 0 0 0); opacity: var(--so, 0); pointer-events: none; }
.pfx.lv-ink .lv-ruler { mix-blend-mode: difference; }
.pfx.lv-ink .lv-ruler i, .pfx.lv-ink[data-sub] .lv-ruler i { background: #F2F0EB; }
.pfx .lv-ruler { position: absolute; right: var(--pad); top: 12vh; bottom: 8vh; z-index: 2; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-end; }
.pfx .lv-ruler i { width: 14px; height: 1px; background: var(--lv-ink); opacity: .5; }
.pfx .lv-ruler i.is-long { width: 34px; opacity: .8; }

/* ===== V. аз съм ===== */
.pfx.nk-iam .sc-stage { background: var(--nk-ink); color: #fff; }
.pfx .nk-photos { position: absolute; inset: 0; }
/* всяка снимка е процеп, който се разтваря от линия: рамката се разтяга по височина (--k), а снимката
   вътре се свива обратно (--ik), затова не се изкривява. Двете светли линии са ръбовете на процепа. */
.pfx .nk-fr { position: absolute; inset: 0; pointer-events: none; }
.pfx .nk-fr-in { position: absolute; inset: 0; overflow: clip; transform: scaleY(var(--k, 0)); will-change: transform; }
.pfx .nk-fr[data-off] .nk-fr-in { visibility: hidden; }
.pfx.nk .nk-fr-in img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; margin: 0; object-fit: cover; object-position: 50% 30%; filter: grayscale(1) contrast(1.06); transform: scaleY(var(--ik, 1)) scale(calc(1.1 - var(--k, 0) * .06)); will-change: transform; }
.pfx .nk-fr-in::after { content: ''; position: absolute; inset: 0; background: rgba(0, 0, 0, .32); }
.pfx .nk-fr-l { position: absolute; left: 0; right: 0; top: 50%; height: 1px; background: #F2F0EB; opacity: calc(var(--lo, 0) * .75); transform-origin: var(--lx, 0%) 50%; transform: translateY(calc(var(--hk, 0px) * -1)) scaleX(var(--lw, 0)); will-change: transform; }
.pfx .nk-fr-b { transform: translateY(var(--hk, 0px)) scaleX(var(--lw, 0)); }
.pfx .nk-iam-t { position: absolute; left: 0; right: 0; bottom: clamp(50px, 11vh, 120px); z-index: 10; display: flex; flex-direction: column; font-size: clamp(44px, 7.6vw, 150px); line-height: .98; letter-spacing: -.055em; font-weight: 700; }
.pfx .nk-iam-a { opacity: var(--az, 0); }
.pfx .nk-roles { display: grid; justify-items: start; }
/* думата стои на мястото си: изписва се с отварянето и гасне със затварянето */
.pfx .nk-role { grid-area: 1 / 1; font-weight: 200; font-style: italic; opacity: var(--fo, 1); }
.pfx .nk-role[data-off] { visibility: hidden; }
/* изписва се отляво надясно, като с писалка */
.pfx .nk-role-w { display: inline-block; clip-path: inset(-.3em calc((1 - var(--w, 0)) * 106% - .15em) -.35em -.15em); }
.pfx .nk-iam-n { position: absolute; left: 0; right: 0; top: clamp(110px, 16vh, 150px); z-index: 10; text-align: right; font-size: 12px; line-height: 1.6; font-weight: 500; letter-spacing: .3em; opacity: .6; }
.pfx .nk-iam-n b { font-weight: 800; }

/* ===== VI. светлина през открехната врата: линии, лъчи, прах и път към прага ===== */
.pfx.nk-door .sc-stage { background: #070707; color: #F2F0EB; }
/* „камерата“ върви към вратата: цялата стая се уголемява около прага */
.pfx .nk-room { position: absolute; inset: 0; transform-origin: var(--ox, 63%) var(--oy, 50%); transform: scale(calc(1 + var(--c, 0) * 3.4)); will-change: transform; }
.pfx.nk .nk-room-svg { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; overflow: visible; }
.pfx .nk-rays { opacity: calc(var(--l, 0) * .55); mix-blend-mode: screen; }
.pfx .nk-ray { fill-opacity: .5; animation: nk-ray 6s ease-in-out var(--d, 0s) infinite alternate; }
@keyframes nk-ray { from { fill-opacity: .2; } to { fill-opacity: .75; } }
.pfx.nk .nk-dust { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; pointer-events: none; }
/* стилизирана врата: тънка двойна рамка, гладко черно крило, светлина под прага */
.pfx .nk-portal { position: absolute; left: var(--px, 55%); top: var(--py, 30%); width: var(--pw, 150px); height: var(--ph, 320px); box-shadow: 0 0 0 1px rgba(242, 240, 235, calc(.3 + var(--l, 0) * .3)); perspective: 900px; }
.pfx .nk-portal::before { content: ''; position: absolute; inset: -14px -14px 0; border: 1px solid rgba(242, 240, 235, calc(.1 + var(--l, 0) * .14)); border-bottom: 0; pointer-events: none; }
.pfx .nk-glow { position: absolute; inset: 0; background: #fff; opacity: calc(.12 + var(--l, 0) * .88); box-shadow: 0 0 calc(30px + var(--l, 0) * 200px) calc(var(--l, 0) * 40px) rgba(255, 255, 255, calc(.1 + var(--l, 0) * .5)); }
/* крилото е гладко, само с тънка светла линия по отварящия се ръб; отваря се към нас */
.pfx .nk-leaf { position: absolute; inset: 0; background: #0B0B0B; transform-origin: 0 50%; transform: rotateY(calc(var(--o, 0) * -82deg)); }
.pfx .nk-leaf::after { content: ''; position: absolute; right: 0; top: 0; bottom: 0; width: 1px; background: #F2F0EB; opacity: calc(.18 + var(--o, 0) * .7); }
.pfx .nk-sill { position: absolute; left: 2%; right: 2%; bottom: -1px; height: 2px; background: #fff; opacity: calc(.4 + var(--l, 0) * .6); box-shadow: 0 0 14px 2px rgba(255, 255, 255, .45); }
/* подът се усеща чак когато светлината го докосне; петното пропълзява от прага до долу */
.pfx .nk-floorline { stroke: #F2F0EB; stroke-width: 1; stroke-opacity: calc(.08 + var(--l, 0) * .14); }
.pfx .nk-floor { opacity: calc(.15 + var(--l, 0) * .85); mix-blend-mode: screen; }
/* накрая минаваме през прага: всичко става бяло от вратата навън */
.pfx .nk-flood { position: absolute; inset: 0; z-index: 2; background: #fff; clip-path: circle(calc(var(--w, 0) * 150%) at var(--ox, 63%) var(--oy, 50%)); }
/* фонът зад вратата: голям колкото екрана и подравнен с него; стаята го уголемява заедно с вратата,
   а обратното смаляване оставя само леко приближаване (1 + c * .25), за дълбочина */
.pfx .nk-beyond { position: absolute; inset: 0; overflow: clip; opacity: calc(var(--o, 0) * (1 - var(--f, 0))); }
.pfx .tex.nk-tex-in { inset: auto; left: calc(-1 * var(--px, 0px)); top: calc(-1 * var(--py, 0px)); width: var(--sw, 100vw); height: var(--sh, 100svh); transform-origin: var(--ox, 63%) var(--oy, 50%); transform: scale(calc((1 + var(--c, 0) * .25) / (1 + var(--c, 0) * 3.4))); opacity: var(--to, .9); }
/* същият фон в същия мащаб идва с бялата светлина (в същия кръг) и накрая е сам на екрана; после избледнява до бяло (--f) */
.pfx .tex.nk-tex-door { z-index: 2; opacity: calc(var(--to, .9) * (1 - var(--f, 0))); clip-path: circle(calc(var(--w, 0) * 150%) at var(--ox, 63%) var(--oy, 50%)); transform-origin: var(--ox, 63%) var(--oy, 50%); transform: scale(calc(1 + var(--c, 0) * .25)); }
/* текстът е „обратен“ на фона: светъл в тъмното, тъмен върху светлата врата и в бялото накрая */
.pfx .nk-door-q { position: absolute; left: 0; right: 0; top: clamp(110px, 15vh, 160px); z-index: 3; padding-right: 40vw; font-size: clamp(28px, 3.6vw, 64px); line-height: 1.08; letter-spacing: -.04em; font-weight: 200; color: #F2F0EB; mix-blend-mode: difference; }

/* ===== VII. шумът утихва до тишина ===== */
.pfx.nk-silence .sc-stage { background: #fff; color: var(--nk-ink); }
/* без фон, докато линиите се изправят; фонът идва с мандалата */
.pfx .nk-tex-calm { opacity: calc(var(--to, .9) * var(--m, 0)); }
.pfx.nk .nk-noise { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; }
/* мандалата изниква от точката, в която се е свила линията (средата), и изпълва целия кадър */
.pfx .nk-mandala-w { position: absolute; left: 50%; top: 50%; width: 118vmax; opacity: clamp(0, calc(var(--m, 0) * 5), 1); transform: translate(-50%, -50%) scale(var(--m, 0)); }
/* без will-change: иначе браузърът я рисува веднъж, докато е мъничка, и после само я увеличава (назъбено) */
.pfx .nk-mandala-w .pfx-mandala { --mw: 1.1; --m-step: 60ms; --m-dur: .9s; width: 100%; max-width: none; color: rgba(18, 18, 18, .42); }
/* тук мандалата се изрисува много по-бързо (появяването ѝ остава същото) */
.pfx .nk-mandala-w .pfx-mandala .m-ring { transition-duration: .5s; }
.pfx .nk-silence-q { position: absolute; left: 0; right: 0; bottom: clamp(44px, 9vh, 100px); z-index: 1; max-width: 1000px; margin-inline: auto; text-align: center; font-size: clamp(22px, 2.4vw, 40px); line-height: 1.2; letter-spacing: -.03em; font-weight: 300; text-shadow: 0 0 6px #fff, 0 0 18px #fff, 0 0 30px #fff; }

/* ===== VIII. безделието уморява: буквите са прозорци към снимката, после влизаме в първата ===== */
.pfx.nk-idle .sc-stage { background: #000; color: #fff; isolation: isolate; }
.pfx .nk-idle-zoom { position: absolute; inset: 0; z-index: 1; display: grid; place-items: center; transform-origin: var(--zx, 50%) var(--zy, 50%); transform: scale(var(--z, 1)); will-change: transform; }
.pfx .nk-idle-w { font-size: clamp(48px, 13vw, 320px); font-weight: 900; line-height: 1; letter-spacing: -.045em; white-space: nowrap; color: #fff; }
/* буквата „клюмва“ (--t) около долния си край; вътре изплува от процеп (--a) */
.pfx .nk-il { display: inline-block; transform-origin: 50% 88%; transform: translateY(calc(var(--t, 0) * var(--y) * 1em)) rotate(calc(var(--t, 0) * var(--r) * 1deg)); }
.pfx .nk-il-m { display: inline-block; overflow: clip; padding: .1em .03em .24em; margin: -.1em -.03em -.24em; vertical-align: top; }
.pfx .nk-il-c { display: inline-block; transform: translateY(calc((1 - var(--a, 0)) * 118%)); }
/* снимката се умножава с белите букви върху черното: вижда се само през тях */
.pfx .nk-idle-ph { z-index: 2; mix-blend-mode: multiply; }
.pfx.nk .nk-idle-ph img { transform: scale(calc(1.16 - var(--zp, 0) * .16)); }
/* докато думата се чете, тъмните места на снимката са изсветлени; при влизането снимката си връща контраста */
.pfx .nk-idle-ph::after { content: ''; position: absolute; inset: 0; background: #6a6a6a; mix-blend-mode: screen; opacity: calc(1 - var(--zp, 0)); }
/* накрая снимката е само фон: по-тъмна, а тънката дума е в средата */
.pfx .nk-idle-veil { position: absolute; inset: 0; z-index: 3; background: rgba(0, 0, 0, .58); opacity: var(--vl, 0); pointer-events: none; }
/* всяка буква се протяга нагоре като прозявка (--e минава малко над 1 и се връща) */
.pfx .nk-idle-tail { position: absolute; left: 0; right: 0; top: 50%; translate: 0 -50%; z-index: 4; text-align: center; font-size: clamp(56px, 11vw, 230px); line-height: 1; font-weight: 200; font-style: italic; letter-spacing: -.05em; color: #F2F0EB; white-space: nowrap; }
.pfx .nk-tl { display: inline-block; transform-origin: 50% 100%; opacity: var(--a, 0); transform: scaleY(calc(.15 + var(--e, 0) * .85)) scaleX(calc(1.25 - var(--e, 0) * .25)); }
.pfx .nk-tl-dot { font-style: normal; font-weight: 800; transform: translateY(calc((1 - var(--e, 0)) * -3em)); }

/* ===== IX. къде да ме намерите ===== */
.pfx.nk-find { padding-block: clamp(110px, 16vh, 190px); background: var(--nk-warm); }
.pfx .nk-find-t { font-size: clamp(42px, 6.4vw, 118px); line-height: .98; letter-spacing: -.055em; font-weight: 200; margin-bottom: clamp(36px, 6vh, 70px); }
.pfx .nk-find-t b { font-weight: 800; }
.pfx .nk-links { border-top: 1px solid rgba(18, 18, 18, .18); }
.pfx .nk-links li { border-bottom: 1px solid rgba(18, 18, 18, .18); }
.pfx .nk-links a { position: relative; display: flex; align-items: baseline; gap: 22px; padding: clamp(14px, 2.2vh, 26px) 12px; line-height: 1.6; transition: background-color .45s var(--ease), color .45s, padding .6s var(--ease-out); }
.pfx .nk-links b { font-size: clamp(30px, 4.6vw, 84px); line-height: 1; font-weight: 200; letter-spacing: -.05em; transition: font-weight .5s var(--ease-out); }
.pfx .nk-links span { font-size: 14px; color: var(--nk-dim); transition: color .45s; }
.pfx .nk-links i { margin-left: auto; font-style: normal; font-size: clamp(22px, 2.4vw, 38px); font-weight: 200; transition: transform .5s var(--ease-out); }
.pfx .nk-links a:hover { background: var(--nk-ink); color: #fff; padding-left: 26px; }
.pfx .nk-links a:hover b { font-weight: 800; }
.pfx .nk-links a:hover span { color: rgba(255, 255, 255, .6); }
.pfx .nk-links a:hover i { transform: translateX(-8px); }

/* ===== X. накрая: снимката от началото се връща, после поканата ===== */
.pfx.nk-cta .sc-stage { display: grid; place-items: center; background: var(--nk-warm); color: var(--nk-ink); }
/* снимката започва малко по-отблизо и плътна, отдалечава се до целия кадър и избледнява */
.pfx .nk-cta-bg { opacity: calc(1 - var(--z, 0) * .74); }
.pfx.nk .nk-cta-bg img { object-position: 50% 46%; transform-origin: 49% 46%; transform: scale(calc(1.7 - var(--z, 0) * .7)); }
.pfx .nk-cta-in { position: relative; z-index: 1; display: grid; justify-items: center; gap: clamp(30px, 6vh, 64px); text-align: center; }
.pfx .nk-cta-q { font-size: clamp(32px, 4.6vw, 84px); line-height: 1.04; letter-spacing: -.045em; font-weight: 200; }
.pfx .nk-cta-go { display: grid; justify-items: center; gap: 18px; opacity: var(--e, 0); transform: translateY(calc((1 - var(--e, 0)) * 30px)); }
.pfx.nk-cta:not([data-go]) .nk-cta-go { pointer-events: none; }
.pfx .nk-cta-t { font-size: clamp(40px, 6vw, 110px); line-height: .98; letter-spacing: -.055em; font-weight: 200; }
.pfx .nk-cta-t b { font-weight: 800; }
.pfx .nk-cta-sub { font-size: 17px; line-height: 1.6; color: var(--nk-dim); }
.pfx .nk-cta-btns { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 10px; }
/* „магнитът“: бутонът леко следва мишката и се връща с малко пружиниране */
.pfx .nk-mag { display: inline-block; transform: translate3d(var(--mx, 0px), var(--my, 0px), 0); transition: transform .8s cubic-bezier(.34, 1.56, .64, 1); }
.pfx .nk-mag.is-on { transition-duration: .35s; transition-timing-function: cubic-bezier(.16, 1, .3, 1); }

/* ---------- телефон ---------- */
@media (max-width: 760px) {
  /* думата е върху снимката: мека сянка, за да се чете */
  .pfx .nk-iam-t { font-size: clamp(38px, 11vw, 80px); text-shadow: 0 2px 28px rgba(0, 0, 0, .6); }
  .pfx.nk-vuln .sc-stage { align-items: flex-start; padding-top: 96px; }
  .pfx .nk-vuln-in { grid-template-columns: minmax(0, 1fr); gap: 26px; }
  .pfx .nk-vuln-q { font-size: clamp(26px, 7.4vw, 40px); }
  .pfx .nk-tiles { width: min(78vw, 340px); justify-self: center; }
  .pfx .nk-door-q { top: 96px; padding-right: 0; font-size: clamp(24px, 7vw, 36px); }
  .pfx .nk-silence-q { font-size: clamp(20px, 5.6vw, 28px); padding-inline: var(--pad); }
  .pfx .nk-cta-q { font-size: clamp(28px, 8.4vw, 44px); }
  .pfx .nk-cta-btns { flex-direction: column; align-items: center; }
  .pfx .nk-links a { flex-wrap: wrap; gap: 6px 14px; }
  .pfx .nk-links span { order: 3; width: 100%; }
}

/* ---------- намалено движение: сцените стоят една под друга в крайния си вид ---------- */
.pfx.nk-scene[data-static] { height: auto !important; }
.pfx.nk-scene[data-static] > .sc-stage { position: relative; height: auto; min-height: 100svh; }
.pfx.nk-someone[data-static] .sc-stage { grid-auto-flow: row; gap: 40px; padding-block: 150px 120px; }
.pfx.nk-someone[data-static] :is(.nk-name, .nk-who) { grid-area: auto; opacity: 1; filter: none; transform: none; }
.pfx.nk-someone[data-static] .nk-q { position: relative; left: auto; right: auto; bottom: auto; padding-inline: var(--pad); }
.pfx.nk-iam[data-static] .nk-role { position: relative; opacity: 1; filter: none; transform: none; grid-area: auto; }
.pfx.nk-iam[data-static] .nk-roles { display: flex; flex-direction: column; }
.pfx.nk-cta[data-static] .nk-cta-in { padding-block: 120px; }
.pfx:is(.nk-door, .nk-silence)[data-static] :is(.nk-door-q, .nk-silence-q) { position: relative; top: auto; bottom: auto; padding-top: 120px; }
.pfx.lv[data-static] .lv-word { position: relative; left: auto; bottom: auto; padding-inline: var(--pad); }
.pfx.lv[data-static] :is(.lv-water, .lv-word-sub) { display: none; }
@media (prefers-reduced-motion: reduce) {
  .pfx .nk-ray { animation: none; }
  .pfx .nk-mag { transform: none !important; transition: none; }
  .pfx :is(.nk-num-ph, .nk-num-l, .nk-tick::after), .pfx.nk .nk-num-ph img { transition: none; }
}