@import url('/youth-modern.css');

body.impact-page {
  margin: 0;
  display: block;
  min-height: 100dvh;
  font-family: Manrope, sans-serif;
  font-size: 14px;
  line-height: 1.65;
  color: #f0f0f0;
  background: #000;
}
body.impact-page *,
body.impact-page *::before,
body.impact-page *::after {
  box-sizing: border-box;
}
body.impact-page img {
  display: block;
  max-width: 100%;
}

.impact-page .hero {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  min-height: 100svh;
  background: #061424;
}
.impact-page .hero-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(90deg, rgba(3,16,31,.96) 0%, rgba(3,16,31,.78) 36%, rgba(3,16,31,.24) 78%, rgba(3,16,31,.08) 100%), linear-gradient(0deg, rgba(3,16,31,.58), transparent 48%);
}
.impact-page .hero-content {
  position: relative;
  z-index: 2;
  max-width: 820px;
  padding: clamp(100px, 13vw, 170px) clamp(28px, 7vw, 108px) 130px;
}
.impact-page .hero-kicker {
  margin: 0 0 20px;
  color: #7dc4ff;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .16em;
  line-height: 1.25;
  text-transform: uppercase;
}
.impact-page .hero-headline {
  margin: 0;
  color: #fff;
}
.impact-page .hero-subheadline {
  margin-top: 18px;
}
.impact-page .hero-cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 38px;
}
.impact-page .hero-cta-row .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 12px 18px;
  border: 1px solid transparent;
  border-radius: 7px;
  background: #7dc4ff;
  color: #061424;
  font-family: Manrope, sans-serif;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
}
.impact-page .hero-cta-row .btn:hover { background: #fff; color: #061424; }

.impact-page #main-content {
  overflow-x: clip;
}
.impact-page .modern-pathway-band .impact-band-copy {
  max-width: none;
  margin-top: 38px;
}
.impact-page .modern-pathway-band .impact-band-copy p {
  max-width: min(100%, 1080px);
  margin-top: 12px;
  color: rgba(255,255,255,.72);
  font-size: clamp(1.06rem, 1.28vw, 1.24rem);
  line-height: 1.62;
}
.impact-page .modern-pathway-band .impact-band-copy p:first-child { margin-top: 0; }
.impact-page .impact-emphasis { color: #fff !important; }
.impact-page .impact-band-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  max-width: 920px;
  margin-top: 42px;
  border-top: 1px solid rgba(125,196,255,.32);
  border-bottom: 1px solid rgba(125,196,255,.32);
}
.impact-page .impact-band-stat {
  min-height: 116px;
  padding: 22px 24px 20px 0;
  border-right: 1px solid rgba(125,196,255,.24);
}
.impact-page .impact-band-stat + .impact-band-stat { padding-left: 24px; }
.impact-page .impact-band-stat:last-child { border-right: 0; }
.impact-page .impact-band-value {
  color: #7dc4ff;
  font-size: clamp(2rem, 4vw, 3.6rem);
  font-weight: 800;
  line-height: .9;
  letter-spacing: -.07em;
}
.impact-page .impact-band-stat strong {
  display: block;
  max-width: 190px;
  margin-top: 12px;
  color: rgba(255,255,255,.64);
  font-size: 11px;
  line-height: 1.35;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.impact-page .modern-copy { max-width: 760px; }
.impact-page .modern-copy p { max-width: 760px; }
.impact-page .modern-outcomes-head { align-items: start; }
.impact-page .modern-outcomes-note { max-width: 340px; }
.impact-page .modern-result { min-height: 360px; }
.impact-page .modern-results:has(> .modern-result:nth-child(2):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.impact-page .modern-results:has(> .modern-result:nth-child(3):last-child) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.impact-page .modern-result .result-body { margin-top: 18px; }
.impact-page .modern-result .result-proof { margin-top: 14px; }
.impact-page .modern-pathway-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.impact-page .modern-path-card { min-height: 0; height: auto; align-self: start; }
.impact-page .modern-path-card:nth-child(2),
.impact-page .modern-path-card:nth-child(3) { margin-top: 0; }
.impact-page .modern-path-card p { max-width: none; }
.impact-page .modern-investment-grid { align-items: start; }
.impact-page .investment-list li { min-height: 62px; }
.impact-page .modern-copy,
.impact-page .impact-band-copy,
.impact-page .pathway-intro {
  width: 100%;
  max-width: none;
}
.impact-page .modern-copy p,
.impact-page .impact-band-copy p,
.impact-page .pathway-intro p,
.impact-page .investment-body > p,
.impact-page .finale-copy p {
  width: 100%;
  max-width: min(100%, 1080px);
  font-size: clamp(1.06rem, 1.28vw, 1.24rem);
  line-height: 1.62;
}
.impact-page .modern-outcomes-note {
  max-width: 520px;
  font-size: clamp(1rem, 1.12vw, 1.12rem);
  line-height: 1.58;
}
.impact-page .modern-finale .finale-copy p { max-width: 760px; }

@media (min-width: 901px) {
  .impact-page .hero-content { max-width: 1120px; }
  .impact-page .hero-headline { max-width: 1040px; }
}

/* Headers may use the full editorial shell when the statement supports it. */
.impact-page .modern-design h2,
.impact-page .modern-pathway-band h2 {
  width: 100%;
  max-width: none;
}
.impact-page .modern-outcomes-head > div,
.impact-page .modern-pathways-header > div,
.impact-page .investment-lead {
  width: 100%;
  max-width: none;
}

/* Finale and footer remain a normal-flow handoff; never translate the CTA out
   of the viewport to make long copy fit inside one pinned shell. */
@media (min-width: 901px) {
  .impact-page .modern-investment-grid,
  .impact-page .modern-finale-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: clamp(42px, 6vw, 80px);
  }
  .impact-page .investment-lead { position: static; }
  .impact-page .investment-lead,
  .impact-page .finale-copy {
    max-width: 1080px;
  }
  .impact-page .finale-copy {
    width: 100%;
    column-count: 2;
    column-gap: clamp(36px, 6vw, 88px);
    column-fill: balance;
  }
  .impact-page .finale-copy p {
    break-inside: avoid;
  }
  .impact-page .finale-copy .impact-emphasis,
  .impact-page .finale-copy .finale-ctas {
    column-span: all;
  }
}

html[data-theme="light"] body.impact-page footer {
  background: #061424 !important;
  color: rgba(255,255,255,.68) !important;
}
html[data-theme="light"] body.impact-page footer h4 { color: #fff !important; }
html[data-theme="light"] body.impact-page .footer-brand p,
html[data-theme="light"] body.impact-page footer ul a { color: rgba(255,255,255,.58) !important; }
html[data-theme="light"] body.impact-page .footer-logo-img {
  filter: none !important;
  opacity: .9 !important;
}
html[data-theme="light"] body.impact-page .footer-brand h3 { color: rgba(255,255,255,.45) !important; }
html[data-theme="light"] body.impact-page footer .btn-outline { color: rgba(255,255,255,.78) !important; border-color: rgba(255,255,255,.35) !important; }
html[data-theme="light"] body.impact-page footer .btn-primary { color: #061424 !important; }
html[data-theme="light"] body.impact-page .footer-bottom { color: rgba(255,255,255,.4) !important; border-top-color: rgba(255,255,255,.14) !important; }

/* Light editorial sections need dark emphasis text; the dark finale keeps white emphasis. */
html[data-theme="light"] body.impact-page .modern-mission .impact-emphasis,
html[data-theme="light"] body.impact-page .modern-investment .impact-emphasis,
html[data-theme="light"] body.impact-page .modern-pathway-band .impact-emphasis {
  color: #10263a !important;
}
html[data-theme="light"] body.impact-page .modern-pathway-band .impact-band-copy p {
  color: #274054 !important;
}
html[data-theme="light"] body.impact-page .modern-pathway-band .impact-band-value {
  color: #1e73be !important;
}
html[data-theme="light"] body.impact-page .modern-pathway-band .impact-band-stat strong {
  color: #274054 !important;
}


@media (min-width: 901px) {
  .impact-page .modern-design > .modern-finale {
    min-height: 180svh;
    height: auto;
    margin-bottom: 0;
  }
  .impact-page .modern-design > .modern-finale > .modern-shell {
    position: sticky;
    top: 0;
    height: auto;
    min-height: 100svh;
    overflow: visible;
    align-content: start;
    padding-top: clamp(72px, 10vh, 124px);
    padding-bottom: clamp(72px, 10vh, 124px);
  }
}

.impact-page footer {
  position: relative;
  z-index: 20;
  margin: 0;
  padding: 40px 60px;
  background: #061424;
  color: rgba(255,255,255,.6);
}
.impact-page .footer-inner {
  width: auto;
  max-width: none;
  margin: 0 0 32px;
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 32px;
}
.impact-page .footer-brand { max-width: none; }
.impact-page .footer-brand p {
  margin: 0;
  color: inherit;
  font-size: 13px;
  line-height: 1.65;
  max-width: 36ch;
}
.impact-page footer h4 {
  margin: 0 0 14px;
  color: rgba(255,255,255,.8);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.impact-page footer ul {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.impact-page footer li + li { margin-top: 0; }
.impact-page footer ul a {
  color: rgba(255,255,255,.5);
  font-size: 13px;
  line-height: normal;
  text-decoration: none;
}
.impact-page footer ul a:hover { color: #fff; }
.impact-page .footer-btns {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
}
.impact-page .footer-btns .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  padding: 9px 14px;
  border-radius: 6px;
  font-family: Manrope, sans-serif;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
}
.impact-page .footer-btns .btn-primary {
  background: #7dc4ff;
  color: #061424;
}
.impact-page .footer-btns .btn-outline {
  border: 1px solid rgba(255,255,255,.35);
  color: rgba(255,255,255,.78);
}
.impact-page .footer-btns .btn-outline:hover { border-color: #7dc4ff; color: #7dc4ff; }
.impact-page .footer-btns .btn-primary:hover { background: #fff; color: #061424; }
.impact-page .footer-bottom {
  width: auto;
  max-width: none;
  margin: 0;
  padding-top: 20px;
  border-top: 1px solid rgba(255,255,255,.1);
  color: rgba(255,255,255,.6);
  font-size: 11px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

/* Final-section actions need a complete button base; theme.css only styles the footer buttons. */
.impact-page .modern-design .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 12px 18px;
  border: 1px solid transparent;
  border-radius: 7px;
  font-family: Manrope, sans-serif;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
  text-decoration: none;
  transition: background-color .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;
}
.impact-page .modern-design .btn:hover { transform: translateY(-1px); }
.impact-page .modern-finale .btn-primary {
  background: #1e73be;
  color: #fff;
}
.impact-page .modern-finale .btn-primary:hover {
  background: #6aaee3;
  color: #061424;
}
.impact-page .modern-finale .btn-outline {
  border-color: rgba(255,255,255,.5);
  color: #fff;
}
.impact-page .modern-finale .btn-outline:hover {
  border-color: #6aaee3;
  color: #6aaee3;
}

/* Link treatment for editorial content: buttons stay buttons, text links stay visibly links. */
.impact-page .modern-design a:not(.btn) {
  color: #176fb7;
  font-weight: 700;
  text-decoration-line: underline;
  text-decoration-thickness: .09em;
  text-underline-offset: .18em;
  text-decoration-color: rgba(23,111,183,.5);
}
.impact-page .modern-design a:not(.btn):hover {
  color: #0d4f86;
  text-decoration-color: currentColor;
}
.impact-page .modern-design .inline-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 10px 17px;
  border: 1px solid #1e73be;
  border-radius: 7px;
  background: #1e73be;
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
  text-decoration: none;
}
.impact-page .modern-design .inline-cta:hover {
  background: #1558a0;
  border-color: #1558a0;
  color: #fff;
}

/* Long-copy chapters keep Youth's pinned viewport shell while their direct
   content travels through the available chapter travel. */
@media (min-width: 901px) {
  .impact-page .modern-design > section.content-heavy > .modern-shell {
    height: 100svh;
    min-height: 100svh;
    overflow: hidden;
    align-content: start !important;
    justify-content: flex-start !important;
    padding-top: clamp(42px, 7vh, 82px);
    padding-bottom: clamp(42px, 7vh, 82px);
  }
  .impact-page .modern-design > section.content-heavy > .modern-shell > * {
    transform: translateY(var(--chapter-content-shift, 0px));
    will-change: transform;
  }
}
@media (max-width: 900px) {
  .impact-page .footer-inner {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 36px 28px;
  }
  .impact-page .footer-brand { grid-column: 1 / -1; max-width: none; }
}
@media (max-width: 600px) {
  .impact-page footer { padding: 32px 24px; }
  .impact-page .footer-inner { grid-template-columns: 1fr; gap: 32px; }
  .impact-page .footer-brand { grid-column: auto; }
  .impact-page .footer-bottom { margin-top: 0; }
}

@media (max-width: 900px) {
  .impact-page .impact-band-stats { grid-template-columns: 1fr; }
  .impact-page .impact-band-stat,
  .impact-page .impact-band-stat + .impact-band-stat {
    min-height: 0;
    padding: 18px 0;
    border-right: 0;
    border-bottom: 1px solid rgba(125,196,255,.24);
  }
  .impact-page .impact-band-stat:last-child { border-bottom: 0; }
  .impact-page .modern-pathway-cards { grid-template-columns: 1fr; }
  .impact-page .modern-result { min-height: 260px; }
}

@media (min-width: 901px) {
  /* Match the canonical Youth & Workforce shell: the header is top-only,
     while the chapter shells remain independently sticky below it. */
  body.impact-page {
    --impact-header-offset: 78px;
  }
  body.impact-page .site-header {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
  }
  body.impact-page .modern-design > section > .modern-shell {
    top: var(--impact-header-offset);
    min-height: calc(100svh - var(--impact-header-offset));
  }
  body.impact-page .modern-design > section.content-heavy > .modern-shell {
    height: calc(100svh - var(--impact-header-offset));
    min-height: calc(100svh - var(--impact-header-offset));
  }
}

/* Sleek investment-to-finale handoff.
   Keep the Youth & Workforce editorial hierarchy: a designed investment
   surface followed by a compact, normal-flow closing CTA. */
.impact-page .modern-investment {
  background: #f3f6f8;
  border-top: 1px solid #d7e1e8;
}
.impact-page .modern-investment-grid {
  grid-template-columns: minmax(260px, .72fr) minmax(0, 1.28fr) !important;
  gap: clamp(48px, 8vw, 132px) !important;
  align-items: start !important;
}
.impact-page .modern-investment-grid .investment-lead {
  position: static !important;
  max-width: 560px !important;
}
.impact-page .modern-investment-grid .investment-lead h2 {
  max-width: 620px;
  font-size: clamp(2.4rem, 5vw, 5rem);
  line-height: .98;
}
.impact-page .modern-investment-grid .investment-lead .big-statement {
  margin-top: 34px;
  padding-top: 26px;
  border-top: 1px solid #b8c7d2;
  font-size: clamp(1.65rem, 3.2vw, 3.2rem);
  line-height: 1;
}
html:not([data-theme="light"]) body.impact-page .modern-investment-grid .investment-lead .big-statement {
  color: rgba(244,247,251,.78);
}
.impact-page .modern-investment-grid .investment-body,
.impact-page .modern-investment-grid > :last-child {
  width: 100%;
  max-width: 780px;
}
.impact-page .modern-investment-grid .investment-body > p,
.impact-page .modern-investment-grid > :last-child > p {
  max-width: 680px;
  font-size: clamp(1rem, 1.12vw, 1.14rem);
  line-height: 1.62;
}
.impact-page .modern-investment-grid .impact-emphasis {
  margin-top: 24px;
  padding: 20px 0 22px;
  border-top: 1px solid #b8c7d2;
  border-bottom: 1px solid #b8c7d2;
}
.impact-page .modern-investment-grid .investment-list {
  margin-top: 26px;
}
.impact-page .modern-investment-grid .investment-list li {
  min-height: 64px;
  transition: padding .2s ease, background-color .2s ease;
}
.impact-page .modern-investment-grid .investment-list li:hover {
  padding-inline: 12px;
  background: rgba(255,255,255,.72);
}

.impact-page .modern-finale {
  min-height: 0 !important;
  height: auto !important;
  padding: clamp(96px, 12vw, 168px) 0 clamp(88px, 10vw, 136px);
  background: #071a2b;
}
.impact-page .modern-finale::before {
  top: 50%;
  transform: translateY(-50%);
  opacity: .72;
}
.impact-page .modern-finale-grid {
  grid-template-columns: minmax(280px, .78fr) minmax(0, 1.22fr) !important;
  gap: clamp(48px, 9vw, 140px) !important;
  align-items: start;
}
.impact-page .modern-finale-grid > :first-child {
  max-width: 600px;
}
.impact-page .modern-finale h2 {
  max-width: 620px;
  font-size: clamp(3rem, 6.4vw, 6.8rem);
  line-height: .94;
}
.impact-page .modern-finale .finale-copy {
  width: 100%;
  max-width: 700px;
  padding-top: 8px;
  column-count: initial !important;
  column-gap: normal;
}
.impact-page .modern-finale .finale-copy p {
  max-width: 680px;
  margin-bottom: 20px;
  font-size: clamp(1.04rem, 1.2vw, 1.2rem);
  line-height: 1.68;
}
.impact-page .modern-finale .finale-copy .impact-emphasis {
  margin-top: 30px;
  padding-top: 24px;
  border-top: 1px solid rgba(255,255,255,.24);
}
.impact-page .modern-finale .finale-ctas {
  margin-top: 42px;
  padding-top: 26px;
  border-top: 1px solid rgba(255,255,255,.24);
}

@media (min-width: 901px) {
  /* Closing chapters use the same pinned-shell interaction and travel budget
     as the earlier editorial chapters. */
  .impact-page .modern-design > .modern-investment,
  .impact-page .modern-design > .modern-finale {
    min-height: 800svh !important;
    height: auto !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    display: block !important;
    position: relative !important;
  }
  .impact-page .modern-design > .modern-investment > .modern-shell,
  .impact-page .modern-design > .modern-finale > .modern-shell {
    position: sticky !important;
    top: var(--impact-header-offset) !important;
    height: calc(100svh - var(--impact-header-offset)) !important;
    min-height: calc(100svh - var(--impact-header-offset)) !important;
    overflow: visible !important;
    align-content: start !important;
    padding-top: clamp(48px, 6vh, 72px) !important;
    padding-bottom: clamp(48px, 6vh, 72px) !important;
  }
}

@media (max-width: 900px) {
  .impact-page .modern-investment-grid,
  .impact-page .modern-finale-grid {
    grid-template-columns: 1fr !important;
    gap: 42px !important;
  }
  .impact-page .modern-investment-grid .investment-lead,
  .impact-page .modern-finale-grid > :first-child {
    max-width: 680px !important;
  }
  .impact-page .modern-finale {
    padding: 84px 0 76px;
  }
  .impact-page .modern-finale::before {
    top: 28%;
    transform: none;
    opacity: .35;
  }
}

@media (max-width: 600px) {
  .impact-page .modern-investment-grid,
  .impact-page .modern-finale-grid {
    gap: 34px !important;
  }
  .impact-page .modern-investment-grid .investment-lead h2,
  .impact-page .modern-finale h2 {
    font-size: clamp(2.7rem, 13vw, 4.2rem);
  }
  .impact-page .modern-investment-grid .investment-lead .big-statement {
    margin-top: 28px;
    font-size: clamp(1.55rem, 8vw, 2.2rem);
  }
  .impact-page .modern-investment-grid .investment-list li {
    min-height: 60px;
    gap: 14px;
    font-size: 14px;
  }
  .impact-page .modern-investment-grid .investment-list li:hover {
    padding-inline: 0;
    background: transparent;
  }
  .impact-page .modern-finale .finale-copy {
    padding-top: 0;
  }
  .impact-page .modern-finale .finale-ctas {
    align-items: stretch;
    flex-direction: column;
    margin-top: 34px;
  }
  .impact-page .modern-finale .finale-ctas .btn {
    width: 100%;
  }
}

/* The closing sections are normal-flow content, not pinned chapter shells. They
   must be visible as soon as they enter the viewport, even before scrollY reaches
   their document start (the investment section can be shorter than one viewport). */
@media (min-width: 901px) {
  html.scroll-linked .impact-page .modern-investment,
  html.scroll-linked .impact-page .modern-finale {
    visibility: visible !important;
  }
}

/* Impact Evidence page: compact, accessible Creative Impact Tool. */
.impact-page .impact-tool-section {
  padding: clamp(72px, 9vw, 132px) clamp(24px, 6vw, 96px);
  background: #071a2b;
  color: #fff;
}
.impact-page .impact-tool-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 330px);
  gap: 42px;
  align-items: end;
  margin-top: 16px;
}
.impact-page .impact-tool-heading h2 {
  max-width: 760px;
  margin: 0;
  color: #fff;
  font-family: var(--youth-display);
  font-size: clamp(2.7rem, 5.4vw, 5.8rem);
  font-weight: 400;
  letter-spacing: -.07em;
  line-height: .96;
}
.impact-page .impact-tool-heading p {
  max-width: 720px;
  margin-top: 24px;
  color: rgba(255,255,255,.7);
  font-size: clamp(1.05rem, 1.35vw, 1.22rem);
  line-height: 1.65;
}
.impact-page .impact-tool-status {
  display: block;
  padding: 16px 18px;
  border: 1px solid rgba(125,196,255,.24);
  border-radius: 8px;
  color: rgba(255,255,255,.62);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  line-height: 1.45;
  text-transform: uppercase;
}
.impact-page .impact-tool-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 48px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(255,255,255,.16);
}
.impact-page .impact-tool-tab {
  min-height: 42px;
  padding: 10px 15px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 999px;
  background: transparent;
  color: rgba(255,255,255,.62);
  cursor: pointer;
  font-family: Manrope, sans-serif;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .04em;
  transition: background .2s ease, border-color .2s ease, color .2s ease;
}
.impact-page .impact-tool-tab:hover,
.impact-page .impact-tool-tab:focus-visible,
.impact-page .impact-tool-tab.is-active {
  border-color: #7dc4ff;
  background: #7dc4ff;
  color: #061424;
}
.impact-page .impact-tool-panels { margin-top: 28px; }
.impact-page .impact-tool-panel {
  display: grid;
  grid-template-columns: 90px minmax(0, 780px);
  gap: 28px;
  align-items: start;
  padding: 30px 0 8px;
  border-top: 1px solid rgba(255,255,255,.14);
}
.impact-page .impact-tool-panel[hidden] { display: none; }
.impact-page .impact-tool-number {
  color: #7dc4ff;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .12em;
}
.impact-page .impact-tool-panel h3 {
  margin: 0;
  color: #fff;
  font-family: var(--youth-display);
  font-size: clamp(1.9rem, 3.2vw, 3.2rem);
  font-weight: 400;
  letter-spacing: -.055em;
  line-height: 1;
}
.impact-page .impact-tool-panel p {
  max-width: 720px;
  margin-top: 18px;
  color: rgba(255,255,255,.7);
  font-size: 1.04rem;
  line-height: 1.7;
}
.impact-page .impact-tool-panel .impact-tool-note {
  padding-top: 16px;
  border-top: 1px solid rgba(125,196,255,.22);
  color: #7dc4ff;
  font-size: .92rem;
}
@media (max-width: 900px) {
  .impact-page .impact-tool-heading { grid-template-columns: 1fr; gap: 26px; }
  .impact-page .impact-tool-status { max-width: 360px; }
}
@media (max-width: 600px) {
  .impact-page .impact-tool-section { padding: 72px 24px; }
  .impact-page .impact-tool-heading h2 { font-size: clamp(2.7rem, 14vw, 4.6rem); }
  .impact-page .impact-tool-tabs { align-items: stretch; flex-direction: column; }
  .impact-page .impact-tool-tab { width: 100%; text-align: left; }
  .impact-page .impact-tool-panel { grid-template-columns: 1fr; gap: 16px; padding-top: 24px; }
  .impact-page .impact-tool-number { font-size: 11px; }
  .impact-page .impact-tool-panel h3 { font-size: clamp(2rem, 10vw, 3rem); }
}