/* A contained adaptation of the supplied 1997 year-roll animation. */
.about-page .about-history {
  font-family: inherit;
  display: flex;
  flex-direction: column;
  min-height: 560px;
  padding: 26px;
  background: radial-gradient(ellipse at 65% 30%, #123e61 0, #092440 42%, #061a35 80%);
}
.about-page .about-history::after { display: none; }
.about-page .content-panel { min-width: 0; overflow-wrap: anywhere; }
.about-history__heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 34px; }
.about-history__heading > span { color: #ff9b47; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .13em; }
.about-history__stage { position: relative; display: grid; place-items: center; flex: 1; min-height: 290px; margin: 14px 0 22px; perspective: 750px; }
.about-history__years, .about-history__final { grid-area: 1 / 1; width: 100%; text-align: center; transition: opacity .55s ease, transform .55s ease; }
.about-history__year { display: flex; justify-content: center; padding: 12px 0; color: #fff; font-size: clamp(64px, 7.7vw, 118px); font-weight: 800; line-height: 1; font-variant-numeric: tabular-nums; letter-spacing: -.04em; }
.about-history__digit { position: relative; flex: 0 0 .66em; height: 1.1em; perspective: 650px; transform-style: preserve-3d; }
.about-history__digit > span { position: absolute; inset: 0; display: grid; place-items: center; backface-visibility: hidden; }
.about-history.is-rolling .about-history__years, .about-history.is-rolling .about-history__final { transition: none; }
.about-history.is-rolling .about-history__milestone { display: grid; }
.about-history__milestone > span { grid-area: 1 / 1; }
.about-history__era { display: block; margin-top: 17px; color: #ff9b47; font-size: 10px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; }
.about-history__milestone { min-height: 48px; max-width: 300px; margin: 10px auto 0; color: #dfebf6; font-size: 16px; line-height: 1.5; }
.about-history__final { opacity: 0; transform: translateY(12px); pointer-events: none; }
.about-history__final img { display: block; width: min(260px, 80%); height: auto; margin: 0 auto 24px; }
.about-history__final p { margin: 0 0 10px; color: #dfebf6; font-size: 13px; line-height: 1.7; }
.about-history__final strong { display: block; color: #ff9b47; font-size: 17px; }
.about-history__final > span { display: block; margin-top: 21px; color: #fff; font-size: 20px; font-weight: 700; line-height: 1.4; }
.about-history.is-complete .about-history__years { opacity: 0; transform: translateY(-12px); }
.about-history.is-complete .about-history__final { opacity: 1; transform: none; }
.about-page .about-history .evolution-card { position: relative; inset: auto; flex-shrink: 0; margin-top: auto; padding: 20px; background: rgba(3, 17, 34, .65); }
.about-history .evolution-card > strong { font-size: 20px; line-height: 1.4; }
.about-history .evolution-card small { color: #ff9b47; }
.about-history .evolution-line span { font-size: 9px; color: #d7e3ee; }
@media (max-width: 1080px) { .about-history__year { font-size: clamp(80px, 17vw, 130px); } }
@media (max-width: 780px) {
  .about-page .about-history { min-height: 510px; padding: 20px; }
  .about-history__stage { min-height: 260px; }
  .about-history__heading > span { font-size: 9px; letter-spacing: .08em; }
  .about-page .about-history .evolution-card { padding: 17px; }
  .about-history .evolution-card > strong { font-size: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .about-history *, .about-history *::before { animation: none !important; transition: none !important; }
}