/* The mobile photograph is a short, uncropped stage; the copy follows it. */
@media (max-width: 800px) {
  :is(.fxp-page,.fx-home,.shopfx-landing) { --editorial-header-height: 64px; }
  :is(.fxp-page,.fx-home,.shopfx-landing) :is(.fxp-hero,.fx-home-hero,.sfx-hero)[data-editorial-banner],
  .fx-home .fx-home-final[data-editorial-banner] {
    --mobile-photo-height: clamp(160px, 50vw, 280px);
    display: flex; flex-direction: column; align-items: stretch; gap: 0;
    width: 100%; min-height: 0; margin: 0; padding: 0 0 24px; border-radius: 0;
  }
  :is(.fxp-page,.fx-home,.shopfx-landing) [data-editorial-banner] > figure {
    position: relative; inset: auto; flex: none; z-index: 0;
    height: var(--mobile-photo-height); width: 100%; margin: 0;
  }
  :is(.fxp-page,.fx-home,.shopfx-landing) [data-editorial-banner] > figure > img,
  :is(.fxp-page,.fx-home,.shopfx-landing) [data-editorial-banner] > figure[data-editorial-slides] > img.editorial-slide {
    inset: 0; width: 100%; height: 100%; margin: 0; object-fit: contain; object-position: center; transform: none;
  }
  :is(.fxp-page,.fx-home,.shopfx-landing) [data-editorial-banner] > figure::before { inset: 0; height: 100%; }
  :is(.fxp-page,.fx-home,.shopfx-landing) [data-editorial-banner]::after { display: none; }
  :is(.fxp-page,.fx-home,.shopfx-landing) [data-editorial-banner] > div:first-of-type {
    order: 2; width: 100%; max-width: none; padding: 20px 20px 0; box-sizing: border-box;
  }
  :is(.fxp-page,.fx-home,.shopfx-landing) [data-editorial-banner] h1 { font-size: clamp(1.45rem, 5.6vw, 1.9rem); max-width: 32ch; line-height: 1.2; margin-block: 12px; }
  :is(.fxp-page,.fx-home,.shopfx-landing) [data-editorial-banner] p { font-size: .88rem; line-height: 1.65; margin-block: 12px; }
  :is(.fxp-page,.fx-home,.shopfx-landing) [data-editorial-banner] :is(.fxp-kicker,.fx-home-kicker) { font-size: .68rem; }
  :is(.fxp-page,.fx-home,.shopfx-landing) [data-editorial-banner] .editorial-slide-controls {
    position: relative; order: 1; top: auto; bottom: auto; left: auto; right: auto;
    align-self: center; width: max-content; margin: 10px auto 0; transform: none; padding: 3px;
  }
  :is(.fxp-page,.fx-home,.shopfx-landing) [data-editorial-banner] .editorial-slide-controls button { width: 30px; height: 36px; }
  :is(.fxp-page,.fx-home,.shopfx-landing) [data-editorial-banner] .editorial-motion-toggle {
    top: 10px; bottom: auto; right: 10px; min-height: 36px; padding: 6px 10px; font-size: .7rem;
  }
  .fx-home .fx-home-final[data-editorial-banner] { margin-block: 32px; }
}