/* FluxFront — section transitions (3D + cinematic tour) · verbatim from sections.css blocks 1310-1373. */
/* ===================== PREMIUM 3D SECTION TRANSITIONS ===================== */
/* Scroll-linked entrance: each panel rises and rotates flat in 3D as it enters.
   Progressive enhancement — only runs where scroll-driven timelines exist and
   the visitor hasn't asked for reduced motion. */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .sx-on .sx {
      animation: sxRise linear both;
      animation-timeline: view();
      animation-range: entry 2% entry 44%;
      transform-origin: 50% 100%;
      backface-visibility: hidden;
      will-change: transform, opacity;
    }
    /* transform-only — the .reveal IntersectionObserver owns opacity, so content
       is never invisible (even on a direct anchor jump). Keeps the motion smooth. */
    @keyframes sxRise {
      from { transform: translateY(34px) scale(0.992); }
      to   { transform: translateY(0)    scale(1); }
    }
    /* lighter touch for the tour intro so it doesn't fight the first feature block */
    .sx-on .sx-soft {
      animation-range: entry 4% entry 38%;
      transform-origin: 50% 50%;
    }
  }
}

/* ===================== CINEMATIC TOUR TRANSITIONS (steps 1–11) ===================== */
/* Each feature block travels in from depth and alternates left / right, like moving
   through a space; the inner demo parallaxes for added depth. Scroll-linked, progressive. */
/* contain the directional travel so off-screen entrances never create a scrollbar */
#platform { overflow: clip; }
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .sx-on .feat-block.sx {
      animation-name: sxTravelLeft;
      animation-range: entry 0% entry 52%;
      transform-origin: 50% 50%;
    }
    .sx-on .feat-block.sx.rev { animation-name: sxTravelRight; }
    /* Gentle rise + fade (was a dramatic side-travel in 3D). Subtle enough that
       the scroll feels smooth and seamless, and anchor jumps land cleanly. */
    @keyframes sxTravelLeft {
      0%   { transform: translateY(40px) scale(0.992); }
      100% { transform: translateY(0)    scale(1); }
    }
    @keyframes sxTravelRight {
      0%   { transform: translateY(40px) scale(0.992); }
      100% { transform: translateY(0)    scale(1); }
    }
    /* inner demo parallax — a soft drift for a hint of depth, much reduced */
    .sx-on .feat-block .feat-demo {
      animation: sxDemoParallax linear both;
      animation-timeline: view();
      animation-range: entry 0% entry 78%;
      will-change: transform;
    }
    @keyframes sxDemoParallax {
      from { transform: translateY(22px); }
      to   { transform: translateY(-8px); }
    }
    /* the tour intro keeps the gentle rise */
    .sx-on .sx-soft { animation-name: sxRise; }
  }
}

/* APPEND-MARKER */