/* Nally Studio — one design system, one motif: the veil.
   A sheer lilac gauze lifts off every image; scenes stack like sheets of fabric. */

:root{
  --white:#fff;
  --mist:#f8f0f4;
  --lilac:#d4bcca;
  --ink:#18191d;
  --pink:#dd88a4;
  --wine:#240a12;
  --wine2:#3a1520;
  --display:'Bacasime Antique',Georgia,serif;
  --text:'Public Sans',system-ui,sans-serif;
  --script:'Pinyon Script','Snell Roundhand',cursive;
  --gut:clamp(20px,4.2vw,72px);
  --sec:clamp(72px,8.5vw,136px);
  --hh:84px;
  --r:18px;
  --rule:rgba(24,25,29,.14);
  --veil:linear-gradient(180deg,rgba(212,188,202,.8),rgba(221,136,164,.52));
  --ease:cubic-bezier(.16,1,.3,1);
  --ease-io:cubic-bezier(.76,0,.24,1);
}

*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
html.noscroll{overflow:hidden}
body{font:400 17px/1.6 var(--text);color:var(--ink);background:var(--white);-webkit-font-smoothing:antialiased}
main{overflow-x:clip}
a{color:inherit;text-decoration:none}
img,video,canvas,svg{display:block;max-width:100%}
ul,ol{list-style:none}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0}
::selection{background:var(--pink);color:#fff}
:focus-visible{outline:2px solid var(--pink);outline-offset:3px}
.wrap{padding-inline:var(--gut);max-width:1560px;margin-inline:auto}
.dark{--rule:rgba(255,255,255,.18);color:#fff}

.grain{position:fixed;inset:0;z-index:190;pointer-events:none;opacity:.05;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}

/* ---------- type ---------- */
.eyebrow{display:flex;align-items:center;gap:12px;font:600 11px/1.3 var(--text);letter-spacing:.26em;text-transform:uppercase}
.eyebrow::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:var(--pink)}
.h2{font:400 clamp(44px,7vw,120px)/.96 var(--display);letter-spacing:-.02em}
.acc{font-family:var(--script);font-weight:400;color:var(--pink);letter-spacing:0;font-size:1.2em;line-height:.7}
.lede{font:300 clamp(16px,1.35vw,21px)/1.6 var(--text);max-width:33em}
.sub{font:400 clamp(14px,1.1vw,16px)/1.6 var(--text);max-width:27em;opacity:.78}

/* masked line reveal: <span class="ln"><i>text</i></span> */
.ln{display:inline-block;overflow:hidden;vertical-align:top;padding:.06em .08em .22em;margin:-.06em -.08em -.22em}
.ln.acc{padding-top:.3em;margin-top:-.3em}
.ln>i{display:inline-block;font-style:normal;transition:transform 1.3s var(--ease)}
.js .ln>i{transform:translateY(115%)}
.js .in .ln>i,.js .ln.in>i{transform:none}
.in .ln:nth-of-type(2)>i{transition-delay:.12s}
.in .ln:nth-of-type(3)>i{transition-delay:.24s}

/* generic reveal */
.js .rv{opacity:0;transform:translateY(36px);transition:opacity 1s var(--ease),transform 1.2s var(--ease)}
.js .rv.in{opacity:1;transform:none}

/* the veil: a lilac gauze that lifts off an image */
.vl{position:relative;overflow:hidden;border-radius:var(--r);background:var(--lilac)}
.vl>img,.vl>video{width:100%;height:100%;object-fit:cover;transition:transform 1.8s var(--ease)}
.vl::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:var(--veil);-webkit-backdrop-filter:blur(22px) saturate(1.15);backdrop-filter:blur(22px) saturate(1.15);clip-path:inset(0);transition:clip-path 1.5s var(--ease-io)}
.js .vl>img,.js .vl>video{transform:scale(1.22)}
.vl.in>img,.vl.in>video{transform:none}
.vl.in::after{clip-path:inset(0 0 100% 0)}
html:not(.js) .vl::after{display:none}

