/* One shared type scale. The approved calculator keeps its own typography. */
:root {
  --cc-type-page: clamp(36px, 4vw, 52px);
  --cc-type-section: clamp(30px, 3vw, 40px);
  --cc-type-subsection: clamp(24px, 2.4vw, 28px);
  --cc-type-card: 22px;
  --cc-type-body: 16px;
  --cc-type-lead: 18px;
  --cc-type-control: 14px;
  --cc-type-caption: 12px;
}
body { font-size: var(--cc-type-body); line-height: 1.7; }
body :is(h1, h2, h3, h4, h5, h6):not(:where(#mortgage-calculator *)) {
  line-height: 1.25 !important;
}
body h1:not(:where(#mortgage-calculator *)) {
  font-size: var(--cc-type-page) !important;
  line-height: 1.15 !important;
}
body h2:not(:where(#mortgage-calculator *)) { font-size: var(--cc-type-section) !important; }
body :is(h3, h4, h5):not(:where(#mortgage-calculator *)) { font-size: var(--cc-type-card) !important; }
body h6:not(:where(#mortgage-calculator *)) { font-size: var(--cc-type-control) !important; }
body :is(p, blockquote):not(:where(#mortgage-calculator *)):not(.cc-rate-number):not(.cc-rate-unavailable) {
  font-size: var(--cc-type-body) !important;
  line-height: 1.75 !important;
}
body :is(.lead, .cc-about-lead, .cc-bio-lead, .cc-layer-one-copy):not(:where(#mortgage-calculator *)) {
  font-size: var(--cc-type-lead) !important;
  line-height: 1.65 !important;
}
body :is(article, .card, .panel, .cc-self-cards, .cc-prep-checklist, .cc-state-note) h2:not(:where(#mortgage-calculator *)) {
  font-size: var(--cc-type-subsection) !important;
}
body :is(.cc-self-cards, .cc-about-card, .cc-about-values-grid, .cc-bio-values) :is(h2, h3),
body .cc-homepage-compact .card-title {
  font-size: var(--cc-type-card) !important;
}
body :is(.cc-faq-topic > h2, .cc-faq-help h2, .cc-state-card h2, .cc-state-help h2, .cc-team-profile h2) {
  font-size: var(--cc-type-subsection) !important;
}
body :is(.cc-rate-card h3, .cc-review-card h3) { font-size: 18px !important; }
body :is(.cc-faq-item summary, .cc-reference-inner .faq summary, #cc-content summary) {
  font-size: var(--cc-type-body) !important;
  line-height: 1.5 !important;
}
body :is(.btn, .button, .cc-layer-one-button, .cc-about-button, .cc-team-actions a,
  .cc-faq-help > a, .cc-state-help > a, .cc-state-links a, .cc-state-jumps a,
  .cc-faq-filters button, .cc-rates-footer button):not(:where(#mortgage-calculator *)) {
  font-size: var(--cc-type-control) !important;
  line-height: 1.5 !important;
}
body :is(input, select, textarea):not(:where(#mortgage-calculator *)) {
  font-size: var(--cc-type-body) !important;
}
body label:not(:where(#mortgage-calculator *)) {
  font-size: var(--cc-type-control) !important;
  line-height: 1.5 !important;
}
body .cc-single-header #navbar-top > .navbar-nav > .nav-item > .nav-link,
body .cc-single-header .dropdown-menu .nav-link,
body .cc-single-header .cc-single-apply {
  font-size: var(--cc-type-control) !important;
  line-height: 1.4 !important;
}
body .cc-single-header .cc-staff-login { font-size: var(--cc-type-caption) !important; }
body :is(.eyebrow, .cc-content-kicker, .cc-about-kicker, .cc-layer-one-badge,
  .cc-rates-badge, .cc-topic-intro > span, .cc-faq-intro > span,
  .cc-team-intro > span, .cc-team-bio > span, .cc-reviews-intro small):not(:where(#mortgage-calculator *)) {
  font-size: var(--cc-type-caption) !important;
  line-height: 1.5 !important;
}
body :is(.cc-rate-card > p, .cc-rate-card .cc-rate-payment,
  .cc-state-card .cc-state-agency, .cc-about-portrait figcaption p) {
  font-size: var(--cc-type-control) !important;
}
body :is(.cc-small-note, .cc-faq-notice, .cc-faq-tools > p, .cc-state-note > p,
  .cc-rates-footer p, .cc-rate-card .cc-rate-date, .cc-rate-source,
  .cc-legal, .cc-legal p, #cc-content .fine):not(:where(#mortgage-calculator *)) {
  font-size: var(--cc-type-caption) !important;
  line-height: 1.7 !important;
}
body footer h3 { font-size: var(--cc-type-body) !important; }
body footer :is(p, a, li) { font-size: var(--cc-type-control) !important; line-height: 1.7 !important; }
body footer :is(.cc-legal, .cc-legal p) { font-size: var(--cc-type-caption) !important; }
@media (max-width: 600px) {
  :root { --cc-type-card: 20px; }
  body .cc-single-header .cc-single-apply { padding-inline: 10px; }
}