/* Mobile-first refinements — loaded after the editorial desktop styles. */
@media (max-width: 620px) {
  body { overflow-x: hidden; }

  .site-header {
    position: sticky;
    top: 0;
    z-index: 20;
    height: 62px;
    padding: 0 18px;
    background: rgba(239, 238, 233, .94);
    backdrop-filter: blur(12px);
  }

  .brand { gap: 9px; min-width: 0; }
  .brand-avatar { width: 34px; height: 34px; flex: 0 0 34px; }
  .brand-copy strong { font-size: 11px; white-space: nowrap; }
  .tool-link { border: 1px solid var(--line); padding: 8px 9px; white-space: nowrap; }

  .hero { padding-top: 34px; gap: 33px; }
  .hero h1 { font-size: clamp(54px, 16vw, 64px); line-height: .88; }
  .hero-intro { margin-top: 24px; font-size: 12px; line-height: 1.7; }
  .hero-actions { align-items: stretch; gap: 17px; }
  .button { justify-content: space-between; padding: 13px 14px; }
  .text-link { display: flex; align-items: center; }
  .hero-note { display: none; }
  .hero-art { height: 112vw; max-height: 470px; }
  .hero-photo-main { width: 74%; }
  .hero-photo-top { width: 34%; right: -1px; }
  .hero-photo-bottom { width: 43%; right: -1px; bottom: 5%; }
  .hero-index { left: auto; right: 0; text-align: right; }

  .intro-band { align-items: start; gap: 18px; margin-top: 12px; }
  .intro-band p { max-width: 195px; }
  .intro-band > span { max-width: 126px; }

  #photography.work-section { padding-top: 14px; }
  #photography .section-heading, #photography .category-note { display: none; }
  #photography .filter-row { display: flex; flex-wrap: nowrap; justify-content: space-between; gap: 0; margin: 0 0 11px; border: 0; }
  #photography .filter-button { min-height: 32px; padding: 7px 0; border: 0; color: var(--ink-soft); font-size: 9px; text-align: left; }
  #photography .filter-button[aria-pressed=true] { color: var(--ink); }
  #photography .filter-count { display: none; }
  .photo-grid { columns: 2; column-gap: 7px; }
  .photo-card { margin-bottom: 7px; }

  .film-section { padding: 74px 0; }
  .video-group-head { margin-bottom: 16px; }
  .video-grid { gap: 28px; }
  .video-meta { padding-top: 11px; }
  .video-meta h4 { font-size: 14px; }
  .video-meta p { font-size: 10px; }

  .about-section { padding-top: 62px; }
  .site-footer { gap: 12px; line-height: 1.6; }
}
