/* ==========================================================================
   CP7 — motion (Phase C). Site-only; linked from BaseLayout. NOT loaded on the
   funnel pages (sell-car.html, es/offer.html).

   Motion rules enforced here:
   - Content is VISIBLE by default and with JS off. The reveal is an enhancement
     applied by cp7-motion.js only when motion is allowed and a section starts
     STRICTLY below the fold; heroes/above-fold content are never hidden.
   - Only transform + opacity may animate. Every other transitionable property
     (colour, background, width/height, grid rows, padding, ...) is neutralised
     so geometry/colour changes happen immediately — no layout-shifting motion.
   - prefers-reduced-motion is respected comprehensively (all animations and
     transitions), and toggling the preference restores visible static content.
   ========================================================================== */

/* --- Only transform/opacity may animate (site-only) ----------------------- */
*,*::before,*::after{
  transition-property:transform,opacity !important;
}

/* --- Reveal-on-scroll (enhancement) --------------------------------------- */
html.cp7-reveal-ready [data-cp7-reveal]{opacity:0;transform:translate3d(0,18px,0)}
html.cp7-reveal-ready [data-cp7-reveal].cp7-reveal-in{
  opacity:1;transform:none;
  transition:opacity .6s ease-out,transform .6s cubic-bezier(.25,.8,.25,1);
}

/* --- Reduced motion: comprehensively static ------------------------------- */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
    transition-delay:0s !important;
    scroll-behavior:auto !important;
  }
  /* Stop infinite loops outright so nothing snaps to an end frame. */
  .ticker-move,.sp-live-dot,.sp-skeleton-ico,.sp-skeleton,.qw-modal{animation:none !important}
  /* CSS-only SMIL fallback: with JS disabled the pauseAnimations() hook cannot
     run, so hide the moving car groups and keep the static road scene. */
  .road-scene g:has(> animateMotion){display:none !important}
  html.cp7-reveal-ready [data-cp7-reveal]{opacity:1 !important;transform:none !important}
  [data-cp7-reveal]{transition:none !important}
}

/* --- Dropdown hover underline: transform instead of width ----------------- */
.dropdown-menu a{transition:transform .2s ease}
.dropdown-menu a::before{width:100%;transform:scaleX(0);transform-origin:left center;transition:transform .3s ease}
.dropdown-menu a:hover::before{transform:scaleX(1)}
