@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,300;9..144,400;9..144,500;9..144,600&family=LXGW+WenKai:wght@300;400;700&display=swap');
@font-face{font-family:Blinker;src:url('./fonts/blinker.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap}
@font-face{font-family:'Sulphur Point';src:url('./fonts/sulphur-point.woff2') format('woff2');font-style:normal;font-weight:300 700;font-display:swap}
@font-face{font-family:Gilroy;src:url('./fonts/gilroy-regular.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Gilroy;src:url('./fonts/gilroy-medium.woff2') format('woff2');font-style:normal;font-weight:500 700;font-display:swap}
:root{--background:#000;--foreground:#fff;--hero-bg:#0f0e0e;--accent:#fff;--accent-green:#8cff2e;--muted-ink:#ababab;--container-page:1274px;--gutter:24px;--gutter-lg:40px;--section:96px;--ease-out:cubic-bezier(.22,1,.36,1);color-scheme:dark}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:#000}
body{margin:0;background:var(--background);color:var(--foreground);font-family:Gilroy,Arial,sans-serif;overflow-x:hidden}
button,a{font:inherit}
a{color:inherit;text-decoration:none}
button{color:inherit}
img{display:block;max-width:100%}
.font-display{font-family:Blinker,Arial,sans-serif}.font-editorial{font-family:'Sulphur Point',Arial,sans-serif}
.container{width:min(calc(100% - 48px),var(--container-page));margin-inline:auto}
@media(min-width:768px){.container{width:min(calc(100% - 80px),var(--container-page))}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* Core layout */
body{min-width:320px}
body.menu-open{overflow:hidden}
main{isolation:isolate}
section{position:relative}
button{padding:0;border:0;background:none;cursor:pointer}
button:focus-visible,a:focus-visible{outline:2px solid #fff;outline-offset:4px}
::selection{background:#fff;color:#000}
.section-shell{width:min(calc(100% - 48px),var(--container-page));margin-inline:auto;padding-block:var(--section)}
.section-heading{margin:0;font-family:Blinker,Arial,sans-serif;font-size:clamp(40px,8vw,80px);font-weight:500;line-height:.9;letter-spacing:-.04em}
.eyebrow{margin:0 0 18px;color:rgba(255,255,255,.42);font-size:12px;line-height:1.2;letter-spacing:.25em;text-transform:uppercase}
.reveal{opacity:0;transform:translate3d(0,40px,0);transition:opacity .85s var(--ease-out),transform .85s var(--ease-out)}
.reveal.is-visible,.reveal.visible{opacity:1;transform:none}

/* Loading curtain */
.preloader{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;color:#fff;pointer-events:auto;transition:visibility 0s .9s}
.preloader-panel{position:absolute;top:0;bottom:0;width:20.1%;background:#050505;transform-origin:50% 100%;transition:transform .9s var(--ease-out)}
.preloader-panel:nth-child(1){left:0;transition-delay:.04s}.preloader-panel:nth-child(2){left:20%;transition-delay:.08s}.preloader-panel:nth-child(3){left:40%;transition-delay:.12s}.preloader-panel:nth-child(4){left:60%;transition-delay:.16s}.preloader-panel:nth-child(5){left:80%;transition-delay:.2s}
.preloader-copy{position:relative;z-index:1;display:grid;place-items:center;gap:8px;font-family:Blinker,Arial,sans-serif;transition:opacity .35s ease,transform .35s ease}
.preloader-percent{font-size:clamp(56px,9vw,132px);font-weight:500;line-height:.8;letter-spacing:-.05em}
.preloader-label{font-size:13px;letter-spacing:.3em;text-transform:uppercase}
.preloader.is-done{visibility:hidden;pointer-events:none}
.preloader.is-done .preloader-panel{transform:translateY(-102%)}
.preloader.is-done .preloader-copy{opacity:0;transform:translateY(-16px)}

/* Fixed navigation */
.site-header{position:fixed;z-index:100;top:16px;left:50%;width:min(calc(100% - 32px),1400px);transform:translateX(-50%);transition:transform .45s var(--ease-out),opacity .3s ease}
.nav-shell{position:relative;display:flex;min-height:68px;align-items:center;justify-content:space-between;gap:24px;padding:11px 16px 11px 12px;border:1px solid rgba(255,255,255,.1);border-radius:9999px;background:rgba(0,0,0,.3);box-shadow:0 8px 34px rgba(0,0,0,.14);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.nav-brand{position:relative;display:flex;min-width:0;align-items:center;gap:12px;font-family:Blinker,Arial,sans-serif;font-size:18px;font-weight:400;letter-spacing:0}.nav-brand::after{position:absolute;bottom:1px;left:35px;width:10px;height:10px;border:2px solid #101010;border-radius:50%;background:var(--accent-green);content:""}
.nav-brand img,.nav-avatar{width:44px;height:44px;flex:0 0 44px;border:1px solid rgba(255,255,255,.2);border-radius:50%;object-fit:cover}
.icon-link{display:grid;width:28px;height:28px;place-items:center}.icon-link svg{width:26px;height:26px;fill:#fff}.nav-socials .icon-link:first-child{border-radius:8px;background:#2867b2}.nav-socials .icon-link:first-child svg{width:20px;height:20px}
.nav-links,.nav-socials{display:flex;align-items:center;gap:clamp(18px,2.5vw,36px)}
.nav-links a,.nav-socials a{position:relative;color:rgba(255,255,255,.7);font-size:13px;transition:color .25s ease}
.nav-links a::after{position:absolute;right:0;bottom:-6px;left:0;height:1px;background:#fff;content:"";transform:scaleX(0);transform-origin:100% 50%;transition:transform .3s var(--ease-out)}
.nav-links a:hover,.nav-socials a:hover{color:#fff}.nav-links a:hover::after{transform:scaleX(1);transform-origin:0 50%}
.nav-more{display:none;width:42px;height:42px;place-items:center;border:1px solid rgba(255,255,255,.12);border-radius:50%;font-size:18px;letter-spacing:2px}
.site-header.is-scrolled .nav-links{display:flex}.site-header.is-scrolled .nav-more{display:none}
.mobile-menu-toggle{display:none;width:40px;height:40px;flex:0 0 40px;place-items:center;border:1px solid rgba(255,255,255,.12);border-radius:50%}
.mobile-menu-toggle span{display:block;width:16px;height:1px;margin:4px auto;background:#fff;transition:transform .3s var(--ease-out),opacity .2s ease}
.site-header.menu-open .mobile-menu-toggle span:first-child,.mobile-menu-toggle[aria-expanded="true"] span:first-child{transform:translateY(2.5px) rotate(45deg)}
.site-header.menu-open .mobile-menu-toggle span:last-child,.mobile-menu-toggle[aria-expanded="true"] span:last-child{transform:translateY(-2.5px) rotate(-45deg)}
.mobile-menu{position:absolute;top:calc(100% + 10px);right:0;left:0;display:grid;gap:4px;padding:12px;border:1px solid rgba(255,255,255,.1);border-radius:26px;background:rgba(8,8,8,.88);opacity:0;visibility:hidden;transform:translateY(-10px);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);transition:opacity .3s ease,transform .3s var(--ease-out),visibility 0s .3s}
.mobile-menu a{padding:13px 16px;border-radius:16px;color:rgba(255,255,255,.72);font-size:17px;transition:background .2s ease,color .2s ease}
.mobile-menu a:hover{background:rgba(255,255,255,.08);color:#fff}
.mobile-menu .mobile-lang-toggle{display:flex;width:100%;min-height:48px;align-items:center;padding:13px 16px!important;border-radius:16px;color:rgba(255,255,255,.72);font-size:17px;text-align:left;transition:background .2s ease,color .2s ease}
.mobile-menu .mobile-lang-toggle:hover,.mobile-menu .mobile-lang-toggle:focus-visible{background:rgba(255,255,255,.08);color:#fff}
.mobile-menu__meta{display:grid;margin-top:8px;padding-top:8px;border-top:1px solid rgba(255,255,255,.1);grid-template-columns:1fr 1fr;gap:4px}
.mobile-menu__meta a{color:rgba(255,255,255,.5);font-size:13px;letter-spacing:.04em}
.site-header.menu-open .mobile-menu,.mobile-menu.is-open{opacity:1;visibility:visible;transform:none;transition-delay:0s}

/* Hero */
.hero{position:relative;display:grid;min-height:100svh;place-items:center;overflow:hidden;background:var(--hero-bg);text-align:center}
#hero-canvas{position:absolute;inset:0;width:100%;height:100%;opacity:.7;pointer-events:none}
.hero::after{position:absolute;inset:0;background:radial-gradient(circle at 50% 48%,transparent 0,rgba(15,14,14,.1) 36%,rgba(15,14,14,.58) 100%);content:"";pointer-events:none}
.hero-inner{position:relative;z-index:2;width:min(calc(100% - 48px),1400px);padding:130px 0 80px}
.hero-name{margin:0;color:#fff;font-family:Blinker,Arial,sans-serif;font-size:clamp(34px,8vw,128px);font-weight:400;line-height:.9;letter-spacing:.01em;white-space:nowrap}
.hero-letter{display:inline-block;opacity:0;transform:translateY(1em) rotate(3deg);animation:hero-letter-in 1s var(--ease-out) forwards;animation-delay:calc(var(--index,0) * 55ms + .25s)}
.hero-copy{max-width:620px;margin:160px auto 0;color:rgba(255,255,255,.8);font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(15px,1.5vw,19px);font-weight:400;line-height:1.5}
.scroll-cue{position:absolute;z-index:3;bottom:28px;left:50%;display:grid;justify-items:center;gap:8px;color:rgba(255,255,255,.48);font-size:10px;letter-spacing:.2em;text-transform:uppercase;transform:translateX(-50%)}
.scroll-cue::after{width:1px;height:36px;background:linear-gradient(#fff,transparent);content:"";animation:scroll-cue 1.7s ease-in-out infinite}
.trail-layer{position:absolute;z-index:1;inset:0;overflow:hidden;pointer-events:none}
.trail-image{position:absolute;width:245px;height:170px;border-radius:6px;object-fit:cover;opacity:0;transform:translate(-50%,-50%) scale(.86) rotate(var(--rotation,0deg));animation:trail-fade .85s var(--ease-out) forwards;will-change:transform,opacity}
@keyframes hero-letter-in{to{opacity:1;transform:none}}
@keyframes scroll-cue{0%,100%{opacity:.25;transform:scaleY(.55);transform-origin:50% 0}50%{opacity:1;transform:scaleY(1)}}
@keyframes trail-fade{0%{opacity:0;transform:translate(-50%,-50%) scale(.82) rotate(var(--rotation,0deg))}20%{opacity:1}100%{opacity:0;transform:translate(-50%,-56%) scale(1.02) rotate(var(--rotation,0deg))}}

/* Capability marquee */
.marquee{position:relative;z-index:4;overflow:hidden;padding-block:24px;background:#fff;color:#000}
.marquee-track{display:flex;width:max-content;align-items:center;white-space:nowrap;animation:marquee 24s linear infinite;will-change:transform}
.marquee-group{display:flex;flex-shrink:0;align-items:center}
.marquee-item,.marquee-track>span{display:inline-flex;align-items:center;font-family:Blinker,Arial,sans-serif;font-size:clamp(28px,5vw,64px);font-weight:500;line-height:.9;letter-spacing:-.035em}
.marquee-item::after,.marquee-track>span::after{margin-inline:clamp(22px,4vw,64px);color:var(--accent-green);content:"✳";font-weight:300}
@keyframes marquee{to{transform:translateX(-50%)}}

/* Audience introduction */
#about{min-height:100svh;background:#000}
#about .section-shell{display:flex;align-items:flex-start;gap:clamp(56px,9vw,140px)}
.about-sidebar{width:240px;flex:0 0 240px;padding-top:8px}
.audience-tabs{display:grid;gap:13px;margin-top:44px}
.audience-tabs [data-audience]{position:relative;color:rgba(255,255,255,.4);font-size:18px;line-height:20px;text-align:left;transition:color .35s ease,transform .35s var(--ease-out)}
.audience-tabs [data-audience]::before{display:inline-block;width:16px;height:1px;margin-right:12px;background:currentColor;content:"";vertical-align:middle;transition:width .35s var(--ease-out)}
.audience-tabs [data-audience]:hover{color:rgba(255,255,255,.7)}
.audience-tabs [data-audience].is-active,.audience-tabs [data-audience].active,.audience-tabs [data-audience][aria-selected="true"]{color:#fff;transform:translateX(2px)}
.audience-tabs [data-audience].is-active::before,.audience-tabs [data-audience].active::before,.audience-tabs [data-audience][aria-selected="true"]::before{width:36px}
.notepad{position:relative;width:min(100%,840px);min-height:600px;margin-left:auto;padding:44px;overflow:hidden;border-radius:20px;background-color:#101014;background-image:radial-gradient(circle,rgba(255,255,255,.11) 1.1px,transparent 1.3px);background-position:16px 16px;background-size:26px 26px;box-shadow:0 34px 70px -34px rgba(0,0,0,.85);color:rgba(255,255,255,.35)}
.notepad::before{position:absolute;top:0;right:0;width:52px;height:52px;border-top-right-radius:20px;background:linear-gradient(225deg,#000 0 43%,rgba(255,255,255,.2) 43% 48%,#23232b 48% 100%);content:"";pointer-events:none}
#audience-copy{position:relative;margin:0;font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(30px,4vw,56px);font-weight:400;line-height:1.28;letter-spacing:-.025em;transition:opacity .3s ease,transform .3s var(--ease-out)}
#audience-copy.is-changing{opacity:0;transform:translateY(12px)}

/* Featured work carousel */
#work{min-height:100vh;background:#000}
#work .section-shell{padding-block:var(--section)}
.work-intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,760px);align-items:end;gap:32px;margin-bottom:56px}
.work-description{max-width:760px;margin:0;color:rgba(255,255,255,.64);font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(18px,2.2vw,26px);line-height:1.35}
[data-featured-stage]{position:relative;height:min(80vh,calc((100vw - 80px)*.6667));min-height:520px;overflow:hidden;background:#050505;isolation:isolate}
[data-featured-stage]::after{position:absolute;z-index:1;right:11%;bottom:18%;left:11%;height:44%;border-radius:0 0 12px 12px;background:linear-gradient(transparent,rgba(0,0,0,.9));content:"";pointer-events:none}
[data-featured-image]{width:100%;height:100%;object-fit:cover;transition:opacity .5s var(--ease-out),transform .7s var(--ease-out)}
[data-featured-stage].is-changing [data-featured-image]{opacity:0;transform:scale(1.025)}
.featured-mockup{position:absolute;inset:5% 11% 18%;overflow:hidden;border:1px solid rgba(255,255,255,.08);border-radius:12px;background:radial-gradient(circle at 50% 38%,rgba(255,255,255,.11),transparent 36%),linear-gradient(145deg,#1c1d20,#08090a 76%);box-shadow:0 28px 90px rgba(0,0,0,.38);transition:opacity .45s var(--ease-out),transform .7s var(--ease-out)}
[data-featured-stage].is-changing .featured-mockup{opacity:0;transform:scale(1.018)}
.featured-mockup.is-entering{animation:featuredStageIn 2.35s var(--ease-out) both}
.featured-mockup.is-entering .featured-mockup__device--primary{animation:featuredPrimaryIn 2.4s var(--ease-out) both}
.featured-mockup.is-entering .featured-mockup__device--secondary{animation:featuredSideIn 1.7s .35s var(--ease-out) both}
.featured-mockup.is-entering .featured-mockup__device--tertiary{animation:featuredSideIn 1.7s .52s var(--ease-out) both}
@keyframes featuredStageIn{0%{filter:brightness(.72)}100%{filter:brightness(1)}}
@keyframes featuredPrimaryIn{0%{opacity:.9;scale:1.16;translate:0 8%}45%{opacity:1}100%{opacity:1;scale:1;translate:0 0}}
@keyframes featuredSideIn{0%{opacity:0;scale:.94;translate:0 10%}100%{opacity:1;scale:1;translate:0 0}}
.featured-mockup__halo{position:absolute;inset:10% 16% 22%;border-radius:50%;background:rgba(245,112,41,.18);filter:blur(90px);transition:background .5s ease}
.featured-mockup__device{position:absolute;margin:0;overflow:hidden;border:1px solid rgba(255,255,255,.18);border-radius:12px;background:#101114;box-shadow:0 34px 90px rgba(0,0,0,.5);transition:inset .65s var(--ease-out),width .65s var(--ease-out),height .65s var(--ease-out),transform .65s var(--ease-out),border-radius .65s var(--ease-out)}
.featured-mockup__device--primary{z-index:3;top:10%;left:13%;width:74%;height:62%;transform:perspective(1400px) rotateX(2deg)}
.featured-mockup__device--secondary{z-index:2;top:26%;left:3%;width:38%;height:43%;transform:perspective(1200px) rotateY(8deg) rotate(-2deg)}
.featured-mockup__device--tertiary{z-index:4;top:28%;right:3%;width:34%;height:42%;transform:perspective(1200px) rotateY(-8deg) rotate(2deg)}
.featured-mockup__chrome{display:flex;height:28px;align-items:center;gap:5px;padding:0 10px;border-bottom:1px solid rgba(255,255,255,.1);background:#18191c}
.featured-mockup__chrome i{width:5px;height:5px;border-radius:50%;background:rgba(255,255,255,.28)}
.featured-mockup__chrome b{margin-left:8px;color:rgba(255,255,255,.42);font:500 8px/1 Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase}
.featured-mockup__device img{display:block;width:100%;height:calc(100% - 28px);object-fit:cover;object-position:top}
.featured-strategy-board{position:absolute;z-index:4;inset:12% 12% 25%;display:none;padding:clamp(28px,4vw,64px);overflow:hidden;border:1px solid rgba(38,28,22,.16);border-radius:16px;background:#fff8ec;color:#25231f;box-shadow:0 34px 100px rgba(80,28,12,.28);transform:rotate(-1.5deg)}
.featured-strategy-board::before{position:absolute;right:-8%;bottom:-35%;width:45%;aspect-ratio:1;border-radius:50%;background:#ff775f;content:""}
.featured-strategy-board span{display:block;color:#b64d38;font-size:10px;font-weight:600;letter-spacing:.18em}
.featured-strategy-board strong{display:block;max-width:11ch;margin-top:clamp(24px,4vw,54px);font-family:Blinker,Arial,sans-serif;font-size:clamp(30px,5vw,76px);font-weight:500;line-height:.94;letter-spacing:-.04em}
.featured-strategy-board>div{position:absolute;right:9%;top:18%;display:grid;width:30%;gap:12px}.featured-strategy-board>div i{height:34px;border-radius:6px;background:#f5bd25}.featured-strategy-board>div i:nth-child(2){width:78%;background:#ff775f}.featured-strategy-board>div i:nth-child(3){width:52%;background:#25231f}
.featured-mockup.is-ourjourneyman{background:radial-gradient(circle at 48% 32%,rgba(219,176,125,.32),transparent 36%),linear-gradient(145deg,#382c24,#0c0b0a 76%)}
.featured-mockup.is-ourjourneyman .featured-mockup__halo{background:rgba(204,135,79,.25)}
.featured-mockup.is-ourjourneyman .featured-mockup__device,.featured-mockup.is-snapbudget .featured-mockup__device{width:auto;height:72%;aspect-ratio:440/956;border:0;border-radius:14px;background:#fff;box-shadow:0 28px 70px rgba(0,0,0,.32)}
.featured-mockup.is-ourjourneyman .featured-mockup__device--primary,.featured-mockup.is-snapbudget .featured-mockup__device--primary{top:5%;left:50%;transform:translateX(-50%)}
.featured-mockup.is-ourjourneyman .featured-mockup__device--secondary,.featured-mockup.is-snapbudget .featured-mockup__device--secondary{z-index:2;top:13%;left:16%;transform:rotate(-5deg)}
.featured-mockup.is-ourjourneyman .featured-mockup__device--tertiary,.featured-mockup.is-snapbudget .featured-mockup__device--tertiary{z-index:2;top:13%;right:16%;transform:rotate(5deg)}
.featured-mockup.is-ourjourneyman .featured-mockup__chrome,.featured-mockup.is-snapbudget .featured-mockup__chrome{display:none}
.featured-mockup.is-ourjourneyman .featured-mockup__device img,.featured-mockup.is-snapbudget .featured-mockup__device img{height:100%;object-fit:cover;object-position:top}
.featured-mockup.is-snapbudget{background:radial-gradient(circle at 50% 30%,rgba(136,102,216,.38),transparent 34%),linear-gradient(145deg,#d8f1e3,#91bda7 78%)}
.featured-mockup.is-snapbudget .featured-mockup__halo{background:rgba(96,62,190,.32)}
.featured-mockup.is-hiyogurt{background:linear-gradient(145deg,#f5bd25,#ff775f 58%,#a53b36)}
.featured-mockup.is-hiyogurt .featured-mockup__device,.featured-mockup.is-hiyogurt .featured-mockup__halo{display:none}.featured-mockup.is-hiyogurt .featured-strategy-board{display:block}
.featured-overlay{position:absolute;z-index:2;right:calc(11% + clamp(22px,4vw,56px));bottom:calc(18% + clamp(24px,3vw,42px));left:calc(11% + clamp(22px,4vw,56px));display:flex;align-items:flex-end;justify-content:space-between;gap:24px}
.featured-link{position:absolute;z-index:3;inset:5% 11% 18%}.work-carousel{position:relative}.featured-controls{position:absolute;z-index:4;top:calc(40% - 24px);right:3%;left:3%;display:flex;justify-content:space-between;pointer-events:none}
[data-featured-title]{margin:0;font-family:Blinker,Arial,sans-serif;font-size:clamp(26px,3.2vw,44px);font-weight:500;line-height:1.1;letter-spacing:-.02em;transition:opacity .5s var(--ease-out),transform .5s var(--ease-out)}
[data-featured-description]{max-width:560px;margin:14px 0 0;color:rgba(255,255,255,.62);font-size:15px;line-height:1.5;transition:opacity .5s var(--ease-out)}
[data-featured-count]{display:block;margin-bottom:10px;color:rgba(255,255,255,.48);font-size:12px;letter-spacing:.2em}
.featured-controls{gap:10px}
[data-featured-prev],[data-featured-next]{display:grid;width:48px;height:48px;place-items:center;border:1px solid rgba(255,255,255,.15);border-radius:50%;background:rgba(0,0,0,.18);transition:background .25s ease,border-color .25s ease,transform .25s var(--ease-out)}
[data-featured-prev],[data-featured-next]{pointer-events:auto}
[data-featured-prev]:hover,[data-featured-next]:hover{border-color:rgba(255,255,255,.5);background:rgba(255,255,255,.12);transform:scale(1.05)}
.featured-tabs{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin-top:20px}
[data-featured-tab]{padding:14px 0;border-top:1px solid rgba(255,255,255,.15);color:rgba(255,255,255,.4);font-size:13px;text-align:left;transition:border-color .3s ease,color .3s ease}
[data-featured-tab].is-active,[data-featured-tab].active,[data-featured-tab][aria-selected="true"]{border-color:#fff;color:#fff}

/* Horizontal playground */
#playground{min-height:100vh;overflow:hidden;background:#0a0a0a}
.playground-track{display:flex;width:max-content;min-width:100%;height:100vh;align-items:center;gap:5vw;padding-right:6vw;will-change:transform}
.playground-intro{width:46vw;flex:0 0 46vw;padding-left:max(40px,calc((100vw - var(--container-page))/2));padding-right:4vw}
.playground-intro .section-description{max-width:420px;margin:24px 0 0;color:rgba(255,255,255,.7);font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(18px,2.2vw,26px);line-height:1.375;letter-spacing:-.025em}
.playground-card{width:42vw;flex:0 0 42vw}
.playground-media{position:relative;aspect-ratio:4/3;overflow:hidden;border-radius:20px;background:#171717}
.playground-media::after,.performance-media::after{position:absolute;right:0;bottom:0;left:0;height:40%;background:linear-gradient(transparent,rgba(0,0,0,.65));content:"";pointer-events:none}
.playground-media img{width:100%;height:100%;object-fit:cover;transform:scale(1.1);transition:transform .8s var(--ease-out)}
.playground-card:hover .playground-media img{transform:scale(1.04)}
.playground-card h3{margin:20px 0 8px;font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(28px,3.4vw,44px);font-weight:400;line-height:1;letter-spacing:-.03em}
.playground-card p{max-width:560px;margin:0;color:rgba(255,255,255,.6);font-size:16px;line-height:1.55}
.tags{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 0;padding:0;list-style:none}
.tag,.tags span{padding:6px 10px;border:1px solid rgba(255,255,255,.15);border-radius:999px;color:rgba(255,255,255,.62);font-size:12px;line-height:1}

/* Web design links */
#web{background:#000}
#web .section-shell{padding-block:var(--section)}
#web .section-heading{margin-bottom:56px}
#web .section-description{max-width:620px;margin:-32px 0 56px;color:rgba(255,255,255,.7);font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(18px,2.2vw,26px);line-height:1.375;letter-spacing:-.025em}
.web-list{border-bottom:1px solid rgba(255,255,255,.1)}
.web-row{position:relative;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:20px 0;border-top:1px solid rgba(255,255,255,.1);cursor:pointer}
.web-row-title,.web-row h3{margin:0;color:rgba(255,255,255,.16);font-family:Blinker,Arial,sans-serif;font-size:clamp(30px,5.5vw,84px);font-weight:500;line-height:.95;letter-spacing:-.045em;-webkit-text-stroke:1px rgba(255,255,255,.55);transition:color .3s ease,transform .3s var(--ease-out),-webkit-text-stroke-color .3s ease}
.web-row-meta{flex:0 0 auto;color:rgba(255,255,255,.38);font-size:12px;letter-spacing:.16em;text-transform:uppercase;transition:color .3s ease}
.web-row:hover .web-row-title,.web-row:hover h3{color:#fff;-webkit-text-stroke-color:#fff;transform:translateX(12px)}
.web-row:hover .web-row-meta{color:#fff}
#web-preview,[data-preview].web-preview{position:fixed;z-index:80;top:0;left:0;width:420px;height:300px;overflow:hidden;border-radius:14px;background:#171717;box-shadow:0 24px 80px rgba(0,0,0,.55);opacity:0;visibility:hidden;pointer-events:none;transform:translate3d(var(--preview-x,0),var(--preview-y,0),0) scale(.96);transition:opacity .3s ease,transform .12s linear,visibility 0s .3s}
#web-preview img,[data-preview].web-preview img{width:100%;height:100%;object-fit:cover}
#web-preview.is-visible,[data-preview].web-preview.is-visible{opacity:1;visibility:visible;transition-delay:0s}

/* iDE web-design feature */
.featured-mockup.is-ide{background:linear-gradient(145deg,#363636,#8b8b8b 54%,#e9e9e9)}
.featured-mockup.is-ide .featured-mockup__halo{top:10%;left:19%;width:62%;height:68%;border-radius:50%;background:rgba(255,255,255,.18);filter:blur(48px)}
.featured-mockup.is-ide .featured-mockup__device--primary{z-index:3;top:2%;left:50%;width:min(78%,760px);height:88%;border:0;border-radius:0;background:transparent;box-shadow:none;transform:translateX(-50%)}
.featured-mockup.is-ide .featured-mockup__device--secondary,.featured-mockup.is-ide .featured-mockup__device--tertiary{display:none}
.featured-mockup.is-ide .featured-mockup__chrome{display:none}
.featured-mockup.is-ide .featured-mockup__device img{width:100%;height:100%;object-fit:contain;object-position:center}

/* Homepage projects directory */
.projects-directory{overflow:hidden;background:#000}
.projects-directory>.section-shell{padding-block:clamp(104px,12vw,176px)}
.projects-directory__intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,620px);align-items:end;gap:64px;margin-bottom:64px}
.projects-directory__intro .section-description{margin:0;color:rgba(255,255,255,.62);font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(18px,2vw,25px);line-height:1.45}
.projects-list .web-row{min-height:clamp(104px,10vw,152px)}
.projects-list .web-row-title{font-size:clamp(44px,7vw,104px)}
.web-row-thumb{display:none;width:92px;height:64px;flex:0 0 92px;border-radius:8px;object-fit:cover}

/* Web-design case page and category galleries */
.web-case-page,.projects-gallery-page{background:#0a0a0a}
.web-case-main,.projects-gallery-main{padding-top:116px}
.web-case-shell,.projects-gallery-shell{width:min(calc(100% - 48px),1274px);margin-inline:auto}
.web-case-hero{padding:clamp(72px,10vw,144px) 0 clamp(64px,8vw,116px)}
.web-case-back,.projects-gallery-back{display:inline-flex;align-items:center;gap:10px;color:rgba(255,255,255,.55);font-size:13px;letter-spacing:.13em;text-transform:uppercase;transition:color .25s ease,transform .3s var(--ease-out)}
.web-case-back:hover,.projects-gallery-back:hover{color:#fff;transform:translateX(-5px)}
.web-case-title,.projects-gallery-title{max-width:12ch;margin:clamp(64px,9vw,120px) 0 26px;font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(70px,13vw,190px);font-weight:300;line-height:.78;letter-spacing:-.065em}
.web-case-eyebrow{margin:0 0 18px;color:rgba(255,255,255,.5);font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase}
.web-case-lede{max-width:760px;margin:0;color:rgba(255,255,255,.68);font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(22px,3vw,39px);line-height:1.25;letter-spacing:-.025em}
.web-case-live{position:relative;display:inline-flex;align-items:center;gap:10px;margin-top:42px;padding-bottom:7px;font-size:13px;letter-spacing:.15em;text-transform:uppercase}
.web-case-live::after{position:absolute;right:0;bottom:0;left:0;height:1px;background:#fff;content:"";transform-origin:0 50%;transition:transform .35s var(--ease-out)}
.web-case-live:hover::after{transform:scaleX(.35);transform-origin:100% 50%}
.web-case-hero--centered .web-case-back{display:flex;width:max-content}
.web-case-hero__center{display:flex;align-items:center;flex-direction:column;text-align:center}
.web-case-hero--centered .web-case-title{max-width:none;margin-top:clamp(80px,10vw,136px)}
.web-case-hero--centered .web-case-lede{max-width:820px}
.web-case-live--button{margin-top:40px;padding:16px 24px;border:1px solid rgba(255,255,255,.55);border-radius:999px;transition:background .3s ease,color .3s ease,transform .3s var(--ease-out)}
.web-case-live--button::after{display:none}.web-case-live--button:hover{background:#fff;color:#0a0a0a;transform:translateY(-3px)}
.web-case-proof{display:grid;margin-top:clamp(64px,8vw,108px);border-top:1px solid rgba(255,255,255,.16);border-bottom:1px solid rgba(255,255,255,.16);grid-template-columns:repeat(4,minmax(0,1fr))}
.web-case-proof div{min-width:0;padding:24px}.web-case-proof div+div{border-left:1px solid rgba(255,255,255,.16)}
.web-case-proof dt{margin:0 0 12px;color:rgba(255,255,255,.38);font-size:9px;letter-spacing:.16em;text-transform:uppercase}
.web-case-proof dd{margin:0;color:rgba(255,255,255,.82);font-size:13px;line-height:1.55}
.web-case-story{padding:clamp(88px,11vw,156px) 0;background:#efede7;color:#111}
.web-case-story--raised{background:#101113;color:#f5f5f1}
.web-case-story__grid{display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);gap:clamp(56px,9vw,142px)}
.web-case-story__label{margin:0 0 20px;color:rgba(0,0,0,.44);font-size:10px;font-weight:600;letter-spacing:.18em;text-transform:uppercase}
.web-case-story--raised .web-case-story__label{color:rgba(255,255,255,.42)}
.web-case-story h2{max-width:11ch;margin:0;font-family:Blinker,Arial,sans-serif;font-size:clamp(42px,6vw,82px);font-weight:500;line-height:.96;letter-spacing:-.04em}
.web-case-story__grid>div:last-child>p{max-width:54ch;margin:0;color:rgba(0,0,0,.64);font-size:17px;line-height:1.7}
.web-case-story__grid>div:last-child>p+p{margin-top:24px}
.web-case-story--raised .web-case-story__grid>div:last-child>p{color:rgba(255,255,255,.66)}
.web-case-decisions{display:grid;margin-top:46px;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.web-case-decisions article{padding:24px;border:1px solid rgba(255,255,255,.14);border-radius:12px;background:rgba(255,255,255,.025)}
.web-case-decisions small{color:rgba(255,255,255,.38);font-size:9px;letter-spacing:.16em}
.web-case-decisions h3{margin:34px 0 12px;font-family:Blinker,Arial,sans-serif;font-size:22px;font-weight:500;line-height:1.08}
.web-case-decisions p{margin:0;color:rgba(255,255,255,.58);font-size:13px;line-height:1.58}
.web-case-story__result{margin-top:40px!important;padding:24px 0 0;border-top:1px solid rgba(0,0,0,.16);font-weight:600}
.web-case-media{display:grid;gap:clamp(32px,5vw,72px);padding-bottom:clamp(96px,12vw,180px)}
.web-result{position:relative;margin:0;overflow:hidden;border-radius:clamp(16px,2vw,30px);background:#141615;box-shadow:0 30px 100px rgba(0,0,0,.34)}
.web-result img{width:100%;height:100%;object-fit:cover;object-position:top;transform:scale(1.025);transition:transform 1.1s var(--ease-out)}
.web-result.is-visible img{transform:scale(1)}
.web-result--wide{aspect-ratio:16/10}.web-result--full{aspect-ratio:4/3}.web-result--mobile{display:grid;min-height:720px;place-items:center;padding:7vw;background:linear-gradient(135deg,#dff6ca,#5e9354)}
.web-result--crop-mid img,.web-result--crop-lower img{height:100%;object-fit:cover}.web-result--crop-mid img{object-position:center 42%}.web-result--crop-lower img{object-position:center 78%}
.web-result--mobile img{width:min(330px,42vw);height:auto;max-height:680px;border:8px solid #1a1d19;border-radius:32px;box-shadow:0 30px 60px rgba(24,54,22,.3)}
.web-result--showcase{aspect-ratio:auto;background:#e8e8e8}.web-result--showcase img{display:block;width:100%;height:auto;object-fit:contain;transform:none}.web-result--showcase.is-visible img{transform:none}
.web-result figcaption{position:absolute;z-index:2;right:24px;bottom:20px;left:24px;display:flex;justify-content:space-between;gap:24px;color:rgba(255,255,255,.74);font-size:11px;letter-spacing:.14em;text-transform:uppercase;text-shadow:0 1px 12px #000}
.web-case-return{display:flex;justify-content:space-between;padding:28px 0 96px;border-top:1px solid rgba(255,255,255,.12)}

.projects-gallery-hero{padding:clamp(72px,10vw,140px) 0 clamp(56px,7vw,96px)}
.projects-gallery-kicker{margin:20px 0 0;color:rgba(255,255,255,.45);font-size:12px;letter-spacing:.2em;text-transform:uppercase}
.projects-gallery-title{max-width:none;margin-top:54px;font-size:clamp(66px,12vw,168px)}
.projects-gallery-description{max-width:700px;margin:28px 0 0;color:rgba(255,255,255,.62);font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(20px,2.4vw,31px);line-height:1.4}
.projects-gallery-grid{display:grid;padding-bottom:clamp(110px,14vw,190px);grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(40px,6vw,84px) 28px}
.gallery-work{grid-column:span 6;margin:0;color:inherit}
.gallery-work--link{display:block;text-decoration:none}
.gallery-work--wide{grid-column:1/-1}.gallery-work--narrow{grid-column:span 4}
.gallery-work__media{position:relative;overflow:hidden;aspect-ratio:4/3;border-radius:14px;background:#151515}
.gallery-work--portrait .gallery-work__media{aspect-ratio:4/5}.gallery-work--wide .gallery-work__media{aspect-ratio:16/9}
.gallery-work__media img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease-out)}
.gallery-work:hover .gallery-work__media img{transform:scale(1.025)}
.gallery-work figcaption{display:flex;align-items:baseline;justify-content:space-between;gap:24px;margin-top:16px}
.gallery-work h2{margin:0;font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(23px,2.6vw,38px);font-weight:400}
.gallery-work p{margin:0;color:rgba(255,255,255,.42);font-size:11px;letter-spacing:.12em;text-align:right;text-transform:uppercase}
.gallery-work figcaption span{color:rgba(255,255,255,.54);font-size:11px;letter-spacing:.12em;text-transform:uppercase;transition:color .25s ease,transform .3s var(--ease-out)}
.gallery-work--link:hover figcaption span{color:#fff;transform:translateX(4px)}
.projects-gallery-nav{display:flex;justify-content:space-between;gap:24px;padding:30px 0 100px;border-top:1px solid rgba(255,255,255,.12)}
.projects-gallery-nav a{color:rgba(255,255,255,.58);font-size:13px;letter-spacing:.12em;text-transform:uppercase;transition:color .25s ease,transform .3s var(--ease-out)}
.projects-gallery-nav a:hover{color:#fff}.projects-gallery-nav a:first-child:hover{transform:translateX(-5px)}.projects-gallery-nav a:last-child:hover{transform:translateX(5px)}

@media(max-width:900px){
  .featured-tabs{grid-template-columns:repeat(2,1fr)}
  .projects-directory__intro{grid-template-columns:1fr;gap:28px}
  .projects-list .web-row{display:grid;grid-template-columns:minmax(0,1fr) auto;min-height:106px;gap:8px 16px}
  .projects-list .web-row-title{font-size:clamp(36px,10vw,62px)}
  .projects-list .web-row-meta{grid-column:1}.web-row-thumb{display:block;grid-row:1/3;grid-column:2}
  #web-preview{display:none}
  .web-case-shell,.projects-gallery-shell{width:min(calc(100% - 36px),1274px)}
  .web-case-main,.projects-gallery-main{padding-top:92px}.web-case-title{margin-top:72px}
  .web-case-proof{grid-template-columns:1fr 1fr}.web-case-proof div:nth-child(3){border-left:0;border-top:1px solid rgba(255,255,255,.16)}.web-case-proof div:nth-child(4){border-top:1px solid rgba(255,255,255,.16)}
  .web-case-story__grid{grid-template-columns:1fr;gap:42px}.web-case-decisions{grid-template-columns:1fr}
  .web-result--mobile{min-height:600px}.web-result--mobile img{width:min(300px,74vw)}
  .gallery-work,.gallery-work--narrow,.gallery-work--wide{grid-column:1/-1}
}
@media(max-width:560px){
  .featured-tabs{grid-template-columns:1fr}.featured-mockup.is-ide .featured-mockup__device--primary{top:5%;width:92%;height:80%}
  .web-result--wide,.web-result--full{aspect-ratio:4/3}.web-result figcaption{right:14px;bottom:12px;left:14px;align-items:flex-start;flex-direction:column;gap:4px}
  .web-case-proof{grid-template-columns:1fr}.web-case-proof div,.web-case-proof div+div{border-left:0;border-top:1px solid rgba(255,255,255,.16)}.web-case-proof div:first-child{border-top:0}
  .gallery-work figcaption{align-items:flex-start;flex-direction:column;gap:7px}.gallery-work p{text-align:left}
}

/* Performance stage */
#performance{min-height:100vh;background:#000}
#performance .section-shell{padding-block:var(--section)}
#performance .section-heading{font-size:clamp(34px,6.5vw,72px);text-align:center}
.performance-stage{position:relative;height:54vh;min-height:430px;margin-top:64px;overflow:hidden;cursor:grab;touch-action:pan-y;user-select:none}
.performance-stage:active,.performance-stage.is-dragging{cursor:grabbing}
.performance-card{position:absolute;top:50%;left:50%;width:min(40vw,500px);transform:translate3d(calc(-50% + var(--card-x,0px)),-50%,0) rotate(var(--card-rotate,0deg));transition:transform .55s var(--ease-out),opacity .35s ease;will-change:transform}
.performance-stage.is-dragging .performance-card{transition:none}
.performance-media{position:relative;aspect-ratio:4/3;overflow:hidden;border-radius:14px;background:#171717}
.performance-media img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease-out)}
.performance-media>p{position:absolute;z-index:2;right:20px;bottom:16px;left:20px;margin:0;color:rgba(255,255,255,.85);font-size:12px;line-height:1.45;letter-spacing:.18em;text-transform:uppercase}
.performance-card:hover .performance-media img{transform:scale(1.05)}
.performance-card__title{display:flex;align-items:baseline;justify-content:space-between;gap:16px}.performance-card__title>span{color:rgba(255,255,255,.4);font-size:14px}
.performance__intro{text-align:center}.performance__intro .section-description{max-width:620px;margin:24px auto 0;color:rgba(255,255,255,.7);font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(18px,2.2vw,26px);line-height:1.375}.text-link{display:inline-flex;margin-top:32px;padding:16px 32px;border:1px solid rgba(255,255,255,.35);gap:12px;font-size:14px;letter-spacing:.18em;text-transform:uppercase;transition:transform .3s var(--ease-out)}.text-link:hover{transform:scale(1.1)}
.performance-card h3{margin:16px 0 0;font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(24px,3vw,38px);font-weight:400;line-height:1.1}
.performance-card p{margin:8px 0 0;color:rgba(255,255,255,.55);font-size:14px}

/* Contact */
#contact{position:relative;display:flex;min-height:100svh;flex-direction:column;justify-content:space-between;overflow:hidden;padding:clamp(100px,14vh,180px) max(24px,calc((100vw - var(--container-page))/2)) 32px;background:radial-gradient(circle at var(--spotlight-x,50%) var(--spotlight-y,45%),rgba(255,255,255,.09),transparent 24%),linear-gradient(145deg,#07090d,#0a0c11)}
.contact__inner{width:100%}.contact-cta{position:relative;z-index:1;margin:0;color:#fff;font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(52px,13vw,180px);font-weight:500;line-height:.95;letter-spacing:-.04em;text-align:center}.contact-cta>span{display:block}
.contact-cta .line{display:block}
.contact-cta a{display:inline-block;transition:color .3s ease,transform .3s var(--ease-out)}
.contact-cta a:hover{color:var(--accent-green);transform:translateX(.025em)}
.footer-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px;width:min(100%,var(--container-page));margin:100px auto 0;padding-top:24px;border-top:1px solid rgba(255,255,255,.12)}
.footer-column{display:grid;align-content:start;gap:10px}
.footer-label{margin-bottom:6px;color:rgba(255,255,255,.4);font-size:12px;letter-spacing:.25em;text-transform:uppercase}
.footer-grid a{width:max-content;color:rgba(255,255,255,.68);transition:color .3s ease,transform .3s var(--ease-out)}
.footer-grid a:hover{color:#fff;transform:scale(1.1)}
.footer-grid ul{display:grid;gap:12px;margin:0;padding:0;list-style:none}.footer-grid p{margin-top:0}
.footer-meta{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:28px;padding-top:24px;border-top:1px solid rgba(255,255,255,.12);color:rgba(255,255,255,.35);font-size:12px;line-height:1.6}.footer-meta p{margin:0}.status-dot{display:inline-block;width:10px;height:10px;margin-right:10px;border-radius:50%;background:var(--accent-green);vertical-align:middle;animation:status-pulse 1.8s ease-in-out infinite}

/* Page progress and fine-pointer cursor */
.scroll-progress{position:fixed;z-index:110;top:0;left:0;width:100%;height:2px;background:#fff;transform:scaleX(var(--scroll-progress,0));transform-origin:0 50%;pointer-events:none}
.custom-cursor{position:fixed;z-index:2000;top:0;left:0;display:grid;width:12px;height:12px;place-content:center;border:1px solid rgba(255,255,255,.8);border-radius:50%;mix-blend-mode:difference;opacity:0;overflow:hidden;pointer-events:none;text-align:center;text-transform:uppercase;transform:translate3d(calc(var(--cursor-x,0px) - 50%),calc(var(--cursor-y,0px) - 50%),0);transition:width .25s var(--ease-out),height .25s var(--ease-out),background .25s ease,opacity .2s ease}
.custom-cursor.is-visible{opacity:1}.custom-cursor.is-hovering{width:56px;height:56px;background:#fff}
.custom-cursor span{font-size:8px;line-height:1.05;letter-spacing:.06em;opacity:0;transition:opacity .2s ease}.custom-cursor.is-hovering span{opacity:1}
.skip-link{position:fixed;z-index:2000;top:8px;left:8px;padding:10px 14px;background:#fff;color:#000;transform:translateY(-150%);transition:transform .2s ease}.skip-link:focus{transform:none}.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
@keyframes status-pulse{50%{opacity:.35;transform:scale(.75)}}

@media(min-width:768px){
  :root{--section:128px}
  .section-shell{width:min(calc(100% - 80px),var(--container-page))}
  .notepad{min-height:700px}
}

@media(max-width:900px){
  .nav-links,.nav-socials,.nav-more{display:none!important}.mobile-menu-toggle{display:grid}
  .site-header{width:calc(100% - 24px);top:12px}.nav-shell{min-height:62px;padding-block:8px}
  .mobile-menu{max-height:calc(100svh - 96px);overflow-y:auto;overscroll-behavior:contain}
  .hero-inner{padding-top:112px}.hero-copy{margin-top:clamp(90px,18vh,160px)}
  #about .section-shell{display:block}.about-sidebar{width:auto}.audience-tabs{display:flex;gap:20px;margin:30px 0;overflow-x:auto;padding-bottom:6px;scrollbar-width:none}.audience-tabs::-webkit-scrollbar{display:none}.audience-tabs [data-audience]{flex:0 0 auto}.notepad{width:100%;min-height:600px;margin-top:40px;padding:32px}
  .work-intro{grid-template-columns:1fr}.work-description{max-width:640px}
  [data-featured-stage]{height:auto;min-height:0;aspect-ratio:3/2}
  #playground{overflow:visible}.playground-track{display:block;width:auto;height:auto;padding:var(--section) 24px}.playground-intro,.playground-card{width:100%;padding:0}.playground-intro{margin-bottom:64px}.playground-card+.playground-card{margin-top:56px}
  .performance-stage{display:grid;height:auto;min-height:0;gap:48px;overflow:visible;cursor:auto;user-select:auto}.performance-card{position:relative;top:auto;left:auto;width:100%;max-width:600px;margin-inline:auto;transform:none!important}
  .footer-grid{grid-template-columns:1fr 1fr}
}

@media(max-width:600px){
  .section-shell{width:calc(100% - 48px)}
  .nav-brand span{max-width:145px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .hero-name{letter-spacing:-.04em}.hero-copy{max-width:34ch;line-height:1.45}.scroll-cue{bottom:18px}
  .trail-image{width:184px;height:128px}
  .notepad{min-height:600px;padding:30px 24px 32px 54px}
  #audience-copy{font-size:30px}
  .work-intro{margin-bottom:34px}[data-featured-stage]{aspect-ratio:4/5}.featured-overlay{display:block}.featured-controls{margin-top:20px}[data-featured-description]{display:none}.featured-tabs{grid-template-columns:1fr 1fr;gap:0 12px}
  #web .section-heading{margin-bottom:36px}.web-row{padding-block:20px}.web-row-meta{display:none}
  #web-preview,[data-preview].web-preview{display:none!important}
  .performance-stage{margin-top:42px}.performance-card h3{font-size:28px}
  #contact{padding-top:120px}.footer-grid{grid-template-columns:1fr 1fr;gap:34px 20px;margin-top:80px}.footer-column:first-child{grid-column:1/-1}.footer-meta{display:grid;justify-items:start}
}

@media(hover:hover) and (pointer:fine){body.cursor-enabled,body.cursor-enabled a,body.cursor-enabled button{cursor:none}}

@media(prefers-reduced-motion:reduce){
  .preloader{display:none}.hero-letter{opacity:1;transform:none;animation:none}.scroll-cue::after,.marquee-track,.trail-image{animation:none}.marquee-track{transform:none}.trail-image{display:none}.reveal{opacity:1;transform:none}.playground-track,.performance-card{transform:none}.custom-cursor{display:none}
}

/* Lucy Xin Liu portfolio content layer */
.lang-toggle{color:rgba(255,255,255,.55);font-size:12px;letter-spacing:.08em;transition:color .2s ease}.lang-toggle:hover{color:#fff}.mobile-lang-toggle{padding:13px 16px!important;text-align:left}
.hero--lucy{text-align:left}.hero--lucy .hero-inner{width:min(calc(100% - 80px),1400px)}.hero-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);align-items:center;gap:clamp(48px,8vw,120px)}
.hero-content{position:relative;z-index:2}.hero-eyebrow{margin:0 0 26px;color:#b8ff70;font-size:11px;letter-spacing:.22em;line-height:1.5}.hero--lucy .hero-name{font-family:Blinker,Arial,sans-serif;font-size:clamp(34px,8vw,128px);font-weight:400;line-height:.9;white-space:normal;letter-spacing:.01em}.hero--lucy .hero-copy{max-width:760px;margin:52px 0 0;font-size:clamp(19px,2.2vw,31px);line-height:1.32}.hero-education{margin:18px 0 0;color:rgba(255,255,255,.48);font-size:13px;letter-spacing:.04em}.hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 26px;margin-top:34px}.hero-actions a{font-size:13px;letter-spacing:.08em}.hero-actions .primary-action{padding:14px 20px;border-radius:999px;background:#fff;color:#0f0e0e;font-weight:600}.hero-portrait{position:relative;z-index:2;margin:0;aspect-ratio:3/4;overflow:hidden;border-radius:180px 180px 24px 24px;background:#202020}.hero-portrait::after{position:absolute;inset:0;border:1px solid rgba(255,255,255,.14);border-radius:inherit;content:""}.hero-portrait img{width:100%;height:100%;object-fit:cover;object-position:50% 48%}
.proof-section{min-height:auto!important}.proof-grid{display:grid!important;grid-template-columns:minmax(0,1.1fr) minmax(360px,.9fr);align-items:start!important}.proof-copy{max-width:760px}.proof-copy .section-heading{font-size:clamp(44px,7vw,96px)}.proof-lead{max-width:720px;margin:40px 0 0;color:rgba(255,255,255,.68);font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(21px,2.4vw,32px);line-height:1.35}.proof-stats{display:grid;border-top:1px solid rgba(255,255,255,.16)}.proof-stats article{display:grid;grid-template-columns:110px 1fr;gap:4px 18px;padding:24px 0;border-bottom:1px solid rgba(255,255,255,.16)}.proof-stats strong{grid-row:1/3;color:#b8ff70;font-family:Blinker,Arial,sans-serif;font-size:52px;font-weight:400;line-height:1}.proof-stats span{font-size:18px}.proof-stats small{color:rgba(255,255,255,.45);line-height:1.45}
.project-notes{display:flex;align-items:center;gap:18px;margin-top:20px;color:rgba(255,255,255,.5);font-size:12px}.project-notes span+span::before{margin-right:18px;content:"·"}.project-notes button{margin-left:auto;padding:11px 18px;border:1px solid rgba(255,255,255,.24);border-radius:999px}.art-placeholder{display:grid;place-items:center;background:radial-gradient(circle at 68% 32%,#f2c7d9,transparent 30%),radial-gradient(circle at 32% 72%,#8c79d8,transparent 36%),#18131c}.art-placeholder span{font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(34px,5vw,72px);line-height:.9;text-align:center}
.visual-worlds{padding-bottom:var(--section)}.visual-collage{display:grid;grid-template-columns:1.65fr .75fr;grid-template-rows:1fr 1fr;gap:18px;padding-top:22px!important}.visual-collage figure{min-height:260px;margin:0;overflow:hidden;border-radius:18px;background:#151515}.visual-collage .visual-main{grid-row:1/3;min-height:640px}.visual-collage img{width:100%;height:100%;object-fit:cover}.visual-collage figure:nth-child(2) img{object-fit:contain;background:#eee}.visual-collage figure:nth-child(3) img{object-position:center 15%}
.story{background:#f0ede6;color:#171717}.story .eyebrow{color:rgba(0,0,0,.48)}.story-intro{display:grid;grid-template-columns:1fr minmax(300px,560px);gap:50px;align-items:end}.story-intro .eyebrow{grid-column:1/-1}.story-intro>p:last-child{margin:0;font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(19px,2.2vw,28px);line-height:1.4}.journey-grid{display:grid;grid-template-columns:repeat(2,1fr);margin-top:100px;border-top:1px solid rgba(0,0,0,.18)}.journey-grid article{padding:34px 40px 44px 0;border-bottom:1px solid rgba(0,0,0,.18)}.journey-grid article:nth-child(even){padding-left:40px;border-left:1px solid rgba(0,0,0,.18)}.journey-grid span{color:#8458db;font-size:13px}.journey-grid h3{margin:42px 0 14px;font-family:Blinker,Arial,sans-serif;font-size:clamp(28px,3vw,46px);font-weight:500;line-height:1}.journey-grid p{max-width:52ch;margin:0;color:rgba(0,0,0,.65);font-size:15px;line-height:1.65}.process{margin-top:120px;padding:48px;border-radius:18px;background:#171717;color:#fff}.process-lead{max-width:850px;margin:18px 0 56px;font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(26px,3.6vw,52px);line-height:1.15}.process>div{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.process>div span{padding-top:18px;border-top:1px solid rgba(255,255,255,.25);font-size:13px;letter-spacing:.08em}.contact-kicker{margin:0 0 40px;color:rgba(255,255,255,.52);font-size:13px;letter-spacing:.08em;text-align:center}

@media(max-width:900px){.hero-grid{grid-template-columns:1fr}.hero--lucy .hero-inner{width:min(calc(100% - 48px),720px);padding-top:130px}.hero-portrait{width:min(76vw,420px);margin:0 auto}.proof-grid{grid-template-columns:1fr!important}.proof-stats{width:100%;margin-top:44px}.story-intro{grid-template-columns:1fr}.visual-collage{grid-template-columns:1fr 1fr;grid-template-rows:auto}.visual-collage .visual-main{grid-column:1/-1;grid-row:auto;min-height:480px}.process>div{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.hero--lucy .hero-inner{width:calc(100% - 48px)}.hero--lucy .hero-name{font-size:clamp(62px,22vw,100px)}.hero-eyebrow{max-width:30ch}.hero--lucy .hero-copy{margin-top:36px;font-size:20px}.hero-education{line-height:1.5}.hero-portrait{width:100%;border-radius:120px 120px 18px 18px}.proof-stats article{grid-template-columns:80px 1fr}.proof-stats strong{font-size:42px}.project-notes{align-items:flex-start;flex-wrap:wrap}.project-notes button{width:100%;margin:4px 0 0}.visual-collage{grid-template-columns:1fr}.visual-collage .visual-main{grid-column:auto;min-height:360px}.journey-grid{grid-template-columns:1fr}.journey-grid article,.journey-grid article:nth-child(even){padding:30px 0;border-left:0}.process{padding:30px 24px}.process>div{grid-template-columns:1fr}.contact-kicker{line-height:1.5}}

/* Motion fidelity: persistent nav, typewriter and scroll-driven Playground */
.site-header.is-scrolled .nav-links,.site-header.is-compact .nav-links{display:flex}.site-header.is-scrolled .nav-more,.site-header.is-compact .nav-more{display:none}.nav-links>a,.nav-links>.lang-toggle{display:inline-flex;min-height:28px;align-items:center;padding:0;color:rgba(255,255,255,.7);font-family:Gilroy,Arial,sans-serif;font-size:13px;font-weight:400;line-height:1;white-space:nowrap}.nav-links>.lang-toggle{border:0;background:none;letter-spacing:0}.nav-links>.lang-toggle:hover{color:#fff}.gmail-icon svg{overflow:visible}
.hero-role{min-height:18px;font-family:Gilroy,Arial,sans-serif;font-weight:400}.typed-role{display:inline-block;min-width:18ch;color:#fff}.type-caret{display:inline-block;width:1px;height:1.05em;margin-left:4px;background:#b8ff70;vertical-align:-.16em;animation:type-caret-blink 1.3s steps(1,end) infinite}@keyframes type-caret-blink{50%{opacity:0}}
.playground__sticky{position:sticky;top:0;height:100svh;overflow:hidden}.playground-track{cursor:grab;touch-action:pan-y}.playground-track.is-dragging{cursor:grabbing}.playground-track.is-dragging *{pointer-events:none}

@media(max-width:599px){
  #playground{min-height:0;overflow:hidden}.playground__sticky{position:relative;top:auto;height:auto;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch}.playground__sticky::-webkit-scrollbar{display:none}
  .playground-track{display:flex;width:max-content;min-width:100%;height:auto;align-items:flex-start;gap:20px;padding:var(--section) 24px;transform:none!important;cursor:auto;touch-action:pan-x}
  .playground-intro,.playground-card{width:82vw;flex:0 0 82vw;margin:0!important;padding:0;scroll-snap-align:start}.playground-intro{align-self:stretch;display:flex;min-height:60vh;flex-direction:column;justify-content:center}.playground-card+.playground-card{margin-top:0}
}
@media(max-width:600px){.hero--lucy .hero-name{font-size:clamp(34px,8vw,128px);line-height:.9;letter-spacing:.01em}.typed-role{min-width:0}.hero-role{max-width:none;letter-spacing:.14em}}
@media(prefers-reduced-motion:reduce){.type-caret{animation:none}.playground__sticky{position:relative;height:auto;overflow-x:auto}.playground-track{transform:none!important}}

/* Video-matched hero */
.hero--lucy{text-align:center}.hero--lucy .hero-inner{width:min(calc(100% - 48px),1400px)}.video-hero{display:flex;min-height:100svh;flex-direction:column;align-items:center;justify-content:center;padding:120px 0 90px}.hero-role-display{display:flex;min-height:1.1em;align-items:center;justify-content:center;font-family:Blinker,Arial,sans-serif!important;font-size:clamp(50px,6.4vw,104px)!important;font-weight:400!important;line-height:1!important;letter-spacing:.005em!important;white-space:nowrap!important}.hero-role-display .typed-role{min-width:18ch;color:#fff;text-align:center}.hero-role-display .type-caret{height:.88em;margin-left:7px;background:#fff;vertical-align:0}.video-hero .hero-copy{max-width:660px;margin:92px auto 0!important;color:rgba(255,255,255,.72);font-family:Gilroy,Arial,sans-serif;font-size:clamp(14px,1.15vw,17px)!important;line-height:1.55!important;text-align:center}.video-hero .hero-education{margin-top:12px;text-align:center}.hero--lucy .trail-layer{z-index:2}.hero--lucy .trail-image{width:190px;height:132px;border-radius:2px;box-shadow:0 14px 50px rgba(0,0,0,.3)}.hero--lucy .hero-inner{z-index:3;pointer-events:none}
.hero--lucy .trail-image.is-wide{width:220px;height:124px}.hero--lucy .trail-image.is-square{width:154px;height:154px}.hero--lucy .trail-image.is-portrait{width:118px;height:174px}

/* Reference-style Intro notepad */
.intro-notepad{display:flex;flex-direction:column;justify-content:center}.intro-evidence{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:56px;padding-top:24px;border-top:1px solid rgba(255,255,255,.13);color:rgba(255,255,255,.5);font-size:12px;line-height:1.45}.intro-evidence span{display:grid;gap:8px}.intro-evidence strong{color:#b8ff70;font-family:Blinker,Arial,sans-serif;font-size:28px;font-weight:400}

/* Animated conic-border button from the reference */
@property --tech-angle{syntax:"<angle>";inherits:false;initial-value:0deg}@keyframes tech-border-spin{to{--tech-angle:360deg}}.tech-border{--tech-angle:0deg;display:inline-flex;align-items:center;gap:12px;margin-top:32px;padding:16px 32px;border:1px solid transparent;border-radius:9999px;background:linear-gradient(#0a0a0a,#0a0a0a) padding-box,conic-gradient(from var(--tech-angle),rgba(255,255,255,.06),#e5e7eb 55deg,rgba(255,255,255,.06) 130deg,rgba(255,255,255,.06) 230deg,#e5e7eb 305deg,rgba(255,255,255,.06)) border-box;color:#fff;font-family:Gilroy,Arial,sans-serif;font-size:14px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;animation:tech-border-spin 4.2s linear infinite;transition:transform .3s cubic-bezier(0,0,.2,1)}.tech-border:hover{transform:scale(1.1)}.tech-border span{transition:transform .3s cubic-bezier(0,0,.2,1)}.tech-border:hover span{transform:translateX(4px)}

/* Scroll-driven contact word entrance */
.contact-cta .cta-line{display:block;overflow:hidden}.contact-cta .cta-word{display:block;will-change:transform}.contact-cta .cta-word-left{transform:translate3d(-120%,0,0)}.contact-cta .cta-word-right{transform:translate3d(120%,0,0)}

@media(max-width:900px){.video-hero{min-height:100svh;padding:110px 0 90px}.hero-role-display{font-size:clamp(42px,9vw,72px)!important}.hero-role-display .typed-role{min-width:0}.video-hero .hero-copy{margin-top:72px!important}.intro-evidence{grid-template-columns:1fr 1fr}.hero--lucy .trail-image{width:150px;height:104px}}
@media(max-width:600px){.hero-role-display{max-width:100%;font-size:clamp(34px,10.5vw,52px)!important;white-space:normal!important}.hero-role-display .typed-role{max-width:9em}.video-hero .hero-copy{margin-top:56px!important}.intro-evidence{grid-template-columns:1fr}.tech-border{padding:14px 26px}}
@media(prefers-reduced-motion:reduce){.tech-border{animation:none}.contact-cta .cta-word{transform:none!important}}

/* Recruiter-readable case studies */
.case-page{background:#08090b;color:#f5f5f3}
.case-page .site-header{position:fixed}
.case-main{overflow:hidden}
.case-hero{padding:clamp(150px,18vw,240px) 0 clamp(88px,10vw,144px);background:radial-gradient(circle at 78% 18%,var(--case-glow,rgba(255,255,255,.08)),transparent 32%),#08090b}
.case-shell{width:min(calc(100% - 80px),1180px);margin-inline:auto}
.case-back{display:inline-flex;align-items:center;gap:10px;margin-bottom:64px;color:rgba(255,255,255,.55);font-size:13px;letter-spacing:.08em;transition:color .2s ease,transform .25s var(--ease-out)}
.case-back:hover{color:#fff;transform:translateX(-4px)}
.case-kicker,.case-label{margin:0;color:rgba(255,255,255,.48);font-size:11px;letter-spacing:.2em;text-transform:uppercase}
.case-title{max-width:11ch;margin:20px 0 0;font-family:Blinker,Arial,sans-serif;font-size:clamp(64px,11vw,152px);font-weight:400;line-height:.82;letter-spacing:-.045em}
.case-title span{display:inline}
.case-thesis{max-width:840px;margin:48px 0 0;color:rgba(255,255,255,.72);font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(24px,3.1vw,42px);line-height:1.24;letter-spacing:-.025em}
.case-proof{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:88px;border-top:1px solid rgba(255,255,255,.15);border-bottom:1px solid rgba(255,255,255,.15)}
.case-proof div{min-height:150px;padding:24px 28px 28px 0}
.case-proof div+div{padding-left:28px;border-left:1px solid rgba(255,255,255,.15)}
.case-proof dt{margin-bottom:16px;color:rgba(255,255,255,.4);font-size:10px;letter-spacing:.18em;text-transform:uppercase}
.case-proof dd{margin:0;color:rgba(255,255,255,.9);font-size:16px;line-height:1.5}
.case-block{padding:clamp(96px,12vw,168px) 0;border-top:1px solid rgba(255,255,255,.1)}
.case-block--raised{background:#101114}
.case-grid{display:grid;grid-template-columns:minmax(240px,.72fr) minmax(0,1.28fr);gap:clamp(56px,10vw,144px);align-items:start}
.case-block h2{max-width:10ch;margin:14px 0 0;font-family:Blinker,Arial,sans-serif;font-size:clamp(44px,6vw,78px);font-weight:400;line-height:.95;letter-spacing:-.035em}
.case-copy{max-width:700px}
.case-copy>p{margin:0;color:rgba(255,255,255,.7);font-size:clamp(17px,1.45vw,20px);line-height:1.72}
.case-copy>p+p{margin-top:24px}
.case-insight{margin:40px 0 0;padding-left:24px;border-left:2px solid #fff;color:#fff!important;font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(24px,2.7vw,36px)!important;line-height:1.32!important}
.case-list{display:grid;gap:0;margin:48px 0 0;padding:0;border-top:1px solid rgba(255,255,255,.14);list-style:none}
.case-list li{display:grid;grid-template-columns:36px 1fr;gap:16px;padding:22px 0;border-bottom:1px solid rgba(255,255,255,.14);color:rgba(255,255,255,.7);font-size:16px;line-height:1.55}
.case-list span{color:rgba(255,255,255,.35);font-variant-numeric:tabular-nums}
.case-placeholder{position:relative;display:grid;min-height:clamp(300px,48vw,620px);margin-top:72px;place-items:center;overflow:hidden;border:1px solid rgba(255,255,255,.16);border-radius:12px;background-color:#0c0d10;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:32px 32px}
.case-placeholder::after{position:absolute;inset:16px;border:1px dashed rgba(255,255,255,.11);border-radius:6px;content:""}
.case-placeholder span{position:relative;z-index:1;max-width:34ch;padding:24px;color:rgba(255,255,255,.4);font-size:11px;line-height:1.6;letter-spacing:.16em;text-align:center;text-transform:uppercase}
.case-sequence{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:48px}
.case-sequence article{min-height:230px;padding:28px;border:1px solid rgba(255,255,255,.13);border-radius:10px;background:rgba(255,255,255,.025)}
.case-sequence strong{display:block;margin-bottom:42px;color:rgba(255,255,255,.35);font-size:12px;font-weight:400;letter-spacing:.15em}
.case-sequence h3{margin:0;font-family:Blinker,Arial,sans-serif;font-size:28px;font-weight:400;line-height:1.05}
.case-sequence p{margin:16px 0 0;color:rgba(255,255,255,.58);font-size:14px;line-height:1.6}
.case-outcome{padding:clamp(112px,14vw,190px) 0;background:#f0eee8;color:#111}
.case-outcome .case-label{color:rgba(0,0,0,.44)}
.case-outcome h2{max-width:15ch;margin:18px 0 0;font-family:Blinker,Arial,sans-serif;font-size:clamp(50px,7.5vw,104px);font-weight:400;line-height:.92;letter-spacing:-.04em}
.case-outcome-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:48px;margin-top:72px;padding-top:32px;border-top:1px solid rgba(0,0,0,.18)}
.case-outcome-grid h3{margin:0 0 12px;font-size:18px;font-weight:500}
.case-outcome-grid p{max-width:54ch;margin:0;color:rgba(0,0,0,.62);font-size:16px;line-height:1.65}
.case-reflection-note{max-width:880px;margin-top:72px;padding-top:26px;border-top:1px solid rgba(0,0,0,.18)}
.case-reflection-note small{display:block;margin-bottom:14px;color:rgba(0,0,0,.42);font-size:10px;font-weight:600;letter-spacing:.17em}
.case-reflection-note p{margin:0;color:rgba(0,0,0,.66);font-size:16px;line-height:1.68}
.case-next{padding:100px 0;background:#08090b}
.case-next a{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;padding-bottom:24px;border-bottom:1px solid rgba(255,255,255,.2);font-family:Blinker,Arial,sans-serif;font-size:clamp(42px,7vw,88px);line-height:1;transition:border-color .2s ease}
.case-next a:hover{border-color:#fff}.case-next small{color:rgba(255,255,255,.42);font-family:Gilroy,Arial,sans-serif;font-size:11px;letter-spacing:.18em;text-transform:uppercase}
.case-fact-note{margin-top:40px;color:rgba(255,255,255,.42);font-size:12px;line-height:1.6}
@media(max-width:900px){.case-proof{grid-template-columns:1fr 1fr}.case-proof div:nth-child(3){border-left:0;border-top:1px solid rgba(255,255,255,.15)}.case-proof div:nth-child(4){border-top:1px solid rgba(255,255,255,.15)}.case-grid{grid-template-columns:1fr;gap:48px}.case-block h2{max-width:14ch}.case-sequence{grid-template-columns:1fr}.case-sequence article{min-height:0}.case-outcome-grid{grid-template-columns:1fr}}
@media(max-width:600px){.case-shell{width:calc(100% - 48px)}.case-hero{padding-top:130px}.case-back{margin-bottom:44px}.case-title{font-size:clamp(58px,20vw,92px)}.case-title span{display:block}.case-thesis{margin-top:36px;font-size:25px}.case-proof{grid-template-columns:1fr;margin-top:56px}.case-proof div,.case-proof div+div{min-height:0;padding:22px 0;border-left:0;border-top:1px solid rgba(255,255,255,.15)}.case-proof div:first-child{border-top:0}.case-placeholder{margin-top:48px}.case-next a{align-items:flex-start;flex-direction:column}.case-outcome-grid{margin-top:48px}}

/* Video-reference interaction refinements */
.hero-role-display .typed-role{display:inline;min-width:0}

.work-carousel{position:relative}
.featured-controls{position:absolute;z-index:6;top:calc(min(80vh,calc((100vw - 80px)*.6667))/2 - 24px);right:-72px;left:-72px;display:flex;justify-content:space-between;margin:0;pointer-events:none}
.featured-controls button{pointer-events:auto;box-shadow:0 10px 36px rgba(0,0,0,.38);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.carousel-progress{height:1px;margin-top:18px;overflow:hidden;background:rgba(255,255,255,.12)}
.carousel-progress span{display:block;width:100%;height:100%;background:#fff;transform:scaleX(0);transform-origin:0 50%}
.carousel-progress.is-playing span{animation:case-progress 5.5s linear forwards}
@keyframes case-progress{to{transform:scaleX(1)}}

#playground{min-height:0;margin-bottom:0}
.playground__sticky,.playground-track{height:100dvh}
.playground-track{padding-block:clamp(48px,7vh,72px);padding-right:40px}

#creative{background:#000}
#creative .section-heading{margin-bottom:56px}
#creative .section-description{max-width:620px;margin:-32px 0 56px;color:rgba(255,255,255,.7);font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(18px,2.2vw,26px);line-height:1.375;letter-spacing:-.025em}
#creative .web-row:hover .web-row-title,#creative .web-row:focus-visible .web-row-title{color:#fff;-webkit-text-stroke-color:#fff;transform:translateX(12px)}
#creative .web-row:focus-visible{outline:0}

.visual-worlds{overflow:hidden;background:#000}
.visual-gallery{position:relative;width:100%;height:min(64vw,620px);min-height:480px;margin-top:24px;overflow:hidden;perspective:1200px;touch-action:pan-y;cursor:grab;user-select:none}
.visual-gallery.is-dragging{cursor:grabbing}
.visual-gallery__card{position:absolute;top:50%;left:50%;width:min(38vw,520px);margin:0;opacity:.22;filter:saturate(.5) brightness(.58);transform:translate3d(-50%,-50%,0) scale(.7);transition:transform .85s var(--ease-out),opacity .6s ease,filter .6s ease;will-change:transform,opacity}
.visual-gallery__card.is-left{opacity:.42;transform:translate3d(-142%,-50%,0) scale(.72) rotateY(7deg)}
.visual-gallery__card.is-active{z-index:2;opacity:1;filter:none;transform:translate3d(-50%,-50%,0) scale(1)}
.visual-gallery__card.is-right{opacity:.42;transform:translate3d(42%,-50%,0) scale(.72) rotateY(-7deg)}
.visual-gallery__card img{width:100%;aspect-ratio:4/3;border-radius:4px;object-fit:cover;background:#111}
.visual-gallery__card:first-child img{object-fit:contain;background:#e8e4dc}
.visual-gallery__card figcaption{margin-top:14px;color:rgba(255,255,255,.48);font-size:12px;letter-spacing:.08em;transition:color .4s ease}
.visual-gallery__card.is-active figcaption{color:rgba(255,255,255,.78)}

.story{background:#000;color:#fff}
.story .eyebrow{color:rgba(255,255,255,.42)}
.story-intro>p:last-child{color:rgba(255,255,255,.62)}
.journey-grid{border-top-color:rgba(255,255,255,.12)}
.journey-grid article{position:relative;border-bottom-color:rgba(255,255,255,.12);opacity:.36;transition:opacity .4s ease,background .4s ease,transform .45s var(--ease-out)}
.journey-grid article:nth-child(even){border-left-color:rgba(255,255,255,.12)}
.journey-grid article:hover{z-index:1;background:radial-gradient(circle at 18% 24%,rgba(255,255,255,.1),transparent 62%);opacity:1;transform:translate3d(0,-4px,0)}
.journey-grid h3{margin-top:0;color:#fff}
.journey-grid p{color:rgba(255,255,255,.62)}
.process{border:1px solid rgba(255,255,255,.12);background:#0b0b0b}

.custom-cursor{mix-blend-mode:normal}
.custom-cursor.is-hovering{width:74px;height:74px;border-color:#fff;background:#fff;color:#000}
.custom-cursor [data-cursor-label]{font-size:9px;font-weight:500;line-height:1.12;letter-spacing:.08em;opacity:0;transition:opacity .2s ease}
.custom-cursor.is-hovering [data-cursor-label]{opacity:1}

@media(max-width:1450px){.featured-controls{right:16px;left:16px}}
@media(max-width:900px){
  .featured-controls{top:calc(50% - 80px);right:12px;left:12px}
  .playground__sticky,.playground-track{height:auto}
  .playground-track{padding-block:var(--section)}
  .visual-gallery{height:560px;min-height:0}
  .visual-gallery__card{width:min(68vw,480px)}
  .visual-gallery__card.is-left{transform:translate3d(-130%,-50%,0) scale(.68)}
  .visual-gallery__card.is-right{transform:translate3d(30%,-50%,0) scale(.68)}
}
@media(max-width:600px){
  .featured-controls{top:calc(50% - 96px)}
  #creative .section-heading{margin-bottom:36px}
  #creative .section-description{margin:-16px 0 36px}
  .visual-gallery{height:430px}
  .visual-gallery__card{width:78vw}
  .journey-grid article,.journey-grid article:nth-child(even){padding:32px 0}
}
@media(prefers-reduced-motion:reduce){
  .carousel-progress.is-playing span{animation:none;transform:scaleX(1)}
  .visual-gallery__card{transition:none}
  .journey-grid article{opacity:1}
}

/* Final motion timing and interaction polish */
.carousel-progress{display:none!important}

.custom-cursor.is-hovering{
  width:78px;
  height:78px;
  border-color:rgba(255,255,255,.82);
  background:rgba(255,255,255,.66);
  box-shadow:0 10px 34px rgba(0,0,0,.16),inset 0 0 0 1px rgba(255,255,255,.18);
  color:#090909;
  -webkit-backdrop-filter:saturate(1.35) contrast(1.05);
  backdrop-filter:saturate(1.35) contrast(1.05)
}
.custom-cursor.is-hovering [data-cursor-label]{font-size:9px;font-weight:500;letter-spacing:.04em}
@media(hover:hover) and (pointer:fine){
  body:has([data-cursor]:hover) .custom-cursor{width:78px;height:78px;border-color:rgba(255,255,255,.82);background:rgba(255,255,255,.66);box-shadow:0 10px 34px rgba(0,0,0,.16),inset 0 0 0 1px rgba(255,255,255,.18);color:#090909;-webkit-backdrop-filter:saturate(1.35) contrast(1.05);backdrop-filter:saturate(1.35) contrast(1.05)}
  body:has([data-cursor]:hover) .custom-cursor [data-cursor-label]{font-size:9px;font-weight:500;letter-spacing:.04em;opacity:1}
}

.process{overflow:hidden}
.process-lead{opacity:0;transform:translate3d(0,72px,0);transition:opacity .8s ease,transform 1s var(--ease-out);will-change:transform,opacity}
.process.is-process-visible .process-lead{opacity:1;transform:translate3d(0,0,0)}
.process .process-steps [data-process-step]{position:relative;color:rgba(255,255,255,.22);border-top-color:rgba(255,255,255,.14);transition:color .45s ease,border-color .45s ease,transform .45s var(--ease-out)}
.process .process-steps [data-process-step]::before{position:absolute;top:-3px;left:0;width:0;height:3px;border-radius:3px;background:#fff;content:"";transition:width .45s var(--ease-out)}
.process .process-steps [data-process-step].is-active{color:#fff;border-top-color:rgba(255,255,255,.55);transform:translate3d(0,-4px,0)}
.process .process-steps [data-process-step].is-active::before{width:36px}

.contact-kicker{opacity:0;transform:translate3d(0,18px,0);transition:opacity .65s ease .15s,transform .75s var(--ease-out) .15s}
#contact.cta-words-complete .contact-kicker{opacity:1;transform:translate3d(0,0,0)}

.footer-grid a{display:inline-block;transform-origin:left center;transition:color .28s ease,transform .38s var(--ease-out)}
.footer-grid a:hover,.footer-grid a:focus-visible{color:#fff;transform:scale(1.2)}
.footer-meta>a{transform-origin:right center}

@media(prefers-reduced-motion:reduce){
  .process-lead,.contact-kicker{opacity:1;transform:none}
  .process .process-steps [data-process-step]{color:#fff}
  .process .process-steps [data-process-step]::before{display:none}
}

/* 2026-08-06 reference fidelity pass */
.marquee-item::after,.marquee-track>span::after{display:none;content:none}
.marquee-item,.marquee-track>span{margin-right:clamp(40px,6vw,88px)}
#about .intro-evidence strong{color:#fff}

#playground{min-height:0;margin:0;overflow:hidden;background:#0a0a0a}
.playground__sticky{position:sticky;top:0;height:min(82svh,840px);overflow:hidden;outline:none}
.playground__track,.playground-track{display:flex;width:max-content;min-width:100%;height:min(82svh,840px);align-items:stretch;gap:0;padding:0;will-change:transform}
.playground__intro,.playground-intro{display:flex;width:39vw;flex:0 0 39vw;height:100%;flex-direction:column;justify-content:center;padding-right:3vw;padding-left:max(32px,calc((100vw - var(--container-page))/2))}
.playground-kicker{display:flex;align-items:center;gap:12px;margin:0 0 24px;color:rgba(255,255,255,.5);font-size:14px;letter-spacing:.25em;text-transform:uppercase}
.playground-dot{width:8px;height:8px;flex:0 0 auto;border-radius:50%;background:var(--accent-green);animation:status-pulse 1.8s ease-in-out infinite}
.playground-intro .section-heading{font-size:clamp(40px,8vw,80px);line-height:.9;letter-spacing:-.03em}
.playground-intro .section-description{max-width:420px;margin:24px 0 0;color:rgba(255,255,255,.7);font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(18px,2.2vw,26px);line-height:1.35;letter-spacing:-.025em}
.playground-scroll-hint{margin-top:40px;color:rgba(255,255,255,.4);font-size:14px;letter-spacing:.2em;text-transform:uppercase}
.playground-card{display:flex;width:36vw;flex:0 0 36vw;height:100%;flex-direction:column;justify-content:center;padding:0 24px}
.playground-media{position:relative;aspect-ratio:4/3;overflow:hidden;border-radius:20px;background:#171717}
.playground-media::after{display:none}
.playground-media img{width:100%;height:100%;object-fit:cover;transform:scale(1.1);transition:transform .8s var(--ease-out)}
.playground-card:hover .playground-media img,.playground-card:focus-within .playground-media img{transform:scale(1.04)}
.playground-card-copy{display:block;margin-top:24px}
.playground-card h3{margin:0;color:#fff;font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(28px,3.4vw,44px);font-weight:400;line-height:1.2;letter-spacing:-.03em}
.playground-card p{max-width:380px;margin:8px 0 0;color:rgba(255,255,255,.6);font-size:16px;line-height:1.65}
.playground-card .tags{margin-top:16px}
.playground-end{display:flex;width:30vw;min-width:360px;flex:0 0 30vw;height:100%;padding:0 max(40px,5vw) 0 32px;flex-direction:column;justify-content:center}
.playground-end__kicker{display:flex;align-items:center;gap:12px;margin:0 0 24px;color:rgba(255,255,255,.48);font-size:12px;letter-spacing:.2em;text-transform:uppercase}
.playground-end h3{max-width:420px;margin:0;color:#fff;font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(38px,5vw,64px);font-weight:400;line-height:.98;letter-spacing:-.035em}
.playground-end>p:last-child{max-width:360px;margin:24px 0 0;color:rgba(255,255,255,.58);font-size:16px;line-height:1.65}

.process .process-steps{--process-line-start:35px;--process-line-end:25px;position:relative;display:flex;align-items:flex-start;justify-content:space-between;gap:0;margin-top:42px;padding-top:20px}
.process .process-steps::before,.process .process-steps::after{position:absolute;top:0;left:0;height:2px;content:""}
.process .process-steps::before,.process .process-steps::after{left:var(--process-line-start)}
.process .process-steps::before{right:var(--process-line-end);background:rgba(255,255,255,.14)}
.process .process-steps::after{width:0;border-radius:2px;background:#fff}
.process.is-progress-running .process-steps::after{animation:process-progress-once 3s linear forwards}
.process.is-progress-complete .process-steps::after{width:calc(100% - var(--process-line-start) - var(--process-line-end))}
@keyframes process-progress-once{from{width:0}to{width:calc(100% - var(--process-line-start) - var(--process-line-end))}}
.process .process-steps [data-process-step]{position:relative;padding:0;border:0;color:rgba(255,255,255,.22);transition:color .3s ease,transform .45s var(--ease-out)}
.process .process-steps [data-process-step]::before{position:absolute;top:-25px;left:50%;display:block;width:10px;height:10px;border:2px solid #343434;border-radius:50%;background:#000;content:"";transform:translate(-50%,-50%);transition:border-color .28s ease,background .28s ease,box-shadow .28s ease}
.process .process-steps [data-process-step]:last-child{text-align:right}
.process .process-steps [data-process-step]:last-child::before{right:auto;left:50%}
.process .process-steps [data-process-step].is-complete{color:#fff;transform:translate3d(0,-3px,0)}
.process .process-steps [data-process-step].is-complete::before{border-color:#fff;background:#fff;box-shadow:0 0 0 4px rgba(255,255,255,.08)}
.visual-gallery__card{cursor:pointer}
.visual-gallery__card:focus-visible{outline:1px solid rgba(255,255,255,.9);outline-offset:8px}

.footer__hello{gap:8px}
.footer-email{max-width:100%;font-size:clamp(22px,2.2vw,30px);line-height:1.2;letter-spacing:-.02em;overflow-wrap:anywhere}
.footer-location{display:flex;align-items:center;gap:10px;margin:6px 0 0!important;color:rgba(255,255,255,.42);font-size:14px;line-height:1.5}
.eyebrow-with-status{display:flex;align-items:center;gap:12px}
.section-status-dot{display:inline-block;width:8px;height:8px;flex:0 0 auto;border-radius:50%;background:var(--accent-green);box-shadow:0 0 0 0 rgba(184,255,112,.32);animation:status-pulse 1.8s ease-in-out infinite}
.footer-meta{display:flex!important;align-items:flex-end;justify-content:space-between!important;gap:32px}
.footer-meta>a{flex:0 0 auto;color:rgba(255,255,255,.82);font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(22px,2.2vw,34px);line-height:1;letter-spacing:-.025em}

@media(max-width:599px){
  #playground{min-height:0;overflow:visible}
  .playground__sticky{position:relative;top:auto;height:auto;overflow:visible}
  .playground__track,.playground-track{display:block;width:auto;height:auto;padding:72px 24px;transform:none!important}
  .playground__intro,.playground-intro{width:100%;height:auto;margin:0 0 64px;padding:0}
  .playground-scroll-hint{display:none}
  .playground-card{width:100%;height:auto;margin:0;padding:0}
  .playground-card+.playground-card{margin-top:64px}
  .playground-end{display:flex;width:100%;min-width:0;height:auto;margin-top:88px;padding:64px 0 8px;border-top:1px solid rgba(255,255,255,.14)}
  .process .process-steps{font-size:12px}
  .footer-meta{flex-direction:row;align-items:flex-end}
  .footer-meta p{max-width:48%}
  .footer-meta>a{font-size:22px;text-align:right}
}

@media(prefers-reduced-motion:reduce){
  .playground__sticky{position:relative;height:auto;overflow:visible}
  .playground__track,.playground-track{height:auto;transform:none!important}
  .process .process-steps::after{width:100%;animation:none!important}
  .process .process-steps [data-process-step]::before{display:block}
  .playground-dot,.section-status-dot{animation:none}
}

/* Jingjing Han-inspired case study system: editorial chapters + living media */
.featured-link{display:block;z-index:5;cursor:pointer}
.featured-overlay{pointer-events:none}

.case-page{background:#efede7;color:#111;--case-paper:#efede7;--case-ink:#111;--case-dark:#0c0d0f;--case-line:rgba(17,17,17,.16)}
:is(.case-page,.web-case-page,.projects-gallery-page) .site-header{transition:width .55s var(--ease-out),background .35s ease,border-color .35s ease,transform .55s var(--ease-out)}
:is(.case-page,.web-case-page,.projects-gallery-page) .site-header.case-scrolled{width:min(calc(100% - 40px),860px);background:rgba(18,18,18,.8);border-color:rgba(255,255,255,.2);transform:translateX(-50%) scale(.92)}
@media(min-width:768px){
  :is(.case-page,.web-case-page,.projects-gallery-page) .nav-shell{display:grid;grid-template-columns:minmax(112px,1fr) auto minmax(112px,1fr)}
  :is(.case-page,.web-case-page,.projects-gallery-page) .nav-brand{justify-self:start}
  :is(.case-page,.web-case-page,.projects-gallery-page) .nav-links{justify-self:center}
  :is(.case-page,.web-case-page,.projects-gallery-page) .nav-socials{justify-self:end}
}
.case-main{position:relative;padding-top:100svh;background:#0b0c0e}
.case-main::before{position:fixed;z-index:0;inset:0;background:radial-gradient(circle at calc(24% + var(--cover-x,0px)) calc(36% + var(--cover-y,0px)),var(--case-glow,rgba(255,255,255,.14)),transparent 28%),radial-gradient(circle at 76% 66%,rgba(255,255,255,.09),transparent 24%),linear-gradient(135deg,#0a0b0d,#17191d 48%,#090a0c);content:"";pointer-events:none}
.case-main::after{display:none;content:none}
.case-main>section,.case-main>nav{position:relative;z-index:2}
.case-cover-label{position:fixed;z-index:1;top:50%;left:max(40px,calc((100vw - 1180px)/2));color:#fff;transform:translateY(-50%);transition:opacity .45s ease,transform .65s var(--ease-out);pointer-events:none}
.case-cover-label p{margin:0 0 22px;color:rgba(255,255,255,.48);font-size:11px;letter-spacing:.2em;text-transform:uppercase}
.case-cover-label h2{max-width:7ch;margin:0;font-family:Blinker,Arial,sans-serif;font-size:clamp(72px,10vw,144px);font-weight:400;line-height:.82;letter-spacing:-.045em}
.case-cover-label span{display:block;margin-top:42px;color:rgba(255,255,255,.48);font-size:11px;letter-spacing:.15em;text-transform:uppercase}
.case-sheet-visible .case-cover-label{opacity:0;transform:translate3d(0,-60%,0)}
.case-showcase{position:fixed!important;z-index:1!important;inset:0;overflow:hidden;color:#fff;isolation:isolate;pointer-events:none}
.case-showcase::after{position:absolute;z-index:5;right:0;bottom:0;left:0;height:28%;background:linear-gradient(transparent,rgba(0,0,0,.42));content:"";pointer-events:none}
.case-showcase__copy{position:absolute;z-index:6;top:clamp(112px,15vh,170px);left:max(40px,calc((100vw - 1240px)/2));max-width:560px;transition:opacity .45s ease,transform .65s var(--ease-out)}
.case-showcase__copy small{display:block;margin-bottom:16px;color:rgba(255,255,255,.64);font-size:10px;letter-spacing:.2em}
.case-showcase__copy h2{margin:0;font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(58px,7vw,108px);font-weight:400;line-height:.84;letter-spacing:-.055em}
.case-showcase__copy p{max-width:34ch;margin:20px 0 0;color:rgba(255,255,255,.72);font-size:clamp(15px,1.2vw,18px)}
.case-showcase__scroll{position:absolute;z-index:6;right:max(40px,calc((100vw - 1240px)/2));bottom:42px;color:rgba(255,255,255,.68);font-size:10px;letter-spacing:.15em;text-transform:uppercase}
.case-sheet-visible .case-showcase__copy,.case-sheet-visible .case-showcase__scroll{opacity:0;transform:translate3d(0,-24px,0)}
.case-showcase figure{margin:0;overflow:hidden;box-shadow:0 42px 100px rgba(0,0,0,.36)}
.case-showcase img{display:block;width:100%;height:100%;object-fit:cover}
.case-showcase--geeellink{background:radial-gradient(circle at 75% 28%,rgba(119,87,255,.38),transparent 33%),radial-gradient(circle at 40% 92%,rgba(255,115,75,.22),transparent 30%),#111019}
.case-showcase--geeellink .case-showcase__ambient{position:absolute;inset:0;background:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:56px 56px;mask-image:linear-gradient(to bottom,transparent,black 28%,black)}
.case-showcase__desktop{position:absolute;border:1px solid rgba(255,255,255,.16);border-radius:18px;background:#17171c;transition:transform .28s ease-out}
.case-showcase__desktop--main{top:24%;right:-2%;width:min(74vw,1120px);aspect-ratio:1319/684;transform:translate3d(var(--cover-x,0),var(--cover-y,0),0) rotate(-1deg)}
.case-showcase__desktop--support{right:54%;bottom:-10%;width:min(43vw,650px);aspect-ratio:1319/684;transform:translate3d(var(--cover-x,0px),var(--cover-y,0px),0) rotate(4deg)}
.case-showcase--ourjourneyman{background:radial-gradient(circle at 44% 28%,rgba(236,192,136,.34),transparent 25%),linear-gradient(125deg,#1b1512 0%,#5b3c2d 48%,#a77e59 100%)}
.case-showcase--snapbudget{background:radial-gradient(circle at 18% 82%,rgba(255,200,174,.88),transparent 34%),linear-gradient(120deg,#6379e9 0%,#79b7ee 50%,#c5e4f5 100%)}
.case-showcase__phones{position:absolute;z-index:2;right:max(34px,calc((100vw - 1350px)/2));bottom:-23%;display:flex;width:min(72vw,1040px);height:82%;align-items:flex-start;gap:clamp(12px,1.5vw,26px);transform:translate3d(var(--cover-x,0),var(--cover-y,0),0);transition:transform .25s ease-out}
.case-showcase__phones figure{width:25%;height:100%;border:1px solid rgba(255,255,255,.3);border-radius:28px 28px 0 0;background:#fff;box-shadow:0 40px 90px rgba(0,0,0,.24)}
.case-showcase__phones figure:nth-child(2){margin-top:6%}.case-showcase__phones figure:nth-child(3){margin-top:-4%}.case-showcase__phones figure:nth-child(4){margin-top:9%}
.case-showcase__phones img{object-position:top}
.case-showcase--snapbudget .case-showcase__phones{right:2vw;bottom:1.5%;width:min(76vw,1180px);height:72%;align-items:flex-end}
.case-showcase--snapbudget .case-showcase__phones figure{height:100%;overflow:visible;border:0;border-radius:34px;background:transparent;box-shadow:0 34px 72px rgba(27,54,108,.28)}
.case-showcase--snapbudget .case-showcase__phones figure:nth-child(2),.case-showcase--snapbudget .case-showcase__phones figure:nth-child(3),.case-showcase--snapbudget .case-showcase__phones figure:nth-child(4){margin-top:0}
.case-showcase--snapbudget .case-showcase__phones img{object-fit:contain;object-position:center bottom}

.gallery-work__media--devices{display:flex;align-items:flex-end;justify-content:center;gap:clamp(8px,1.2vw,20px);padding:clamp(22px,4vw,58px);background:radial-gradient(circle at 50% 110%,rgba(255,255,255,.18),transparent 48%),linear-gradient(135deg,#9b8878,#c9b19c)}
.gallery-work--app-preview:nth-child(2) .gallery-work__media--devices{background:radial-gradient(circle at 50% 110%,rgba(255,255,255,.24),transparent 48%),linear-gradient(135deg,#efdcc5,#a9d3eb)}
.gallery-work__media--devices img{width:29%;height:auto;max-height:100%;object-fit:contain;filter:drop-shadow(0 22px 24px rgba(0,0,0,.22));transform:none!important}
.gallery-work__media--devices img:nth-child(2){transform:translateY(-4%)!important}.gallery-work__media--devices img:nth-child(3){transform:translateY(3%)!important}
.nav-lang-toggle{padding:0;border:0;background:transparent;color:inherit;font:inherit;cursor:pointer;white-space:nowrap}
.case-showcase--hiyogurt{background:radial-gradient(circle at 18% 20%,rgba(255,255,255,.25),transparent 24%),linear-gradient(135deg,#ff9f43,#f6c945 48%,#cf5a4d)}
.case-showcase--hiyogurt .case-showcase__copy{color:#21150b}.case-showcase--hiyogurt .case-showcase__copy small,.case-showcase--hiyogurt .case-showcase__copy p{color:rgba(33,21,11,.7)}
.case-showcase__strategy{position:absolute;right:-5%;bottom:-10%;width:min(78vw,1160px);height:78%;border-radius:48% 0 0 0;background:rgba(255,255,255,.14);box-shadow:none!important;transform:translate3d(var(--cover-x,0),var(--cover-y,0),0) scale(1.04);transition:transform .25s ease-out}
.case-showcase__strategy img{object-fit:contain;object-position:right center}
.case-page:not(.case-sheet-visible) .site-header .brand__name,.case-page:not(.case-sheet-visible) .site-header .nav-links a{color:#fff}
.case-hero{position:relative;display:flex;min-height:100svh;align-items:flex-end;padding:clamp(156px,18vw,228px) 0 clamp(72px,8vw,112px);overflow:hidden;border-radius:48px 48px 0 0;background:var(--case-paper);box-shadow:0 -34px 100px rgba(0,0,0,.28);color:var(--case-ink)}
.case-hero::before{position:absolute;inset:-18%;background:radial-gradient(circle at calc(72% + var(--hero-shift,0px)) 12%,var(--case-glow,rgba(0,0,0,.08)),transparent 31%),linear-gradient(115deg,transparent 42%,rgba(255,255,255,.5) 50%,transparent 58%);content:"";opacity:.75;transform:rotate(-5deg);pointer-events:none}
.case-hero::after{position:absolute;right:4vw;bottom:7vh;width:10px;height:10px;border-radius:50%;background:#111;box-shadow:0 0 0 12px rgba(17,17,17,.06);content:"";animation:case-hero-dot 2s ease-in-out infinite}
@keyframes case-hero-dot{50%{transform:scale(.65);opacity:.35}}
.case-hero .case-shell{position:relative;z-index:1}
.case-back{color:rgba(0,0,0,.52)}.case-back:hover{color:#000}
.case-kicker,.case-hero .case-label{color:rgba(0,0,0,.46)}
.case-title{max-width:12ch;font-size:clamp(74px,12vw,168px);line-height:.8}
.case-thesis{max-width:920px;color:rgba(0,0,0,.68);font-size:clamp(26px,3.2vw,44px)}
.case-proof{border-color:rgba(0,0,0,.16)}
.case-proof div+div{border-left-color:rgba(0,0,0,.16)}
.case-proof dt{color:rgba(0,0,0,.42)}
.case-proof dd{color:#111}

.case-block{position:relative;min-height:100svh;padding:clamp(112px,13vw,176px) 0;background:var(--case-paper);color:var(--case-ink);border-top:1px solid rgba(0,0,0,.12)}
.case-block--raised{background:var(--case-dark);color:#fff;border-top-color:rgba(255,255,255,.1)}
.case-block .case-grid{grid-template-columns:minmax(250px,.7fr) minmax(0,1.3fr)}
.case-block .case-grid>div:first-child{position:sticky;top:128px;align-self:start}
.case-block .case-grid>div:first-child::after{display:block;width:34px;height:1px;margin-top:30px;background:currentColor;content:"";opacity:.45;box-shadow:0 28px 0 currentColor,0 56px 0 currentColor,0 84px 0 currentColor,0 112px 0 currentColor,0 140px 0 currentColor}
.case-block .case-label{color:rgba(0,0,0,.42)}
.case-block--raised .case-label{color:rgba(255,255,255,.44)}
.case-block h2{font-size:clamp(42px,5.5vw,72px)}
.case-block .case-copy>p{color:rgba(0,0,0,.66)}
.case-block--raised .case-copy>p{color:rgba(255,255,255,.68)}
.case-block .case-insight{border-left-color:#111;color:#111!important}
.case-block--raised .case-insight{border-left-color:#fff;color:#fff!important}
.case-block .case-list{border-top-color:rgba(0,0,0,.14)}
.case-block .case-list li{border-bottom-color:rgba(0,0,0,.14);color:rgba(0,0,0,.68)}
.case-block .case-list span{color:rgba(0,0,0,.35)}
.case-block--raised .case-list{border-top-color:rgba(255,255,255,.14)}
.case-block--raised .case-list li{border-bottom-color:rgba(255,255,255,.14);color:rgba(255,255,255,.7)}
.case-block--raised .case-list span{color:rgba(255,255,255,.35)}
.case-block .case-sequence article{border-color:rgba(0,0,0,.14);background:rgba(255,255,255,.35)}
.case-block .case-sequence strong{color:rgba(0,0,0,.38)}
.case-block .case-sequence p{color:rgba(0,0,0,.58)}
.case-block--raised .case-sequence article{border-color:rgba(255,255,255,.14);background:rgba(255,255,255,.025)}
.case-block--raised .case-sequence strong{color:rgba(255,255,255,.38)}
.case-block--raised .case-sequence p{color:rgba(255,255,255,.58)}

.case-section-nav{position:fixed;z-index:96;top:50%;left:20px;width:42px;opacity:0;pointer-events:none;transform:translate3d(-18px,-50%,0);transition:opacity .35s ease,transform .45s var(--ease-out)}
.case-section-nav.is-visible{opacity:1;pointer-events:auto;transform:translate3d(0,-50%,0)}
.case-section-nav ol{display:grid;gap:15px;margin:0;padding:0;list-style:none}
.case-section-nav a{position:relative;display:block;width:18px;height:1px;background:rgba(127,127,127,.44);transition:width .3s var(--ease-out),background .25s ease}
.case-section-nav a.is-active,.case-section-nav a:hover{width:32px;background:#888}
.case-section-nav a span,.case-section-nav a em{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

.case-placeholder[data-case-media]{position:sticky;top:calc(88px + var(--media-stack,0)*14px);display:block;min-height:clamp(420px,56vw,720px);padding:0;overflow:hidden;border:0;border-radius:18px;background:#d9d8d3;background-image:none;cursor:default;opacity:.01;transform:translate3d(0,28px,0);transition:opacity .7s var(--ease-out),transform .7s var(--ease-out),box-shadow .5s ease}
.case-block--raised .case-placeholder[data-case-media]{background:#17191d}
.case-placeholder[data-case-media].is-visible{opacity:1;transform:none;box-shadow:0 32px 90px rgba(0,0,0,.12)}
.case-placeholder[data-case-media]::after{inset:0;border:0;border-radius:0;background:radial-gradient(circle at 50% 50%,transparent 40%,rgba(0,0,0,.08));pointer-events:none}
.case-media-stage{position:absolute;inset:0;overflow:hidden;clip-path:inset(0 0 100% 0 round 18px);transition:clip-path .9s var(--ease-out)}
.case-placeholder.is-visible .case-media-stage{clip-path:inset(0 0 0 0 round 18px)}
.case-media-frame{position:absolute;inset:0;display:grid;place-items:center;padding:clamp(28px,5vw,72px);opacity:0;transform:translate3d(9%,0,0) scale(.96);transition:opacity .55s ease,transform .8s var(--ease-out);pointer-events:none}
.case-media-frame.is-active{z-index:1;opacity:1;transform:translate3d(var(--media-x,0),var(--media-y,0),0) scale(1)}
.case-media-frame>p{position:absolute;z-index:2;bottom:28px;left:32px;max-width:60ch;margin:0;color:rgba(0,0,0,.58);font-size:11px;line-height:1.5;letter-spacing:.15em;text-transform:uppercase}
.case-media-frame>span{position:absolute;right:32px;bottom:28px;padding:0;color:rgba(0,0,0,.46);font-size:11px;letter-spacing:.14em}
.case-block--raised .case-media-frame>p,.case-block--raised .case-media-frame>span{color:rgba(255,255,255,.5)}
.case-media-window{position:relative;width:min(82%,820px);aspect-ratio:16/9;overflow:hidden;border:1px solid rgba(0,0,0,.14);border-radius:14px;background:#f7f7f4;box-shadow:0 30px 70px rgba(0,0,0,.18)}
.case-block--raised .case-media-window{border-color:rgba(255,255,255,.15);background:#0e1013;box-shadow:0 34px 80px rgba(0,0,0,.45)}
.case-media-window>i{position:absolute;top:18px;width:8px;height:8px;border-radius:50%;background:#a9aaa5}.case-media-window>i:nth-child(1){left:20px}.case-media-window>i:nth-child(2){left:36px}.case-media-window>i:nth-child(3){left:52px}
.case-media-skeleton{position:absolute;inset:58px 6% 8%;display:grid;grid-template-columns:1.2fr .8fr;grid-template-rows:1fr 1fr;gap:16px}
.case-media-skeleton b{display:block;border-radius:9px;background:rgba(0,0,0,.08)}
.case-media-skeleton b:first-child{grid-row:1/3;background:linear-gradient(145deg,rgba(0,0,0,.08),rgba(0,0,0,.16))}
.case-media-skeleton b:nth-child(4),.case-media-skeleton b:nth-child(5){display:none}
.case-block--raised .case-media-skeleton b{background:rgba(255,255,255,.08)}
.case-block--raised .case-media-skeleton b:first-child{background:linear-gradient(145deg,rgba(255,255,255,.06),rgba(255,255,255,.15))}
.case-media-frame:nth-child(2) .case-media-window{width:min(70%,680px);aspect-ratio:4/3;transform:rotate(-1.5deg)}
.case-media-frame:nth-child(2) .case-media-skeleton{grid-template-columns:1fr 1fr 1fr;grid-template-rows:1fr}.case-media-frame:nth-child(2) .case-media-skeleton b:first-child{grid-row:auto}
.case-media-frame:nth-child(3) .case-media-window{width:min(64%,620px);aspect-ratio:3/4;transform:rotate(1.5deg)}
.case-media-frame:nth-child(3) .case-media-skeleton{grid-template-columns:1fr;grid-template-rows:1.3fr .4fr .4fr}.case-media-frame:nth-child(3) .case-media-skeleton b:first-child{grid-row:auto}
.case-media-controls{position:absolute;z-index:4;right:22px;top:22px;display:flex;align-items:center;gap:12px;padding:8px;border:1px solid rgba(0,0,0,.1);border-radius:999px;background:rgba(244,244,240,.75);backdrop-filter:blur(16px)}
.case-media-controls{display:none}
.case-block--raised .case-media-controls{border-color:rgba(255,255,255,.12);background:rgba(10,11,13,.72)}
.case-media-controls button{display:grid;width:34px;height:34px;place-items:center;border-radius:50%;color:#111;transition:background .2s ease,transform .2s var(--ease-out)}
.case-media-controls button:hover{background:rgba(0,0,0,.08);transform:scale(1.06)}
.case-block--raised .case-media-controls button{color:#fff}.case-block--raised .case-media-controls button:hover{background:rgba(255,255,255,.1)}
.case-media-controls>div{width:54px;height:1px;overflow:hidden;background:rgba(0,0,0,.14)}
.case-block--raised .case-media-controls>div{background:rgba(255,255,255,.16)}
.case-media-controls>div span{display:block;width:33.333%;height:100%;padding:0;background:#111;transition:width .45s var(--ease-out)}
.case-block--raised .case-media-controls>div span{background:#fff}

.case-outcome{border-top:1px solid rgba(0,0,0,.12);background:#efede7}
.case-next{background:#0c0d0f}
@media(max-width:900px){.case-section-nav{display:none}.case-block .case-grid>div:first-child{position:relative;top:auto}.case-block .case-grid>div:first-child::after{display:none}:is(.case-page,.web-case-page,.projects-gallery-page) .site-header.case-scrolled{width:calc(100% - 24px);transform:translateX(-50%)}.case-placeholder[data-case-media]{min-height:520px}}
@media(max-width:600px){.case-hero{min-height:auto;padding-bottom:72px}.case-title{font-size:clamp(60px,19vw,88px)}.case-thesis{font-size:24px}.case-proof{border-color:rgba(0,0,0,.16)}.case-proof div,.case-proof div+div{border-top-color:rgba(0,0,0,.16)}.case-placeholder[data-case-media]{min-height:420px;border-radius:12px}.case-media-stage{clip-path:inset(0 0 100% 0 round 12px)}.case-placeholder.is-visible .case-media-stage{clip-path:inset(0 0 0 0 round 12px)}.case-media-frame{padding:22px}.case-media-window,.case-media-frame:nth-child(2) .case-media-window,.case-media-frame:nth-child(3) .case-media-window{width:94%;aspect-ratio:4/5;transform:none}.case-media-frame>p{right:24px;bottom:20px;left:24px;padding-right:48px}.case-media-frame>span{right:24px;bottom:20px}.case-media-controls{top:14px;right:14px}.case-media-controls>div{display:none}}
@media(max-width:600px){.case-main{padding-top:88svh}.case-hero{border-radius:28px 28px 0 0}}
@media(max-width:600px){.case-cover-label{top:44%;left:24px}.case-cover-label h2{max-width:5ch;font-size:clamp(58px,18vw,82px)}.case-cover-label span{margin-top:28px}}
@media(max-width:700px){.case-showcase__copy{top:112px;right:24px;left:24px}.case-showcase__copy h2{font-size:clamp(48px,14vw,72px)}.case-showcase__copy p{font-size:14px}.case-showcase__scroll{right:24px;bottom:28px}.case-showcase__desktop--main{top:39%;right:-30%;width:126vw}.case-showcase__desktop--support{right:52%;bottom:8%;width:72vw}.case-showcase__phones{right:-36%;bottom:-11%;width:132vw;height:59%;gap:10px}.case-showcase--ourjourneyman .case-showcase__phones{bottom:-18%;height:64%}.case-showcase__phones figure{border-radius:18px 18px 0 0}.case-showcase__phones figure:first-child{display:none}.case-showcase__strategy{right:-34%;bottom:0;width:146vw;height:64%}.case-showcase--hiyogurt .case-showcase__copy{right:24px}}
@media(prefers-reduced-motion:reduce){.case-hero::after{animation:none}.case-placeholder[data-case-media]{clip-path:none;transform:none}.case-media-frame{transition:none}.case-media-frame.is-active{transform:none}}
.case-placeholder[data-case-media]{top:calc(88px + var(--media-stack-offset,0px))}
.case-read-hud{position:fixed;z-index:95;right:24px;bottom:20px;display:flex;align-items:center;gap:12px;color:#888;font-size:10px;letter-spacing:.12em;opacity:0;transition:opacity .35s ease;pointer-events:none}.case-read-hud i{display:block;width:18px;height:1px;background:#999}.case-read-hud b{font-weight:400}.case-sheet-visible .case-read-hud.is-visible{opacity:1}
@media(max-width:900px){.case-read-hud{display:none}}

/* Case-study refinements from annotated references */
:is(.case-page,.web-case-page,.projects-gallery-page) .site-header.case-scrolled{background:transparent!important;border-color:transparent!important;box-shadow:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
.case-block .case-grid>div:first-child::after{display:none!important;content:none!important;box-shadow:none!important}

.case-section-nav{width:250px}
.case-section-nav ol{width:46px;padding:12px 14px;overflow:hidden;border:1px solid transparent;background:transparent;transition:width .42s var(--ease-out),padding .42s var(--ease-out),background .28s ease,border-color .28s ease,box-shadow .32s ease}
.case-section-nav:hover ol,.case-section-nav:focus-within ol,.case-section-nav.is-expanded ol{width:250px;padding:18px 20px;border-color:#e4e4e1;background:rgba(255,255,255,.96);box-shadow:0 20px 55px rgba(0,0,0,.12);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.case-section-nav a,.case-section-nav a.is-active,.case-section-nav a:hover{display:grid;width:210px;height:27px;grid-template-columns:18px 28px minmax(0,1fr);align-items:center;gap:8px;background:none;color:#a4a4a0;text-decoration:none;transition:color .22s ease,transform .3s var(--ease-out)}
.case-section-nav a::before{display:block;width:16px;height:1px;background:currentColor;content:"";transition:width .25s var(--ease-out),background .25s ease}
.case-section-nav a.is-active{color:#4b4b49}
.case-section-nav a.is-active::before,.case-section-nav a:hover::before{width:24px}
.case-section-nav a span,.case-section-nav a em{position:static;width:auto;height:auto;overflow:visible;clip-path:none;white-space:nowrap;opacity:0;font-style:normal;font-size:10px;font-weight:400;line-height:1;letter-spacing:.13em;text-transform:uppercase;transition:opacity .2s ease}
.case-section-nav:hover a span,.case-section-nav:hover a em,.case-section-nav:focus-within a span,.case-section-nav:focus-within a em,.case-section-nav.is-expanded a span,.case-section-nav.is-expanded a em{opacity:1}
.case-section-nav a:hover{color:#111;transform:translateX(3px)}
.case-list-copy{min-width:0}.case-list-copy strong{display:inline;font-weight:500}.case-list-copy strong+*{margin-left:.25em}

.case-related{padding:clamp(120px,14vw,190px) 0;background:#0d0e0f;color:#fff}
.case-related h2{margin:0 0 clamp(64px,8vw,104px);font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(48px,6vw,82px);font-weight:400;line-height:1;text-align:center;letter-spacing:-.035em}
.case-related-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,3vw,48px)}
.case-related-card{display:block;color:#fff}
.case-related-media{position:relative;display:block;aspect-ratio:3/2;overflow:hidden;background:#1a1b1e}
.case-related-media::after{position:absolute;inset:0;border:1px solid rgba(255,255,255,.08);content:"";pointer-events:none}
.case-related-media img{width:100%;height:100%;object-fit:cover;transition:transform .75s var(--ease-out),filter .45s ease}
.case-related-media img.is-contain{object-fit:contain;background:#ece7df}
.case-related-card:hover .case-related-media img{transform:scale(1.035);filter:brightness(.88)}
.case-related-card small{display:block;margin-top:24px;color:rgba(255,255,255,.48);font-size:11px;letter-spacing:.2em;text-transform:uppercase}
.case-related-card strong{display:inline-block;margin-top:12px;font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(26px,2.5vw,38px);font-weight:400;line-height:1.1;letter-spacing:-.025em;transition:transform .35s var(--ease-out)}
.case-related-card:hover strong{transform:translateX(8px)}
.case-contact{margin:0}
.case-contact .contact__inner{width:100%}

@media(max-width:900px){.case-section-nav{display:none}.case-related-grid{grid-template-columns:1fr}.case-related-card+.case-related-card{margin-top:28px}}
@media(max-width:600px){.case-related{padding:104px 0}.case-related h2{margin-bottom:56px;font-size:48px}.case-related-card small{margin-top:18px}.case-related-card strong{font-size:30px}}

/* Recruiter-readable case evidence */
.case-evidence{position:relative;margin-top:72px;padding:clamp(24px,4vw,56px);overflow:hidden;border:1px solid rgba(18,18,18,.1);border-radius:18px;background:#f7f6f2;color:#141414;box-shadow:0 28px 80px rgba(0,0,0,.1);opacity:0;transform:translateY(28px);transition:opacity .7s var(--ease-out),transform .7s var(--ease-out)}
.case-evidence.is-visible{opacity:1;transform:none}
.case-evidence--dark{border-color:rgba(255,255,255,.12);background:#101114;color:#fff}
.case-evidence figcaption{display:flex;max-width:none;margin:0 0 48px;align-items:flex-end;justify-content:space-between;gap:32px;text-align:left}
.case-evidence figcaption span{color:currentColor;font-size:10px;line-height:1.2;letter-spacing:.18em;text-transform:uppercase;opacity:.48}
.case-evidence figcaption strong{max-width:42ch;font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(24px,2.4vw,36px);font-weight:400;line-height:1.08;letter-spacing:-.025em}
.case-evidence img{display:block;max-width:100%}
.case-evidence button{margin:0;padding:0;border:0;background:none;color:inherit;font:inherit;cursor:zoom-in}
.case-journey-strip,.case-validation-notes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:rgba(255,255,255,.15)}
.case-journey-strip article,.case-validation-notes article{min-height:260px;padding:32px;background:#101114}
.case-journey-strip small,.case-validation-notes small,.case-role-row small,.case-improvement-grid small,.case-validation-grid small{color:#8fdd65;font-size:10px;letter-spacing:.16em}
.case-journey-strip h3,.case-validation-notes h3{margin:48px 0 16px;font-size:clamp(22px,2vw,30px);font-weight:500;line-height:1.08}
.case-journey-strip p,.case-validation-notes p{margin:0;color:rgba(255,255,255,.62);font-size:15px;line-height:1.55}
.case-role-flow{padding-bottom:64px}
.case-role-row+.case-role-row{margin-top:80px;padding-top:64px;border-top:1px solid rgba(18,18,18,.12)}
.case-role-row>header{display:flex;margin-bottom:32px;align-items:end;justify-content:space-between;gap:24px}
.case-role-row>header h3{margin:0;font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(30px,4vw,54px);font-weight:400;letter-spacing:-.03em}
.case-device-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,3vw,40px)}
.case-device-grid article{min-width:0}
.case-device{--device-h:520px;position:relative;display:block;width:100%;height:var(--device-h);overflow:hidden;border:1px solid rgba(18,18,18,.12)!important;border-radius:26px!important;background:#e9e7e1!important;box-shadow:0 16px 40px rgba(0,0,0,.12);cursor:ns-resize!important}
.case-device::after{position:absolute;inset:0;border:8px solid #141414;border-radius:26px;content:"";pointer-events:none}
.case-device img{width:100%;height:auto;min-height:100%;object-fit:cover;object-position:top;transition:transform 2.8s cubic-bezier(.22,1,.36,1)}
.case-device:hover img,.case-device:focus-visible img{transform:translateY(calc(-100% + var(--device-h)))}
.case-device-grid p{display:grid;margin:20px 0 0;grid-template-columns:28px 1fr;gap:12px;color:#5e5c58;font-size:14px;line-height:1.5}
.case-device-grid p b{color:#171717;font-weight:500}
.case-improvement-grid,.case-validation-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.case-improvement-grid article,.case-validation-grid article{min-width:0}
.case-improvement-shot,.case-validation-grid button{display:block;width:100%;height:clamp(360px,36vw,560px);overflow:hidden;border:1px solid rgba(18,18,18,.1)!important;border-radius:12px!important;background:#fff!important}
.case-improvement-shot img,.case-validation-grid button img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .7s var(--ease-out)}
.case-improvement-shot:hover img,.case-validation-grid button:hover img{transform:scale(1.02)}
.case-improvement-grid small,.case-validation-grid small{display:block;margin-top:24px;color:#5f7950}
.case-improvement-grid h3{margin:10px 0 12px;font-size:22px;font-weight:500;line-height:1.1}
.case-improvement-grid p,.case-validation-grid p{margin:0;color:#62615d;font-size:14px;line-height:1.55}
.case-component-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px;align-items:start}
.case-component-grid article{grid-column:span 4;display:flex;min-height:260px;padding:24px;flex-direction:column;justify-content:space-between;border:1px solid rgba(18,18,18,.1);border-radius:12px;background:#fff}
.case-component-grid article:nth-child(2){grid-column:span 3}.case-component-grid article:nth-child(3){grid-column:span 5}
.case-component-grid .case-component-grid__tall{grid-column:4/span 6;max-height:680px;overflow:hidden}
.case-component-grid img{width:100%;height:auto;max-height:520px;object-fit:contain;object-position:top}
.case-component-grid p{margin:20px 0 0;color:#77736d;font-size:11px;letter-spacing:.14em;text-transform:uppercase}
.case-research-grid{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(280px,1fr);gap:24px;align-items:start}
.case-research-grid article{overflow:hidden;border:1px solid rgba(18,18,18,.1);border-radius:12px;background:#fff}
.case-research-grid img{width:100%;height:auto}
.case-research-grid p{margin:0;padding:16px 20px;color:#66635e;font-size:12px;line-height:1.4}
.case-decision-chain{display:grid;margin-bottom:32px;grid-template-columns:repeat(5,auto);align-items:center;gap:20px}
.case-decision-chain article{min-height:180px;padding:28px;border:1px solid rgba(255,255,255,.14);border-radius:12px}
.case-decision-chain small{color:#8fdd65;font-size:10px;letter-spacing:.15em}
.case-decision-chain h3{margin:52px 0 0;font-size:clamp(20px,1.8vw,27px);font-weight:500;line-height:1.1}
.case-decision-chain>i{font-style:normal;opacity:.35}
.case-flow-preview{display:block;width:100%;max-height:620px;overflow:hidden;border-radius:12px!important;background:#fff!important}
.case-flow-preview img{width:100%;height:auto;transform:translateY(0);transition:transform 3s cubic-bezier(.22,1,.36,1)}
.case-flow-preview:hover img,.case-flow-preview:focus-visible img{transform:translateY(calc(-100% + 620px))}
.case-phone-sequence{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,5vw,72px);align-items:end;text-align:center}
.case-phone-sequence article{position:relative;padding:28px 28px 20px;border:1px solid rgba(18,18,18,.1);border-radius:28px;background:#eeece6}
.case-phone-sequence img{width:100%;max-width:240px;margin:0 auto;filter:drop-shadow(0 18px 24px rgba(0,0,0,.14));transition:transform .6s var(--ease-out)}
.case-phone-sequence article:hover img{transform:translateY(-10px)}
.case-phone-sequence span{display:block;margin-top:24px;color:#658653;font-size:11px;letter-spacing:.18em}
.case-phone-sequence h3{margin:8px 0 0;font-family:'Sulphur Point',Arial,sans-serif;font-size:28px;font-weight:400}
.case-sequence--four{grid-template-columns:repeat(4,minmax(0,1fr))}
.case-phone-sequence--four{grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,2.2vw,30px)}
.case-phone-sequence--four article{padding:20px 14px 18px;border-radius:22px}
.case-phone-sequence--four img{max-width:210px}
.case-phone-sequence--four h3{font-size:22px}
.case-evidence--hifi{background:linear-gradient(145deg,#f8eee7,#e4f1f6)}
.case-prototype-film{background:#0c0d0f;color:#fff}
.case-prototype-film__stage{position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.14);border-radius:14px;background:#000;box-shadow:0 32px 80px rgba(0,0,0,.36)}
.case-prototype-film__stage video{display:block;width:100%;aspect-ratio:3024/1964;background:#000;object-fit:contain}
.case-prototype-film__chapters{display:grid;margin:22px 0 0;padding:0;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;list-style:none;background:rgba(255,255,255,.12)}
.case-prototype-film__chapters li{display:flex;padding:16px 18px;align-items:center;gap:12px;background:#111317;color:rgba(255,255,255,.72);font-size:12px;letter-spacing:.04em}
.case-prototype-film__chapters span{color:#8fdd65;font-size:10px;letter-spacing:.14em}
.case-role-films-section{min-height:auto}
.case-role-films{background:#0d0f12;color:#fff}
.case-role-films__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,3vw,40px)}
.case-role-films__grid>article{min-width:0}
.case-role-films__grid header{min-height:210px;padding:28px;border:1px solid rgba(255,255,255,.11);border-bottom:0;border-radius:14px 14px 0 0;background:#14161a}
.case-role-films__grid small{color:#8fdd65;font-size:10px;letter-spacing:.16em}
.case-role-films__grid h3{max-width:16ch;margin:40px 0 12px;font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(26px,2.5vw,38px);font-weight:400;line-height:1.05;letter-spacing:-.025em}
.case-role-films__grid p{max-width:52ch;margin:0;color:rgba(255,255,255,.58);font-size:14px;line-height:1.55}
.case-role-film{overflow:hidden;border:1px solid rgba(255,255,255,.11);border-radius:0 0 14px 14px;background:#050506}
.case-role-film video{display:block;width:100%;aspect-ratio:16/10;background:#050506;object-fit:contain}
.case-evidence-sources{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.case-evidence-sources article{min-width:0;padding:18px;border:1px solid rgba(17,17,17,.12);border-radius:14px;background:#f5f4ef}
.case-evidence-sources button,.case-priority-board,.case-iteration-grid button,.case-style-grid button{display:block;width:100%;padding:0;overflow:hidden;border:0;border-radius:9px;background:#deddd8;cursor:pointer}
.case-evidence-sources button{height:340px}
.case-evidence-sources img,.case-priority-board img,.case-iteration-grid img,.case-style-grid img{display:block;width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .7s var(--ease-out),filter .35s ease}
.case-evidence-sources button:hover img,.case-priority-board:hover img,.case-iteration-grid button:hover img,.case-style-grid button:hover img{transform:scale(1.025);filter:brightness(.94)}
.case-evidence-sources small,.case-iteration-grid small,.case-style-grid small{display:block;margin-top:20px;color:#666;font-size:9px;letter-spacing:.17em}
.case-evidence-sources h3,.case-iteration-grid h3,.case-style-grid h3{margin:10px 0 8px;font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(23px,2.1vw,32px);font-weight:400;line-height:1.05;letter-spacing:-.025em}
.case-evidence-sources p,.case-iteration-grid p{margin:0;color:#5b5b57;font-size:14px;line-height:1.55}
.case-priority-grid{display:grid;margin-top:28px;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;overflow:hidden;border:1px solid rgba(17,17,17,.12);border-radius:14px;background:rgba(17,17,17,.12)}
.case-priority-grid article{padding:26px;background:#f5f4ef}.case-priority-grid span{font-size:10px;letter-spacing:.16em}.case-priority-grid h3{margin:32px 0 12px;font-size:20px}.case-priority-grid p{margin:0;color:#666;font-size:14px;line-height:1.5}
.case-priority-board{height:300px;margin-top:28px;border:1px solid rgba(17,17,17,.12)}
.case-iteration-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.case-iteration-grid article{min-width:0}.case-iteration-grid button{height:520px;border:1px solid rgba(17,17,17,.1);background:#fff}.case-iteration-grid p{padding-right:8px}
.case-style-directions{background:#171411;color:#fff}
.case-style-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.case-style-grid article{min-width:0}.case-style-grid button{aspect-ratio:4/3;border:1px solid rgba(255,255,255,.12);background:#24211e}.case-style-grid small{color:#bdac9b}.case-style-grid h3{color:#fff}
.case-style-directions figcaption span{color:#cf9f77}.case-style-directions figcaption strong{color:#fff}
.case-validation-grid button{height:clamp(260px,25vw,380px)}
.case-validation-grid small{margin-top:20px}.case-validation-grid p{margin-top:10px}
.case-workflow-map{display:flex;margin-bottom:40px;align-items:center;justify-content:space-between;gap:12px;overflow-x:auto}
.case-workflow-map span{padding:12px 16px;border:1px solid rgba(255,255,255,.18);border-radius:999px;font-size:11px;white-space:nowrap;letter-spacing:.08em;text-transform:uppercase}
.case-workflow-map i{font-style:normal;opacity:.35}
.case-wide-screen{width:100%;border-radius:10px;background:#fff}
.case-redaction-note{display:grid;margin-bottom:32px;padding:24px;grid-template-columns:140px 1fr;gap:24px;border:1px solid rgba(18,18,18,.14);border-radius:10px}
.case-redaction-note b{font-family:monospace;font-size:13px;letter-spacing:.18em}
.case-redaction-note p{margin:0;color:#5e5c58;font-size:14px;line-height:1.55}
.case-screen-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.case-screen-pair img{width:100%;border:1px solid rgba(18,18,18,.1);border-radius:10px}
.case-screen-rail{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.case-screen-rail article{min-width:0;overflow:hidden;border:1px solid rgba(18,18,18,.1);border-radius:12px;background:#fff}
.case-screen-rail img{width:100%;transition:transform .6s var(--ease-out)}
.case-screen-rail article:hover img{transform:scale(1.025)}
.case-screen-rail p{display:grid;margin:0;padding:18px 20px;grid-template-columns:24px 1fr;gap:10px;color:#5e5c58;font-size:13px;line-height:1.45}
.case-screen-rail b{color:#171717}
.case-lightbox{position:fixed;z-index:999;inset:0;display:grid;padding:32px;place-items:center;background:rgba(4,5,7,.9);opacity:0;pointer-events:none;transition:opacity .25s ease;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.case-lightbox.is-open{opacity:1;pointer-events:auto}
.case-lightbox__stage{position:relative;display:grid;width:min(1400px,94vw);height:min(900px,88vh);place-items:center}
.case-lightbox img{max-width:100%;max-height:100%;object-fit:contain;filter:drop-shadow(0 30px 70px rgba(0,0,0,.35))}
.case-lightbox button{position:absolute;z-index:2;top:0;right:0;width:44px;height:44px;border:1px solid rgba(255,255,255,.25);border-radius:50%;background:rgba(0,0,0,.35);color:#fff;font-size:26px;cursor:pointer}
@media(max-width:900px){.case-evidence{margin-top:56px}.case-evidence figcaption{align-items:flex-start;flex-direction:column}.case-journey-strip,.case-validation-notes,.case-improvement-grid,.case-validation-grid{grid-template-columns:1fr}.case-device-grid{gap:16px}.case-device{--device-h:420px}.case-decision-chain{grid-template-columns:1fr}.case-decision-chain>i{transform:rotate(90deg);text-align:center}.case-component-grid{grid-template-columns:1fr}.case-component-grid article,.case-component-grid article:nth-child(2),.case-component-grid article:nth-child(3),.case-component-grid .case-component-grid__tall{grid-column:auto}.case-research-grid{grid-template-columns:1fr}.case-phone-sequence{gap:16px}.case-sequence--four{grid-template-columns:repeat(2,minmax(0,1fr))}.case-phone-sequence--four{display:flex;margin-right:calc((100vw - 100%)/-2);padding-right:24px;overflow-x:auto;scroll-snap-type:x mandatory}.case-phone-sequence--four article{min-width:min(58vw,300px);scroll-snap-align:start}.case-prototype-film__chapters{grid-template-columns:repeat(2,minmax(0,1fr))}.case-screen-rail{display:flex;margin-right:calc((100vw - 100%)/-2);padding-right:24px;overflow-x:auto;scroll-snap-type:x mandatory}.case-screen-rail article{min-width:min(78vw,620px);scroll-snap-align:start}}
@media(max-width:600px){.case-evidence{width:calc(100% - 32px);margin-top:48px;padding:24px;border-radius:12px}.case-evidence figcaption{margin-bottom:32px}.case-device-grid{display:flex;margin-right:-24px;padding-right:24px;overflow-x:auto;scroll-snap-type:x mandatory}.case-device-grid article{min-width:74vw;scroll-snap-align:start}.case-device{--device-h:460px}.case-role-row>header{align-items:flex-start;flex-direction:column}.case-phone-sequence{grid-template-columns:1fr}.case-phone-sequence article{padding:24px}.case-screen-pair{grid-template-columns:1fr}.case-workflow-map{justify-content:flex-start}.case-redaction-note{grid-template-columns:1fr}.case-lightbox{padding:12px}.case-lightbox__stage{width:96vw;height:92vh}}
@media(max-width:600px){.case-sequence--four{grid-template-columns:1fr}.case-phone-sequence--four{display:flex}.case-phone-sequence--four article{min-width:76vw;padding:20px 14px}.case-prototype-film__chapters{grid-template-columns:1fr}.case-prototype-film__stage{margin-right:-12px;margin-left:-12px;border-radius:10px}}
@media(max-width:900px){.case-role-films__grid{grid-template-columns:1fr}.case-role-films__grid header{min-height:0}.case-role-films__grid h3{margin-top:32px}}
@media(max-width:900px){.case-iteration-grid{grid-template-columns:1fr}.case-iteration-grid button{height:min(72vh,720px)}.case-style-grid{grid-template-columns:1fr}.case-style-grid button{aspect-ratio:4/3}.case-priority-grid{grid-template-columns:1fr}.case-evidence-sources button{height:280px}}
@media(max-width:640px){.case-evidence-sources{grid-template-columns:1fr}.case-evidence-sources button{height:300px}.case-priority-board{height:240px}.case-iteration-grid button{height:64vh;min-height:430px}.case-style-grid{gap:34px}}
@media(prefers-reduced-motion:reduce){.featured-mockup.is-entering,.featured-mockup.is-entering .featured-mockup__device{animation:none}}
@media(prefers-reduced-motion:reduce){.case-evidence{opacity:1;transform:none}.case-device:hover img,.case-device:focus-visible img,.case-flow-preview:hover img,.case-flow-preview:focus-visible img{transform:none}}

/* Keep the case-study narrative genuinely single-column on tablets and phones.
   This sits after the desktop case-block override so its specificity wins. */
@media(max-width:900px){
  .case-block .case-grid{grid-template-columns:minmax(0,1fr);gap:48px}
}
@media(max-width:600px){
  .case-cover-label h2{max-width:100%;font-size:clamp(48px,14vw,68px);overflow-wrap:anywhere}
}

/* Focused before/after evidence: interface first, explanation outside the image. */
.case-compare{min-width:0}
.case-compare__stage{position:relative;height:clamp(360px,38vw,600px);overflow:hidden;border:1px solid rgba(18,18,18,.1);border-radius:14px;background:#ebe8e1}
.case-compare__stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transform:scale(.985);transition:opacity .65s ease,transform .85s var(--ease-out)}
.case-compare[data-active="before"] [data-compare-panel="before"],.case-compare[data-active="after"] [data-compare-panel="after"]{z-index:1;opacity:1;transform:scale(1)}
.case-compare__controls{position:relative;display:grid;width:100%;margin-top:12px;padding:4px;grid-template-columns:1fr 1fr;gap:4px;overflow:hidden;border:1px solid rgba(18,18,18,.12);border-radius:999px;background:rgba(255,255,255,.76)}
.case-evidence .case-compare__controls button,.case-validation-grid .case-compare__controls button{position:relative;z-index:1;display:block;width:auto;height:38px;padding:0 18px;overflow:visible;border:0!important;border-radius:999px!important;background:transparent!important;color:#77736d;font:500 11px/1 'Blinker',Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.case-compare__controls button[aria-pressed="true"]{background:#171717!important;color:#fff!important}
.case-compare__controls i{position:absolute;right:8px;bottom:3px;left:8px;z-index:2;height:2px;overflow:hidden;border-radius:2px;background:rgba(17,17,17,.1);pointer-events:none}
.case-compare__controls i::after{display:block;width:100%;height:100%;background:#8fdd65;content:"";transform:scaleX(0);transform-origin:left}
.case-compare.is-ticking .case-compare__controls i::after{animation:caseCompareProgress 3.6s linear infinite}
@keyframes caseCompareProgress{to{transform:scaleX(1)}}

.case-iteration-list{display:grid;gap:clamp(48px,7vw,92px)}
.case-iteration-list>article{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(260px,.7fr);align-items:center;gap:clamp(32px,5vw,72px)}
.case-iteration-list>article+article{padding-top:clamp(48px,7vw,92px);border-top:1px solid rgba(18,18,18,.12)}
.case-iteration-copy small{color:#5f7950;font-size:10px;letter-spacing:.17em}
.case-iteration-copy h3{margin:18px 0 28px;font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(32px,3.6vw,52px);font-weight:400;line-height:1;letter-spacing:-.03em}
.case-iteration-copy p{margin:0;color:#5b5b57;font-size:15px;line-height:1.65}
.case-iteration-copy p+p{margin-top:18px}
.case-iteration-copy b{color:#171717;font-weight:500}
.case-block--raised .case-iteration-copy h3{color:#fff}
.case-block--raised .case-iteration-copy p{color:rgba(255,255,255,.66)}
.case-block--raised .case-iteration-copy b{color:#fff}
.case-block--raised .case-iteration-list>article+article{border-top-color:rgba(255,255,255,.14)}

.case-finding-grid{display:grid;margin-top:64px;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;overflow:hidden;border:1px solid rgba(18,18,18,.12);border-radius:16px;background:rgba(18,18,18,.12)}
.case-finding-grid article{min-height:250px;padding:clamp(26px,3vw,40px);background:#f6f4ef}
.case-finding-grid span{font-size:10px;letter-spacing:.18em}
.case-finding-grid h3{max-width:22ch;margin:56px 0 14px;font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(25px,2.5vw,36px);font-weight:400;line-height:1.05;letter-spacing:-.025em}
.case-finding-grid p{max-width:52ch;margin:0;color:#62615d;font-size:14px;line-height:1.58}

.case-evidence--system{background:#ebe7df}
.case-system-family+.case-system-family{margin-top:72px;padding-top:64px;border-top:1px solid rgba(18,18,18,.14)}
.case-system-family>header{display:flex;margin-bottom:32px;align-items:flex-end;justify-content:space-between;gap:32px}
.case-system-family>header small{font-size:10px;letter-spacing:.17em}
.case-system-family>header h3{max-width:18ch;margin:0;font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(28px,3vw,44px);font-weight:400;line-height:1.02;letter-spacing:-.03em}
.case-system-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.case-system-grid article{min-width:0;padding:16px 16px 24px;border:1px solid rgba(18,18,18,.1);border-radius:14px;background:#f8f7f3}
.case-system-grid article>div{display:grid;width:100%;aspect-ratio:4/5;margin-bottom:22px;place-items:center;overflow:hidden;border-radius:9px;background:#efede7}
.case-system-grid img{width:100%;height:100%;object-fit:contain;transition:transform .6s var(--ease-out)}
.case-system-grid article:hover img{transform:translateY(-5px)}
.case-system-grid article>small{color:#5f7950;font-size:9px;letter-spacing:.16em}
.case-system-grid article>p{margin:10px 0 0;color:#65625d;font-size:13px;line-height:1.5}

.case-validation-grid .case-compare__stage{height:clamp(300px,25vw,390px)}
.case-validation-grid .case-compare__stage img{object-fit:contain}
.case-validation-grid h3{margin:10px 0 0;font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(24px,2.3vw,32px);font-weight:400;line-height:1.08}

@media(max-width:900px){
  .case-iteration-list>article{grid-template-columns:1fr}
  .case-iteration-copy{max-width:640px}
  .case-system-grid{grid-template-columns:1fr}
  .case-system-grid article>div{aspect-ratio:16/10}
  .case-system-family>header{align-items:flex-start;flex-direction:column}
}
@media(max-width:600px){
  .case-compare__stage{height:min(68vh,520px)}
  .case-finding-grid{grid-template-columns:1fr}
  .case-finding-grid article{min-height:220px}
  .case-system-family+.case-system-family{margin-top:52px;padding-top:48px}
  .case-system-grid article>div{aspect-ratio:4/3}
}
@media(prefers-reduced-motion:reduce){
  .case-compare__stage img,.case-system-grid img{transition:none}
  .case-compare.is-ticking .case-compare__controls i::after{animation:none}
}

/* Transparent case-study section rail: color and type carry the hierarchy. */
.case-section-nav{width:252px}
.case-section-nav ol{width:48px;padding:13px 14px;border:1px solid color-mix(in srgb,var(--case-accent,#8fdd65) 54%,transparent);border-radius:20px;background:transparent;box-shadow:0 10px 32px rgba(0,0,0,.08);mix-blend-mode:difference;-webkit-backdrop-filter:blur(8px) saturate(1.2);backdrop-filter:blur(8px) saturate(1.2)}
.case-section-nav:hover ol,.case-section-nav:focus-within ol,.case-section-nav.is-expanded ol{width:244px;padding:18px 20px;border-color:var(--case-accent,#8fdd65);border-radius:22px;background:transparent;box-shadow:0 16px 42px rgba(0,0,0,.16),inset 0 0 0 1px rgba(0,0,0,.16);-webkit-backdrop-filter:blur(10px) saturate(1.3);backdrop-filter:blur(10px) saturate(1.3)}
.case-section-nav a,.case-section-nav a.is-active,.case-section-nav a:hover{width:204px;color:rgba(255,255,255,.92);text-shadow:none}
.case-section-nav a::before{background:var(--case-accent,#8fdd65);box-shadow:0 0 12px color-mix(in srgb,var(--case-accent,#8fdd65) 68%,transparent);opacity:.58}
.case-section-nav a span{color:var(--case-accent,#8fdd65);font-variant-numeric:tabular-nums}
.case-section-nav a em{color:#fff}
.case-section-nav a.is-active,.case-section-nav a:hover{color:var(--case-accent,#8fdd65)}
.case-section-nav a.is-active::before,.case-section-nav a:hover::before{opacity:1}
.case-section-nav a.is-active em,.case-section-nav a:hover em{color:var(--case-accent,#8fdd65)}

/* Hi Yogurt: use real strategy artifacts as evidence, with honest result framing. */
.hiyo-diagnosis{background:#12130f}
.hiyo-diagnosis-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;overflow:hidden;border:1px solid rgba(255,255,255,.13);border-radius:14px;background:rgba(255,255,255,.13)}
.hiyo-diagnosis-grid article{min-height:280px;padding:32px;background:#151712}
.hiyo-diagnosis-grid small{color:#ffb13b;font-size:10px;letter-spacing:.17em}
.hiyo-diagnosis-grid h3{max-width:19ch;margin:56px 0 14px;font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(27px,2.7vw,38px);font-weight:400;line-height:1.05;letter-spacing:-.025em}
.hiyo-diagnosis-grid p{max-width:48ch;margin:0;color:rgba(255,255,255,.6);font-size:14px;line-height:1.55}
.hiyo-artifact{background:#f7f4ed}
.case-evidence.hiyo-artifact button{display:block;width:100%;overflow:hidden;border:1px solid rgba(25,28,21,.1);border-radius:12px;background:#fff;cursor:zoom-in}
.hiyo-artifact button img{width:100%;height:auto;transition:transform .7s var(--ease-out),filter .35s ease}
.hiyo-artifact button:hover img,.hiyo-artifact button:focus-visible img{transform:scale(1.012);filter:contrast(1.015)}
.hiyo-campaign{background:linear-gradient(135deg,#fff2df,#e8f8fb)}

/* Hi Yogurt homepage cover: one campaign result with two supporting strategy artifacts. */
.featured-mockup.is-hiyogurt{background:radial-gradient(circle at 78% 18%,rgba(255,255,255,.28),transparent 24%),linear-gradient(145deg,#f6bd3d,#ed7954 62%,#a94e45)}
.featured-mockup.is-hiyogurt .featured-strategy-board{display:none}
.featured-mockup.is-hiyogurt .featured-mockup__device{display:block;height:auto;overflow:hidden;border:1px solid rgba(255,255,255,.28);border-radius:14px;background:#fff;box-shadow:0 28px 72px rgba(69,29,14,.3)}
.featured-mockup.is-hiyogurt .featured-mockup__chrome{display:none}
.featured-mockup.is-hiyogurt .featured-mockup__device img{height:100%;object-fit:cover}
.featured-mockup.is-hiyogurt .featured-mockup__device--primary{z-index:4;top:8%;left:11%;width:62%;aspect-ratio:16/9;transform:rotate(-1.5deg)}
.featured-mockup.is-hiyogurt .featured-mockup__device--secondary{z-index:3;top:15%;right:7%;left:auto;width:34%;aspect-ratio:3/2;transform:rotate(3.5deg)}
.featured-mockup.is-hiyogurt .featured-mockup__device--tertiary{z-index:5;top:44%;right:14%;width:36%;aspect-ratio:3/2;transform:rotate(-2.5deg)}
.case-showcase--hiyogurt{background:radial-gradient(circle at 18% 20%,rgba(255,255,255,.22),transparent 24%),linear-gradient(135deg,#ee8b3f,#f3bb45 50%,#b95349)}
.case-showcase__strategy{right:-3%;bottom:-5%;width:min(76vw,1160px);height:68%;border:1px solid rgba(255,255,255,.3);border-radius:30px 0 0 0;background:#fff;box-shadow:0 38px 100px rgba(75,28,14,.35)!important;transform:translate3d(var(--cover-x,0),var(--cover-y,0),0) rotate(-1deg);transition:transform .25s ease-out}
.case-showcase__strategy img{object-fit:cover;object-position:center}

@media(max-width:900px){
  .hiyo-diagnosis-grid{grid-template-columns:1fr}
  .hiyo-diagnosis-grid article{min-height:240px}
}
@media(max-width:700px){
  .case-showcase__strategy{right:-44%;bottom:3%;width:156vw;height:52%;border-radius:20px 0 0 0}
  .featured-mockup.is-hiyogurt .featured-mockup__device--primary{top:10%;left:6%;width:80%}
  .featured-mockup.is-hiyogurt .featured-mockup__device--secondary{top:36%;right:3%;width:48%}
  .featured-mockup.is-hiyogurt .featured-mockup__device--tertiary{top:47%;right:42%;width:48%}
}

@media(max-width:900px){
  .featured-mockup__device--primary{top:12%;left:8%;width:84%;height:52%}
  .featured-mockup__device--secondary{top:29%;left:-8%;width:48%;height:38%}
  .featured-mockup__device--tertiary{top:30%;right:-8%;width:45%;height:37%}
  .featured-mockup.is-ourjourneyman .featured-mockup__device,.featured-mockup.is-snapbudget .featured-mockup__device{width:auto;height:62%;aspect-ratio:440/956}
  .featured-mockup.is-ourjourneyman .featured-mockup__device--primary,.featured-mockup.is-snapbudget .featured-mockup__device--primary{top:8%;left:50%;transform:translateX(-50%)}
  .featured-mockup.is-ourjourneyman .featured-mockup__device--secondary,.featured-mockup.is-snapbudget .featured-mockup__device--secondary{top:17%;left:-2%}
  .featured-mockup.is-ourjourneyman .featured-mockup__device--tertiary,.featured-mockup.is-snapbudget .featured-mockup__device--tertiary{top:17%;right:-2%}
  .featured-strategy-board{inset:10% 7% 28%;padding:30px}.featured-strategy-board>div{display:none}
}

/* Geeelink: product model → high-fidelity proof */
.case-product-decisions{display:grid;margin-bottom:32px;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:rgba(18,18,18,.12)}
.case-product-decisions article{min-height:220px;padding:28px;background:#fff}
.case-product-decisions small{color:#d55e20;font-size:10px;letter-spacing:.16em}
.case-product-decisions h3{margin:42px 0 12px;font-size:23px;font-weight:500;line-height:1.08}
.case-product-decisions p{margin:0;color:#65615c;font-size:14px;line-height:1.5}
.case-hifi-hero{display:block;width:100%;overflow:hidden;border:1px solid rgba(18,18,18,.12)!important;border-radius:12px!important;background:#0c0c0d!important;box-shadow:0 26px 70px rgba(0,0,0,.18)}
.case-hifi-hero img{width:100%;transition:transform .7s var(--ease-out)}.case-hifi-hero:hover img{transform:scale(1.012)}
.case-hifi-grid{display:grid;margin-top:24px;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.case-hifi-grid article{min-width:0}.case-hifi-grid button{display:block;width:100%;overflow:hidden;border:1px solid rgba(18,18,18,.1)!important;border-radius:10px!important;background:#0c0c0d!important}
.case-hifi-grid img{width:100%;transition:transform .65s var(--ease-out)}.case-hifi-grid button:hover img{transform:scale(1.018)}
.case-hifi-grid p{display:grid;margin:16px 0 0;grid-template-columns:28px 1fr;gap:10px;color:#66615c;font-size:13px;line-height:1.5}.case-hifi-grid p b{color:#171717}
.case-prototype-proof{display:grid;margin-top:28px;padding:24px;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:24px;border:1px solid rgba(255,255,255,.14);border-radius:10px;background:rgba(255,255,255,.04)}
.case-prototype-proof span{color:#8fdd65;font-size:10px;letter-spacing:.16em}.case-prototype-proof p{margin:0;color:rgba(255,255,255,.62);font-size:13px;line-height:1.5}.case-prototype-proof a{padding:10px 14px;border:1px solid rgba(255,255,255,.22);border-radius:999px;color:#fff;font-size:11px;white-space:nowrap;transition:background .25s ease,color .25s ease}.case-prototype-proof a:hover{background:#fff;color:#111}
@media(max-width:900px){.case-product-decisions{grid-template-columns:1fr}.case-product-decisions article{min-height:0}.case-hifi-grid{grid-template-columns:1fr}.case-prototype-proof{grid-template-columns:1fr;align-items:start}.case-prototype-proof a{justify-self:start}}

/* 2026-08-31 · A clearer creative ecosystem: AI lab, art wall, and a human About page. */
.beyond-screen{overflow:hidden;background:#09090a}
.beyond-screen__intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,580px);align-items:end;gap:64px;padding-bottom:56px}
.beyond-screen__intro .section-description{margin:0;color:rgba(255,255,255,.62);font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(18px,2vw,25px);line-height:1.45}
.art-wall{display:grid;padding-top:0;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(32px,5vw,72px) 32px}
.art-piece{position:relative;min-width:0;margin:0;text-align:left}
button.art-piece,.art-piece button{display:block;width:100%;color:#fff;cursor:zoom-in}
.art-piece img{width:100%;height:100%;background:#151515;object-fit:cover;transition:filter .45s ease,transform .8s var(--ease-out)}
.art-piece button{overflow:hidden}
.art-piece>span,.art-piece>div+span{display:flex;align-items:baseline;justify-content:space-between;gap:24px;margin-top:16px}
.art-piece b{font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(20px,2vw,30px);font-weight:400}
.art-piece small{color:rgba(255,255,255,.42);font-size:11px;letter-spacing:.12em;text-transform:uppercase}
.art-piece:hover img,.art-piece:focus-visible img,.art-piece button:hover img,.art-piece button:focus-visible img{filter:saturate(1.08) contrast(1.03);transform:scale(1.018)}
.art-piece--hero{grid-column:1/9}.art-piece--hero img{aspect-ratio:1.25;object-position:center 47%}
.art-piece--fold{grid-column:9/13;align-self:end}.art-piece--fold img{aspect-ratio:.82;object-position:center}
.art-piece--blood{display:grid;grid-column:1/13;grid-template-columns:minmax(0,1.45fr) minmax(280px,.55fr);align-items:center;gap:clamp(48px,8vw,120px);padding-block:clamp(80px,12vw,160px)}
.art-piece--blood button{border-radius:2px}.art-piece--blood img{aspect-ratio:4/3;object-fit:cover}
.art-piece--blood h3{margin:8px 0 24px;font-family:Blinker,Arial,sans-serif;font-size:clamp(54px,8vw,112px);font-weight:400;line-height:.82;letter-spacing:-.045em}
.art-piece--blood p:not(.eyebrow){margin:0 0 28px;color:rgba(255,255,255,.62);font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(18px,2vw,24px);line-height:1.5}
.art-piece--lanterns{display:grid;grid-column:1/8;grid-template-columns:1fr 1fr;gap:16px}.art-piece--lanterns img{aspect-ratio:1.35;object-fit:cover}.art-piece--lanterns>span{grid-column:1/-1}
.art-piece--sculpture{display:grid;grid-column:8/13;grid-template-columns:1.15fr .85fr;align-content:start;gap:16px}.art-piece--sculpture img{aspect-ratio:.82;object-fit:cover}.art-piece--sculpture>span{grid-column:1/-1}
.art-lightbox{position:fixed;z-index:1000;inset:0;display:grid;padding:32px;place-items:center;background:rgba(4,4,5,.92);opacity:0;pointer-events:none;transition:opacity .35s ease;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}
.art-lightbox.is-open{opacity:1;pointer-events:auto}.lightbox-open{overflow:hidden}
.art-lightbox__stage{position:relative;display:grid;width:min(1400px,94vw);height:min(900px,90vh);grid-template-rows:minmax(0,1fr) auto;place-items:center}
.art-lightbox__stage>button{position:absolute;z-index:2;top:0;right:0;width:48px;height:48px;border:1px solid rgba(255,255,255,.25);border-radius:50%;background:rgba(0,0,0,.4);font-size:28px}
.art-lightbox__stage img{max-width:100%;max-height:calc(90vh - 72px);object-fit:contain;filter:drop-shadow(0 30px 70px rgba(0,0,0,.4))}
.art-lightbox__stage>div{display:flex;width:100%;justify-content:space-between;gap:24px;padding-top:16px;border-top:1px solid rgba(255,255,255,.14)}
.art-lightbox__stage strong{font-family:'Sulphur Point',Arial,sans-serif;font-size:22px;font-weight:400}.art-lightbox__stage span{color:rgba(255,255,255,.48);font-size:11px;letter-spacing:.12em;text-transform:uppercase}
.process-section{background:#000!important}.process-section .section-shell{padding-block:var(--section)}.process-section .process{margin:0}
.home-about{background:#0e0e10}.home-about__grid{display:grid;grid-template-columns:minmax(320px,.8fr) minmax(0,1.2fr);align-items:center;gap:clamp(56px,9vw,140px)}
.home-about__image{margin:0;overflow:hidden;border-radius:4px}.home-about__image img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:64% center;transition:transform 1s var(--ease-out)}.home-about__image:hover img{transform:scale(1.025)}
.home-about__copy h2{max-width:12ch;margin:0;font-family:Blinker,Arial,sans-serif;font-size:clamp(46px,6.5vw,92px);font-weight:400;line-height:.93;letter-spacing:-.045em}
.home-about__copy>p:not(.eyebrow){max-width:46ch;margin:36px 0;color:rgba(255,255,255,.62);font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(18px,2vw,24px);line-height:1.5}
.about-page-link{position:relative;display:inline-flex;align-items:center;gap:12px;padding-bottom:7px;font-size:14px;letter-spacing:.06em}.about-page-link::after{position:absolute;right:0;bottom:0;left:0;height:1px;background:currentColor;content:"";transform-origin:left;transition:transform .35s var(--ease-out)}.about-page-link:hover::after{transform:scaleX(.36)}

/* About page */
.about-page{--about-rose:#d79ab2;--about-blue:#b7d7e8;background:#080809;color:#fff}
.about-page .site-header [aria-current="page"]{color:#fff}
.about-hero{display:grid;min-height:100svh;padding:132px max(24px,calc((100vw - var(--container-page))/2)) 80px;grid-template-columns:minmax(320px,.78fr) minmax(0,1.22fr);align-items:center;gap:clamp(56px,8vw,120px);overflow:hidden;background:radial-gradient(circle at 82% 28%,rgba(183,215,232,.12),transparent 32%),#080809}
.about-hero__copy h1{max-width:10ch;margin:0;font-family:Blinker,Arial,sans-serif;font-size:clamp(58px,7.7vw,116px);font-weight:400;line-height:.84;letter-spacing:-.052em}
.about-hero__copy>p:not(.eyebrow){max-width:53ch;margin:36px 0 0;color:rgba(255,255,255,.65);font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(18px,1.8vw,23px);line-height:1.55}
.about-hero__links{display:flex;flex-wrap:wrap;gap:24px 40px;margin-top:40px}.about-hero__links a{padding-bottom:6px;border-bottom:1px solid rgba(255,255,255,.32);font-size:13px;letter-spacing:.05em;transition:border-color .25s ease,color .25s ease}.about-hero__links a:hover{border-color:var(--about-rose);color:var(--about-rose)}
.about-hero__portraits{position:relative;min-height:min(66vw,720px)}
.about-portrait{position:absolute;margin:0;overflow:hidden;background:#171719;box-shadow:0 32px 80px rgba(0,0,0,.38)}.about-portrait img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease-out)}.about-portrait:hover img{transform:scale(1.025)}
.about-portrait--landscape{top:4%;right:0;width:84%;height:65%;border-radius:4px}.about-portrait--landscape img{object-position:center}
.about-portrait--garden{bottom:0;left:0;width:38%;height:58%;border:8px solid #080809;border-radius:3px}.about-portrait--garden img{object-position:center 25%}
.about-portrait__note{position:absolute;right:3%;bottom:17%;padding:10px 14px;border:1px solid rgba(255,255,255,.24);border-radius:999px;background:rgba(8,8,9,.42);font-family:'Sulphur Point',Arial,sans-serif;font-size:13px;letter-spacing:.06em;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transform:rotate(-4deg)}
.about-belief{background:#101014}.about-belief__grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:32px}.about-belief__grid>.eyebrow{grid-column:1/4}.about-belief__grid>h2{grid-column:3/12;max-width:14ch;margin:40px 0 0;font-family:Blinker,Arial,sans-serif;font-size:clamp(52px,7.2vw,106px);font-weight:400;line-height:.9;letter-spacing:-.048em}.about-belief__body{grid-column:7/12;margin:40px 0 0;color:rgba(255,255,255,.62);font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(19px,2.2vw,27px);line-height:1.5}.about-belief__aside{grid-column:2/6;margin-top:80px;padding-top:18px;border-top:1px solid rgba(255,255,255,.18)}.about-belief__aside span{display:block;margin-bottom:18px;color:var(--about-rose);font-size:10px;letter-spacing:.16em;text-transform:uppercase}.about-belief__aside strong{font-family:'Sulphur Point',Arial,sans-serif;font-size:20px;font-weight:400;line-height:1.45}
.making{background:#080809}.making__intro{padding-bottom:32px}.making__intro .section-title{max-width:9ch;margin:0;font-family:Blinker,Arial,sans-serif;font-size:clamp(58px,8vw,116px);font-weight:400;line-height:.86;letter-spacing:-.05em}
.making-stories{padding-top:24px}.making-story{display:grid;min-height:680px;padding-block:88px;grid-template-columns:minmax(260px,.38fr) minmax(0,.62fr);align-items:center;gap:clamp(48px,8vw,120px);border-top:1px solid rgba(255,255,255,.14)}
.making-story:nth-child(even){grid-template-columns:minmax(0,.62fr) minmax(260px,.38fr)}.making-story:nth-child(even) .making-story__copy{grid-column:2}.making-story:nth-child(even) .making-story__media{grid-column:1;grid-row:1}
.making-story__copy>span{color:var(--about-rose);font-size:10px;letter-spacing:.17em;text-transform:uppercase}.making-story__copy h3{max-width:12ch;margin:18px 0 24px;font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(34px,4.2vw,62px);font-weight:400;line-height:1.02;letter-spacing:-.035em}.making-story__copy p{max-width:42ch;margin:0;color:rgba(255,255,255,.59);font-size:16px;line-height:1.7}
.making-story__media{position:relative;min-height:540px;outline:none}.making-story__media img{box-shadow:0 24px 60px rgba(0,0,0,.34);object-fit:cover;transition:transform .9s var(--ease-out),filter .5s ease}
.making-stack img{position:absolute;width:52%;height:78%;border:5px solid #080809}.making-stack img:nth-child(1){top:9%;left:3%;transform:rotate(-5deg)}.making-stack img:nth-child(2){z-index:2;top:3%;left:26%;transform:rotate(2deg)}.making-stack img:nth-child(3){z-index:3;right:0;bottom:2%;transform:rotate(6deg)}.making-stack:hover img:nth-child(1),.making-stack:focus-visible img:nth-child(1){transform:translateX(-7%) rotate(-8deg)}.making-stack:hover img:nth-child(2),.making-stack:focus-visible img:nth-child(2){transform:translateY(-5%) rotate(0)}.making-stack:hover img:nth-child(3),.making-stack:focus-visible img:nth-child(3){transform:translateX(8%) rotate(9deg)}
.making-pair{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:24px}.making-pair img{width:100%;aspect-ratio:3/4}.making-pair img:last-child{transform:translateY(54px)}.making-pair:hover img:first-child,.making-pair:focus-visible img:first-child{transform:translateY(-12px)}.making-pair:hover img:last-child,.making-pair:focus-visible img:last-child{transform:translateY(42px)}
.making-sequence{display:grid;grid-template-columns:repeat(3,1fr);align-items:end;gap:16px}.making-sequence img{width:100%;aspect-ratio:3/4}.making-sequence img:nth-child(2){transform:translateY(-42px)}.making-sequence:hover img:nth-child(1),.making-sequence:focus-visible img:nth-child(1){transform:translateY(14px)}.making-sequence:hover img:nth-child(2),.making-sequence:focus-visible img:nth-child(2){transform:translateY(-58px)}.making-sequence:hover img:nth-child(3),.making-sequence:focus-visible img:nth-child(3){transform:translateY(-14px)}
.making-triptych{display:grid;grid-template-columns:1.25fr .75fr;grid-template-rows:1fr 1fr;gap:16px}.making-triptych img{width:100%;height:100%;min-height:0}.making-triptych img:first-child{grid-row:1/3}.making-triptych:hover img:first-child,.making-triptych:focus-visible img:first-child{transform:scale(.985)}.making-triptych:hover img:nth-child(2),.making-triptych:focus-visible img:nth-child(2){transform:translateX(8px)}.making-triptych:hover img:nth-child(3),.making-triptych:focus-visible img:nth-child(3){transform:translateX(8px)}
.photo-diary{overflow:hidden;background:#101014}.photo-diary__intro{display:grid;grid-template-columns:1fr minmax(300px,460px);align-items:end;gap:64px;padding-bottom:48px}.photo-diary__intro .section-title{max-width:11ch;margin:0;font-family:Blinker,Arial,sans-serif;font-size:clamp(54px,7.5vw,108px);font-weight:400;line-height:.88;letter-spacing:-.05em}.photo-diary__intro>p{margin:0;color:rgba(255,255,255,.55);font-family:'Sulphur Point',Arial,sans-serif;font-size:21px;line-height:1.5}
.photo-diary__stage{position:relative;width:min(calc(100% - 48px),1450px);height:min(68vw,760px);min-height:560px;margin:0 auto;outline:none;cursor:grab;touch-action:pan-y}.photo-diary__stage:active{cursor:grabbing}
.photo-diary__main{position:absolute;inset:0 14% 0 0;margin:0;overflow:hidden;background:#09090a}.photo-diary__main img{width:100%;height:100%;object-fit:cover;transition:opacity .22s ease,transform .8s var(--ease-out)}.photo-diary__stage.is-changing .photo-diary__main img{opacity:.18;transform:scale(1.018)}
.photo-diary__main figcaption{position:absolute;right:0;bottom:0;left:0;display:flex;align-items:flex-end;justify-content:space-between;gap:32px;padding:90px 32px 28px;background:linear-gradient(transparent,rgba(0,0,0,.78));color:#fff}.photo-diary__main figcaption span{font-size:11px;letter-spacing:.14em}.photo-diary__main figcaption strong{max-width:36ch;font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(17px,2vw,25px);font-weight:400;text-align:right}
.photo-diary__peek{position:absolute;top:10%;right:-18%;width:28%;height:72%;overflow:hidden;opacity:.45}.photo-diary__peek img{width:100%;height:100%;object-fit:cover;filter:saturate(.72)}
.photo-diary__controls{position:absolute;right:16%;bottom:24px;left:24px;display:flex;align-items:center;gap:18px;transform:translateY(72px)}.photo-diary__controls button{width:42px;height:42px;border:1px solid rgba(255,255,255,.24);border-radius:50%;transition:background .2s ease,color .2s ease}.photo-diary__controls button:hover{background:#fff;color:#111}.photo-diary__controls>span{position:relative;height:1px;flex:1;overflow:hidden;background:rgba(255,255,255,.18)}.photo-diary__controls i{position:absolute;inset:0 auto 0 0;width:0;background:#fff}.photo-diary__controls i.is-running{animation:diary-progress 5s linear forwards}@keyframes diary-progress{to{width:100%}}
.photo-diary__thumbs{display:flex;gap:12px;padding-top:104px;padding-bottom:var(--section);overflow-x:auto;scrollbar-width:none}.photo-diary__thumbs::-webkit-scrollbar{display:none}.photo-diary__thumbs button{width:112px;min-width:112px;height:78px;overflow:hidden;border:1px solid transparent;opacity:.4;transition:opacity .25s ease,border-color .25s ease,transform .3s var(--ease-out)}.photo-diary__thumbs button:hover,.photo-diary__thumbs button.is-active{border-color:rgba(255,255,255,.72);opacity:1;transform:translateY(-4px)}.photo-diary__thumbs img{width:100%;height:100%;object-fit:cover}
.about-art-link{background:#080809}.about-art-link__grid{display:grid;grid-template-columns:minmax(0,.78fr) minmax(360px,1.22fr);align-items:center;gap:clamp(56px,9vw,140px)}.about-art-link__copy h2{max-width:10ch;margin:0;font-family:Blinker,Arial,sans-serif;font-size:clamp(48px,6.6vw,96px);font-weight:400;line-height:.9;letter-spacing:-.048em}.about-art-link__copy>p:not(.eyebrow){max-width:43ch;margin:32px 0;color:rgba(255,255,255,.58);font-family:'Sulphur Point',Arial,sans-serif;font-size:20px;line-height:1.55}.about-art-link__image{margin:0}.about-art-link__image img{width:100%;aspect-ratio:4/3;object-fit:cover}.about-art-link__image figcaption{margin-top:14px;color:rgba(255,255,255,.45);font-size:11px;letter-spacing:.13em;text-transform:uppercase}

@media(max-width:1000px){
  .beyond-screen__intro,.photo-diary__intro{grid-template-columns:1fr}.art-piece--hero{grid-column:1/9}.art-piece--fold{grid-column:9/13}.art-piece--blood{grid-template-columns:1fr .65fr}
  .about-hero{grid-template-columns:1fr;padding-top:140px}.about-hero__copy h1{max-width:11ch}.about-hero__portraits{min-height:760px}.about-portrait--landscape{width:86%;height:64%}.about-portrait--garden{width:34%;height:54%}
  .making-story,.making-story:nth-child(even){grid-template-columns:1fr;gap:48px}.making-story:nth-child(even) .making-story__copy,.making-story:nth-child(even) .making-story__media{grid-column:auto;grid-row:auto}.making-story__media{min-height:620px}
}
@media(max-width:760px){
  .beyond-screen__intro{gap:28px}.art-wall{display:block}.art-piece{margin-bottom:72px}.art-piece--blood{display:flex;padding-block:40px;flex-direction:column}.art-piece--blood button{order:2}.art-piece--blood>div{order:1;margin-bottom:32px}.art-piece--lanterns,.art-piece--sculpture{display:grid}.art-piece--sculpture{grid-template-columns:1fr 1fr}
  .home-about__grid,.about-art-link__grid{grid-template-columns:1fr}.home-about__copy h2,.about-art-link__copy h2{max-width:12ch}.home-about__image{width:82%}
  .about-hero{padding:124px 24px 72px}.about-hero__copy h1{font-size:clamp(52px,16vw,78px)}.about-hero__portraits{min-height:560px}.about-portrait--landscape{top:3%;width:95%;height:57%}.about-portrait--garden{width:44%;height:55%;border-width:5px}.about-portrait__note{right:0;bottom:15%}
  .about-belief__grid{display:block}.about-belief__grid>h2{margin-top:32px}.about-belief__body,.about-belief__aside{margin-top:48px}.about-belief__aside{width:78%}
  .making-story{min-height:0;padding-block:72px}.making-story__media{min-height:440px}.making-stack img{width:58%;height:72%}.making-sequence{gap:8px}.making-pair{gap:12px}.making-pair img:last-child{transform:translateY(28px)}
  .photo-diary__stage{height:78vh;min-height:520px}.photo-diary__main{right:5%}.photo-diary__peek{display:none}.photo-diary__main figcaption{display:block;padding:80px 20px 20px}.photo-diary__main figcaption strong{display:block;margin-top:8px;text-align:left}.photo-diary__controls{right:8%;left:12px}.photo-diary__thumbs{padding-top:96px}
  .about-art-link__image{grid-row:1}.art-lightbox{padding:12px}.art-lightbox__stage{width:96vw;height:92vh}
}
@media(max-width:480px){.about-hero__portraits{min-height:470px}.making-story__media{min-height:360px}.photo-diary__thumbs button{width:88px;min-width:88px;height:62px}.art-piece>span,.art-piece>div+span{align-items:flex-start;flex-direction:column;gap:6px}.art-lightbox__stage>div{align-items:flex-start;flex-direction:column;gap:6px}}

/* 2026-08-31 · About page rebuilt from the approved reference interaction model. */
.art-piece--hero img{aspect-ratio:2400/1643;object-fit:cover;object-position:center}
.art-piece--fold img{aspect-ratio:2400/2025;object-fit:cover;object-position:center}
.art-piece--sculpture button:first-child img{aspect-ratio:1926/2400;object-position:center}

.about-reference-hero{position:relative;display:flex;min-height:100svh;padding:128px 24px 72px;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;background:#000;text-align:center}
.about-reference-hero__label p{display:inline-flex;align-items:center;gap:12px;margin:0 0 24px;color:rgba(255,255,255,.45);font-family:Gilroy,Arial,sans-serif;font-size:13px;letter-spacing:.3em;text-transform:uppercase}
.about-reference-hero__label .section-status-dot{width:8px;height:8px}
.about-reference-hero__title h1{margin:0;font-family:Blinker,Arial,sans-serif;font-size:clamp(40px,8vw,104px);font-weight:500;line-height:.95;letter-spacing:-.03em}
.about-reference-hero__copy p{max-width:720px;margin:24px auto 0;color:rgba(255,255,255,.7);font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(18px,2.4vw,28px);line-height:1.28}
.about-reference-hero__visual{position:relative;width:min(820px,88vw);height:clamp(280px,35vw,470px);margin-top:48px;animation:about-float 6s ease-in-out infinite}
.about-reference-hero__glow{position:absolute;z-index:0;inset:0;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.25),transparent 66%);opacity:.32;filter:blur(44px)}
.about-reference-portrait{position:absolute;z-index:1;margin:0;overflow:hidden;border-radius:3px;background:#151515;box-shadow:0 30px 80px rgba(0,0,0,.5)}
.about-reference-portrait img{width:100%;height:100%;object-fit:cover}
.about-reference-portrait--main{top:0;right:6%;width:72%;height:86%;transform:rotate(1.5deg)}
.about-reference-portrait--main img{object-position:center 45%}
.about-reference-portrait--secondary{bottom:0;left:5%;width:31%;height:66%;border:7px solid #000;transform:rotate(-4deg)}
.about-reference-portrait--secondary img{object-position:center 25%}
.about-reference-portrait--autumn{right:0;bottom:2%;z-index:2;width:25%;height:58%;border:7px solid #000;transform:rotate(4.5deg)}
.about-reference-portrait--autumn img{object-position:center 42%}
.about-reference-scroll{position:absolute;bottom:28px;left:50%;color:rgba(255,255,255,.32);font-family:Gilroy,Arial,sans-serif;font-size:12px;letter-spacing:.35em;text-transform:uppercase;transform:translateX(-50%);transition:color .25s ease}.about-reference-scroll:hover{color:#fff}
@keyframes about-float{0%,100%{transform:translateY(0) rotate(-.25deg)}50%{transform:translateY(-10px) rotate(.25deg)}}

.interest-journey{padding:112px 24px 136px;background:#000;color:#fff}
.interest-journey__shell{width:min(1100px,100%);margin:0 auto}
.interest-journey__shell>h2{max-width:900px;margin:0 auto;font-family:Blinker,Arial,sans-serif;font-size:clamp(40px,6vw,76px);font-weight:500;line-height:.95;letter-spacing:-.025em;text-align:center;text-transform:uppercase}
.journey-kicker{margin:0 0 22px;color:rgba(255,255,255,.4);font-family:Gilroy,Arial,sans-serif;font-size:11px;letter-spacing:.22em;text-align:center;text-transform:uppercase}
.interest-journey__intro{max-width:680px;margin:28px auto 0;color:rgba(255,255,255,.58);font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(17px,1.7vw,21px);line-height:1.55;text-align:center}
.interest-timeline{position:relative;display:flex;margin-top:96px;flex-direction:column;gap:112px}
.interest-timeline__track,.interest-timeline__progress{position:absolute;z-index:0;top:0;bottom:0;left:50%;width:1px;transform:translateX(-50%)}
.interest-timeline__track{background:rgba(255,255,255,.12)}
.interest-timeline__progress{bottom:auto;height:100%;background:#fff;transform:translateX(-50%) scaleY(var(--interest-progress,0));transform-origin:top;will-change:transform}
.interest-item{position:relative;z-index:1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:64px;opacity:.5;transform:scale(.9);transition:opacity .6s ease,transform .6s cubic-bezier(.16,1,.3,1);will-change:opacity,transform}
.interest-item.is-active{opacity:1;transform:scale(1)}
.interest-item__node{position:absolute;top:6px;left:50%;width:12px;height:12px;border:1px solid rgba(255,255,255,.42);border-radius:50%;background:#000;transform:translateX(-50%)}
.interest-item__node i{position:absolute;inset:3px;border-radius:50%;background:#fff}
.interest-item--right .interest-item__content{grid-column:2;padding-left:32px;text-align:left;transform-origin:left top}
.interest-item--left .interest-item__content{grid-column:1;padding-right:32px;text-align:right;transform-origin:right top}
.interest-item__number{color:rgba(255,255,255,.4);font-family:Gilroy,Arial,sans-serif;font-size:15px;font-variant-numeric:tabular-nums}
.interest-item h3{margin:10px 0 0;font-family:Blinker,Arial,sans-serif;font-size:clamp(28px,3.2vw,42px);font-weight:500;line-height:1.06;letter-spacing:-.015em;text-transform:uppercase}
.interest-item p{margin:20px 0 0;color:rgba(255,255,255,.65);font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(16px,1.4vw,19px);line-height:1.65}
.interest-gallery{position:relative;margin-top:32px;outline:none;cursor:pointer}
.interest-gallery__stage{position:relative;overflow:hidden;border-radius:20px;background:#111;aspect-ratio:16/10}
.interest-gallery__stage::after{position:absolute;inset:0;border:1px solid rgba(255,255,255,.12);border-radius:inherit;content:"";pointer-events:none}
.interest-gallery__stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.02);transition:opacity .65s ease,transform 1.1s cubic-bezier(.16,1,.3,1)}
.interest-gallery__stage img.is-active{opacity:1;transform:scale(1)}
.interest-gallery--art .interest-gallery__stage img{object-position:center}
.interest-gallery--product .interest-gallery__stage{background:#f0f0ee}
.interest-gallery--product .interest-gallery__stage img{padding:0;object-fit:cover;object-position:center}
.interest-gallery--projects .interest-gallery__stage img{padding:18px;object-fit:contain;background:#e9e9e6}
.interest-gallery--covers .interest-gallery__stage{background:#101012}
.interest-gallery--covers .interest-gallery__stage img{padding:18px;object-fit:contain;background:#101012}
.interest-gallery__dots{display:flex;justify-content:inherit;gap:8px;margin-top:14px}.interest-item--left .interest-gallery__dots{justify-content:flex-end}.interest-item--right .interest-gallery__dots{justify-content:flex-start}
.interest-gallery__dots button{width:22px;height:3px;border-radius:99px;background:rgba(255,255,255,.22);transition:width .3s ease,background .3s ease}.interest-gallery__dots button.is-active{width:42px;background:#fff}.interest-gallery__dots button:focus-visible{outline:2px solid #fff;outline-offset:4px}
.interest-clue-card{display:grid;margin-top:32px;padding:32px;border:1px solid rgba(255,255,255,.14);border-radius:20px;background:radial-gradient(circle at 18% 20%,rgba(255,255,255,.08),transparent 34%),#0b0b0d;grid-template-columns:auto 1fr auto 1fr auto 1fr auto;align-items:center;gap:12px;color:rgba(255,255,255,.42);font-size:10px;letter-spacing:.19em;text-transform:uppercase;text-align:left}
.interest-clue-card i{height:1px;background:linear-gradient(90deg,rgba(255,255,255,.16),rgba(255,255,255,.62));transform-origin:left;animation:clue-line 3.4s ease-in-out infinite}.interest-clue-card strong{color:#fff;font-weight:500}
@keyframes clue-line{0%,20%{transform:scaleX(.12);opacity:.2}60%,100%{transform:scaleX(1);opacity:1}}
.interest-journey__end{display:flex;margin:128px auto 0;max-width:760px;flex-direction:column;align-items:center;text-align:center}.interest-journey__end p{margin:0;color:rgba(255,255,255,.72);font-family:'Sulphur Point',Arial,sans-serif;font-size:clamp(22px,2.8vw,34px);line-height:1.35}.interest-journey__end a{margin-top:32px;padding-bottom:7px;border-bottom:1px solid rgba(255,255,255,.4);font-size:13px;letter-spacing:.06em;transition:border-color .25s ease,color .25s ease}.interest-journey__end a:hover{border-color:#fff;color:#fff}

.about-strengths{margin-top:160px;padding-top:112px;border-top:1px solid rgba(255,255,255,.12)}
.about-strengths>h2{max-width:780px;margin:0 auto;font-family:Blinker,Arial,sans-serif;font-size:clamp(40px,5.6vw,72px);font-weight:500;line-height:.96;letter-spacing:-.03em;text-align:center;text-transform:uppercase}
.about-strengths__grid{display:grid;margin-top:64px;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.about-strength{display:flex;min-height:360px;padding:28px;border:1px solid rgba(255,255,255,.14);border-radius:20px;background:#0b0b0d;flex-direction:column;transition:border-color .35s ease,background .35s ease,transform .45s cubic-bezier(.16,1,.3,1)}
.about-strength:hover{border-color:rgba(255,255,255,.48);background:#111115;transform:translateY(-8px)}
.about-strength>span,.offscreen-card>span{color:rgba(255,255,255,.35);font-family:Gilroy,Arial,sans-serif;font-size:11px;letter-spacing:.16em}
.about-strength h3{margin:64px 0 0;font-family:Blinker,Arial,sans-serif;font-size:clamp(28px,3vw,40px);font-weight:500;line-height:1;text-transform:uppercase}
.about-strength p{margin:18px 0 0;color:rgba(255,255,255,.58);font-family:'Sulphur Point',Arial,sans-serif;font-size:17px;line-height:1.55}
.about-strength b{margin-top:auto;padding-top:28px;color:rgba(255,255,255,.78);font-size:11px;font-weight:400;letter-spacing:.08em;text-transform:uppercase}

.offscreen-interests{margin-top:160px;padding-top:112px;border-top:1px solid rgba(255,255,255,.12)}
.offscreen-interests__heading{display:grid;grid-template-columns:1fr minmax(320px,470px);align-items:end;gap:72px}
.offscreen-interests__heading .journey-kicker{text-align:left}
.offscreen-interests__heading h2{max-width:680px;margin:0;font-family:Blinker,Arial,sans-serif;font-size:clamp(44px,6vw,78px);font-weight:500;line-height:.94;letter-spacing:-.03em;text-transform:uppercase}
.offscreen-interests__heading>p{margin:0;color:rgba(255,255,255,.58);font-family:'Sulphur Point',Arial,sans-serif;font-size:19px;line-height:1.6}
.offscreen-interests__grid{display:grid;margin-top:72px;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.offscreen-card .interest-gallery{margin:0 0 24px}.offscreen-card .interest-gallery__stage{border-radius:14px;aspect-ratio:4/5}.offscreen-card .interest-gallery__dots{justify-content:flex-start}
.offscreen-card h3{margin:14px 0 0;font-family:Blinker,Arial,sans-serif;font-size:28px;font-weight:500;line-height:1;text-transform:uppercase}
.offscreen-card p{margin:14px 0 0;color:rgba(255,255,255,.55);font-family:'Sulphur Point',Arial,sans-serif;font-size:16px;line-height:1.6}

.playground-card{position:relative}.play-card__hit{position:absolute;z-index:4;inset:0;width:100%;height:100%;border-radius:20px;background:transparent;cursor:pointer}.play-card__hit:focus-visible{outline:2px solid #fff;outline-offset:-4px}
.playground-poster-cover{display:grid;grid-template-columns:1fr 1fr;align-items:center;padding:clamp(18px,2.4vw,34px);gap:clamp(10px,1.6vw,24px);background:radial-gradient(circle at 50% 40%,#353139,#141316 70%)}
.playground-poster-cover img{height:92%;border-radius:4px;object-fit:contain!important;box-shadow:0 26px 55px rgba(0,0,0,.45);transform:rotate(-4deg) scale(1)!important}.playground-poster-cover img+img{transform:translateY(5%) rotate(4deg) scale(.94)!important}
.playground-card--posters:hover .playground-poster-cover img{transform:translateX(-3%) rotate(-6deg) scale(1.02)!important}.playground-card--posters:hover .playground-poster-cover img+img{transform:translateX(3%) translateY(2%) rotate(6deg) scale(.96)!important}
.playground-goddess-cover{background:radial-gradient(circle at 50% 42%,#8c6b35 0,#2b2115 46%,#100d09 100%)}
.playground-goddess-cover img{border-radius:8px;box-shadow:0 28px 64px rgba(0,0,0,.56),0 0 0 1px rgba(231,196,119,.2)}

.poster-gallery{position:fixed;z-index:1600;inset:0;display:grid;padding:24px;place-items:center;opacity:0;visibility:hidden;transition:opacity .45s ease,visibility 0s .45s}.poster-gallery.is-open{opacity:1;visibility:visible;transition-delay:0s}.poster-gallery[hidden]{display:none}
.poster-gallery__backdrop{position:absolute;inset:0;width:100%;height:100%;background:rgba(3,3,4,.9);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}
.poster-gallery__panel{position:relative;display:grid;width:min(1080px,94vw);height:min(900px,92vh);padding:22px 28px 20px;grid-template-rows:auto minmax(0,1fr) auto;border:1px solid rgba(255,255,255,.16);border-radius:24px;background:#0b0b0d;box-shadow:0 40px 100px rgba(0,0,0,.55);transform:translateY(20px) scale(.985);transition:transform .55s cubic-bezier(.16,1,.3,1)}.poster-gallery.is-open .poster-gallery__panel{transform:none}
.poster-gallery__panel>header{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;padding-bottom:16px}.poster-gallery__panel>header p{margin:0 0 4px;color:rgba(255,255,255,.42);font-size:10px;letter-spacing:.18em;text-transform:uppercase}.poster-gallery__panel>header h2{margin:0;font-family:Blinker,Arial,sans-serif;font-size:clamp(28px,4vw,46px);font-weight:500;line-height:1}.poster-gallery__close{width:44px;height:44px;border:1px solid rgba(255,255,255,.22);border-radius:50%;font-size:28px;line-height:1;transition:background .2s ease,color .2s ease}.poster-gallery__close:hover{background:#fff;color:#000}
.poster-gallery__viewport{position:relative;min-height:0;overflow:hidden;outline:none;perspective:1800px}.poster-gallery__viewport img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transform:translateX(8%) rotateY(-6deg) scale(.975);transform-origin:left center;transition:opacity .48s ease,transform .72s cubic-bezier(.16,1,.3,1);filter:drop-shadow(0 28px 48px rgba(0,0,0,.38));pointer-events:none}.poster-gallery__viewport img.is-active{z-index:2;opacity:1;transform:none}.poster-gallery__viewport img.is-leaving{z-index:3;opacity:0;transform:translateX(-12%) rotateY(12deg) scale(.96)}
.poster-gallery--goddesses .poster-gallery__panel{grid-template-rows:auto minmax(0,1fr) auto auto}
.poster-gallery__caption{min-height:24px;margin:12px 0 0;color:rgba(255,255,255,.88);font-family:var(--font-text);font-size:15px;letter-spacing:.04em;text-align:center}
.poster-gallery__panel>footer{display:grid;padding-top:16px;grid-template-columns:44px auto 1fr 44px;align-items:center;gap:16px}.poster-gallery__panel>footer button{width:44px;height:44px;border:1px solid rgba(255,255,255,.2);border-radius:50%;transition:background .2s ease,color .2s ease}.poster-gallery__panel>footer button:hover{background:#fff;color:#000}.poster-gallery__panel>footer>span{min-width:54px;color:rgba(255,255,255,.62);font-size:11px;font-variant-numeric:tabular-nums;letter-spacing:.12em}.poster-gallery__progress{height:2px;overflow:hidden;background:rgba(255,255,255,.14)}.poster-gallery__progress i{display:block;width:0;height:100%;background:#fff}.poster-gallery__progress i.is-running{animation:poster-progress 3.2s linear forwards}@keyframes poster-progress{to{width:100%}}

@media(max-width:767px){
  .about-reference-hero{padding:120px 20px 80px}.about-reference-hero__copy p br{display:none}.about-reference-hero__visual{height:460px;margin-top:40px}.about-reference-portrait--main{right:0;width:82%;height:68%}.about-reference-portrait--secondary{left:0;width:39%;height:52%;border-width:5px}.about-reference-portrait--autumn{right:-2%;bottom:0;width:38%;height:49%;border-width:5px}
  .interest-journey{padding:88px 20px 112px}.interest-timeline{margin-top:72px;gap:80px}.interest-timeline__track,.interest-timeline__progress{left:10px}.interest-item{display:block;padding-left:38px}.interest-item__node{left:10px}.interest-item--right .interest-item__content,.interest-item--left .interest-item__content{padding:0;text-align:left}.interest-gallery__stage{border-radius:16px;aspect-ratio:4/5}.interest-item--left .interest-gallery__dots,.interest-item--right .interest-gallery__dots{justify-content:flex-start}.interest-clue-card{padding:22px;grid-template-columns:auto 1fr;gap:14px}.interest-clue-card i{display:none}.interest-journey__end{margin-top:96px;padding-left:38px;align-items:flex-start;text-align:left}
  .about-strengths,.offscreen-interests{margin-top:112px;padding-top:80px}.about-strengths__grid,.offscreen-interests__grid{grid-template-columns:1fr}.about-strength{min-height:300px}.offscreen-interests__heading{grid-template-columns:1fr;gap:28px}.offscreen-interests__heading .journey-kicker{text-align:center}.offscreen-interests__heading h2,.offscreen-interests__heading>p{text-align:center}.offscreen-interests__grid{gap:64px}.offscreen-card .interest-gallery__stage{aspect-ratio:4/3}
  .poster-gallery{padding:10px}.poster-gallery__panel{width:96vw;height:94vh;padding:18px 16px 14px;border-radius:18px}.poster-gallery__panel>footer{grid-template-columns:40px auto 1fr 40px;gap:10px}.poster-gallery__panel>footer button{width:40px;height:40px}
}
@media(prefers-reduced-motion:reduce){.about-reference-hero__visual,.interest-clue-card i{animation:none}.interest-item{opacity:1;transform:none}.interest-timeline__progress{transform:translateX(-50%) scaleY(1)}}

/* 2026-09-04 · Bilingual editorial typography system: Fraunces + LXGW WenKai */
:root{
  --font-display:'Fraunces','LXGW WenKai',Georgia,serif;
  --font-text:'Fraunces','LXGW WenKai',Georgia,serif;
  --font-zh:'LXGW WenKai','Fraunces',serif;
  --leading-display:.98;
  --leading-heading:1.12;
  --leading-body:1.65;
  --measure:66ch;
  --measure-zh:32em;
}
body,.font-display,.font-editorial{font-family:var(--font-text)}
body,body *,button,input,textarea,select{font-family:var(--font-text)!important}
:where(h1,h2,h3,.section-heading,.section-title,.hero-name,.preloader-copy,.preloader-percent,.nav-brand,[data-featured-title],.cta-word,.case-title,.case-section-title,.project-gallery__title){font-family:var(--font-display)}
:where(p,li,figcaption){text-wrap:pretty}
:where(h1,h2,h3){text-wrap:balance}
:where(.case-copy,.case-section p,.case-hero p,.case-overview p,.case-outcome p,.making-story__copy p,.offscreen-card p,.about-strength p){max-width:var(--measure)}

/* Display type is expressive but no longer blocky or over-weighted. */
.section-heading,.hero-name,.home-about__copy h2,.about-hero__copy h1,.about-belief__grid>h2,.making__intro .section-title,.photo-diary__intro .section-title,.about-art-link__copy h2,.about-reference-hero__title h1,.interest-journey__shell>h2,.about-strengths>h2,.offscreen-interests__heading h2,.case-hero h1,.case-section h2,.case-outcome h2,.cta-word{
  font-family:var(--font-display);
  font-weight:400;
  font-variation-settings:'opsz' 72;
  letter-spacing:-.035em;
}
body{font-family:var(--font-text);font-weight:400;line-height:var(--leading-body);font-optical-sizing:auto;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.eyebrow,.case-label,.case-kicker,.journey-kicker,.project-gallery__eyebrow{font-family:var(--font-text);font-weight:500;line-height:1.35}

/* Homepage About teaser: deliberate ragged-right composition and calmer wrapping. */
.home-about__grid{grid-template-columns:minmax(320px,.9fr) minmax(0,1.1fr);gap:clamp(52px,7vw,104px)}
.home-about__copy{align-self:center;max-width:720px}
.home-about__copy h2{max-width:13.5ch;font-size:clamp(48px,5.1vw,78px);line-height:1.02}
.home-about__copy>p:not(.eyebrow){max-width:36em;margin:30px 0 34px;font-family:var(--font-text);font-size:clamp(17px,1.35vw,21px);line-height:1.62;letter-spacing:0}
.about-page-link{font-weight:500;line-height:1.4}

/* Long-form case studies favor scanning over decorative centering. */
.case-page :where(.case-section p,.case-overview p,.case-outcome p,.case-meta p,.case-card p,.case-finding-grid p,.case-iteration-copy p){line-height:1.68}
.case-page :where(.case-section h2,.case-outcome h2){line-height:1.06}
.case-page :where(.case-section h3,.case-card h3,.case-finding-grid h3,.case-iteration-copy h3){line-height:1.16}
.case-section :where(p,li),.case-outcome :where(p,li){text-align:left}

/* Chinese has its own rhythm; Latin tracking and all-caps treatments do not carry over. */
html[lang^='zh'] body{font-family:var(--font-text);line-height:1.8}
html[lang^='zh'] :where(h1,h2,h3,.section-heading,.section-title,.hero-name,.nav-brand,[data-featured-title],.cta-word,.case-title,.case-section-title,.project-gallery__title){font-family:var(--font-display);font-weight:400;letter-spacing:.01em;line-height:1.18;text-transform:none}
html[lang^='zh'] :where(p,li,figcaption){line-height:1.8;letter-spacing:.015em}
html[lang^='zh'] :where(.eyebrow,.case-label,.case-kicker,.journey-kicker,.project-gallery__eyebrow){letter-spacing:.1em;text-transform:none}
html[lang^='zh'] :where(.case-copy,.case-section p,.case-hero p,.case-overview p,.case-outcome p,.making-story__copy p,.offscreen-card p,.about-strength p){max-width:var(--measure-zh)}
html[lang^='zh'] .home-about__copy h2{max-width:10em;font-size:clamp(44px,4.8vw,72px);line-height:1.2}
html[lang^='zh'] .home-about__copy>p:not(.eyebrow){max-width:29em;line-height:1.85}
html[lang^='zh'] .about-reference-hero__title h1{line-height:1.2}
html[lang^='zh'] .about-reference-hero__copy p{max-width:30em;line-height:1.8}
html[lang^='zh'] .interest-item--left .interest-item__content{text-align:left}
html[lang^='zh'] .interest-item--left .interest-gallery__dots{justify-content:flex-start}

@media(max-width:900px){
  .home-about__grid{grid-template-columns:1fr;gap:48px}
  .home-about__image{width:min(82%,560px)}
  .home-about__copy h2{max-width:14ch;font-size:clamp(43px,9vw,68px)}
}
@media(max-width:600px){
  :root{--section:76px}
  .home-about__image{width:100%}
  .home-about__copy h2{font-size:clamp(38px,11.5vw,56px);line-height:1.05}
  .home-about__copy>p:not(.eyebrow){font-size:17px;line-height:1.7}
  html[lang^='zh'] .home-about__copy h2{font-size:clamp(36px,10.5vw,52px);line-height:1.22}
}