/* Landing hero — one height on all pages. Loaded after per-page CSS. */
:root {
  --site-hero-height: 80vh;
}

.hero,
.ed-hero,
.st-hero,
.pm-hero,
.pf-hero,
.cr-hero,
.kb-hero,
.fb-hero,
.tc-hero,
.dg-hero {
  box-sizing: border-box;
  min-height: var(--site-hero-height);
  height: var(--site-hero-height);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.ed-hero-grid,
.st-hero-grid,
.pm-hero-grid,
.pf-hero-grid,
.cr-hero-grid,
.kb-hero-grid,
.fb-hero-grid,
.tc-hero-body,
.dg-hero-grid,
.hero-content {
  padding-block: 74px 91px;
}

.ed-hero-art,
.st-hero-art,
.pm-art,
.pf-art,
.cr-art,
.kb-art,
.fb-art,
.tc-diagram,
.dg-hero-visual,
.hero .visual {
  min-height: 400px;
}

.pf-art {
  height: auto;
}

@media (max-width: 850px) {
  .hero,
  .ed-hero,
  .st-hero,
  .pm-hero,
  .pf-hero,
  .cr-hero,
  .kb-hero,
  .fb-hero,
  .tc-hero,
  .dg-hero {
    height: auto;
    min-height: var(--site-hero-height);
  }

  .ed-hero-grid,
  .st-hero-grid,
  .pm-hero-grid,
  .pf-hero-grid,
  .cr-hero-grid,
  .kb-hero-grid,
  .fb-hero-grid,
  .tc-hero-body,
  .dg-hero-grid,
  .hero-content {
    padding-block: 55px 70px;
  }
}
