/* ==========================================================================
   UNIFORM.CSS — the constitution applied to the EXISTING site.

   This is the polish-and-uniformity pass, not a rebuild. It loads last on
   every route and touches nothing structural: no section changes, no removed
   features, no new layout. It only makes the small things agree with each
   other — one type ramp, one label voice, one radius, one shadow, one easing,
   one focus ring — across everything that already exists.

   Rule of engagement: selectors here may only NORMALIZE known elements to
   the constitution's values. If a rule would change what something IS rather
   than how consistently it speaks, it does not belong in this file.
   ========================================================================== */

:root {
  --u-ink: #f4f1eb;
  --u-ink-2: rgb(244 241 235 / 0.72);
  --u-ink-3: rgb(244 241 235 / 0.5);
  --u-line: rgb(244 241 235 / 0.1);
  --u-line-strong: rgb(244 241 235 / 0.2);

  --u-h1: clamp(4.5rem, 8.2vw, 7.5rem);
  --u-h2: clamp(3rem, 5vw, 4.6rem);
  --u-h3: 1.65rem;
  --u-lede: 1.25rem;
  --u-meta: 0.82rem;
  --u-label: 0.68rem;
  --u-track: 0.15em;

  /* Pin the legacy sheets' own headline tokens to the ramp, so even the
     high-specificity rules that consume them land on the same size. */
  --t-h2: clamp(3rem, 5vw, 4.6rem);
  --lrn-display: clamp(4.5rem, 8.2vw, 7.5rem);
  --lrn-h2-sm: clamp(3rem, 5vw, 4.6rem);
  --lrn-h3: 1.65rem;

  --u-r: 0.5rem;
  --u-shadow: 0 24px 80px rgb(0 0 0 / 0.45);
  --u-ease: cubic-bezier(0.22, 0.61, 0.21, 1);
}

/* Round 63: the course routes' section voice. The one ramp stayed tuned for
   the archive's big single heads; the course pages stack MANY section heads
   and read as a pile of heroes (Giovani's full-pass note). Same constitution,
   a calmer register - scoped to the course body only. */
body.definitive-interior.course-page {
  --u-h1: clamp(2.5rem, 4.6vw, 4.2rem);
  --u-h2: clamp(1.9rem, 3vw, 2.9rem);
  --u-h3: 1.35rem;
  --u-lede: 1.1rem;
  --lrn-display: clamp(2.5rem, 4.6vw, 4.2rem);
  --lrn-h2-sm: clamp(1.6rem, 2.3vw, 2.2rem);
  --lrn-h3: clamp(1.2rem, 1.7vw, 1.7rem);
}

@media (max-width: 720px) {
  :root {
    --u-h1: clamp(2.6rem, 11vw, 3.4rem);
    --u-h2: clamp(2rem, 8.4vw, 2.6rem);
    --u-h3: 1.3rem;
    --u-lede: 1.05rem;
  }
}

/* ---- One headline ramp --------------------------------------------------
   Every section headline on every route speaks at the same size. The galaxy
   copy is a moment with its own scale and is deliberately excluded. */
.definitive-site main h1,
.definitive-interior main h1:not(.is-long) {
  font-size: var(--u-h1);
  letter-spacing: -0.03em;
  line-height: 1.04;
}

.definitive-site.definitive-site main section h2:not(.galaxy-copy),
.definitive-interior.definitive-interior main section h2 {
  font-size: var(--u-h2);
  letter-spacing: -0.026em;
  line-height: 1.06;
}

.definitive-site main section h3,
.definitive-interior main section h3 {
  font-size: var(--u-h3);
  line-height: 1.14;
}

/* ---- One subline voice -------------------------------------------------- */
.definitive-site .def-about-lead,
.definitive-site .def-close-copy > p:not(.def-kicker),
.definitive-interior .lrn-lede {
  color: var(--u-ink-2);
  font-size: var(--u-lede);
  line-height: 1.55;
}

/* ---- One label voice -----------------------------------------------------
   Kickers, filters, nav labels, counts: same size, same tracking, same ink,
   wherever they appear. */
