/* Static, accessible Selected Work grid is the default. */
.work-shuffle{height:auto;padding:100px var(--gutter);background:#edf0e8;color:var(--ink)}
.work-shuffle>.section-top{position:static;margin:0 0 52px;pointer-events:auto}
.work-shuffle>.section-top h2{font-size:clamp(42px,5.6vw,86px);max-width:12ch}
.work-shuffle .shuffle-stage{position:relative;height:auto;min-height:0;overflow:visible}
.work-shuffle .shuffle-rail{position:relative;inset:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;width:auto;padding:0;transform:none}
.work-shuffle .shuffle-card{position:relative;inset:auto;width:100%;height:auto;aspect-ratio:3/4;transform:none;opacity:1;pointer-events:auto}
.work-shuffle .shuffle-card-inner{height:100%;opacity:1;filter:none;transform:none;border-radius:10px;box-shadow:0 24px 60px #0925201c}
.work-shuffle .shuffle-image img{transform:scale(1.055)}
.work-shuffle .shuffle-copy{left:25px;right:25px;bottom:27px}
.work-shuffle .shuffle-copy h3{font-size:clamp(31px,3vw,48px)}
.work-shuffle .work-chapters,.work-shuffle .shuffle-ui,.story-heading,.story-atmosphere{display:none}
.shuffle-image:after{z-index:2}.shuffle-copy{z-index:3}
.story-controls{display:flex;align-items:center;gap:8px;margin-left:auto}
.story-controls button{width:44px;height:44px;border:1px solid #17382a55;border-radius:50%;background:#f5f6ef55;color:#17382a;font:24px/1 Figtree,Arial,sans-serif;cursor:pointer;transition:background .25s,color .25s,transform .25s}
.story-controls button:not(:disabled):hover{background:var(--ink);color:#fff;transform:scale(1.08)}
.story-controls button:disabled{opacity:.25;cursor:default}
.story-controls button:focus-visible,.story-skip:focus-visible,.work-shuffle a:focus-visible{outline:3px solid #557014;outline-offset:4px}
.story-skip{font-size:12px;letter-spacing:0;text-transform:none;text-decoration:underline;margin-right:12px}
.kinetic-word{position:absolute;left:-.05em;bottom:-.2em;font-size:clamp(120px,22vw,390px);line-height:.7;font-weight:800;letter-spacing:-.09em;white-space:nowrap;color:#102e29;pointer-events:none;z-index:0}
.thesis-inner{position:relative;z-index:1}.scroll-word{display:inline-block;will-change:transform,opacity}
.process-grid{position:relative;perspective:1000px}.process-progress{position:absolute;left:0;right:0;top:-2px;height:3px;background:var(--lime);transform-origin:left center;z-index:2}

/* GSAP owns every transform in the enhanced experience. */
.gsap-cinema.motion-on .hero .line-mask>span,.gsap-cinema.motion-on .hero-art{animation:none}
.gsap-cinema.motion-on .hero-art,.gsap-cinema.motion-on .hero-canvas{will-change:opacity}
.gsap-cinema.motion-on .thesis-mark,.gsap-cinema.motion-on .service-visual,.gsap-cinema.motion-on .team-row,.gsap-cinema.motion-on .contact-title>span:first-child{will-change:transform,opacity}

@media(min-height:680px) and (prefers-reduced-motion:no-preference){
 .gsap-cinema.motion-on .work-shuffle.story-ready{padding:0;background:#edf0e8;overflow:hidden}
 .gsap-cinema.motion-on .story-ready>.section-top{display:none}
 .gsap-cinema.motion-on .story-ready .shuffle-stage{height:100svh;min-height:680px;overflow:hidden;isolation:isolate;background:transparent}
 .gsap-cinema.motion-on .story-ready .story-atmosphere{display:block;position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
 .story-orb{position:absolute;display:block;width:min(48vw,680px);aspect-ratio:1;border-radius:50%;filter:blur(85px);opacity:.32;will-change:transform}
 .story-orb-a{left:-12vw;top:28%;background:#d6ff7f}.story-orb-b{right:-17vw;top:-15%;background:#9ac7b4}
 .story-grid{position:absolute;inset:0;background-image:linear-gradient(#17382a0a 1px,transparent 1px),linear-gradient(90deg,#17382a0a 1px,transparent 1px);background-size:54px 54px;mask-image:linear-gradient(transparent,#000 28%,#000 80%,transparent)}
 .gsap-cinema.motion-on .story-ready .story-heading{display:block;position:absolute;z-index:4;top:clamp(72px,8vh,105px);left:var(--gutter);width:42vw;pointer-events:none}
 .story-heading .eyebrow{margin-bottom:12px}.story-heading h2{font-size:clamp(34px,4vw,64px);line-height:.96;max-width:10ch}
 .gsap-cinema.motion-on .story-ready .work-chapters{display:block;position:absolute;z-index:4;top:clamp(78px,9vh,118px);left:53%;right:var(--gutter);height:170px;pointer-events:none}
 .gsap-cinema.motion-on .story-ready .work-chapter{position:absolute;inset:0;opacity:0;visibility:hidden;transform:none}
 .gsap-cinema.motion-on .story-ready .work-chapter.is-active{visibility:visible}
 .work-chapter>span{display:block;font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:#557014;margin-bottom:14px}
 .work-chapter h3{font-size:clamp(30px,3vw,50px);line-height:.98;margin-bottom:13px}.work-chapter p{font-size:15px;line-height:1.5;color:#52655a;max-width:43ch}
 .work-chapter b{position:absolute;z-index:-1;right:-.05em;top:-.25em;font-size:clamp(80px,10vw,170px);line-height:1;font-weight:750;letter-spacing:-.08em;white-space:nowrap;color:#17382a0b}
 .gsap-cinema.motion-on .story-ready .shuffle-rail{--card-h:min(59svh,570px);--card-w:calc(var(--card-h)*.75);position:absolute;z-index:2;left:0;top:clamp(245px,31vh,325px);display:flex;align-items:flex-start;gap:clamp(30px,4vw,68px);width:max-content;padding:0 calc((100vw - var(--card-w))/2);transform:none;perspective:1500px;will-change:transform}
 .gsap-cinema.motion-on .story-ready .shuffle-card{position:relative;inset:auto;flex:0 0 var(--card-w);width:var(--card-w);height:var(--card-h);aspect-ratio:3/4;opacity:1;transform:none;pointer-events:none}
 .gsap-cinema.motion-on .story-ready .shuffle-card.is-current{pointer-events:auto}
 .gsap-cinema.motion-on .story-ready .shuffle-card-inner{height:100%;box-shadow:0 35px 90px #09252034;opacity:.42;filter:none;transform:none;will-change:opacity;transition:none}
 .gsap-cinema.motion-on .story-ready .shuffle-card.is-current .shuffle-card-inner{filter:none;transform:none;box-shadow:0 45px 110px #09252052}
 .gsap-cinema.motion-on .story-ready .shuffle-image img{transform:none;will-change:auto}
 .gsap-cinema.motion-on .story-ready .shuffle-copy .work-summary{display:none}
 .gsap-cinema.motion-on .story-ready .shuffle-copy h3{font-size:clamp(35px,3.5vw,54px)}
 .gsap-cinema.motion-on .story-ready .shuffle-ui{display:flex;position:absolute;z-index:8;left:var(--gutter);right:var(--gutter);bottom:18px;align-items:center;gap:18px;max-width:none;margin:0;color:#53665a}
 .gsap-cinema.motion-on .story-ready .shuffle-count{min-width:54px}
 .gsap-cinema.motion-on .story-ready .shuffle-line{width:min(22vw,260px);height:1px;background:#17382a30;overflow:hidden}
 .gsap-cinema.motion-on .story-ready .shuffle-line i{display:block;width:100%;height:100%;background:#557014;transform:scaleX(0);transform-origin:left center}
 .gsap-cinema.motion-on .story-ready .shuffle-ui>span:last-of-type{font-size:11px;letter-spacing:.12em;text-transform:uppercase}
}

@media(max-width:900px){
 .work-shuffle .shuffle-rail{grid-template-columns:repeat(2,minmax(0,1fr))}
 .gsap-cinema.motion-on .hero{overflow:hidden}
}
@media(max-width:700px) and (min-height:680px) and (prefers-reduced-motion:no-preference){
 .gsap-cinema.motion-on .story-ready .shuffle-stage{min-height:680px}
 .gsap-cinema.motion-on .story-ready .story-heading{top:68px;left:22px;width:auto;right:22px}
 .story-heading h2{font-size:30px;max-width:none}.story-heading h2 br,.story-heading h2 em{display:none}
 .gsap-cinema.motion-on .story-ready .work-chapters{top:142px;left:22px;right:22px;height:72px}
 .work-chapter>span{font-size:10px;margin-bottom:7px}.work-chapter h3{font-size:24px}.work-chapter p,.work-chapter b{display:none}
 .gsap-cinema.motion-on .story-ready .shuffle-rail{--card-h:min(calc(100svh - 300px),112vw,510px);top:218px;gap:28px}
 .gsap-cinema.motion-on .story-ready .shuffle-copy{left:22px;right:22px;bottom:24px}
 .gsap-cinema.motion-on .story-ready .shuffle-copy h3{font-size:36px}
 .gsap-cinema.motion-on .story-ready .shuffle-ui{left:22px;right:22px;bottom:14px;gap:11px}
 .gsap-cinema.motion-on .story-ready .shuffle-line{width:auto;flex:1}.story-skip,.gsap-cinema.motion-on .story-ready .shuffle-ui>span:last-of-type{display:none}
 .story-controls button{width:40px;height:40px}
 .kinetic-word{font-size:34vw}
}
@media(max-width:550px){.work-shuffle{padding:82px 20px}.work-shuffle .shuffle-rail{grid-template-columns:1fr}}
@media(max-width:700px){.service-item>.service-visual{position:relative;top:auto;grid-row:auto;width:100%;aspect-ratio:1.2;margin:2px 0 24px}}
@media(prefers-reduced-motion:reduce){.kinetic-word,.process-progress{display:none}.scroll-word{opacity:1!important;transform:none!important}}
.no-motion .kinetic-word,.no-motion .process-progress{display:none}
