/* ============================================================================
   world-scroll — the full-page scroll world
   Part of /client-site-system step 6. Built 2026-08-25.

   The world sits FIXED behind the entire document and scroll drives its
   currentTime, so scrolling the page scrolls through the world. Scroll down
   runs time forward; scroll up runs it back. That is the only place reverse
   is ever correct.

   Colton, 2026-08-25: "Every single link that I sent you has a site that is
   scroll reactive... you would scroll, and it would scroll through the whole
   world, essentially."

   THREE TRAPS THIS FILE EXISTS TO PREVENT — each one measured, not guessed:

   1. DOUBLE-DARKENING. The world sits under a global veil AND under whatever
      scrim each section carries. Measured on Astro & Aura 2026-08-25: veil .80
      plus section scrim .74 left roughly 5% of the world visible - technically
      wired, visually nothing. Keep the veil light and let sections be light
      too; tune ONE of them, not both.
      (Note: a fixed z-index:0 child paints ABOVE its parent's background layer,
      so an opaque body does not actually hide the world. But a class-qualified
      rule like `body.aura{background:...}` beats this file's plain `body`
      selector, so if you do want body transparent, override it in the site.)
   2. Lenis without its required CSS fights the native `scroll-behavior:smooth`
      and the page crawls. Measured on Astro & Aura 2026-08-25: 12 wheel ticks
      requesting 4800px advanced 472px — about 10%. The `.lenis-smooth` rule
      below is not optional.
   3. Opaque section backgrounds hide the world. Sections get a translucent
      scrim, never a solid fill.
   ========================================================================= */

/* --- 1. the ground moves to html so body can be transparent --------------- */
html { background: var(--world-ground, #0d0c0b); }
body { background: transparent; }

/* --- 2. Lenis required CSS. Do not remove. -------------------------------- */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
.lenis.lenis-stopped { overflow: hidden; }

/* --- 3. the world itself -------------------------------------------------- */
.ws-world {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
  background: var(--world-ground, #0d0c0b);
}
.ws-world-poster,
.ws-world video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: var(--world-focus, center);
}
.ws-world-poster { z-index: 0; }
.ws-world video  { z-index: 1; opacity: 0; transition: opacity .6s ease-out; }
.ws-world video.ws-ready { opacity: 1; }

/* A single grade layer over the world, so type legibility is tuned in ONE
   place instead of per-section. Tune --world-veil per client. */
.ws-world::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  background: var(--world-veil, linear-gradient(180deg, rgba(0,0,0,.30), rgba(0,0,0,.45)));
}

/* --- 4. content rides above the world ------------------------------------- */
body > header,
body > main,
body > footer,
.ws-above { position: relative; z-index: 1; }

/* --- 5. sections get a scrim, never a solid fill -------------------------- */
.ws-scrim { background: var(--world-scrim, rgba(12,11,10,.38)); }
.ws-scrim-strong { background: var(--world-scrim-strong, rgba(12,11,10,.58)); }

/* --- 6. pinned section: a panel holds while content travels through it ---- */
.ws-pin-track { position: relative; }
.ws-pin {
  position: sticky;
  top: 0;
  min-height: 100svh;
  display: grid;
  align-items: center;
}
/* body{overflow-x:hidden} silently kills position:sticky. Use clip. */
html, body { overflow-x: clip; }

/* --- 7. staggered entrance ------------------------------------------------ */
.ws-rise { opacity: 0; transform: translateY(18px); transition: opacity .7s ease-out, transform .7s ease-out; }
.ws-rise.ws-in { opacity: 1; transform: none; }
.ws-rise:nth-child(2) { transition-delay: .08s; }
.ws-rise:nth-child(3) { transition-delay: .16s; }
.ws-rise:nth-child(4) { transition-delay: .24s; }
.ws-rise:nth-child(5) { transition-delay: .32s; }

/* --- 8. reduced motion: poster only, no video, no easing ------------------ */
@media (prefers-reduced-motion: reduce) {
  .ws-world video { display: none; }
  .ws-rise { opacity: 1; transform: none; transition: none; }
  .lenis.lenis-smooth { scroll-behavior: auto !important; }
}