/* Sessions: a compact collection of performances and releases. */
.sound { border-top:1px solid var(--line); padding-block:clamp(40px,6vw,90px) clamp(64px,7vw,110px); scroll-margin-top:24px; }
.sound-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); grid-template-areas:"intro intro intro" "performance session release" "socials socials socials"; gap:40px 30px; margin-top:38px; align-items:start; }
.sound-grid>* { min-width:0; }
.sound-intro { grid-area:intro; padding-bottom:20px; }
.sound-intro h3 { margin-top:12px; font-size:clamp(28px,3vw,46px); font-weight:600; line-height:1.02; letter-spacing:-.045em; }
.sound-performance { grid-area:performance; }
.sound-release { grid-area:release; }
.sound-session { grid-area:session; display:block; }
.sound-socials { display:flex; flex-wrap:wrap; justify-content:flex-start; align-items:center; gap:14px 28px; grid-area:socials; align-self:end; }
.sound-socials>div { display:flex; gap:24px; }
.sound-socials a,.sound-platforms a,.sound-text-link { font:11px/1.7 var(--mono); text-underline-offset:5px; }
.sound-caption { margin-top:22px; }
.sound-caption h4 { margin:10px 0 12px; font-size:clamp(26px,2.5vw,38px); font-weight:600; line-height:1.02; letter-spacing:-.045em; }
.sound-caption p { font-size:14px; line-height:1.7; }
.sound-caption p a { text-decoration:underline; text-underline-offset:3px; }
.sound-caption .sound-text-link { display:inline-block; margin-top:15px; }
.sound-cover { display:block; aspect-ratio:16/9; overflow:hidden; background:#090e11; }
.sound-cover img { display:block; width:100%; height:100%; object-fit:cover; object-position:center bottom; transform-origin:center bottom; transition:transform .6s; }
.sound-cover:hover img { transform:scale(1.025); }
.sound-platforms { display:flex; flex-wrap:wrap; gap:8px 18px; margin-top:20px; }
.video-shell { position:relative; width:100%; aspect-ratio:16/9; background:#080a09; overflow:hidden; }
.video-trigger { display:block; width:100%; height:100%; position:relative; }
.video-trigger:focus-visible { outline:3px solid var(--orange); outline-offset:-3px; }
.video-trigger[hidden],.video-close[hidden] { display:none; }
.video-trigger img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .6s,filter .4s; }
.video-trigger:hover img { transform:scale(1.015); filter:brightness(.85); }
.video-play { position:absolute; left:16px; bottom:16px; display:grid; place-items:center; width:44px; height:44px; background:var(--bg); color:var(--paper); border:1px solid var(--muted); border-radius:0; transition:color .2s,border-color .2s; }
.video-trigger:is(:hover,:focus-visible) .video-play { color:var(--orange); border-color:var(--orange); }
.video-play svg { width:24px; height:24px; fill:currentColor; }
.video-shell.is-playing { min-height:200px; }
.video-shell iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
.video-close { position:absolute; right:10px; top:10px; z-index:2; background:#141514; border:1px solid #888; border-radius:3px; font:11px var(--mono); padding:10px 14px; }
.video-close:hover { background:var(--paper); color:var(--bg); }
.project-film { max-width:1000px; margin:45px auto 60px; }
.project-film>p { margin-top:16px; font:11px/1.7 var(--mono); }

@media(prefers-reduced-motion:no-preference) {
  .sound .video-trigger,.sound-cover { animation:section-arrive linear both; animation-timeline:view(); animation-range:entry 0% entry 20%; }
}
@media(max-width:1000px) {
  .sound-grid { gap:34px 22px; }
}
@media(max-width:700px) {
  .sound { padding-block:40px 65px; }
  .sound-grid { grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-areas:"intro intro" "performance performance" "session release" "socials socials"; gap:32px 20px; margin-top:30px; }
  .sound-intro { padding:0; }
  .sound-intro h3 { font-size:34px; }
  .sound-release,.sound-session { padding-top:26px; border-top:1px solid var(--line); }
  .sound-caption h4 { font-size:24px; }
  .sound-platforms { flex-direction:column; }
  .sound-session p { font-size:13px; }
  .sound-socials { display:block; }
  .sound-socials>div { margin-top:14px; }
}
@media(max-width:380px) {
  .sound-platforms { margin-top:15px; }
  .video-play { bottom:12px; left:12px; }
}