/* Shared storefront page headings. Not form/section headings, dialog titles or print output.
   Keep layout visibility/position rules (especially hidden catalog h1s) in their owners. */
@media screen {
  :root {
    --lea-page-title-font: var(--lea-font-ui, "Manrope", sans-serif);
    --lea-page-title-size: clamp(24px, 2.1vw, 28px);
    --lea-page-title-weight: 600;
    --lea-page-title-line-height: 1.4;
    --lea-page-title-ink: #183b6b;
    --lea-page-title-accent: var(--accent-blue-color, #c69214);
    --lea-page-title-rule-width: 44px;
    --lea-page-title-rule-height: 1px;
    --lea-page-title-rule-color: color-mix(in srgb, var(--lea-page-title-accent) 75%, transparent);
  }

  .master-wrapper-content .page > .page-title {
    min-height: 0;
    margin: 0 0 24px;
    padding: 16px 12px 12px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    text-align: center;
  }

  .lea-header-shell-enabled .page > .page-title:first-child {
    margin-top: 0;
  }

  .master-wrapper-content .page > .page-title > :is(h1, h2) {
    margin: 0;
    padding: 0;
    border: 0;
    float: none;
    color: var(--lea-page-title-ink);
    font-family: var(--lea-page-title-font);
    font-size: var(--lea-page-title-size);
    font-weight: var(--lea-page-title-weight);
    line-height: var(--lea-page-title-line-height);
    letter-spacing: -.015em;
    text-align: center;
    text-transform: none;
    white-space: normal;
    overflow-wrap: anywhere;
    text-wrap: balance;
  }

  /* One decorative rule for page headings and the scrolling gallery caption.
     A background keeps the caption height and horizontal swipe unchanged. */
  .master-wrapper-content .page > .page-title::after,
  .lea-attribute-gallery-description {
    background-image: linear-gradient(var(--lea-page-title-rule-color), var(--lea-page-title-rule-color));
    background-size: var(--lea-page-title-rule-width) var(--lea-page-title-rule-height);
    background-position: center bottom;
    background-repeat: no-repeat;
  }

  .master-wrapper-content .page > .page-title::after {
    content: "";
    display: block;
    clear: both;
    width: var(--lea-page-title-rule-width);
    height: var(--lea-page-title-rule-height);
    margin: 12px auto 0;
  }

  .master-wrapper-content .page > .page-title > .link-rss {
    position: absolute;
    inset-inline-end: 12px;
    top: 18px;
    margin: 0;
  }
  .master-wrapper-content .page > .page-title > .link-rss + h1 { padding-inline: 36px; }

  /* Article headlines retain the existing editorial font, not a separate title box. */
  .blogpost-page {
    --lea-page-title-font: "Trirong", Georgia, serif;
    --lea-page-title-size: clamp(24px, 2.1vw, 30px);
    --lea-page-title-line-height: 1.5;
  }
}

@media screen and (max-width: 768px) {
  :root {
    --lea-page-title-size: 22px;
    --lea-page-title-line-height: 1.45;
    --lea-page-title-rule-width: 36px;
  }
  .master-wrapper-content .page > .page-title {
    margin-bottom: 18px;
    padding: 14px 8px 10px;
  }
  .master-wrapper-content .page > .page-title::after { margin-top: 10px; }
  .blogpost-page { --lea-page-title-size: 24px; }
}

/* The caption separator belongs only to the mobile scrolling layout. */
@media screen and (min-width: 1001px) {
  .lea-attribute-gallery-description { background-image: none; }
}