/* Global level-2 and level-3 subpage title spacing fix
   Applies to audience pages, service category pages, and service detail pages. */

/* Top-align page heading + previous/next/navigation row */
.page-lead,
.page-lead > div,
.title-nav-row,
.service-pager,
.service-hero,
.page-hero,
.hero,
.section.alt .page-lead {
  align-items: flex-start !important;
}

/* Make title/navigation row compact and consistent */
.title-nav-row {
  display: flex !important;
  justify-content: space-between !important;
  align-items: flex-start !important;
  gap: 24px !important;
  margin-bottom: 8px !important;
  min-height: 0 !important;
}

/* Remove earlier artificial title-height reservations everywhere */
.title-nav-row h1,
.title-nav-row .h1,
.title-nav-row .h2,
.page-lead h1,
.page-lead .h1,
.page-lead .h2,
.service-page h1,
body[class*="service"] h1,
body[class*="small-business"] h1,
body[class*="home-services"] h1,
.hero h1,
.page-hero h1,
.service-hero h1,
.section.alt h1,
.section.alt .h1,
.section.alt .h2 {
  min-height: 0 !important;
  height: auto !important;
  margin-top: 0 !important;
  margin-bottom: 8px !important;
  padding-bottom: 0 !important;
  line-height: 1.08 !important;
  display: block !important;
}

/* Tighten description underneath heading */
.page-lead p,
.hero p,
.page-hero p,
.service-hero p,
.section.alt .page-lead p {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Tighten the whole top alt section on level-2/level-3 pages */
.section.alt:has(.page-lead),
section.alt:has(.page-lead) {
  padding-top: 42px !important;
  padding-bottom: 34px !important;
}

/* Fallback for browsers without :has support via body/page patterns */
body .section.alt .page-lead {
  margin-bottom: 0 !important;
}

/* Keep the pager aligned with the heading rather than centered vertically */
.service-pager,
.pager,
.page-nav,
.prev-next {
  align-self: flex-start !important;
  margin-top: 2px !important;
}

/* Keep the visual image aligned at top instead of vertically centering against text */
.topic-visual,
.brand-panel,
.hero-visual,
.page-visual {
  align-self: flex-start !important;
}

/* Reduce gap from hero/title area into the main content/cards */
.section.alt + .section,
section.alt + section.section {
  padding-top: 34px !important;
}

/* Level-2 tile pages: tighten heading-to-card grid spacing */
.card-grid,
.tiles,
.service-grid,
.solutions-grid,
.grid.cards {
  margin-top: 18px !important;
}

/* Undo previous fix if it reserved a large block */
:root {
  --sos-service-title-block-height: 0px !important;
}

/* Mobile keeps the same behavior but stacks cleanly */
@media (max-width: 760px) {
  .title-nav-row {
    flex-direction: column !important;
    gap: 12px !important;
  }

  .service-pager,
  .pager,
  .page-nav,
  .prev-next {
    margin-top: 0 !important;
  }

  .section.alt:has(.page-lead),
  section.alt:has(.page-lead) {
    padding-top: 32px !important;
    padding-bottom: 26px !important;
  }

  .section.alt + .section,
  section.alt + section.section {
    padding-top: 26px !important;
  }
}