/* Layout: dark page with a light cinematic island (sticky canvas scrubbed by scroll); below it a pointer-lit dark world: reveal on scroll, tilt under cursor, one moving strip. */
:root{
  --bg:#0E0E10; --bg2:#141317; --bg3:#1b1922; --fg:#EFE7FF; --fg2:#B5ACC8; --line:rgba(220,203,255,.14);
  --lav:#DCCBFF; --accent:#FF8A3D; --ink:#0E0E10;
  --display:"Inter Tight","Helvetica Neue",Arial,sans-serif;
  --serif:"Instrument Serif",Georgia,"Times New Roman",serif;
  --body:"Inter","Helvetica Neue",Arial,sans-serif;
  --ease:cubic-bezier(.2,.8,.2,1);
  color-scheme:dark;
}
:root[data-theme="light"]{
  --bg:#F4EFFA; --bg2:#FFFFFF; --bg3:#ECE4F6; --fg:#15131B; --fg2:#5C5570; --line:rgba(60,40,100,.14);
  --lav:#6E4FC9; --accent:#F0732A; --ink:#0E0E10;
  color-scheme:light;
}
:root[data-theme="light"] #grain{opacity:.035;mix-blend-mode:multiply}
:root[data-theme="light"] #glow{background:radial-gradient(circle,rgba(110,79,201,.12) 0%,rgba(240,115,42,.06) 35%,transparent 65%)}
:root[data-theme="light"] #cursor{border-color:rgba(255,255,255,.85)}
:root[data-theme="light"] .manifest .w{color:#cfc6dd}
:root[data-theme="light"] .nav.dark{color:var(--fg);background:rgba(244,239,250,.7)}
:root[data-theme="light"] .nav.dark .logo .wm-l{display:none}
:root[data-theme="light"] .nav.dark .logo .wm-d{display:block}
:root[data-theme="light"] .chapter.c4{color:var(--fg)}
:root[data-theme="light"] .ig .pt{fill:var(--bg2)}
:root[data-theme="light"] .ig .night{fill:rgba(110,79,201,.07)}
:root[data-theme="light"] .pil li,:root[data-theme="light"] .card li::before{border-color:rgba(110,79,201,.35)}
:root[data-theme="light"] .portrait::after{background:linear-gradient(180deg,transparent 60%,rgba(244,239,250,.6))}
:root[data-theme="light"] .work.cta{background:linear-gradient(135deg,rgba(110,79,201,.08),rgba(240,115,42,.1))}
:root[data-theme="light"] .btn.ghost{border-color:rgba(60,40,100,.3)}
:root[data-theme="light"] footer.site .foot-logo .wl{display:none}
:root[data-theme="light"] footer.site .foot-logo .wd{display:inline}
html{transition:background .4s}
body{transition:background .4s,color .4s}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--body);font-weight:300;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden;overflow-x:clip}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:var(--bg)}
a{color:inherit;text-decoration:none}
h1,h2,h3{font-family:var(--display);font-weight:400;letter-spacing:-.03em;line-height:1.02;margin:0;text-wrap:balance}
h2{font-size:clamp(2.2rem,5.2vw,4.6rem)}
h3{font-size:clamp(1.3rem,2vw,1.7rem);letter-spacing:-.02em}
em{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:0}
p{margin:0}
.wrap{padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.inner{max-width:1360px;margin:0 auto}
.eyebrow{font-family:var(--display);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--fg2);display:flex;gap:.8rem;align-items:center}
.eyebrow::before{content:"";width:28px;height:1px;background:var(--lav);opacity:.6}
.btn{position:relative;display:inline-flex;align-items:center;gap:.6rem;padding:.95rem 1.5rem;border-radius:999px;background:var(--accent);color:var(--ink);font-family:var(--display);font-weight:500;font-size:.95rem;letter-spacing:-.01em;transition:transform .35s var(--ease),background .3s;overflow:hidden;will-change:transform}
.btn::after{content:"";position:absolute;inset:0;background:radial-gradient(120px 120px at var(--mx,50%) var(--my,50%),rgba(255,255,255,.45),transparent 60%);opacity:0;transition:opacity .3s}
.btn:hover::after{opacity:1}
.btn.ghost{background:transparent;color:var(--fg);border:1px solid var(--line)}
.btn.ghost::after{background:radial-gradient(140px 140px at var(--mx,50%) var(--my,50%),rgba(220,203,255,.22),transparent 60%)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

/* ambient: pointer light, grain, cursor */
#glow{position:fixed;left:0;top:0;width:900px;height:900px;margin:-450px 0 0 -450px;border-radius:50%;pointer-events:none;z-index:0;background:radial-gradient(circle,rgba(220,203,255,.2) 0%,rgba(255,138,61,.08) 35%,transparent 65%);transform:translate(-2000px,-2000px);filter:blur(20px);transition:opacity .6s ease}
#grain{position:fixed;inset:0;pointer-events:none;z-index:58;opacity:.055;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");mix-blend-mode:overlay}
#cursor{position:fixed;left:0;top:0;width:34px;height:34px;margin:-17px 0 0 -17px;border-radius:50%;border:1px solid rgba(255,255,255,.7);pointer-events:none;z-index:70;transform:translate(-200px,-200px);transition:width .35s cubic-bezier(.2,.8,.2,1),height .35s cubic-bezier(.2,.8,.2,1),margin .35s cubic-bezier(.2,.8,.2,1),background .3s,border-color .3s,opacity .3s;mix-blend-mode:difference;background:transparent;will-change:transform}#cursor.big{width:68px;height:68px;margin:-34px 0 0 -34px;background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.5)}html.cur-gone #cursor{opacity:0}#cursor.down{width:26px;height:26px;margin:-13px 0 0 -13px}#cursor.big.down{width:52px;height:52px;margin:-26px 0 0 -26px}html.cur-on,html.cur-on body{cursor:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2228%22 height=%2228%22 viewBox=%220 0 28 28%22%3E%3Cdefs%3E%3Cfilter id=%22s%22 x=%22-30%25%22 y=%22-30%25%22 width=%22160%25%22 height=%22160%25%22%3E%3CfeDropShadow dx=%220%22 dy=%221.5%22 stdDeviation=%221.2%22 flood-color=%22%23000%22 flood-opacity=%22.35%22/%3E%3C/filter%3E%3C/defs%3E%3Cpath filter=%22url%28%23s%29%22 d=%22M4 3 L4 21.5 L9.2 16.8 L12.6 24.6 L15.9 23.2 L12.5 15.6 L19.6 15.4 Z%22 fill=%22%23ffffff%22 stroke=%22%230e0e10%22 stroke-width=%221.4%22 stroke-linejoin=%22round%22/%3E%3C/svg%3E") 4 3,auto}html.cur-on a,html.cur-on button,html.cur-on summary,html.cur-on label,html.cur-on .plan,html.cur-on .pillar{cursor:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2228%22 height=%2228%22 viewBox=%220 0 28 28%22%3E%3Cdefs%3E%3Cfilter id=%22s%22 x=%22-30%25%22 y=%22-30%25%22 width=%22160%25%22 height=%22160%25%22%3E%3CfeDropShadow dx=%220%22 dy=%221.5%22 stdDeviation=%221.2%22 flood-color=%22%23000%22 flood-opacity=%22.35%22/%3E%3C/filter%3E%3C/defs%3E%3Cpath filter=%22url%28%23s%29%22 d=%22M4 3 L4 21.5 L9.2 16.8 L12.6 24.6 L15.9 23.2 L12.5 15.6 L19.6 15.4 Z%22 fill=%22%23ff8a3d%22 stroke=%22%230e0e10%22 stroke-width=%221.4%22 stroke-linejoin=%22round%22/%3E%3C/svg%3E") 4 3,pointer}html.cur-on .work{cursor:none}html.cur-on input,html.cur-on textarea{cursor:text}.hlight{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;transition:opacity .8s ease;mix-blend-mode:overlay;background:radial-gradient(circle 420px at var(--lx,50%) var(--ly,50%),rgba(255,196,140,.75),rgba(255,214,170,.28) 40%,transparent 72%)}.stage.lit .hlight{opacity:1}html.cur-on .stage canvas{scale:1.035;translate:var(--hx,0px) var(--hy,0px)}

#cursor.txt,#cursor.big.txt{width:104px;height:104px;margin:-52px 0 0 -52px;background:var(--lav);border-color:transparent;mix-blend-mode:normal;box-shadow:0 10px 40px rgba(110,79,201,.35)}.nav:not(.dark) .btn.ghost{color:inherit;border-color:rgba(40,30,60,.35)}
#cursor.txt::after{content:attr(data-t);position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--ink);font-family:var(--display);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase}
@media(pointer:coarse),(max-width:860px){#cursor,#glow{display:none}}
.page{position:relative;z-index:1}

/* reveal */
.rv{opacity:0;transform:translateY(28px);transition:opacity .9s var(--ease),transform 1s var(--ease)}
.rv.in{opacity:1;transform:none}
.rv.d1{transition-delay:.08s}.rv.d2{transition-delay:.16s}.rv.d3{transition-delay:.24s}
.lines h2 .ln{display:block;overflow:hidden}
.lines h2 .ln span{display:block;transform:translateY(110%);transition:transform 1.1s var(--ease)}
.lines.in h2 .ln span{transform:none}
.lines.in h2 .ln:nth-child(2) span{transition-delay:.08s}

/* nav */
.nav{position:fixed;top:env(safe-area-inset-top,0px);left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:14px max(16px,env(safe-area-inset-right,0px)) 14px max(16px,env(safe-area-inset-left,0px));color:var(--ink);transition:color .4s,background .4s;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);background:rgba(255,255,255,.04)}
.nav.dark{color:var(--fg);background:rgba(14,14,16,.55)}
.logo{display:flex;align-items:center;gap:.7rem}
.logo .mk{height:26px;width:auto;transition:transform .5s var(--ease)}
.logo:hover .mk{transform:rotate(-6deg) scale(1.08)}
.logo .wm{height:11px;width:auto}
.logo .wm-l,.nav.dark .logo .wm-d{display:none}
.nav.dark .logo .wm-l{display:block}
.menu{display:flex;gap:1.6rem;font-family:var(--display);font-size:.85rem}
.menu a{opacity:.85;position:relative}.menu a::after{content:"";position:absolute;left:0;right:100%;bottom:-4px;height:1px;background:currentColor;transition:right .35s var(--ease)}.menu a:hover::after{right:0}
.nav .btn{padding:.6rem 1.1rem;font-size:.85rem}
.navr{display:flex;align-items:center;gap:.7rem}
@media(max-width:860px){#strefa-btn{display:none}.nav{padding-top:10px;padding-bottom:10px}.nav .btn{padding:.55rem .9rem;font-size:.8rem;white-space:nowrap}.theme{width:36px;height:36px}.logo .mk{height:22px}.logo .wm{height:9px}}
.theme{position:relative;width:40px;height:40px;border-radius:50%;border:1px solid currentColor;background:transparent;color:inherit;cursor:pointer;display:grid;place-items:center;opacity:.8;transition:opacity .3s,transform .4s var(--ease)}
.theme:hover{opacity:1;transform:rotate(25deg)}
.theme span{position:absolute;inset:0;display:grid;place-items:center;transition:opacity .35s,transform .45s var(--ease)}
.theme .sun::before{content:"";width:12px;height:12px;border-radius:50%;background:currentColor;box-shadow:0 0 0 3px transparent,0 -8px 0 -4px currentColor,0 8px 0 -4px currentColor,-8px 0 0 -4px currentColor,8px 0 0 -4px currentColor}
.theme .moon::before{content:"";width:13px;height:13px;border-radius:50%;box-shadow:inset -4px -3px 0 0 currentColor}
.theme .sun{opacity:0;transform:rotate(-60deg) scale(.6)}
:root[data-theme="light"] .theme .sun{opacity:1;transform:none}
:root[data-theme="light"] .theme .moon{opacity:0;transform:rotate(60deg) scale(.6)}
@media(max-width:860px){.menu{display:none}}

/* hero */
.hero{position:relative;height:640vh}
.stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:#e9dbe3;contain:layout paint}
.stage canvas{position:absolute;inset:0;width:100%;height:100%;transform-origin:50% 55%;will-change:transform,opacity}
#film2{opacity:0;pointer-events:none}
.vignette{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 60%,rgba(14,14,16,0) 30%,rgba(14,14,16,1) 100%);opacity:0}
.chapter{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:0 max(16px,env(safe-area-inset-left,0px));color:var(--ink);opacity:0;transform:translateY(14px);transition:opacity .5s,transform .6s var(--ease);pointer-events:none}
.chapter::before{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(255,255,255,.62) 0%,rgba(255,255,255,.38) 38%,rgba(255,255,255,0) 68%);opacity:0;transition:opacity .6s}
.chapter.on{opacity:1;transform:none;pointer-events:auto}
.chapter.on::before{opacity:1}
.chapter .inner{width:100%;position:relative;transform:translate(var(--px,0),var(--py,0));transition:transform .25s ease-out}
.chapter h1,.chapter h2{font-size:clamp(2.6rem,7vw,7.2rem);max-width:14ch;color:var(--ink);font-weight:500;text-shadow:0 2px 30px rgba(255,255,255,.55)}
.chapter p{font-family:var(--display);font-size:clamp(1rem,1.4vw,1.35rem);max-width:38ch;margin-top:1.4rem;font-weight:500;color:#2a2733}
.chapter.c1{justify-content:flex-end;padding-bottom:12vh}
.chapter.c1::before{background:linear-gradient(0deg,rgba(255,255,255,.6) 0%,rgba(255,255,255,.3) 30%,rgba(255,255,255,0) 55%)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.lockup{display:flex;align-items:center;gap:clamp(1rem,2.5vw,2.4rem)}
.lockup .mk{height:clamp(84px,14vw,190px);width:auto;animation:breathe 7s ease-in-out infinite;filter:drop-shadow(0 20px 40px rgba(255,138,61,.25))}
.lockup .wm{display:block;height:clamp(22px,3.2vw,46px);width:auto}
.lockup .tg{display:block;height:clamp(8px,1.05vw,15px);width:auto;margin-top:.9rem;opacity:.85}
@keyframes breathe{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-8px) scale(1.025)}}
.chapter.c1 p{margin-top:2rem}
.chapter.c4{align-items:center;text-align:center;justify-content:flex-end;padding-bottom:9vh;color:var(--fg)}
.chapter.c4::before{background:linear-gradient(0deg,rgba(14,14,16,.85) 0%,rgba(14,14,16,.4) 40%,rgba(14,14,16,0) 70%)}
.chapter.c4 h2{color:var(--fg);max-width:16ch;margin:0 auto;text-shadow:none}
.chapter.c4 p{margin:1rem auto 1.8rem;color:var(--fg2)}
.scrollcue{position:absolute;left:50%;transform:translateX(-50%);bottom:max(26px,env(safe-area-inset-bottom,0px));font-family:var(--display);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);opacity:.85;display:flex;flex-direction:column;gap:.7rem;align-items:center;transition:opacity .5s;pointer-events:none;text-shadow:0 1px 12px rgba(255,255,255,.7)}
.scrollcue .wheel{display:block;width:22px;height:36px;border:1.5px solid var(--ink);border-radius:12px;position:relative;opacity:.8}
.scrollcue .wheel b{position:absolute;left:50%;top:7px;width:3px;height:7px;margin-left:-1.5px;border-radius:2px;background:var(--ink);animation:wheel 1.9s cubic-bezier(.4,0,.2,1) infinite}
@keyframes wheel{0%{transform:translateY(0);opacity:1}70%{transform:translateY(13px);opacity:0}100%{transform:translateY(0);opacity:0}}
@media(max-width:860px){.scrollcue{right:auto;left:50%;bottom:max(70px,calc(env(safe-area-inset-bottom,0px) + 56px))}.scrollcue .txt{font-size:.68rem}}
@keyframes cue{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
.progress{position:absolute;right:max(18px,env(safe-area-inset-right,0px));top:50%;transform:translateY(-50%);width:1px;height:160px;background:rgba(14,14,16,.18)}
.progress b{position:absolute;left:0;top:0;width:100%;height:0;background:var(--ink);transition:height .1s linear}
.loadbar{position:absolute;left:0;bottom:0;height:2px;width:0;background:var(--accent);transition:width .3s,opacity .6s}
@media(max-width:860px){.hero{height:380vh}.chapter.c1 h1{font-size:clamp(3rem,16vw,5rem)}.lockup{flex-direction:column;align-items:flex-start;gap:1rem}.lockup .mk{height:72px}.lockup .wm{height:18px;max-width:calc(100vw - 40px)}.lockup .tg{height:7px;max-width:calc(100vw - 40px);margin-top:.6rem}.chapter.c1{padding-bottom:22vh}.chapter h2{font-size:clamp(2rem,9vw,3rem)}.chapter p{font-size:1rem}}

/* sections */
section.s{padding-block:clamp(5rem,12vh,10rem);position:relative}
.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(1rem,2.4vw,2.6rem)}
.grid>*{min-width:0}

