/* Motion is an enhancement. Content remains visible until the runtime proves it is alive. */
.motion-ready [data-reveal] {
  opacity: 0;
  transform: translate3d(0, 2.4rem, 0);
  transition:
    opacity .95s ease,
    transform 1.15s var(--ease-out);
}
.motion-ready [data-reveal].is-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}
.motion-ready .threshold__copy[data-reveal] {
  transform: translate3d(-2rem, 1rem, 0);
}
.motion-ready .threshold__copy[data-reveal].is-visible { transform: translate3d(0, 0, 0); }
/* The hero statement arrives once, in order: eyebrow, headline, deck, actions. */
.motion-ready .threshold__copy > * {
  opacity: 0;
  transform: translate3d(0, 1.1rem, 0);
  transition: opacity .7s ease, transform .85s var(--ease-out);
}
.motion-ready .threshold__copy.is-visible > * { opacity: 1; transform: translate3d(0, 0, 0); }
.motion-ready .threshold__copy.is-visible > *:nth-child(2) { transition-delay: .12s; }
.motion-ready .threshold__copy.is-visible > *:nth-child(3) { transition-delay: .24s; }
.motion-ready .threshold__copy.is-visible > *:nth-child(4) { transition-delay: .36s; }
/* The headline's lines rise out of their own masks, one after the other —
   the couture counterpart to the block fade every other section gets. */
.motion-ready .threshold h1 .line { display: block; overflow: hidden; }
.motion-ready .threshold h1 .line__in {
  display: block;
  transform: translate3d(0, 114%, 0);
  transition: transform 1.25s var(--ease-out) .1s;
}
.motion-ready .threshold__copy.is-visible h1 .line__in { transform: translate3d(0, 0, 0); }
.motion-ready .threshold__copy.is-visible h1 .line:nth-of-type(2) .line__in { transition-delay: .24s; }
.motion-ready .living-mark {
  opacity: 0;
  transform: translate3d(calc(var(--mark-x) + 2rem), calc(var(--mark-y) + 1rem), 0) rotate(var(--mark-turn)) scale(.94);
  transition: opacity 1.2s ease .2s, transform 1.4s var(--ease-out) .15s;
}
.motion-ready .living-mark.is-visible {
  opacity: 1;
  transform: translate3d(var(--mark-x), var(--mark-y), 0) rotate(var(--mark-turn)) scale(1);
}

.portal-stage__copy.is-swapping > * {
  animation: portal-copy-swap .55s var(--ease-out);
}
.portal-stage__copy.is-swapping > *:nth-child(2) { animation-delay: .03s; }
.portal-stage__copy.is-swapping > *:nth-child(3) { animation-delay: .06s; }
.portal-stage__copy.is-swapping > *:nth-child(4) { animation-delay: .09s; }
.portal-stage__copy.is-swapping > *:nth-child(5) { animation-delay: .12s; }

html.energy-transitioning *,
html.energy-transitioning *::before,
html.energy-transitioning *::after {
  transition-duration: .8s !important;
}

::view-transition-old(root),
::view-transition-new(root) {
  animation-duration: .65s;
  animation-timing-function: var(--ease-out);
}
::view-transition-old(root) { animation-name: energy-out; }
::view-transition-new(root) { animation-name: energy-in; }

@media (hover: hover) and (pointer: fine) {
  [data-tilt] { will-change: transform; }
  .portal-door:hover span { transform: translateX(.25rem); }
  .portal-door span { transition: transform .35s var(--ease-out); }
  .line-link::before {
    content: "";
    position: absolute;
    inset: auto 0 -1px;
    height: 2px;
    background: currentColor;
    transform: scaleX(0);
    transform-origin: right;
    transition: transform .45s var(--ease-out);
  }
  .line-link:hover::before { transform: scaleX(1); transform-origin: left; }
}

@keyframes portal-copy-swap {
  0% { opacity: 0; transform: translateY(1rem); }
  100% { opacity: 1; transform: translateY(0); }
}
@keyframes energy-out { to { opacity: 0; filter: blur(8px); transform: scale(1.01); } }
@keyframes energy-in { from { opacity: 0; filter: blur(8px); transform: scale(.99); } }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
  .ambient-canvas,
  .page-progress,
  .scroll-cue i,
  .living-mark__orbit,
  .living-mark__glow,
  .flavor-wave__track,
  .mother-maker__orbit,
  .closing__rings { display: none !important; }
  .motion-ready [data-reveal],
  .motion-ready [data-reveal].is-visible,
  .motion-ready .living-mark,
  .motion-ready .living-mark.is-visible {
    opacity: 1;
    transform: none;
  }
  .motion-ready .threshold__copy > * { opacity: 1; transform: none; }
  .living-mark__dragon,
  .living-mark__phoenix,
  .duality__dragon,
  .duality__phoenix { transform: none !important; }
  .duality-pair { transition: none; }
  .portal-stage__images img { transition: none; }
  .threshold__beat:not(.is-base) { display: none !important; }
  .threshold__beat.is-current { animation: none; }
  .motion-ready .threshold h1 .line__in { transform: none !important; }
  [data-parallax] img,
  .light-passage__still { transform: none !important; }
  .portal-stage__alt { animation: none !important; opacity: 0 !important; }
  .flavor-wave__steam { display: none !important; }
}