/* v2-closer.css: the closing call to action and the typographic closer. Tokens come from index.html :root only.
   Default rules style the static state (no JS, reduced motion, under 800px): the CTA row and the fully drawn
   wordmark. The burst layer and the draw-on are driven by v2-closer.js and only exist in motion-capable runs.
   Clipping lives on the burst layer alone; no ancestor of a sticky stage is touched. */

/* ---- closing call to action: copy left, actions right from 1024px ---- */
.sec.get { position: relative; padding-block: 48px; background: var(--panel); border-top: 1px solid var(--border); }
.get__row { display: grid; gap: 24px; }
.get .lead { margin-top: 8px; }
.get .cta { margin-top: 0; }
.get .cta-note { margin-top: 4px; }
@media (min-width: 1024px) {
  .get__row { grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: 40px; }
}

/* the burst: an overlay inside the section, clipped here and nowhere else */
.get__burst { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.get__burst svg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; max-width: none; overflow: hidden; }
.get__sq { fill: var(--text); stroke: var(--blue); stroke-width: 1; vector-effect: non-scaling-stroke; }

/* ---- typographic closer: the wordmark as a 1px outline, its glyphs filled with feature names ---- */
.closer { margin: 0; }
.closer__mark { width: 100%; height: auto; overflow: visible; }
.closer__word { font: 700 200px/1 var(--font); }
.closer__outline { fill: none; stroke: var(--muted); stroke-width: 1; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.closer__row { font: 500 11px/1 var(--font); fill: var(--muted); }