html[data-embed="site"] {
  color-scheme: dark;
}

html[data-embed="site"],
html[data-embed="site"] body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}

html[data-embed="site"] body {
  min-height: auto;
}

html[data-embed="site"] .progress-bar,
html[data-embed="site"] [data-theme-toggle],
html[data-embed="site"] .theme-toggle,
html[data-embed="site"] .header__theme-toggle,
html[data-embed="site"] nav.fixed.top-0 [data-testid="theme-toggle"] {
  display: none !important;
}

html[data-embed="site"] .site-header,
html[data-embed="site"] .header,
html[data-embed="site"] nav.fixed.top-0 {
  position: sticky;
  top: 0 !important;
}

html[data-embed="site"] .site-header--hidden,
html[data-embed="site"] .header--hidden {
  transform: none !important;
}

html[data-embed="site"] .hero {
  min-height: auto !important;
  align-items: start !important;
  justify-content: start !important;
}

html[data-embed="site"] .hero:has(.hero-visual),
html[data-embed="site"] .hero:has(.hero-diagram) {
  grid-template-columns: minmax(0, 1fr) !important;
}

html[data-embed="site"] .desktop-only {
  display: none;
}

html[data-embed="site"] .site-header {
  backdrop-filter: none;
}

html[data-embed="site"] .header,
html[data-embed="site"] .site-header {
  backdrop-filter: none;
}

html[data-embed="site"] .hero::before {
  opacity: 0.35;
}

html[data-embed="site"] .hero-text,
html[data-embed="site"] .hero-copy,
html[data-embed="site"] .hero__content {
  min-width: 0;
  justify-self: start;
}

html[data-embed="site"] .hero-cta,
html[data-embed="site"] .btn,
html[data-embed="site"] .hero__nav-btn,
html[data-embed="site"] .header__nav-btn,
html[data-embed="site"] .pill {
  transition-duration: 120ms;
}

html[data-embed="site"] .nav-inner,
html[data-embed="site"] .header-inner,
html[data-embed="site"] .header__inner,
html[data-embed="site"] nav.fixed.top-0 > div {
  padding-top: 1rem !important;
  padding-bottom: 1rem !important;
}

html[data-embed="site"] .nav-links,
html[data-embed="site"] .header-nav,
html[data-embed="site"] .header__nav {
  gap: 0.8rem;
}

html[data-embed="site"] .header-nav,
html[data-embed="site"] .nav-links,
html[data-embed="site"] nav.fixed.top-0 > div > div {
  overflow-x: auto;
  scrollbar-width: none;
}

html[data-embed="site"] .header-nav::-webkit-scrollbar,
html[data-embed="site"] .nav-links::-webkit-scrollbar,
html[data-embed="site"] nav.fixed.top-0 > div > div::-webkit-scrollbar {
  display: none;
}

html[data-embed="site"] nav.fixed.top-0 {
  height: auto !important;
  transform: none !important;
}

html[data-embed="site"] nav.fixed.top-0 > div {
  min-width: 0 !important;
  padding-left: 0.75rem !important;
  padding-right: 0.75rem !important;
}

html[data-embed="site"] nav.fixed.top-0 [data-testid^="nav-"] {
  flex: 0 0 auto !important;
  padding-left: 0.65rem !important;
  padding-right: 0.65rem !important;
  white-space: nowrap !important;
}

html[data-embed="site"] main.pt-12 {
  padding-top: 0 !important;
}

html[data-embed="site"] .hero-badge,
html[data-embed="site"] .hero__label,
html[data-embed="site"] .hero-eyebrow {
  margin-bottom: 1rem !important;
}

html[data-embed="site"] .hero-subtitle,
html[data-embed="site"] .hero__sub,
html[data-embed="site"] .hero-sub {
  margin-top: 1rem !important;
  margin-bottom: 0 !important;
}