/* ---------- buttons ---------- */
.btn{--bg:var(--ink);--fg:#fff;--hv:var(--pink);--ib:var(--pink);--if:#fff;position:relative;isolation:isolate;display:inline-flex;align-items:center;gap:18px;height:58px;padding:0 7px 0 30px;border-radius:99px;background:var(--bg);color:var(--fg);font:600 12px/1 var(--text);letter-spacing:.16em;text-transform:uppercase;white-space:nowrap;overflow:hidden;transition:color .5s var(--ease),box-shadow .5s}
.btn::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:var(--hv);transform:translateY(102%);transition:transform .7s var(--ease)}
.btn:hover::before{transform:none}
.btn i{flex:none;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--ib);color:var(--if);font-style:normal;font-size:16px;transition:transform .7s var(--ease),background .4s,color .4s}
.btn:hover i{transform:rotate(-45deg);background:#fff;color:var(--ink)}
.btn.ghost{--bg:transparent;--fg:currentColor;--ib:var(--ink);--if:#fff;--hv:var(--ink);box-shadow:inset 0 0 0 1.5px currentColor}
.btn.ghost:hover{color:#fff;box-shadow:inset 0 0 0 1.5px var(--ink)}
.dark .btn{--bg:#fff;--fg:var(--ink);--ib:var(--wine);--if:#fff;--hv:var(--pink)}
.dark .btn:hover{color:#fff}
.dark .btn.ghost{--bg:transparent;--fg:#fff;--ib:#fff;--if:var(--wine);--hv:var(--pink);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.7)}
.dark .btn.ghost:hover{box-shadow:inset 0 0 0 1.5px var(--pink)}

/* ---------- segmented toggles ---------- */
.seg{display:flex;gap:14px;font:600 11px/1 var(--text);letter-spacing:.18em}
.seg button{padding:6px 0;opacity:.42;border-bottom:1px solid transparent;transition:opacity .3s}
.seg button:hover{opacity:.8}
.seg button.on{opacity:1;border-bottom-color:currentColor}

/* ---------- header ---------- */
#hdr{position:fixed;inset:0 0 auto 0;z-index:100;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:var(--hh);padding:0 var(--gut);color:var(--ink);transition:transform .8s var(--ease),color .5s}
#hdr::before{content:"";position:absolute;inset:0 0 -26px;z-index:-1;pointer-events:none;background:linear-gradient(rgba(var(--hb,255,255,255),.9),rgba(var(--hb,255,255,255),0));transition:background .5s}
#hdr.hide{transform:translateY(-105%)}
#hdr.on-dark{color:#fff}
.logo{justify-self:start;line-height:1}
.logo b{display:block;font:400 44px/.9 var(--script)}
.logo small{display:block;font:500 8px var(--text);letter-spacing:.34em;margin-top:2px;opacity:.7}
#hdr nav ul{display:flex;gap:clamp(20px,2.8vw,44px);font:500 11px/1 var(--text);letter-spacing:.22em;text-transform:uppercase}
#hdr nav a{position:relative;display:block;padding:8px 0;opacity:.62;transition:opacity .3s}
#hdr nav a::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .6s var(--ease)}
#hdr nav a:hover,#hdr nav a.on{opacity:1}
#hdr nav a:hover::after,#hdr nav a.on::after{transform:scaleX(1);transform-origin:left}
.ctl{justify-self:end;display:flex;align-items:center;gap:clamp(14px,2vw,28px)}
.burger{display:none;position:relative;width:44px;height:44px}
.burger i{position:absolute;left:11px;right:11px;height:1.5px;background:currentColor;transition:transform .6s var(--ease),top .6s var(--ease)}
.burger i:first-child{top:18px}.burger i:last-child{top:25px}
.menu-open .burger i:first-child{top:21px;transform:rotate(45deg)}
.menu-open .burger i:last-child{top:21px;transform:rotate(-45deg)}

.menu{position:fixed;inset:0;z-index:95;background:var(--wine);color:#fff;display:flex;flex-direction:column;justify-content:center;gap:34px;padding:calc(var(--hh) + 10px) var(--gut) 40px;visibility:hidden;clip-path:inset(0 0 100% 0);transition:clip-path .9s var(--ease-io),visibility 0s .9s}
.menu.open{visibility:visible;clip-path:inset(0);transition:clip-path .9s var(--ease-io)}
.menu ul{display:grid;gap:6px}
.menu a.m{display:block;font:400 clamp(44px,13vw,84px)/1.05 var(--display);letter-spacing:-.02em;opacity:0;transform:translateY(24px);transition:opacity .7s var(--ease),transform .9s var(--ease),color .3s}
.menu.open a.m{opacity:1;transform:none}
.menu.open li:nth-child(2) a.m{transition-delay:.08s}.menu.open li:nth-child(3) a.m{transition-delay:.16s}.menu.open li:nth-child(4) a.m{transition-delay:.24s}.menu.open li:nth-child(5) a.m{transition-delay:.32s}
.menu a.m:hover{color:var(--pink)}
.menu .ctl{justify-self:start;gap:28px}

/* ---------- preloader ---------- */
.pre{position:fixed;inset:0;z-index:300;display:grid;place-items:center;text-align:center;background:var(--lilac);color:var(--ink);animation:preFail .01s 7s forwards}
@keyframes preFail{to{visibility:hidden;opacity:0}}
.pre b{display:block;font:400 clamp(110px,24vw,340px)/.8 var(--script);margin-bottom:.1em}
.pre span{display:block;font:600 11px var(--text);letter-spacing:.34em;text-transform:uppercase}
.pre em{display:block;margin-top:22px;font:400 13px var(--text);font-style:normal;letter-spacing:.2em;opacity:.7;font-variant-numeric:tabular-nums}
.pre.out{clip-path:inset(0 0 100% 0);transition:clip-path 1.2s var(--ease-io)}
.pre.gone{display:none}

/* ---------- cursor ---------- */
.cursor{position:fixed;left:0;top:0;z-index:150;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:#fff;mix-blend-mode:difference;pointer-events:none;opacity:0;transition:width .5s var(--ease),height .5s var(--ease),margin .5s var(--ease),background .3s,opacity .3s}
.cursor.on{opacity:1}
.cursor.big{width:64px;height:64px;margin:-32px 0 0 -32px}
.cursor.lbl{width:92px;height:92px;margin:-46px 0 0 -46px;background:var(--pink);mix-blend-mode:normal;display:grid;place-items:center}
.cursor.lbl::after{content:var(--t,"View");font:600 10px var(--text);letter-spacing:.22em;text-transform:uppercase;color:#fff}
@media (hover:none),(max-width:760px){.cursor{display:none}}

/* ======================= HERO (one screen, nothing pinned) ======================= */
.hero{position:relative;z-index:1;height:calc(100svh - 64px);min-height:540px;overflow:hidden;display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);align-items:center;column-gap:clamp(24px,4vw,80px);padding:calc(var(--hh) + 6px) var(--gut) 56px;background:radial-gradient(55% 70% at 80% 42%,#f6e6ee 0,rgba(246,230,238,0) 70%),radial-gradient(45% 55% at 4% 100%,rgba(212,188,202,.4),rgba(212,188,202,0) 70%),#fff}
.hero-copy{position:relative;z-index:3;max-width:780px}
.h-hero{font:400 clamp(42px,5.7vw,100px)/.98 var(--display);letter-spacing:-.022em;margin:clamp(18px,3.2svh,32px) 0 clamp(20px,3.4svh,34px)}
.h-hero .ln{display:block}
.hero .lede{opacity:.82}
.cta{display:flex;flex-wrap:wrap;gap:12px 16px;margin-top:clamp(24px,4.4svh,46px)}
.hero-stage{position:relative;justify-self:end;--aw:min(36vw,calc((100svh - var(--hh) - 215px)*.76));--ar:calc(var(--aw)/2) calc(var(--aw)/2) 26px 26px;width:var(--aw);height:calc(var(--aw)/.76)}
.arch{position:absolute;inset:0;overflow:hidden;isolation:isolate;border-radius:var(--ar);background:var(--lilac);box-shadow:0 70px 110px -60px rgba(90,25,60,.55)}
.js .arch{clip-path:inset(100% 0 0 0 round var(--ar));transition:clip-path 1.7s var(--ease-io) .3s}
.js body.loaded .arch{clip-path:inset(0 0 0 0 round var(--ar))}
.arch::after{content:"";position:absolute;inset:0;z-index:30;pointer-events:none;background:var(--veil);-webkit-backdrop-filter:blur(26px) saturate(1.2);backdrop-filter:blur(26px) saturate(1.2);clip-path:inset(0);transition:clip-path 1.9s var(--ease-io) 1.1s}
.js body.loaded .arch::after,html:not(.js) .arch::after{clip-path:inset(0 0 100% 0)}
.slides{position:absolute;inset:0}
.slides img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;clip-path:inset(100% 0 0 0);transform:scale(1.16);transition:clip-path 1.5s var(--ease-io),transform 2.6s var(--ease)}
.slides img.on{clip-path:inset(0);transform:none}
.arch-cap{position:absolute;left:0;right:0;bottom:0;z-index:20;padding:64px clamp(18px,2vw,28px) 20px;color:#fff;background:linear-gradient(transparent,rgba(30,8,18,.6));display:grid;grid-template-columns:auto 1fr;column-gap:14px;align-items:baseline}
.arch-cap span{font:600 11px var(--text);letter-spacing:.2em;font-variant-numeric:tabular-nums}
.arch-cap b{font:400 clamp(22px,2.1vw,32px)/1 var(--display)}
.arch-cap em{grid-column:2;margin-top:6px;font:300 13px/1.4 var(--text);font-style:normal;opacity:.88}
.arch-cap b,.arch-cap em{transition:opacity .35s}
.arch-cap.sw b,.arch-cap.sw em{opacity:0}
.ticks{grid-column:1/-1;display:flex;gap:6px;margin-top:16px}
.ticks i{flex:1;height:2px;background:rgba(255,255,255,.3);position:relative;overflow:hidden}
.ticks i::after{content:"";position:absolute;inset:0;background:#fff;transform:scaleX(0);transform-origin:left}
.ticks i.done::after{transform:scaleX(1)}
.ticks i.on::after{animation:tickfill var(--dur,3.8s) linear forwards}
@keyframes tickfill{to{transform:scaleX(1)}}
.hero .eyebrow,.hero .lede,.hero .cta{transition:opacity 1.1s var(--ease),transform 1.3s var(--ease)}
.js .hero .eyebrow,.js .hero .lede,.js .hero .cta{opacity:0;transform:translateY(24px)}
.js body.loaded .hero .eyebrow{opacity:1;transform:none;transition-delay:.15s}
.js body.loaded .hero .lede{opacity:.82;transform:none;transition-delay:.55s}
.js body.loaded .hero .cta{opacity:1;transform:none;transition-delay:.7s}
.js .hero .ln>i{transition-duration:1.5s}
.js body.loaded .hero .ln>i{transform:none}
.js body.loaded .hero .ln:nth-of-type(1)>i{transition-delay:.25s}
.js body.loaded .hero .ln:nth-of-type(2)>i{transition-delay:.4s}

/* ======================= WORK: a catalogue you page through ======================= */
.work{position:relative;z-index:2;margin-top:-36px;padding-top:clamp(64px,6.5vw,104px);background:var(--wine);color:#fff;border-radius:36px 36px 0 0;box-shadow:0 -20px 50px rgba(20,5,10,.18)}
.whead{display:flex;align-items:flex-end;justify-content:space-between;gap:20px 48px;padding:0 var(--gut);margin-bottom:clamp(18px,2.6vw,36px)}
.whead .eyebrow{margin-bottom:16px}
.whead .h2{font-size:clamp(40px,5.2vw,80px);line-height:1}
.book-ctl{display:flex;align-items:center;gap:16px;font:600 11px/1 var(--text);letter-spacing:.2em;font-variant-numeric:tabular-nums;white-space:nowrap}
.book-ctl button{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;font-size:18px;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.4);transition:background .4s,box-shadow .4s,opacity .3s}
.book-ctl button:hover:not(:disabled){background:var(--pink);box-shadow:none}
.book-ctl button:disabled{opacity:.28;cursor:default}
.book-wrap{perspective:3000px;display:flex;justify-content:center;padding:clamp(6px,1.4vw,20px) var(--gut) 0}
.book{--pw:min(calc((100svh - 260px)*.74),520px,calc((100vw - 2*var(--gut))/2));--ph:calc(var(--pw)/.74);position:relative;width:calc(var(--pw)*2);height:var(--ph);transform-style:preserve-3d;transition:translate 1.2s var(--ease);touch-action:pan-y;-webkit-user-select:none;user-select:none}
.book::before{content:"";position:absolute;left:3%;right:3%;bottom:-22px;height:30px;border-radius:50%;background:radial-gradient(ellipse at center,rgba(0,0,0,.5),transparent 70%);filter:blur(9px)}
.book[data-mode=spread].closed{translate:calc(var(--pw)*-.5) 0}
.book[data-mode=spread].end{translate:calc(var(--pw)*.5) 0}
.book[data-mode=single]{--pw:min(calc((100svh - 300px)*.74),calc(100vw - 2*var(--gut)),430px);width:var(--pw)}
.leaf{position:absolute;top:0;left:50%;width:50%;height:100%;transform-origin:left center;transform-style:preserve-3d;transition:transform 1.3s cubic-bezier(.645,.045,.355,1)}
.book[data-mode=single] .leaf{left:0;width:100%}
.leaf.flipped{transform:rotateY(-180deg)}
.face{position:absolute;inset:0;overflow:hidden;-webkit-backface-visibility:hidden;backface-visibility:hidden;background:#faf6f3;color:var(--ink)}
.face.front{border-radius:2px 9px 9px 2px;box-shadow:inset 28px 0 32px -28px rgba(40,10,25,.38)}
.face.back{transform:rotateY(180deg);border-radius:9px 2px 2px 9px;box-shadow:inset -28px 0 32px -28px rgba(40,10,25,.38)}
.book[data-mode=single] .face.back{background:#efe7e2;box-shadow:none}
.face::after{content:"";position:absolute;inset:0;z-index:40;pointer-events:none;opacity:0;background:linear-gradient(90deg,rgba(40,10,25,.55),rgba(40,10,25,0) 60%)}
.face.back::after{background:linear-gradient(270deg,rgba(40,10,25,.55),rgba(40,10,25,0) 60%)}
.leaf.turning .face::after{animation:shade 1.3s ease both}
@keyframes shade{0%{opacity:0}45%{opacity:1}100%{opacity:0}}
.pg{position:absolute;inset:0;padding:7% 8% 7%;display:flex;flex-direction:column}
.pg-img{position:relative;display:block;width:100%;flex:1;min-height:0;overflow:hidden;border-radius:3px;background:var(--lilac);cursor:zoom-in}
.pg-img img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease)}
.pg-img:hover img{transform:scale(1.045)}
.pg-img .pl{right:10px;top:10px}
.pg-cap{display:grid;grid-template-columns:auto 1fr;gap:0 14px;align-items:baseline;padding-top:clamp(12px,1.5vw,20px)}
.pg-n{font:400 clamp(30px,3vw,46px)/1 var(--script);color:var(--pink)}
.pg-cap small{display:block;font:600 10px/1.4 var(--text);letter-spacing:.2em;text-transform:uppercase;opacity:.6}
.pg-cap b{display:block;margin-top:3px;font:400 clamp(20px,1.9vw,28px)/1.1 var(--display)}
.pg-fo{position:absolute;bottom:2.6%;font:500 10px/1 var(--text);font-style:normal;letter-spacing:.2em;opacity:.45}
.face.front .pg-fo{right:8%}
.face.back .pg-fo{left:8%}
.face.cover{background:var(--lilac)}
.pg-cover{align-items:center;justify-content:space-between;text-align:center;padding:9% 8%}
.pg-cover::before{content:"";position:absolute;inset:4.5%;border:1px solid rgba(24,25,29,.32);pointer-events:none}
.pg-cover .eyebrow{justify-content:center}
.pg-cover b{display:block;font:400 calc(var(--pw)*.42)/.8 var(--script)}
.pg-cover h3{font:400 clamp(28px,3vw,48px)/1 var(--display);letter-spacing:-.01em}
.pg-cover h3 em{font-family:var(--script);font-style:normal;color:#fff;font-size:1.2em}
.pg-cover small{font:600 10px var(--text);letter-spacing:.3em;text-transform:uppercase;opacity:.7}
.pg-idx{justify-content:center}
.pg-idx h3{font:400 clamp(28px,3vw,46px)/1 var(--display);margin:12px 0 clamp(10px,1.6vw,22px)}
.pg-idx h3 em{font-family:var(--script);font-style:normal;color:var(--pink);font-size:1.2em}
.pg-idx li button{display:grid;grid-template-columns:30px 1fr auto;gap:10px;align-items:baseline;width:100%;text-align:left;padding:clamp(4px,.7vw,8px) 0;border-bottom:1px solid rgba(24,25,29,.14)}
.pg-idx li span{font:600 10px var(--text);letter-spacing:.12em;color:var(--pink)}
.pg-idx li b{font:400 clamp(13px,1.2vw,18px)/1.2 var(--display);transition:color .3s}
.pg-idx li i{font:600 9px var(--text);font-style:normal;letter-spacing:.16em;text-transform:uppercase;opacity:.5;white-space:nowrap}
.pg-idx li button:hover b{color:var(--pink)}
.face.more{background:var(--pink)}
.pg-more{justify-content:center;gap:20px;text-align:center;align-items:center}
.pg-more h3{font:400 clamp(30px,3.4vw,54px)/1 var(--display)}
.pg-more h3 em{font-family:var(--script);font-style:normal;color:#fff;font-size:1.25em}
.pg-more .btn{--bg:var(--ink);--fg:#fff;--hv:#fff;--ib:var(--pink);--if:#fff}
.pg-more .btn:hover{color:var(--ink)}
.face.bc{background:var(--ink);color:#fff}
.pg-bc{align-items:center;justify-content:center;text-align:center;gap:10px}
.pg-bc b{font:400 calc(var(--pw)*.34)/.8 var(--script);color:var(--lilac)}
.pg-bc small{font:600 9px var(--text);letter-spacing:.34em;text-transform:uppercase;opacity:.6}
.pl{position:absolute;z-index:2;width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.92);color:var(--pink);display:grid;place-items:center;font-size:11px}
.pl::before{content:"▶";margin-left:2px}
.book-hint{margin-top:clamp(30px,3.4vw,48px);text-align:center;padding-inline:var(--gut);font:600 10px/1.6 var(--text);letter-spacing:.24em;text-transform:uppercase;opacity:.5}
.work-more{display:flex;justify-content:center;padding:clamp(24px,3.4vw,44px) var(--gut) var(--sec)}
.js .book-wrap{opacity:0;transform:translateY(60px);transition:opacity 1.2s var(--ease),transform 1.6s var(--ease)}
.js .book-wrap.in{opacity:1;transform:none}

/* lightbox */
.lb{position:fixed;inset:0;z-index:140;background:rgba(24,8,16,.92);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:none;align-items:center;justify-content:center;padding:4vh 4vw}
.lb.on{display:flex}
.lb figure{max-width:min(92vw,720px);max-height:92vh;display:flex;flex-direction:column;gap:14px;color:#fff;text-align:center}
.lb img{max-height:78vh;width:auto;max-width:100%;object-fit:contain;border-radius:var(--r);margin-inline:auto}
.lb figcaption{font:600 12px var(--text);letter-spacing:.2em;text-transform:uppercase}
.lb figcaption b{display:block;font:400 28px/1.1 var(--display);letter-spacing:0;text-transform:none;margin-top:6px}
.lb button{position:absolute;width:52px;height:52px;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;font-size:20px;transition:background .3s}
.lb button:hover{background:var(--pink)}
.lb .x{top:20px;right:20px}.lb .pv{left:20px;top:50%}.lb .nx{right:20px;top:50%}

/* ======================= MOTION ======================= */
.vid{position:relative;overflow:hidden;background:var(--lilac);padding:var(--sec) 0 calc(var(--sec)*.8)}
.bgword{position:absolute;left:0;top:50%;z-index:0;font:400 clamp(220px,34vw,560px)/.7 var(--script);color:rgba(255,255,255,.34);white-space:nowrap;pointer-events:none;translate:var(--bx,0) -46%;will-change:translate}
.sh{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px 48px;align-items:end}
.sh .eyebrow{margin-bottom:18px}
.sh .sub{justify-self:end}
.vwall{position:relative;z-index:1;display:flex;gap:clamp(10px,1.6vw,26px);align-items:flex-end;justify-content:center;padding:clamp(48px,6vw,96px) var(--gut) 0}
.vp{position:relative;flex:1 1 0;max-width:290px;aspect-ratio:9/16;translate:0 var(--ty,0px);transition:flex .8s var(--ease);will-change:translate}
.vp:nth-child(1){margin-bottom:clamp(0px,5vw,72px)}.vp:nth-child(2){margin-bottom:clamp(0px,1.6vw,24px)}.vp:nth-child(3){margin-bottom:clamp(0px,7vw,104px)}.vp:nth-child(4){margin-bottom:clamp(0px,2.4vw,36px)}.vp:nth-child(5){margin-bottom:clamp(0px,5.6vw,80px)}
.vp-in{position:absolute;inset:0;border-radius:var(--r);overflow:hidden;background:#c4a3b4}
.vp-in video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.vp-in::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 52%,rgba(30,8,18,.62));pointer-events:none}
.vp-in::before{content:"";position:absolute;inset:0;z-index:4;pointer-events:none;background:var(--veil);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);clip-path:inset(0);transition:clip-path 1.6s var(--ease-io) .2s}
.vp.in .vp-in::before,html:not(.js) .vp-in::before{clip-path:inset(0 0 100% 0)}
.vp-tag{position:absolute;left:14px;top:14px;z-index:2;display:flex;align-items:center;gap:7px;font:600 10px var(--text);letter-spacing:.16em;color:#fff}
.vp-tag i{width:7px;height:7px;border-radius:50%;background:#fff;animation:blink 1.4s infinite}
@keyframes blink{50%{opacity:.25}}
.vp-cap{position:absolute;left:14px;right:14px;bottom:18px;z-index:2;color:#fff;font:400 clamp(16px,1.5vw,22px)/1.1 var(--display)}
.vp-bar{position:absolute;left:14px;right:14px;bottom:9px;height:2px;background:rgba(255,255,255,.3);z-index:2}
.vp-bar b{display:block;height:100%;width:0;background:#fff}

/* ======================= TRANSFORMATION ======================= */
.ses{background:var(--mist);padding:var(--sec) 0}
.ses-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(32px,6vw,110px);align-items:center}
.ses .eyebrow{margin-bottom:20px}
.ses .h2{font-size:clamp(40px,5.8vw,96px);margin-bottom:clamp(20px,2.4vw,32px)}
.ses .sub{margin-bottom:clamp(26px,3vw,40px)}
.stabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:clamp(26px,3vw,40px)}
.stabs button{font:600 11px/1 var(--text);letter-spacing:.16em;text-transform:uppercase;padding:14px 20px;border-radius:99px;box-shadow:inset 0 0 0 1.5px var(--rule);transition:background .4s,color .4s,box-shadow .4s}
.stabs button:hover{box-shadow:inset 0 0 0 1.5px var(--ink)}
.stabs button.on{background:var(--ink);color:#fff;box-shadow:none}
.sst{counter-reset:s;display:grid;gap:0;border-top:1px solid var(--rule)}
.sst li{counter-increment:s;display:grid;grid-template-columns:52px 1fr;align-items:center;gap:14px;padding:16px 0;border-bottom:1px solid var(--rule);font:500 15px/1.4 var(--text)}
.sst li::before{content:counter(s);font:400 40px/1 var(--script);color:var(--pink);text-align:center}
.ba{position:relative;--pos:50%;aspect-ratio:4/5;max-height:min(80svh,780px);width:100%;margin-inline:auto;border-radius:var(--r);overflow:hidden;background:#fff;touch-action:pan-y;box-shadow:0 60px 100px -60px rgba(90,25,60,.5)}
.ba img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .6s}
.ba .ba-b{-webkit-mask-image:linear-gradient(90deg,#000 calc(var(--pos) - 7%),transparent calc(var(--pos) + 7%));mask-image:linear-gradient(90deg,#000 calc(var(--pos) - 7%),transparent calc(var(--pos) + 7%))}
.ba::before{content:"";position:absolute;inset:0 auto 0 calc(var(--pos) - 9%);width:18%;z-index:2;pointer-events:none;background:linear-gradient(90deg,rgba(212,188,202,0),rgba(212,188,202,.38),rgba(212,188,202,0));-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);-webkit-mask-image:linear-gradient(90deg,transparent,#000 50%,transparent);mask-image:linear-gradient(90deg,transparent,#000 50%,transparent)}
.ba::after{content:"";position:absolute;inset:0;z-index:5;pointer-events:none;background:var(--veil);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);clip-path:inset(0);transition:clip-path 1.8s var(--ease-io) .2s}
.ba.in::after,html:not(.js) .ba::after{clip-path:inset(0 0 100% 0)}
.ba-hd{position:absolute;top:0;bottom:0;left:var(--pos);width:1.5px;z-index:3;background:rgba(255,255,255,.9);transform:translateX(-50%);pointer-events:none}
.ba-hd u{position:absolute;top:50%;left:50%;width:58px;height:58px;border-radius:50%;background:#fff;color:var(--ink);transform:translate(-50%,-50%);display:grid;place-items:center;text-decoration:none;font-size:18px;box-shadow:0 10px 30px rgba(60,10,35,.3)}
.ba-hd u::before{content:"↔"}
.ba-lb{position:absolute;bottom:18px;z-index:3;font:600 10px var(--text);letter-spacing:.18em;text-transform:uppercase;color:#fff;background:rgba(24,25,29,.5);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:9px 15px;border-radius:99px;transition:opacity .3s;pointer-events:none}
.ba-lb.l{left:18px}.ba-lb.r{right:18px}.ba-lb.hide{opacity:0}
.ba input{position:absolute;inset:0;z-index:4;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0}

/* ======================= OFFER ======================= */
.offer{background:#fff;padding:var(--sec) 0}
.offer-top{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);gap:var(--gut)}
.offer-top .eyebrow{align-self:start;padding-top:1.1em;flex-direction:column;align-items:flex-start;gap:8px;line-height:1.5}
.offer-top .eyebrow::before{display:none}
.offer-top .eyebrow b{font-weight:600;opacity:.5}
.statement{font:400 clamp(30px,4.4vw,74px)/1.1 var(--display);letter-spacing:-.015em}
.statement .wd{opacity:.3;transition:opacity .2s}
.offer .btn{margin-top:clamp(36px,4vw,56px)}
.svcs{margin-top:clamp(56px,8vw,128px);border-top:1px solid var(--rule)}
.svc{position:relative;display:grid;grid-template-columns:minmax(0,3fr) minmax(0,6fr) minmax(0,3fr);align-items:center;gap:var(--gut);padding:clamp(22px,2.6vw,38px) 0;border-bottom:1px solid var(--rule);transition:padding .7s var(--ease),color .4s}
.svc b{font:400 clamp(26px,3vw,46px)/1.05 var(--display);letter-spacing:-.01em}
.svc p{font:400 clamp(15px,1.2vw,18px)/1.5 var(--text);max-width:32em;opacity:.8}
.svc .go{justify-self:end;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;box-shadow:inset 0 0 0 1.5px var(--rule);font-size:16px;transition:background .5s,color .5s,transform .7s var(--ease),box-shadow .5s}
.svc:hover{padding-left:clamp(10px,1.4vw,22px);color:var(--rose,#b9577c)}
.svc:hover .go{background:var(--pink);color:#fff;box-shadow:none;transform:rotate(-45deg)}
.svc-pv{position:fixed;left:0;top:0;z-index:60;width:clamp(180px,17vw,270px);aspect-ratio:3/4;border-radius:var(--r);overflow:hidden;pointer-events:none;opacity:0;scale:.86;transition:opacity .5s var(--ease),scale .7s var(--ease)}
.svc-pv.on{opacity:1;scale:1}
.svc-pv img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .4s}
.svc-pv img.on{opacity:1}

/* ======================= METHOD (pinned scrub) ======================= */
.proc{position:relative;background:var(--wine);color:#fff}
.proc-track{position:relative;height:250svh}
.proc-in{position:sticky;top:0;height:100svh;display:flex;align-items:center;padding-top:var(--hh)}
.proc-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(28px,6vw,110px);align-items:center;width:100%}
.proc .eyebrow{margin-bottom:20px}
.proc .h2{font-size:clamp(40px,5.6vw,92px);margin-bottom:clamp(24px,3vw,44px)}
.pst{display:grid;border-top:1px solid var(--rule)}
.pst button{display:grid;grid-template-columns:56px 1fr;align-items:center;gap:12px;text-align:left;padding:clamp(12px,1.6svh,18px) 0;border-bottom:1px solid var(--rule);font:500 clamp(14px,1.2vw,17px)/1.35 var(--text);opacity:.4;transition:opacity .5s,padding .6s var(--ease)}
.pst button b{font:400 38px/1 var(--script);color:var(--pink);text-align:center}
.pst button:hover{opacity:.75}
.pst button.on{opacity:1;padding-left:10px}
.pframe{position:relative;aspect-ratio:4/5;width:min(100%,calc(min(72svh,680px)*.8));border-radius:calc(var(--r) + 6px);overflow:hidden;background:#12060a;margin-inline:auto}
.pframe>*{position:absolute;inset:0}
.pframe img.pmain{width:100%;height:100%;object-fit:cover}
.mb{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:10px;background:var(--wine2)}
.mb img{width:100%;height:100%;object-fit:cover;border-radius:12px}
.mb span{position:absolute;left:20px;bottom:16px;color:#fff;font:600 10px var(--text);letter-spacing:.16em;text-transform:uppercase;text-shadow:0 1px 8px rgba(0,0,0,.6)}
.prompt{background:#14090e;color:#f6d9e3;padding:clamp(18px,2.4vw,30px);font:500 clamp(12px,1.05vw,14px)/1.7 ui-monospace,Menlo,monospace;display:flex;flex-direction:column;justify-content:center}
.prompt small{color:var(--pink);letter-spacing:.16em;text-transform:uppercase;font:600 10px var(--text);margin-bottom:10px}
.caret{display:inline-block;width:7px;height:15px;background:var(--pink);vertical-align:-2px;animation:blink .8s infinite}
.mark{position:absolute;inset:auto;border:2px solid #ff4d6d;border-radius:50%;display:grid;place-items:center;pointer-events:none;opacity:0}
.mark span{position:absolute;top:100%;margin-top:4px;background:#ff4d6d;color:#fff;font:600 9px var(--text);letter-spacing:.1em;text-transform:uppercase;padding:2px 6px;border-radius:4px;white-space:nowrap}
.mark.ok{border-color:#59d39a}.mark.ok span{background:#59d39a;color:#0a2a1a}
.grainov{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n2'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/></filter><rect width='100%' height='100%' filter='url(%23n2)'/></svg>");mix-blend-mode:overlay;pointer-events:none;opacity:0}

/* ======================= PRICING ======================= */
.price-sec{background:#fff;padding:var(--sec) 0 calc(var(--sec)*.7)}
.price-head{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:24px 48px;margin-bottom:clamp(36px,4.4vw,64px)}
.price-head .eyebrow{margin-bottom:18px}
.tabs{display:inline-flex;padding:5px;border-radius:99px;background:var(--mist);box-shadow:inset 0 0 0 1px var(--rule)}
.tabs button{padding:14px 26px;border-radius:99px;font:600 11px/1 var(--text);letter-spacing:.16em;text-transform:uppercase;opacity:.6;transition:background .5s var(--ease),color .5s,opacity .3s}
.tabs button.on{background:var(--ink);color:#fff;opacity:1}
.note{max-width:34em;margin-bottom:clamp(26px,3vw,40px);font:400 15px/1.6 var(--text);opacity:.8}
.panel[hidden]{display:none}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.8vw,28px);align-items:stretch}
.card{position:relative;display:flex;flex-direction:column;gap:clamp(18px,2vw,28px);padding:clamp(26px,2.8vw,46px);border-radius:28px;background:var(--mist);transition:transform .8s var(--ease),box-shadow .8s var(--ease)}
.card:hover{transform:translateY(-8px);box-shadow:0 40px 70px -44px rgba(90,25,60,.45)}
.card.hot{background:var(--ink);color:#fff}
.card .badge{position:absolute;top:-12px;right:clamp(20px,2vw,32px);background:var(--pink);color:#fff;font:600 10px/1 var(--text);letter-spacing:.16em;padding:9px 14px;border-radius:99px}
.card h3{font:400 clamp(34px,3.4vw,54px)/1 var(--display);letter-spacing:-.01em}
.card.hot h3{color:var(--pink)}
.price{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 10px;font:400 clamp(40px,4.2vw,70px)/1 var(--display);letter-spacing:-.02em}
.price small{font:500 12px var(--text);letter-spacing:.04em;opacity:.6}
.card ul{display:grid;gap:11px;font-size:15px;line-height:1.45}
.card li{position:relative;padding-left:24px}
.card li::before{content:"";position:absolute;left:0;top:.5em;width:9px;height:9px;border-radius:50%;background:var(--pink)}
.meta{margin-top:auto;display:flex;flex-wrap:wrap;gap:8px;padding-top:6px}
.meta span{font:600 10px/1 var(--text);letter-spacing:.14em;text-transform:uppercase;padding:9px 13px;border-radius:99px;box-shadow:inset 0 0 0 1px currentColor;opacity:.7}
.foot-note{margin-top:clamp(30px,3.4vw,48px);font:400 clamp(22px,2.4vw,34px)/1.2 var(--script);color:var(--pink)}

/* configurator */
.cfgs{background:var(--mist);padding:var(--sec) 0}
.cfgs .sh{margin-bottom:clamp(36px,4.4vw,64px)}
.cfg{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,64px);align-items:stretch}
.cfg-l{display:flex;flex-direction:column;gap:6px;padding:clamp(4px,1vw,12px) 0}
.cfg-l .seg{margin-bottom:clamp(22px,3vw,40px);font-size:12px;gap:22px}
.cfg label{display:flex;justify-content:space-between;align-items:baseline;margin:clamp(14px,2vw,26px) 0 6px;font:600 12px var(--text);letter-spacing:.16em;text-transform:uppercase}
.cfg label output{font:400 clamp(34px,3.4vw,52px)/1 var(--display);letter-spacing:0;color:var(--pink)}
.cfg input[type=range]{--p:50%;-webkit-appearance:none;appearance:none;width:100%;height:30px;background:transparent;cursor:pointer}
.cfg input[type=range]::-webkit-slider-runnable-track{height:2px;background:linear-gradient(90deg,var(--pink) var(--p),rgba(24,25,29,.2) var(--p))}
.cfg input[type=range]::-moz-range-track{height:2px;background:linear-gradient(90deg,var(--pink) var(--p),rgba(24,25,29,.2) var(--p))}
.cfg input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;margin-top:-12px;border-radius:50%;background:#fff;border:2px solid var(--pink);box-shadow:0 6px 18px rgba(90,25,60,.25);transition:transform .3s var(--ease)}
.cfg input[type=range]::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:#fff;border:2px solid var(--pink)}
.cfg input[type=range]:active::-webkit-slider-thumb{transform:scale(1.2)}
.cfg .chk{justify-content:flex-start;gap:12px;margin-top:clamp(18px,2.4vw,30px);text-transform:none;letter-spacing:0;font:500 15px var(--text);cursor:pointer}
.cfg .chk input{width:22px;height:22px;accent-color:var(--pink);flex:none}
.live{margin-top:clamp(22px,3vw,40px);padding-top:clamp(18px,2.2vw,28px);border-top:1px solid var(--ink)}
.live small{display:block;font:600 11px/1.3 var(--text);letter-spacing:.2em;text-transform:uppercase;opacity:.65}
.live-n{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 12px;margin-top:8px;font:400 clamp(46px,5.4vw,84px)/1 var(--display);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.live-n output{color:var(--ink)}
.live-n span{font:500 13px var(--text);letter-spacing:.04em;opacity:.6}
.live-x{margin-top:8px;min-height:1.5em;font:500 14px/1.5 var(--text);color:var(--pink)}
.live-note{margin-top:6px;font:400 13px/1.55 var(--text);opacity:.65;max-width:30em}
.res{display:flex;flex-direction:column;gap:14px;justify-content:center;min-height:380px;padding:clamp(26px,3.2vw,50px);border-radius:28px;background:var(--ink);color:#fff}
.res small{font:600 10px var(--text);letter-spacing:.2em;text-transform:uppercase;opacity:.7}
.res .pk{font:400 clamp(40px,4.6vw,68px)/1 var(--display);color:var(--pink)}
.res .pr{font:400 clamp(30px,3.4vw,50px)/1.05 var(--display)}
.res .pr small{font-family:var(--text);margin-left:8px}
.res ul{display:grid;gap:6px;font-size:14px;opacity:.9}
.res li::before{content:"— ";color:var(--pink)}
.res .cmp{padding:14px 16px;border-radius:14px;background:rgba(255,255,255,.08);font-size:13px;line-height:1.55}
.res .btn{--bg:#fff;--fg:var(--ink);--ib:var(--pink);--if:#fff;align-self:flex-start;margin-top:6px}
.res .btn:hover{color:#fff}

.extras{margin-top:var(--sec)}
.extras .h2{font-size:clamp(34px,4.6vw,72px);margin-bottom:clamp(28px,3.4vw,48px)}
.rows{border-top:1px solid var(--ink)}
.row{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:baseline;padding:clamp(16px,1.8vw,24px) 0;border-bottom:1px solid var(--rule);transition:padding .6s var(--ease),color .4s}
.row b{font:400 clamp(15px,1.4vw,19px)/1.4 var(--text)}
.row i{font:400 clamp(20px,2vw,30px)/1 var(--display);font-style:normal;color:var(--pink);text-align:right;white-space:nowrap}
.row:hover{padding-left:16px}

/* ======================= STUDIO (type window) ======================= */
.studio{background:#fff;padding:var(--sec) 0 calc(var(--sec)*.6);overflow:hidden}
.studio-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:var(--gut)}
.studio .eyebrow{flex-direction:column;align-items:flex-start;gap:8px;line-height:1.5}
.studio .eyebrow::before{display:none}
.studio .eyebrow b{font-weight:600;opacity:.5}
.studio-copy{display:grid;gap:22px;max-width:46em}
.studio-copy .lede{font-size:clamp(18px,1.7vw,26px);max-width:none}
.studio-copy p:not(.lede){font:400 16px/1.65 var(--text);opacity:.8}
.studio-copy .btn{justify-self:start;margin-top:12px}
.tw{margin-top:clamp(56px,7vw,110px);display:grid}
.win{font:400 clamp(72px,17vw,300px)/.9 var(--display);letter-spacing:-.02em;text-transform:uppercase;text-align:center;white-space:nowrap;background-size:130% auto;background-position:50% var(--by,50%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;transition:background-size 1s var(--ease);cursor:default}
.win:hover{background-size:180% auto}
.win:nth-child(even){text-align:right;padding-right:var(--gut)}
.win:nth-child(odd){text-align:left;padding-left:var(--gut)}
.win:nth-child(2){text-align:right}

/* ======================= TERMS ======================= */
.terms{background:var(--mist);padding:var(--sec) 0}
.terms .h2{font-size:clamp(40px,5.6vw,92px);margin-bottom:clamp(36px,4.4vw,64px)}
.tgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(30px,3.4vw,56px) clamp(24px,3vw,56px)}
.t{border-top:1px solid var(--ink);padding-top:18px}
.t h4{font:600 11px/1.3 var(--text);letter-spacing:.22em;text-transform:uppercase;margin-bottom:12px}
.t p{font:400 15px/1.65 var(--text);opacity:.82}

/* ======================= CONTACT ======================= */
.contact{background:var(--pink);color:var(--ink);padding:var(--sec) 0 clamp(40px,5vw,72px);overflow:hidden}
.h-xxl{font:400 clamp(64px,15vw,270px)/.86 var(--display);letter-spacing:-.03em;text-transform:uppercase}
.h-xxl .ln{display:block}
.h-xxl .acc{font-size:1.12em;text-transform:none;color:#fff;line-height:.62;padding-left:.2em}
.contact-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--gut);margin-top:clamp(40px,6vw,96px);align-items:start}
.contact-l{display:grid;gap:28px;align-content:start}
.contact-l .lede{font-size:clamp(18px,1.6vw,24px)}
.mail{display:inline-block;font:400 clamp(24px,3vw,46px)/1.1 var(--display);border-bottom:1.5px solid currentColor;padding-bottom:6px;justify-self:start;transition:color .4s,border-color .4s}
.mail:hover{color:#fff}
form{display:grid;gap:8px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:20px}
input:not([type=range]):not([type=checkbox]),select,textarea{width:100%;padding:20px 2px;background:transparent;border:0;border-bottom:1.5px solid rgba(24,25,29,.4);border-radius:0;outline:0;transition:border-color .3s}
textarea{min-height:130px;resize:vertical}
input::placeholder,textarea::placeholder{color:rgba(24,25,29,.6)}
input:not([type=range]):not([type=checkbox]):focus,select:focus,textarea:focus{border-bottom-color:#fff}
select{appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%);background-position:calc(100% - 14px) 50%,calc(100% - 8px) 50%;background-size:6px 6px;background-repeat:no-repeat}
form .btn{--bg:var(--ink);--fg:#fff;--hv:#fff;--ib:var(--pink);--if:#fff;justify-self:start;margin-top:22px}
form .btn:hover{color:var(--ink)}
footer{background:var(--ink);color:#fff;display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px 32px;padding:26px var(--gut);font:400 12px/1.5 var(--text);letter-spacing:.04em}
footer span,footer a{opacity:.62}
footer a:hover{opacity:1}

/* ======================= RESPONSIVE ======================= */
@media (max-width:1100px){
  #hdr nav ul{gap:18px;letter-spacing:.16em}
  .card{padding:clamp(22px,2.6vw,34px)}
  .price{font-size:clamp(34px,4.4vw,56px)}
}
@media (max-width:760px){
  :root{--hh:68px}
  #hdr{grid-template-columns:1fr auto}
  #hdr nav{display:none}
  #hdr .ctl .seg{display:none}
  .burger{display:block}
  .logo b{font-size:38px}
  #hdr::before{inset:0;background:rgba(var(--hb,255,255,255),.92);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
  #hdr.menu-open::before{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}
  .menu .seg{display:flex}
  .btn{height:50px;padding-left:22px;font-size:11px;gap:14px}
  .btn i{width:38px;height:38px}
  .hero{height:auto;min-height:calc(100svh - 56px);grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);row-gap:clamp(8px,2svh,20px);align-content:start;padding:calc(var(--hh) + 14px) var(--gut) 44px}
  .h-hero{font-size:clamp(34px,9.6vw,60px);margin:12px 0 10px}
  .hero .lede{font-size:14px;line-height:1.5}
  .cta{margin-top:16px;gap:10px}
  .hero-stage{justify-self:center;align-self:center;--aw:min(64vw,calc((100svh - var(--hh) - 330px)*.76))}
  .whead{flex-direction:column;align-items:flex-start;gap:14px}
  .whead .h2{font-size:clamp(34px,10vw,52px)}
  .book-ctl button{width:48px;height:48px}
  .sh,.ses-grid,.offer-top,.proc-grid,.cfg,.studio-grid,.contact-grid{grid-template-columns:minmax(0,1fr)}
  .sh .sub{justify-self:start}
  .vid{padding-bottom:var(--sec)}
  .vwall{justify-content:flex-start;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:20px}
  .vwall::-webkit-scrollbar{display:none}
  .vp{flex:none;width:58vw;max-width:none;scroll-snap-align:center;margin-bottom:0!important;translate:none}
  .svc{grid-template-columns:minmax(0,1fr) auto;gap:8px 16px}
  .svc p{grid-column:1;grid-row:2}
  .svc .go{grid-column:2;grid-row:1/3}
  .svc-pv{display:none}
  .proc-in{align-items:center;padding:var(--hh) 0 18px}
  .proc-grid{gap:14px}
  .proc .h2{margin-bottom:12px}
  .pst{grid-template-columns:1fr 1fr;border-top:0;gap:0 14px}
  .pst button{grid-template-columns:32px 1fr;padding:10px 0;font-size:12px}
  .pst button b{font-size:28px}
  .pframe{width:min(100%,calc((100svh - 330px)*.8))}
  .tgrid{grid-template-columns:1fr 1fr}
  .cards{grid-template-columns:1fr}
  .card.hot{order:-1}
  .two{grid-template-columns:1fr}
  .win:nth-child(n){text-align:center;padding:0}
  .win{font-size:clamp(60px,19vw,160px)}
}
@media (max-width:560px){
  .tgrid{grid-template-columns:1fr}
  .tabs button{padding:13px 18px}
}
/* ---------- mobile polish: no clipped glyphs, no scroll tearing ---------- */
.ln.acc{padding-inline:.22em .3em;margin-inline:-.22em -.3em}
.win{padding-block:.04em .1em}
@media (max-width:760px){
  .h2,.h-xxl,.h-hero{overflow-wrap:break-word}
  .win{font-size:clamp(40px,13.2vw,160px);line-height:1.04;letter-spacing:-.01em;padding-inline:var(--gut);white-space:normal;word-break:keep-all}
  .win:nth-child(n){padding-inline:var(--gut)}
  .grain{display:none}
  .vl::after,.vp-in::before,.ba::after,.arch::after{-webkit-backdrop-filter:none;backdrop-filter:none}
  .vl,.vp-in,.ba,.arch,.pframe{transform:translateZ(0);-webkit-mask-image:-webkit-radial-gradient(white,black)}
  .vl>img,.vl>video,.slides img{backface-visibility:hidden;-webkit-backface-visibility:hidden}
  .bgword{will-change:auto}
  .terms .h2,.studio .h2,.contact .h-xxl{padding-bottom:.08em}
}
@media (max-width:760px) and (max-height:720px){
  .proc-track{height:auto}
  .proc-in{position:relative;height:auto;padding-block:calc(var(--hh) + 20px) 56px}
}
@media (prefers-reduced-motion:reduce){
  .js .ln>i,.js .rv,.js .vl>img,.js .vl>video,.js .arch,.js .book-wrap,.js .hero .eyebrow,.js .hero .lede,.js .hero .cta{transform:none;opacity:1;clip-path:none;transition:none}
  .vl::after,.arch::after{display:none}
  .leaf,.book{transition:none}
  .proc-track{height:auto}
  .proc-in{position:relative;padding-block:90px}
  .pre{display:none}
  .caret,.vp-tag i{animation:none}
}