/* =====================================================================
   NeonGlow — "Atelier of Light" design system (v26)
   Static, no build step. Motion is layered on top by /motion.js (GSAP +
   ScrollTrigger + Lenis); every element below is fully visible without it.
   ===================================================================== */

:root{
 /* surfaces */
 color-scheme:dark;
 --void:#050407; --ink-900:#0A080E; --ink-800:#110E17; --ink-700:#181421;
 --hair:rgba(244,238,228,.09); --hair-2:rgba(244,238,228,.17); --hair-3:rgba(244,238,228,.32);
 /* text */
 --ivory:#F4EEE4; --mute:#A39AAD; --mute-2:#8D8597;
 /* light */
 --champagne:#E9C88A; --champagne-d:#8F7647;
 --rose:#FF4F9A; --violet:#A86BFF; --azure:#5B8CFF; --ice:#8BEAF7;
 --light:linear-gradient(96deg,#FF4F9A,#A86BFF 52%,#5B8CFF);
 /* type */
 --serif:'Cormorant Garamond',Georgia,serif; --sans:'Manrope',system-ui,sans-serif;
 --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
 /* rhythm */
 --gx:max(clamp(18px,4.2vw,64px), env(safe-area-inset-left, 0px), env(safe-area-inset-right, 0px)); --maxw:1440px;
 --ease:cubic-bezier(.16,.84,.24,1); --ease-io:cubic-bezier(.65,0,.35,1);

 /* legacy aliases — studio.css / 3d-optimiser.css / gallery.css read these */
 --bg:var(--void); --bg2:var(--ink-900); --panel:var(--ink-800); --panel2:var(--ink-700);
 --line:var(--hair); --line2:var(--hair-2);
 --gold:var(--champagne); --gold-d:var(--champagne-d);
 --pink:var(--rose); --purple:var(--violet); --blue:var(--azure); --cyan:var(--ice);
 --ink:var(--ivory); --dim:var(--mute); --dim2:var(--mute-2); --grad:var(--light);
}

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;overflow-x:clip;background:var(--void)}
html{scroll-behavior:smooth}
body{margin:0;background:var(--void);color:var(--ivory);font-family:var(--sans);font-weight:300;font-size:16px;line-height:1.65;
 -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:clip;text-rendering:optimizeLegibility}
img,video,svg{display:block;max-width:100%}
svg{flex-shrink:0}
a{color:inherit;text-decoration:none}
a,label,button,summary{touch-action:manipulation}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
h1,h2,h3,h4,h5{margin:0;font-family:var(--serif);font-weight:300;letter-spacing:-.012em;line-height:1.04}
p{margin:0}
[hidden]{display:none!important}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.st{position:absolute;opacity:0;width:0;height:0;pointer-events:none}
::selection{background:var(--rose);color:var(--void)}
:focus-visible{outline:1px solid var(--champagne);outline-offset:4px;border-radius:2px}
.skip{position:fixed;left:12px;top:-60px;z-index:300;padding:10px 16px;background:var(--ivory);color:var(--void);font-size:.8rem;font-weight:600;transition:top .2s}
.skip:focus{top:12px}
section{scroll-margin-top:90px}

/* film grain — a single fixed layer, GPU-cheap, gives the black real depth */
body::after{content:"";position:fixed;inset:0;z-index:250;pointer-events:none;opacity:.055;
 background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}


/* ---------- layout ---------- */
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--gx)}
.sec{padding:clamp(80px,12vw,180px) 0;position:relative}
.sec-head{max-width:820px;margin-bottom:clamp(44px,6vw,84px)}
.rule{height:1px;background:var(--hair)}

