/* Shared public-site typography system. Keep this file last in the CSS cascade. */
:root {
  --type-display: clamp(42px, 4.35vw, 56px);
  --type-title: clamp(30px, 2.65vw, 38px);
  --type-subtitle: clamp(23px, 2vw, 28px);
  --type-card-title: 20px;
  --type-body: 16px;
  --type-ui: 15px;
  --type-caption: 14px;
  --type-micro: 12px;
  --leading-display: 1.16;
  --leading-title: 1.28;
  --leading-body: 1.72;
  --tracking-display: -0.045em;
  --tracking-title: -0.035em;
  --tracking-body: -0.012em;
}

body:is(.landing-page, .home-page, .quote-page, .special-page, .compare-consult-page, .quick-consult-page, .special-consult-page, .page-enter) {
  font-size: var(--type-body);
  line-height: var(--leading-body);
  letter-spacing: var(--tracking-body);
  word-break: keep-all;
  overflow-wrap: break-word;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

body:is(.landing-page, .home-page, .quote-page, .special-page, .compare-consult-page, .quick-consult-page, .special-consult-page, .page-enter) h1,
body:is(.landing-page, .home-page, .quote-page, .special-page, .compare-consult-page, .quick-consult-page, .special-consult-page, .page-enter) h2,
body:is(.landing-page, .home-page, .quote-page, .special-page, .compare-consult-page, .quick-consult-page, .special-consult-page, .page-enter) h3 {
  margin-top: 0;
  color: var(--site-navy, #071a38);
  font-weight: 900;
  text-wrap: balance;
}

body:is(.landing-page, .home-page, .quote-page, .special-page, .compare-consult-page, .quick-consult-page, .special-consult-page, .page-enter) h1 {
  font-size: var(--type-display) !important;
  line-height: var(--leading-display) !important;
  letter-spacing: var(--tracking-display) !important;
}

body:is(.landing-page, .home-page, .quote-page, .special-page, .compare-consult-page, .quick-consult-page, .special-consult-page, .page-enter) h2 {
  font-size: var(--type-title) !important;
  line-height: var(--leading-title) !important;
  letter-spacing: var(--tracking-title) !important;
}

body:is(.landing-page, .home-page, .quote-page, .special-page, .compare-consult-page, .quick-consult-page, .special-consult-page, .page-enter) h3,
body:is(.landing-page, .home-page, .quote-page, .special-page, .compare-consult-page, .quick-consult-page, .special-consult-page, .page-enter) .quick-card strong,
body:is(.landing-page, .home-page, .quote-page, .special-page, .compare-consult-page, .quick-consult-page, .special-consult-page, .page-enter) .feature-row strong {
  font-size: var(--type-card-title) !important;
  line-height: 1.4 !important;
  letter-spacing: -0.022em !important;
}

body:is(.landing-page, .home-page, .quote-page, .special-page, .compare-consult-page, .quick-consult-page, .special-consult-page, .page-enter) p {
  font-size: var(--type-body) !important;
  line-height: var(--leading-body) !important;
  letter-spacing: var(--tracking-body) !important;
  text-wrap: pretty;
}

body:is(.landing-page, .home-page, .quote-page, .special-page, .compare-consult-page, .quick-consult-page, .special-consult-page, .page-enter) :is(button, input, select, textarea, a) {
  letter-spacing: -0.014em;
}

body:is(.landing-page, .home-page, .quote-page, .special-page, .compare-consult-page, .quick-consult-page, .special-consult-page, .page-enter) :is(button, .landing-primary, .landing-secondary, .home-estimate-button, .deal-card > a, .submit-btn) {
  font-size: var(--type-ui) !important;
  line-height: 1.4 !important;
  font-weight: 800;
}

body:is(.landing-page, .home-page, .quote-page, .special-page, .compare-consult-page, .quick-consult-page, .special-consult-page, .page-enter) :is(label, .home-image-field > span, .home-quote-condition > div > span) {
  font-size: var(--type-caption) !important;
  line-height: 1.5 !important;
}

body:is(.landing-page, .home-page, .quote-page, .special-page, .compare-consult-page, .quick-consult-page, .special-consult-page, .page-enter) :is(small, .home-quote-kicker, .landing-trust-pill, .deal-badge, .deal-tags, .preorder-hero-kicker) {
  font-size: var(--type-caption) !important;
  line-height: 1.5 !important;
  letter-spacing: -0.015em !important;
}

body.home-page #specials-preview .deal-slider-shell[data-deal-slider] .deal-card h3 {
  font-size: var(--type-card-title) !important;
  line-height: 1.4 !important;
  letter-spacing: -0.022em !important;
}

body.home-page #specials-preview .deal-slider-shell[data-deal-slider] .deal-card > p {
  font-size: var(--type-caption) !important;
  line-height: 1.55 !important;
  letter-spacing: var(--tracking-body) !important;
}

body.special-page.special-redesign-page .preorder-hero-copy h1 {
  font-size: var(--type-display) !important;
  line-height: var(--leading-display) !important;
  letter-spacing: var(--tracking-display) !important;
}

@media (max-width: 760px) {
  :root {
    --type-display: clamp(30px, 8.4vw, 36px);
    --type-title: clamp(24px, 6.8vw, 28px);
    --type-subtitle: 21px;
    --type-card-title: 17px;
    --type-body: 15px;
    --type-ui: 14px;
    --type-caption: 13px;
    --type-micro: 11px;
    --leading-display: 1.2;
    --leading-title: 1.32;
    --leading-body: 1.68;
  }

  body:is(.landing-page, .home-page, .quote-page, .special-page, .compare-consult-page, .quick-consult-page, .special-consult-page, .page-enter) h1 {
    letter-spacing: -0.04em !important;
  }

  body.home-page #specials-preview .deal-slider-shell[data-deal-slider] .deal-card h3 {
    font-size: 12px !important;
    line-height: 1.35 !important;
  }

  body.home-page #specials-preview .deal-slider-shell[data-deal-slider] .deal-card > p {
    font-size: 10px !important;
    line-height: 1.45 !important;
  }
}