/* ============================================================
   WOW LAYER v2 (Tier 2) — CSS: Lenis base · scroll-driven
   JarvisNextGen.in · vanilla, versioned · pairs with wow.v2.js
   ============================================================ */

/* ---------- LENIS BASE (smooth scroll) ---------- */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
.lenis.lenis-stopped { overflow: hidden; }

/* ---------- SCROLL-DRIVEN ANIMATIONS (native, Chrome/Edge/Safari 26+) ---------- */
@supports (animation-timeline: view()) {

  /* Section titles: underline draw-in as they enter */
  .section-title {
    position: relative;
    animation: wow2TitleRise linear both;
    animation-timeline: view();
    animation-range: entry 0% entry 55%;
  }
  @keyframes wow2TitleRise {
    from { opacity: 0.25; transform: translateY(18px); }
    to   { opacity: 1;   transform: translateY(0); }
  }

  /* Eyebrow: quick fade-slide */
  .eyebrow {
    animation: wow2Eye linear both;
    animation-timeline: view();
    animation-range: entry 0% entry 40%;
  }
  @keyframes wow2Eye {
    from { opacity: 0; transform: translateX(-12px); }
    to   { opacity: 1; transform: translateX(0); }
  }

  /* Cards: gentle parallax rise (price/use/step/card/work) */
  .price-card, .use-card, .step, .faq-item, .work-card {
    animation: wow2Card linear both;
    animation-timeline: view();
    animation-range: entry 0% entry 45%;
  }
  @keyframes wow2Card {
    from { opacity: 0.35; transform: translateY(26px); }
    to   { opacity: 1;    transform: translateY(0); }
  }

  /* Hero phone: subtle parallax drift on scroll (moves slower) */
  .hero-demo {
    animation: wow2HeroDrift linear both;
    animation-timeline: view();
    animation-range: exit 0% exit 60%;
  }
  @keyframes wow2HeroDrift {
    to { transform: translateY(-46px); }
  }

  /* Work iframe: draw-up + glow intensify */
  .work-visual {
    animation: wow2WorkVis linear both;
    animation-timeline: view();
    animation-range: entry 0% entry 50%;
  }
  @keyframes wow2WorkVis {
    from { opacity: 0.4; transform: scale(0.965); }
    to   { opacity: 1;   transform: scale(1); }
  }

  /* Hero grid pattern: slow parallax drift (safe element, no time-animation) */
  .hero-grid-pattern {
    animation: wow2GridDrift linear both;
    animation-timeline: view();
    animation-range: exit 0% exit 70%;
  }
  @keyframes wow2GridDrift {
    to { transform: translateY(90px); }
  }

  /* Trust bar: subtle fade-up */
  .trust-inner {
    animation: wow2Trust linear both;
    animation-timeline: view();
    animation-range: entry 0% entry 60%;
  }
  @keyframes wow2Trust {
    from { opacity: 0.4; transform: translateY(10px); }
    to   { opacity: 1;   transform: translateY(0); }
  }
}

/* ---------- TILT ZONE EXTENSION (work visual) ---------- */
.work-visual { transform-style: preserve-3d; will-change: transform; }

/* ---------- MAGNETIC POLISH (buttons already JS-driven; smooth release) ---------- */
.btn { transition: transform .25s cubic-bezier(.22, 1, .36, 1), box-shadow .25s ease, background-color .25s ease, color .25s ease, border-color .25s ease; }

/* ---------- REDUCED MOTION: kill scroll-driven + smooth ---------- */
@media (prefers-reduced-motion: reduce) {
  html.lenis, html.lenis body { height: auto; }
  .section-title, .eyebrow, .price-card, .use-card, .step, .faq-item,
  .work-card, .hero-demo, .work-visual, .hero-grid-pattern, .trust-inner {
    animation: none !important;
  }
}

/* ---------- MOBILE: lighter scroll-driven (no heavy parallax) ---------- */
@media (max-width: 720px) {
  .hero-demo, .hero-grid-pattern { animation: none !important; }
  .price-card, .use-card, .step, .faq-item, .work-card {
    animation: none !important;
  }
  .section-title, .eyebrow, .trust-inner { animation: none !important; }
  .work-visual { animation: none !important; }
}