/* ---------- type ---------- */
.mono,.eyebrow{font-family:var(--mono);font-size:.68rem;font-weight:400;letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.eyebrow{display:inline-flex;align-items:center;gap:14px;color:var(--champagne)}
.eyebrow::before{content:"";width:34px;height:1px;background:currentColor;opacity:.6}
.dsp{font-size:clamp(2.6rem,7vw,6.4rem);font-weight:300;line-height:.98;letter-spacing:-.025em}
.dsp em,.lp-prose h2 em,.it{font-style:italic;font-weight:300}
.dsp em{color:#FFF3F8;text-shadow:0 0 1px #fff,0 0 10px rgba(255,79,154,.75),0 0 28px rgba(255,79,154,.45),0 0 70px rgba(168,107,255,.35)}
.lead{margin-top:26px;color:var(--mute);font-size:clamp(1rem,1.25vw,1.12rem);max-width:52ch;line-height:1.7}

/* neon type — layered glow, ignited by motion.js (data-ignite) */
.neon{color:#FFF3F8;font-style:italic;
 text-shadow:0 0 1px #fff,0 0 6px rgba(255,255,255,.55),0 0 14px rgba(255,79,154,.9),0 0 32px rgba(255,79,154,.6),0 0 72px rgba(168,107,255,.45)}
.neon--ice{text-shadow:0 0 1px #fff,0 0 6px rgba(255,255,255,.5),0 0 14px rgba(139,234,247,.9),0 0 34px rgba(91,140,255,.6),0 0 72px rgba(91,140,255,.4)}
.neon--gold{color:#FFF6E6;text-shadow:0 0 1px #fff,0 0 8px rgba(233,200,138,.9),0 0 26px rgba(233,200,138,.55),0 0 64px rgba(255,140,60,.3)}
.m [data-ignite]:not(.is-lit):not([data-ignite="outline"]){opacity:.08;text-shadow:none}
.m [data-hero-title],.m [data-hero-foot],.m [data-hero-bg]{opacity:0}

/* ---------- buttons ---------- */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 28px;
 font-family:var(--sans);font-size:.8rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;border-radius:100px;
 border:1px solid transparent;cursor:pointer;isolation:isolate;overflow:hidden;
 transition:color .45s var(--ease),border-color .45s var(--ease),box-shadow .45s var(--ease),background-color .45s var(--ease)}
.btn::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;transform:translateY(101%);transition:transform .55s var(--ease)}
.btn:hover::before{transform:none}
.btn svg{flex:none}
.btn-g{background:var(--ivory);color:var(--void)}
.btn-g::before{background:var(--light)}
.btn-g:hover{box-shadow:0 0 0 1px rgba(255,255,255,.15),0 14px 50px -10px rgba(255,79,154,.6)}
.btn-o{border-color:var(--hair-3);color:var(--ivory)}
.btn-o::before{background:var(--ivory)}
.btn-o:hover{color:var(--void);border-color:var(--ivory)}
.btn-w{background:#0F2A22;color:#9BF0CF;border-color:#22503F}
.btn-w::before{background:#9BF0CF}
.btn-w:hover{color:#06231A;box-shadow:0 14px 50px -12px rgba(80,220,170,.55)}
.btn:disabled{opacity:.5;cursor:not-allowed}

/* text link with drawn underline */
.ulink,.svc-link{position:relative;display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ivory);padding-bottom:6px}
.ulink::after,.svc-link::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:currentColor;transform-origin:right;transition:transform .6s var(--ease)}
.ulink:hover::after,.svc-link:hover::after{transform:scaleX(0)}
.ulink:hover,.svc-link:hover{color:var(--champagne)}

/* ---------- header ---------- */
.hdr{position:fixed;inset:0 0 auto 0;z-index:90;transition:transform .6s var(--ease),background-color .5s,border-color .5s;border-bottom:1px solid transparent}
.hdr.is-scrolled{background:rgba(5,4,7,.72);-webkit-backdrop-filter:blur(18px) saturate(1.2);backdrop-filter:blur(18px) saturate(1.2);border-bottom-color:var(--hair)}
.hdr.is-hidden{transform:translateY(-100%)}
.hdr{padding-top:env(safe-area-inset-top, 0px)}
.hdr-in{max-width:var(--maxw);margin:0 auto;padding:18px var(--gx);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px}
.brand{display:inline-flex;align-items:center;gap:12px;justify-self:start}
.brand img{display:block;height:50px;width:auto;transition:filter .5s}
.brand:hover img{filter:brightness(1.18) drop-shadow(0 0 10px rgba(176,92,255,.45))}
@media(max-width:820px){.brand img{height:44px}}
@media(max-width:370px){.brand img{height:40px}}
.nlinks{display:flex;gap:clamp(18px,2.4vw,38px)}
.nlinks a{position:relative;font-size:.78rem;font-weight:500;letter-spacing:.06em;color:var(--mute);padding:6px 0;transition:color .3s}
.nlinks a::after{content:"";position:absolute;left:50%;bottom:0;width:4px;height:4px;margin-left:-2px;border-radius:50%;background:var(--rose);
 box-shadow:0 0 8px var(--rose);transform:scale(0);transition:transform .4s var(--ease)}
.nlinks a:hover{color:var(--ivory)}
.nlinks a.nl-hot{color:var(--ivory);text-shadow:0 0 12px rgba(255,79,214,.55)}
.nlinks a.nl-3d{text-shadow:0 0 12px rgba(91,140,255,.6)}
.nlinks a.active{color:var(--ivory)}
.nlinks a.active::after{transform:scale(1)}
.header-actions{display:flex;align-items:center;gap:10px;justify-self:end}
.ncta-ig{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid var(--hair-2);color:var(--ivory);transition:border-color .3s,color .3s}
.ncta-ig:hover{border-color:var(--ivory)}
.ncta{display:inline-flex;align-items:center;gap:9px;height:44px;padding:0 20px;border-radius:100px;background:var(--ivory);color:var(--void);
 font-size:.74rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;transition:box-shadow .4s}
.ncta:hover{box-shadow:0 0 0 4px rgba(244,238,228,.12),0 10px 40px -8px rgba(255,79,154,.6)}
.menu-btn{display:none;align-items:center;gap:10px;height:44px;padding:0 4px 0 14px;font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase}
.menu-btn i{position:relative;width:22px;height:8px;display:block}
.menu-btn i::before,.menu-btn i::after{content:"";position:absolute;left:0;right:0;height:1px;background:currentColor;transition:transform .5s var(--ease),top .5s var(--ease)}
.menu-btn i::before{top:0}.menu-btn i::after{top:7px}
.menu-open .menu-btn i::before{top:4px;transform:rotate(45deg)}
.menu-open .menu-btn i::after{top:4px;transform:rotate(-45deg)}
@media(max-width:960px){
 .hdr-in{grid-template-columns:1fr auto;padding:12px var(--gx)}
 .hdr,.hdr.is-scrolled{background:rgba(5,4,7,.94);-webkit-backdrop-filter:none;backdrop-filter:none;border-bottom-color:var(--hair)}
 .nlinks{display:none}
 .menu-btn{display:inline-flex}
 .ncta-ig{display:none}
 .ncta{display:none}
}

/* full-screen menu */
.menu{position:fixed;inset:0;z-index:85;background:var(--void);display:flex;flex-direction:column;justify-content:space-between;
 padding:calc(110px + env(safe-area-inset-top, 0px)) var(--gx) calc(28px + env(safe-area-inset-bottom, 0px));visibility:hidden;opacity:0;
 clip-path:inset(0 0 100% 0);transition:clip-path .8s var(--ease-io),opacity .3s .5s,visibility 0s .8s}
.menu-open .menu{visibility:visible;opacity:1;clip-path:inset(0 0 0 0);transition:clip-path .8s var(--ease-io),opacity 0s,visibility 0s}
.menu::before{content:"";position:absolute;inset:auto -20% -30% auto;width:80vw;height:80vw;border-radius:50%;
 background:radial-gradient(closest-side,rgba(168,107,255,.22),transparent);pointer-events:none}
.menu nav{display:flex;flex-direction:column}
.menu nav a{display:flex;align-items:baseline;gap:16px;font-family:var(--serif);font-size:clamp(2.6rem,11vw,5rem);line-height:1.08;font-weight:300;
 border-bottom:1px solid var(--hair);padding:6px 0;opacity:0;transform:translateY(30px);transition:opacity .6s var(--ease),transform .8s var(--ease)}
.menu nav a span{font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;color:var(--mute-2)}
.menu-open .menu nav a{opacity:1;transform:none}
.menu-open .menu nav a:nth-child(1){transition-delay:.25s}.menu-open .menu nav a:nth-child(2){transition-delay:.3s}
.menu-open .menu nav a:nth-child(3){transition-delay:.35s}.menu-open .menu nav a:nth-child(4){transition-delay:.4s}
.menu-open .menu nav a:nth-child(5){transition-delay:.45s}.menu-open .menu nav a:nth-child(6){transition-delay:.5s}
.menu-open .menu nav a:nth-child(7){transition-delay:.55s}.menu-open .menu nav a:nth-child(8){transition-delay:.6s}
@media(max-height:760px){.menu{overflow-y:auto}.menu nav a{font-size:clamp(2rem,9vw,3rem)}}
.menu nav a.active{font-style:italic;color:#FFF3F8;text-shadow:0 0 18px rgba(255,79,154,.6)}
.menu-foot{position:relative;display:flex;flex-wrap:wrap;gap:12px 22px;align-items:center;justify-content:space-between}
.menu-foot .mono a{color:var(--ivory)}
.menu-open{overflow:hidden}
@media(min-width:961px){.menu{display:none}}

/* mobile WhatsApp dock — appears after the hero */

/* =====================================================================
   HOMEPAGE
   ===================================================================== */

/* --- hero: full-bleed photograph, type set over it --- */
.h-hero{position:relative;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;
 padding:clamp(120px,16vh,180px) 0 clamp(48px,8vh,90px);isolation:isolate}
.h-hero-bg{position:absolute;inset:0;z-index:-1;overflow:hidden;background:var(--void)}
.h-hero-bg img{position:absolute;left:0;top:-6%;width:100%;height:112%;object-fit:cover;object-position:62% 42%;filter:saturate(1.08) contrast(1.06)}
.h-hero-bg::after{content:"";position:absolute;inset:0;
 background:linear-gradient(90deg,rgba(5,4,7,.88) 0%,rgba(5,4,7,.55) 38%,rgba(5,4,7,.1) 70%),
            linear-gradient(180deg,rgba(5,4,7,.55) 0%,rgba(5,4,7,0) 25%,rgba(5,4,7,0) 55%,rgba(5,4,7,.95) 100%)}
.h-hero .wrap{position:relative;width:100%}
.h-hero-title{font-size:clamp(2.7rem,6vw,6.2rem);line-height:.95;letter-spacing:-.035em;font-weight:300}
.h-hero-title .ln{display:block}
.h-hero-title .ln-2{padding-left:clamp(0px,4vw,70px)}
.h-hero-title .amp{font-style:italic;color:var(--champagne)}
.h-hero-foot{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:26px 40px;margin-top:clamp(28px,4vh,48px)}
.h-hero-lede{max-width:46ch;color:rgba(244,238,228,.78);font-size:clamp(.98rem,1.1vw,1.08rem)}
/* the two studios, front and centre: slim glass pills with a live neon outline, the photo shows through */
@property --ang{syntax:'<angle>';inherits:false;initial-value:0deg}
.h-hero-cta{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:min(100%,520px)}
.h-hero-cta .btn-w{grid-column:1 / -1;min-height:48px;background:rgba(10,36,28,.5);border-color:rgba(75,224,138,.35);
 -webkit-backdrop-filter:blur(14px) saturate(1.3);backdrop-filter:blur(14px) saturate(1.3)}
.sc{--a:#FF4FD6;--b:#B05CFF;--c2:#5B8CFF;position:relative;isolation:isolate;display:flex;align-items:center;gap:11px;min-height:62px;
 padding:8px 46px 8px 8px;border-radius:999px;background:rgba(12,9,18,.38);
 -webkit-backdrop-filter:blur(16px) saturate(1.4);backdrop-filter:blur(16px) saturate(1.4);
 box-shadow:0 10px 34px -14px rgba(0,0,0,.7);transition:transform .35s var(--ease),box-shadow .35s}
.sc-3d{--a:#5B8CFF;--b:#2EE6D0;--c2:#B05CFF}
.sc::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;padding:1.2px;
 background:conic-gradient(from var(--ang),var(--a),var(--b),var(--c2),rgba(255,255,255,.08) 62%,var(--a));
 -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
 animation:scSpin 5s linear infinite}
.sc-3d::before{animation-delay:-2.5s}
@keyframes scSpin{to{--ang:360deg}}
.sc:hover,.sc:focus-visible{transform:translateY(-2px);box-shadow:0 14px 40px -12px var(--a)}
.sc-viz{position:relative;flex:none;width:46px;height:46px;border-radius:50%;overflow:hidden;display:grid;place-items:center;
 background:radial-gradient(circle at 50% 55%,#3a1236 0%,#0d0812 72%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.sc-viz img{width:100%;height:100%;object-fit:cover}
.sc-word{font-family:var(--serif);font-style:italic;font-weight:400;font-size:1.45rem;line-height:1;color:#FFF3FB;
 text-shadow:0 0 1px #fff,0 0 4px #fff,0 0 8px #FF4FD6,0 0 16px #FF4FD6,0 0 30px rgba(255,46,196,.9);animation:scFlick 7s infinite}
@keyframes scFlick{0%,91%,100%{opacity:1}92%{opacity:.35}93.5%{opacity:1}95%{opacity:.6}96%{opacity:1}}
.sc-txt{display:flex;flex-direction:column;gap:3px;min-width:0}
.sc-txt b{font-family:var(--sans);font-size:.9rem;font-weight:600;letter-spacing:.01em;color:var(--ivory);white-space:nowrap}
.sc-txt i{font-style:normal;font-family:var(--mono);font-size:.56rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(244,238,228,.62);white-space:nowrap}
.sc-txt::after{content:"\2192";position:absolute;right:9px;top:50%;width:28px;height:28px;margin-top:-14px;display:grid;place-items:center;border-radius:50%;
 background:var(--a);color:#0A080E;font-family:var(--sans);font-size:.82rem;font-weight:700;box-shadow:0 0 14px -2px var(--a)}
@media(max-width:820px){
 .h-hero-cta{width:100%;gap:8px}
 .sc{gap:9px;min-height:56px;padding:6px 12px 6px 6px}
 .sc-viz{width:42px;height:42px}.sc-word{font-size:1.3rem}
 .sc-txt b{font-size:.84rem}.sc-txt i{font-size:.5rem;letter-spacing:.1em}
 .sc-txt::after{display:none}
}
@media(max-width:370px){.sc-txt b{font-size:.78rem}.sc-viz{width:38px;height:38px}.h-hero-title{font-size:2.3rem}}
@media(prefers-reduced-motion:reduce){.sc::before,.sc-word{animation:none}}
@media(max-width:820px) and (max-height:760px){.h-hero-lede{display:none}}
.charity-chip{display:inline-flex;align-items:center;gap:10px;margin-top:18px;font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--champagne)}
.charity-chip::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--champagne);box-shadow:0 0 10px var(--champagne);animation:pulse 2.6s ease-in-out infinite}
@keyframes pulse{50%{opacity:.35}}
.h-hero-rail{position:absolute;left:calc(var(--gx) * .35);top:50%;transform:translate(-50%,-50%) rotate(-90deg);white-space:nowrap}
.h-hero-scroll{position:absolute;right:var(--gx);top:clamp(120px,16vh,180px);display:flex;flex-direction:column;align-items:center;gap:14px}
.h-hero-scroll i{position:relative;width:1px;height:70px;background:var(--hair-2);overflow:hidden;display:block}
.h-hero-scroll i::after{content:"";position:absolute;left:0;top:-40%;width:1px;height:40%;background:var(--ivory);animation:drip 2.2s var(--ease-io) infinite}
@keyframes drip{to{top:100%}}
.h-hero-cap{position:absolute;right:var(--gx);bottom:clamp(20px,3vh,32px)}
@media(max-width:820px){
 .h-hero{padding-top:110px;justify-content:flex-end}
 .h-hero-bg img{object-position:68% 30%}
 .h-hero-bg::after{background:linear-gradient(180deg,rgba(5,4,7,.32) 0%,rgba(5,4,7,.08) 26%,rgba(5,4,7,.5) 50%,rgba(5,4,7,.66) 76%,rgba(5,4,7,.9) 100%)}
 .h-hero-title{font-size:clamp(2.5rem,11vw,4.2rem)}
 .h-hero-title .ln-2{padding-left:6vw}
 .h-hero-rail,.h-hero-scroll,.h-hero-cap{display:none}
}

/* --- work reel: two rows of pieces drifting in opposite directions (pure CSS) --- */
.reel{padding:clamp(70px,9vw,140px) 0 clamp(60px,8vw,120px);overflow:hidden}
.reel-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:clamp(30px,4vw,56px)}
.reel-head .dsp{font-size:clamp(2.2rem,4.6vw,4.4rem)}
.reel-rows{display:flex;flex-direction:column;gap:clamp(10px,1.2vw,16px)}
.reel-row{position:relative;display:block;overflow:hidden}
.reel-links{display:flex;flex-wrap:wrap;gap:12px 28px;margin:0}
.reel-lbl{position:absolute;left:var(--gx);top:12px;z-index:2;padding:8px 14px;border-radius:999px;font-family:var(--sans);font-size:.74rem;font-weight:600;letter-spacing:.04em;
 color:#fff;background:rgba(10,8,14,.55);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:inset 0 0 0 1px #FF4FD6,0 0 18px -4px #FF4FD6}
.reel-lbl-3d{box-shadow:inset 0 0 0 1px #5B8CFF,0 0 18px -4px #5B8CFF}
.reel-it{display:block;flex:none}
.reel-lbl-live{display:inline-flex;align-items:center;gap:9px}
.reel-lbl-live::before{content:"";width:7px;height:7px;border-radius:50%;background:#FF4FD6;box-shadow:0 0 10px #FF4FD6;animation:pulse 2.4s ease-in-out infinite}
.reel-track{display:flex;gap:clamp(10px,1.2vw,16px);width:max-content;animation:reel 70s linear infinite}
.reel-row.rev .reel-track{animation-direction:reverse;animation-duration:80s}
.reel-row:hover .reel-track{animation-play-state:paused}
.reel-track img{height:clamp(170px,19vw,280px);width:auto;aspect-ratio:4/5;object-fit:cover;border-radius:2px;filter:saturate(1.05);transition:filter .5s}
.reel-row:hover .reel-track img{filter:saturate(.6) brightness(.7)}
.reel-row:hover .reel-track img:hover{filter:none}
@keyframes reel{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.reel-track{animation:none}}
.qa-links{margin-top:22px}
.qa-links a{font-family:var(--mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ivory);border:1px solid var(--hair-2);padding:8px 13px;border-radius:100px;transition:border-color .3s,color .3s}
.qa-links a:hover{border-color:var(--champagne);color:var(--champagne)}

/* --- manifesto --- */
.manifesto{padding:clamp(100px,16vw,240px) 0 clamp(80px,12vw,180px)}
.manifesto .wrap{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(12px,2vw,28px)}
.manifesto-label{grid-column:1 / 4;padding-top:.9em}
.manifesto-text{grid-column:4 / -1;font-family:var(--serif);font-size:clamp(1.9rem,4.3vw,4.4rem);line-height:1.08;letter-spacing:-.02em;font-weight:300}
.manifesto-text .w{transition:color .2s}
.m .manifesto-text .w{color:rgba(244,238,228,.16)}
.manifesto-text em{font-style:italic;color:var(--champagne)}
.manifesto-sig{grid-column:4 / -1;margin-top:clamp(36px,5vw,60px);display:flex;align-items:center;gap:22px}
.tube{width:clamp(120px,22vw,320px);height:auto;overflow:visible}
.tube path{fill:none;stroke:#FFE7F2;stroke-width:2.2;stroke-linecap:round;filter:drop-shadow(0 0 3px #FF4F9A) drop-shadow(0 0 10px rgba(255,79,154,.7))}
@media(max-width:820px){.manifesto-label,.manifesto-text,.manifesto-sig{grid-column:1 / -1}.manifesto-label{margin-bottom:22px}}

.chips{display:flex;gap:8px;flex-wrap:wrap}
.chips span{font-family:var(--mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--mute);border:1px solid var(--hair-2);padding:7px 12px;border-radius:100px}
.swipe-hint{display:none}
@media(max-width:820px){.swipe-hint{display:inline-flex;margin-top:18px;grid-column:1 / -1;color:var(--mute-2)}}

/* --- marquee --- */
.marquee{overflow:hidden;padding:clamp(26px,3.6vw,44px) 0;white-space:nowrap;user-select:none}
.marquee-track{display:inline-flex;will-change:transform}
.marquee-track span{font-family:var(--serif);font-size:clamp(3rem,8vw,8.4rem);font-weight:300;line-height:1;letter-spacing:-.03em;padding-right:.4em;
 color:transparent;-webkit-text-stroke:1px rgba(244,238,228,.28)}
.marquee-track span i{font-style:italic;color:#FFF3F8;-webkit-text-stroke:0;text-shadow:0 0 12px rgba(255,79,154,.6),0 0 40px rgba(168,107,255,.35)}
.marquee-track span::after{content:"✦";font-size:.3em;vertical-align:.9em;margin-left:.55em;color:var(--champagne);-webkit-text-stroke:0}

/* --- instagram journal (homepage composition) --- */
.journal{padding:clamp(100px,14vw,200px) 0}
.journal-head{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(12px,2vw,28px);align-items:end;margin-bottom:clamp(50px,7vw,96px)}
.journal-head .dsp{grid-column:1 / 9}
.journal-head .side{grid-column:9 / -1;display:flex;flex-direction:column;gap:18px;align-items:flex-start}
.journal-head .side p{color:var(--mute);max-width:34ch}
.handle{font-family:var(--serif);font-style:italic}
@media(max-width:820px){.journal-head .dsp,.journal-head .side{grid-column:1 / -1}.journal-head .side{margin-top:24px}}

.ig-comp{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(12px,2vw,28px);row-gap:clamp(24px,4vw,60px)}
.ig-card{position:relative;margin:0;display:block}
.ig-card .ph{position:relative;overflow:hidden;border-radius:2px;background:var(--ink-800)}
.ig-card img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease),filter .8s}
.ig-card:hover img{transform:scale(1.045)}
.ig-card .ph img[data-speed]{position:absolute;left:0;top:-7%;height:114%}
.ig-card .ph:has(img[data-speed]){height:auto}
.ig-card .ph::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);pointer-events:none}
.ig-card figcaption{display:flex;justify-content:space-between;gap:16px;margin-top:12px;align-items:baseline}
.ig-card .cap{font-family:var(--serif);font-size:1.05rem;color:var(--ivory);line-height:1.35;max-width:38ch;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ig-card time{flex:none}
.ig-comp .c1{grid-column:1 / 8;grid-row:span 2}
.ig-comp .c1 .ph{aspect-ratio:4/5}
.ig-comp .c2{grid-column:9 / 13;align-self:start;margin-top:clamp(0px,6vw,90px)}
.ig-comp .c2 .ph{aspect-ratio:1}
.ig-comp .c3{grid-column:9 / 12;align-self:end}
.ig-comp .c3 .ph{aspect-ratio:4/5}
.ig-comp .c4{grid-column:2 / 6}
.ig-comp .c4 .ph{aspect-ratio:1}
.ig-comp .c5{grid-column:7 / 13;margin-top:clamp(0px,10vw,160px)}
.ig-comp .c5 .ph{aspect-ratio:3/2}
.ig-comp .quote{grid-column:1 / 7;align-self:center;font-family:var(--serif);font-size:clamp(1.6rem,3vw,2.8rem);line-height:1.15;font-style:italic;color:var(--ivory);padding-right:4vw}
@media(max-width:820px){
 .ig-comp .c1{grid-column:1 / -1;grid-row:auto}
 .ig-comp .c2{grid-column:1 / 8;margin-top:0}
 .ig-comp .c3{grid-column:6 / -1;margin-top:-30%}
 .ig-comp .c4{grid-column:1 / 9}
 .ig-comp .c5{grid-column:3 / -1;margin-top:0}
 .ig-comp .quote{grid-column:1 / -1;padding:0}
}
.ig-status{grid-column:1 / -1;font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--mute-2)}

/* --- giving --- */
.giving{padding:clamp(90px,12vw,180px) 0;position:relative;overflow:hidden}
.giving .wrap{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(12px,2vw,28px);align-items:center}
.giving-num{grid-column:1 / 7;font-family:var(--serif);font-weight:300;font-size:clamp(9rem,30vw,28rem);line-height:.8;letter-spacing:-.06em;
 color:transparent;-webkit-text-stroke:1px rgba(233,200,138,.55)}
.giving-num.neon--gold{color:#FFF6E6;-webkit-text-stroke:0}
.giving-copy{grid-column:8 / -1}
.giving-copy h2{font-size:clamp(2.2rem,4.4vw,4.2rem);margin:20px 0 22px}
.giving-copy p{color:var(--mute);max-width:40ch}
@media(max-width:820px){.giving-num,.giving-copy{grid-column:1 / -1}.giving-copy{margin-top:20px}}

/* --- FAQ + prose (editorial two-column) --- */
.qa .wrap{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(12px,2vw,28px)}
.qa-side{grid-column:1 / 5;position:sticky;top:120px;align-self:start}
.qa-side h2{font-size:clamp(2.4rem,4.6vw,4.4rem)}
.qa-side p{margin-top:22px;color:var(--mute);font-size:.95rem;line-height:1.75;max-width:42ch}
.qa-side p a{color:var(--ivory);text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--hair-3)}
.qa-side p a:hover{color:var(--champagne)}
.qa-main{grid-column:6 / -1}
.qa-main .faq{max-width:none;margin:0}
@media(max-width:900px){.qa-side,.qa-main{grid-column:1 / -1}.qa-side{position:static;margin-bottom:48px}}

/* --- finale --- */
.finale{position:relative;padding:clamp(120px,18vw,260px) 0;text-align:center;overflow:hidden}
.finale::before{content:"";position:absolute;left:50%;bottom:-40%;width:min(1200px,140vw);aspect-ratio:1;transform:translateX(-50%);border-radius:50%;
 background:radial-gradient(closest-side,rgba(255,79,154,.2),rgba(168,107,255,.1) 50%,transparent);pointer-events:none}
.finale h2{position:relative;font-size:clamp(4rem,16vw,15rem);line-height:.86;letter-spacing:-.05em}
.finale p{position:relative;margin:34px auto 0;color:var(--mute);max-width:44ch}
.finale .final-btns{position:relative}

/* =====================================================================
   SHARED / INNER PAGES (class names kept from v25 for compatibility)
   ===================================================================== */
.page-hero{position:relative;overflow:hidden;padding:clamp(130px,15vw,190px) 0 clamp(30px,4vw,60px)}
.page-hero .sec-head{max-width:none;margin-bottom:clamp(40px,6vw,80px);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(12px,2vw,28px)}
.page-hero .sec-head>*{grid-column:1 / -1}
.page-hero .sec-head .dsp{margin-top:22px!important;font-size:clamp(2.5rem,6vw,5.6rem);max-width:16ch}
.page-hero .sec-head .lead{grid-column:7 / -1;margin-top:clamp(24px,4vw,48px)}
@media(max-width:820px){.page-hero .sec-head .lead{grid-column:1 / -1}}
.page-hero>.wrap{position:relative;z-index:1}

/* ambient light (legacy markup: <div class="ambient"><i></i>×3</div>) — now one slow, soft source */
.ambient{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.ambient i{position:absolute;display:block;border-radius:50%;opacity:.5}
.ambient i:nth-child(1){width:70vw;height:70vw;right:-30vw;top:-30vw;background:radial-gradient(closest-side,rgba(168,107,255,.22),transparent)}
.ambient i:nth-child(2){width:50vw;height:50vw;left:-25vw;top:20%;background:radial-gradient(closest-side,rgba(255,79,154,.12),transparent)}
.ambient i:nth-child(3){display:none}

/* legacy reveal hooks — motion.js animates these; visible by default */
.m .reveal:not(.stagger),.m [data-reveal]{opacity:0;transform:translateY(24px)}
.m .stagger>*{opacity:0;transform:translateY(20px)}

/* steps */
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid var(--hair)}
.step{padding:clamp(28px,3.4vw,46px) clamp(14px,2vw,30px) clamp(10px,2vw,20px) 0;border-right:1px solid var(--hair)}
.step:not(:first-child){padding-left:clamp(14px,2vw,30px)}
.step:last-child{border-right:0}
.step-n{font-family:var(--serif);font-size:clamp(3.4rem,6vw,5.6rem);font-weight:300;line-height:1;font-style:italic;color:transparent;-webkit-text-stroke:1px rgba(244,238,228,.4)}
.step h3,.step h4{font-size:clamp(1.5rem,2.2vw,2rem);margin-top:22px}
.step p{margin-top:12px;color:var(--mute);font-size:.95rem;max-width:34ch}
@media(max-width:760px){.step{padding:22px 8px 18px!important;text-align:center}.step-n{display:none}.step-top{justify-content:center}.step-ic{margin-top:0}.step h3,.step h4{font-size:1.08rem;margin-top:12px}.step p{font-size:.8rem;line-height:1.45;margin-top:6px}}

/* stats (legacy) */
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.stat{padding:34px 18px;border-left:1px solid var(--hair)}.stat:first-child{border-left:0;padding-left:0}
.stat b{display:block;font-family:var(--serif);font-size:clamp(2rem,3.6vw,3.2rem);font-weight:300;line-height:1}
.stat span{display:block;margin-top:10px;font-family:var(--mono);font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;color:var(--mute-2)}
@media(max-width:700px){.stats{grid-template-columns:1fr 1fr}.stat:nth-child(3){border-left:0;padding-left:0}}

/* price band (legacy) */
.band{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 30px;padding:20px 0;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);
 font-family:var(--mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--mute);margin:0 0 30px}
.band b{color:var(--champagne);font-weight:400}
.band a{color:var(--ivory);text-decoration:underline;text-underline-offset:4px}

/* contact cards */
.cgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--hair)}
@media(max-width:640px){.cgrid{grid-template-columns:1fr}}
.card{position:relative;display:flex;align-items:center;gap:20px;padding:clamp(24px,3vw,40px) 8px;border-bottom:1px solid var(--hair);transition:padding .5s var(--ease)}
.cgrid .card:nth-child(odd){border-right:1px solid var(--hair)}
@media(max-width:640px){.cgrid .card:nth-child(odd){border-right:0}}
.card:hover{padding-left:22px}
.card b{display:block;font-family:var(--serif);font-size:clamp(1.4rem,2.2vw,1.9rem);font-weight:400}
.card span{display:block;margin-top:4px;color:var(--mute);font-size:.86rem}
.card svg{flex:none;color:var(--champagne)}

/* final CTA (legacy class on inner pages) */
.final{position:relative;padding:clamp(70px,10vw,140px) 0 clamp(20px,3vw,40px);text-align:center;border-top:1px solid var(--hair)}
.final::before{content:"";position:absolute;left:50%;top:0;width:min(560px,80vw);height:1px;transform:translateX(-50%);background:var(--light);box-shadow:0 0 18px rgba(255,79,154,.7)}
.final h2{font-size:clamp(2.8rem,8vw,7rem)!important;margin-top:24px!important}
.final p{margin:22px auto 0;color:var(--mute);max-width:46ch}
.final .eyebrow{justify-content:center}
.final-btns{margin-top:40px;display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.note{margin-top:15px;font-size:.76rem;color:var(--mute-2);line-height:1.6}

/* landing-page prose */
.lp-prose{max-width:860px;margin:0 auto clamp(56px,7vw,96px)}
.lp-prose h2{font-size:clamp(2rem,4vw,3.4rem);margin:0 0 22px;line-height:1.04}
.lp-prose h2 em{color:var(--champagne)}
.lp-prose p{margin:0 0 16px;color:var(--mute);font-size:1rem;line-height:1.8}
.lp-prose a{color:var(--ivory);text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--hair-3);transition:color .3s}
.lp-prose a:hover{color:var(--champagne)}
.lp-prose .chips{margin-top:8px}
.lp-cta{max-width:860px;margin:0 auto clamp(56px,7vw,96px);text-align:center;padding:clamp(34px,5vw,60px) 0;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.lp-cta p{font-family:var(--serif);font-size:clamp(1.5rem,2.6vw,2.2rem);font-style:italic;line-height:1.3;margin:0 0 28px;color:var(--ivory)}
.lp-cta .final-btns{margin-top:0}

/* price table */
.ptable{max-width:860px;margin:0 auto clamp(56px,7vw,96px);overflow-x:auto;border-top:1px solid var(--hair-2)}
.ptable table{width:100%;border-collapse:collapse;font-size:.95rem;min-width:420px}
.ptable th{font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--champagne);text-align:left;padding:18px 14px;border-bottom:1px solid var(--hair);font-weight:400}
.ptable td{padding:18px 14px;border-bottom:1px solid var(--hair);color:var(--mute)}
.ptable td:last-child{color:var(--ivory);font-family:var(--serif);font-size:1.2rem;white-space:nowrap}
@media(max-width:480px){.ptable table{min-width:0;font-size:.8rem}.ptable th,.ptable td{padding:12px 8px}}

/* FAQ — hairline accordion */
.faq{max-width:860px;margin:0 auto clamp(56px,7vw,96px);border-top:1px solid var(--hair)}
.faq details{border-bottom:1px solid var(--hair)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:clamp(20px,2.4vw,30px) 0;
 font-family:var(--serif);font-size:clamp(1.25rem,1.9vw,1.6rem);font-weight:400;color:var(--ivory);transition:color .3s}
.faq summary:hover{color:var(--champagne)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:14px;height:14px;background:linear-gradient(currentColor,currentColor) center/100% 1px no-repeat,linear-gradient(currentColor,currentColor) center/1px 100% no-repeat;
 transition:transform .5s var(--ease);color:var(--mute)}
.faq details[open] summary::after{transform:rotate(135deg)}
.faq details p{padding:0 0 28px;color:var(--mute);font-size:.98rem;line-height:1.8;max-width:62ch}
.faq details p a{color:var(--ivory);text-decoration:underline;text-underline-offset:4px}

/* gallery tiles — shared by /gallery, /custom-3d-printing and landing pages */
.gal{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(10px,1.4vw,20px)}
.tile{position:relative;margin:0;overflow:hidden;border-radius:2px;background:var(--ink-800);aspect-ratio:4/5}
.tile img,.tile video{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease),filter .8s var(--ease)}
.tile video{background:#000}
.tile:hover img,.tile:hover video{transform:scale(1.05)}
.tile::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);pointer-events:none}
.tile figcaption{position:absolute;inset:auto 0 0 0;z-index:2;padding:46px 18px 16px;font-family:var(--serif);font-size:1.12rem;line-height:1.25;color:var(--ivory);
 background:linear-gradient(180deg,transparent,rgba(5,4,7,.9));transform:translateY(12px);opacity:0;transition:opacity .5s var(--ease),transform .7s var(--ease)}
.tile figcaption span{display:block;margin-bottom:6px;font-family:var(--mono);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:var(--champagne)}
.tile figcaption a{display:inline-block;margin-top:10px;font-family:var(--mono);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ivory);
 border-bottom:1px solid var(--hair-3);padding-bottom:3px}
