/* Local typography layer for the autonomous air-conditioner page. */
body.conditioners-page {
  --conditioners-ui-font: -apple-system, BlinkMacSystemFont, system-ui, Inter, "Helvetica Neue", Arial, sans-serif;
  --service-font-body: var(--conditioners-ui-font);
  --service-font-display: var(--conditioners-ui-font);
  --font-body: var(--conditioners-ui-font);
  --font-display: var(--conditioners-ui-font);
  --catalog-card-data-font: var(--conditioners-ui-font);
  font-family: var(--conditioners-ui-font);
}

body.conditioners-page :is(.skip-link, .shared-footer__title, .utp-cookie-panel, .utp-cookie-panel *) {
  font-family: var(--conditioners-ui-font) !important;
}

body.conditioners-page :is(header, #main, footer, #product-dialog, #callback-dialog, #login-dialog)
  :is(h1, h2, h3, h4, p, a, button, label, input, select, textarea, summary, li, dt, dd, strong, small, em, span) {
  font-family: var(--conditioners-ui-font) !important;
}

/* Match the route's more specific legacy font contracts. */
body.conditioners-page #main #heaters-catalog :is(.catalog-card__type, .catalog-card h3, .catalog-card__specs dt, .catalog-card__specs dd, .catalog-card__order, .catalog-card__details, .heaters-catalog__more-button),
body.conditioners-page #main #installation :is(.estimate-card__head, .estimate-form, .field label, .field input, .field select, .field option, .field textarea, .consent, .consent span, .consent a, .consent-note, .consent-note a, .estimate-submit),
body.conditioners-page .conditioners-catalog-product-modal :is(h2, h3, p, a, button, span, dt, dd),
body.conditioners-page .conditioners-catalog-product-modal .product-dialog__kicker {
  font-family: var(--conditioners-ui-font) !important;
}

/* Main section titles only; card and utility headings keep their own scale. */
body.conditioners-page #main :is(
  #heaters-choice-title,
  #heaters-catalog-title,
  #price-match-title,
  #conditioners-workflow-title,
  #installation-title,
  #conditioner-maintenance-title,
  #faq-title
) {
  font-size: 40px !important;
  font-weight: 600;
  line-height: 44px !important;
}

body.conditioners-page #main .era-hero.heaters-hero .era-hero__copy h1#heaters-hero-title {
  font-size: 52px !important;
  font-weight: 600 !important;
  line-height: 56px !important;
}

body.conditioners-page #main :is(
  #heaters-hero-title,
  #heaters-choice-title,
  #heaters-catalog-title,
  #price-match-title,
  #conditioners-workflow-title,
  #installation-title,
  #conditioner-maintenance-title,
  #faq-title
) span {
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  letter-spacing: inherit;
}

body.conditioners-page #main :is(.era-hero__lead, .heaters-choice__lead, .heaters-choice__check, .section-intro, .era-registration__lead, .price-copy__proof, .conditioner-maintenance__lead, .conditioner-maintenance__body p) :is(strong, b, em) {
  display: inline;
  font-size: inherit;
  line-height: inherit;
}

body.conditioners-page #main :is(.era-hero__lead, .heaters-choice__lead, .heaters-choice__check, .heaters-catalog__description, .heaters-catalog__intro, .section-intro, .era-registration__lead, .price-copy__proof, .estimate-card__head p, .conditioner-maintenance__lead, .conditioner-maintenance__body p, .faq-panel__note, .faq-answer__inner p, [data-faq-support-copy]) {
  font-size: 17px;
  font-weight: 400;
  line-height: 25px;
}

body.conditioners-page #main :is(.button, .heaters-catalog__more-button, .catalog-card__order, .catalog-card__details, .price-travel-link, .heater-blog-selection__card a, .estimate-submit) {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.29;
}

body.conditioners-page #main :is(.messenger-switch__action, .messenger-switch__label, .price-match__cta) {
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.29 !important;
}

body.conditioners-page #main .heaters-hero .era-hero__proof {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

