/* ============================================================
   CarVerdict — Mobile App Home Motion
   Additive entrance/interaction polish for .cvx-apphome (the
   mobile-only landing screen). Pure CSS, load-in cascade —
   no scroll-reveal needed since this screen IS the viewport.
   ============================================================ */
@media (max-width: 900px) {

  /* ---------- Banner: subtle Ken-Burns zoom + fade-in ---------- */
  .cvx-ah-banner img {
    animation: ahBannerZoom 14s ease-out forwards, ahFadeIn .7s ease-out both;
  }
  .cvx-ah-banner .cap > * {
    opacity: 0;
    animation: ahUp .6s cubic-bezier(.16,1,.3,1) forwards;
  }
  .cvx-ah-banner .cap h2 { animation-delay: .15s; }
  .cvx-ah-banner .cap p  { animation-delay: .28s; }

  /* ---------- Featured cards: cascade in, tap shimmer ---------- */
  .cvx-feature {
    opacity: 0;
    animation: ahUp .55s cubic-bezier(.16,1,.3,1) forwards;
    position: relative;
    overflow: hidden;
  }
  .cvx-feature:nth-of-type(1) { animation-delay: .38s; }
  .cvx-feature:nth-of-type(2) { animation-delay: .46s; }
  .cvx-feature::after {
    content: '';
    position: absolute; inset: 0;
    background: linear-gradient(120deg, transparent 30%, rgba(255,255,255,.06) 50%, transparent 70%);
    transform: translateX(-100%);
    pointer-events: none;
  }
  .cvx-feature:active::after {
    transform: translateX(100%);
    transition: transform .5s ease-out;
  }

  /* ---------- "All tools" label ---------- */
  .cvx-ah-sec {
    opacity: 0;
    animation: ahFadeIn .5s ease-out .52s forwards;
  }

  /* ---------- Tile grid: capped stagger cascade ---------- */
  .cvx-tile {
    opacity: 0;
    animation: ahUp .5s cubic-bezier(.16,1,.3,1) forwards;
  }
  .cvx-tile:nth-child(1)  { animation-delay: .56s; }
  .cvx-tile:nth-child(2)  { animation-delay: .60s; }
  .cvx-tile:nth-child(3)  { animation-delay: .64s; }
  .cvx-tile:nth-child(4)  { animation-delay: .68s; }
  .cvx-tile:nth-child(5)  { animation-delay: .72s; }
  .cvx-tile:nth-child(6)  { animation-delay: .76s; }
  .cvx-tile:nth-child(n+7) { animation-delay: .80s; }

  /* ---------- Trial banner + Pro CTA ---------- */
  .cvx-trial-banner,
  .cvx-pro-mob {
    opacity: 0;
    animation: ahUp .55s cubic-bezier(.16,1,.3,1) .88s forwards;
  }
  .cvx-pro-mob:active { transform: scale(.98); transition: transform .15s; }

  /* ---------- "Why CarVerdict" mini teaser ---------- */
  .cvx-mob-teaser-card {
    opacity: 0;
    animation: ahFadeIn .6s ease-out .3s forwards;
  }
}

@keyframes ahUp {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes ahFadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes ahBannerZoom {
  from { transform: scale(1); }
  to   { transform: scale(1.08); }
}

@media (prefers-reduced-motion: reduce) {
  .cvx-ah-banner img, .cvx-ah-banner .cap > *, .cvx-feature, .cvx-ah-sec,
  .cvx-tile, .cvx-pro-mob, .cvx-mob-teaser-card {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}