/* ==================================================================
   VANTAGE TYPOGRAPHY SYSTEM | LOCKED V1.0 | 19 OCTOBER 2026
   Microsoft AI inspired hierarchy; Vantage's existing Manrope identity.
   This is the single authoritative typography layer. Do not introduce
   section-level font overrides. See VANTAGE_TYPOGRAPHY_SPEC.md.
   ================================================================== */
:root {
  --vi-font-family: 'Manrope', 'Segoe UI', -apple-system, BlinkMacSystemFont, Arial, sans-serif;
  --font: var(--vi-font-family);
  --vi-hero-size: clamp(48px, 5.4vw, 88px);
  --vi-section-size: clamp(35px, 3.55vw, 52px);
  --vi-card-title-size: clamp(20px, 1.55vw, 23px);
  --vi-phase-title-size: clamp(33px, 2.85vw, 42px);
  --vi-intro-size: 16px;
  --vi-lead-size: clamp(16px, 1.23vw, 18px);
  --vi-body-size: 16px;
  --vi-card-body-size: 14px;
  --vi-overline-size: 11px;
  --vi-caption-size: 12px;
  --vi-cta-size: 13px;
  --vi-heading-weight: 600;
  --vi-card-weight: 650;
  --vi-body-weight: 400;
  --vi-heading-leading: 1.14;
  --vi-card-leading: 1.3;
  --vi-body-leading: 1.65;
  --vi-heading-tracking: -.035em;
  --vi-overline-tracking: .13em;
}
body, body button, body input, body select, body textarea,
body h1, body h2, body h3, body h4, body p, body a,
body span, body strong, body small, body div {
  font-family: var(--vi-font-family) !important;
}
/* Hierarchy: exactly one visual scale for every major section heading. */
main h2, .site-cta h2 {
  font-size: var(--vi-section-size) !important;
  font-weight: var(--vi-heading-weight) !important;
  line-height: var(--vi-heading-leading) !important;
  letter-spacing: var(--vi-heading-tracking) !important;
}
.hero h1 {
  font-size: var(--vi-hero-size) !important;
  font-weight: 500 !important;
  line-height: 1.07 !important;
  letter-spacing: -.045em !important;
}
.hero .hero-promise {
  font-size: var(--vi-lead-size) !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
  letter-spacing: -.01em !important;
}
.hero .hero-summary-final {
  font-size: var(--vi-body-size) !important;
  font-weight: var(--vi-body-weight) !important;
  line-height: var(--vi-body-leading) !important;
  letter-spacing: 0 !important;
}
/* Labels and signposts share one type treatment throughout. */
.eyebrow, .carousel-count, .card-index,
.carousel-card strong, .insight-card strong,
.value-grid span, .approved-approach .foundation-label,
.approved-approach .method-card-kicker {
  font-size: var(--vi-overline-size) !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
  letter-spacing: var(--vi-overline-tracking) !important;
}
/* Lead and introductory copy: consistent under every heading. */
#difference .why-lead {
  font-size: var(--vi-lead-size) !important;
  font-weight: 700 !important;
  line-height: 1.5 !important;
  letter-spacing: -.01em !important;
}
#difference .why-body,
#services .section-intro-under, #industries .section-intro-under,
#philosophy .principles-intro,
#approach .approach-subtitle,
#insights .section-heading > p,
.site-cta > .container p {
  font-size: var(--vi-intro-size) !important;
  font-weight: var(--vi-body-weight) !important;
  line-height: 1.68 !important;
  letter-spacing: 0 !important;
}
/* The services and industries use identical card typography. */
#services .carousel-card h3,
#industries .carousel-card h3,
#insights .insight-card h3,
#philosophy .value-grid h3 {
  font-size: var(--vi-card-title-size) !important;
  font-weight: var(--vi-card-weight) !important;
  line-height: var(--vi-card-leading) !important;
  letter-spacing: -.02em !important;
}
#services .carousel-card p,
#industries .carousel-card p,
#insights .insight-card p,
#philosophy .value-grid p,
#approach .foundation-content > p:not(.foundation-label),
#approach .approved-method-card > p:not(.method-card-kicker),
#approach .approved-method-card .method-outcome p {
  font-size: var(--vi-card-body-size) !important;
  font-weight: var(--vi-body-weight) !important;
  line-height: 1.65 !important;
  letter-spacing: 0 !important;
}
#services .service-tagline, #industries .industry-tagline,
#approach .approved-method-card .method-outcome strong {
  font-size: var(--vi-card-body-size) !important;
  font-weight: 700 !important;
  line-height: 1.5 !important;
  letter-spacing: 0 !important;
}
#services .services-connected {
  font-size: var(--vi-intro-size) !important;
  font-weight: 600 !important;
  line-height: 1.65 !important;
  letter-spacing: 0 !important;
}
#philosophy .principles-close {
  font-size: clamp(21px, 2vw, 26px) !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  letter-spacing: -.02em !important;
}
/* Our Approach remains the approved layout; only its type is aligned. */
#approach .foundation-zero {
  font-size: 33px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
}
#approach .foundation-content h3 {
  font-size: var(--vi-card-title-size) !important;
  font-weight: var(--vi-card-weight) !important;
  line-height: var(--vi-card-leading) !important;
  letter-spacing: -.02em !important;
}
#approach .approved-method-card h3 {
  font-size: var(--vi-phase-title-size) !important;
  font-weight: var(--vi-heading-weight) !important;
  line-height: 1.1 !important;
  letter-spacing: var(--vi-heading-tracking) !important;
}
#approach .approved-method-tags span,
#approach .approved-method-card .method-outcome strong,
#approach .foundation-content .foundation-footnote,
#approach .approach-bottom p {
  font-size: var(--vi-caption-size) !important;
  line-height: 1.6 !important;
}
#approach .approach-bottom h3 {
  font-size: clamp(21px, 2vw, 26px) !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  letter-spacing: -.02em !important;
}
/* Actions are identical across content bands. */
.button, .underlined-link, .text-link, .card-action,
#approach .button-light, .carousel-card .card-action {
  font-size: var(--vi-cta-size) !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  letter-spacing: 0 !important;
}
@media (max-width: 700px) {
  :root {
    --vi-hero-size: clamp(42px, 9.3vw, 64px);
    --vi-section-size: clamp(32px, 7.6vw, 45px);
    --vi-card-title-size: 21px;
    --vi-intro-size: 15px;
    --vi-body-size: 15px;
    --vi-card-body-size: 14px;
  }
}