/* Reuse the original authored collage behind the existing programme scene.
   The director owns entrance/scale/rail motion; the ink owns state crossfades. */
.local-preview-page .schedule[data-map-renderer='collage'] {
  --programme-map-width: min(82.917%, 1880px);
}

.local-preview-page .schedule[data-map-renderer='collage'] .schedule-map {
  top: var(--programme-map-top, 35px);
  height: auto;
  aspect-ratio: 3 / 2;
  z-index: 0;
}

.local-preview-page
  .schedule[data-map-renderer='collage']:not([data-programme-mode='scroll'])
  .schedule-map {
  opacity: 1;
  transform: translateX(-50%);
}

.local-preview-page .schedule[data-map-renderer='collage'] .schedule-map > .pm-map-stage {
  position: absolute;
  inset: 0 0 auto;
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 2;
  overflow: hidden;
  transform: none;
  --pm-map-opacity: 0.18;
}

[data-theme='dark']
  .local-preview-page
  .schedule[data-map-renderer='collage']
  .schedule-map
  > .pm-map-stage {
  --pm-map-opacity: 0.12;
}

.local-preview-page .schedule[data-map-renderer='collage'] canvas[data-dot-map],
.local-preview-page .schedule[data-map-renderer='collage'] .local-map-glow {
  display: none;
}

/* Keep short descriptions aligned with the two-line copy in the other moments.
   Longer copy can still expand naturally on phones and with enlarged text. */
.local-preview-page .schedule[data-map-renderer='collage'] .schedule-card-copy > div > p {
  min-block-size: 2lh;
}

/* Compact typography is ready before the director sets its static mode.
   Loading JavaScript must not resize an already visible programme title. */
@media (max-width: 800px),
  (max-width: 900px) and (max-height: 559px),
  (max-width: 900px) and (prefers-reduced-motion: reduce) {
  .local-preview-page .local-hub .schedule[data-map-renderer='collage'] .schedule-heading h2 {
    font-size: clamp(2.75rem, 10.5vw, 3.75rem);
    line-height: 0.95;
  }
}

/* The tablet print frames follow the artwork's proportions, so contain keeps
   every logo and portrait without exposing white strips beside the image. */
@media (min-width: 600px) and (max-width: 900px) {
  .local-preview-page
    .schedule[data-map-renderer='collage'][data-programme-mode='static']
    .schedule-photo.local-programme-image {
    aspect-ratio: 1206 / 1098;
  }
}

/* These tablets retain the full fixed header, including in shorter windows.
   The legacy short-desktop title offset would put it behind that header. */
@media (min-width: 801px) and (max-width: 900px) {
  .local-preview-page
    .schedule[data-map-renderer='collage'][data-programme-mode='scroll']
    .schedule-heading {
    top: clamp(88px, calc(var(--programme-scene-height, 900px) * 0.06 + 56px), 140px);
  }
}

/* Figma 1003:18727 at 1440px: the illustrated backdrop keeps its authored
   size instead of shrinking to the old dot grid's available vertical slot.
   The compact landscape and mobile treatments retain their existing rules. */
@media (min-width: 901px) {
  .local-preview-page .schedule[data-map-renderer='collage'] {
    margin-block-start: clamp(var(--space-12), 5.555556vw, 7rem);
  }

  .local-preview-page .schedule[data-map-renderer='collage'] .schedule-map {
    left: 51.319444%;
    top: var(--programme-map-top, clamp(24px, 2.455183cqw, 48px));
    aspect-ratio: 1194 / 797.271484375;
  }

  .local-preview-page
    .schedule[data-map-renderer='collage'][data-programme-mode='scroll']
    .schedule-map {
    width: var(--programme-map-width);
  }

  .local-preview-page
    .schedule[data-map-renderer='collage'][data-programme-mode='static']
    :is(.schedule-card, .schedule-card + .schedule-card) {
    width: min(100%, var(--programme-card-width));
    max-width: none;
  }
}

@media (min-width: 901px) and (min-height: 720px) {
  .local-preview-page .schedule[data-map-renderer='collage'] {
    --programme-card-width: clamp(440px, 42.083333cqw, 840px);
    --programme-heading-size: clamp(var(--text-display-sm), 4.583333cqw, 5.75rem);
    --programme-cta-gap: var(--space-10);
  }

  .local-preview-page
    .schedule[data-map-renderer='collage'][data-programme-mode='static']
    .schedule-track {
    margin-top: var(--space-10);
  }

  .local-preview-page .schedule[data-map-renderer='collage'] .schedule-card {
    border-radius: clamp(20px, 1.666667cqw, 32px);
  }

  .local-preview-page .schedule[data-map-renderer='collage'] .schedule-heading {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: clamp(var(--space-3), 1.111111cqw, var(--space-6));
  }

  .local-preview-page
    .schedule[data-map-renderer='collage'][data-programme-mode='scroll']
    .schedule-heading {
    top: clamp(64px, 5.555556cqw, 112px);
  }

  .local-preview-page
    .schedule[data-map-renderer='collage'][data-programme-mode='static']
    .schedule-pin {
    padding-top: clamp(64px, 5.555556cqw, 112px);
  }

  .local-preview-page .schedule[data-map-renderer='collage'] .schedule-heading .kicker {
    margin: 0;
    font-size: clamp(var(--text-sm), 1.25cqw, var(--text-title));
    line-height: 1.222222;
    letter-spacing: 0;
  }

  .local-preview-page .schedule[data-map-renderer='collage'] .schedule-heading h2 {
    width: max-content;
    max-width: 100%;
    margin: 0;
    font-size: var(--programme-heading-size);
    line-height: 0.96969697;
    letter-spacing: 0;
  }
}
