/* ── Mobile scroll & entrance animations (≤980px) ───────────── */

@media (max-width: 980px) {
  /* Hero — staggered entrance after page loader */
  body:not(.is-page-loading) .hero .hero__tagline,
  body:not(.is-page-loading) .hero .hero__title,
  body:not(.is-page-loading) .hero .hero__subtitle,
  body:not(.is-page-loading) .hero .hero__actions,
  body:not(.is-page-loading) .hero .platform-card {
    opacity: 0;
    animation: mobileEnterUp 0.72s cubic-bezier(0.22, 1, 0.36, 1) forwards;
    animation-delay: var(--enter-delay, 0s);
  }

  body:not(.is-page-loading) .hero .hero__tagline { --enter-delay: 0.05s; }
  body:not(.is-page-loading) .hero .hero__title { --enter-delay: 0.12s; }
  body:not(.is-page-loading) .hero .hero__subtitle { --enter-delay: 0.2s; }
  body:not(.is-page-loading) .hero .hero__actions { --enter-delay: 0.28s; }

  body:not(.is-page-loading) .hero .platform-card:nth-child(1) { --enter-delay: 0.38s; animation-name: mobileEnterPop; }
  body:not(.is-page-loading) .hero .platform-card:nth-child(2) { --enter-delay: 0.46s; animation-name: mobileEnterPop; }
  body:not(.is-page-loading) .hero .platform-card:nth-child(3) { --enter-delay: 0.54s; animation-name: mobileEnterPop; }
  body:not(.is-page-loading) .hero .platform-card:nth-child(4) { --enter-delay: 0.62s; animation-name: mobileEnterPop; }

  body:not(.is-page-loading) .hero .platform-card .platform-card__icon {
    animation: mobileIconPop 0.5s cubic-bezier(0.22, 1, 0.36, 1) calc(var(--enter-delay, 0s) + 0.15s) both;
  }

  @keyframes mobileEnterUp {
    from {
      opacity: 0;
      transform: translateY(22px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }

  @keyframes mobileEnterPop {
    from {
      opacity: 0;
      transform: translateY(16px) scale(0.9);
    }
    60% {
      transform: translateY(-3px) scale(1.02);
    }
    to {
      opacity: 1;
      transform: translateY(0) scale(1);
    }
  }

  /* Bidirectional scroll-reveal variants (scroll up or down) */
  [data-reveal-variant] {
    transition:
      opacity 0.45s cubic-bezier(0.22, 1, 0.36, 1),
      transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
    will-change: opacity, transform;
  }

  [data-reveal-variant]:not(.is-scroll-revealed) {
    opacity: 0;
    pointer-events: none;
  }

  [data-reveal-variant="zoom-in"]:not(.is-scroll-revealed) {
    transform: scale(0.82);
  }

  [data-reveal-variant="zoom-out"]:not(.is-scroll-revealed) {
    transform: scale(1.1);
  }

  [data-reveal-variant="slide-left"]:not(.is-scroll-revealed) {
    transform: translateX(-24px) scale(0.94);
  }

  [data-reveal-variant="slide-right"]:not(.is-scroll-revealed) {
    transform: translateX(24px) scale(0.94);
  }

  [data-reveal-variant="slide-up"]:not(.is-scroll-revealed) {
    transform: translateY(22px) scale(0.94);
  }

  .is-scroll-revealed {
    opacity: 1;
    transform: translate(0) scale(1);
    pointer-events: auto;
  }

  /* Shared scroll-reveal card pattern */
  [data-mobile-reveal] {
    opacity: 0;
    transform: translateY(24px) scale(0.96);
    transition:
      opacity 0.65s cubic-bezier(0.22, 1, 0.36, 1),
      transform 0.7s cubic-bezier(0.22, 1, 0.36, 1),
      box-shadow 0.4s ease,
      border-color 0.4s ease;
    transition-delay: var(--reveal-delay, 0s);
    will-change: opacity, transform;
  }

  [data-mobile-reveal].is-mobile-revealed {
    opacity: 1;
    transform: translateY(0) scale(1);
  }

  [data-mobile-reveal="left"] {
    transform: translateX(-28px) translateY(12px) scale(0.96);
  }

  [data-mobile-reveal="right"] {
    transform: translateX(28px) translateY(12px) scale(0.96);
  }

  [data-mobile-reveal="left"].is-mobile-revealed,
  [data-mobile-reveal="right"].is-mobile-revealed {
    transform: translateX(0) translateY(0) scale(1);
  }

  /* Icon pop on reveal */
  [data-mobile-reveal].is-mobile-revealed .value-strip__icon,
  [data-mobile-reveal].is-mobile-revealed .about__hub-card-icon,
  [data-mobile-reveal].is-mobile-revealed .dev-process__icon {
    animation: mobileIconPop 0.55s cubic-bezier(0.22, 1, 0.36, 1) calc(var(--reveal-delay, 0s) + 0.12s);
  }

  @keyframes mobileIconPop {
    0% { transform: scale(0.82); }
    65% { transform: scale(1.08); }
    100% { transform: scale(1); }
  }

  /* Footer blocks */
  .site-footer__cta-inner[data-mobile-reveal],
  .site-footer__brand[data-mobile-reveal],
  .site-footer__col[data-mobile-reveal],
  .site-footer__col--contact[data-mobile-reveal] {
    transform: translateY(28px) scale(0.97);
  }
}

@media (max-width: 980px) and (prefers-reduced-motion: reduce) {
  body:not(.is-page-loading) .hero .hero__tagline,
  body:not(.is-page-loading) .hero .hero__title,
  body:not(.is-page-loading) .hero .hero__subtitle,
  body:not(.is-page-loading) .hero .hero__actions,
  body:not(.is-page-loading) .hero .platform-card {
    opacity: 1;
    animation: none;
    transform: none;
  }

  [data-mobile-reveal] {
    opacity: 1;
    transform: none;
    transition: none;
  }

  [data-mobile-reveal].is-mobile-revealed {
    animation: none;
  }

  [data-reveal-variant]:not(.is-scroll-revealed) {
    opacity: 1;
    transform: none;
    transition: none;
  }
}