/* Keep page introductions in normal flow, below the fixed site navigation. */
:root {
  --df-header-height: 78px;
  --df-admin-offset: 0px;
}
@media (min-width: 768px) {
  :root { --df-header-height: 114px; }
}
body.admin-bar { --df-admin-offset: 32px; }
@media (max-width: 782px) {
  body.admin-bar { --df-admin-offset: 46px; }
}
html { scroll-padding-top: 110px; }
main section[id] { scroll-margin-top: calc(102px + var(--df-admin-offset)); }
#subnav { top: calc(78px + var(--df-admin-offset)); }

/* The background fills the section; the text determines its minimum height. */
[data-hero]:not(#heroSlider) {
  display: grid;
  min-height: max(38rem, 78svh);
  isolation: isolate;
}
[data-hero]:not(#heroSlider) > .slot {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  min-height: 0;
  z-index: -1;
}
[data-hero]:not(#heroSlider) > .absolute {
  position: relative;
  inset: auto;
  padding-top: calc(var(--df-header-height) + var(--df-admin-offset) + clamp(2.5rem, 4vw, 4rem));
}
[data-hero]:not(#heroSlider) h1 {
  max-width: 20ch;
  font-size: clamp(2.5rem, 4.5vw, 4.5rem);
  line-height: 1.12;
  letter-spacing: -.025em;
}
[data-hero]:not(#heroSlider) [aria-label="Breadcrumb"] { margin-bottom: 2rem; }
[data-hero]:not(#heroSlider) h1 + p {
  margin-top: 1.75rem;
  line-height: 1.65;
}

/* All slides share a grid cell so the tallest slide reserves enough room. */
#heroSlider {
  display: grid;
  height: auto;
  min-height: max(44rem, 100svh);
  isolation: isolate;
}
#heroSlider > .hs {
  position: relative;
  inset: auto;
  grid-area: 1 / 1;
  display: flex;
  min-width: 0;
  min-height: inherit;
}
#heroSlider > .hs > .slot {
  position: absolute;
  inset: 0;
  z-index: -1;
}
#heroSlider > .hs > .absolute {
  position: relative;
  inset: auto;
  width: 100%;
  padding-top: calc(var(--df-header-height) + var(--df-admin-offset) + 3rem);
  padding-bottom: 9rem;
}
#heroSlider > .hs > .absolute > .mx-auto { padding-top: 0; }
#heroSlider h1 {
  max-width: 18ch;
  font-size: clamp(2.6rem, 5.8vw, 5.75rem);
  line-height: 1.1;
}
@media (max-width: 639px) {
  [data-hero]:not(#heroSlider) { min-height: 34rem; }
  [data-hero]:not(#heroSlider) > .absolute {
    padding-top: calc(var(--df-header-height) + var(--df-admin-offset) + 2.5rem);
  }
  [data-hero]:not(#heroSlider) [aria-label="Breadcrumb"] { margin-bottom: 1.5rem; }
  [data-hero]:not(#heroSlider) h1 { margin-top: 1.25rem; }
  #heroSlider > .hs > .absolute {
    padding-top: calc(var(--df-header-height) + var(--df-admin-offset) + 2.5rem);
    padding-bottom: 7rem;
  }
  #heroSlider h1 { font-size: clamp(2.35rem, 9.5vw, 3.5rem); }
}