/* Multimedia page styles – keep lightweight and leverage base.css */
.page-hero {
  position: relative;
  padding: var(--space-56) 0 var(--space-40);
  background:
    radial-gradient(120% 80% at 10% -10%, rgba(0,229,255,0.10), transparent 60%),
    radial-gradient(120% 80% at 100% 0%, rgba(255,159,26,0.08), transparent 60%);
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.page-hero .kicker {
  font-family: var(--font-display);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-primary);
  margin-bottom: var(--space-8);
}
.page-hero h1 { margin-bottom: var(--space-12); }
.page-hero .hero-sub { color: var(--color-text-muted);  }
.page-hero .hero-cta { margin-top: var(--space-24); display: flex; gap: var(--space-12); flex-wrap: wrap; }

.section { padding: var(--space-48) 0; }
.section--tight { padding-top: var(--space-40); }
.section-header { margin-bottom: var(--space-24); }
.section-header h2 { margin-bottom: var(--space-8); }
.section-intro { color: var(--color-text-muted); }
.section-actions { margin-top: var(--space-20); display: flex; gap: var(--space-12); flex-wrap: wrap; }

/* Media grid */
.media-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: var(--space-16); }
.media-card { position: relative; display: flex; flex-direction: column; gap: var(--space-12); }
.media-figure { display: grid; gap: var(--space-8); }
.media-thumb { width: 100%; border-radius: var(--radius-md); }
.media-meta { display: flex; flex-direction: column; gap: 2px; font-size: var(--text-sm); color: var(--gray-300); }
.media-meta .meta-sub { color: var(--color-text-muted); font-size: var(--text-xs); }
.play-button { align-self: flex-start; }

/* Map tips */
.map-wrap { gap: var(--space-16); align-items: stretch; }
.map-tips { display: grid; gap: var(--space-12); padding: 0;}
.map-tips li { color: var(--gray-100); }
.map-tips i { color: var(--color-primary); margin-right: 8px; }

/* Cinematic list */
.cinematic-list { display: grid; gap: var(--space-12); }
.cinematic-row { display: flex; align-items: center; justify-content: space-between; gap: var(--space-12); }

/* Tracks */
.track-list { display: grid; gap: var(--space-12); }
.track-item { display: flex; align-items: center; justify-content: space-between; gap: var(--space-12); }
.track-title { display: inline-flex; align-items: center; gap: 10px; color: var(--gray-100); }

/* Downloads */
.download-grid { display: grid; gap: var(--space-16); grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.download-card { display: grid; gap: var(--space-12); align-content: start; }

/* Responsive video modal */
.video-modal { position: fixed; inset: 0; background: rgba(4,7,12,0.82); display: grid; place-items: center; padding: var(--space-16); z-index: 80; }
.video-modal[hidden] { display: none; }
.video-dialog { width: min(100%, 920px); }
.video-dialog__header { display: flex; align-items: center; justify-content: space-between; gap: var(--space-12); margin-bottom: var(--space-12); }
.video-frame { padding: var(--space-8); }
.video-aspect { position: relative; width: 100%; aspect-ratio: 16 / 9; }
.video-aspect iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; border-radius: var(--radius-md); }

/* Small tweaks */
@media (max-width: 520px) {
  .cinematic-row { flex-direction: column; align-items: flex-start; }
  .track-item { flex-direction: column; align-items: flex-start; }
}