@media (max-width: 700px) {
  :root {
    --gutter: 20px;
    --header-height: calc(64px + env(safe-area-inset-top, 0px));
    --mobile-connector: 10svh;
    --mobile-lettering: max(240px, 30svh);
    --mobile-print-frame: calc((100vw - 40px) * .707222 + 40px);
    --mobile-print-travel: 40svh;
  }

  .site-header { gap: 12px; }
  .site-header nav { gap: 8px; font-size: 13px; }
  .motion-toggle { font-size: 11px; height: 44px; padding-inline: 10px; }

  .corpus-intro:first-child { padding-top: calc(var(--header-height) + 24px); padding-bottom: 16px; gap: 24px; }
  .corpus-intro-note { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 8px 12px; width: 100%; }
  .corpus-intro-note > p:first-child { grid-column: 1 / -1; margin: 0; font-size: 12px; }
  .corpus-intro-note > p:nth-child(2) { font-size: 26px; line-height: 1.15; }
  .corpus-intro-note > a { gap: 12px; margin: 0; font-size: 12px; white-space: nowrap; }

  .opening, .opening .opening-stage { height: var(--mobile-connector); min-height: 0; }
  .brand .brand-composition { height: var(--mobile-lettering); min-height: 0; padding-block: 20px; }
  .brand .brand-title { font-size: clamp(72px, 21vw, 92px); line-height: 1; width: 100%; }
  .brand-title em { font-size: 1em; line-height: 1.05; }

  .archive.print-journey:not([data-print-still="true"]) { height: calc(var(--mobile-print-frame) + var(--mobile-print-travel)); min-height: 0; }
  .archive.print-journey:not([data-print-still="true"]) .archive-stage,
  .archive.print-journey .archive-stage,
  .archive.print-journey[data-print-still="true"] .archive-stage { height: var(--mobile-print-frame); min-height: 0; }

  .work-gallery { padding-block: 32px 56px; }
  .work-heading { gap: 12px; }
  .work-heading h2 { font-size: 42px; }
  .work-heading p { font-size: 14px; padding: 0; }
  .work-filters { gap: 4px 16px; margin: 20px 0 24px; }
  .work-filters button { font-size: 12px; }
  .work-filters button span { font-size: 10px; margin-left: 4px; }
  .work-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 12px; }
  .work-item--landscape { grid-column: auto; }
  .work-item figcaption { margin-top: 8px; font-size: 10px; line-height: 1.5; }
  .work-item figcaption > span { display: block; }
  .work-item figcaption > span:last-child { text-align: left; margin-top: 2px; }

  :root[data-reduced-motion="true"] .opening,
  :root[data-reduced-motion="true"] .opening .opening-stage { height: 24px; }
  :root[data-reduced-motion="true"] .brand .brand-composition { height: 180px; min-height: 0; }
}

@media (max-width: 700px) and (prefers-reduced-motion: reduce) {
  .opening, .opening .opening-stage { height: 24px; }
  .brand .brand-composition { height: 180px; min-height: 0; }
}
