/* =============================================================================
   BRAMLEY SITE LAYER — marketing-shell tokens only.
   The design system already defines a calibrated type + spacing scale
   (display clamp 44–72px, etc.). We do NOT override those. We only add the
   two things the DS doesn't define for a multi-page marketing site:
   generous viewport-scaled horizontal gutters, and section rhythm.
   ============================================================================= */
:root {
  /* Wide, viewport-scaled marketing gutters — content breathes from the edges.
     MEASURED to match Hebbia: content sits ~7.4% from each edge at ~1700px.
     Paired with a high max-width cap (1680) so the centering margin does NOT
     stack on top of this padding at common widths (that double-up was making
     our margins 17% instead of 7.4%). */
  --gutter:      clamp(22px, 7.2vw, 128px);

  /* Generous vertical separation between sections — one idea per screen. */
  --section-pad: clamp(88px, 9vw, 144px);

  /* Hero gets extra top air so the headline "drops in". */
  --hero-pad-top: clamp(72px, 8vw, 128px);

  /* Prose measure — never sprawls full width. */
  --measure:     62ch;

  /* Top bar + footer span nearly edge-to-edge (Harvey logo ≈33px, Hebbia ≈12-30px
     from the edge on a ~1680px page). The chrome uses this small gutter, NOT the
     wide content gutter, so the bar reads full-width like the comps. */
  --bar-gutter:  clamp(18px, 2.4vw, 34px);
}