/* Phone refinements. Keep the approved desktop compositions intact. */
@media (max-width: 760px) {
  /* Keep the motion switch within reach without covering photos or controls. */
  .site-motion-control {
    z-index: 101;
    top: 14px;
    right: calc(var(--gutter) + 82px);
    bottom: auto;
    width: 44px;
    height: 44px;
    padding: 0;
    justify-content: center;
  }
  .site-motion-control [data-motion-label] {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
  }
  .menu-toggle, .visitor-page .menu-toggle { font-size: .65rem; }
  body .site-footer { padding-bottom: 3rem; }
  .site-footer p, .site-footer .footer-details { font-size: .8rem; line-height: 1.8; }
  .site-footer .footer-details a { display: inline-flex; align-items: center; min-height: 44px; }
  .atlas-destinations small { font-size: .65rem; }

  /* Read the story comfortably without enlarging the entire page. */
  .has-js .story-opening-copy > p:last-child { font-size: .875rem; line-height: 1.6; }
  .has-js .story-opening-kicker { max-width: calc(100% - 52px); }
  .has-js .story-opening-media { top: 24rem; }
  .story-slider-years { font-size: .625rem; }
  .story-page .year-nav a { min-height: 44px; font-size: .8rem; }
  .story-page .journey-photo figcaption { font-size: .75rem; }
  .story-page .journey-copy > p:not(.journey-place) { font-size: 1rem; }

  /* Full photo credits stay readable; arrows have their own top row. */
  .experience-lightbox-nav { top: 16px; bottom: auto; width: 48px; height: 48px; }
  .experience-lightbox-previous { left: 12px; }
  .experience-lightbox-next { left: 68px; right: auto; }
  .experience-lightbox-meta { padding: 1rem 1rem max(1rem, env(safe-area-inset-bottom)); gap: .75rem; }
  .experience-lightbox-caption { display: block; overflow: visible; -webkit-line-clamp: unset; font-size: .875rem; }

  .community-index-copy em { font-size: .9375rem; line-height: 1.7; }
  .community-index-copy small { font-size: .66rem; }
  .community-page .community-panel-project-media figcaption span { font-size: .625rem; line-height: 1.5; letter-spacing: .07em; }
  .community-page .community-panel-project-media figcaption strong { font-size: .8125rem; line-height: 1.4; }
  .community-page .community-project-frame { bottom: 5.5rem; }
  .community-stage-rail { font-size: .55rem; }

  .explorer-intro p { font-size: .9375rem; line-height: 1.8; }
  .explorer-controls { flex-wrap: wrap; }
  .explorer-controls p { font-size: .8125rem; max-width: none; flex: 1 1 220px; }
  .explorer-expand { font-size: .75rem; }
  .explorer-launch > small { font-size: .6875rem; letter-spacing: 0; }
  .explorer-bridge p { font-size: .875rem; }
  .explorer-bridge strong { font-size: .875rem; }
  .explorer-film { display: inline-flex; align-items: center; min-height: 44px; }
  .explorer-stage iframe:focus-visible { outline: 2px solid #e7c98e; outline-offset: -3px; }

  /* The calendar retains its design, with legible labels and instructions. */
  .visit-page .visit-calendar-main { width: 100%; }
  .visit-page .show-calendar .calendar-status { font-size: .625rem; white-space: nowrap; }
  .visit-page .night-keepsake-note { font-size: .6875rem; line-height: 1.5; }
  .community-star-story { scroll-margin-top: 6rem; }
  .community-star-story a { min-height: 44px; align-items: center; padding-block: .4rem; }

  /* Readable forms prevent focus zoom and give long place names room. */
  .visitor-page .hometown-card input:not([type=checkbox]):not([type=radio]),
  .visitor-page .hometown-card select,
  .visitor-page .visitors-filter input { font-size: 16px; min-height: 48px; }
  .hometown-fields { grid-template-columns: 1fr; }
  .hometown-card { padding: 24px; }
  .hometown-intro, .hometown-success p, .visitors-introduction p { font-size: .9375rem; }
  .hometown-card label, .hometown-results legend, .visitors-filter { font-size: .8125rem; }
  .hometown-find, .hometown-submit { font-size: .875rem !important; }
  .hometown-privacy, .hometown-status, .visitors-method { font-size: .8125rem; line-height: 1.75; }
  .hometown-confirm { min-height: 44px; padding-block: 8px; }
  .hometown-confirm input { width: 22px; height: 22px; }
  .hometown-results label { min-height: 48px; align-items: center; }
  .hometown-results strong { font-size: .9375rem; }
  .hometown-results small { font-size: .75rem; }
  .hometown-results input { width: 20px; height: 20px; flex-shrink: 0; }
  .visitors-totals span { font-size: .6875rem; }
  .visitors-map-caption p, .visitors-introduction a { font-size: .8125rem; }
  .visitors-city small, .visitors-city > b { font-size: .75rem; }
  .visitor-page .vg-control { font-size: .6875rem; padding-inline: 6px; }
  .visitor-page .vg-title strong { font-size: .9375rem; }
  .visitor-page .vg-kicker { font-size: .625rem; }
  .visitor-page .visitor-globe { min-height: 520px; }
  .visitor-globe canvas { touch-action: pan-y pinch-zoom; }
  .visitor-globe .vg-pin { width: 44px; height: 44px; background: transparent; box-shadow: none; }
  .visitor-globe .vg-pin::before {
    content: ""; position: absolute; inset: 14px; border-radius: 50%;
    background: currentColor; box-shadow: 0 0 0 4px #3dd8ff21, 0 0 20px #3dd8ff88;
  }
  .visitor-globe .vg-pin::after { inset: 19px; }
  .visitor-globe .vg-pin[aria-pressed="true"] { box-shadow: none; }
  .visitor-globe .vg-pin-count { left: calc(50% + 12px); }
}

@media (max-width: 360px) {
  .explorer-heading h2 { font-size: 2.45rem; }
  .has-js .story-page .story-opening h1 { font-size: 2.2rem; }
  .has-js .story-opening-media { top: 26rem; }
  .visit-page .show-calendar .calendar-status { font-size: .5625rem; }
  .visitors-title-row h1 { font-size: 3rem; }
  .visitors-title-row h1 span { white-space: nowrap; }
  .hometown-card { padding: 20px; }
}

/* Pinned narratives must release when the phone is turned sideways. */
@media (max-height: 600px) and (orientation: landscape) {
  .story-page .chapter-scene,
  .noel-page .noel-meaning-title,
  .visit-page .night-keepsake { position: relative; top: auto; }
  .community-enhanced .community-stage { position: relative; top: auto; height: min(28rem, calc(100svh - 5.4rem)); min-height: 0; max-height: none; }
  .community-page .community-project-frame { top: .6rem; bottom: 4.5rem; }
  .community-page .community-panel-project-media figcaption { bottom: .6rem; }
  .story-page .year-nav { position: relative; top: auto; }
}

@media (min-width: 761px) and (max-width: 1000px) and (max-height: 600px) {
  .site-motion-control { z-index: 101; top: 14px; right: calc(1.5rem + 82px); bottom: auto; width: 44px; height: 44px; padding: 0; justify-content: center; }
  .site-motion-control [data-motion-label] { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
}

@media (pointer: coarse) {
  .visitor-globe canvas { touch-action: pan-y pinch-zoom; }
}