.js body{overflow-x:clip}
.section{padding-block:clamp(4.25rem,6vw,6.25rem)}
.section-tight{padding-block:clamp(2.75rem,4.5vw,4rem)}
.section-header{margin-bottom:clamp(1.75rem,3.5vw,3rem)}
.intro-statement{min-height:min(64svh,43rem)}
.final-cta{min-height:60vh}
.page-hero{min-height:60vh;padding-block:clamp(6.5rem,9vw,8.5rem) clamp(3rem,5vw,4.5rem)}
.page-hero+.section{padding-top:clamp(2.75rem,4vw,3.75rem)}
.case-hero{min-height:70vh}
.track-card{min-height:22rem}
.project-card{min-height:26rem}
.site-footer{padding:4rem 0 1.5rem}
.footer-bottom{margin-top:3rem}

.cinematic-progress{position:fixed;inset:var(--header-h) 0 auto;z-index:99;height:1px;pointer-events:none;background:linear-gradient(90deg,var(--accent),var(--blue),var(--violet));transform:scaleX(var(--scroll-progress,0));transform-origin:left;box-shadow:0 0 18px rgba(var(--accent-rgb),.55);will-change:transform}

.cinematic-band{position:relative;overflow:hidden;padding-block:clamp(4rem,7vw,6.5rem);border-block:1px solid var(--line);background:linear-gradient(180deg,rgba(5,8,13,.35),rgba(8,16,25,.9))}
.cinematic-band::before{content:"";position:absolute;inset:-25% -10%;pointer-events:none;background:radial-gradient(circle at calc(20% + var(--scene-x,0%)) 35%,rgba(83,245,232,.11),transparent 28%),radial-gradient(circle at 82% 68%,rgba(154,120,255,.09),transparent 30%)}
.cinematic-heading{display:grid;grid-template-columns:1.15fr .55fr;gap:2rem;align-items:end;margin-bottom:2rem}
.cinematic-heading h2{font-size:clamp(2.5rem,5.6vw,6.2rem);max-width:11ch;line-height:.9}
.cinematic-heading p{max-width:34rem}
.cinematic-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-rows:clamp(11rem,16vw,15rem);gap:.85rem}
.cinematic-media{position:relative;margin:0;overflow:hidden;isolation:isolate;border:1px solid rgba(255,255,255,.12);border-radius:1.1rem;background:#081018;box-shadow:0 26px 70px rgba(0,0,0,.32);transform:translate3d(0,var(--enter-y,0),0) perspective(1000px) rotateX(var(--tilt-y,0deg)) rotateY(var(--tilt-x,0deg));transition:transform .9s var(--ease-premium),border-color .45s,box-shadow .6s;will-change:transform,clip-path}
.js .cinematic-media{--enter-y:1.5rem;opacity:.3;clip-path:inset(0 0 100% 0 round 1.1rem);transition:clip-path 1.15s var(--ease-premium),opacity .8s,transform .9s var(--ease-premium),border-color .45s,box-shadow .6s}
.js .cinematic-media.is-visible{--enter-y:0;opacity:1;clip-path:inset(0 0 0 0 round 1.1rem)}
.cinematic-media:hover{border-color:rgba(var(--accent-rgb),.38);box-shadow:0 35px 95px rgba(0,0,0,.48)}
.cinematic-media::before{content:"";position:absolute;inset:-35% -80%;z-index:2;pointer-events:none;background:linear-gradient(105deg,transparent 43%,rgba(255,255,255,.16) 49%,transparent 55%);transform:translate3d(-38%,0,0);opacity:0}
.js .cinematic-media.is-visible::before{animation:cinematic-sheen 1.6s .28s var(--ease-premium) both}
.cinematic-media::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(145deg,rgba(255,255,255,.08),transparent 30%),linear-gradient(0deg,rgba(5,8,13,.74),transparent 52%)}
.cinematic-media img{width:100%;height:calc(100% + 3rem);object-fit:cover;display:block;transform:translate3d(0,calc(var(--parallax-y,0)*1px),0) scale(1.075);transition:filter .6s;will-change:transform}
.cinematic-media:hover img{filter:saturate(1.08) contrast(1.025)}
.hero-portrait img{transform:translate3d(0,calc(var(--parallax-y,0)*.35px),0) scale(1.06)}
.hero-portrait:hover img{transform:translate3d(0,calc(var(--parallax-y,0)*.35px),0) scale(1.085)}
.cinematic-media figcaption{position:absolute;inset:auto 1rem 1rem;z-index:3;display:flex;justify-content:space-between;align-items:end;gap:1rem;color:#fff}
.cinematic-media figcaption strong{font-size:clamp(1rem,1.5vw,1.35rem)}
.cinematic-media figcaption span{color:#bdc8d2;font-size:.62rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.cinematic-grid .cinematic-media:nth-child(1){grid-column:span 5;grid-row:span 2}
.cinematic-grid .cinematic-media:nth-child(2){grid-column:span 3}
.cinematic-grid .cinematic-media:nth-child(3){grid-column:span 4}
.cinematic-grid .cinematic-media:nth-child(4){grid-column:span 4}
.cinematic-grid .cinematic-media:nth-child(5){grid-column:span 3}

.process-mosaic{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-rows:clamp(13rem,21vw,20rem);gap:1rem}
.process-mosaic .cinematic-media:nth-child(1){grid-column:span 7;grid-row:span 2}
.process-mosaic .cinematic-media:nth-child(2){grid-column:span 5}
.process-mosaic .cinematic-media:nth-child(3){grid-column:span 5}
.process-mosaic .cinematic-media:nth-child(4){grid-column:3/span 8}

.portrait-story{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(1rem,3vw,2.5rem);align-items:stretch}
.grid+.portrait-story{margin-top:1rem}
.portrait-story+.portrait-story{margin-top:1rem;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}
.portrait-story+.portrait-story .portrait-story-media{order:2}
.portrait-story-media{min-height:clamp(22rem,42vw,38rem)}
.portrait-story-copy{display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(1.5rem,4vw,4rem);border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(150deg,rgba(var(--accent-rgb),.08),rgba(11,17,25,.88))}
.portrait-story-copy h3{margin-top:1rem;font-size:clamp(2rem,4.4vw,4.6rem);line-height:.92;max-width:10ch}
.portrait-story-copy p{margin-top:1.2rem;max-width:38rem}

.portfolio-editorial{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(20rem,.9fr);gap:1rem;align-items:stretch;margin-bottom:clamp(2.5rem,5vw,5rem)}
.portfolio-editorial .cinematic-media{min-height:clamp(25rem,48vw,42rem)}
.portfolio-editorial-copy{display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(1.5rem,4vw,4rem);border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(145deg,#0d1720,#090d14)}
.portfolio-editorial-copy h2{font-size:clamp(2.2rem,4.5vw,4.8rem);line-height:.93;max-width:10ch}
.portfolio-editorial-copy p{margin-top:1.2rem}

.gallery-grid{grid-template-columns:repeat(12,minmax(0,1fr));max-width:none!important}
.case-gallery-section{grid-template-columns:1fr;gap:clamp(1.5rem,3vw,2.5rem)}
.case-gallery-section .case-copy{max-width:none}
.gallery-grid .gallery-slot{grid-column:span 6;min-height:clamp(18rem,30vw,29rem)}
.gallery-grid .gallery-slot:nth-child(1){grid-column:span 7}
.gallery-grid .gallery-slot:nth-child(2){grid-column:span 5}
.gallery-grid .gallery-slot:nth-child(3){grid-column:span 4}
.gallery-grid .gallery-slot:nth-child(4){grid-column:span 8}
.gallery-grid .gallery-slot:nth-child(5){grid-column:span 12;min-height:clamp(22rem,42vw,38rem)}
.gallery-slot{transform:translateY(calc(var(--parallax-y,0)*.35px));will-change:transform}

@media(max-width:900px){
  .section{padding-block:clamp(4rem,8vw,5.5rem)}
  .cinematic-heading,.portfolio-editorial{grid-template-columns:1fr}
  .cinematic-grid{grid-auto-rows:13rem}
  .cinematic-grid .cinematic-media:nth-child(n){grid-column:span 6;grid-row:span 1}
  .cinematic-grid .cinematic-media:nth-child(1){grid-row:span 2}
  .process-mosaic .cinematic-media:nth-child(n){grid-column:span 6;grid-row:span 1}
  .process-mosaic .cinematic-media:nth-child(1){grid-row:span 2}
  .portrait-story,.portrait-story+.portrait-story{grid-template-columns:1fr 1fr}
  .gallery-grid .gallery-slot:nth-child(n){grid-column:span 6}
  .gallery-grid .gallery-slot:nth-child(5){grid-column:span 12}
}

@media(max-width:680px){
  .section{padding-block:4rem}.section-tight{padding-block:3rem}
  .intro-statement{min-height:58svh}.final-cta{min-height:58vh}
  .track-card{min-height:19rem}.project-card{min-height:23rem}
  .cinematic-band{padding-block:3.5rem}.cinematic-heading{margin-bottom:1.35rem}
  .cinematic-grid,.process-mosaic{grid-template-columns:1fr;grid-auto-rows:15.5rem}
  .cinematic-grid .cinematic-media:nth-child(n),.process-mosaic .cinematic-media:nth-child(n){grid-column:auto;grid-row:auto}
  .portrait-story,.portrait-story+.portrait-story{grid-template-columns:1fr}
  .portrait-story+.portrait-story .portrait-story-media{order:0}
  .portrait-story-media{min-height:25rem}
  .portfolio-editorial .cinematic-media{min-height:27rem}
  .gallery-grid{grid-template-columns:1fr}
  .gallery-grid .gallery-slot:nth-child(n){grid-column:auto;min-height:18rem}
  .gallery-grid .gallery-slot:nth-child(5){min-height:20rem}
}

@media(prefers-reduced-motion:reduce){
  .cinematic-progress{display:none}.js .cinematic-media{opacity:1;clip-path:none;transition:none}
  .cinematic-media,.cinematic-media img,.gallery-slot{transform:none!important;transition:none!important}
  .cinematic-media::before{display:none!important;animation:none!important}
}

@keyframes cinematic-sheen{0%{opacity:0;transform:translate3d(-38%,0,0)}22%{opacity:.58}100%{opacity:0;transform:translate3d(38%,0,0)}}

@media print{.cinematic-band,.process-mosaic,.portrait-story,.portfolio-editorial,.cinematic-progress{display:none!important}}
