/* GROW Hero 3D 2.0 — layout of the scroll scene. No position:sticky anywhere: the page scrolls natively,
   the stage only drifts down at a share (--gh3d-k) of the scroll while the scene plays. */
.gh3d {
  --gh3d-d: 85svh;            /* scroll length of the scene (the script writes the measured px value) */
  --gh3d-k: .7;               /* drift share */
  position: relative;
  min-height: calc(100svh - 110px);   /* before / without the script: one screen, the poster in it */
  overflow: clip;
  isolation: isolate;
}
.gh3d--on { height: calc(100svh + var(--gh3d-d) * var(--gh3d-k)); }   /* the script adds the scroll length */
.gh3d-stage {
  position: absolute; inset-inline: 0; top: 0; height: 100svh;
  z-index: 0; pointer-events: none; will-change: transform;
}
.gh3d-stage canvas { display: block; width: 100%; height: 100%; opacity: 0; transition: opacity .7s ease; }
.gh3d.is-live .gh3d-stage canvas { opacity: 1; }
/* poster: shown until the scene has drawn its first frame, and kept when WebGL is missing */
.gh3d-poster {
  position: absolute; left: 50%; top: 58%; width: min(70vw, 640px); height: auto;
  transform: translate(-50%, -50%); transition: opacity .5s ease;
}
.gh3d.is-live .gh3d-poster { opacity: 0; }
.gh3d-copy { position: relative; z-index: 1; }

/* compositor-driven drift where the browser has scroll timelines (no main-thread lag) */
@supports (animation-timeline: scroll()) {
  .gh3d--cssdrift .gh3d-stage {
    animation: gh3d-drift linear both;
    animation-timeline: scroll(root block);
    animation-range: var(--gh3d-s, 0px) var(--gh3d-e, 85svh);
  }
  @keyframes gh3d-drift { to { transform: translate3d(0, calc(var(--gh3d-d) * var(--gh3d-k)), 0); } }
}

/* reduced motion: the finished composition — the finished object under the copy, nothing scroll-driven */
.gh3d--static, .gh3d--static.gh3d--on { height: auto; min-height: 0; }
.gh3d--static .gh3d-stage { position: relative; height: min(62svh, 620px); transform: none; animation: none; }
.gh3d--static .gh3d-poster { top: 50%; }
.gh3d--static .gh3d-hint { display: none; }

/* no WebGL: the poster stays, the section loses the extra scroll length */
.gh3d--nogl, .gh3d--nogl.gh3d--on { height: auto; }
.gh3d--nogl .gh3d-hint { display: none; }