/* page-impact.css — converted from impact.module.css
   CSS-module local names become `p-impact_<name>`; globals from globals.css keep
   their names. */

.p-impact_impactHero {
  width: 100%;
  height: 140svh;
  background: var(--color-dark-charcoal);
  color: var(--color-text);
  display: flex;
  flex-direction: column;
}

.p-impact_impactHeroInner {
  flex: 0.5;
  min-height: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding-bottom: 3rem;
}

.p-impact_impactHeroCols {
  align-items: end;
  width: 100%;
}

.p-impact_impactHeroMedia {
  position: relative;
  flex: 1;
  min-height: 0;
  width: 100%;
  overflow: hidden;
}

.p-impact_impactInfo {
  width: 100%;
  background: var(--color-dark-charcoal);
  color: var(--color-text);
  border-top: 1px solid var(--color-medium-grey);
}

.p-impact_impactInfoInner {
  padding-block: var(--space-4xl);
}

.p-impact_impactInfoHeader {
  position: relative;
  align-items: start;
  padding-bottom: 14rem;
}

.p-impact_impactInfoHeader::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 100%;
  height: 1px;
  transform: translateX(-50%);
  background-color: var(--color-medium-grey);
}

.p-impact_impactInfoHeader h2 {
  transform: translateY(-0.5rem);
  max-width: 14ch;
}

.p-impact_impactInfoLabels {
  display: flex;
  flex-direction: column;
}

.p-impact_impactInfoLink {
  display: flex;
  justify-content: flex-end;
}

.p-impact_impactInfoIntro {
  align-items: start;
  padding-block: var(--space-4xl);
}

.p-impact_impactInfoIntro h2 {
  max-width: 35ch;
}

.p-impact_impactInfoMedia {
  position: relative;
  aspect-ratio: 5/7;
  overflow: hidden;
}

.p-impact_impactInfoStat {
  display: flex;
  flex-direction: column;
  gap: 10rem;
  padding-inline: var(--space-lg);
  border-left: 1px solid var(--color-medium-grey);
}


@media (max-width: 1000px) {
  .p-impact_impactHeroInner {
    padding-bottom: var(--space-3xl);
  }

  .p-impact_impactHeroSpacer {
    display: none;
  }

  .p-impact_impactInfo {
    padding: 4rem 0;
  }

  .p-impact_impactInfoInner {
    padding-block: var(--space-section);
  }

  .p-impact_impactInfoHeader {
    gap: var(--space-3xl);
    padding-bottom: var(--space-3xl);
  }

  .p-impact_impactInfoLink {
    justify-content: flex-start;
  }

  .p-impact_impactInfoIntro {
    gap: var(--space-3xl);
    padding-block: var(--space-3xl);
  }

  .p-impact_impactInfoStat {
    border-left: none;
    border-top: 1px solid var(--color-medium-grey);
    padding-inline: 0;
    padding-block: 0;
    padding-top: 2rem;
  }

  .p-impact_impactInfoStat:first-child {
    border-top: none;
    padding-top: 0;
  }

}