body.conditioners-page #main .heaters-hero .era-hero__proof :is(dt, dd) {
  font-family: var(--conditioners-ui-font) !important;
  color: #fff;
}

body.conditioners-page #main .heaters-hero .era-hero__lead,
body.conditioners-page #main #price-match .price-match__copy > p {
  color: #fff;
}

body.conditioners-page #main #price-match .price-match__copy > p {
  font-size: 17px;
  font-weight: 400;
  line-height: 25px;
}

body.conditioners-page #main :is(.heaters-hero__heading, #included .included-aside, #installation .era-installation__intro) > .eyebrow,
body.conditioners-page #main #installation .era-installation__intro > .era-eyebrow {
  font-size: 12px;
}

/* Neutral copy on light surfaces; section labels and inline fill effects keep their own colors. */
body.conditioners-page #main :is(
  #heaters-choice-title,
  #heaters-catalog-title,
  #conditioners-workflow-title,
  #installation-title,
  #conditioner-maintenance-title,
  #faq-title
),
body.conditioners-page #main #conditioner-maintenance .conditioner-maintenance__copy h3,
body.conditioners-page #main #installation .estimate-card__head h3,
body.conditioners-page #main #installation :is(.price-copy__proof, .estimate-card__head p, .era-installation__intro > p, .era-installation__checklist p, .era-installation__geo-copy p),
body.conditioners-page #main #included :is(.section-intro, .era-registration__lead, .work-item h3, .work-item p),
body.conditioners-page #main #conditioner-maintenance :is(.conditioner-maintenance__lead, .conditioner-maintenance__body p),
body.conditioners-page #main #heaters-catalog :is(.heaters-catalog__intro, .heaters-catalog__description),
body.conditioners-page #main #choice :is(.heaters-choice__lead, .heaters-choice__check),
body.conditioners-page #main #faq :is(.faq-panel__note, #faq-support-title),
body.conditioners-page #main #faq .faq-item:not(.is-open) :is(.faq-summary, .faq-question) {
  color: #1d1d1f;
}

body.conditioners-page #main #faq .faq-item.is-open :is(.faq-summary, .faq-question, .faq-answer__inner p, .faq-related a) {
  color: #fff;
}

body.conditioners-page #main #price-match-title {
  color: #fff;
}

body.conditioners-page #main #installation.compact-estimate-section .estimate-card__head h3 {
  color: #1d1d1f !important;
}

/* The installed-equipment and related-service blocks stay visually compact. */
body.conditioners-page #main #conditioner-maintenance .conditioner-maintenance__copy h3,
body.conditioners-page #main #faq #faq-support-title {
  font-size: 20px !important;
  font-weight: 600;
  line-height: 25px !important;
}

/* Meaningful section H3s follow the heater page scale; FAQ questions stay compact. */
body.conditioners-page #main #included .work-item h3,
body.conditioners-page #main #heaters-catalog .catalog-card h3,
body.conditioners-page #main #installation .estimate-card__head h3 {
  font-size: 24px !important;
  font-weight: 600;
  line-height: 28px !important;
}

body.conditioners-page #main #included .work-item h3,
body.conditioners-page #main #heaters-catalog .catalog-card h3 {
  color: #1d1d1f;
}

body.conditioners-page #main #related-services .section-intro {
  font-size: 18px;
  font-weight: 400;
  line-height: 1.58;
}

body.conditioners-page #main #conditioners-related-title {
  font-size: 18px;
  font-weight: 600;
  line-height: 24px;
  letter-spacing: 0;
}

body.conditioners-page #main #related-services .related-card h3 {
  font-size: 20px;
  font-weight: 600;
  line-height: 25px;
}

body.conditioners-page #main #related-services .related-card p {
  font-size: 13px;
  font-weight: 400;
  line-height: 19.5px;
}

body.conditioners-page #main #related-services .related-card:not(:hover):not(:focus-visible) p {
  color: #1d1d1f;
}

body.conditioners-page #main #related-services .related-card__index {
  font-size: 10px;
}

