/* Styles the GSAP layer needs. Loaded on every page, but every rule is gated
 * behind `html.gsap-on`, a class the script adds only once GSAP is confirmed
 * present and running. Without GSAP — file blocked, old browser, reduced
 * motion — none of this applies and the CSS-only motion system carries on.
 */

/* ------------------------------------------------------------ line masks --
 * A headline is split into lines, each line wrapped in a mask so the text can
 * rise into view from behind its own edge. The wrapping is done at runtime by
 * the script; the CMS never sees it, because the script stands down entirely
 * in edit mode.
 */
html.gsap-on .gm-line {
  display: block;
  overflow: hidden;
  /* A descender (g, y, ő) would be clipped by a mask sized to the line box. */
  padding-bottom: .08em;
  margin-bottom: -.08em;
}
html.gsap-on .gm-line-inner {
  display: block;
  will-change: transform;
}

/* The hero photograph is scrubbed by scroll, so it owns its own transform. */
html.gsap-on .hero-photo .photo-image,
html.gsap-on .post-hero .post-photo .photo-image {
  will-change: transform;
}

@media (prefers-reduced-motion: reduce) {
  /* The script never arms itself under reduced motion, but if the class is
     somehow present the composition must still resolve to "no movement". */
  html.gsap-on .gm-line-inner {
    transform: none !important;
  }
}
