/* ── MOTION (the animation style of the "Raising Impact Home v3" design) ──
   Loaded after global.css. Colours stay on the site palette and fonts stay
   as they are; only the movement is borrowed. Driven by Layout.astro's script. */

:root {
  --ease-out: cubic-bezier(0.16, 0.84, 0.3, 1);
}

/* Lenis smooth scrolling takes over from the browser's own 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; }

/* Reveal: slower and longer travel than before, with optional stagger */
[data-reveal].reveal-pending {
  transform: translateY(36px);
}

[data-reveal].reveal-armed {
  transition:
    opacity 1.1s var(--ease-out),
    transform 1.1s var(--ease-out),
    visibility 0s;
  transition-delay: var(--reveal-delay, 0ms);
}

/* Hero: the headline rises out of a mask, the rest follows */
@keyframes mask-rise {
  from { clip-path: inset(0 0 100% 0); transform: translateY(40%); }
  to   { clip-path: inset(-10% -5% -20% -5%); transform: none; }
}

body > section:first-of-type > .wrap {
  animation: none;
}

body > section:first-of-type > .wrap h1 {
  animation: mask-rise 1.4s var(--ease-out) 0.12s both;
}

body > section:first-of-type > .wrap > *:not(h1) {
  animation: fade-up-in 1.1s var(--ease-out) 0.5s both;
}

/* Header slides away while scrolling down, returns on the way up */
.site-header {
  transition: transform 0.5s var(--ease-out);
}

.site-header.is-tucked { transform: translateY(-100%); }

/* Cursor: a small dot that inverts what it passes over and grows on links */
#cursor-dot {
  position: fixed;
  top: 0;
  left: 0;
  width: 14px;
  height: 14px;
  margin: -7px 0 0 -7px;
  border-radius: 50%;
  background: #FFFFFF;
  mix-blend-mode: difference;
  pointer-events: none;
  z-index: 300;
  opacity: 0;
  transition: opacity 0.3s;
}

#cursor-dot.is-on { opacity: 1; }

/* Magnetic buttons and tilting cards ease back to rest */
[data-magnetic] {
  transition: transform 0.35s var(--ease-out), background 0.3s, color 0.3s, box-shadow 0.3s;
}

[data-tilt] {
  transition: transform 0.5s var(--ease-out), box-shadow 0.5s ease, opacity 1.1s var(--ease-out);
  will-change: transform;
}

/* Word scrub: words light up as the paragraph scrolls through */
[data-scrub] [data-w] {
  opacity: 0.18;
  transition: opacity 0.3s linear;
}

[data-scrub] [data-w].is-lit { opacity: 1; }

@media (prefers-reduced-motion: reduce) {
  body > section:first-of-type > .wrap h1,
  body > section:first-of-type > .wrap > *:not(h1) { animation: none; }
  .site-header.is-tucked { transform: none; }
  #cursor-dot { display: none; }
  [data-scrub] [data-w] { opacity: 1; }
}

@media (pointer: coarse) {
  #cursor-dot { display: none; }
}