/* ============================================================
   SOCIAL IMPACT — 1:1 Figma rebuild
   Page frame: 1920 x 9914, bg #FAFAFA
   Section vertical map (page-absolute Y):
     Hero:                      195 -> 906   (h 711)
     SRLC intro band:           915 -> 1691  (cream, video + copy)
     In the Poconos heading:   1761 -> 2289
     Community Partnerships:   2762 -> 3654
     Across the United States: 3797 -> 4345
     Initiative cards globe:   4415 -> 5713
     Around the World stats:   5839 -> 6281
     Initiatives Across globe: 6351 -> 7492
     Our Unique Global App:    7562 -> 8701
     CTA band BEA884:          8871 -> 9190 (h 319)
     Footer:                   9190 -> 9914
============================================================ */

body[data-page="social-impact"] section,
body[data-page="social-impact"] [class*="__inner"]:not(.inner-hero__inner) {
  padding-top: 0; padding-bottom: 0; gap: 0; min-height: 0;
}
body[data-page="social-impact"] { background: #FAFAFA; }

/* ============ HERO 195 -> 906 (h 711) ============ */
body[data-page="social-impact"] .inner-hero {
  width: 100%;
  height: min(711px, calc(711 / 1920 * 100vw));
  position: relative;
  overflow: hidden;
  /* Hero meets the nav flush — no gap below the chrome header (SI-r13). */
  margin-top: 0;
}
body[data-page="social-impact"] .inner-hero__image {
  position: absolute; inset: 0;
  background-size: cover;
  background-position: center;
}
body[data-page="social-impact"] .inner-hero__veil {
  position: absolute; inset: 0;
  /* 90deg rotated 180 -> 270deg, 63%/89.51% stops. */
  background: linear-gradient(270deg, rgba(132,132,132,0.32) 63%, rgba(42,42,42,0.8) 89.51%);
}
body[data-page="social-impact"] .inner-hero__inner {
  position: absolute;
  left: min(140px, calc(140 / 1920 * 100vw));
  top: min(508px, calc(508 / 1920 * 100vw)); /* 703 - 195 */
  width: min(800px, calc(800 / 1920 * 100vw));
  height: auto !important; min-height: 0 !important;
  padding: 0; margin: 0; text-align: left;
}
body[data-page="social-impact"] .inner-hero__kicker {
  font-family: 'Inter', sans-serif; font-weight: 500;
  font-size: min(20px, calc(20 / 1920 * 100vw));
  line-height: calc(24 / 20);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #FFFFFF;
  margin: 0;
  white-space: nowrap;
}
body[data-page="social-impact"] .inner-hero__sub {
  font-family: 'Inter', sans-serif; font-style: italic; font-weight: 500;
  font-size: min(16px, calc(16 / 1920 * 100vw));
  line-height: calc(19 / 16);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #FFFFFF;
  /* Reduced 16 -> 2 to absorb the ~13px line-box overhead Inter
     renders over its spec line-height. */
  margin: min(2px, calc(2 / 1920 * 100vw)) 0 0;
}
body[data-page="social-impact"] .inner-hero__title {
  font-family: 'STIX Two Text', serif; font-weight: 500;
  font-size: min(64px, calc(64 / 1920 * 100vw));
  line-height: calc(80 / 64);
  text-transform: capitalize;
  color: #FFFFFF;
  /* Reduced 18 -> 5 to absorb Inter sub line-box overhead. */
  margin: min(5px, calc(5 / 1920 * 100vw)) 0 0;
}

/* ============ SRLC INTRO 915 -> 1691 ============ */
body[data-page="social-impact"] .si-srlc {
  position: relative;
  width: 100%;
  height: min(776px, calc(776 / 1920 * 100vw)); /* 1691 - 915 */
  background: rgba(240, 234, 222, 0.5);
  /* Hero ends at 906; Figma SRLC starts at 915 -> 9px gap. */
  margin-top: min(9px, calc(9 / 1920 * 100vw));
}
body[data-page="social-impact"] .si-srlc__video {
  position: absolute;
  left: min(156px, calc(156 / 1920 * 100vw));
  top: min(94px, calc(94 / 1920 * 100vw)); /* 1009 - 915 */
  width: min(782px, calc(782 / 1920 * 100vw));
  height: min(588px, calc(588 / 1920 * 100vw));
  background-image: var(--si-srlc-bg);
  background-size: cover;
  background-position: center;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
}
/* Inline-play iframe keeps the .si-srlc__video class so it inherits the
   thumbnail's exact box (no reflow when playback starts) — SI-r9. */
body[data-page="social-impact"] .si-srlc__iframe {
  border: 0;
  background: #000;
}
body[data-page="social-impact"] .si-srlc__play {
  width: min(89px, calc(89 / 1920 * 100vw));
  height: min(89px, calc(89 / 1920 * 100vw));
  display: flex; align-items: center; justify-content: center;
}
body[data-page="social-impact"] .si-srlc__play svg {
  width: 100%; height: 100%;
  fill: #E6E6E6;
}
body[data-page="social-impact"] .si-srlc__copy {
  position: absolute;
  left: min(978px, calc(978 / 1920 * 100vw));
  top: min(116px, calc(116 / 1920 * 100vw)); /* 1031 - 915 */
  width: min(785px, calc(785 / 1920 * 100vw));
}
body[data-page="social-impact"] .si-srlc__copy h2 {
  font-family: 'STIX Two Text', serif; font-weight: 500;
  font-size: min(52px, calc(52 / 1920 * 100vw));
  line-height: calc(70 / 52);
  color: #5E2A29;
  margin: 0;
  width: min(785px, calc(785 / 1920 * 100vw));
}
body[data-page="social-impact"] .si-srlc__copy h2 em {
  font-style: italic;
}
body[data-page="social-impact"] .si-srlc__copy p {
  font-family: 'Inter', sans-serif; font-weight: 400;
  font-size: min(20px, calc(20 / 1920 * 100vw));
  line-height: calc(38 / 20);
  color: #282828;
  width: min(739px, calc(739 / 1920 * 100vw));
  margin: min(20px, calc(20 / 1920 * 100vw)) 0 0;
}
body[data-page="social-impact"] .si-srlc__copy p + p {
  /* Visual paragraph break between the main bio and the "At the
     Ashram..." closer per user image #123. */
  margin-top: min(28px, calc(28 / 1920 * 100vw));
}
body[data-page="social-impact"] .si-srlc__cta-label {
  /* Force one-line "Learn More About SRLC USA" per Figma. */
  white-space: nowrap;
}
body[data-page="social-impact"] .si-srlc__cta {
  position: absolute;
  left: min(978px, calc(978 / 1920 * 100vw));
  top: min(620px, calc(620 / 1920 * 100vw)); /* 1535 - 915 */
  width: min(292px, calc(292 / 1920 * 100vw));
  height: min(60px, calc(60 / 1920 * 100vw));
  background: transparent;
  border: 1px solid #5E2A29;
  border-radius: 40px;
  display: inline-flex; align-items: center; justify-content: center;
  gap: min(12px, calc(12 / 1920 * 100vw));
  text-decoration: none;
  padding: min(10px, calc(10 / 1920 * 100vw)) min(20px, calc(20 / 1920 * 100vw));
  box-sizing: border-box;
  font-family: 'Inter', sans-serif; font-weight: 500;
  font-size: min(16px, calc(16 / 1920 * 100vw));
  line-height: calc(20 / 16);
  color: #5E2A29;
  transition: background 0.25s ease, color 0.25s ease;
}
body[data-page="social-impact"] .si-srlc__cta:hover { background: #5E2A29; color: #FAFAFA; }
body[data-page="social-impact"] .si-srlc__cta:hover svg rect { fill: #FAFAFA; }
body[data-page="social-impact"] .si-srlc__cta:hover svg path { stroke: #5E2A29; }
body[data-page="social-impact"] .si-cta-arrow {
  width: min(20px, calc(20 / 1920 * 100vw));
  height: min(20px, calc(20 / 1920 * 100vw));
  display: block; flex-shrink: 0; overflow: visible;
}

/* ============ QUOTE BAND (SI-r36 / q11) ============
   "Selfless service is love made visible." between the SRLC intro band
   and In the Poconos Region. Redesign frame 7849:1727: full-bleed
   1920x542 golden-texture image band (assets/si-quote-band-v2.jpg, the
   Figma export's designed crop), serif-italic quote #5A381C + uppercase
   tracked attribution #5E2A29, no gap above (touches the SRLC cream). */
body[data-page="social-impact"] .si-quote {
  width: 100%;
  aspect-ratio: 1920 / 542;
  background-color: #D9C4A7;
  background-size: cover;
  background-position: center;
  margin-top: 0;
  padding: 0 min(140px, calc(140 / 1920 * 100vw));
  display: flex; align-items: center; justify-content: center;
  box-sizing: border-box;
}
body[data-page="social-impact"] .si-quote__inner {
  text-align: center;
  max-width: min(1100px, calc(1100 / 1920 * 100vw));
}
body[data-page="social-impact"] .si-quote__text {
  font-family: 'STIX Two Text', serif; font-weight: 400; font-style: italic;
  font-size: min(48px, calc(48 / 1920 * 100vw));
  line-height: calc(60 / 48);
  color: #5A381C;
  margin: 0;
}
body[data-page="social-impact"] .si-quote__attribution {
  font-family: 'Inter', sans-serif; font-weight: 500;
  font-size: min(24px, calc(24 / 1920 * 100vw));
  line-height: calc(34 / 24);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #5E2A29;
  margin: min(26px, calc(26 / 1920 * 100vw)) 0 0;
}

/* ============ POCONOS 1761 -> Community Initiatives -> 3654 ============
   Heading + body at 1761, "Community Initiatives at a Glance" label
   at 2013, 3 cards 2087-2692, Community Partnerships 2762, etc. */
body[data-page="social-impact"] .si-poconos {
  position: relative;
  width: 100%;
  padding-top: min(70px, calc(70 / 1920 * 100vw)); /* 1761 - 1691 */
}
body[data-page="social-impact"] .si-poconos__head {
  padding: 0 min(140px, calc(140 / 1920 * 100vw));
}
body[data-page="social-impact"] .si-poconos__head h2 {
  font-family: 'STIX Two Text', serif; font-weight: 500;
  font-size: min(52px, calc(52 / 1920 * 100vw));
  line-height: calc(70 / 52);
  color: #5E2A29;
  margin: 0;
}
body[data-page="social-impact"] .si-poconos__head p {
  font-family: 'Inter', sans-serif; font-weight: 400;
  font-size: min(20px, calc(20 / 1920 * 100vw));
  line-height: calc(38 / 20);
  color: #282828;
  margin: min(20px, calc(20 / 1920 * 100vw)) 0 0;
  /* Bumped 950 -> 1100 so the body fits in 2 lines per Figma —
     the rendered Inter @ 20px is slightly wider than Figma's
     preview, which caused "...who serve." to drop to a 3rd line. */
  width: min(1100px, calc(1100 / 1920 * 100vw));
}
/* Cream rectangle behind the "Community Initiatives at a Glance"
   label + 3 cards per Figma Rectangle 34624865. */
body[data-page="social-impact"] .si-poconos__cream {
  position: relative;
  width: min(1640px, calc(1640 / 1920 * 100vw));
  margin: min(86px, calc(86 / 1920 * 100vw)) auto 0;
  padding: 0 min(58px, calc(58 / 1920 * 100vw)) 0 min(37px, calc(37 / 1920 * 100vw));
  box-sizing: border-box;
  isolation: isolate;
}
body[data-page="social-impact"] .si-poconos__cream::before {
  content: '';
  position: absolute;
  background: rgba(240, 234, 222, 0.5);
  top: max(-30px, calc(-30 / 1920 * 100vw));
  left: 0;
  right: 0;
  bottom: max(-1040px, calc(-1040 / 1920 * 100vw));
  z-index: -1;
  pointer-events: none;
}
body[data-page="social-impact"] .si-poconos__label {
  font-family: 'Inter', sans-serif; font-weight: 500;
  font-size: min(28px, calc(28 / 1920 * 100vw));
  line-height: calc(34 / 28);
  color: #46474B;
  margin: 0;
}
body[data-page="social-impact"] .si-poconos__cards {
  display: grid;
  grid-template-columns: repeat(3, min(515px, calc(515 / 1920 * 100vw)));
  gap: 0;
  margin: min(40px, calc(40 / 1920 * 100vw)) 0 0;
}
body[data-page="social-impact"] .si-poconos-card {
  background: transparent;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  height: 100%;
}
body[data-page="social-impact"] .si-poconos-card__photo {
  width: 100%;
  height: min(400px, calc(400 / 1920 * 100vw));
  background-size: cover;
  background-position: center;
}
body[data-page="social-impact"] .si-poconos-card__photo--top {
  background-position: center 37%;
}
body[data-page="social-impact"] .si-poconos-card__more {
  display: inline-block;
  margin: 0;
  font-family: 'Inter', sans-serif; font-weight: 400;
  font-style: italic;
  font-size: min(20px, calc(20 / 1920 * 100vw));
  line-height: calc(30 / 20);
  color: #000000;
  text-decoration: underline;
  text-underline-offset: 0.15em;
}
body[data-page="social-impact"] .si-poconos-card__body {
  background: #FFFFFF;
  padding: min(20px, calc(20 / 1920 * 100vw)) min(14px, calc(14 / 1920 * 100vw)) min(28px, calc(28 / 1920 * 100vw));
  display: flex; flex-direction: column;
  gap: min(8px, calc(8 / 1920 * 100vw));
  flex: 1 1 auto;
}
body[data-page="social-impact"] .si-poconos-card__title {
  font-family: 'Inter', sans-serif; font-weight: 500;
  font-size: min(20px, calc(20 / 1920 * 100vw));
  line-height: calc(28 / 20);
  color: #5E2A29;
  margin: 0;
}
body[data-page="social-impact"] .si-poconos-card__desc {
  font-family: 'Inter', sans-serif; font-weight: 400;
  font-size: min(20px, calc(20 / 1920 * 100vw));
  line-height: calc(30 / 20);
  color: #282828;
  margin: 0;
}

/* ============ COMMUNITY PARTNERSHIPS ============ */
body[data-page="social-impact"] .si-partners {
  position: relative;
  width: 100%;
  padding: min(63px, calc(63 / 1920 * 100vw)) min(177px, calc(177 / 1920 * 100vw)) 0;
}
body[data-page="social-impact"] .si-partners__label {
  font-family: 'Inter', sans-serif; font-weight: 500;
  font-size: min(28px, calc(28 / 1920 * 100vw));
  line-height: calc(34 / 28);
  letter-spacing: 0.02em;
  color: #46474B;
  margin: 0;
}
body[data-page="social-impact"] .si-partners__intro {
  font-family: 'Inter', sans-serif; font-weight: 400;
  font-size: min(20px, calc(20 / 1920 * 100vw));
  line-height: calc(38 / 20);
  color: #282828;
  margin: min(20px, calc(20 / 1920 * 100vw)) 0 0;
}
body[data-page="social-impact"] .si-partners__cards-3 {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 0;
  margin: min(40px, calc(40 / 1920 * 100vw)) 0 0;
}
body[data-page="social-impact"] .si-partners-stat {
  background: #FFFFFF;
  border-radius: min(4px, calc(4 / 1920 * 100vw));
  height: min(368px, calc(368 / 1920 * 100vw));
  display: flex; flex-direction: column;
  align-items: center; justify-content: flex-start;
  padding: min(50px, calc(50 / 1920 * 100vw)) min(20px, calc(20 / 1920 * 100vw)) min(20px, calc(20 / 1920 * 100vw));
  gap: min(44px, calc(44 / 1920 * 100vw));
  box-sizing: border-box;
}
body[data-page="social-impact"] .si-partners-stat__logo {
  width: auto;
  max-width: 70%;
  height: min(120px, calc(120 / 1920 * 100vw));
  object-fit: contain;
  flex-shrink: 0;
}
body[data-page="social-impact"] .si-partners-stat__desc {
  font-family: 'Inter', sans-serif; font-weight: 400;
  font-size: min(20px, calc(20 / 1920 * 100vw));
  line-height: calc(34 / 20);
  color: #282828;
  margin: 0;
  text-align: left;
  width: 100%;
  max-width: min(393px, calc(393 / 1920 * 100vw));
}
body[data-page="social-impact"] .si-partners__additional {
  margin: min(50px, calc(50 / 1920 * 100vw)) 0 0;
}
body[data-page="social-impact"] .si-partners__additional-label {
  font-family: 'Inter', sans-serif; font-weight: 500;
  font-size: min(28px, calc(28 / 1920 * 100vw));
  line-height: calc(34 / 28);
  letter-spacing: 0.02em;
  color: #46474B;
  margin: 0;
}
body[data-page="social-impact"] .si-partners__additional-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: 0;
  margin: min(24px, calc(24 / 1920 * 100vw)) 0 0;
}
body[data-page="social-impact"] .si-partners__logo-card {
  background: #FFFFFF;
  height: min(150px, calc(150 / 1920 * 100vw));
  display: flex; align-items: center; justify-content: center;
  padding: min(20px, calc(20 / 1920 * 100vw));
  box-sizing: border-box;
}
body[data-page="social-impact"] .si-partners__logo-card img {
  max-width: 85%;
  max-height: 90%;
  object-fit: contain;
}
body[data-page="social-impact"] .si-partners__logo-card img[alt*="St Luke"],
body[data-page="social-impact"] .si-partners__logo-card img[alt*="Angels"],
body[data-page="social-impact"] .si-partners__logo-card img[alt*="VALOR"] {
  max-width: 78%;
  max-height: 83%;
}
body[data-page="social-impact"] .si-partners__logo-card img[alt*="Salvation"],
body[data-page="social-impact"] .si-partners__logo-card img[alt*="Jo"] {
  max-width: 98%;
  max-height: 100%;
}
/* q11: Bushkill card art per redesign frame = Schoonover Municipal Center
   emblem (node 4156:1314), 217x110 inside the 382x150 card. */
body[data-page="social-impact"] .si-partners__logo-card img[alt*="Schoonover"] {
  width: min(217px, calc(217 / 1920 * 100vw));
  height: auto;
  max-width: none;
  max-height: none;
}

/* ============ ACROSS THE UNITED STATES ============ */
body[data-page="social-impact"] .si-us {
  position: relative;
  width: 100%;
  padding: min(143px, calc(143 / 1920 * 100vw)) min(140px, calc(140 / 1920 * 100vw)) 0;
}
body[data-page="social-impact"] .si-us__grid {
  display: grid;
  grid-template-columns: min(585px, calc(585 / 1920 * 100vw)) min(882px, calc(882 / 1920 * 100vw));
  gap: min(155px, calc(155 / 1920 * 100vw));
  align-items: start;
}
body[data-page="social-impact"] .si-us__card {
  min-width: 0;
  max-width: 100%;
}
body[data-page="social-impact"] .si-us__copy h2 {
  font-family: 'STIX Two Text', serif; font-weight: 500;
  font-size: min(52px, calc(52 / 1920 * 100vw));
  line-height: calc(70 / 52);
  color: #5E2A29;
  margin: min(172px, calc(172 / 1920 * 100vw)) 0 0; /* 3969 - 3797 */
}
body[data-page="social-impact"] .si-us__copy p {
  font-family: 'Inter', sans-serif; font-weight: 400;
  font-size: min(20px, calc(20 / 1920 * 100vw));
  line-height: calc(38 / 20);
  color: #282828;
  margin: min(20px, calc(20 / 1920 * 100vw)) 0 0;
}
body[data-page="social-impact"] .si-us__card {
  background: rgba(240, 234, 222, 0.5);
  padding: min(40px, calc(40 / 1920 * 100vw));
  display: flex; flex-direction: column;
  gap: min(40px, calc(40 / 1920 * 100vw));
  box-sizing: border-box;
}
body[data-page="social-impact"] .si-us__card-label {
  font-family: 'Inter', sans-serif; font-weight: 600;
  font-size: min(16px, calc(16 / 1920 * 100vw));
  line-height: calc(24 / 16);
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #E26326;
  margin: 0 0 min(16px, calc(16 / 1920 * 100vw));
  padding-bottom: min(16px, calc(16 / 1920 * 100vw));
  border-bottom: 1px solid #E2BFB9;
}
body[data-page="social-impact"] .si-us__chapters {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  row-gap: min(60px, calc(60 / 1920 * 100vw));
  column-gap: min(40px, calc(40 / 1920 * 100vw));
  font-family: 'Inter', sans-serif; font-weight: 400;
  font-size: min(18px, calc(18 / 1920 * 100vw));
  line-height: calc(24 / 18);
  color: #282828;
}
/* Keep each city on a single line per Figma — without nowrap the
   longer ones (Indianapolis, IN / Philadelphia, PA / San Francisco,
   CA / Washington D.C.) wrapped to 2 lines. */
body[data-page="social-impact"] .si-us__chapters span {
  white-space: nowrap;
}

/* ============ INITIATIVE CARDS GLOBE (Service in Motion, Universities) ============ */
body[data-page="social-impact"] .si-globe-inits {
  position: relative;
  width: 100%;
  padding: min(70px, calc(70 / 1920 * 100vw)) min(140px, calc(140 / 1920 * 100vw)) 0;
}
body[data-page="social-impact"] .si-globe-inits__wrap {
  background: rgba(240, 234, 222, 0.5);
  padding: min(55px, calc(55 / 1920 * 100vw)) min(37px, calc(37 / 1920 * 100vw));
}
body[data-page="social-impact"] .si-globe-inits__label {
  font-family: 'Inter', sans-serif; font-weight: 500;
  font-size: min(28px, calc(28 / 1920 * 100vw));
  line-height: calc(34 / 28);
  color: #46474B;
  margin: 0;
}
body[data-page="social-impact"] .si-service-grid {
  display: grid;
  grid-template-columns: repeat(3, min(500px, calc(500 / 1920 * 100vw)));
  gap: 0 min(2px, calc(2 / 1920 * 100vw));
  margin: min(20px, calc(20 / 1920 * 100vw)) 0 0;
}
body[data-page="social-impact"] .si-service-tile {
  position: relative;
  height: min(350px, calc(350 / 1920 * 100vw));
  background-size: cover;
  background-position: center;
  overflow: hidden;
}
body[data-page="social-impact"] .si-service-tile--zoom {
  background-size: 168% auto;
}
body[data-page="social-impact"] .si-service-tile__hover {
  position: absolute;
  inset: 0;
  background: rgba(83, 64, 64, 0.8);
  opacity: 0;
  transition: opacity 0.25s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: min(40px, calc(40 / 1920 * 100vw));
  box-sizing: border-box;
}
body[data-page="social-impact"] .si-service-tile:hover .si-service-tile__hover {
  opacity: 1;
}
body[data-page="social-impact"] .si-service-tile__hover p {
  margin: 0;
  font-family: 'Inter', sans-serif;
  font-weight: 400;
  font-size: min(18px, calc(18 / 1920 * 100vw));
  line-height: calc(24 / 18);
  color: #FFFFFF;
  text-align: left;
  max-width: min(355px, calc(355 / 1920 * 100vw));
}
body[data-page="social-impact"] .si-uni-label {
  font-family: 'Inter', sans-serif; font-weight: 500;
  font-size: min(28px, calc(28 / 1920 * 100vw));
  line-height: calc(41 / 28);
  letter-spacing: 0.02em;
  color: #46474B;
  margin: min(60px, calc(60 / 1920 * 100vw)) 0 0;
}
body[data-page="social-impact"] .si-uni-grid {
  display: grid;
  grid-template-columns: repeat(5, min(300px, calc(300 / 1920 * 100vw)));
  gap: min(10px, calc(10 / 1920 * 100vw));
  margin: min(24px, calc(24 / 1920 * 100vw)) 0 0;
}
body[data-page="social-impact"] .si-uni-card {
  background: #F0EADE;
  border: 1px solid #E9E9E9;
  height: min(358px, calc(358 / 1920 * 100vw));
  padding: min(30px, calc(30 / 1920 * 100vw)) min(28px, calc(28 / 1920 * 100vw));
  display: flex; flex-direction: column;
  align-items: center;
  gap: min(12px, calc(12 / 1920 * 100vw));
  box-sizing: border-box;
}
body[data-page="social-impact"] .si-uni-card__logo {
  max-width: 70%;
  height: min(76px, calc(76 / 1920 * 100vw));
  object-fit: contain;
}
body[data-page="social-impact"] .si-uni-card__desc {
  font-family: 'Inter', sans-serif; font-weight: 400;
  font-size: min(16px, calc(16 / 1920 * 100vw));
  line-height: calc(28 / 16);
  color: #282828;
  margin: 0;
  flex: 1;
}
body[data-page="social-impact"] .si-uni-card__more {
  font-family: 'Inter', sans-serif; font-weight: 400;
  font-size: min(16px, calc(16 / 1920 * 100vw));
  line-height: calc(24 / 16);
  color: #282828;
  text-decoration: underline;
  text-underline-offset: 0.15em;
  margin-top: min(8px, calc(8 / 1920 * 100vw));
}

/* ============ AROUND THE WORLD STATS ============ */
body[data-page="social-impact"] .si-world {
  position: relative;
  width: 100%;
  padding: min(50px, calc(50 / 1920 * 100vw)) min(140px, calc(140 / 1920 * 100vw)) 0;
}
body[data-page="social-impact"] .si-world__heading {
  font-family: 'STIX Two Text', serif; font-weight: 500;
  font-size: min(52px, calc(52 / 1920 * 100vw));
  line-height: calc(70 / 52);
  color: #5E2A29;
  margin: 0;
  text-align: center;
}
body[data-page="social-impact"] .si-world__stats {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: min(30px, calc(30 / 1920 * 100vw));
  margin: min(40px, calc(40 / 1920 * 100vw)) 0 0;
  padding: 0 min(80px, calc(80 / 1920 * 100vw));
}
body[data-page="social-impact"] .si-stat__big {
  font-family: 'Inter', sans-serif; font-weight: 500;
  font-size: min(36px, calc(36 / 1920 * 100vw));
  line-height: calc(44 / 36);
  text-transform: capitalize;
  color: #E26326;
  margin: 0;
}
body[data-page="social-impact"] .si-stat__label {
  font-family: 'Inter', sans-serif; font-weight: 400;
  font-size: min(16px, calc(16 / 1920 * 100vw));
  line-height: calc(28 / 16);
  letter-spacing: 0.04em;
  color: #5E2A29;
  margin: min(12px, calc(12 / 1920 * 100vw)) 0 0;
}
body[data-page="social-impact"] .si-world__total {
  background: rgba(240, 234, 222, 0.5);
  border-radius: min(8px, calc(8 / 1920 * 100vw));
  padding: min(35px, calc(35 / 1920 * 100vw)) 0;
  margin: min(40px, calc(40 / 1920 * 100vw)) 0 0;
  text-align: center;
}
body[data-page="social-impact"] .si-world__total-big {
  font-family: 'Inter', sans-serif; font-weight: 500;
  font-size: min(52px, calc(52 / 1920 * 100vw));
  line-height: calc(63 / 52);
  text-transform: capitalize;
  color: #E26326;
  margin: 0;
}
body[data-page="social-impact"] .si-world__total-label {
  font-family: 'Inter', sans-serif; font-weight: 400;
  font-size: min(28px, calc(28 / 1920 * 100vw));
  line-height: 1;
  letter-spacing: 0.04em;
  color: #5E2A29;
  margin: min(16px, calc(16 / 1920 * 100vw)) 0 0;
}

/* ============ INITIATIVES ACROSS THE GLOBE ============ */
body[data-page="social-impact"] .si-globe {
  position: relative;
  width: 100%;
  padding: min(70px, calc(70 / 1920 * 100vw)) min(177px, calc(177 / 1920 * 100vw)) 0;
  display: block;
  grid-template-columns: none;
  gap: 0;
}
body[data-page="social-impact"] .si-globe__label {
  font-family: 'Inter', sans-serif; font-weight: 500;
  font-size: min(28px, calc(28 / 1920 * 100vw));
  line-height: calc(41 / 28);
  letter-spacing: 0.02em;
  color: rgba(40, 40, 40, 0.8);
  margin: 0;
}
body[data-page="social-impact"] .si-globe__grid {
  display: grid;
  grid-template-columns: repeat(3, min(504px, calc(504 / 1920 * 100vw)));
  gap: min(10px, calc(10 / 1920 * 100vw));
  margin: min(24px, calc(24 / 1920 * 100vw)) 0 0;
}
body[data-page="social-impact"] .si-init-card {
  background: #FFFFFF;
  border: 1px solid #EFEFEF;
  height: min(535px, calc(535 / 1920 * 100vw));
  display: flex; flex-direction: column;
  box-sizing: border-box;
}
body[data-page="social-impact"] .si-init-card__photo {
  position: relative;
  height: min(267px, calc(267 / 1920 * 100vw));
  background-size: cover;
  background-position: center;
  flex-shrink: 0;
}
body[data-page="social-impact"] .si-init-card__photo--top {
  background-position: center 25%;
}
body[data-page="social-impact"] .si-init-card__badge {
  position: absolute;
  top: 0;
  right: 0;
  background: #8F2B31;
  color: #FDFBF3;
  font-family: 'Inter', sans-serif;
  font-weight: 400;
  font-size: min(12px, calc(12 / 1920 * 100vw));
  line-height: calc(28 / 12);
  letter-spacing: 0.48px;
  text-transform: uppercase;
  padding: min(5px, calc(5 / 1920 * 100vw)) min(20px, calc(20 / 1920 * 100vw));
  border-radius: 2px 0 0 2px;
}
body[data-page="social-impact"] .si-init-card__body {
  padding: min(25px, calc(25 / 1920 * 100vw)) min(30px, calc(30 / 1920 * 100vw));
  display: flex; flex-direction: column;
  gap: min(35px, calc(35 / 1920 * 100vw));
  flex: 1;
}
body[data-page="social-impact"] .si-init-card__title {
  font-family: 'Inter', sans-serif; font-weight: 500;
  font-size: min(24px, calc(24 / 1920 * 100vw));
  line-height: calc(32 / 24);
  color: #5E2A29;
  margin: 0;
  text-align: center;
  min-height: calc(2 * min(32px, calc(32 / 1920 * 100vw)));
  display: flex;
  align-items: center;
  justify-content: center;
}
body[data-page="social-impact"] .si-init-card__desc {
  font-family: 'Inter', sans-serif; font-weight: 400;
  font-size: min(18px, calc(18 / 1920 * 100vw));
  line-height: calc(32 / 18);
  color: #282828;
  margin: 0;
}

/* ============ OUR UNIQUE GLOBAL APPROACH (10 care cards) ============ */
body[data-page="social-impact"] .si-approach {
  position: relative;
  width: 100%;
  padding: min(70px, calc(70 / 1920 * 100vw)) min(140px, calc(140 / 1920 * 100vw)) 0;
}
body[data-page="social-impact"] .si-approach__head {
  margin-bottom: min(60px, calc(60 / 1920 * 100vw));
}
body[data-page="social-impact"] .si-approach__label {
  font-family: 'Inter', sans-serif; font-weight: 500;
  font-size: min(28px, calc(28 / 1920 * 100vw));
  line-height: calc(41 / 28);
  letter-spacing: 0.02em;
  color: rgba(40, 40, 40, 0.8);
  margin: 0;
}
body[data-page="social-impact"] .si-approach__body {
  font-family: 'Inter', sans-serif; font-weight: 400;
  font-size: min(20px, calc(20 / 1920 * 100vw));
  line-height: calc(38 / 20);
  color: #282828;
  margin: min(21px, calc(21 / 1920 * 100vw)) 0 0;
}
body[data-page="social-impact"] .si-approach__grid {
  display: grid;
  grid-template-columns: repeat(5, min(325px, calc(325 / 1920 * 100vw)));
  gap: min(5px, calc(5 / 1920 * 100vw));
}
body[data-page="social-impact"] .si-care-tile {
  position: relative;
  height: min(500px, calc(500 / 1920 * 100vw));
  background-color: #C81515;
  background-size: cover;
  background-position: center;
  background-blend-mode: normal;
  overflow: hidden;
}
body[data-page="social-impact"] .si-approach__grid > .si-care-tile:nth-child(2) { background-position: 70% center; }
body[data-page="social-impact"] .si-approach__grid > .si-care-tile:nth-child(3) { background-position: 70% center; }
body[data-page="social-impact"] .si-approach__grid > .si-care-tile:nth-child(6) { background-position: 65% center; }
body[data-page="social-impact"] .si-approach__grid > .si-care-tile:nth-child(7) { background-position: center; }
body[data-page="social-impact"] .si-approach__grid > .si-care-tile:nth-child(8) { background-position: 70% center; }
body[data-page="social-impact"] .si-care-tile__overlay {
  position: absolute; inset: 0;
  background: rgba(0, 0, 0, 0.15);
}
body[data-page="social-impact"] .si-care-tile__hover {
  position: absolute;
  inset: 0;
  background: rgba(94, 42, 41, 0.85);
  opacity: 0;
  transition: opacity 0.25s ease;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 0 min(54px, calc(54 / 1920 * 100vw)) min(48px, calc(48 / 1920 * 100vw)) min(20px, calc(20 / 1920 * 100vw));
  box-sizing: border-box;
  gap: min(16px, calc(16 / 1920 * 100vw));
}
body[data-page="social-impact"] .si-care-tile:hover .si-care-tile__hover { opacity: 1; }
body[data-page="social-impact"] .si-care-tile:hover .si-care-tile__chip { opacity: 0; }
body[data-page="social-impact"] .si-care-tile__chip { transition: opacity 0.25s ease; }
body[data-page="social-impact"] .si-care-tile__hover h4 {
  font-family: 'Inter', sans-serif;
  font-weight: 300;
  font-size: min(32px, calc(32 / 1920 * 100vw));
  line-height: calc(36 / 32);
  color: #FDFBF3;
  margin: 0;
}
body[data-page="social-impact"] .si-care-tile__hover p {
  font-family: 'Inter', sans-serif;
  font-weight: 300;
  font-size: min(14px, calc(14 / 1920 * 100vw));
  line-height: calc(22 / 14);
  color: #FDFBF3;
  margin: 0;
}
body[data-page="social-impact"] .si-care-tile__chip {
  position: absolute;
  left: min(56px, calc(56 / 1920 * 100vw));
  top: min(342px, calc(342 / 1920 * 100vw));
  background: #F0EADE;
  border-radius: min(4px, calc(4 / 1920 * 100vw));
  padding: min(20px, calc(20 / 1920 * 100vw));
  display: flex; flex-direction: column;
  gap: min(7px, calc(7 / 1920 * 100vw));
  min-width: min(183px, calc(183 / 1920 * 100vw));
}
body[data-page="social-impact"] .si-care-tile__num {
  font-family: 'Inter', sans-serif; font-weight: 400;
  font-size: min(34px, calc(34 / 1920 * 100vw));
  line-height: calc(57 / 34);
  text-transform: capitalize;
  color: #5E2A29;
  margin: 0;
}
body[data-page="social-impact"] .si-care-tile__name {
  font-family: 'Inter', sans-serif; font-weight: 400;
  font-size: min(20px, calc(20 / 1920 * 100vw));
  line-height: calc(27 / 20);
  color: #5E2A29;
  margin: 0;
}

/* ============ CTA BAND 8871 -> 9190 (h 319) ============ */
body[data-page="social-impact"] .si-care10-cta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: min(12px, calc(12 / 1920 * 100vw));
  margin: min(80px, calc(80 / 1920 * 100vw)) auto min(70px, calc(70 / 1920 * 100vw));
  padding: 0 min(38px, calc(38 / 1920 * 100vw));
  height: min(60px, calc(60 / 1920 * 100vw));
  background: transparent;
  border: 1px solid #5E2A29;
  border-radius: 40px;
  text-decoration: none;
  font-family: 'Inter', sans-serif; font-weight: 500;
  font-size: min(16px, calc(16 / 1920 * 100vw));
  line-height: calc(20 / 16);
  color: #5E2A29;
  width: fit-content;
  transition: background 0.25s ease, color 0.25s ease;
}
body[data-page="social-impact"] .si-care10-cta svg {
  width: min(20px, calc(20 / 1920 * 100vw));
  height: min(20px, calc(20 / 1920 * 100vw));
  flex-shrink: 0;
  overflow: visible;
  color: #5E2A29;
}
body[data-page="social-impact"] .si-care10-cta:hover { background: #5E2A29; color: #FAFAFA; }
body[data-page="social-impact"] .si-care10-cta:hover svg { color: #FAFAFA; }
body[data-page="social-impact"] .si-care10-cta:hover svg rect { fill: #FAFAFA; }
body[data-page="social-impact"] .si-care10-cta:hover svg path { stroke: #5E2A29; }
body[data-page="social-impact"] .si-cta-band {
  position: relative;
  width: 100%;
  height: auto; /* q11: two CTA columns + closing link line (frame 4156:932) */
  background: #BEA884;
  display: grid;
  grid-template-columns: min(433px, calc(433 / 1920 * 100vw)) min(404px, calc(404 / 1920 * 100vw));
  justify-content: center;
  align-items: start;
  padding: min(45px, calc(45 / 1920 * 100vw)) 0 min(50px, calc(50 / 1920 * 100vw));
  margin-top: min(115px, calc(115 / 1920 * 100vw));
  box-sizing: border-box;
  gap: min(40px, calc(40 / 1920 * 100vw));
}
/* q11: closing link line per redesign frame (text 4156:1190) — serif
   white, links underlined, sits 53px under the buttons. (SI-r29 socials
   row removed — not in the redesign frame.) */
/* SRLC socials row (replaces the old closing text). Spans the full band width,
   centered below the two CTA columns. Mirrors the Global Movement gm-follow
   treatment: STIX label + a 44px monochrome icon row in brand maroon on tan. */
body[data-page="social-impact"] .si-follow {
  grid-column: 1 / -1;
  justify-self: center;
  display: flex; flex-direction: column; align-items: center;
  margin: min(20px, calc(20 / 1920 * 100vw)) 0 0;
}
body[data-page="social-impact"] .si-follow__label {
  font-family: 'STIX Two Text', serif; font-weight: 500; font-style: normal;
  text-transform: capitalize;
  font-size: min(24px, calc(24 / 1920 * 100vw));
  line-height: 1.2;
  color: #5e2a29;
  margin: 0 0 min(16px, calc(16 / 1920 * 100vw));
}
body[data-page="social-impact"] .si-follow__icons {
  display: flex; align-items: center;
  gap: min(20px, calc(20 / 1920 * 100vw));
  list-style: none; margin: 0; padding: 0;
}
body[data-page="social-impact"] .si-follow__icons a {
  width: min(44px, calc(44 / 1920 * 100vw));
  height: min(44px, calc(44 / 1920 * 100vw));
  display: inline-flex; align-items: center; justify-content: center;
  color: #5e2a29;
  /* Match the Global Movement follow-icon hover (lift + fade). */
  transition: transform 0.2s ease, opacity 0.2s ease;
}
body[data-page="social-impact"] .si-follow__icons a:hover { transform: translateY(-2px); opacity: 0.7; }
body[data-page="social-impact"] .si-follow__icons img {
  width: min(44px, calc(44 / 1920 * 100vw));
  height: min(44px, calc(44 / 1920 * 100vw));
  display: block;
}
body[data-page="social-impact"] .si-follow__icons li:nth-child(1) img {
  width: min(24px, calc(24 / 1920 * 100vw));
  height: min(24px, calc(24 / 1920 * 100vw));
  transform: translateY(-3px);
}
body[data-page="social-impact"] .si-cta-col {
  display: flex; flex-direction: column;
  align-items: center;
  gap: min(20px, calc(20 / 1920 * 100vw));
  text-align: center;
}
body[data-page="social-impact"] .si-cta-col__text {
  font-family: 'STIX Two Text', serif; font-weight: 400;
  font-size: min(24px, calc(24 / 1920 * 100vw));
  line-height: calc(32 / 24);
  color: #FFFFFF;
  margin: 0;
  max-width: min(433px, calc(433 / 1920 * 100vw));
}
body[data-page="social-impact"] .si-cta-col__btn {
  background: #FAFAFA;
  border-radius: 40px;
  width: min(250px, calc(250 / 1920 * 100vw));
  height: min(60px, calc(60 / 1920 * 100vw));
  display: inline-flex; align-items: center; justify-content: center;
  gap: min(12px, calc(12 / 1920 * 100vw));
  text-decoration: none;
  font-family: 'Inter', sans-serif; font-weight: 500;
  font-size: min(16px, calc(16 / 1920 * 100vw));
  line-height: calc(20 / 16);
  color: #5A381C;
  padding: min(10px, calc(10 / 1920 * 100vw)) min(20px, calc(20 / 1920 * 100vw));
  box-sizing: border-box;
  transition: background 0.25s ease, color 0.25s ease;
}
body[data-page="social-impact"] .si-cta-col__btn:hover { background: #5A381C; color: #FAFAFA; }
body[data-page="social-impact"] .si-cta-col__btn:hover svg rect { fill: #FAFAFA; }
body[data-page="social-impact"] .si-cta-col__btn:hover svg path { stroke: #5A381C; }
body[data-page="social-impact"] .si-cta-col__btn svg {
  width: min(20px, calc(20 / 1920 * 100vw));
  height: min(20px, calc(20 / 1920 * 100vw));
  overflow: visible;
  flex-shrink: 0;
}

/* Mobile-only elements — kept out of the desktop layout. */
body[data-page="social-impact"] .si-partners__more-note,
body[data-page="social-impact"] .si-service-nav { display: none; }

/* ============================================================
   IPAD (768–1023)  —  Initiatives Across the Globe alignment (SI-r16)
   At iPad width the desktop layout applies, but the init-card title
   is center-aligned while its body is left-aligned — improper, and
   inconsistent with every other card section on the page (Poconos,
   University, Partner stats all left-align both). Left-align the
   title here to match its body. Scoped so mobile (≤767) and
   desktop (≥1024) are untouched.
   ============================================================ */
@media (min-width: 768px) and (max-width: 1023px) {
  body[data-page="social-impact"] .si-init-card__title {
    text-align: left;
    justify-content: flex-start;
  }
}

/* ============================================================
   MOBILE + TABLET PORTRAIT  (≤1023px)  —  Figma node 4156:2261 (390-wide artboard)
   Extended from ≤767 to ≤1023 so iPad portrait (768–834) and small tablets use
   this readable layout instead of the desktop 1920-scaled view (which collapsed
   to ~40% at 768). All sizes here are fixed-px or min()-capped, so they don't
   over-grow on the wider tablet viewport. Desktop (≥1024) is untouched.
   ============================================================ */
@media (max-width: 1023px) {
  body[data-page="social-impact"] section { padding-left: 0; padding-right: 0; }

  /* ---------- HERO (photo 197→782, text bottom-centered) ---------- */
  body[data-page="social-impact"] .inner-hero {
    height: min(585px, calc(585 / 390 * 100vw));
    margin-top: 0;
  }
  body[data-page="social-impact"] .inner-hero__image {
    background-position: center;
    transform: none;
  }
  /* Figma hero matte = a translucent gray wash (desktop veil's rgba(132,132,132,.32))
     that lifts blacks + desaturates, plus bottom-darkening for the white text. */
  body[data-page="social-impact"] .inner-hero__veil {
    background: linear-gradient(180deg,
      rgba(132,132,132,0.26) 0%,
      rgba(124,124,124,0.23) 50%,
      rgba(54,50,46,0.58) 76%,
      rgba(38,36,34,0.86) 100%);
  }
  body[data-page="social-impact"] .inner-hero__inner {
    position: absolute;
    left: 0; right: 0; top: auto; bottom: 0;
    width: 100%;
    height: auto !important; min-height: 0 !important;
    display: flex; flex-direction: column; align-items: center;
    text-align: center;
    padding: 0 24px 40px; gap: 0;
  }
  body[data-page="social-impact"] .inner-hero__kicker {
    font-family: 'Inter', sans-serif; font-weight: 500;
    font-size: 12px; line-height: 20px; letter-spacing: 0.84px;
    text-transform: uppercase; color: #FFFFFF;
    white-space: normal; max-width: none; margin: 0;
  }
  body[data-page="social-impact"] .inner-hero__sub {
    font-family: 'Inter', sans-serif; font-style: italic; font-weight: 500;
    font-size: 12px; line-height: 20px; letter-spacing: 0.84px;
    text-transform: uppercase; color: #FFFFFF; margin: 2px 0 0;
  }
  body[data-page="social-impact"] .inner-hero__title {
    font-family: 'STIX Two Text', serif; font-weight: 500;
    font-size: 32px; line-height: 1.1; text-transform: none;
    color: #FFFFFF; margin: 10px 0 0; letter-spacing: 0;
  }

  /* ---------- SRLC: heading → body → button → video (full-bleed) ---------- */
  body[data-page="social-impact"] .si-srlc {
    position: static; height: auto; background: transparent;
    margin-top: 0; padding: 36px 0 0;
    display: flex; flex-direction: column;
  }
  body[data-page="social-impact"] .si-srlc__copy {
    position: static; order: 1; left: auto; top: auto; width: auto;
    padding: 0 38px;
  }
  body[data-page="social-impact"] .si-srlc__copy h2 {
    font-size: 28px; line-height: 1.2; width: auto;
  }
  body[data-page="social-impact"] .si-srlc__copy p {
    font-size: 14px; line-height: 26px; width: auto; margin: 16px 0 0;
  }
  body[data-page="social-impact"] .si-srlc__copy p + p { margin-top: 20px; }
  body[data-page="social-impact"] .si-srlc__cta {
    position: static; order: 2; left: auto; top: auto;
    width: min(265px, calc(265 / 390 * 100vw)); height: 44px;
    margin: 26px auto 0; font-size: 14px; gap: 10px;
  }
  body[data-page="social-impact"] .si-cta-arrow { width: 20px; height: 20px; }
  body[data-page="social-impact"] .si-srlc__video {
    position: static; order: 3; left: auto; top: auto;
    width: 100%; height: min(288px, calc(288 / 390 * 100vw));
    margin: 36px 0 0;
  }
  body[data-page="social-impact"] .si-srlc__play { width: 52px; height: 52px; }
  body[data-page="social-impact"] .si-srlc__iframe { background-image: none; }

  /* ---------- QUOTE BAND (SI-r36 / q11 golden image band) mobile ---------- */
  body[data-page="social-impact"] .si-quote {
    margin-top: 0;
    aspect-ratio: auto;
    padding: 48px 30px;
  }
  body[data-page="social-impact"] .si-quote__text {
    font-size: 22px; line-height: 32px;
  }
  body[data-page="social-impact"] .si-quote__attribution {
    font-size: 13px; line-height: 20px; margin-top: 14px;
  }

  /* ---------- POCONOS + PARTNERSHIPS share one cream band ---------- */
  body[data-page="social-impact"] .si-poconos {
    background: rgba(240, 234, 222, 0.5);
    padding: 70px 35px 0;
  }
  body[data-page="social-impact"] .si-poconos__head { padding: 0; }
  body[data-page="social-impact"] .si-poconos__head h2 {
    font-size: 28px; line-height: 1.2; text-transform: capitalize;
  }
  body[data-page="social-impact"] .si-poconos__head p {
    font-size: 14px; line-height: 26px; width: auto; margin-top: 16px;
  }
  body[data-page="social-impact"] .si-poconos__cream {
    width: auto; margin: 40px 0 0; padding: 0;
  }
  body[data-page="social-impact"] .si-poconos__cream::before { display: none; }
  body[data-page="social-impact"] .si-poconos__label { font-size: 20px; line-height: 28px; }
  body[data-page="social-impact"] .si-poconos__cards {
    display: flex; flex-direction: column; gap: 32px; margin-top: 28px;
  }
  body[data-page="social-impact"] .si-poconos-card {
    background: #FFFFFF; border-radius: 8px; padding: 13px;
  }
  body[data-page="social-impact"] .si-poconos-card__photo {
    width: 100%; height: min(280px, calc(280 / 390 * 100vw)); border-radius: 8px;
  }
  body[data-page="social-impact"] .si-poconos-card__body {
    background: transparent; padding: 14px 4px 4px; gap: 6px;
  }
  body[data-page="social-impact"] .si-poconos-card__title { font-size: 18px; line-height: 1.3; }
  body[data-page="social-impact"] .si-poconos-card__desc { font-size: 14px; line-height: 26px; }
  body[data-page="social-impact"] .si-poconos-card__more { font-size: 14px; line-height: 24px; }

  body[data-page="social-impact"] .si-partners {
    background: rgba(240, 234, 222, 0.5);
    padding: 50px 35px 70px;
  }
  body[data-page="social-impact"] .si-partners__label { font-size: 20px; line-height: 28px; }
  body[data-page="social-impact"] .si-partners__intro { font-size: 14px; line-height: 26px; margin-top: 16px; }
  /* the 3 stats collapse into ONE white card + the cream "25+" note */
  body[data-page="social-impact"] .si-partners__cards-3 {
    display: block; background: #FFFFFF; border-radius: 4px;
    padding: 28px 16px 16px; margin-top: 24px;
  }
  body[data-page="social-impact"] .si-partners-stat {
    background: transparent; border-radius: 0; height: auto;
    padding: 0; margin-bottom: 40px; gap: 14px;
  }
  body[data-page="social-impact"] .si-partners-stat__logo {
    height: auto; max-height: 60px; max-width: 68%;
  }
  body[data-page="social-impact"] .si-partners-stat__desc {
    font-size: 14px; line-height: 24px; text-align: left; max-width: none;
  }
  body[data-page="social-impact"] .si-partners__more-note {
    display: block; background: #F0EADE; border-radius: 4px;
    padding: 13px 16px; text-align: center;
    font-family: 'Inter', sans-serif; font-weight: 400;
    font-size: 14px; line-height: 20px; color: #46474B; margin: 16px 0 0;
  }
  body[data-page="social-impact"] .si-partners__additional { display: none; }

  /* ---------- ACROSS THE UNITED STATES ---------- */
  body[data-page="social-impact"] .si-us { padding: 64px 0 0; }
  body[data-page="social-impact"] .si-us__grid { display: block; }
  body[data-page="social-impact"] .si-us__copy { padding: 0 35px; }
  body[data-page="social-impact"] .si-us__copy h2 {
    font-size: 28px; line-height: 1.2; text-transform: capitalize; margin: 0;
  }
  body[data-page="social-impact"] .si-us__copy p { font-size: 14px; line-height: 26px; margin-top: 16px; }
  body[data-page="social-impact"] .si-us__card {
    margin: 32px 17px 0; padding: 0; background: #F0EADE; gap: 0;
  }
  body[data-page="social-impact"] .si-us__card-label {
    font-size: 12px; line-height: 24px; letter-spacing: 1px;
    text-align: center; color: #E26326; border-bottom: none;
    margin: 0; padding: 15px 0 14px;
  }
  body[data-page="social-impact"] .si-us__chapters {
    /* Figma wants 4 fit-content cols, but at 390 the longest entry
       ("San Francisco, CA" = 104px @12px) can't share a 4-col card —
       4×104 overflows the 356px card. 3 cols keeps every "City, ST"
       on one line per SI-r17 (padding trimmed so the 104px max fits a
       (332-12)/3 = 106px column). */
    grid-template-columns: repeat(3, 1fr);
    row-gap: 15px; column-gap: 6px;
    font-size: 12px; line-height: 24px; color: #46474B;
    padding: 0 12px 20px;
  }
  body[data-page="social-impact"] .si-us__chapters span { white-space: nowrap; }

  /* ---------- SERVICE IN MOTION (swipe carousel) + UNIVERSITY PARTNERS ---------- */
  body[data-page="social-impact"] .si-globe-inits { padding: 24px 0 0; }
  body[data-page="social-impact"] .si-globe-inits__wrap { background: transparent; padding: 0 35px; }
  body[data-page="social-impact"] .si-globe-inits__label { font-size: 20px; line-height: 1.2; }

  body[data-page="social-impact"] .si-service-grid {
    display: flex; flex-wrap: nowrap; gap: 16px; margin-top: 18px;
    overflow-x: auto; scroll-snap-type: x mandatory;
    -ms-overflow-style: none; scrollbar-width: none;
  }
  body[data-page="social-impact"] .si-service-grid::-webkit-scrollbar { display: none; }
  body[data-page="social-impact"] .si-service-tile,
  body[data-page="social-impact"] .si-service-tile--zoom {
    flex: 0 0 100%; height: auto; background-size: 0 0;
    scroll-snap-align: center; overflow: visible;
  }
  body[data-page="social-impact"] .si-service-tile::before {
    content: ''; display: block;
    height: min(255px, calc(255 / 390 * 100vw)); border-radius: 8px;
    background-image: inherit; background-size: cover; background-position: center;
  }
  body[data-page="social-impact"] .si-service-tile__hover {
    position: static; inset: auto; opacity: 1; background: transparent;
    padding: 14px 0 0; display: block;
  }
  body[data-page="social-impact"] .si-service-tile__hover p {
    color: #282828; text-align: left; font-size: 14px; line-height: 28px; max-width: none;
  }
  body[data-page="social-impact"] .si-service-nav {
    display: flex; justify-content: center; gap: 20px; margin-top: 18px;
  }
  body[data-page="social-impact"] .si-service-nav__btn {
    width: 40px; height: 40px; border-radius: 100px;
    border: 1px solid #5E2A29; background: transparent; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    padding: 0; flex-shrink: 0;
  }
  body[data-page="social-impact"] .si-service-nav__btn svg { width: 18px; height: 18px; display: block; }
  body[data-page="social-impact"] .si-service-nav__btn[data-dir="-1"] svg { transform: scaleX(-1); }

  body[data-page="social-impact"] .si-uni-label { font-size: 20px; line-height: 1.2; margin-top: 60px; }
  body[data-page="social-impact"] .si-uni-grid {
    display: flex; flex-direction: column; gap: 0;
    background: #F0EADE; padding: 32px 24px; margin-top: 20px;
  }
  body[data-page="social-impact"] .si-uni-card {
    background: transparent; border: none; height: auto;
    padding: 0 0 40px; gap: 16px;
  }
  body[data-page="social-impact"] .si-uni-grid .si-uni-card:last-child { padding-bottom: 0; }
  body[data-page="social-impact"] .si-uni-card__logo { max-width: 50%; height: 67px; }
  body[data-page="social-impact"] .si-uni-card__desc {
    font-size: 12px; line-height: 22px; text-align: left; flex: none;
  }
  body[data-page="social-impact"] .si-uni-card__more {
    font-size: 12px; line-height: 12px; font-style: italic;
    text-align: center; align-self: center; margin-top: 8px;
  }

  /* ---------- AROUND THE WORLD STATS (5-stat column | cream 27M card) ---------- */
  body[data-page="social-impact"] .si-world {
    padding: 64px 35px 0;
    display: grid; grid-template-columns: 1fr 145px;
    column-gap: 15px; align-items: stretch;
  }
  body[data-page="social-impact"] .si-world__heading {
    grid-column: 1 / -1; font-size: 28px; line-height: 1.2; margin: 0 0 36px;
  }
  body[data-page="social-impact"] .si-world__stats {
    grid-column: 1; grid-template-columns: none;
    display: flex; flex-direction: column; justify-content: space-between;
    gap: 24px; margin: 0; padding: 0;
  }
  body[data-page="social-impact"] .si-stat__big { font-size: 24px; line-height: 1.2; }
  body[data-page="social-impact"] .si-stat__label {
    font-size: 14px; line-height: 20px; letter-spacing: 0; color: #5A381C; margin-top: 6px;
  }
  body[data-page="social-impact"] .si-world__total {
    grid-column: 2; align-self: stretch; margin: 0; border-radius: 0;
    background: rgba(240, 234, 222, 0.5);
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    padding: 24px 8px;
  }
  body[data-page="social-impact"] .si-world__total-big { font-size: 44px; line-height: 1.1; }
  body[data-page="social-impact"] .si-world__total-label {
    font-size: 20px; line-height: 24px; letter-spacing: 0; color: #5A381C;
    text-align: center; margin-top: 8px;
  }
  /* Figma mobile label reads "total lives touched" (desktop stays "lives touched") */
  body[data-page="social-impact"] .si-world__total-label::before { content: 'total\00A0'; }

  /* ---------- INITIATIVES ACROSS THE GLOBE (editorial image/title/desc) ---------- */
  body[data-page="social-impact"] .si-globe { padding: 64px 35px 0; }
  body[data-page="social-impact"] .si-globe__label { font-size: 20px; line-height: 1.2; color: #46474B; }
  body[data-page="social-impact"] .si-globe__grid {
    display: flex; flex-direction: column; gap: 32px; margin-top: 24px;
  }
  body[data-page="social-impact"] .si-init-card {
    background: #FFFFFF; border: 1px solid #EFEFEF; border-radius: 8px;
    height: auto; padding: 13px;
    display: flex; flex-direction: column; gap: 0;
  }
  body[data-page="social-impact"] .si-init-card__photo {
    height: min(170px, calc(170 / 390 * 100vw)); border-radius: 8px;
  }
  /* SI-r18: keep the UPCOMING tag on mobile (matches desktop/iPad).
     The desktop sizing uses min(…/1920*100vw) which collapses to ~2px
     at 390, so restore legible fixed px. Position (top/right of the
     relative photo) is inherited from the base rule. */
  body[data-page="social-impact"] .si-init-card__badge {
    display: block;
    font-size: 10px;
    line-height: 1.6;
    letter-spacing: 0.4px;
    padding: 4px 12px;
    border-radius: 2px 0 0 2px;
  }
  body[data-page="social-impact"] .si-init-card__body { padding: 14px 2px 4px; gap: 8px; }
  body[data-page="social-impact"] .si-init-card__title {
    font-size: 16px; line-height: 24px; min-height: 0;
    display: block; text-align: center;
  }
  body[data-page="social-impact"] .si-init-card__desc {
    font-size: 12px; line-height: 22px; padding: 0; text-align: left;
  }

  /* ---------- OUR UNIQUE GLOBAL APPROACH (10-care accordion rows) ---------- */
  body[data-page="social-impact"] .si-approach { padding: 56px 35px 0; }
  body[data-page="social-impact"] .si-approach__head { margin-bottom: 36px; }
  body[data-page="social-impact"] .si-approach__label { font-size: 20px; line-height: 1.2; color: #46474B; }
  body[data-page="social-impact"] .si-approach__body { font-size: 14px; line-height: 26px; margin-top: 16px; }
  body[data-page="social-impact"] .si-approach__grid {
    display: flex; flex-direction: column; gap: 6px;
  }
  body[data-page="social-impact"] .si-care-tile {
    height: auto; min-height: 0; background-image: none !important;
    background-color: #EFEADF; border-radius: 4px;
    display: flex; flex-wrap: wrap; align-items: center; align-content: flex-start;
    justify-content: space-between;
    padding: 19px 16px;
    cursor: pointer;
  }
  body[data-page="social-impact"] .si-approach__grid > .si-care-tile { background-position: center; }
  body[data-page="social-impact"] .si-care-tile__overlay { display: none; }
  /* SI-r19: collapsed by default; revealed below the row when the row
     is tapped (.is-open toggled by the inline accordion script). */
  body[data-page="social-impact"] .si-care-tile__hover {
    display: none; position: static; inset: auto;
    flex: 0 0 100%; width: 100%; opacity: 1;
    background: transparent; padding: 0; gap: 0;
    /* SI-r30: lay out after the ::after chevron so chip + chevron share
       the title row and the description wraps cleanly below them. */
    order: 10;
  }
  body[data-page="social-impact"] .si-care-tile.is-open .si-care-tile__hover {
    display: block; padding: 12px 0 2px;
  }
  /* The chip already shows "01. Health Care", so the hover h4 (which
     repeats the number + name) is suppressed — only the description
     paragraph is revealed. */
  body[data-page="social-impact"] .si-care-tile.is-open .si-care-tile__hover h4 { display: none; }
  body[data-page="social-impact"] .si-care-tile.is-open .si-care-tile__hover p {
    font-family: 'Inter', sans-serif; font-weight: 400;
    font-size: 14px; line-height: 22px; color: #5E2A29; margin: 0;
  }
  body[data-page="social-impact"] .si-care-tile__chip {
    position: static; left: auto; top: auto; min-width: 0;
    background: transparent; border-radius: 0; padding: 0;
    flex-direction: row; align-items: baseline; gap: 0;
  }
  /* The desktop ".si-care-tile:hover .si-care-tile__chip{opacity:0}" rule
     fires on touch (sticky :hover) and would blank the row title when
     tapped. The mobile chip IS the accordion's permanent title, so keep
     it fully opaque regardless of hover/open state (SI-r19). */
  body[data-page="social-impact"] .si-care-tile:hover .si-care-tile__chip,
  body[data-page="social-impact"] .si-care-tile.is-open .si-care-tile__chip {
    opacity: 1;
  }
  body[data-page="social-impact"] .si-care-tile__num {
    font-size: 20px; line-height: 29px; font-weight: 400;
  }
  body[data-page="social-impact"] .si-care-tile__num::after { content: '.\00a0'; }
  body[data-page="social-impact"] .si-care-tile__name {
    font-size: 20px; line-height: 29px; font-weight: 400; text-transform: capitalize;
  }
  body[data-page="social-impact"] .si-care-tile::after {
    content: ''; flex-shrink: 0; margin-left: auto;
    /* SI-r30: styles.css's legacy mobile accordion sets .si-care-tile::after
       to position:absolute; top:50%, which floats the chevron into the
       middle of the expanded description text. Keep it in flex flow,
       pinned to the title row (the hover block is order:10 so it wraps
       below chip + chevron). */
    position: static;
    width: 9px; height: 9px;
    border-right: 2px solid #5E2A29; border-bottom: 2px solid #5E2A29;
    transform: translateY(-3px) rotate(45deg);
    transition: transform 0.2s ease;
  }
  /* SI-r19: rotate the chevron to point up when the row is open. */
  body[data-page="social-impact"] .si-care-tile.is-open::after {
    transform: translateY(3px) rotate(225deg);
  }
  body[data-page="social-impact"] .si-care10-cta {
    margin: 36px auto 0; width: fit-content; max-width: 100%; height: auto;
    padding: 13px 24px; font-size: 14px; gap: 12px; white-space: nowrap;
  }
  /* SI-r20: the desktop svg sizing min(20px, 20/1920*100vw) collapses
     to ~4px at 390, so the circle+arrow read as a dot. Restore the
     20px Figma button-arrow size (matches the SRLC mobile arrow). */
  body[data-page="social-impact"] .si-care10-cta svg {
    width: 20px; height: 20px;
  }

  /* ---------- CTA BAND (two text+button pairs, then closing link line) ---------- */
  body[data-page="social-impact"] .si-cta-band {
    height: auto; grid-template-columns: none; gap: 34px;
    display: flex; flex-direction: column; align-items: center;
    padding: 48px 24px 44px; margin-top: 64px;
  }
  /* SRLC socials row — mobile (replaces the old closing line). Reset the
     vw-min icon sizing so the glyphs don't collapse tiny at 390px. */
  body[data-page="social-impact"] .si-follow {
    order: 4; margin: 0; align-items: center;
  }
  body[data-page="social-impact"] .si-follow__label { font-size: 18px; margin: 0 0 12px; }
  body[data-page="social-impact"] .si-follow__icons { gap: 16px; }
  body[data-page="social-impact"] .si-follow__icons a,
  body[data-page="social-impact"] .si-follow__icons img { width: 42px; height: 42px; }
  body[data-page="social-impact"] .si-follow__icons li:nth-child(1) img { width: 24px; height: 24px; }
  body[data-page="social-impact"] .si-cta-col { gap: 16px; }
  body[data-page="social-impact"] .si-cta-col__text { font-size: 16px; line-height: 24px; max-width: 278px; }
  body[data-page="social-impact"] .si-cta-col__btn {
    width: auto; min-width: 179px; height: 44px; font-size: 14px;
    gap: 12px; padding: 0 24px;
  }
  body[data-page="social-impact"] .si-cta-col__btn svg { width: 20px; height: 20px; }
}