/**
 * Liquid Beauty canonical heading system.
 *
 * One exact typographic contract per semantic heading and breakpoint. The
 * deliberately strong specificity anchor lets this final layer supersede old
 * page-builder and template font declarations, including legacy !important
 * rules, without taking ownership of colour, alignment, width or spacing.
 */

:root {
  --lb-heading-font: "Marcellus", Georgia, serif;
  --lb-heading-weight: 400;
  --lb-heading-h1-size: 56px;
  --lb-heading-h1-line: 1.04;
  --lb-heading-h2-size: 50px;
  --lb-heading-h2-line: 1.05;
  --lb-heading-h3-size: 27px;
  --lb-heading-h3-line: 1.15;
  --lb-heading-h4-size: 21px;
  --lb-heading-h4-line: 1.2;
  --lb-heading-h5-size: 18px;
  --lb-heading-h5-line: 1.25;
  --lb-heading-h6-size: 16px;
  --lb-heading-h6-line: 1.3;
}

/*
 * :is() adopts the specificity of its strongest argument. The impossible ID
 * alternative is only a specificity anchor; the `body` alternative is the one
 * that matches. This keeps a single, documented global source of truth even
 * when an older page stylesheet contains a highly specific !important rule.
 */
html body.lb-site:is(body, #lb-heading-system#lb-heading-system#lb-heading-system#lb-heading-system) :is(h1, h2, h3, h4, h5, h6) {
  font-family: var(--lb-heading-font) !important;
  font-weight: var(--lb-heading-weight) !important;
  font-style: normal !important;
  text-transform: none !important;
}

html body.lb-site:is(body, #lb-heading-system#lb-heading-system#lb-heading-system#lb-heading-system) h1 {
  font-size: var(--lb-heading-h1-size) !important;
  line-height: var(--lb-heading-h1-line) !important;
  letter-spacing: -.035em !important;
}

html body.lb-site:is(body, #lb-heading-system#lb-heading-system#lb-heading-system#lb-heading-system) h2 {
  font-size: var(--lb-heading-h2-size) !important;
  line-height: var(--lb-heading-h2-line) !important;
  letter-spacing: -.035em !important;
}

html body.lb-site:is(body, #lb-heading-system#lb-heading-system#lb-heading-system#lb-heading-system) h3 {
  font-size: var(--lb-heading-h3-size) !important;
  line-height: var(--lb-heading-h3-line) !important;
  letter-spacing: -.025em !important;
}

html body.lb-site:is(body, #lb-heading-system#lb-heading-system#lb-heading-system#lb-heading-system) h4 {
  font-size: var(--lb-heading-h4-size) !important;
  line-height: var(--lb-heading-h4-line) !important;
  letter-spacing: -.015em !important;
}

html body.lb-site:is(body, #lb-heading-system#lb-heading-system#lb-heading-system#lb-heading-system) h5 {
  font-size: var(--lb-heading-h5-size) !important;
  line-height: var(--lb-heading-h5-line) !important;
  letter-spacing: -.015em !important;
}

html body.lb-site:is(body, #lb-heading-system#lb-heading-system#lb-heading-system#lb-heading-system) h6 {
  font-size: var(--lb-heading-h6-size) !important;
  line-height: var(--lb-heading-h6-line) !important;
  letter-spacing: -.015em !important;
}

/*
 * Nested editor markup may carry its own legacy typography. It inherits the
 * canonical heading signature while retaining contextual colour and emphasis.
 */
html body.lb-site:is(body, #lb-heading-system#lb-heading-system#lb-heading-system#lb-heading-system) :is(h1, h2, h3, h4, h5, h6) * {
  font-family: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  font-style: inherit !important;
  line-height: inherit !important;
  letter-spacing: inherit !important;
  text-transform: inherit !important;
}

/* Navigation/footer micro-labels are utility copy, not document headings. */
html body.lb-site .lb-header .lb-mega-menu__heading {
  margin: 0;
  color: #211f1d;
  font: 700 10px/1.2 Montserrat, Arial, sans-serif;
  letter-spacing: .12em;
  text-transform: uppercase;
}

html body.lb-site .lb-footer .lb-footer__label {
  max-width: none;
  margin: 0 0 18px;
  color: #fff;
  font: 700 10px/1.2 Montserrat, Arial, sans-serif;
  letter-spacing: .11em;
  text-transform: uppercase;
}

/* Tablet: one fixed size per heading through the Divi 980px breakpoint. */
@media screen and (max-width: 980px) {
  :root {
    --lb-heading-h1-size: 52px;
    --lb-heading-h1-line: 1.04;
    --lb-heading-h2-size: 42px;
    --lb-heading-h2-line: 1.08;
    --lb-heading-h3-size: 26px;
    --lb-heading-h3-line: 1.16;
    --lb-heading-h4-size: 20px;
    --lb-heading-h4-line: 1.22;
    --lb-heading-h5-size: 18px;
    --lb-heading-h5-line: 1.28;
    --lb-heading-h6-size: 16px;
    --lb-heading-h6-line: 1.32;
  }
}

/* Mobile: one fixed size per heading through 767px. */
@media screen and (max-width: 767px) {
  :root {
    --lb-heading-h1-size: 45px;
    --lb-heading-h1-line: 1.04;
    --lb-heading-h2-size: 34px;
    --lb-heading-h2-line: 1.08;
    --lb-heading-h3-size: 24px;
    --lb-heading-h3-line: 1.18;
    --lb-heading-h4-size: 20px;
    --lb-heading-h4-line: 1.22;
    --lb-heading-h5-size: 18px;
    --lb-heading-h5-line: 1.28;
    --lb-heading-h6-size: 16px;
    --lb-heading-h6-line: 1.32;
  }
}