/* October launch additions; keep the existing film and free resources intact. */
.home-page .hero h1 { font-size: 6rem; letter-spacing: 0; }
.home-page .hero { min-height: calc(100svh - 48px); }
.home-page .hero-title-line { white-space: normal; }
.demo-section { background: #101318; border-bottom: 1px solid var(--line); }
.demo-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 400px);
  align-items: center;
  gap: 80px;
}
.demo-copy h2 {
  font-size: 3.8rem;
  line-height: 1;
  text-transform: uppercase;
  margin-bottom: 24px;
}
.demo-copy > p { color: var(--muted); line-height: 1.7; }
.demo-highlights { list-style: none; padding: 0; margin: 28px 0 34px; }
.demo-highlights li {
  padding: 16px 0;
  border-bottom: 1px solid var(--line);
  font-size: 1.05rem;
  font-weight: 700;
}
.demo-highlights span { color: var(--red); margin-right: 18px; font-size: 0.8rem; }
.demo-player, .coach-screenshot { min-width: 0; margin: 0; }
.demo-player video {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 9 / 16;
  object-fit: contain;
  background: #050607;
  border: 1px solid var(--line);
  border-radius: 8px;
}
.demo-player figcaption, .coach-screenshot figcaption, .media-note {
  margin-top: 16px;
  color: var(--muted);
  font-size: 0.82rem;
  line-height: 1.6;
}
.coach-screenshot { width: min(100%, 326px); justify-self: center; }
.coach-screenshot img { width: 100%; height: auto; border: 1px solid var(--line); border-radius: 8px; }
.device-frame img { height: auto; aspect-ratio: 1080 / 2316; object-fit: contain; }
.screen-caption .text-link { font-size: 0.8rem; margin-top: 14px; }
.screen-caption #showcase-status { min-height: 1.6em; font-size: 0.8rem; }
.screenshot-note { text-align: center; }
@media (max-width: 1040px) {
  .home-page .hero h1 { font-size: 5.4rem; }
  .demo-layout { gap: 40px; }
  .demo-copy h2 { font-size: 3.3rem; }
}
@media (max-width: 840px) {
  .demo-layout { grid-template-columns: minmax(0, 1fr); gap: 38px; }
  .demo-player { width: min(100%, 360px); justify-self: center; }
}
@media (max-width: 600px) {
  .home-page .hero { padding-top: 144px; padding-bottom: 56px; }
  .home-page .hero h1 { font-size: 3.5rem; }
  .demo-copy h2 { font-size: 2.55rem; }
}
@media (max-width: 360px) {
  .home-page .hero h1 { font-size: 3rem; }
}