/* ============================================================
   Platinum 2026 brand layer — type enforcement per Brand Guidelines v1.1
   Loaded LAST. Deterministically enforces the brand type hierarchy:
   DM Serif Display (400) for H1/H2 + big stat numbers;
   Inter for H3+, body, and every UI control.
   Theme only — no layout restyling.
   ============================================================ */

:root {
  --font-display: 'DM Serif Display', 'Georgia', serif;
}

/* ── Display headlines: H1/H2 in DM Serif Display ─────────── */
h1, h2 {
  font-family: var(--font-display) !important;
  font-weight: 400 !important;
  letter-spacing: -0.005em;
}

/* Italic accent words inside display headlines → persimmon */
h1 em, h1 i,
h2 em, h2 i {
  font-style: italic;
  color: var(--color-persimmon, #E8593A);
}

/* ── Sub-heads stay Inter ──────────────────────────────────── */
h3, h4, h5, h6 {
  font-family: 'Inter', -apple-system, sans-serif !important;
}

/* Round-4: display-word titles keep the serif — homepage Run/Grow panel titles are
   display words, not sub-heads, so they render in DM Serif Display (client). */
.pv6 .half h3 {
  font-family: 'DM Serif Display', Georgia, serif !important;
}

/* ── UI controls never use the serif ───────────────────────── */
button, input, select, textarea, .btn {
  font-family: 'Inter', -apple-system, sans-serif;
}

/* ── Big stat numbers: DM Serif Display, weight 400 ──────────
   Selectors verified in use across static/css + templates
   (marketing-site stats only; app/dashboard UI metrics such as
   .pt-stat-value and mockup values stay Inter by design). */
.stat__number,
.stat-number,
.stat__num,
.stat-num,
.stat-card__number,
.metric__number,
.metric-card__num,
.proof-num,
.archive-stats-bar__number,
.shift-stats-row__val {
  font-family: var(--font-display) !important;
  font-weight: 400 !important;
  letter-spacing: -0.01em;
}

/* ── Content links: sky = link role (Brand Guidelines §03) ────
   Scoped to page content (<main>) so header/footer/nav anchors —
   which live outside <main> in base_public.html / base_auth.html —
   and any classed anchors (buttons, cards, CTAs) are unaffected. */
main p > a:not([class]),
main li > a:not([class]) {
  color: #3B86BC;
  text-decoration: underline;
  text-underline-offset: 2px;
}

main p > a:not([class]):hover,
main li > a:not([class]):hover {
  color: #2C6FA6;
}

/* ── Eyebrow / kicker typographic enforcement ─────────────────
   Type only — color and size stay per-context (light text on
   dark sections, navy/sky on light). */
[class*="__eyebrow"],
[class*="-eyebrow"] {
  font-family: 'Inter', -apple-system, sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.09em;
}

/* ── Primary-action focus ring = persimmon (role match) ───────
   Inputs, links and secondary buttons keep the sky ring from
   styles.css; only the persimmon CTA gets a persimmon ring. */
.btn--primary:focus-visible,
.btn--accent:focus-visible,
.btn--gradient:focus-visible,
.auth__submit:focus-visible,
.footer-v2__cta-btn:focus-visible {
  outline-color: #E8593A;
  box-shadow: 0 0 0 4px rgba(232, 89, 58, 0.25);
}

/* ── Header: solid white at ALL times ─────────────────────────
   Pages now open on a navy hero; a translucent header let the
   navy bleed through. Force an opaque white bar in every state
   (top + scrolled) so the dark nav text stays readable. Wins over
   the several scattered .header rules via source order + !important. */
.header,
.header.scrolled {
  background: #ffffff !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  border-bottom: 1px solid #E3EAF2 !important; /* SURFACE-2027: cool hairline */
}
.header.scrolled {
  box-shadow: 0 1px 0 rgba(232, 230, 224, 0.6),
              0 4px 20px rgba(13, 27, 62, 0.05) !important;
}

/* ═══════════════════════════════════════════════════════════════
   2026-07-13 review enforcement — client consistency review §1
   (this file loads LAST; rules below win the cascade)
   ═══════════════════════════════════════════════════════════════ */

/* Body copy is charcoal; navy is reserved for headings/anchors */
body { color: var(--color-text-body, #2D2D3E); }

/* Icon tiles: one flat palette tint per tile — no gradients, no amber */
.role-card__icon,
[class*="mega-link__icon--"],
.footer-v2__cta-icon-wrap,
.hero__badge { background-image: none !important; }

/* Round-5 (1.1) · Round-2 P0: duotone-navy — icon strokes are ALWAYS navy; tiles keep one soft
   palette tint each (rust #C94A2D strokes removed). */
.role-card__icon { background-color: #DCF0FA !important; }
.role-card__icon--orange { background-color: #FDEEE9 !important; color: #0D1B3E !important; box-shadow: 0 4px 14px rgba(13,27,62,0.10) !important; }
.role-card__icon--green  { background-color: #E6EFEA !important; }
.role-card__icon--purple { background-color: #E6ECF5 !important; color: #0D1B3E !important; box-shadow: 0 4px 14px rgba(13,27,62,0.10) !important; }

.mega-link__icon--platform, .mega-link__icon--clinical,
.mega-link__icon--resource-learn, .mega-link__icon--company-about { background-color: #DCF0FA !important; }
.mega-link__icon--growth { background-color: #E6ECF5 !important; }
.mega-link__icon--revenue, .mega-link__icon--resource-tool, .mega-link__icon--company-connect { background-color: #E6EFEA !important; }
.mega-link__icon--resource-community, .mega-link__icon--company-news { background-color: #FDEEE9 !important; }
/* Round-5 (14.2) [Q]: Solutions dropdown = one duotone-navy set (navy line on one soft tint) —
   the sky/coral/sage/periwinkle mix had no colour logic and read random. */
.mega-link__icon--role-doctor, .mega-link__icon--role-desk, .mega-link__icon--role-billing,
.mega-link__icon--role-owner, .mega-link__icon--type-solo, .mega-link__icon--type-multi,
.mega-link__icon--type-enterprise, .mega-link__icon--cta { background-color: #E6ECF5 !important; color: #0D1B3E !important; }

.hero__badge { background-color: #DCF0FA !important; }

/* Primary CTAs: flat persimmon, token hover — no gradients, no animation

   ACCESSIBILITY / BRAND TRADE-OFF — flag for client sign-off.
   Button label is 15px/700 white. White on persimmon #E8593A measures 3.55:1,
   which fails WCAG AA (4.5:1 for text under the 18.66px-bold large-text
   threshold). The deeper persimmon #C94A2D — already the sanctioned hover
   shade, so NOT a new hue — measures 4.67:1 and passes.

   platinum-theme.css §25d makes the same swap for .h27-btn--fill across the 37
   converted pages. This line is matched to it so the header, footer and page
   CTAs are one colour; leaving them apart rendered two different oranges on
   the same screen, which is worse than either choice.

   TO REVERT to brand-exact persimmon: set this back to #E8593A and delete
   §25d in platinum-theme.css. Both must change together. */
.btn--primary, .btn--accent, .btn--gradient { background: #C94A2D !important; animation: none !important; }
.btn--primary:hover, .btn--accent:hover, .btn--gradient:hover { background: #0D1B3E !important; }

/* ═══════════════════════════════════════════════════════════════
   Round-6 — UNIQUE EYEBROW: corner-bracket (viewfinder) treatment
   Client: the dot-in-pill eyebrow reads like every generic AI site.
   Replace the pill + persimmon dot everywhere with thin persimmon
   corner ticks (top-left ⌐ + bottom-right ⌟) framing the label.
   Text stays navy uppercase letterspaced per the Round-5 standard;
   dark sections keep free-coral #FFAB96 text and get coral ticks.
   ═══════════════════════════════════════════════════════════════ */

/* 1) Strip the pill chrome from every eyebrow variant */
.section__label,
.section-header__label,
.module-section-header__badge,
.modules-showcase__eyebrow,
.pv6 .eyebrow,
.ea-label,
.ea-badge,
.mega-highlight__label {
  position: relative !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 7px 14px !important;
}

/* 2) Corner ticks (repurposes the old dot's ::before slot) */
.section__label::before,
.section-header__label::before,
.module-section-header__badge::before,
.modules-showcase__eyebrow::before,
.pv6 .eyebrow::before,
.ea-label::before,
.ea-badge::before,
.mega-highlight__label::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 11px !important;
  height: 11px !important;
  border-style: solid !important;
  border-color: #E8593A !important;
  border-width: 2px 0 0 2px !important;
  border-radius: 0 !important;
  background: transparent !important;
  display: block !important;
  margin: 0 !important;
  animation: none !important;
}
.section__label::after,
.section-header__label::after,
.module-section-header__badge::after,
.modules-showcase__eyebrow::after,
.pv6 .eyebrow::after,
.ea-label::after,
.ea-badge::after,
.mega-highlight__label::after {
  content: '' !important;
  position: absolute !important;
  bottom: 0 !important;
  right: 0 !important;
  width: 11px !important;
  height: 11px !important;
  border-style: solid !important;
  border-color: #E8593A !important;
  border-width: 0 2px 2px 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  display: block !important;
}

/* 3) Retire the standalone dot spans (badge/showcase variants) */
.module-section-header__dot,
.modules-showcase__eyebrow-dot {
  display: none !important;
}

/* 4) Dark sections — free-coral text stays; ticks go free-coral too.
   (brand-blocks zeroes padding + hides ::before there; restore both.) */
.pv6 .hero .eyebrow, .pv6 .bg-navy .eyebrow, .pv6 .ctaband .eyebrow,
.pv6 .secnum .eyebrow, .pv6 .phero .eyebrow,
.mega-highlight__label {
  padding: 7px 14px !important;
}
.pv6 .hero .eyebrow::before, .pv6 .bg-navy .eyebrow::before,
.pv6 .ctaband .eyebrow::before, .pv6 .secnum .eyebrow::before,
.pv6 .phero .eyebrow::before,
.mega-highlight__label::before {
  border-color: #FFAB96 !important;
}
.pv6 .hero .eyebrow::after, .pv6 .bg-navy .eyebrow::after,
.pv6 .ctaband .eyebrow::after, .pv6 .secnum .eyebrow::after,
.pv6 .phero .eyebrow::after,
.mega-highlight__label::after {
  border-color: #FFAB96 !important;
}
