.hero-art .hero-film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:62% 50%;opacity:0;pointer-events:none}
.hero-art.video-ready:not(.fluid-ready)>.hero-film{opacity:.92}
.fluid-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;opacity:0}
.fluid-ready>.fluid-canvas{opacity:1}
.fluid-ready>img{opacity:0!important}
.hero-art::after{z-index:2;pointer-events:none}
.hero-art.fluid-ready>.fluid-canvas{opacity:.92}
.work-image .fluid-canvas{inset:-7%;width:114%;height:114%;z-index:1}
.work-image.fluid-ready{overflow:visible;background:transparent}
.work-image .image-open{z-index:2}
.work-track{touch-action:pan-y;user-select:none}
.work-image,.work-image img{cursor:grab;-webkit-user-drag:none}
.gallery-dragging,.gallery-dragging *{cursor:grabbing!important;user-select:none!important}
.gallery-dragging .image-open{opacity:0!important}
.gallery-dragging .cursor{border-color:var(--accent);background:#f4554d18}
.drag-hint{display:inline-flex;align-items:center;gap:9px}
.drag-hint i.ph{font-size:17px}.drag-mobile{display:none}
.film-navigation{position:absolute;right:var(--gutter);bottom:calc(14.5vw + 48px);width:270px;z-index:3}
.film-chapters{display:flex;justify-content:space-between;gap:14px;font-size:12px;color:#a0a3a8}
.film-chapters span{transition:color .3s}
.film-chapters .active{color:var(--ink)}
.film-progress{height:1px;background:#666a6f77;margin-top:14px}
.film-progress-fill{display:block;width:100%;height:100%;background:var(--accent);transform:scaleX(0);transform-origin:left}
.film-navigation>p{margin-top:12px;font-size:11px;color:var(--muted);text-align:right}
.sound-toggle{min-width:110px;justify-content:flex-end}
.sound-toggle>.sound-wave{display:flex}
.sound-wave{height:20px;display:flex;align-items:center;gap:3px}
.sound-wave i{display:block;width:2px;height:3px;background:var(--accent)}
.sound-wave i:nth-child(2),.sound-wave i:nth-child(4){height:8px}
.sound-wave i:nth-child(3){height:13px}
.sound-toggle.playing .sound-wave i{animation:audio-level .9s ease-in-out infinite alternate}
.sound-toggle.playing .sound-wave i:nth-child(2){animation-delay:-.2s}
.sound-toggle.playing .sound-wave i:nth-child(3){animation-delay:-.55s}
.sound-toggle.playing .sound-wave i:nth-child(4){animation-delay:-.35s}
.sound-toggle.playing .sound-wave i:nth-child(5){animation-delay:-.7s}
@keyframes audio-level{from{transform:scaleY(.45)}to{transform:scaleY(1.6)}}
.capability p{font-size:12px;line-height:1.85;max-width:31em}
.capability{align-items:flex-start;padding:23px 0}
.capability>i{margin-top:5px}
.journey-reflection{display:grid;grid-template-columns:1fr 2fr;gap:5vw;margin-top:60px;padding-top:34px;border-top:1px solid var(--line)}
.journey-reflection h3{font-size:25px;font-weight:500}
.journey-reflection p{color:var(--muted);font-size:14px;line-height:2;max-width:65ch}
.case-deliverables{display:grid;grid-template-columns:1fr 2fr;gap:45px;margin-top:30px;padding-top:24px;border-top:1px solid var(--line)}
.case-deliverables h3{font-size:16px;font-weight:500}
.case-deliverables ul{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:12px 20px;color:var(--muted);font-size:13px}
.case-deliverables li{display:flex;align-items:center;gap:10px}
.case-deliverables i{font-size:18px;color:var(--accent)}
.menu-dialog{perspective:1100px}
.menu-dialog[open] nav a{animation:menu-arrive .65s var(--ease) backwards;transform-origin:left center;transition:transform .5s var(--ease),color .3s}
.menu-dialog[open] nav a:nth-child(2){animation-delay:.045s}
.menu-dialog[open] nav a:nth-child(3){animation-delay:.09s}
.menu-dialog[open] nav a:nth-child(4){animation-delay:.135s}
.menu-dialog[open] nav a:nth-child(5){animation-delay:.18s}
.menu-dialog[open] nav a:hover{transform:translateX(12px) rotateY(-9deg)}
@keyframes menu-arrive{from{opacity:.3;transform:translateX(35px) rotateY(20deg)}to{opacity:1;transform:translateX(0) rotateY(0)}}
@media(min-width:901px) and (max-height:790px){.film-navigation{bottom:calc(13vw + 40px);right:8vw}}
@media(max-width:900px){.film-navigation{right:6vw;bottom:calc(14.5vw + 40px);width:240px}.drag-desktop{display:none}.drag-mobile{display:inline}.sound-toggle{min-width:44px;min-height:44px}.work-image .fluid-canvas{border-radius:12px}.journey-reflection{gap:30px}}
@media(max-width:600px){.hero-art.fluid-ready>.fluid-canvas,.hero-art.video-ready:not(.fluid-ready)>.hero-film{opacity:.6}.film-navigation{left:24px;right:auto;bottom:110px;width:calc(100% - 48px)}.film-navigation>p{text-align:left;margin-top:9px}.film-chapters{justify-content:flex-start;gap:24px;font-size:11px}.hero-copy{width:100%}.hero-description{max-width:65%}.journey-reflection{grid-template-columns:1fr;gap:18px;margin-top:35px}.case-deliverables{grid-template-columns:1fr;gap:18px}.case-deliverables ul{font-size:12px}.sound-toggle .sound-label{font-size:10px}.sound-toggle{gap:6px}.menu-dialog nav a:hover{transform:none}.capability p{max-width:100%}}
@media(prefers-reduced-motion:reduce){.fluid-canvas,.film-navigation,.hero-film{display:none!important}.fluid-ready>img{opacity:1!important}.sound-wave i,.menu-dialog[open] nav a{animation:none!important}.work-image.fluid-ready{overflow:hidden}.menu-dialog nav a:hover{transform:none}}
@media print{.fluid-canvas,.hero-film,.film-navigation,.sound-toggle{display:none!important}.fluid-ready>img{opacity:1!important}}