.definitive-site .def-kicker,
.definitive-interior .lrn-kicker,
.definitive-site .def-film-controls small,
.definitive-interior .archive-filter a,
.definitive-site .campaign-meta,
.definitive-interior .campaign-meta {
  font-size: var(--u-label);
  letter-spacing: var(--u-track);
  text-transform: uppercase;
}

.definitive-site .campaign-meta,
.definitive-interior .campaign-meta,
.definitive-site .def-film-controls small {
  color: var(--u-ink-3);
}

/* ---- One radius ---------------------------------------------------------- */
.definitive-site .def-film-card,
.definitive-site .def-close-media button,
.definitive-site .def-close-media button > img,
.definitive-site .def-service-grid article,
.definitive-site .def-learn-grid a img,
.definitive-site .campaign-card,
.definitive-interior .campaign-card,
.definitive-interior .lrn-proof,
.definitive-interior .lrn-tier,
.definitive-interior .lrn-plate-inner,
.definitive-interior .archive-filter a,
.definitive-site .instagram-grid a,
.definitive-site .instagram-grid img {
  border-radius: var(--u-r);
}

/* ---- One shadow ----------------------------------------------------------
   Everything that floats, floats the same way. */
.definitive-site .def-film-card,
.definitive-site .def-close-media button,
.definitive-site .def-service-grid article:hover,
.definitive-site .campaign-card:hover,
.definitive-interior .campaign-card:hover,
.definitive-interior .lrn-proof,
.definitive-interior .lrn-tier {
  box-shadow: var(--u-shadow);
}

/* ---- One easing ----------------------------------------------------------
   The site already routes nearly all motion through --def-ease and the
   interior's equivalent; pinning both to the constitution curve gives every
   hover, reveal and settle the same hand without touching any duration. */
:root {
  --def-ease: var(--u-ease);
  --int-ease: var(--u-ease);
  --lrn-ease: var(--u-ease);
}

/* ---- One focus ring ------------------------------------------------------ */
.definitive-site :focus-visible,
.definitive-interior :focus-visible {
  outline: 1px solid var(--u-ink-2);
  outline-offset: 3px;
}

/* ---- One border ink ------------------------------------------------------ */
.definitive-site .def-service-grid article,
.definitive-site .campaign-card,
.definitive-interior .campaign-card,
.definitive-interior .lrn-proof,
.definitive-interior .lrn-tier,
.definitive-interior .archive-filter a {
  border-color: var(--u-line);
}

.definitive-site .def-service-grid article:hover,
.definitive-site .campaign-card:hover,
.definitive-interior .campaign-card:hover {
  border-color: var(--u-line-strong);
}


/* r78: Giovani's standing law - NO button is ever full-width. The interior
   hero action rows kept re-stretching their children through later
   overrides (photo page's BACK HOME went wall to wall on phones again).
   uniform.css loads LAST; this is the final word, counter !important in
   kind. */
@media (max-width: 720px) {
  .definitive-interior .lrn-actions { align-items: center !important; }
  .definitive-interior .lrn-actions .lrn-btn {
    width: auto !important;
    align-self: center !important;
  }
}


/* ---- r88: ONE headline system, interior side (Giovani) ----
   Above-the-fold headlines take the HOME fold's exact ramp; section
   heads take the rail head's ramp; gold ems everywhere. Loads last -
   this is the final word over every earlier --lrn-display pin. */
:root, body.course-page-scoped, body.definitive-interior {
  --lrn-display: clamp(2.1rem, 4vw, 4.1rem) !important;
}
.definitive-interior .lrn-hero h1,
.definitive-interior h1[data-archive-title] {
  font-size: clamp(2.1rem, 4vw, 4.1rem) !important;
  line-height: 1.1;
}
.definitive-interior .lrn-head h2,
.definitive-interior .lrn-split-text h2 {
  font-size: clamp(1.9rem, 3vw, 3rem) !important;
  line-height: 1.08;
}
.definitive-interior .lrn-hero h1 em,
.definitive-interior .lrn-head h2 em,
.definitive-interior h1[data-archive-title] em {
  font-style: italic;
  color: rgb(var(--kls-accent-rgb) / 0.95);
}
