/* The project opens as one full-screen film, then continues into its details. */
.project-hero { min-height: 100svh !important; padding: 0 !important; display: block !important; background: var(--black); }
.project-video-wrap { position: absolute !important; z-index: 0 !important; inset: 0 !important; width: 100vw !important; height: 100svh !important; aspect-ratio: auto !important; overflow: hidden; }
.project-video-wrap video { position: absolute !important; z-index: 0 !important; inset: 0 !important; width: 100vw !important; height: 100svh !important; min-width: 100% !important; min-height: 100% !important; object-fit: cover; }
.project-video-wrap .project-hero-shade { position: absolute !important; z-index: 1 !important; inset: 0 !important; background: linear-gradient(0deg,rgba(0,0,0,.72),rgba(0,0,0,.04) 72%) !important; }
.project-hero-copy { position: absolute; z-index: 2; left: 6vw; bottom: 7vw; max-width: 48rem; color: var(--white); }
.project-hero-copy > p:first-child { margin: 0 0 1rem; color: var(--white); }
.project-hero-copy h2 { margin: 0; font-size: clamp(58px,10vw,160px); font-weight: 700; letter-spacing: -.085em; line-height: .85; }
.project-hero-copy .project-video-title { color: rgba(247,246,241,.72); }
.project-hero-copy .project-intro { color: var(--white); }
.media-controls { position: absolute; z-index: 3; top: 22px; right: 6vw; display: flex; gap: .45rem; }
.media-controls button,.project-close { position: static !important; display: grid; width: 42px; height: 42px; min-width: 0; min-height: 0; place-items: center; margin: 0; padding: 0; border: 1px solid var(--white); background: rgba(17,17,18,.45); color: var(--white); cursor: pointer; }
.media-controls button:hover { background: rgba(17,17,18,.72); color: var(--white); }
.media-controls button.is-on { background: var(--white); color: var(--black); }
.media-controls svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.video-sound.is-on svg path:nth-child(n+2) { stroke-width: 2.25; }
/* The supplied project reels place the active vertical film on the left of a wide black canvas.
   This crops only that empty canvas area at desktop scale; media files stay untouched. */
@media (min-width: 701px) { .project-video-wrap video { left: 0 !important; right: auto !important; width: 300vw !important; min-width: 300vw !important; max-width: none !important; height: 100svh !important; transform: none !important; transform-origin: left center; object-fit: cover; object-position: left center; } }
@media (max-width: 700px) { .project-hero { min-height: 100svh !important; }.project-video-wrap { position: absolute !important; inset: 0 !important; aspect-ratio: auto !important; }.project-hero-copy { left: 22px; right: 22px; bottom: 44px; padding: 0 !important; }.project-hero-copy h2 { font-size: 15vw; }.media-controls { top: 16px; right: 16px; bottom: auto; }.media-controls button { width: 42px; height: 42px; }.project-hero-copy .project-intro { max-width: 29rem; } }