/* Shared motion layer for all designs. Every effect is off when the visitor asks for reduced motion. */
@media (prefers-reduced-motion: no-preference) {
  /* Scroll progress bar */
  .mx-progress { position: fixed; left: 0; top: 0; height: 3px; width: 100%; z-index: 2147482000; transform-origin: 0 50%; transform: scaleX(0); background: linear-gradient(90deg, #FF6A2B, #FFB65C, #6EF0B8, #8FD3FF); pointer-events: none; }

  /* Soft light blobs drifting behind the page */
  .mx-aura { position: fixed; inset: -20vmax; z-index: -1; pointer-events: none; overflow: hidden; }
  .mx-aura i { position: absolute; width: 46vmax; height: 46vmax; border-radius: 50%; filter: blur(70px); opacity: var(--mx-aura-o, 0.45); animation: mxDrift 28s ease-in-out infinite alternate; }
  .mx-aura i:nth-child(1) { left: 8%; top: 4%; background: var(--mx-a1, #FFD9C2); }
  .mx-aura i:nth-child(2) { right: 4%; top: 30%; background: var(--mx-a2, #CFE6FF); animation-duration: 34s; animation-delay: -9s; }
  .mx-aura i:nth-child(3) { left: 30%; bottom: 0; background: var(--mx-a3, #D6F5E4); animation-duration: 40s; animation-delay: -17s; }
  @keyframes mxDrift { 0% { translate: 0 0; scale: 1; } 50% { translate: 6vmax -4vmax; scale: 1.12; } 100% { translate: -5vmax 5vmax; scale: 0.94; } }

  /* Cards and blocks rise in from the side they sit on */
  [data-mx="pre"] { opacity: 0; translate: var(--mx-x, 0) var(--mx-y, 40px); scale: var(--mx-s, 0.96); filter: blur(6px); }
  [data-mx="show"] { opacity: 1; translate: 0 0; scale: 1; filter: none; transition: opacity 0.9s cubic-bezier(.2,.8,.2,1), translate 1s cubic-bezier(.2,.8,.2,1), scale 1s cubic-bezier(.2,.8,.2,1), filter 0.9s ease; transition-delay: var(--mx-d, 0s); }

  /* Headings: each word rises out of a mask */
  .mx-w { display: inline-block; overflow: hidden; vertical-align: bottom; padding-bottom: 0.08em; margin-bottom: -0.08em; }
  .mx-w > span { display: inline-block; translate: 0 105%; rotate: 4deg; opacity: 0; transition: translate 0.9s cubic-bezier(.2,.8,.2,1), rotate 0.9s cubic-bezier(.2,.8,.2,1), opacity 0.6s ease; transition-delay: calc(var(--i) * 55ms); }
  [data-mx-h="show"] .mx-w > span { translate: 0 0; rotate: 0deg; opacity: 1; }

  /* Photos: slow zoom while scrolling */
  [data-mx-zoom] { scale: var(--mx-z, 1.08); transition: scale 0.2s linear; will-change: scale; }

  /* Line icons draw themselves */
  [data-mx-draw] { stroke-dasharray: var(--mx-len); stroke-dashoffset: var(--mx-len); }
  [data-mx-draw="show"] { stroke-dashoffset: 0; transition: stroke-dashoffset 1.6s cubic-bezier(.4,.1,.2,1); transition-delay: var(--mx-d, 0s); }

  /* Cards lift a little and follow the light on hover */
  [data-mx-hover] { transition: translate 0.35s cubic-bezier(.2,.8,.2,1), box-shadow 0.35s ease, opacity 0.9s cubic-bezier(.2,.8,.2,1), scale 1s cubic-bezier(.2,.8,.2,1), filter 0.9s ease; }
  [data-mx-hover]:hover { translate: 0 -5px; }
  [data-mx-spot] { position: relative; }
  [data-mx-spot]::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0; transition: opacity 0.35s ease; background: radial-gradient(320px circle at var(--mx-mx, 50%) var(--mx-my, 50%), var(--mx-spot, rgba(255, 255, 255, 0.55)), transparent 62%); mix-blend-mode: var(--mx-blend, soft-light); }
  [data-mx-spot]:hover::after { opacity: 1; }

  /* Buttons: a light sweep every few seconds, and they lean toward the cursor */
  [data-mx-shine] { position: relative; overflow: hidden; isolation: isolate; }
  [data-mx-shine]::after { content: ""; position: absolute; top: 0; bottom: 0; left: -60%; width: 45%; pointer-events: none; background: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.45), transparent); transform: skewX(-18deg); animation: mxShine 5.5s ease-in-out infinite; animation-delay: var(--mx-d, 0s); }
  @keyframes mxShine { 0%, 62% { left: -60%; } 82%, 100% { left: 130%; } }
  [data-mx-mag] { transition: translate 0.25s cubic-bezier(.2,.8,.2,1); }

  /* Hero cards float gently */
  [data-mx-float] { animation: mxFloat 6s ease-in-out infinite; animation-delay: var(--mx-d, 0s); }
  @keyframes mxFloat { 0%, 100% { translate: 0 0; } 50% { translate: 0 -10px; } }

  /* Soft light that trails the cursor */
  .mx-cursor { position: fixed; left: 0; top: 0; width: 640px; height: 640px; margin: -320px 0 0 -320px; border-radius: 50%; pointer-events: none; z-index: -1; opacity: 0; transition: opacity 0.5s ease; background: radial-gradient(circle, var(--mx-cur, rgba(255, 150, 80, 0.26)) 0%, var(--mx-cur2, rgba(110, 160, 255, 0.12)) 35%, transparent 68%); filter: blur(10px); will-change: transform; }
  .mx-cursor.on { opacity: 1; }

  /* Live status dots breathe */
  [data-mx-pulse] { animation: mxPulse 2.2s ease-out infinite; }
  @keyframes mxPulse { 0% { box-shadow: 0 0 0 0 var(--mx-pc, rgba(59, 178, 115, 0.55)); } 100% { box-shadow: 0 0 0 9px rgba(0, 0, 0, 0); } }
}
@media (prefers-reduced-motion: reduce) { .mx-progress, .mx-aura, .mx-cursor { display: none; } }