/* JEJU GLOW — mobile corrections.
   Loaded after each page's own styles, so these rules win on small screens.
   Rule: on phones, show the whole photo instead of cropping it to a fixed box. */

/* Home: Journal cards — photo keeps its own proportions (SVG sizes itself from its viewBox) */
@media (max-width: 989px) {
  .jg-journal-card-photo { aspect-ratio: auto; }
  .jg-journal-card-photo svg { height: auto; }
}

/* Our Story: journal cards — no more 5:4 landscape crop on portrait photos */
@media (max-width: 600px) {
  .story-card-image { aspect-ratio: auto; }
  .story-card-image img { height: auto; }
}

/* Journal articles: intro photo fills the column edge to edge, no side bands */
@media (max-width: 600px) {
  .journal-hero figure { background: transparent; }
  .journal-hero img { width: 100%; height: auto; max-height: none; object-fit: contain; }
}

/* Home: hero film plays on phones as well (the design hid it below 750px) */
@media (max-width: 749px) and (prefers-reduced-motion: no-preference) {
  .jg-launch-film .jg-film-video { display: block; }
}

/* Home: sign-up popup on phones — photo on the left, headline beside it,
   form / perks / terms full width underneath. Roughly half the height of the stacked version. */
@media (max-width: 749px) {
  .jg-welcome { width: calc(100vw - 28px); max-width: 400px; }
  .jg-welcome-layout { display: grid; grid-template-columns: 44% minmax(0, 1fr); column-gap: 14px; row-gap: 0;
                       align-items: start; min-height: 0; padding: 16px 16px 18px; }
  .jg-welcome-photo { grid-column: 1; grid-row: 1 / span 3; align-self: stretch; height: auto; min-height: 210px; }
  .jg-welcome-photo img { object-fit: cover; object-position: 60% 30%; }
  .jg-welcome-photo > p { display: none; }
  .jg-welcome-copy { display: contents; }
  .jg-welcome-copy .jg-eyebrow { grid-column: 2; grid-row: 1; margin: 0 40px 6px 0; font-size: 9px; }
  .jg-welcome h2 { grid-column: 2; grid-row: 2; font-size: 36px; line-height: 1.02; margin: 0 0 10px; white-space: nowrap; }
  .jg-welcome-intro { grid-column: 2; grid-row: 3; font-size: 13px; line-height: 1.5; margin: 0; }
  .jg-welcome-form { grid-column: 1 / -1; margin-top: 16px; }
  .jg-welcome-form label { font-size: 12px; margin-bottom: 2px; }
  .jg-welcome-form input { min-height: 40px; padding: 6px 0; }
  .jg-welcome-form .jg-button { margin-top: 10px; min-height: 44px; }
  .jg-welcome-status { font-size: 13px; margin-top: 8px; }
  .jg-welcome-perks { grid-column: 1 / -1; margin: 10px 0 8px; }
  .jg-welcome-perks li { padding: 0 4px; }
  .jg-welcome-perks strong, .jg-welcome-perks span { font-size: 9.5px; line-height: 1.35; }
  .jg-welcome-perks strong { margin-bottom: 2px; }
  .jg-welcome-terms { grid-column: 1 / -1; font-size: 9px; line-height: 1.45; padding-top: 10px; }
  .jg-welcome-close { top: 6px; right: 6px; width: 34px; height: 34px; min-height: 34px; font-size: 22px; padding: 4px !important; }
}

/* Journal (October editorial sheet): phone hero photo keeps its own proportions */
@media (max-width: 600px) {
  .journal-hero img { aspect-ratio: auto; max-height: none; }
}
