/* Shared heading scale: strong hierarchy without oversized, space-hungry titles. */
:root {
  --bb-title-display: clamp(40px, 4.2vw, 58px);
  --bb-title-section: clamp(30px, 3vw, 42px);
  --bb-title-feature: clamp(28px, 2.6vw, 38px);
  --bb-title-dialog: clamp(27px, 2.4vw, 35px);
  --bb-title-card: clamp(19px, 1.7vw, 24px);
  --bb-title-tracking: -.035em;
}

h1,
h2,
h3 {
  text-wrap: balance;
}

/* Homepage display title */
.find-size-ribbon h2,
.bb-smart-routing-hero h1 {
  font-size: var(--bb-title-display) !important;
  line-height: 1.02 !important;
  letter-spacing: -.045em !important;
}

/* Main section titles */
.section-heading h2,
.knowledge-heading h2,
.profile-copy h2,
.final-cta h2 {
  font-size: var(--bb-title-section) !important;
  line-height: 1.12 !important;
  letter-spacing: var(--bb-title-tracking) !important;
}

.section-heading h2,
.knowledge-heading h2 {
  margin-block: 14px !important;
}

/* Feature and embedded panel titles */
.shape-feature h3,
.shape-form-panel h2,
.shape-result-top h2,
.profile-manager-shell h2,
.profile-form h3,
.auth-intro h2,
.logged-panel h2 {
  font-size: var(--bb-title-feature) !important;
  line-height: 1.14 !important;
  letter-spacing: var(--bb-title-tracking) !important;
}

/* Dialogs, wizard steps and result screens */
.modal h2,
#wizard .wizard-page h2,
#wizard .result-header h2 {
  max-width: calc(100% - 54px);
  margin: 11px 0 9px !important;
  font-size: var(--bb-title-dialog) !important;
  line-height: 1.15 !important;
  letter-spacing: var(--bb-title-tracking) !important;
}

.modal-intro,
#wizard .wizard-page > p {
  max-width: 66ch;
}

/* Dashboard and share views */
.topbar h1,
.view-heading h2,
.welcome-card h2 {
  font-size: var(--bb-title-feature) !important;
  line-height: 1.14 !important;
  letter-spacing: var(--bb-title-tracking) !important;
}

.share-card h1 {
  font-size: var(--bb-title-dialog) !important;
  line-height: 1.12 !important;
  letter-spacing: var(--bb-title-tracking) !important;
}

@media (max-width: 760px) {
  :root {
    --bb-title-display: clamp(36px, 10vw, 44px);
    --bb-title-section: clamp(28px, 8vw, 35px);
    --bb-title-feature: clamp(25px, 7vw, 31px);
    --bb-title-dialog: clamp(24px, 7vw, 29px);
    --bb-title-card: 19px;
  }

  .find-size-ribbon h2,
  .bb-smart-routing-hero h1 {
    font-size: var(--bb-title-display) !important;
  }

  .modal h2,
  #wizard .wizard-page h2,
  #wizard .result-header h2 {
    max-width: calc(100% - 42px);
  }
}
