/* Keep the six Matterport pages balanced from wide desktop to 4K. */
@media (min-width: 901px) and (max-width: 1100px) {
  /* Collapsed platform cards need room for multiword service names. */
  .a360-tours-landing .a360-tours-platform-card h3 {
    font-size: clamp(24px, 2.6vw, 30px);
    white-space: normal;
  }
  .a360-tours-landing .a360-tours-platform-card-copy {
    padding: clamp(18px, 2vw, 24px);
  }
}

@media (min-width: 1800px) {
  .a360-landing:is(
    .a360-tours-landing,
    .a360-matterport-res,
    .a360-matterport-commercial,
    .a360-matterport-multifamily,
    .a360-builder-service,
    .a360-floor-plans
  ) .a360-shell {
    max-width: min(80vw, 2000px);
    padding-inline: clamp(48px, 3.4vw, 96px);
  }

  /* The service hub uses a broader composition than its individual pages. */
  .a360-landing.a360-tours-landing .a360-shell {
    max-width: min(80vw, 2440px);
    padding-inline: clamp(48px, 3.4vw, 112px);
  }

  /* Match the edge of each page's wide shell in the full-bleed builder story. */
  .a360-tours-landing .a360-builder-story-cta {
    max-width: min(80vw, 2440px);
  }
  .a360-builder-service .a360-builder-story-cta {
    max-width: min(80vw, 2000px);
  }
  .a360-tours-landing .a360-builder-story-status {
    right: calc((100vw - min(80vw, 2440px)) / 2 + clamp(48px, 3.4vw, 112px));
  }
  .a360-builder-service .a360-builder-story-status {
    right: calc((100vw - min(80vw, 2000px)) / 2 + clamp(48px, 3.4vw, 96px));
  }
  .a360-builder-service .a360-builder-story.is-error .a360-builder-story-status {
    right: calc((100vw - min(80vw, 2000px)) / 2 + clamp(48px, 3.4vw, 96px));
  }
}

@media (min-width: 2200px) {
  /* The builder scan grows at 4K while fitting shorter browser windows. */
  .a360-builder-service .bs-spotlight-player {
    height: clamp(440px, 74svh, 1350px);
  }
}

@media (min-width: 601px) and (min-aspect-ratio: 3/2) and (prefers-reduced-motion: no-preference) {
  /* Keep the roofline/plan comparison visible on short, wide displays. */
  .a360-floor-plans .fp-match-scroll {
    --fp-match-width: min(90vw, 153svh);
  }
  .a360-floor-plans .fp-match-frame {
    max-width: 170svh;
  }
}