.tile figcaption a:hover{color:var(--champagne);border-color:var(--champagne)}
.tile:hover figcaption,.tile:focus-within figcaption{opacity:1;transform:none}
@media(hover:none){.tile figcaption{opacity:1;transform:none;font-size:0;padding:30px 12px 12px}.tile figcaption span{font-size:.58rem;margin:0}.tile figcaption a{font-size:.58rem;margin-top:6px}}
.tile.vid::before{content:"Film";position:absolute;top:12px;left:12px;z-index:3;font-family:var(--mono);font-size:.56rem;letter-spacing:.16em;text-transform:uppercase;
 padding:5px 9px;border-radius:100px;background:rgba(5,4,7,.6);border:1px solid var(--hair-2);color:var(--ivory)}

/* landing-page + 3D galleries: one tidy grid, consistent proportions */
.gal.lp-gal{grid-template-columns:repeat(4,minmax(0,1fr));margin:0 0 clamp(56px,7vw,96px)}
.gal.lp-gal .tile{aspect-ratio:4/5}
@media(max-width:1000px){.gal.lp-gal{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:640px){.gal{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px}}

/* ---------- footer ---------- */
footer{position:relative;overflow:hidden;padding:clamp(80px,10vw,140px) 0 0;border-top:1px solid var(--hair);background:var(--void)}
.f-top{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(12px,2vw,28px);row-gap:40px}
.f-pitch{grid-column:1 / 6}
.f-pitch h3{font-size:clamp(2.2rem,4vw,3.6rem);line-height:1.02}
.f-pitch p{margin-top:20px;color:var(--mute);max-width:36ch;font-size:.92rem}
.f-pitch .btn{margin-top:30px}
.fcol{grid-column:span 2}
.fcol:first-of-type{grid-column:7 / span 2}
.fcol h2{font-family:var(--mono);font-size:.64rem;font-weight:400;letter-spacing:.14em;text-transform:uppercase;color:var(--mute-2);margin:0 0 20px}
.fcol a{display:block;width:max-content;max-width:100%;color:var(--ivory);font-size:.92rem;margin-bottom:12px;position:relative;transition:color .3s}
.fcol a:hover{color:var(--champagne)}
@media(max-width:900px){.f-pitch{grid-column:1 / -1}.fcol,.fcol:first-of-type{grid-column:span 6}}
@media(max-width:520px){.fcol,.fcol:first-of-type{grid-column:1 / -1}}
.f-mark{position:relative;display:grid;margin-top:clamp(60px,8vw,110px);padding:.08em 0 .14em;font-family:var(--serif);font-weight:300;font-size:clamp(4.6rem,21.5vw,22rem);line-height:.78;letter-spacing:-.055em;
 white-space:nowrap;text-align:center;user-select:none;transition:filter .8s var(--ease)}
.f-mark em{font-style:italic}
/* a neon sign: a white-hot tube over a coloured glow that drifts pink -> violet -> blue */
.fm{grid-area:1 / 1;color:transparent}
.fm-core{position:relative;z-index:1;-webkit-text-stroke:max(1px,.006em) rgba(255,248,252,.95)}
.fm-g{will-change:opacity;-webkit-text-stroke:.018em var(--c);text-shadow:0 0 .02em var(--c),0 0 .07em var(--c),0 0 .2em var(--c)}
.fm-pink{--c:#FF3FD2;animation:fmPink 12s ease-in-out infinite}
.fm-violet{--c:#B05CFF;opacity:0;animation:fmViolet 12s ease-in-out infinite}
.fm-blue{--c:#3DB4FF;opacity:0;animation:fmBlue 12s ease-in-out infinite}
@keyframes fmPink{0%,28%{opacity:1}38%,90%{opacity:0}100%{opacity:1}}
@keyframes fmViolet{0%,28%{opacity:0}38%,61%{opacity:1}71%,100%{opacity:0}}
@keyframes fmBlue{0%,61%{opacity:0}71%,90%{opacity:1}100%{opacity:0}}
/* unlit until it scrolls into view, then it flickers on (motion.js ignite) */
html.m .f-mark:not(.is-lit) .fm-g{animation:none;opacity:0}
html.m .f-mark:not(.is-lit) .fm-core{-webkit-text-stroke-color:rgba(244,238,228,.18)}
.fm-core{transition:-webkit-text-stroke-color .4s}
.f-mark:hover{filter:brightness(1.25) saturate(1.2)}
@media(prefers-reduced-motion:reduce){.fm-g{animation:none}.fm-pink{opacity:1}}
.fbot{display:flex;justify-content:space-between;gap:12px 24px;flex-wrap:wrap;padding:26px 0 calc(26px + env(safe-area-inset-bottom));border-top:1px solid var(--hair);margin-top:clamp(20px,3vw,40px)}
.fbot span{font-family:var(--mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--mute-2)}
.fbot b{font-weight:inherit;white-space:nowrap}
@media(max-width:960px){footer{padding-bottom:70px}}

/* ---------- reduced motion ---------- */
@media(prefers-reduced-motion:reduce){
 *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

/* =====================================================================
   INSTAGRAM — gallery wall, shared heads, lightbox
   ===================================================================== */
.wall-head{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(12px,2vw,28px);align-items:end;margin-bottom:clamp(28px,4vw,50px)}
.wall-head .eyebrow{grid-column:1 / -1;margin-bottom:26px}
.wall-head .dsp{grid-column:1 / 9;font-size:clamp(2rem,4.2vw,3.8rem)}
.wall-side{grid-column:9 / -1;display:flex;flex-direction:column;gap:18px;align-items:flex-start}
.wall-side p{color:var(--mute);max-width:36ch}
.handle{color:var(--ivory);text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--hair-3)}
@media(max-width:820px){.wall-head .dsp,.wall-side{grid-column:1 / -1}.wall-side{margin-top:24px}}

.ig-wall{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(12px,1.6vw,22px)}
.ig-wall .ig-card .ph{aspect-ratio:4/5}
.ig-wall .ig-card .cap{font-size:.95rem}
@media(max-width:1000px){.ig-wall{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:640px){.ig-wall{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.ig-wall .ig-card figcaption{display:none}}
.ig-multi{position:absolute;top:12px;right:12px;z-index:2;padding:5px 9px;border-radius:100px;background:rgba(5,4,7,.6);border:1px solid var(--hair-2);color:var(--ivory);font-size:.56rem}

.lb{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:rgba(5,4,7,.94);color:var(--ivory);
 -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.lb::backdrop{background:transparent}
.lb[open]{animation:lbIn .6s var(--ease) both}
@keyframes lbIn{from{opacity:0}}
.lb-in{height:100%;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(24px,4vw,64px);align-items:center;padding:clamp(70px,8vw,100px) var(--gx) clamp(30px,5vw,60px);max-width:var(--maxw);margin:0 auto}
.lb-fig{margin:0;height:100%;display:flex;align-items:center;justify-content:center;min-height:0}
.lb-fig img{max-height:100%;max-width:100%;object-fit:contain;border-radius:2px;animation:lbImg 1s var(--ease) both}
@keyframes lbImg{from{opacity:0;transform:scale(.96)}}
.lb-cap{margin-top:18px;font-family:var(--serif);font-size:clamp(1.3rem,2vw,1.8rem);line-height:1.3;white-space:pre-line;max-height:40vh;overflow:auto}
.lb-acts{margin-top:32px;display:flex;flex-wrap:wrap;gap:18px;align-items:center}
.lb-x{position:absolute;top:22px;right:var(--gx);height:44px;padding:0 18px;border:1px solid var(--hair-2);border-radius:100px;color:var(--ivory)}
.lb-x:hover{border-color:var(--ivory)}
.lb-open{overflow:hidden}
@media(max-width:820px){.lb-in{grid-template-columns:1fr;align-content:start;overflow:auto}.lb-fig{height:auto;max-height:60vh}.lb-fig img{max-height:60vh}.lb-cap{max-height:none}}
.page-hero + .sec{padding-top:clamp(30px,5vw,80px)}
.page-hero:has(+ .sec){padding-bottom:0}
/* landing-page prose as an editorial spread: heading left, text right */
@media(min-width:901px){
 .lp-prose{max-width:none;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(12px,2vw,28px);align-items:start}
 .lp-prose>h2{grid-column:1 / 6;grid-row:1 / span 8;margin:0;padding-right:2vw;position:sticky;top:120px}
 .lp-prose>*:not(h2){grid-column:7 / -1}
 .lp-cta{max-width:none}
 .ptable,.faq{width:calc(50% + 2vw);margin-left:auto;margin-right:0}
 .qa-main .faq{width:auto}
}

/* long copy tucked behind "Read more" so pages stay visual (content stays in the HTML for search engines) */
.more{margin-top:4px}
.more summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--champagne);padding:6px 0}
.more summary::-webkit-details-marker{display:none}
.more summary::after{content:"+";font-size:1rem;transition:transform .4s var(--ease)}
.more[open] summary::after{transform:rotate(45deg)}
.more[open] summary{margin-bottom:14px}
.more:not([open]) summary .less,.more[open] summary .rm{display:none}
.steps{margin-bottom:clamp(56px,7vw,96px)}
/* big collections (e.g. 3D printing) go five-up and square so the page stays short */
@media(min-width:1001px){.gal.lp-gal:has(.tile:nth-child(9)){grid-template-columns:repeat(5,minmax(0,1fr))}}
.gal.lp-gal:has(.tile:nth-child(9)) .tile{aspect-ratio:1}
/* phones: let the photos speak — captions on small grid tiles only clutter them */
@media(max-width:640px){.tile figcaption{display:none}}

/* --- kind words: customer quote + client spotlight --- */
.words{padding:clamp(56px,6.5vw,100px) 0;border-top:1px solid var(--hair)}
.words-in{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(12px,2vw,28px);align-items:center}
.words-quote{grid-column:1 / 6}
.words-quote blockquote{margin:20px 0 22px}
.words-quote p{font-family:var(--serif);font-style:italic;font-weight:300;font-size:clamp(1.35rem,2.1vw,1.95rem);line-height:1.2;letter-spacing:-.01em;color:var(--ivory);text-wrap:balance}
.words-quote cite{display:block;margin-top:14px;font-style:normal;color:var(--mute)}
.words-clients{grid-column:7 / -1;min-width:0}
.wc-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:14px;color:var(--mute)}
.wc-head .swipe-hint{margin-top:0}
.wc-row{display:flex;gap:10px}
.wc{flex:var(--r) 1 0%;min-width:0;margin:0}
.wc .ph{aspect-ratio:var(--r);overflow:hidden;border-radius:2px;background:var(--ink-800)}
.wc img{width:100%;height:100%;object-fit:cover}
.wc figcaption{margin-top:10px;display:flex;flex-direction:column;gap:2px;font-size:.8rem;line-height:1.35;color:var(--mute)}
.wc figcaption a,.wc-name{color:var(--ivory)}
.wc figcaption a{text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--hair-3)}
@media(max-width:1000px){.words-quote,.words-clients{grid-column:1 / -1}.words-clients{margin-top:40px}}
@media(max-width:820px){
 .wc-row{overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gx);margin:0 calc(-1 * var(--gx));padding:0 var(--gx) 4px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
 .wc-row::-webkit-scrollbar{display:none}
 .wc{flex:0 0 auto;width:calc(var(--r) * 168px);scroll-snap-align:start}
 .words-clients{margin-top:32px}
}


/* ---------- business page: recent work ---------- */
.biz-work-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:14px 24px;margin-bottom:clamp(20px,3vw,34px)}
.biz-work-head h2{flex-basis:100%;font-size:clamp(1.8rem,3.4vw,3rem)}
.biz-work-head .swipe-hint{margin-top:0}
.biz-row{gap:clamp(10px,1.4vw,18px)}
.biz-row .wc figcaption{font-size:.86rem}
.biz-ask{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 40px;margin:clamp(34px,5vw,60px) 0 clamp(50px,7vw,90px);padding:clamp(22px,3vw,34px);border:1px solid var(--hair);border-radius:4px;background:rgba(255,255,255,.015)}
.biz-ask h3{font-size:clamp(1.4rem,2.4vw,2rem)}
.biz-ask p{margin-top:8px;max-width:52ch;color:var(--mute);font-size:.95rem}
@media(max-width:820px){.biz-row .wc{width:calc(var(--r) * 230px)}.biz-ask .btn{width:100%}}

/* ---------- phone tab bar (pages side by side, always in reach) ---------- */
.tabbar{display:none}
@media(max-width:960px){
 :root{--tb:calc(62px + env(safe-area-inset-bottom, 0px))}
 body{padding-bottom:var(--tb)}
 .h-hero{min-height:calc(100svh - var(--tb))}
 .tabbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:84;height:var(--tb);
  padding:0 max(4px, env(safe-area-inset-right, 0px)) env(safe-area-inset-bottom, 0px) max(4px, env(safe-area-inset-left, 0px));
  background:rgba(7,5,10,.97);border-top:1px solid var(--hair-2)}
 .tabbar a{position:relative;flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;
  font-size:.62rem;font-weight:500;letter-spacing:.02em;line-height:1;color:var(--mute);white-space:nowrap;-webkit-tap-highlight-color:transparent;transition:color .25s}
 .tabbar svg{width:22px;height:22px}
 .tabbar a.active{color:var(--ivory)}
 .tabbar a.active::before{content:"";position:absolute;top:-1px;left:50%;width:22px;height:2px;margin-left:-11px;border-radius:2px;background:var(--rose);box-shadow:0 0 10px var(--rose)}
 .tabbar a.active svg{filter:drop-shadow(0 0 6px rgba(255,79,154,.55))}
 .tabbar .tb-hot{color:#FF8FE3}
 .tabbar .tb-3d{color:#9DB8FF}
 .tabbar .tb-hot.active{color:var(--ivory)}
 .tabbar .tb-wa{color:#4BE08A}
 .tabbar .tb-wa svg{width:21px;height:21px}
}

/* ---------- intro (homepage, once per session) ---------- */
.intro{position:fixed;inset:0;z-index:200;background:var(--void);display:grid;place-items:center;pointer-events:none}
.intro-word{font-family:var(--serif);font-size:clamp(2.6rem,9vw,6rem);font-weight:300;font-style:italic;letter-spacing:-.02em;color:#FFF3F8}
.intro-word span{display:inline-block;opacity:.06}
.intro-bar{position:absolute;left:var(--gx);right:var(--gx);bottom:calc(40px + env(safe-area-inset-bottom, 0px));display:flex;justify-content:space-between}
html:not(.m) .intro,html.seen .intro{display:none}

/* ---------- visual-first blocks ---------- */
.step-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.step-ic{display:grid;place-items:center;flex:none;width:52px;height:52px;margin-top:6px;border-radius:50%;border:1px solid var(--hair-2);color:var(--champagne);box-shadow:0 0 26px -10px rgba(233,200,138,.7)}
.step-ic svg{width:24px;height:24px}

/* photo + one line, alternating (landing pages) */
.lp-split{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(14px,2.4vw,40px);align-items:center;margin:0 0 clamp(56px,8vw,110px)}
.lp-fig{grid-column:1 / 8;grid-row:1;margin:0;position:relative;overflow:hidden;border-radius:3px;aspect-ratio:4/3;background:var(--ink-800)}
.lp-fig img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease)}
.lp-split:hover .lp-fig img{transform:scale(1.04)}
.lp-fig::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);pointer-events:none}
.lp-body{grid-column:9 / -1;grid-row:1}
.lp-split.rev .lp-fig{grid-column:6 / -1}
.lp-split.rev .lp-body{grid-column:1 / 5}
.lp-body h2{font-size:clamp(1.9rem,3.4vw,3.1rem);line-height:1.05}
.lp-body h2 em,.mini h2 em,.lp-specs h2 em{color:var(--champagne)}
.lp-short{margin:16px 0 0;color:var(--mute);font-size:clamp(1rem,1.2vw,1.1rem);line-height:1.6;max-width:36ch}
.lp-short a,.lp-body .more a,.mini .more a,.lp-specs .more a{color:var(--ivory);text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--hair-3)}
.lp-body .chips{margin-top:18px}
.lp-body .more,.mini .more,.lp-specs .more{margin-top:14px}
.lp-body .more p,.mini .more p,.lp-specs .more p{margin:12px 0 0;color:var(--mute);font-size:.95rem;line-height:1.75}
@media(max-width:820px){
 .lp-split .lp-fig,.lp-split .lp-body,.lp-split.rev .lp-fig,.lp-split.rev .lp-body{grid-column:1 / -1;grid-row:auto}
 .lp-fig{margin-bottom:18px}
 .lp-split{margin-bottom:56px}
}

