/* SECTION HEAD, PAGE HEAD, BREADCRUMB — ported from reference/css/components.css (same selectors).
   Shared by several pages, so it loads globally after the buttons, as in the reference. */
.lm-section-head {
  display: flex; align-items: flex-end; justify-content: space-between; gap: var(--wp--preset--spacing--60);
  margin-bottom: var(--wp--preset--spacing--80);
}
.lm-section-head .lm-eyebrow { margin-bottom: var(--wp--preset--spacing--30); }
.lm-section-head__hint {
  font-family: var(--wp--preset--font-family--body);
  font-size: var(--wp--preset--font-size--medium); font-weight: var(--wp--custom--font-weight--regular);
  letter-spacing: var(--wp--custom--letter-spacing--normal); color: var(--wp--preset--color--muted);
  margin-left: var(--wp--preset--spacing--20);
}
.lm-section-head__link { flex-shrink: 0; padding-bottom: var(--wp--preset--spacing--10); }
/* core/buttons wraps the link in two divs; the reference's rules need it as the head's flex item (front end only:
   in the editor the wrappers are the block boxes). */
:where(body:not(.editor-styles-wrapper)) .lm-section-head > .wp-block-buttons,
:where(body:not(.editor-styles-wrapper)) .lm-section-head > .wp-block-buttons > .wp-block-button { display: contents; }

.lm-page-head { padding-top: var(--wp--preset--spacing--100); padding-bottom: var(--wp--preset--spacing--70); }
.lm-page-head__inner { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--wp--preset--spacing--80); flex-wrap: wrap; }
.lm-page-head .lm-eyebrow { margin-bottom: var(--wp--preset--spacing--40); }
.lm-page-head__intro {
  max-width: 560px; margin-top: var(--wp--preset--spacing--50);
  font-size: var(--wp--preset--font-size--lead); color: var(--wp--preset--color--secondary);
}
.lm-page-head__aside { color: var(--wp--preset--color--muted); }

.lm-breadcrumb { display: flex; flex-wrap: wrap; gap: var(--wp--preset--spacing--20); font-size: var(--wp--preset--font-size--ui); color: var(--wp--preset--color--muted); }
.lm-breadcrumb li + li::before { content: "/"; margin-right: var(--wp--preset--spacing--20); color: var(--wp--preset--color--faint); }
.lm-breadcrumb a:hover { color: var(--wp--preset--color--contrast); }
.lm-breadcrumb [aria-current] { color: var(--wp--preset--color--secondary); }

@media (max-width: 1023px) {
  .lm-section-head { margin-bottom: var(--wp--preset--spacing--70); }
  .lm-page-head { padding-top: var(--wp--preset--spacing--90); padding-bottom: var(--wp--preset--spacing--60); }
}
@media (max-width: 639px) {
  .lm-section-head { margin-bottom: var(--wp--preset--spacing--60); }
  .lm-section-head__hint { display: block; margin-left: 0; margin-top: var(--wp--preset--spacing--20); font-size: var(--wp--preset--font-size--ui); }
  .lm-page-head { padding-top: var(--wp--preset--spacing--80); }
  .lm-page-head__inner { gap: var(--wp--preset--spacing--40); }
  .lm-page-head__intro { font-size: var(--wp--preset--font-size--medium); }
}