body.conditioners-page #main #related-services .related-card__link {
  font-size: 12px;
  font-weight: 600;
}

/* Keep existing featured-card colors and ensure readable type over its dark fill. */
body.conditioners-page #main #heaters-catalog .catalog-card--featured :is(.catalog-card__type, h3, .catalog-card__specs dt, .catalog-card__specs dd) {
  color: #fff;
}

body.conditioners-page #main #related-services .related-card:is(:hover, :focus-visible) :is(h3, p, .related-card__link) {
  color: #fff;
}

/* Dialogs use the compact heater-page scale, outside the main section H2 scale. */
body.conditioners-page #callback-dialog #callback-title,
body.conditioners-page #login-dialog #login-title {
  color: #1d1d1f;
  font-size: 24px !important;
  font-weight: 600;
  line-height: 28px !important;
}

body.conditioners-page #callback-dialog #callback-description {
  color: #1d1d1f;
  font-size: 17px;
  font-weight: 400;
  line-height: 25px;
}

body.conditioners-page #callback-dialog .callback-submit,
body.conditioners-page #login-dialog button[type="submit"] {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.29;
}

@media (max-width: 1068px) {
  body.conditioners-page #callback-dialog #callback-title,
  body.conditioners-page #login-dialog #login-title {
    font-size: 21px !important;
    line-height: 25px !important;
  }
}

@media (min-width: 735px) and (max-width: 1068px) {
  body.conditioners-page #main .era-hero.heaters-hero .era-hero__copy h1#heaters-hero-title {
    font-size: 44px !important;
    line-height: 48px !important;
  }

  body.conditioners-page #main :is(
    #heaters-choice-title,
    #heaters-catalog-title,
    #price-match-title,
    #conditioners-workflow-title,
    #installation-title,
    #conditioner-maintenance-title,
    #faq-title
  ) {
    font-size: 32px !important;
    line-height: 36px !important;
  }

  body.conditioners-page #main :is(#heaters-choice-title, #heaters-catalog-title, #price-match-title, #conditioners-workflow-title, #installation-title, #conditioner-maintenance-title, #faq-title) {
    letter-spacing: .004em;
  }

  body.conditioners-page #main #included .work-item h3,
  body.conditioners-page #main #heaters-catalog .catalog-card h3,
  body.conditioners-page #main #installation .estimate-card__head h3 {
    font-size: 21px !important;
    line-height: 25px !important;
  }

}

@media (max-width: 900px) {
  body.conditioners-page #main #related-services .related-card h3 {
    font-size: 17px;
    line-height: 21.25px;
  }

  body.conditioners-page #main #related-services .related-card p {
    font-size: 12.5px;
    line-height: 18.75px;
  }
}

@media (max-width: 734px) {
  body.conditioners-page #main .era-hero.heaters-hero .era-hero__copy h1#heaters-hero-title {
    font-size: 32px !important;
    line-height: 36px !important;
  }

  body.conditioners-page #main :is(
    #heaters-choice-title,
    #heaters-catalog-title,
    #price-match-title,
    #conditioners-workflow-title,
    #installation-title,
    #conditioner-maintenance-title,
    #faq-title
  ) {
    font-size: 28px !important;
    line-height: 32px !important;
    letter-spacing: .007em;
  }

  body.conditioners-page #main .heaters-hero .era-hero__proof {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.conditioners-page #main #included .work-item h3,
  body.conditioners-page #main #heaters-catalog .catalog-card h3,
  body.conditioners-page #main #installation .estimate-card__head h3 {
    font-size: 21px !important;
    line-height: 25px !important;
  }

  body.conditioners-page #main #related-services .section-intro {
    font-size: 15px;
    line-height: 1.55;
  }
}

@media (max-width: 600px) {
  body.conditioners-page #main .heaters-hero .era-hero__proof div {
    grid-template-columns: minmax(0, 1fr);
    gap: 4px;
  }

  body.conditioners-page #main .heaters-hero .era-hero__proof dt {
    font-size: 16px;
  }
}