/* Phone layout. Desktop keeps its original compositions and scroll effects. */
@media (max-width: 600px), (max-height: 500px) and (pointer: coarse) {
  .cover { position: relative; width: 100%; min-width: 0; grid-template-columns: minmax(0, 1fr); aspect-ratio: auto; }
  .cover::after { background-size: cover; }
  .cover-sheet { width: 84%; min-width: 0; }
  .cover-meta { gap: 8px; margin-bottom: 8px; }
  .cover-year { margin-top: 8px; }

  .about-details { gap: 20px; padding-inline: 16px; }
  .about-intro h3 { font-size: clamp(38px, 12cqw, 64px); }
  .about-intro p { line-height: 1.5; }

  .contents-card {
    min-height: clamp(140px, 28svh, 225px);
    align-items: end;
    padding: 24px 16px 20px;
    background-blend-mode: multiply;
  }
  .contents-card:first-child { padding-top: 54px; }
  .contents-number { font-size: clamp(62px, 21cqw, 110px); }
  .contents-card h3 {
    margin: 0;
    padding: .35em .48em;
    border-radius: .2em;
    background: #fff8e9ed;
    font-size: clamp(20px, 6cqw, 32px);
  }

  .ruby-spread { grid-template-columns: minmax(0, 1fr) minmax(0, 1.45fr); }
  .ruby-standing { width: 100%; max-width: 100%; margin: 0; }
  .ruby-bio { margin-right: 12px; line-height: 1.45; }
  .mallmory-final p, .little-red-main p { font-size: 16px; line-height: 1.5; }
  .trip-caption { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .trip-caption h2 img { max-width: 340px; }
  .trip-caption p, .trip-studies figcaption { font-size: 16px; }
  .trip-studies figcaption { padding-inline: 16px; }

  .skate-illustration, .skate-witch, .has-flip .skate-process-stage,
  .ward-video-stack .ward-blast { position: relative; top: auto; }
  .skate-process-stage { min-height: 0; }
  .skate-process-card.has-flip::after { display: none; }
  .skate-label-turn { transform: none; }
  .ward-console-stage { height: auto; aspect-ratio: 16 / 10; }
  .ward-console { width: 94%; }
  .nightmare-rows { gap: 4px; }
  .ward-walkthrough { height: auto; aspect-ratio: 16 / 9; border-radius: 10px; }
  .ward-walkthrough video { object-fit: cover; }

  .contact-footer { animation: none; padding: 28px 0 max(24px, env(safe-area-inset-bottom)); }
  .contact-footer-links { grid-template-columns: 1fr 1fr; gap: 16px; }
  .contact-footer-links > :last-child { grid-column: 1 / -1; }
  .contact-footer-links a { display: flex; align-items: center; min-height: 44px; font-size: 14px; }
  .contact-footer-signup input, .contact-footer-signup button { min-height: 44px; font-size: 16px; }
  .footer-dock { display: grid; grid-template-columns: repeat(5, 44px); gap: 6px; }
  .footer-dock a { width: 44px; min-height: 44px; }
}