/*! ScrollCraft runtime CSS v1.0 — pairs with scrollcraft.js.
 * Every hiding rule is scoped to html.sc-on, which only exists when the
 * script ran, motion is allowed.
 * Tune per site with the custom properties below; never edit the selectors.
 */
:root {
  --sc-ease: cubic-bezier(.2, .7, .1, 1);     /* calm, premium settle */
  --sc-ease-pop: cubic-bezier(.34, 1.4, .5, 1);/* playful overshoot, use sparingly */
  --sc-dur: .9s;
  --sc-rise: 28px;
  --sc-bar-color: currentColor;
  --sc-bar-height: 2px;
  --sc-k: 1;                                   /* motion intensity multiplier */
}
@media (max-width: 767px) { :root { --sc-k: .5; --sc-rise: 18px; } }

/* ---------- reveal / stagger / count ---------- */
html.sc-on [data-sc~="reveal"]:not(.sc-in),
html.sc-on [data-sc~="count"]:not(.sc-in) {
  opacity: 0;
  transform: translate3d(0, var(--sc-rise), 0);
}
html.sc-on [data-sc~="reveal"],
html.sc-on [data-sc~="count"] {
  transition: opacity var(--sc-dur) var(--sc-ease), transform var(--sc-dur) var(--sc-ease);
  transition-delay: var(--sc-d, 0ms);
}
html.sc-on [data-sc~="stagger"]:not(.sc-in) > * {
  opacity: 0;
  transform: translate3d(0, var(--sc-rise), 0) scale(.985);
}
html.sc-on [data-sc~="stagger"] > * {
  transition: opacity var(--sc-dur) var(--sc-ease), transform var(--sc-dur) var(--sc-ease);
  transition-delay: var(--sc-d, 0ms);
}

/* ---------- mask: clip uncovers as it scrolls in (scrubbed) ---------- */
html.sc-on [data-sc~="mask"] {
  clip-path: inset(calc((1 - var(--sc-p, 0)) * 18%) calc((1 - var(--sc-p, 0)) * 6%) round var(--sc-radius, 0px));
  will-change: clip-path;
}
html.sc-on [data-sc~="mask"] img {
  transform: scale(calc(1.12 - var(--sc-p, 0) * .12));
  transform-origin: 50% 40%;
}

/* ---------- parallax / zoom / drift (scrubbed, transforms only) ---------- */
html.sc-on [data-sc~="parallax"] {
  transform: translate3d(0, calc((var(--sc-p, .5) - .5) * -2 * var(--sc-depth, 60px) * var(--sc-k)), 0);
  will-change: transform;
}
html.sc-on [data-sc~="zoom"] {
  transform: scale(calc(1 + var(--sc-p, 0) * var(--sc-zoom, .08) * var(--sc-k)));
  will-change: transform;
}
html.sc-on [data-sc~="drift"] {
  transform: translate3d(calc((var(--sc-p, .5) - .5) * -2 * var(--sc-drift, 120px) * var(--sc-k)), 0, 0);
  will-change: transform;
}

/* ---------- draw: SVG stroke follows scroll (offset set in JS) ---------- */
html.sc-on [data-sc~="draw"] path,
html.sc-on [data-sc~="draw"] line,
html.sc-on [data-sc~="draw"] polyline { transition: stroke-dashoffset .1s linear; }

/* ---------- stage: pinned story with beats ---------- */
html.sc-on [data-sc~="stage"] {
  position: relative;
  height: calc(var(--sc-beats, 3) * var(--sc-beat-len, 80vh) + 100vh);
}
html.sc-on [data-sc~="stage"] > [data-sc-pin] {
  position: sticky; top: 0; height: 100vh; overflow: hidden;
}
html.sc-on [data-sc~="stage"] [data-sc-beat] {
  transition: opacity .6s var(--sc-ease), transform .6s var(--sc-ease);
}
html.sc-on [data-sc~="stage"] [data-sc-beat]:not(.sc-active) {
  opacity: 0; transform: translate3d(0, 24px, 0); pointer-events: none;
}
html.sc-on [data-sc~="stage"] [data-sc-beat].sc-past { transform: translate3d(0, -24px, 0); }

/* ---------- reading-progress hairline ---------- */
[data-sc-bar] { display: none; }
html.sc-on [data-sc-bar] {
  display: block; position: fixed; inset: 0 0 auto 0; height: var(--sc-bar-height);
  background: var(--sc-bar-color); transform-origin: 0 50%;
  transform: scaleX(var(--sc-p, 0)); z-index: 2147483000; pointer-events: none;
}

/* ---------- hover depth (never carries meaning) ---------- */
@media (hover: hover) and (pointer: fine) {
  html.sc-on [data-sc-tilt] { transition: transform .35s var(--sc-ease), box-shadow .35s var(--sc-ease); }
  html.sc-on [data-sc-tilt]:hover { transform: translate3d(0, -4px, 0); }
}

/* ---------- belt and braces ---------- */
@media (prefers-reduced-motion: reduce) {
  [data-sc], [data-sc] > *, [data-sc] img { transition: none !important; transform: none !important; clip-path: none !important; opacity: 1 !important; }
  [data-sc-bar] { display: none !important; }
}
@media print {
  [data-sc], [data-sc] > *, [data-sc] img { transform: none !important; clip-path: none !important; opacity: 1 !important; }
}