/* manifest */
.manifest{font-family:var(--display);font-size:clamp(1.5rem,3.1vw,2.9rem);line-height:1.22;letter-spacing:-.025em;max-width:30ch}
.manifest .w{color:#3b3843;transition:color .25s}
.manifest .w.lit{color:var(--fg)}
.manifest em{color:inherit}
.numbers{position:relative;margin-top:4.5rem;aspect-ratio:21/7.2;min-height:300px;max-height:460px;border-radius:6px;overflow:hidden;background:var(--bg) center 62%/cover no-repeat,var(--bg2);border:1px solid rgba(220,203,255,.18);box-shadow:0 50px 100px -50px rgba(0,0,0,.9)}
.numbers::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,14,16,.55),rgba(14,14,16,.05) 45%,rgba(14,14,16,.0) 70%,rgba(14,14,16,.6));pointer-events:none}
.numbers::after{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,var(--lav) 40%,var(--accent) 70%,transparent);opacity:0;transition:opacity 1.2s var(--ease)}
.numbers.in::after{opacity:.8}
.num{position:absolute;left:var(--x);top:11%;transform:translateX(-50%);width:min(19vw,240px);display:flex;flex-direction:column;align-items:center;text-align:center;gap:.6rem}
.num .k{font-family:var(--display);font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--lav);opacity:0;transform:translateY(6px);transition:opacity .6s var(--ease) .2s,transform .7s var(--ease) .2s;text-shadow:0 1px 8px rgba(0,0,0,.8)}
.numbers.in .num .k{opacity:1;transform:none}
.num b{display:flex;align-items:baseline;gap:.3rem;font-family:var(--display);font-weight:200;font-size:clamp(2.4rem,4.6vw,4.4rem);letter-spacing:-.055em;line-height:.9;font-variant-numeric:tabular-nums;color:#EFE7FF;text-shadow:0 2px 24px rgba(0,0,0,.7)}
.num b i{font-style:normal}
.num b em{font-family:var(--serif);font-style:italic;font-weight:400;font-size:.42em;letter-spacing:0;color:#DCCBFF;transform:translateY(-.1em)}
.num .t{font-size:.78rem;color:#D9D2E6;max-width:20ch;line-height:1.35;opacity:0;transform:translateY(8px);transition:opacity .7s var(--ease) .6s,transform .8s var(--ease) .6s;text-shadow:0 1px 10px rgba(0,0,0,.9)}
.numbers.in .num .t{opacity:1;transform:none}
.num::after{content:"";position:absolute;left:50%;top:100%;width:1px;height:0;margin-top:.8rem;background:linear-gradient(180deg,var(--lav),transparent);transition:height 1s var(--ease) .9s;opacity:.7}
.numbers.in .num::after{height:9%}
.num:hover b{color:var(--accent);transition:color .4s}
.numbers.light{display:none}
@media(max-width:860px){.numbers{aspect-ratio:auto;min-height:0;max-height:none;background:var(--bg2);display:grid;grid-template-columns:repeat(2,1fr);padding:0 1rem 1rem;overflow:hidden}.numbers::before{position:static;grid-column:1/-1;display:block;height:150px;margin:0 -1rem 1rem;background:var(--bg) 50% 68%/190% auto no-repeat;-webkit-mask:linear-gradient(180deg,#000 70%,transparent);mask:linear-gradient(180deg,#000 70%,transparent)}.num{position:static;transform:none;width:auto;align-items:flex-start;text-align:left;padding:1rem .8rem 1rem 0;overflow:visible}.num b{font-size:2.6rem;color:var(--fg);text-shadow:none}.num b em{color:var(--lav)}.num .k{opacity:1;transform:none}.num .t{color:var(--fg2);text-shadow:none;opacity:1;transform:none}.num::after{display:none}.num:nth-child(n+3){border-top:1px solid var(--line)}}
.who p{font-size:1.05rem;max-width:40ch;color:var(--fg2)}
.who p strong{display:block;color:var(--fg);font-weight:500;font-family:var(--display);font-size:1.25rem;letter-spacing:-.02em;margin-bottom:.5rem}
.who{display:grid;grid-template-columns:repeat(3,1fr);gap:2.6rem;margin-top:3rem}
@media(max-width:860px){.who{grid-template-columns:1fr}}

/* marquee */
.strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden;max-width:100vw;padding:1.1rem 0;white-space:nowrap;font-family:var(--display);font-size:clamp(1.1rem,2vw,1.6rem);letter-spacing:-.02em;color:var(--fg2)}
.strip .row{display:inline-flex;gap:3rem;animation:mq 42s linear infinite;will-change:transform;padding-right:3rem}
.strip .row span::before{content:"✦";color:var(--accent);margin-right:1rem;font-size:.7em;vertical-align:middle}
.strip em{color:var(--fg)}
@keyframes mq{to{transform:translateX(-50%)}}

/* layers: editorial rows, film stills, hairlines */
.layers-head{display:grid;grid-template-columns:7fr 5fr;gap:3rem;align-items:end;margin-bottom:4rem}
.layers-lead{color:var(--fg2);font-size:1.1rem;max-width:40ch;padding-bottom:.4rem}
.layer{display:grid;grid-template-columns:7fr 5fr;gap:clamp(2rem,5vw,5rem);align-items:center;padding:4rem 0;border-top:1px solid var(--line);position:relative}
.layer.flip .layer-media{order:2}.layer.flip .layer-text{order:1}
.layer-media{position:relative;min-width:0;aspect-ratio:16/10;border-radius:4px;background:radial-gradient(rgba(220,203,255,.09) 1px,transparent 1px) 0 0/22px 22px,linear-gradient(180deg,var(--bg2),var(--bg));border:1px solid var(--line);padding:1.2rem;overflow:visible}
.layer-media::before{content:"";position:absolute;inset:0;background:radial-gradient(420px 320px at var(--mx,50%) var(--my,50%),rgba(220,203,255,.08),transparent 65%);opacity:0;transition:opacity .5s;pointer-events:none;border-radius:inherit}
.layer-media.photo{aspect-ratio:3/2;padding:0;background:var(--bg) center/cover no-repeat,var(--bg2);border-color:rgba(220,203,255,.2);overflow:hidden;box-shadow:0 40px 80px -40px rgba(0,0,0,.8)}
.layer-media.photo::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(14,14,16,.55),rgba(14,14,16,.1) 45%,rgba(14,14,16,0)),linear-gradient(0deg,rgba(14,14,16,.5),transparent 35%);pointer-events:none}
.layer-media.photo .ig{position:relative;z-index:2;padding:1.2rem}
.layer-media.photo .ig .big,.layer-media.photo .ig .time{filter:drop-shadow(0 2px 12px rgba(0,0,0,.6))}
.layer-media.photo .ig .cap,.layer-media.photo .ig .tiny,.layer-media.photo .ig .it{filter:drop-shadow(0 1px 6px rgba(0,0,0,.8))}
.layer-media.photo .ig .hair{stroke:rgba(239,231,255,.55)}
.layer-media.photo .ig .pt{fill:rgba(14,14,16,.6)}
.layer-media.photo .ig .pulse{filter:drop-shadow(0 0 6px rgba(255,138,61,1)) drop-shadow(0 0 14px rgba(255,138,61,.6))}
:root[data-theme="light"] .layer-media.photo .ig .big,:root[data-theme="light"] .layer-media.photo .ig .time,:root[data-theme="light"] .layer-media.photo .ig .cap,:root[data-theme="light"] .layer-media.photo .ig .tiny{fill:#EFE7FF}
:root[data-theme="light"] .layer-media.photo .ig .cap.c,:root[data-theme="light"] .layer-media.photo .ig .it{fill:#DCCBFF}
.layer:hover .layer-media::before{opacity:1}
.ig{width:100%;height:100%;display:block;font-family:var(--display);overflow:visible}
.ig .par{transition:transform .25s ease-out}
.ig .hair{fill:none;stroke:rgba(220,203,255,.42);stroke-width:1;vector-effect:non-scaling-stroke}
.ig .hair.dots{stroke-dasharray:1 7;stroke-linecap:round;stroke:rgba(220,203,255,.3)}
.ig .arc{fill:none;stroke:var(--accent);stroke-width:1.5;vector-effect:non-scaling-stroke}
.ig .draw{stroke-dasharray:100;stroke-dashoffset:100;transition:stroke-dashoffset 1.6s var(--ease)}
.ig .draw.d1{transition-delay:.1s}.ig .draw.d2{transition-delay:.35s}.ig .draw.d3{transition-delay:.6s}.ig .draw.d4{transition-delay:.85s}
.layer.in .ig .draw{stroke-dashoffset:0}
.ig .night{fill:rgba(220,203,255,.045)}
.ig .pt{fill:var(--bg2);stroke:var(--lav);stroke-width:1.2;opacity:0;transition:opacity .6s .9s}
.layer.in .ig .pt{opacity:1}
.ig .pt.hot{fill:var(--accent);stroke:var(--accent)}
.ig .pt.hub{fill:var(--lav);stroke:var(--lav)}
.ig .pt.glow{animation:glow 2.6s ease-in-out infinite}
@keyframes glow{0%,100%{filter:drop-shadow(0 0 0 rgba(255,138,61,0))}50%{filter:drop-shadow(0 0 7px rgba(255,138,61,.95))}}
.ig .breathe{transform-origin:470px 140px;transform-box:view-box;animation:breathe2 7s ease-in-out infinite}
@keyframes breathe2{0%,100%{transform:scale(1);opacity:.6}50%{transform:scale(1.06);opacity:1}}
.ig .pulse{fill:var(--accent);filter:drop-shadow(0 0 5px rgba(255,138,61,.9));opacity:0;transition:opacity .4s 1.6s}
.layer.in .ig .pulse{opacity:1}
.ig .big{font-size:120px;font-weight:300;fill:var(--fg);letter-spacing:-.05em;font-variant-numeric:tabular-nums}
.ig .big.s{font-size:48px;fill:var(--fg2)}
.ig .big.s2{font-size:56px;letter-spacing:-.04em}
.ig .time{font-size:22px;font-weight:400;fill:var(--fg);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.ig .cap{font-size:11px;letter-spacing:.16em;text-transform:uppercase;fill:var(--fg);font-weight:500}
.ig .cap.c{fill:var(--lav)}.ig .cap.hot{fill:var(--accent)}
.ig .tiny{font-size:11.5px;fill:var(--fg2);font-family:var(--body)}
.ig .it{font-family:var(--serif);font-style:italic;font-size:17px;fill:var(--lav)}
.ig text{opacity:0;transform:translateY(6px);transition:opacity .7s var(--ease),transform .8s var(--ease)}
.layer.in .ig text{opacity:1;transform:none}
.layer.in .ig .par:nth-child(2) text{transition-delay:.25s}.layer.in .ig .par:nth-child(3) text{transition-delay:.5s}.layer.in .ig .par:nth-child(4) text{transition-delay:.7s}
@media(prefers-reduced-motion:reduce){.ig .pulse{display:none}.ig .breathe,.ig .pt.glow{animation:none}.ig .draw{stroke-dashoffset:0}.ig text{opacity:1;transform:none}.ig .pt{opacity:1}}
.layer-stat{position:absolute;left:1.6rem;bottom:1.4rem;z-index:2;color:var(--fg);text-shadow:0 2px 20px rgba(14,14,16,.6)}
.layer-stat b{display:block;font-family:var(--display);font-weight:300;font-size:clamp(3.2rem,6vw,5.6rem);letter-spacing:-.05em;line-height:.9}
.layer-stat b span{font-size:.4em;color:var(--lav);margin-left:.1em;letter-spacing:0}
.layer-stat small{display:block;font-family:var(--display);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--lav);margin-top:.5rem}
.layer-text{min-width:0}
.layer-no{display:flex;align-items:center;gap:.9rem;font-family:var(--display);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--fg2);margin-bottom:1.6rem}
.layer-no span{font-size:2.6rem;font-weight:300;letter-spacing:-.04em;color:var(--fg);line-height:1}
.layer-no i{display:block;width:34px;height:1px;background:var(--lav);opacity:.7}
.layer h3{font-size:clamp(1.6rem,2.6vw,2.4rem);max-width:18ch}
.layer p{margin-top:1.2rem;color:var(--fg2);max-width:44ch}
.layer-list{margin:2rem 0 0;display:grid;grid-template-columns:1fr 1fr;gap:0 2rem}
.layer-list div{min-width:0;border-top:1px solid var(--line);padding:.9rem 0}
.layer-list dt{font-family:var(--display);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--lav)}
.layer-list dd{margin:.3rem 0 0;font-size:.95rem;color:var(--fg)}
@media(max-width:860px){.layers-head,.layer{grid-template-columns:1fr}.layer.flip .layer-media{order:1}.layer.flip .layer-text{order:2}.layer{padding:2.5rem 0}.layer-list{grid-template-columns:1fr}}

/* process */
.steps{position:relative;margin-top:3.5rem;display:grid;grid-template-columns:repeat(5,1fr);gap:2rem}
.steps::before{content:"";position:absolute;left:0;right:0;top:9px;height:1px;background:var(--line)}
.steps::after{content:"";position:absolute;left:0;top:9px;height:1px;width:var(--draw,0%);background:linear-gradient(90deg,var(--lav),var(--accent));transition:width .2s linear}
.step{min-width:0;padding-top:2.2rem;position:relative}
.step::before{content:"";position:absolute;top:5px;left:0;width:9px;height:9px;border-radius:50%;background:var(--lav);box-shadow:0 0 0 0 rgba(220,203,255,.4);transition:box-shadow .5s}
.step:hover::before{box-shadow:0 0 0 10px rgba(220,203,255,.12)}
.step .k{font-family:var(--display);font-size:.72rem;letter-spacing:.14em;color:var(--fg2)}
.step h3{margin:.5rem 0 .7rem}
.step p{color:var(--fg2);font-size:.95rem;max-width:30ch}
.step .d{display:block;margin-top:.8rem;font-family:var(--display);font-size:.8rem;color:var(--lav)}
@media(max-width:860px){.steps{grid-template-columns:1fr;gap:2.5rem}.steps::before,.steps::after{display:none}.step{padding-left:1.4rem;padding-top:0}.step::before{top:.45em}}
.closing{margin-top:4rem;max-width:60ch;color:var(--fg2)}

/* offer */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin-top:3rem;perspective:1400px}
.card{position:relative;min-width:0;border:1px solid var(--line);border-radius:22px;padding:2rem;background:var(--bg2);display:flex;flex-direction:column;gap:1.1rem;transition:transform .15s ease-out,border-color .4s,box-shadow .5s;transform-style:preserve-3d;transform:rotateX(var(--rx,0)) rotateY(var(--ry,0));overflow:hidden}
.card::before{content:"";position:absolute;inset:0;background:radial-gradient(420px 420px at var(--mx,50%) var(--my,0%),rgba(220,203,255,.14),transparent 60%);opacity:0;transition:opacity .4s;pointer-events:none}
.card:hover::before{opacity:1}
.card:hover{border-color:rgba(220,203,255,.35);box-shadow:0 30px 60px -30px rgba(220,203,255,.25)}
.card{--c:var(--lav)}
.card.flag{border-color:color-mix(in srgb,var(--c) 55%,transparent);background:linear-gradient(180deg,color-mix(in srgb,var(--c) 12%,transparent),transparent 60%),var(--bg2);transform:rotateX(var(--rx,0)) rotateY(var(--ry,0)) translateY(-10px)}
.card.flag .tag{background:var(--c);color:var(--ink);padding:.35rem .6rem;border-radius:999px}
.card .tag{color:var(--c)}
.card .prob{color:var(--c)}
.card li::before{background:var(--c)}
.card .ico{color:var(--c);border-color:color-mix(in srgb,var(--c) 35%,transparent);background:color-mix(in srgb,var(--c) 7%,transparent)}
.card::before{background:radial-gradient(420px 420px at var(--mx,50%) var(--my,0%),color-mix(in srgb,var(--c) 18%,transparent),transparent 60%)}
.card:hover{border-color:color-mix(in srgb,var(--c) 45%,transparent);box-shadow:0 30px 60px -30px color-mix(in srgb,var(--c) 35%,transparent)}
.card h3{color:color-mix(in srgb,var(--c) 70%,var(--fg))}
@media(max-width:860px){.card.flag{transform:none}}
.card .ico{width:64px;height:64px;color:var(--lav);display:grid;place-items:center;border:1px solid var(--line);border-radius:18px;background:rgba(220,203,255,.04)}
.card .ico svg{width:34px;height:34px;overflow:visible}
.card .ico path,.card .ico circle,.card .ico polyline,.card .ico line{fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:140;stroke-dashoffset:0;transition:stroke-dashoffset 1.2s var(--ease)}
.card:hover .ico path,.card:hover .ico circle,.card:hover .ico polyline,.card:hover .ico line{animation:drawline 1.4s var(--ease)}
@keyframes drawline{from{stroke-dashoffset:140}to{stroke-dashoffset:0}}
.card .top{display:flex;justify-content:space-between;align-items:flex-start}
.card .tag{font-family:var(--display);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--lav)}
.card h3{font-size:2.2rem}
.card .price{font-family:var(--display);font-size:1.25rem;letter-spacing:-.02em;color:var(--fg);margin-top:-.4rem}
.card .price small{font-size:.8rem;color:var(--fg2);letter-spacing:.04em;margin-left:.3rem}
.card .prob{font-family:var(--serif);font-style:italic;font-size:1.2rem;color:var(--lav);line-height:1.3}
.card .one{color:var(--fg)}
.card .for{font-size:.9rem;color:var(--fg2)}
.card ul{list-style:none;padding:0;margin:.4rem 0 0;display:flex;flex-direction:column;gap:.5rem;font-size:.92rem}
.card li{padding-left:1.1rem;position:relative}
.card li::before{content:"";position:absolute;left:0;top:.62em;width:6px;height:1px;background:var(--lav)}
.card .meta{display:flex;justify-content:space-between;font-family:var(--display);font-size:.8rem;color:var(--fg2);border-top:1px solid var(--line);padding-top:1rem;margin-top:auto}
.addons{margin-top:2.5rem;color:var(--fg2);font-size:.95rem;max-width:90ch}
.addons b{color:var(--fg);font-weight:500}
.care{margin-top:5rem;display:grid;grid-template-columns:5fr 7fr;gap:3rem;align-items:start}
.plans{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}
.plan{min-width:0;border:1px solid var(--line);border-radius:18px;padding:1.4rem;display:flex;gap:1rem;align-items:flex-start;transition:transform .4s var(--ease),border-color .4s,background .4s}
.plan:hover{transform:translateY(-4px);border-color:rgba(220,203,255,.35);background:rgba(220,203,255,.04)}
.plan svg{flex:none;width:28px;height:28px;color:var(--lav)}
.plan svg *{fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
.plan b{display:block;font-family:var(--display);font-weight:500;margin-bottom:.3rem}
.plan span{font-size:.9rem;color:var(--fg2)}
@media(max-width:860px){.cards{grid-template-columns:1fr}.care{grid-template-columns:1fr}.plans{grid-template-columns:1fr}}

/* gallery */
.galwrap{position:relative;height:420vh}
.galstick{position:sticky;top:0;height:100vh;height:100svh;display:flex;flex-direction:column;justify-content:center;overflow:hidden}
.track{display:flex;gap:2vw;will-change:transform;padding-left:max(16px,env(safe-area-inset-left,0px));align-items:center}
.work{flex:0 0 min(70vw,900px);aspect-ratio:16/10;border-radius:20px;overflow:hidden;position:relative;background:var(--bg2);border:1px solid var(--line);transform:rotate(var(--r,0)) scale(var(--sc,1));transition:transform .2s ease-out}
.work img{width:100%;height:100%;object-fit:cover;display:block;opacity:.85;transition:transform 1.2s var(--ease)}
.work:hover img{transform:scale(1.05)}.work .wv{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.2s ease}.work.playing .wv{opacity:.9}.work.playing img{opacity:0}
.work .cap{position:absolute;left:0;right:0;bottom:0;padding:1.4rem;background:linear-gradient(0deg,rgba(14,14,16,.9),rgba(14,14,16,0));display:flex;justify-content:space-between;align-items:flex-end;gap:1rem}
.work .cap b{font-family:var(--display);font-weight:500;font-size:1.1rem;display:block}
.work .cap span{color:var(--fg2);font-size:.9rem}
.work.cta{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:1.4rem;text-align:center;background:linear-gradient(135deg,rgba(220,203,255,.08),rgba(255,138,61,.08))}
.work.cta h3{font-size:clamp(1.6rem,3vw,2.6rem)}
.galhead{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;margin-bottom:2rem}
.galhead .cnt{font-family:var(--display);font-variant-numeric:tabular-nums;color:var(--fg2)}
@media(max-width:860px){.galhead .cnt{display:none}.galwrap{padding-block:4rem}.quotes{margin-top:2.5rem}}
@media(max-width:860px){.galwrap{height:auto}.galstick{height:auto;position:static}.track{flex-direction:column;padding-right:max(16px,env(safe-area-inset-right,0px))}.work{flex:none;width:100%}}

/* quotes */
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin-top:3rem}
.quote{min-width:0;border-top:1px solid var(--line);padding-top:1.6rem;position:relative}
.quote::before{content:"“";position:absolute;right:0;top:.6rem;font-family:var(--serif);font-size:4rem;line-height:1;color:var(--lav);opacity:.25}
.quote p{font-family:var(--serif);font-size:1.3rem;line-height:1.35;color:var(--fg)}
.quote footer{margin-top:1.2rem;font-family:var(--display);font-size:.85rem;color:var(--fg2)}
@media(max-width:860px){.quotes{grid-template-columns:1fr}}

/* studio */
.studio{display:grid;grid-template-columns:4fr 8fr;gap:3rem;align-items:center}
.portrait{aspect-ratio:4/5;max-width:360px;width:100%;border-radius:22px;overflow:hidden;background:#161519;position:relative;max-width:100%;border:1px solid var(--line)}
.portrait img{width:100%;height:100%;object-fit:cover;object-position:50% 20%;display:block;transform:scale(var(--z,1.1)) translate(var(--px,0),var(--py,0));transition:transform .18s ease-out;animation:drift 14s ease-in-out infinite}
@keyframes drift{0%,100%{object-position:50% 20%}50%{object-position:52% 24%}}
.portrait canvas{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:0;transition:opacity .6s ease;transform:scale(var(--z,1.1)) translate(var(--px,0),var(--py,0))}.portrait.walk canvas{opacity:1}.portrait.walk img{animation:none;opacity:0}.portrait .sheen{position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,rgba(220,203,255,.14) 50%,transparent 65%);transform:translateX(-120%);animation:sheen 9s ease-in-out infinite;pointer-events:none}
@keyframes sheen{0%,70%{transform:translateX(-120%)}85%{transform:translateX(120%)}100%{transform:translateX(120%)}}
.portrait::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 60%,rgba(14,14,16,.55));pointer-events:none}
.portrait .ph{position:absolute;inset:0;display:flex;align-items:flex-end;padding:1.4rem;color:var(--ink);font-family:var(--display);font-size:.8rem;letter-spacing:.1em;text-transform:uppercase}
.studio p{max-width:52ch;color:var(--fg2);font-size:1.05rem;margin-top:1.4rem}
.tags{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:1.6rem}
.tags span{font-family:var(--display);font-size:.78rem;padding:.4rem .8rem;border:1px solid var(--line);border-radius:999px;color:var(--lav)}
.ac{margin-top:6rem;border-top:1px solid var(--line);padding-top:3rem;display:grid;grid-template-columns:5fr 7fr;gap:3rem}
.ac p{color:var(--fg2);max-width:60ch}
@media(max-width:860px){.studio,.ac{grid-template-columns:1fr}.portrait{max-width:260px}}

