/**
 * Global UI text scale (+12.5% desktop, +10% mobile).
 * Rem-based UI (nav, buttons, forms, body copy, labels) scales with the root.
 * Headings / hero / section titles keep their designed visual size.
 */
:root {
  --type-base: 16px; /* design rem reference before scale */
  --type-scale: 1.125; /* +12.5% */
}

@media (max-width: 767.98px) {
  :root {
    --type-scale: 1.1; /* +10% on small screens */
  }
}

html {
  font-size: calc(var(--type-base) * var(--type-scale));
}

body {
  /* Was 17px absolute; keep the same proportional bump as the root scale */
  font-size: calc(17px * var(--type-scale));
}

/*
 * Semantic headings: undo body/root growth for UA em-based sizes
 * (2em × scaled body / scale ≈ original visual size).
 */
h1, .h1 { font-size: calc(2em / var(--type-scale)); }
h2, .h2 { font-size: calc(1.5em / var(--type-scale)); }
h3, .h3 { font-size: calc(1.17em / var(--type-scale)); }
h4, .h4 { font-size: calc(1em / var(--type-scale)); }
h5, .h5 { font-size: calc(0.83em / var(--type-scale)); }
h6, .h6 { font-size: calc(0.67em / var(--type-scale)); }

/*
 * Site display titles: cancel rem root scale so enhance/style rem sizes
 * stay at the original designed pixel size.
 */
.mh-name,
.masthead .mh-name {
  font-size: calc(1.25rem / var(--type-scale)) !important;
}

.page-hero h1 {
  font-size: calc(1.6rem / var(--type-scale)) !important;
}

.inst-title {
  font-size: calc(2rem / var(--type-scale)) !important;
}

.contact-info-panel .inst-title.on-dark {
  font-size: calc(2.05rem / var(--type-scale)) !important;
}

.hero-split h1,
.home-hero-content h1 {
  font-size: calc(2.8rem / var(--type-scale)) !important;
}

.hero-split .hs-ornament,
.hs-ornament {
  font-size: calc(2.2rem / var(--type-scale)) !important;
}

.hero-split .hs-ar,
.hs-ar {
  font-size: calc(1.5rem / var(--type-scale)) !important;
}

.si .sn {
  font-size: calc(2.5rem / var(--type-scale)) !important;
}

.sb .sbn {
  font-size: calc(1.7rem / var(--type-scale)) !important;
}

#newsletter h3 {
  font-size: calc(1.1rem / var(--type-scale)) !important;
}

.nc h5 {
  font-size: calc(1.05rem / var(--type-scale)) !important;
}

.auth-card h1 {
  font-size: calc(1.05rem / var(--type-scale)) !important;
}

.rich-content h1,
.cms-rich-content h1 {
  font-size: clamp(
    calc(1.65rem / var(--type-scale)),
    2.5vw,
    calc(2rem / var(--type-scale))
  ) !important;
}

.rich-content h2,
.cms-rich-content h2 {
  font-size: clamp(
    calc(1.45rem / var(--type-scale)),
    2.2vw,
    calc(1.75rem / var(--type-scale))
  ) !important;
}

.rich-content h3,
.cms-rich-content h3 {
  font-size: clamp(
    calc(1.25rem / var(--type-scale)),
    2vw,
    calc(1.45rem / var(--type-scale))
  ) !important;
}

.rich-content h4,
.cms-rich-content h4 {
  font-size: calc(1.15rem / var(--type-scale)) !important;
}

.rich-content h5,
.cms-rich-content h5 {
  font-size: calc(1.05rem / var(--type-scale)) !important;
}

.rich-content h6,
.cms-rich-content h6 {
  font-size: calc(1rem / var(--type-scale)) !important;
}

@media (max-width: 991.98px) {
  .hero-split h1,
  .home-hero-content h1 {
    font-size: calc(2.2rem / var(--type-scale)) !important;
  }
}

@media (max-width: 767.98px) {
  .inst-title {
    font-size: calc(1.8rem / var(--type-scale)) !important;
  }

  .contact-info-panel .inst-title.on-dark {
    font-size: calc(1.75rem / var(--type-scale)) !important;
  }

  .hero-split h1 {
    font-size: calc(1.7rem / var(--type-scale)) !important;
  }
}

@media (max-width: 424px) {
  .page-hero h1 {
    font-size: calc(1.25rem / var(--type-scale)) !important;
  }
}