/* ============================================================
   SPORTS REPACK — MOBILE POLISH
   Microinteractions, smooth scrolling, perf tweaks.
   Last loaded so it can override anything above.
   ============================================================ */

@media (max-width: 768px) {

  /* Global smoothness */
  html {
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
  }

  /* iOS overscroll bg color */
  html { background: #050315; }

  /* Active-state tap feedback for any interactive element we didn't already handle */
  a, button {
    -webkit-tap-highlight-color: transparent;
  }
  a:active, button:active {
    transition: transform 80ms ease;
  }

  /* Selection color = brand */
  ::selection {
    background: rgba(255, 215, 0, 0.35);
    color: #fff;
  }

  /* Remove desktop-y hover noise on touch devices */
  @media (hover: none) {
    *:hover { transition: none !important; }
  }

  /* Smooth scroll-snap for any horizontally-scrolling carousels */
  [data-snap] {
    scroll-snap-type: x mandatory;
    overscroll-behavior-x: contain;
  }

  /* Fancy first-paint fade-in on mobile-injected blocks */
  .srm-home-root section[data-srm],
  .srms-root section[data-srm],
  .srmi-hero,
  .srmi-chips,
  .srmi-footer {
    animation: srm-fade-in 600ms cubic-bezier(.2,.7,.2,1) both;
  }
  .srm-home-root section[data-srm]:nth-child(1) { animation-delay: 0ms; }
  .srm-home-root section[data-srm]:nth-child(2) { animation-delay: 80ms; }
  .srm-home-root section[data-srm]:nth-child(3) { animation-delay: 160ms; }
  .srm-home-root section[data-srm]:nth-child(n+4) { animation-delay: 240ms; }
  @keyframes srm-fade-in {
    from { opacity: 0; transform: translateY(12px); }
    to   { opacity: 1; transform: none; }
  }
  @media (prefers-reduced-motion: reduce) {
    .srm-home-root section[data-srm],
    .srms-root section[data-srm],
    .srmi-hero, .srmi-chips, .srmi-footer { animation: none; }
  }

  /* Removed will-change: scroll-position — creates separate scroll contexts
     that confuse the outer body scroll on iOS Safari. */

  /* Prevent overflow shifts on launch — horizontal only */
  body, html { overflow-x: hidden; }

  /* Restraint: removed ambient CTA halo (was too neon). Depth via shadow only. */

  /* Slim down the popup on mobile (don't compete with hero) */
  .sr-proof.sold {
    bottom: calc(80px + env(safe-area-inset-bottom, 0px)) !important;
    max-width: calc(100vw - 24px);
  }

  /* Floating CTA never overlaps the slim mobile footer */
  html.srmi-active .sr-mobile-float-cta { display: none !important; }

  /* If the user has scrolled deep, dim the bottom nav slightly */
  .sr-mobile-bottom-nav {
    transition: background 240ms ease;
  }

  /* Make ANY headline using Bebas Neue feel sharper on mobile */
  body { font-feature-settings: "ss01" on, "ss02" on; }

  /* ────────────────────────────────────────────────────────
     PHASE 3 — Magnetic microinteractions
     ──────────────────────────────────────────────────────── */

  /* Removed forced GPU compositing (translateZ + backface-visibility) on buttons.
     These can create separate compositing layers that interfere with scroll on iOS Safari. */

  /* Tile press has a "stick" feel */
  .srm-ex-tile,
  .srm-mn-card,
  .srms-card {
    transition: transform 320ms cubic-bezier(.2,.7,.2,1),
                box-shadow 320ms ease,
                border-color 320ms ease;
  }
  .srm-ex-tile:active { transform: scale(0.92) translateZ(0); }

  /* Monster Hits cards lift slightly on press */
  .srm-mn-card:active {
    transform: scale(0.97) translateZ(0);
  }

  /* Live card has a subtle constant breath */
  .srm-live-card {
    animation: srm-live-breath 5s ease-in-out infinite;
  }
  @keyframes srm-live-breath {
    0%, 100% { box-shadow: 0 30px 70px rgba(255, 59, 107, 0.2), 0 0 0 1px rgba(255, 59, 107, 0.32); }
    50%      { box-shadow: 0 36px 80px rgba(255, 59, 107, 0.32), 0 0 0 1px rgba(255, 59, 107, 0.5); }
  }
  @media (prefers-reduced-motion: reduce) {
    .srm-live-card { animation: none; }
    .srm-cta-mega-glow { animation: none; }
    .srm-hero-card { animation: none !important; }
    .srm-mn-shine { animation: none; }
  }

  /* Snap behavior smoother */
  .srm-mn-stack { scroll-snap-stop: always; }

  /* When the bottom nav has been visible a while, dim slightly to recede */
  html:not(.sr-mobile-menu-open) .sr-mobile-bottom-nav {
    transition: background 360ms ease, border-color 360ms ease;
  }

  /* iOS rubber-band overflow color match.
     REMOVED overscroll-behavior — was potentially canceling scroll-start gestures */
  body {
    background-color: #050315;
  }

  /* Better video poster blending */
  video[poster] {
    background-color: #0a081a;
  }

  /* Tap-anywhere active state on entire mobile root for tactile feel */
  .srm-home-root a, .srm-home-root button {
    cursor: pointer;
  }
}