.v2-alumni-story { background: #0b2c60; }
.sx-stories { padding: clamp(64px, 7vw, 134px) 0 90px; color: #fff; font-family: "Noto Sans SC", sans-serif; }
.sx-stories *, .sx-stories *::before, .sx-stories *::after { box-sizing: border-box; }
.sx-stories * { font-family: inherit; }
.sx-stories h1, .sx-stories h2, .sx-stories p { margin: 0; }
.sx-container { width: 85%; max-width: 1628px; margin: 0 auto; }
.sx-intro { text-align: center; }
.sx-intro h1 { color: #ffe0a3; font-size: clamp(28px, 2.5vw, 48px); font-weight: 700; line-height: 1.4; }
.sx-lead { max-width: 800px; margin: 36px auto 40px !important; font-size: clamp(16px, 1.25vw, 24px); line-height: 1.85; }
.sx-feature { position: relative; display: block; width: 100%; height: auto; aspect-ratio: 1628 / 850; border: 10px solid #294670; margin: 0 auto 70px; }
.sx-feature img { display: block; width: 100%; height: 100%; object-fit: cover; }
.sx-feature:focus-visible { outline: 3px solid #ffde90; outline-offset: 5px; }
.sx-play { position: absolute; left: 50%; top: 50%; width: 64px; aspect-ratio: 1; transform: translate(-50%, -50%); background: url('../../images/playbtn.png') center / contain no-repeat; pointer-events: none; }
/* Keep the video and its close control comfortably inside short viewports. */
.v2-alumni-story .ax-preview { width: min(962px, calc(100% - 24px), calc((80dvh - 100px) * 16 / 9 + 2px)); }
.v2-alumni-story .ax-preview iframe,
.v2-alumni-story .ax-preview-video { height: auto; aspect-ratio: 16 / 9; object-fit: contain; }
.sx-list { display: grid; gap: clamp(28px, 2.3vw, 44px); }
.sx-story { display: grid; grid-template-columns: minmax(0, 36fr) minmax(0, 60fr); align-items: center; gap: 4%; padding: 20px 36px; min-height: clamp(200px, 14.2vw, 272px); background: linear-gradient(145deg, #1e4684, #0e2855); scroll-margin-top: calc(var(--hx-header-h, 120px) + 24px); }
.sx-profile { display: grid; grid-template-columns: minmax(0, 44fr) minmax(0, 56fr); align-items: center; gap: 24px; min-width: 0; }
.sx-avatar { display: block; width: 100%; height: auto; aspect-ratio: 228 / 216; object-fit: cover; object-position: top; border-radius: 2px; }
.sx-info { grid-column: 2; min-width: 0; padding-bottom: 20px; border-bottom: 2px solid; border-image: linear-gradient(90deg, #ffe0a3, #4774c4) 1; }
.sx-info h2 { margin-bottom: 8px; font-size: clamp(21px, 1.98vw, 38px); font-weight: 600; line-height: 1.4; overflow-wrap: anywhere; }
.sx-info p { color: #35d0fd; font-size: clamp(15px, 1.35vw, 26px); line-height: 1.65; overflow-wrap: anywhere; }
.sx-quote { min-width: 0; margin: 0; padding: 10px 0; border: 0; font-size: clamp(16px, 1.35vw, 26px); line-height: 1.7; }
.sx-copy { overflow-wrap: anywhere; }
.sx-role { white-space: pre-line; }
.sx-phrase { display: inline-block; max-width: 100%; overflow-wrap: anywhere; vertical-align: top; }
.sx-mobile-break { display: none; }
@media (max-width: 767px) {
  .sx-stories { padding: 60px 0 48px; background: #102953; }
  .sx-container { width: calc(100% - 24px); }
  .sx-intro h1 { font-size: 26px; }
  .sx-lead { max-width: 340px; margin: 18px auto 24px !important; padding: 0 12px; font-size: 14px; }
  .sx-feature { border-width: 5px; margin-bottom: 20px; }
  .v2-alumni-story .sx-play { width: calc(88 * var(--sm-px)); }
  .sx-list { gap: 16px; }
  .sx-story { grid-template-columns: minmax(0, 1fr); gap: 18px; padding: 10px 10px 18px; min-height: 0; }
  .sx-profile { grid-template-columns: minmax(0, 114px) minmax(0, 1fr); gap: 20px; }
  .sx-info { padding-bottom: 12px; max-width: 220px; }
  .sx-info h2 { font-size: 21px; margin-bottom: 8px; }
  .sx-info p { font-size: 14px; }
  .sx-quote { padding: 0; font-size: 14px; line-height: 1.65; }
}
@media (max-width: 360px) {
  .sx-profile { grid-template-columns: minmax(0, 96px) minmax(0, 1fr); gap: 16px; }
  .sx-info h2 { font-size: 20px; }
}