/* Product scenes: generous device stages, readable copy, one project per chapter. */
.work-layout[hidden],.project-explorer[hidden]{display:none!important}.case-studies{max-width:1200px;margin:30px auto 0}.case-study{position:relative;padding:80px 0 90px;border-top:1px solid var(--line);scroll-margin-top:110px}.case-heading{display:block!important;position:relative!important;inset:auto!important;height:auto!important;background:none!important;backdrop-filter:none!important;padding:0!important;z-index:1!important}.case-eyebrow{display:flex;gap:25px;align-items:center;font-size:12px;color:var(--cerulean)}.case-eyebrow>span:first-child{font-variant-numeric:tabular-nums;color:#829196}.case-heading h3{font-size:clamp(45px,6.6vw,94px);line-height:1.08;letter-spacing:-3px;margin:22px 0 18px;font-weight:650;overflow-wrap:anywhere}.case-role{font-size:13px;line-height:1.6;color:var(--muted);max-width:70ch}.case-showcase{position:relative;height:115vh;min-height:780px;margin:35px 0 25px;border-radius:28px;background:#f0f4f4}.case-study[data-tone="1"] .case-showcase{background:#f5f5d8}.case-study[data-tone="2"] .case-showcase{background:#fcecef}.case-visual-pin{position:sticky;top:100px;min-height:0;height:calc(100svh - 125px);display:flex;align-items:center;justify-content:center;padding:20px 0}.case-preview{width:100%;transform-origin:50% 45%;will-change:transform,opacity}.case-preview .media{background:transparent;overflow:visible}.case-preview .device-stage-laptop{aspect-ratio:unset;min-height:0!important;height:min(59vh,600px);padding:5px 22px 12px;max-height:none}.case-preview .device-stage-phone{aspect-ratio:unset;min-height:0!important;height:min(65vh,640px);padding:5px 22px 12px}.case-preview .device-stage-phone .device-phone{height:min(61vh,600px);width:auto!important;aspect-ratio:1/2!important}.case-tools{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:center;padding:15px 25px 0}.case-tools .gallery-thumbs{justify-content:center;max-width:100%;overflow:auto;gap:6px}.case-tools .gallery-thumb{font-size:10px;padding:8px 11px;border-radius:30px;flex-shrink:0;min-width:0}.case-tools .gallery-thumb.active{background:var(--spinel);color:var(--ink)}.case-screen-nav{display:flex;gap:16px;align-items:center;font-size:10px;color:var(--muted)}.case-screen-nav button{border:1px solid #ccdadd;border-radius:50%;width:30px;height:30px;background:#fffdf9;color:var(--ink)}.case-preview>.gallery-caption{text-align:center;font-size:10px;line-height:1.6;margin:12px 20px 0}.case-copy{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:60px;padding:25px 0 15px}.case-description{font-size:clamp(18px,2.1vw,25px);line-height:1.55;letter-spacing:-.35px;max-width:60ch;margin:0 0 24px}.case-links{display:flex;flex-direction:column;gap:16px;font-size:12px;min-width:145px;padding-top:5px}.case-links a{text-decoration:none;color:var(--cerulean)}.case-study .ownership{max-width:100%;padding:12px 15px;margin:20px 0;font-size:11px}.case-details{padding:20px 0;border-top:1px solid var(--line);max-width:850px}.case-details summary{font-size:13px;color:var(--ink);cursor:pointer}.case-details p{font-size:13px;line-height:1.8;color:var(--muted)}.case-details h4{font-size:15px;margin-bottom:7px}.case-details .detail-block{margin-top:22px}.case-no-ui{font-size:clamp(28px,4vw,55px);line-height:1.2;max-width:20ch;text-align:center;padding:35px;color:var(--cerulean)}.case-study .project-usage{max-width:1000px;margin:40px auto 0}.case-study .project-usage img{max-height:570px}.case-heading,.case-copy,.case-details,.community-item,.case-study .project-usage{transition:opacity .8s,transform 1s cubic-bezier(.16,1,.3,1)}body:not(.motion-paused) .case-heading:not(.entered),body:not(.motion-paused) .case-copy:not(.entered),body:not(.motion-paused) .case-details:not(.entered),body:not(.motion-paused) .community-item:not(.entered),body:not(.motion-paused) .case-study .project-usage:not(.entered){opacity:0;transform:translateY(35px)}
/* Photorealistic hardware overlays keep all UI below them interactive. */
.device-phone{box-sizing:border-box!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;aspect-ratio:1/2!important;isolation:isolate}.device-phone>.device-screen{position:absolute!important;left:7.4%!important;top:2.2%!important;width:85.2%!important;height:95.2%!important;border-radius:12% / 5.4%!important;padding-top:22px!important;box-sizing:border-box;background:#101316;z-index:1}.device-phone:before,.story-phones .device-phone:before{content:''!important;display:block!important;position:absolute!important;inset:0!important;width:100%!important;height:100%!important;border-radius:0!important;transform:none!important;background:url('assets/iphone-hardware-frame.webp') center/100% 100% no-repeat!important;z-index:3!important;pointer-events:none!important}.device-phone:after{display:none!important}.device-phone .screen-next-hotspot{z-index:4}.device-laptop{box-sizing:border-box!important;aspect-ratio:3/2!important;height:auto;padding:0!important;perspective:none;background:transparent;isolation:isolate}.device-laptop>.device-screen{position:absolute!important;left:10.2%!important;top:5.5%!important;width:79.6%!important;height:74.8%!important;aspect-ratio:auto!important;max-height:none!important;border:0!important;border-radius:2% 2% 1% 1%!important;background:#fff;z-index:1;box-shadow:none!important}.device-laptop:before{content:''!important;position:absolute!important;inset:0!important;width:100%!important;height:100%!important;transform:none!important;border-radius:0!important;background:url('assets/macbook-hardware-frame.webp') center/100% 100% no-repeat!important;z-index:3!important;pointer-events:none!important}.device-laptop:after{display:none!important}.case-preview .device-stage-laptop .device-laptop{height:100%!important;width:auto!important;max-width:100%;aspect-ratio:3/2!important}.case-preview .device-laptop.is-expanded{aspect-ratio:auto!important;width:100vw!important;height:100dvh!important}.device-shell.is-expanded>.live-site,.device-shell.is-expanded>.app-demo-screen{position:absolute!important;inset:48px 0 0!important;width:100%!important;height:calc(100% - 48px)!important;border-radius:0!important}.device-shell.is-expanded:before{display:none!important}.device-shell.is-expanded .live-expanded-toolbar{position:relative;z-index:5}.video-embed{width:100%;height:100%;border:0;display:block}.device-screen .studio-screen-crop{height:auto!important;aspect-ratio:1920/911!important;min-height:0!important;flex-shrink:0}.device-screen .studio-screen-crop img{width:100%!important;height:auto!important;max-height:none!important}
/* The active scene alone owns the text; image crossfades never stack labels. */
.story-enabled .story-scene{display:grid!important;grid-template-rows:minmax(0,1fr) auto;gap:18px!important;justify-items:center;padding:10px 0 0!important;align-items:stretch}.story-enabled .story-device{height:100%!important;min-height:0!important;max-height:none!important;overflow:visible}.story-enabled .story-copy{padding:0 12px 5px;max-width:100%;width:100%;box-sizing:border-box}.story-enabled .story-copy>span{display:block;font-size:14px;color:#20556a;line-height:1.5}.story-enabled .story-copy h3{line-height:1.25;margin:6px auto 12px;max-width:36ch}.story-enabled .story-scene:not(.active) .story-copy{visibility:hidden;opacity:0;pointer-events:none}.story-enabled .story-laptop .device-laptop{height:auto!important;max-height:none!important;width:min(90%,calc(var(--story-device-height,350px)*1.5))!important}.story-enabled .story-phones .device-phone{height:100%!important;aspect-ratio:1/2!important}.story-enabled .story-scenes{margin-bottom:8px}.story-navigation{flex-shrink:0}.story-enabled .story-heading{flex-shrink:0}.story-enabled .story-scroll-note{flex-shrink:0}.story-phones>.device-phone{max-width:30%}
.community-section{margin:130px 0 0;padding:70px 0 30px;border-top:1px solid var(--line);scroll-margin-top:110px}.community-intro{max-width:850px;margin-bottom:60px}.community-intro h2{font-size:clamp(38px,5.2vw,73px);line-height:1.08;letter-spacing:-2.1px;margin:20px 0}.community-intro>p{font-size:16px;line-height:1.7;color:var(--muted);max-width:60ch}.community-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 65px}.community-item{padding:30px 0;border-top:1px solid var(--line)}.community-date{font-size:11px;color:var(--cerulean)}.community-item h3{font-size:25px;letter-spacing:-.7px;line-height:1.2;margin:15px 0 10px}.community-item h4{font-size:12px;font-weight:600;color:#a73c58;margin:0 0 16px}.community-item p{font-size:13px;line-height:1.8;color:var(--muted);max-width:55ch}.stage-nav a{padding:10px 12px}
@media(max-width:760px){.stage-nav{overflow-x:auto;justify-content:flex-start!important;scrollbar-width:none}.stage-nav a{white-space:nowrap;flex-shrink:0;font-size:10px;padding:9px 11px}.case-study{padding:50px 0 60px;scroll-margin-top:125px}.case-eyebrow{font-size:10px;gap:18px}.case-heading h3{font-size:clamp(36px,10vw,58px);letter-spacing:-1.5px;line-height:1.12;margin:18px 0 12px}.case-role{font-size:11px}.case-showcase{height:105svh;min-height:650px;border-radius:18px;margin:25px -10px 10px}.case-visual-pin{top:112px;height:calc(100svh - 130px);padding:12px 0}.case-preview .device-stage-phone{height:min(60vh,530px);padding:5px 10px}.case-preview .device-stage-phone .device-phone{height:min(57vh,500px)}.case-preview .device-stage-laptop{height:36vh!important;padding:5px 7px}.case-tools{padding:12px 13px 0;gap:8px}.case-tools .gallery-thumbs{justify-content:flex-start;flex-wrap:nowrap;max-height:44px}.case-tools .gallery-thumb{font-size:9px;padding:8px 10px}.case-preview>.gallery-caption{font-size:9px}.case-copy{grid-template-columns:1fr;gap:20px;padding-top:24px}.case-description{font-size:18px}.case-links{flex-direction:row;flex-wrap:wrap;gap:22px;font-size:11px}.case-study .ownership{font-size:10px;margin:16px 0}.case-details{padding-top:16px}.case-details summary{font-size:12px}.community-section{margin-top:70px;padding-top:45px;scroll-margin-top:125px}.community-intro{margin-bottom:35px}.community-intro h2{font-size:39px;letter-spacing:-1.4px}.community-intro>p{font-size:13px}.community-grid{grid-template-columns:1fr;gap:0}.community-item{padding:25px 0}.community-item h3{font-size:23px}.community-item p{font-size:12px}.story-enabled .story-copy>span{font-size:12px}.story-enabled .story-copy h3{font-size:18px;max-width:28ch}.story-enabled .story-scene{gap:12px!important}.story-enabled .story-phones .device-phone{height:85%!important}.story-enabled .story-heading h2{font-size:31px}.story-enabled .story-heading>p{font-size:11px}.story-enabled .story-scroll-note{margin-top:7px}}
@media(max-height:700px){.story-enabled .story-heading>p,.story-enabled .story-scroll-note{display:none}.story-enabled .story-heading h2{font-size:34px}.story-enabled .story-copy h3{font-size:18px}.story-enabled .story-copy>span{font-size:11px}.story-enabled .story-scene{gap:8px!important}.story-enabled .story-sticky{padding-top:12px;padding-bottom:10px}.case-tools .gallery-thumbs{max-height:40px;overflow:auto;flex-wrap:nowrap}.case-tools .gallery-thumb{white-space:nowrap}.case-preview .device-stage-phone{height:53vh}.case-preview .device-stage-phone .device-phone{height:50vh}}
@media(prefers-reduced-motion:reduce){.case-showcase{height:auto;min-height:0;padding:25px 0}.case-visual-pin{position:relative;top:0;height:auto;padding:0}.case-heading,.case-copy,.case-details,.community-item,.case-study .project-usage{opacity:1!important;transform:none!important;transition:none!important}.case-preview{opacity:1!important;transform:none!important;will-change:auto}}
body.motion-paused .case-showcase{height:auto;min-height:0;padding:25px 0}body.motion-paused .case-visual-pin{position:relative;top:0;height:auto}body.motion-paused .case-preview{opacity:1!important;transform:none!important}
@media(max-width:760px){.case-tools .gallery-thumb{white-space:nowrap;line-height:1.4}}
@media(min-width:901px){.story-enabled .story-scene{grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);grid-template-rows:minmax(0,1fr);gap:35px!important;align-items:center}.story-enabled .story-copy{text-align:left;align-self:center;padding:0 20px 0 0}.story-enabled .story-copy>span{font-size:16px}.story-enabled .story-copy h3{font-size:clamp(28px,3vw,42px);line-height:1.13;margin:14px 0 25px;max-width:18ch;letter-spacing:-1px}.story-enabled .story-laptop .device-laptop{width:min(100%,calc(var(--story-device-height,350px)*1.5))!important}.story-enabled .story-phones>.device-phone{max-width:35%;height:95%!important}.story-enabled .story-scenario{width:75%;left:0}}
.case-study,.community-section{scroll-margin-top:15px}