/* faq */
.faq{margin-top:2.5rem;border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:2rem;padding:1.4rem 0;font-family:var(--display);font-size:clamp(1.05rem,1.6vw,1.4rem);letter-spacing:-.015em;transition:padding-left .35s var(--ease)}
.faq summary:hover{padding-left:.6rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-weight:300;font-size:1.6rem;color:var(--lav);transition:transform .3s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{color:var(--fg2);max-width:70ch;padding-bottom:1.6rem}

/* contact */
.contact{display:grid;grid-template-columns:5fr 7fr;gap:4rem;align-items:start}
.formcard{position:relative;border-radius:26px;padding:2.4rem;background:linear-gradient(160deg,rgba(255,138,61,.14),rgba(220,203,255,.08) 55%,transparent),var(--bg2);border:1px solid rgba(255,138,61,.45);box-shadow:0 40px 90px -40px rgba(255,138,61,.45),0 0 0 1px rgba(255,138,61,.08);overflow:hidden}
.formcard::before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;background:linear-gradient(130deg,var(--accent),transparent 40%,var(--lav) 80%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:.8;pointer-events:none;animation:ring 6s linear infinite}
@keyframes ring{to{filter:hue-rotate(20deg)}}
.fc-head{margin-bottom:1.6rem}
.fc-k{display:inline-block;font-family:var(--display);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;background:var(--accent);color:var(--ink);padding:.4rem .7rem;border-radius:999px;margin-bottom:.9rem}
.fc-head h3{font-size:clamp(1.5rem,2.4vw,2rem)}
.fc-head p{color:var(--fg2);margin-top:.4rem}
.formcard .f input{padding:.9rem 0;font-size:1.1rem}
.btn.big{padding:1.1rem 1.9rem;font-size:1.05rem;width:100%;justify-content:center}
@media(max-width:860px){.formcard{padding:1.5rem 1.2rem}.contact{gap:2.5rem}}
.strefa{text-align:left;border-top:1px solid var(--line);padding-top:4rem}
:root[data-theme="light"] .formcard{background:linear-gradient(160deg,rgba(240,115,42,.1),rgba(110,79,201,.06) 55%,transparent),#fff}
.contact h2{font-size:clamp(3rem,8vw,7.5rem);letter-spacing:-.045em}
.contact .sub{margin-top:1.4rem;color:var(--fg2);max-width:40ch;font-size:1.05rem}
.contact .meta{margin-top:2.4rem;display:flex;flex-direction:column;gap:.5rem;font-family:var(--display);font-size:.95rem}
.contact .meta small{color:var(--fg2);display:block;margin-top:.6rem;font-family:var(--body)}
form{display:flex;flex-direction:column;gap:1rem}
.f{display:flex;flex-direction:column;gap:.4rem;position:relative}
.f label{font-family:var(--display);font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;color:var(--fg2)}
.f input,.f textarea{background:transparent;border:0;border-bottom:1px solid var(--line);color:var(--fg);font:inherit;font-size:1.05rem;padding:.7rem 0;border-radius:0;width:100%}
.f::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:0;background:var(--lav);transition:width .5s var(--ease)}
.f:focus-within::after{width:100%}
.f input:focus,.f textarea:focus{outline:none}
.f textarea{min-height:110px;resize:vertical}
.chk{display:flex;gap:.7rem;align-items:flex-start;font-size:.85rem;color:var(--fg2)}
.chk input{margin-top:.25rem;accent-color:var(--accent)}
.thanks{display:none;padding:2rem;border:1px solid var(--line);border-radius:18px;font-family:var(--display);font-size:1.3rem}
.thanks.on{display:block}
form.sent{display:none}
@media(max-width:860px){.contact{grid-template-columns:1fr}}

/* footer */
footer.site{border-top:1px solid var(--line);padding-block:2.5rem;font-size:.85rem;color:var(--fg2)}
footer.site .row{display:flex;justify-content:space-between;gap:2rem;flex-wrap:wrap}
footer.site .links{display:flex;gap:1.4rem;flex-wrap:wrap}
footer.site a:hover{color:var(--fg)}
.cookie{position:fixed;left:max(16px,env(safe-area-inset-left,0px));bottom:max(16px,env(safe-area-inset-bottom,0px));z-index:55;background:var(--bg2);border:1px solid var(--line);border-radius:16px;padding:1rem 1.2rem;max-width:380px;display:flex;flex-direction:column;gap:.8rem;font-size:.85rem;color:var(--fg2)}
.cookie .btn{min-height:44px}
@media(max-width:860px){.cookie{left:max(12px,env(safe-area-inset-left,0px));right:max(12px,env(safe-area-inset-right,0px));max-width:none;flex-direction:column;align-items:stretch;gap:.55rem;padding:.7rem .9rem;font-size:.78rem}.cookie div{flex:none}.cookie div .btn{flex:1}.cookie .btn{padding:.5rem .8rem;font-size:.78rem}}
.cookie div{display:flex;gap:.6rem}
.cookie .btn{padding:.55rem 1rem;font-size:.8rem}
.cookie[hidden]{display:none!important}@media(max-width:430px){.nav{gap:.5rem}.logo{gap:.5rem}.logo .wm{height:8px}.nav .btn{padding:.5rem .7rem}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.rv{opacity:1;transform:none}.lines h2 .ln span{transform:none}.hero{height:auto}.stage{position:relative;height:100svh}.chapter{opacity:1;transform:none}.chapter::before{opacity:1}.chapter.c2,.chapter.c3,.chapter.c4{display:none}.galwrap{height:auto}.galstick{position:static;height:auto}.track{flex-direction:column}.work{width:100%;flex:none;transform:none}.card{transform:none}}
@media(max-width:860px){#cnt{display:none}.work{aspect-ratio:auto;display:flex;flex-direction:column}.work img{height:auto;aspect-ratio:16/10;opacity:1}.work .cap{position:static;background:var(--bg2);padding:1rem 1.1rem;flex-direction:column;align-items:flex-start;gap:.4rem}.work .cap>span{font-size:.8rem;color:var(--lav)}.work{position:relative}.work .wv{inset:0 0 auto 0;height:auto;aspect-ratio:16/10}}
/* warstwy: prawdziwe urządzenia i żywy interfejs zamiast grafik */
.layer-media.mock{aspect-ratio:16/11;padding:0;overflow:hidden;border-radius:18px;border:1px solid var(--line);background:radial-gradient(120% 90% at 85% 0%,rgba(220,203,255,.09),transparent 55%),radial-gradient(80% 70% at 0% 100%,rgba(255,138,61,.07),transparent 60%),linear-gradient(180deg,var(--bg3),var(--bg2));box-shadow:0 50px 100px -50px rgba(0,0,0,.85)}
.layer-media.mock::after{content:"";position:absolute;inset:0;background:radial-gradient(rgba(220,203,255,.06) 1px,transparent 1px) 0 0/18px 18px;mask-image:linear-gradient(180deg,#000,transparent 70%);pointer-events:none}
.mock .par{transition:transform .5s var(--ease)}
.mk-browser{position:absolute;left:7%;top:10%;width:76%;border-radius:10px;overflow:hidden;background:#0b0b0d;border:1px solid rgba(255,255,255,.08);box-shadow:0 30px 60px -25px rgba(0,0,0,.9);z-index:1}
.mk-bar{display:flex;align-items:center;gap:6px;height:26px;padding:0 10px;background:#17161b;border-bottom:1px solid rgba(255,255,255,.06)}
.mk-bar>i{width:8px;height:8px;border-radius:50%;background:#2c2a33}
.mk-url{margin:0 auto;display:flex;align-items:center;gap:5px;padding:3px 12px;border-radius:6px;background:#0e0e10;color:#a49cb6;font:500 .62rem/1 var(--body);letter-spacing:.02em}
.mk-url svg{width:9px;height:9px;fill:none;stroke:#7d758f;stroke-width:1.2}
.mk-screen{position:relative;overflow:hidden;background:#0b0b0d}
.mk-browser .mk-screen{aspect-ratio:16/10}
.mk-screen img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 0}
.mk-phone{position:absolute;right:7%;bottom:7%;width:19%;aspect-ratio:9/19.5;border-radius:22px;padding:5px;background:linear-gradient(145deg,#2a2830,#0d0c10);box-shadow:0 30px 60px -20px rgba(0,0,0,.95),inset 0 0 0 1px rgba(255,255,255,.08);z-index:2}
.mk-phone .mk-screen{height:100%;border-radius:18px}
.mk-notch{position:absolute;top:9px;left:50%;width:30%;height:9px;margin-left:-15%;border-radius:9px;background:#000;z-index:3}
.mk-chip{position:absolute;left:4%;bottom:7%;z-index:3;display:flex;align-items:center;gap:.8rem;padding:.7rem 1rem .7rem .9rem;border-radius:14px;background:rgba(14,14,16,.72);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(220,203,255,.18);color:#EFE7FF}
.mk-chip b{font:300 2rem/1 var(--display);letter-spacing:-.04em;color:#fff;white-space:nowrap}.mk-chip b .cnt{font:inherit;color:inherit}
.mk-chip>span{font:500 .62rem/1.35 var(--display);letter-spacing:.12em;text-transform:uppercase;color:#DCCBFF}
/* wejście */
.mk-site .mk-browser{opacity:0;translate:0 24px;transition:opacity .9s var(--ease),translate 1.1s var(--ease)}
.mk-site .mk-phone{opacity:0;translate:30px 40px;transition:opacity .9s var(--ease) .35s,translate 1.2s var(--ease) .35s}
.mk-site .mk-chip{opacity:0;translate:0 14px;transition:opacity .8s var(--ease) .8s,translate .9s var(--ease) .8s}
.layer.in .mk-site .mk-browser,.layer.in .mk-site .mk-phone,.layer.in .mk-site .mk-chip{opacity:1;translate:0 0}
.layer.in .mk-site .mk-browser img{animation:mkpan 16s ease-in-out 1.5s infinite alternate}
@keyframes mkpan{to{object-position:50% 100%;transform:scale(1.04)}}
/* czat */
.mk-app{position:absolute;left:6%;top:8%;width:62%;bottom:8%;display:flex;flex-direction:column;border-radius:16px;background:rgba(20,19,23,.92);border:1px solid rgba(255,255,255,.08);box-shadow:0 30px 70px -30px rgba(0,0,0,.9);overflow:hidden;z-index:1}
.mk-head{display:flex;align-items:center;gap:.7rem;padding:.8rem 1rem;border-bottom:1px solid rgba(255,255,255,.06)}
.mk-head b{display:block;font:500 .82rem/1.2 var(--display);color:#EFE7FF}
.mk-head small{display:flex;align-items:center;gap:.35rem;font-size:.68rem;color:#8f87a3}
.mk-head small i{width:6px;height:6px;border-radius:50%;background:#5fd38d;box-shadow:0 0 8px #5fd38d}
.mk-head time{margin-left:auto;font:500 .7rem/1 var(--display);color:#8f87a3;letter-spacing:.06em}
.mk-av{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#DCCBFF,#FF8A3D)}
.mk-av svg{width:15px;height:15px;fill:#0E0E10}
.mk-msgs{flex:1;display:flex;flex-direction:column;justify-content:flex-end;padding:.4rem 1rem 1rem;overflow:hidden}
.msg{max-width:84%;padding:.6rem .8rem;margin-top:.55rem;border-radius:14px;font-size:.76rem;line-height:1.45}
.msg p{margin:0;max-width:none;color:inherit}
.msg.in{align-self:flex-start;background:#25232c;color:#e6e0f2;border-bottom-left-radius:4px}
.msg.out{align-self:flex-end;background:linear-gradient(135deg,#DCCBFF,#c9b2ff);color:#17121f;border-bottom-right-radius:4px}
.msg time{display:block;margin-top:.3rem;font:600 .58rem/1 var(--display);letter-spacing:.1em;text-transform:uppercase;opacity:.6}
.typing{align-self:flex-end;display:flex;gap:4px;padding:.65rem .8rem;margin-top:.55rem;border-radius:14px;background:#25232c;overflow:hidden}
.typing i{width:5px;height:5px;border-radius:50%;background:#bfb5d6;animation:mkdot 1s infinite}
.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
@keyframes mkdot{0%,60%,100%{opacity:.3;transform:none}30%{opacity:1;transform:translateY(-2px)}}
.mk-crm{position:absolute;right:5%;top:24%;width:33%;padding:.9rem 1rem;border-radius:14px;background:rgba(14,14,16,.8);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(220,203,255,.2);box-shadow:0 30px 60px -25px rgba(0,0,0,.9);color:#EFE7FF;z-index:2}
.mk-crm-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem;font:600 .58rem/1 var(--display);letter-spacing:.14em;text-transform:uppercase;color:#8f87a3}
.mk-crm-top em{font-style:normal;font-family:var(--display);padding:.25rem .45rem;border-radius:20px;background:rgba(255,138,61,.15);color:#FF8A3D}
.mk-crm b{display:block;font:500 .9rem/1.25 var(--display);margin-bottom:.6rem}
.mk-crm dl{margin:0;display:grid;gap:.35rem}
.mk-crm dl div{display:flex;justify-content:space-between;gap:.5rem;font-size:.7rem;padding-top:.35rem;border-top:1px solid rgba(255,255,255,.06)}
.mk-crm dt{color:#8f87a3}.mk-crm dd{margin:0;color:#EFE7FF}.mk-crm dd.hot{color:#FF8A3D}
.mk-note{position:absolute;right:6%;bottom:10%;width:36%;display:flex;gap:.6rem;align-items:center;padding:.7rem .8rem;border-radius:14px;background:rgba(239,231,255,.94);color:#17121f;box-shadow:0 20px 40px -20px rgba(0,0,0,.8);z-index:3}
.mk-note b{display:block;font:600 .68rem/1.2 var(--display);letter-spacing:.04em;white-space:nowrap}
.mk-note small{font-size:.66rem;color:#4b4459}
.mk-bell{flex:none;width:22px;height:22px;border-radius:7px;background:#FF8A3D;box-shadow:0 0 0 4px rgba(255,138,61,.2)}
/* sekwencja czatu: wiadomości dochodzą od dołu i wypychają starsze w górę */
.mk-chat .msg,.mk-chat .typing{max-height:0;opacity:0;padding-block:0;margin-top:0}
.mk-chat .s5,.mk-chat .s6{opacity:0;translate:0 14px}
.layer.in .mk-chat .s1{animation:mkmsg .7s var(--ease) .4s forwards}
.layer.in .mk-chat .s2{animation:mktype 1.6s var(--ease) 1.1s forwards}
.layer.in .mk-chat .s3{animation:mkmsg .7s var(--ease) 2.7s forwards}
.layer.in .mk-chat .s4{animation:mkmsg .7s var(--ease) 3.8s forwards}
.layer.in .mk-chat .s5{animation:mkin .8s var(--ease) 4.6s forwards}
.layer.in .mk-chat .s6{animation:mkin .8s var(--ease) 5.6s forwards}
@keyframes mkmsg{to{max-height:220px;opacity:1;padding-block:.6rem;margin-top:.55rem}}
@keyframes mktype{0%{max-height:0;opacity:0;padding-block:0;margin-top:0}15%,80%{max-height:40px;opacity:1;padding-block:.65rem;margin-top:.55rem}100%{max-height:0;opacity:0;padding-block:0;margin-top:0}}
@keyframes mkin{to{opacity:1;translate:0 0}}
:root[data-theme="light"] .layer-media.mock{background:radial-gradient(120% 90% at 85% 0%,rgba(110,79,201,.12),transparent 55%),radial-gradient(80% 70% at 0% 100%,rgba(240,115,42,.1),transparent 60%),linear-gradient(180deg,#ECE4F6,#F4EFFA);box-shadow:0 50px 100px -50px rgba(60,40,100,.45)}
@media(max-width:860px){
 .layer-media.mock{aspect-ratio:4/5}
 .mk-browser{left:5%;top:7%;width:90%}
 .mk-phone{right:7%;bottom:5%;width:34%}
 .mk-chip{left:5%;bottom:6%}
 .mk-app{left:5%;top:5%;width:90%;bottom:30%}
 .mk-crm{left:5%;right:auto;top:auto;bottom:4%;width:52%}
 .mk-note{right:5%;bottom:6%;width:40%}.mk-note b{white-space:normal}
 .msg{font-size:.72rem}
}
@media(prefers-reduced-motion:reduce){.mk-chat .s1,.mk-chat .s3,.mk-chat .s4{max-height:none!important;padding-block:.6rem!important;margin-top:.55rem!important}.mk-chat .s1,.mk-chat .s3,.mk-chat .s4,.mk-chat .s5,.mk-chat .s6,.mk-site .mk-browser,.mk-site .mk-phone,.mk-site .mk-chip{opacity:1!important;translate:none!important;animation:none!important}}

/* gdzie działamy */
.areas{margin-top:3rem;border-top:1px solid var(--line)}
.areas a{display:grid;grid-template-columns:4rem 1fr 1.3fr 2rem;align-items:baseline;gap:1rem;padding:1.6rem 0;border-bottom:1px solid var(--line);transition:padding-left .45s var(--ease),background .3s}
.areas a:hover{padding-left:.8rem;background:linear-gradient(90deg,rgba(220,203,255,.05),transparent 60%)}
.areas small{font:500 .72rem/1 var(--display);letter-spacing:.14em;color:var(--fg2)}
.areas b{font:400 clamp(2rem,4.6vw,4.2rem)/1 var(--display);letter-spacing:-.045em;color:var(--fg)}
.areas span{color:var(--fg2);font-size:.95rem}
.areas i{font-style:normal;color:var(--accent);font-size:1.4rem;transition:transform .45s var(--ease)}
.areas a:hover i{transform:translateX(6px)}
.svc{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:2rem}
.svc a{padding:.7rem 1.1rem;border:1px solid var(--line);border-radius:999px;font:400 .92rem/1 var(--display);color:var(--fg);transition:border-color .3s,background .3s}
.svc a:hover{border-color:var(--lav);background:rgba(220,203,255,.06)}
footer.site .seo{flex-basis:100%;order:3;gap:.4rem 1.2rem;font-size:.8rem}
@media(max-width:860px){.areas a{grid-template-columns:2.4rem 1fr 1.4rem;row-gap:.3rem}.areas span{grid-column:2/3;grid-row:2}.areas i{grid-row:1;grid-column:3}}