/* Native mobile strips share Swiftly's centered cards and equal neighbor peeks.
   Desktop uses the original DOM and layout, without a second media instance. */
.case-editorial .case-mobile-carousel { display: contents; }

@media (max-width: 767px) {
  .case-editorial .case-mobile-carousel[data-mobile-carousel-active] { display: block; min-width: 0; }
  .case-mobile-carousel[data-mobile-carousel-active] > :not(.case-mobile-carousel-track) { display: none; }
  .case-editorial .case-mobile-carousel-track {
    box-sizing: border-box;
    display: flex;
    align-items: flex-start;
    gap: 16px;
    width: calc(100% + 40px);
    max-width: none;
    margin-inline: -20px;
    padding: 0 32px;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-x pan-y pinch-zoom;
  }
  .case-mobile-carousel-track::-webkit-scrollbar { display: none; }
  .case-mobile-carousel-track:focus-visible { outline: 2px solid var(--heading); outline-offset: 4px; }
  .case-editorial .case-mobile-carousel-slide {
    flex: 0 0 100%;
    min-width: 0;
    aspect-ratio: 1;
    scroll-snap-align: center;
    scroll-snap-stop: always;
    border-radius: var(--nd-radius-preview-canvas);
    overflow: hidden;
  }
  .case-editorial .case-mobile-carousel-slide > [data-mobile-carousel-item] {
    position: relative;
    inset: auto;
    width: 100%;
    height: 100%;
    margin: 0;
    opacity: 1;
    pointer-events: auto;
    transition: none;
  }
  .case-editorial .case-mobile-carousel-slide :is(.case-editorial-figure, .case-editorial-board) {
    width: 100%;
    height: 100%;
    margin: 0;
    aspect-ratio: 1;
  }

  /* Mascot artwork fills three equal squares; tabs remain a desktop control. */
  .case-editorial .case-mascot .case-view-controls { display: none; }
  .case-editorial[data-case-slug="springbom-pilates"] .case-mobile-carousel--mascot
  :is(.case-editorial-board, .case-editorial-board-item, .case-editorial-screen, .cms-image-zoom, img) {
    width: 100%; height: 100%; max-width: none; max-height: none; padding: 0; border-radius: 0;
  }
  .case-mobile-carousel--mascot img { object-fit: contain; }

  /* Both pricing states become individual cards, using the same authored art. */
  .case-editorial .case-mobile-carousel-slide .case-pricing-slide { background: #f7931d; }
  .case-editorial .case-mobile-carousel-slide .case-pricing-production { background: #f5dec4; }
  .case-editorial .case-mobile-carousel-slide .case-editorial-board--pricing {
    display: flex; align-items: center; justify-content: center; padding: 8%;
  }
  .case-editorial .case-mobile-carousel-slide .case-editorial-board--pricing .case-editorial-board-item {
    width: auto; height: 100%; aspect-ratio: 3000 / 4800;
  }
  .case-editorial[data-case-slug="springbom-pilates"] .case-mobile-carousel-slide
  .case-pricing-production .case-editorial-screen {
    box-shadow: 0 3px 8px rgb(74 41 17 / 13%), 0 14px 26px rgb(74 41 17 / 18%);
  }
  .case-editorial .case-mobile-carousel-slide .case-pricing-production img { display: block; }

  /* Paired phones remain complete and small enough to share one square. */
  .case-editorial[data-case-slug="springbom-pilates"] .case-mobile-carousel-slide
  [data-section-key="pilates-instagram-stories"] .case-editorial-board {
    aspect-ratio: 1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 8%;
    gap: 6%;
  }

  /* The flyer export contains both sides. Contain preserves the complete print. */
  .case-editorial[data-case-slug="springbom-pilates"] .case-mobile-carousel-slide
  [data-section-key="pilates-flyer-mockup"] .case-editorial-board {
    display: flex; align-items: center; justify-content: center; padding: 7%; background: #e8e8e7;
  }
  .case-editorial .case-mobile-carousel-slide [data-section-key="pilates-flyer-mockup"] .case-editorial-board-item { width: 100%; }
  .case-editorial .case-mobile-carousel-slide [data-section-key="pilates-flyer-mockup"] img { display: block; width: 100%; height: auto; }
}