/* icon spec grid (process) */
.lp-specs{max-width:1000px;margin:0 auto clamp(56px,8vw,110px)}
.lp-specs h2{font-size:clamp(1.9rem,3.4vw,3.1rem)}
.specs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(8px,1.2vw,14px);margin-top:clamp(20px,3vw,32px)}
.spec{display:flex;flex-direction:column;gap:14px;padding:clamp(16px,2vw,24px);border:1px solid var(--hair);border-radius:4px;background:rgba(255,255,255,.015)}
.spec svg{width:28px;height:28px;color:var(--champagne)}
.spec b{font-weight:400;font-size:.98rem;line-height:1.3;color:var(--ivory)}
@media(max-width:560px){.specs{grid-template-columns:1fr 1fr}}

/* small icon cards (3D printing) */
.minis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(10px,1.4vw,18px);margin:0 0 clamp(56px,7vw,96px)}
.mini{padding:clamp(20px,2.4vw,30px);border:1px solid var(--hair);border-radius:4px;background:rgba(255,255,255,.015)}
.mini>svg{width:30px;height:30px;color:var(--champagne)}
.mini h2{font-size:clamp(1.35rem,1.9vw,1.7rem);line-height:1.1;margin-top:16px}
.mini .lp-short{font-size:.92rem;margin-top:10px}
@media(max-width:1000px){.minis{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.minis{grid-template-columns:1fr}}

/* homepage: what we make (photo grid) */
.make{padding:clamp(30px,5vw,70px) 0 clamp(60px,8vw,110px)}
.make-head{margin-bottom:clamp(22px,3vw,40px)}
.make-head .dsp{font-size:clamp(2.4rem,5.4vw,5rem)}
.bento{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:repeat(2,clamp(180px,19vw,290px));gap:clamp(8px,1.1vw,14px)}
.bt{position:relative;display:block;overflow:hidden;border-radius:3px;background:var(--ink-800);isolation:isolate}
.bt img,.bt video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease)}
.bt:hover img,.bt:hover video{transform:scale(1.06)}
.bt::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(5,4,7,0) 45%,rgba(5,4,7,.88) 100%)}
.bt::after{content:"";position:absolute;inset:0;z-index:2;box-shadow:inset 0 0 0 1px rgba(255,255,255,.07);pointer-events:none}
.bt-cap{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:clamp(14px,1.8vw,24px);display:flex;flex-direction:column;gap:8px}
.bt-cap b{display:flex;align-items:center;gap:10px;font-family:var(--serif);font-weight:300;font-size:clamp(1.5rem,2.4vw,2.4rem);line-height:1;color:var(--ivory)}
.bt-cap b::after{content:"\2192";font-family:var(--sans);font-size:.5em;opacity:0;transform:translateX(-6px);transition:opacity .4s,transform .4s var(--ease)}
.bt:hover .bt-cap b::after,.bt:focus-visible .bt-cap b::after{opacity:1;transform:none}
.bt-cap i{font-style:normal;font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--champagne)}
.bt-homes{grid-column:1 / 4;grid-row:1 / 3}
.bt-events{grid-column:4 / 10;grid-row:1}
.bt-3d{grid-column:10 / 13;grid-row:1 / 3}
.bt-biz{grid-column:4 / 7;grid-row:2}
.bt-gifts{grid-column:7 / 10;grid-row:2}
@media(max-width:820px){
 .bento{grid-template-columns:1fr 1fr;grid-template-rows:repeat(3,46vw)}
 .bt-homes{grid-column:1;grid-row:1 / 3}
 .bt-events{grid-column:2;grid-row:1}
 .bt-biz{grid-column:2;grid-row:2}
 .bt-gifts{grid-column:1;grid-row:3}
 .bt-3d{grid-column:2;grid-row:3}
 .bt-cap{padding:12px}
 .bt-cap b{font-size:1.3rem}
 .bt-cap i{font-size:.54rem;letter-spacing:.1em}
}
.how{padding:0 0 clamp(30px,5vw,60px)}
.how-title{font-size:clamp(2.2rem,4.6vw,4.2rem);margin-bottom:clamp(20px,3vw,36px)}