html[data-embed="site"] .hero-cta,
html[data-embed="site"] .hero-cta-row,
html[data-embed="site"] .hero-stats,
html[data-embed="site"] .hero__stats {
  margin-top: 1.4rem !important;
}

html[data-embed="site"] .hero-cta-row {
  margin-bottom: 1rem !important;
}

html[data-embed="site"] .hero {
  padding: 2.4rem 2rem 1.8rem !important;
}

html[data-embed="site"] .hero-inner {
  gap: 2rem !important;
}

html[data-embed="site"] .hero-title {
  font-size: clamp(2.6rem, 1.4rem + 4.2vw, 5rem) !important;
  line-height: 1.02 !important;
}

html[data-embed="site"] .hero__heading {
  font-size: clamp(2.8rem, 1.8rem + 3vw, 4.8rem) !important;
  line-height: 1.04 !important;
  margin-bottom: 1.2rem !important;
}

html[data-embed="site"] .hero-subtitle,
html[data-embed="site"] .hero__sub,
html[data-embed="site"] .hero-sub {
  font-size: clamp(1.5rem, 1.1rem + 0.7vw, 1.8rem) !important;
  line-height: 1.55 !important;
  max-width: 46ch !important;
}

html[data-embed="site"] .hero-visual,
html[data-embed="site"] .hero-diagram {
  display: none !important;
}

html[data-embed="site"] .hero-inner {
  grid-template-columns: minmax(0, 1fr) !important;
  align-items: start !important;
}

html[data-embed="site"] .hero-cta {
  margin-top: 1.5rem !important;
}

html[data-embed="site"] .hero__stats,
html[data-embed="site"] .hero-stats {
  gap: 1.6rem !important;
}

html[data-embed="site"] .hero-stats .stat,
html[data-embed="site"] .hero__stat {
  min-width: 0;
}

html[data-embed="site"] .stats-bar {
  padding-top: 1.4rem !important;
  gap: 1rem !important;
}

html[data-embed="site"] .filters-bar {
  padding-top: 1rem !important;
  padding-bottom: 1rem !important;
}

html[data-embed="site"] #map {
  height: min(64vh, 58rem) !important;
  min-height: 42rem !important;
}

html[data-embed="site"] .overview {
  padding-top: 0 !important;
}

html[data-embed="site"] .overview__inner {
  grid-template-columns: 1fr !important;
}

html[data-embed="site"] .overview__copy {
  padding: 2rem !important;
}

html[data-embed="site"] .cards-section,
html[data-embed="site"] .timeline-section,
html[data-embed="site"] .viz-section,
html[data-embed="site"] .overview,
html[data-embed="site"] .filters,
html[data-embed="site"] .main,
html[data-embed="site"] .legend-section,
html[data-embed="site"] .data-table-section {
  scroll-margin-top: 6rem;
}

@media (max-height: 820px) {
  html[data-embed="site"] .hero {
    padding-top: 1.8rem !important;
    padding-bottom: 1.5rem !important;
  }

  html[data-embed="site"] .hero-title {
    font-size: clamp(2.2rem, 1.2rem + 3.6vw, 4.2rem) !important;
  }

  html[data-embed="site"] .hero__heading {
    font-size: clamp(2.4rem, 1.5rem + 2.8vw, 4rem) !important;
  }

  html[data-embed="site"] .hero-subtitle,
  html[data-embed="site"] .hero__sub,
  html[data-embed="site"] .hero-sub {
    font-size: 1.4rem !important;
  }

  html[data-embed="site"] .hero__stats,
  html[data-embed="site"] .hero-stats {
    margin-top: 1rem !important;
    gap: 1.2rem !important;
  }

  html[data-embed="site"] .hero-stats {
    flex-wrap: wrap;
  }

  html[data-embed="site"] .stats-bar {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 520px) {
  html[data-embed="site"] nav.fixed.top-0 [data-testid^="nav-"] {
    font-size: 11px !important;
  }
}
