/* Motion layer. Everything is gated on .js-motion (set by motion.js) and disabled for reduced-motion users. */
@media (prefers-reduced-motion: no-preference) {
  /* Hero photo: slow Ken Burns drift */
  .hero-photo { overflow: hidden; }
  .hero-photo > img,
  .hero-carousel .carousel-slide.is-active { animation: kenburns 22s ease-in-out infinite alternate; transform-origin: 60% 40%; }
  @keyframes kenburns { from { transform: scale(1.02) translate3d(0, 0, 0); } to { transform: scale(1.14) translate3d(-2%, -1.5%, 0); } }

  /* Hero headline: words rise in */
  .js-motion .w { display: inline-block; overflow: hidden; vertical-align: top; }
  .js-motion .w > span { display: inline-block; transform: translateY(110%); animation: rise .9s cubic-bezier(.2,.7,.2,1) forwards; animation-delay: calc(var(--i) * 70ms + 150ms); }
  @keyframes rise { to { transform: translateY(0); } }
  .js-motion .hero .kicker, .js-motion .page-hero .kicker,
  .js-motion .hero .lede, .js-motion .page-hero .lede,
  .js-motion .hero-actions { opacity: 0; animation: fadeup .9s ease forwards; }
  .js-motion .kicker { animation-delay: .05s; }
  .js-motion .lede { animation-delay: .75s; }
  .js-motion .hero-actions { animation-delay: .95s; }
  @keyframes fadeup { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }

  /* Scroll reveals */
  .js-motion [data-reveal] { opacity: 0; transform: translateY(28px); transition: opacity .8s ease, transform .8s cubic-bezier(.2,.7,.2,1); transition-delay: calc(var(--d, 0) * 90ms); }
  .js-motion [data-reveal].is-in { opacity: 1; transform: none; }
  .js-motion [data-reveal="img"] { clip-path: inset(0 0 100% 0); transform: none; transition: clip-path 1.1s cubic-bezier(.2,.7,.2,1), opacity .6s ease; }
  .js-motion [data-reveal="img"].is-in { clip-path: inset(0 0 0 0); }

  /* Parallax images (translate set from JS via --py) */
  [data-parallax] { will-change: transform; transform: translate3d(0, var(--py, 0px), 0) scale(1.12); }
  .media { overflow: hidden; }

  /* Hover motion */
  .practice img { transition: transform .6s cubic-bezier(.2,.7,.2,1); }
  .practice:hover img { transform: scale(1.06); }
  .practice { transition: padding-left .35s ease; }
  .practice:hover { padding-left: .6rem; }
  .practice-no { display: inline-block; transition: transform .35s ease; }
  .practice:hover .practice-no { transform: translateX(.3rem); }
  .button, .button-ghost { transition: transform .25s ease, background-color .25s ease; }
  .button:hover, .button-ghost:hover { transform: translateY(-2px); }

  /* Fibre band: light streaks travelling along the cable */
  .fiber-wrap { position: relative; overflow: hidden; line-height: 0; }
  .fiber-wrap::after { content: ""; position: absolute; inset: 0; background: linear-gradient(100deg, transparent 35%, rgba(255,255,255,.55) 50%, transparent 65%); background-size: 40% 100%; background-repeat: no-repeat; animation: streak 3.6s linear infinite; mix-blend-mode: screen; }
  @keyframes streak { from { background-position: -60% 0; } to { background-position: 160% 0; } }

  /* Animated SVG overlays */
  .motion-svg { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
  .motion-svg .link { fill: none; stroke: rgba(156,199,255,.6); stroke-width: 1.4; stroke-dasharray: 6 8; animation: dash 5s linear infinite; }
  .motion-svg .pulse { fill: #cfe3ff; filter: drop-shadow(0 0 6px #5aa2ff); }
  .motion-svg .node { fill: #f4f8ff; animation: node 3s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }
  .motion-svg .node:nth-of-type(2n) { animation-delay: .8s; }
  .motion-svg .node:nth-of-type(3n) { animation-delay: 1.6s; }
  .motion-svg .sun { fill: #e6f0ff; animation: sun 6s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }
  .motion-svg .ray { stroke: #e6f0ff; stroke-width: 2; stroke-linecap: round; animation: ray 6s ease-in-out infinite; }
  @keyframes dash { to { stroke-dashoffset: -140; } }
  @keyframes node { 0%,100% { transform: scale(1); opacity: .85; } 50% { transform: scale(1.7); opacity: 1; } }
  @keyframes sun { 0%,100% { transform: scale(1); opacity: .9; } 50% { transform: scale(1.12); opacity: 1; } }
  @keyframes ray { 0%,100% { opacity: .25; } 50% { opacity: .9; } }

  .page-hero { position: relative; overflow: hidden; }
  .page-hero .wrap { position: relative; z-index: 1; }
  .page-hero .motion-svg { opacity: .9; }
  .page-hero .motion-svg .link { stroke: rgba(24,119,242,.45); }
  .page-hero .motion-svg .node { fill: var(--copper); }
  .page-hero .motion-svg .pulse { fill: var(--copper); filter: drop-shadow(0 0 5px rgba(24,119,242,.7)); }
  .page-hero .motion-svg .sun { fill: var(--copper); opacity: .85; }
  .page-hero .motion-svg .ray { stroke: var(--copper); }

  /* Header shrinks subtly on scroll */
  .site-header { transition: min-height .3s ease, box-shadow .3s ease; }
  .site-header.is-scrolled { min-height: 3.6rem; box-shadow: 0 6px 24px rgba(13,27,46,.08); }
}
@media (prefers-reduced-motion: reduce) {
  .motion-svg .pulse { display: none; }
}
