/* ==========================================================================
   site-animate.css
   Shared animation layer for every page. Provides the pre-reveal hidden
   states, the per-line masks, the injected border lines, and the CSS-driven
   full-bleed rule draw.

   Gated behind html.anim — site-animate.js removes that class (revealing all
   content) on reduced-motion, missing libraries, or any error, and each page's
   inline safety timeout does the same if the script never runs. Reveals are
   one-shot, so nothing can disappear on scroll-back.
   ========================================================================== */

/* ---- Lenis smooth-scroll plumbing -------------------------------------- */
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; }

/* ---- Chapter-header parts (every page shares this shape) --------------- */
.anim [class$="-head"] > *,
.anim .pb-market__head > *,
.anim .pc-advantage__head > *,
.anim .lb-award__head > * { opacity: 0; }

/* ---- Display headings: hidden until split into masked lines ------------ */
.anim .hm-hero__title,
.anim .hm-statement,
.anim .hm-library__title,
.anim .hm-feature__title,
.anim .ab-intro__title,
.anim .ab-statement,
.anim .ab-voice__quote,
.anim .ab-ceo__quote,
.anim .ab-close__title,
.anim .fr-intro__title,
.anim .fr-statement,
.anim .fr-event__title,
.anim .pb-intro__title,
.anim .pb-statement,
.anim .pb-feature__title,
.anim .pb-market__title,
.anim .pb-close__title,
.anim .pc-intro__title,
.anim .pc-statement,
.anim .pc-feature__title,
.anim .pc-cta__title,
.anim .lb-intro__title,
.anim .lb-statement,
.anim .lb-award__amount,
.anim .lb-feature__title,
.anim .lb-close__title,
.anim .nw-intro__title,
.anim .nw-feature__title,
.anim .ct-intro__title,
.anim .fd-hero__title,
.anim .fd-overview__statement,
.anim .fd-close__title,
.anim .nd-hero__title,
.anim .nd-pull,
.anim .bm-hero__name,
.anim .ed-footer__news-title { opacity: 0; }

/* Per-line mask (overflow hides the rising line; the negative margin keeps
   descenders from being clipped). */
.a-linemask { display: block; overflow: hidden; padding-block-end: 0.14em; margin-block-end: -0.14em; }
.a-linemask > .line { display: block; will-change: transform; }

/* ---- Image reveal frames: border draws, then the picture settles ------- */
/* NB: never set `position` here — some media are position:absolute full-bleed
   backgrounds (e.g. .pc-cta__media) and forcing relative drops them into flow.
   The script adds position:relative only when the element is static. */
.anim .a-fig { overflow: hidden; }
.anim .a-fig img { opacity: 0; will-change: transform; }

/* ---- Injected "drawn" border lines ------------------------------------- */
/* Horizontal lines draw left->right, vertical lines draw top->bottom.
   Colour + thickness are copied from the original border by the script. */
.a-bl { position: absolute; z-index: 3; pointer-events: none; transition: transform 1.5s cubic-bezier(0.22, 1, 0.36, 1); }
.a-bl--top    { top: 0;    left: 0;  width: 100%; height: var(--_w, 1px); transform: scaleX(0); transform-origin: left; }
.a-bl--bottom { bottom: 0; left: 0;  width: 100%; height: var(--_w, 1px); transform: scaleX(0); transform-origin: left; }
.a-bl--left   { top: 0;    left: 0;  height: 100%; width: var(--_w, 1px); transform: scaleY(0); transform-origin: top; }
.a-bl--right  { top: 0;    right: 0; height: 100%; width: var(--_w, 1px); transform: scaleY(0); transform-origin: top; }
.a-bl--top.is-drawn,
.a-bl--bottom.is-drawn { transform: scaleX(1); }
.a-bl--left.is-drawn,
.a-bl--right.is-drawn { transform: scaleY(1); }

/* ---- Full-bleed pseudo rules: draw left -> right ----------------------- */
.anim .hm-head::after,
.anim .hm-pillars::before,
.anim .hm-fairlist::before,
.anim .hm-fair::after,
.anim .hm-citystats::before,
.anim .ab-head::after,
.anim .ab-facts::before,
.anim .ab-pillars::before,
.anim .ab-timeline::before,
.anim .fr-head::after,
.anim .fr-facts::before,
.anim .fr-event::after,
.anim .pb-head::after,
.anim .pb-pipeline::before,
.anim .pb-market__head::after,
.anim .pb-gate::before,
.anim .pc-head::after,
.anim .pc-facts::before,
.anim .pc-advantage__head::after,
.anim .pc-advantage__grid::after,
.anim .lb-head::after,
.anim .lb-facts::before,
.anim .lb-award__head::after,
.anim .nw-head::after,
.anim .nw-filters::before,
.anim .nw-filters::after,
.anim .nw-pager::before,
.anim .ct-head::after,
.anim .ct-facts::before,
.anim .fd-head::after,
.anim .nd-head::after,
.anim .nd-hero__meta::before,
.anim .bm-head::after,
.anim .bm-stats::before,
.anim .ed-footer__grid::before,
.anim .ed-footer__grid::after {
  transform: translateX(-50%) scaleX(0);
  transform-origin: left;
  transition: transform 1.7s cubic-bezier(0.22, 1, 0.36, 1);
}
.anim .hm-head.is-drawn::after,
.anim .hm-pillars.is-drawn::before,
.anim .hm-fairlist.is-drawn::before,
.anim .hm-fair.is-drawn::after,
.anim .hm-citystats.is-drawn::before,
.anim .ab-head.is-drawn::after,
.anim .ab-facts.is-drawn::before,
.anim .ab-pillars.is-drawn::before,
.anim .ab-timeline.is-drawn::before,
.anim .fr-head.is-drawn::after,
.anim .fr-facts.is-drawn::before,
.anim .fr-event.is-drawn::after,
.anim .pb-head.is-drawn::after,
.anim .pb-pipeline.is-drawn::before,
.anim .pb-market__head.is-drawn::after,
.anim .pb-gate.is-drawn::before,
.anim .pc-head.is-drawn::after,
.anim .pc-facts.is-drawn::before,
.anim .pc-advantage__head.is-drawn::after,
.anim .pc-advantage__grid.is-drawn::after,
.anim .lb-head.is-drawn::after,
.anim .lb-facts.is-drawn::before,
.anim .lb-award__head.is-drawn::after,
.anim .nw-head.is-drawn::after,
.anim .nw-filters.is-drawn::before,
.anim .nw-filters.is-drawn::after,
.anim .nw-pager.is-drawn::before,
.anim .ct-head.is-drawn::after,
.anim .ct-facts.is-drawn::before,
.anim .fd-head.is-drawn::after,
.anim .nd-head.is-drawn::after,
.anim .nd-hero__meta.is-drawn::before,
.anim .bm-head.is-drawn::after,
.anim .bm-stats.is-drawn::before,
.anim .ed-footer__grid.is-drawn::before,
.anim .ed-footer__grid.is-drawn::after {
  transform: translateX(-50%) scaleX(1);
}

/* ---- Generic content targets, marked by the script (data-a) ------------ */
/* The script tags what it will reveal so there is no flash before GSAP runs. */
.anim [data-a="up"] { opacity: 0; }
