.origin-story {
  padding: 92px 0 76px;
  background: #142031;
  color: #f5f7fa;
  text-align: left;
  scroll-margin-top: 80px;
}
.origin-story-heading { max-width: 820px; margin-bottom: 56px; }
.origin-story .origin-story-eyebrow { margin: 0 0 20px; color: #ffaabb; font-size: 12px; font-weight: 700; letter-spacing: 2.5px; text-transform: uppercase; }
.origin-story h2 { margin: 0 0 24px; font-size: 48px; line-height: 1.15; letter-spacing: -1.4px; text-transform: none; }
.origin-story h2 > span { color: #ffb4c3; }
.origin-story-heading > p:last-of-type { margin: 0; color: #bbc6d5; font-size: 18px; line-height: 1.7; }
.origin-story-scroll-hint { display: none; margin-top: 28px; color: #bbc6d5; font-size: 12px; letter-spacing: .8px; }
.origin-story-scroll-hint > span { margin-left: 10px; color: #ffaabb; }
.origin-story.is-animated .origin-story-scroll-hint { display: inline-block; }
.origin-story-layout { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); align-items: start; gap: 70px; }
.origin-story-visual { grid-column: 2; grid-row: 1; min-width: 0; }
.origin-story.is-animated .origin-story-visual { position: sticky; top: max(var(--story-top, 86px), calc(50vh - 252px)); }
.origin-story-stage { overflow: hidden; border: 1px solid #e4e2df; border-radius: 22px; background: #f6f3ee; color: #243247; box-shadow: 0 24px 70px rgba(0, 0, 0, .16); }
.origin-story-stage-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 20px 24px 4px; }
.origin-story-wordmark { font-size: 18px; font-weight: 700; letter-spacing: -1px; }
.origin-story-wordmark > span { color: #a91832; }
.origin-story-chapter { color: #657184; font-family: Arial, sans-serif; font-size: 11px; font-weight: 600; letter-spacing: 1px; text-transform: uppercase; }
.origin-story-art { display: block; width: 100%; height: auto; font-family: Arial, sans-serif; }
.origin-story-art [data-story-scene] { opacity: 0; }
.origin-story-art [data-story-scene="3"] { opacity: 1; }
.origin-story .origin-story-caption { min-height: 42px; margin: 0; padding: 0 20px; color: #4f5c6f; font-size: 14px; font-weight: 600; line-height: 1.5; text-align: center; }
.origin-story-progress { display: flex; gap: 8px; padding: 0 24px 22px; }
.origin-story-progress > span { flex: 1; height: 3px; overflow: hidden; border-radius: 4px; background: #dededc; }
.origin-story-progress i { display: block; height: 100%; background: #a91832; transform-origin: left; }
.origin-story-chapters { grid-column: 1; grid-row: 1; min-width: 0; margin: 0; padding: 0; list-style: none; }
.origin-story-step { position: relative; padding: 0 0 40px 24px; border-left: 2px solid #344155; }
.origin-story-step:last-child { padding-bottom: 0; }
.origin-story.is-animated .origin-story-step { display: flex; min-height: 65vh; flex-direction: column; justify-content: center; padding: 48px 0 48px 26px; }
.origin-story.is-animated .origin-story-step.is-active { border-color: #f49aad; }
.origin-story-number { display: block; margin-bottom: 22px; color: #ffaabb; font-family: Arial, sans-serif; font-size: 13px; font-weight: 700; letter-spacing: 1px; }
.origin-story-number > span { margin-left: 12px; color: #bac6d6; font-size: 10px; letter-spacing: 1.5px; text-transform: uppercase; }
.origin-story h3 { margin: 0 0 20px; color: #f5f7fa; font-size: 29px; font-weight: 700; line-height: 1.3; letter-spacing: -.6px; text-transform: none; }
.origin-story-step p { max-width: 410px; margin: 0; color: #bbc6d5; font-size: 17px; line-height: 1.8; }
.origin-story-ending { margin-top: 72px; padding-top: 48px; border-top: 1px solid #344155; text-align: center; }
.origin-story-ending p { margin: 0 0 24px; color: #f5f7fa; font-size: 26px; font-weight: 700; line-height: 1.3; }
.origin-story .origin-story-cta { padding: 13px 26px; border: 1px solid #ffc0cd; border-radius: 6px; background: #ffc0cd; color: #391823; font-size: 14px; font-weight: 700; text-transform: none; }
.origin-story .origin-story-cta:hover { background: #ffd5de; border-color: #ffd5de; color: #391823; }
.origin-story .origin-story-cta:focus { outline: 3px solid #fff; outline-offset: 4px; color: #391823; }
@media (min-width: 992px) and (max-height: 780px) {
  .origin-story.is-animated .origin-story-visual { top: var(--story-top, 86px); }
  .origin-story-art { max-height: 360px; }
}
@media (max-width: 991px) {
  .origin-story-layout { display: block; }
  .origin-story-visual { max-width: 650px; margin: 0 auto 34px; }
  .origin-story.is-animated .origin-story-visual { top: var(--story-top, 74px); z-index: 1; margin-bottom: 0; padding-bottom: 16px; background: #142031; }
  .origin-story.is-animated .origin-story-visual::before { content: ""; position: absolute; right: 0; bottom: 100%; left: 0; height: 18px; background: #142031; }
  .origin-story-art { height: clamp(185px, 29vh, 260px); }
  .origin-story-chapters { max-width: 650px; margin: 0 auto; }
  .origin-story.is-animated .origin-story-step { min-height: 62vh; padding-top: 36px; padding-bottom: 36px; }
  .origin-story-step p { max-width: 540px; }
}
@media (max-width: 767px) {
  .origin-story { padding: 58px 0 52px; }
  .origin-story-heading { margin-bottom: 34px; }
  .origin-story h2 { font-size: 35px; letter-spacing: -.8px; }
  .origin-story-heading > p:last-of-type { font-size: 16px; }
  .origin-story-stage { border-radius: 16px; }
  .origin-story-stage-header { padding: 15px 18px 2px; }
  .origin-story-wordmark { font-size: 16px; }
  .origin-story-chapter { font-size: 10px; }
  .origin-story .origin-story-caption { min-height: 43px; font-size: 12px; }
  .origin-story-progress { padding: 0 18px 17px; }
  .origin-story-step, .origin-story.is-animated .origin-story-step { padding-left: 18px; }
  .origin-story-number { margin-bottom: 18px; }
  .origin-story h3 { font-size: 25px; }
  .origin-story-step p { font-size: 16px; line-height: 1.75; }
  .origin-story-ending { margin-top: 36px; padding-top: 36px; }
  .origin-story-ending p { font-size: 23px; }
}
@media (prefers-reduced-motion: reduce), (max-height: 679px) {
  .origin-story.is-animated .origin-story-visual { position: static; }
  .origin-story.is-animated .origin-story-step { min-height: 0; display: block; padding-top: 0; padding-bottom: 40px; }
  .origin-story.is-animated .origin-story-scroll-hint { display: none; }
}