/* Only the hero's two product videos; the rest of the landing keeps its layout. */
.story { position: relative; min-width: 0; color: var(--on-deep); }
.story__switch {
  display: inline-flex; padding: 3px; margin-bottom: .75rem; border-radius: 999px;
  background: var(--deep-ink); border: 1px solid rgba(234,244,242,.18);
}
.story__switch button {
  font: 600 .9rem Archivo,sans-serif; min-height: 44px; padding: .4rem 1.1rem;
  border: 0; border-radius: 999px; background: transparent; color: var(--on-deep); cursor: pointer;
}
.story__switch button[aria-selected="true"] { background: var(--surface); color: var(--deep-ink); }
.story__scene { position: relative; }
.story__scene[hidden] { display: none; }
.story__video {
  display: block; width: 100%; height: auto; aspect-ratio: 18 / 19; object-fit: contain;
  background: #0C1614; border-radius: 16px; border: 1px solid rgba(234,244,242,.16);
  box-shadow: 0 24px 48px -26px rgba(0,37,31,.85);
}
.story__foot { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: .25rem 1rem; margin-top: .35rem; }
.story__foot p { margin-right: auto; font-size: .875rem; color: var(--on-deep-soft); }
.story__foot button, .story__transcript summary {
  font: inherit; font-size: .875rem; min-height: 44px; padding: .5rem .1rem; border: 0;
  background: transparent; color: var(--on-deep); text-decoration: underline; text-underline-offset: 3px; cursor: pointer;
}
.story__transcript { margin-top: .25rem; font-size: .95rem; line-height: 1.5; color: var(--on-deep-soft); }
.story__transcript summary { width: fit-content; }
.story__transcript p { margin-block: .5rem; }
.story noscript a { color: inherit; text-decoration: underline; }
html:not(.has-js) .story__switch, html:not(.has-js) .story__foot button { display: none; }
@media (prefers-reduced-motion: reduce) {
  .story *, .story *::before { transition: none !important; animation: none !important; }
}