:root{
  --bg:#0a0a0a;--ink:#f2f0ec;--mute:#8d8b88;--dim:#4a4846;--line:#1f1f1f;
  --lbg:#f3f1f3;--link:#0c0c0c;--lmute:#6f6c73;--lline:#dcd9de;
  --v1:#4b2fd0;--v2:#a884ff;
  --sans:"Inter Tight","Inter",system-ui,sans-serif;--body:"Inter",system-ui,sans-serif;--serif:"Instrument Serif","Playfair Display",Georgia,serif;
  --nebula:radial-gradient(60% 90% at 30% 40%,#d9c7ff 0%,transparent 60%),radial-gradient(50% 70% at 75% 70%,#ffb86b 0%,transparent 55%),radial-gradient(80% 80% at 60% 20%,#5b3fd6 0%,#1a0f3f 70%);
  --glow:radial-gradient(90% 120% at 20% 0%,#6a4be0 0%,#2b1a6b 45%,#0a0a0a 100%);
  --core:radial-gradient(70% 60% at 50% 60%,#4b2fd0 0%,#160d3a 60%,#0d0d0d 100%);
  --ease:cubic-bezier(.19,1,.22,1);
  --gut:clamp(16px,3vw,40px);
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:400 14px/1.55 var(--body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
body.fine,body.fine a,body.fine button,body.fine label{cursor:none}
h1,h2,h3,h4{margin:0;font-family:var(--sans);font-weight:400;letter-spacing:-.03em;text-wrap:balance}
em{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:-.01em}
p{margin:0}a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
.cap{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute)}
.pad{padding-inline:var(--gut)}
.u{position:relative}
.u::after{content:"";position:absolute;left:0;bottom:-2px;height:1px;width:100%;background:currentColor;transform-origin:right;transition:transform .9s var(--ease)}
.u:hover::after{transform:scaleX(0);transform-origin:left}
/* cursor */
.cur{position:fixed;left:0;top:0;width:8px;height:8px;border-radius:50%;background:var(--ink);pointer-events:none;z-index:99;transform:translate(-50%,-50%);transition:width .5s var(--ease),height .5s var(--ease),background .5s;mix-blend-mode:difference;display:none}
body.fine .cur{display:block}
.cur.big{width:56px;height:56px}
/* nav */
.nav{position:fixed;top:0;left:0;right:0;z-index:30;display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr auto auto;gap:24px;align-items:start;padding:22px var(--gut);font-size:11px;letter-spacing:.06em;text-transform:uppercase;transition:background .6s,padding .6s var(--ease);transform:translateY(-100%);animation:navin 1.2s var(--ease) .6s forwards}
@keyframes navin{to{transform:none}}
.nav.s{background:rgba(10,10,10,.8);backdrop-filter:blur(10px);padding-block:14px}
.nav .logo{font-size:20px;text-transform:none;letter-spacing:-.04em;display:flex;align-items:center;gap:.22em;font-family:var(--sans);line-height:.9}
.nav .logo sup{font-size:.28em;vertical-align:top;position:relative;top:.32em;letter-spacing:0}
.nav .logo em{font-size:1.04em}
.nav .g{display:grid;gap:4px}
.nav .g span{color:var(--mute);font-size:10px}
.nav .g span a{margin-right:6px;transition:color .5s}
.nav .g span a:hover,.nav a:hover{color:var(--ink)}
.nav .g>a{transition:color .5s}
.nav .lang{color:var(--mute);background:none;border:0;padding:0;letter-spacing:.06em;text-transform:uppercase;font-size:11px}
.nav .lang b{font-weight:400;color:var(--ink);transition:color .5s}
.nav .lang span{transition:color .5s}
.nav .lang:hover span{color:var(--ink)}
.nav .menu{border:1px solid var(--ink);padding:8px 12px;letter-spacing:.06em;text-transform:uppercase;font-size:11px;transition:background .7s var(--ease),color .7s var(--ease)}
.nav .menu:hover{background:var(--ink);color:var(--bg)}
/* hero slider */
.hero{position:relative;height:min(100svh,920px);min-height:560px;overflow:hidden;background:#0a0a0a}
.slide{position:absolute;inset:0;opacity:0;transition:opacity 1.6s var(--ease)}
.slide.on{opacity:1}
.slide .bgv{position:absolute;inset:-6%;background-size:160% 160%;animation:drift 22s ease-in-out infinite alternate;transition:transform 2.4s var(--ease);transform:scale(1.08)}
.slide.on .bgv{transform:scale(1)}
.slide:nth-child(1) .bgv{background-image:radial-gradient(70% 90% at 25% 35%,#d9c7ff 0%,transparent 55%),radial-gradient(50% 70% at 80% 75%,#ffb86b 0%,transparent 50%),radial-gradient(90% 90% at 60% 20%,#5b3fd6 0%,#120a2e 70%)}
.slide:nth-child(2) .bgv{background-image:radial-gradient(60% 60% at 50% 65%,#4b2fd0 0%,#160d3a 55%,#0a0a0a 100%)}
.slide:nth-child(3) .bgv{background-image:linear-gradient(180deg,#1b1b1b 0%,#0a0a0a 60%),radial-gradient(80% 50% at 50% 0%,#2b1a6b 0%,transparent 70%);background-blend-mode:screen}
@keyframes drift{from{background-position:0% 0%}to{background-position:100% 100%}}
.slide .grain{position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(255,255,255,.015) 0 1px,transparent 1px 3px);mix-blend-mode:overlay;pointer-events:none}
.slide .shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,10,10,.35) 0%,rgba(10,10,10,0) 30%,rgba(10,10,10,.55) 100%)}
.slide .mid{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:grid;grid-template-columns:1.2fr 2fr 1fr;gap:24px;align-items:center;padding-inline:var(--gut)}
.slide .idx{font-family:var(--sans);font-size:clamp(20px,2.2vw,28px);letter-spacing:-.02em}
.slide .idx span{color:var(--mute)}
.slide h2{font-size:clamp(28px,3.4vw,44px);line-height:1.05}
.slide h2 small{display:block;font-size:.66em;color:rgba(242,240,236,.75);margin-top:4px}
.slide .view{text-align:right;font-size:13px;letter-spacing:.02em;justify-self:end}
.slide .bot{position:absolute;left:0;right:0;bottom:28px;display:grid;grid-template-columns:1.2fr 2fr 1fr;gap:24px;align-items:end;padding-inline:var(--gut)}
.slide .desc{font-size:13px;line-height:1.5;max-width:40ch;color:rgba(242,240,236,.85)}
.slide .sd{text-align:right;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:rgba(242,240,236,.6)}
.dots{display:flex;gap:4px;align-items:center}
.dots i{display:block;width:26px;height:2px;background:rgba(242,240,236,.3);cursor:pointer;position:relative;overflow:hidden}
.dots i::after{content:"";position:absolute;inset:0;background:var(--ink);transform:scaleX(0);transform-origin:left}
.dots i.on::after{animation:fill 6s linear forwards}
@keyframes fill{to{transform:none}}
.slide .up{opacity:0;transform:translateY(22px);transition:opacity 1.4s var(--ease),transform 1.4s var(--ease)}
.slide.on .up{opacity:1;transform:none}
.slide.on .up:nth-child(1){transition-delay:.4s}.slide.on .up:nth-child(2){transition-delay:.55s}.slide.on .up:nth-child(3){transition-delay:.7s}
.slide.on .bot .up{transition-delay:.8s}
/* wordmark */
.mark{overflow:hidden;padding:clamp(18px,3vw,36px) 0 clamp(10px,2vw,22px)}
.mark .t{font-family:var(--sans);font-size:clamp(90px,19.5vw,300px);line-height:.78;letter-spacing:-.06em;white-space:nowrap;margin-left:-.04em;display:flex;align-items:center;gap:.14em}
.mark .t em{font-size:1.02em}
.mark .t .sw{width:1.4em;aspect-ratio:2/1;background:var(--nebula);background-size:150% 150%;animation:drift 12s ease-in-out infinite alternate;flex:none;transform-origin:left;transition:transform 1.6s var(--ease)}
.mark .sub{display:grid;grid-template-columns:1.2fr 2fr 1fr;gap:24px;padding:16px var(--gut) 0;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute)}
.mark .sub span:last-child{text-align:right}
/* word reveal */
.wr .w{display:inline-block;overflow:hidden;vertical-align:bottom;margin-bottom:-.12em;padding-bottom:.12em}
.wr .w i{display:inline-block;font-style:inherit;transform:translateY(110%);transition:transform 1.3s var(--ease)}
.wr.in .w i{transform:none}
/* generic section */
section{padding-block:clamp(72px,10vw,140px)}
.row3{display:grid;grid-template-columns:1.2fr 2fr 1fr;gap:24px;align-items:start}
.h{font-size:clamp(30px,4.2vw,58px);line-height:1;max-width:20ch}
.lead{color:var(--mute);font-size:15px;max-width:46ch;line-height:1.55}
.ln{height:1px;background:var(--line);transform:scaleX(0);transform-origin:left;transition:transform 1.6s var(--ease)}
.ln.in{transform:none}
/* statement */
.state .h{font-size:clamp(28px,3.6vw,52px);max-width:26ch}
.state .facts{margin-top:clamp(40px,6vw,72px);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.state .facts div{padding:22px 0 26px}
.state .facts .n{font-family:var(--sans);font-size:clamp(28px,3.2vw,44px);letter-spacing:-.04em;line-height:1;margin-top:12px}
/* services list */
.srv{margin-top:clamp(36px,5vw,64px)}
.srow{display:grid;grid-template-columns:1.2fr 2fr 1fr;gap:24px;padding:30px 0;align-items:start;position:relative;transition:padding-left .9s var(--ease)}
.srow:hover{padding-left:12px}
.srow::before{content:"";position:absolute;left:0;top:0;height:1px;width:100%;background:var(--line);transform:scaleX(0);transform-origin:left;transition:transform 1.4s var(--ease)}
.srow.in::before{transform:none}
.srow::after{content:"";position:absolute;left:0;top:0;width:0;height:1px;background:var(--ink);transition:width .9s var(--ease)}
.srow:hover::after{width:100%}
.srow:last-child{border-bottom:1px solid var(--line)}
.srow .l{display:grid;gap:6px}
.srow .l b{font-family:var(--sans);font-weight:400;font-size:clamp(22px,2.4vw,32px);letter-spacing:-.03em;line-height:1.05}
.srow p{color:var(--mute);max-width:52ch;line-height:1.55}
.srow ul{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px 16px;font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--dim)}
.srow .pr{text-align:right;font-family:var(--sans);font-size:clamp(20px,2.2vw,28px);letter-spacing:-.03em;white-space:nowrap;font-variant-numeric:tabular-nums}
.srow .pr small{display:block;font-family:var(--body);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);margin-top:6px}
/* media grid */
.media{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.media a{position:relative;aspect-ratio:16/10;overflow:hidden;background:#0d0d0d;display:block;clip-path:inset(0 0 100% 0);transition:clip-path 1.6s var(--ease)}
.media a.in{clip-path:inset(0 0 0 0)}
.media a .v{position:absolute;inset:0;transition:transform 2.2s var(--ease);transform:scale(1.12)}
.media a.in .v{transform:scale(1)}
.media a:hover .v{transform:scale(1.05)}
.media a .ph{position:absolute;inset:0;background:linear-gradient(160deg,#161616,#0c0c0c)}
.media a .ph::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(135deg,transparent 0 22px,rgba(242,240,236,.025) 22px 23px)}
.media a .t{position:absolute;left:24px;right:24px;bottom:22px;display:flex;justify-content:space-between;align-items:end;gap:16px;transition:transform 1s var(--ease)}
.media a:hover .t{transform:translateY(-4px)}
.media a .t b{font-family:var(--sans);font-weight:400;font-size:clamp(20px,2.2vw,30px);letter-spacing:-.03em;line-height:1.05}
.media a .t small{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:rgba(242,240,236,.65);transition:color .6s}
.media a:hover .t small{color:var(--ink)}
.media a .k{position:absolute;left:24px;top:20px;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:rgba(242,240,236,.65)}
.media a .r{position:absolute;right:24px;top:20px;font-family:var(--sans);font-size:clamp(28px,3vw,44px);letter-spacing:-.04em;line-height:1}
.media.tall a{aspect-ratio:4/3}
.media.tall a .big{position:absolute;left:24px;top:50%;transform:translateY(-50%);font-family:var(--sans);font-size:clamp(48px,8vw,120px);letter-spacing:-.05em;line-height:.9}
.media.tall a .big em{font-size:.9em}
/* process */
.steps{margin-top:clamp(36px,5vw,64px)}
.step{display:grid;grid-template-columns:1.2fr 2fr 1fr;gap:24px;padding:26px 0;position:relative}
.step::before{content:"";position:absolute;left:0;top:0;height:1px;width:100%;background:var(--line);transform:scaleX(0);transform-origin:left;transition:transform 1.4s var(--ease)}
.step.in::before{transform:none}
.step:last-child{border-bottom:1px solid var(--line)}
.step .n{font-family:var(--serif);font-style:italic;font-size:26px;line-height:1;color:var(--mute)}
.step b{font-family:var(--sans);font-weight:400;font-size:clamp(20px,2vw,26px);letter-spacing:-.02em;display:block;margin-bottom:6px}
.step p{color:var(--mute);max-width:52ch}
.step .d{text-align:right;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute)}
/* client page */
.light{background:var(--lbg);color:var(--link)}
.light .cap,.light .lead{color:var(--lmute)}
.shot{background:var(--bg);color:var(--ink);margin-top:clamp(36px,5vw,64px);display:grid;grid-template-columns:1.2fr 2fr 1fr;gap:24px;padding:clamp(22px,3vw,40px) var(--gut);clip-path:inset(0 0 100% 0);transition:clip-path 1.8s var(--ease)}
.shot.in{clip-path:inset(0)}
.shot .pct{font-family:var(--sans);font-size:clamp(48px,7vw,110px);letter-spacing:-.05em;line-height:.9;font-variant-numeric:tabular-nums}
.shot .prog{height:2px;background:var(--line);position:relative;margin-top:22px}
.shot .prog b{position:absolute;left:0;top:0;bottom:0;width:0;background:var(--ink);transition:width 1.8s var(--ease)}
.shot ul{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.shot li{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--line);font-size:13px}
.shot li.d{color:var(--dim);text-decoration:line-through}
.shot li span:last-child{color:var(--dim);font-variant-numeric:tabular-nums}
.shot dl{margin:0;display:grid;gap:14px;font-size:12px}
.shot dt{font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute)}
.shot dd{margin:4px 0 0;color:var(--ink)}
.pts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:clamp(36px,5vw,64px)}
.pts b{font-family:var(--sans);font-weight:400;font-size:20px;letter-spacing:-.02em;display:block;margin-bottom:6px;color:var(--link)}
.pts p{color:var(--lmute);font-size:13px;max-width:34ch}
/* form */
form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 32px}
.f{display:grid;gap:8px}.f.w{grid-column:1/-1}
.f label{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute)}
.f input,.f select,.f textarea{background:none;border:0;border-bottom:1px solid var(--dim);padding:10px 0;color:var(--ink);outline:none;width:100%;border-radius:0;transition:border-color .6s}
.f input:focus,.f select:focus,.f textarea:focus{border-color:var(--ink)}
.f select option{background:#151515}
.f textarea{resize:vertical;min-height:80px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips label{border:1px solid var(--line);padding:8px 12px;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);transition:background .7s var(--ease),color .7s var(--ease),border-color .7s var(--ease)}
.chips label:hover{border-color:var(--mute);color:var(--ink)}
.chips input{display:none}
.chips label:has(input:checked){background:var(--ink);border-color:var(--ink);color:var(--bg)}
.btn{display:inline-flex;align-items:center;gap:12px;border:1px solid var(--ink);color:var(--ink);padding:14px 22px;font-size:11px;letter-spacing:.06em;text-transform:uppercase;background:none;position:relative;overflow:hidden;transition:color .8s var(--ease)}
.btn::before{content:"";position:absolute;inset:0;background:var(--ink);transform:scaleY(0);transform-origin:bottom;transition:transform .8s var(--ease);z-index:0}
.btn:hover::before{transform:none}
.btn:hover{color:var(--bg)}
.btn>*{position:relative;z-index:1}
.btn i{width:16px;height:1px;background:currentColor;display:block;transition:width .8s var(--ease)}
.btn:hover i{width:30px}
.ok{grid-column:1/-1;border:1px solid var(--line);padding:22px;display:none}
.ok.on{display:block}
/* contact block */
.contact{border-top:1px solid var(--line);padding-block:clamp(64px,9vw,120px)}
.contact .big{text-align:right;font-family:var(--sans);font-size:clamp(26px,4.2vw,60px);letter-spacing:-.03em;line-height:1.02}
.contact .big a{transition:color .6s}
.contact .big a:hover{color:var(--mute)}
.contact .sm{text-align:right;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--mute);margin-top:12px}
.contact .blk+.blk{margin-top:clamp(40px,6vw,80px)}
footer{border-top:1px solid var(--line);padding:32px var(--gut) 48px;display:grid;grid-template-columns:1.2fr 2fr 1fr;gap:24px;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--dim)}
footer a{color:var(--mute);transition:color .5s}footer a:hover{color:var(--ink)}
footer .r{text-align:right}
/* reveal */
.rv{opacity:0;transform:translateY(26px);transition:opacity 1.3s var(--ease),transform 1.3s var(--ease)}
.rv.in{opacity:1;transform:none}
.rv.d1{transition-delay:.12s}.rv.d2{transition-delay:.24s}.rv.d3{transition-delay:.36s}
.blur{filter:blur(8px);transition:filter 1.3s var(--ease),opacity 1.3s var(--ease),transform 1.3s var(--ease)}
.blur.in{filter:blur(0)}
@media (prefers-reduced-motion:reduce){.rv,.wr .w i,.media a,.shot,.ln,.srow::before,.step::before{opacity:1;transform:none;transition:none;clip-path:none;filter:none}.slide .bgv,.mark .t .sw,.nav{animation:none;transform:none}}
@media (max-width:960px){
  .nav{grid-template-columns:1fr auto auto}.nav .g{display:none}
  .slide .mid,.slide .bot,.row3,.srow,.step,.shot,footer,.mark .sub{grid-template-columns:1fr}
  .slide .view,.slide .sd,.srow .pr,.step .d,footer .r,.mark .sub span:last-child{text-align:left;justify-self:start}
  .slide .mid{top:auto;bottom:150px;transform:none}
  .state .facts,.pts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .media{grid-template-columns:1fr}
  .contact .big,.contact .sm{text-align:left}
}
@media (max-width:600px){form,.state .facts,.pts{grid-template-columns:1fr}}

/* ===== case page ===== */
.cs-hero{position:relative;min-height:min(78svh,760px);display:flex;align-items:flex-end;overflow:hidden;padding:0 var(--gut) clamp(32px,5vw,64px);margin-top:64px}
.cs-hero .bgv{position:absolute;inset:0;background-size:cover;background-position:center;transform:scale(1.06);transition:transform 2.4s var(--ease)}
.cs-hero.in .bgv{transform:none}
.cs-hero .shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,10,10,.5) 0%,rgba(10,10,10,.1) 35%,rgba(10,10,10,.85) 100%)}
.cs-hero .in-w{position:relative;width:100%;display:grid;grid-template-columns:1.2fr 2fr 1fr;gap:24px;align-items:end}
.cs-hero h1{font-size:clamp(34px,6vw,84px);line-height:.95}
.cs-hero .sub{font-size:clamp(15px,1.6vw,20px);color:rgba(242,240,236,.8);margin-top:10px}
.cs-meta{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;padding:clamp(28px,4vw,48px) var(--gut);border-bottom:1px solid var(--line)}
.cs-meta .n{font-family:var(--sans);font-size:clamp(20px,2.4vw,30px);letter-spacing:-.03em;margin-top:10px}
.cs-body{padding:clamp(56px,8vw,110px) var(--gut)}
.cs-block{display:grid;grid-template-columns:1.2fr 2fr 1fr;gap:24px;padding:clamp(28px,4vw,48px) 0;position:relative}
.cs-block::before{content:"";position:absolute;left:0;top:0;height:1px;width:100%;background:var(--line);transform:scaleX(0);transform-origin:left;transition:transform 1.4s var(--ease)}
.cs-block.in::before{transform:none}
.cs-block p{font-size:clamp(16px,1.8vw,22px);line-height:1.5;max-width:60ch}
.cs-block p+p{margin-top:18px}
.cs-gal{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.cs-gal figure{margin:0;position:relative;aspect-ratio:16/10;overflow:hidden;background:#0d0d0d;clip-path:inset(0 0 100% 0);transition:clip-path 1.6s var(--ease)}
.cs-gal figure.in{clip-path:inset(0)}
.cs-gal img{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.08);transition:transform 2.2s var(--ease)}
.cs-gal figure.in img{transform:none}
.cs-gal .ph{position:absolute;inset:0;background:linear-gradient(160deg,#161616,#0c0c0c)}
.cs-next{display:grid;grid-template-columns:1.2fr 2fr 1fr;gap:24px;padding:clamp(40px,6vw,80px) var(--gut);border-top:1px solid var(--line);align-items:end}
.cs-next b{font-family:var(--sans);font-weight:400;font-size:clamp(26px,4vw,52px);letter-spacing:-.03em;line-height:1}
.cs-res{font-family:var(--sans);font-size:clamp(40px,7vw,110px);letter-spacing:-.05em;line-height:.9}
@media (max-width:960px){.cs-hero .in-w,.cs-block,.cs-next{grid-template-columns:1fr}.cs-meta{grid-template-columns:1fr 1fr}.cs-gal{grid-template-columns:1fr}}

.cs-res{white-space:nowrap;font-size:clamp(30px,5vw,80px)}
