/* Motion is opt-in through JS and disabled by the reduced-motion preference. */
.breakout.is-assembling .breakout__brick {
  animation: brick-assemble .85s cubic-bezier(.2,.85,.28,1.05) var(--drop-delay, 0ms) both;
}
@keyframes brick-assemble {
  0% { opacity: 0; transform: translate3d(var(--drop-x, 0px), -75vh, 0) rotate(var(--drop-turn, 0deg)); }
  68% { opacity: 1; transform: translate3d(0, 9px, 0) rotate(-3deg); }
  84% { transform: translate3d(0, -5px, 0) rotate(2deg); }
  100% { opacity: 1; transform: translate3d(0, 0, 0) rotate(0); }
}

.motion-ready .hero__outline { transform: translate3d(0, var(--hero-shift, 0px), 0); }
.motion-ready .hero::before { transform: translate3d(var(--hero-circle-x, 0px), var(--hero-circle-y, 0px), 0); }
.motion-ready .section-label i { transform: scaleX(var(--motion-progress, 0)); transform-origin: left center; }
.motion-ready .instagram-grid__tile:nth-child(odd) { transform: translate3d(0, var(--updates-odd, 0px), 0); }
.motion-ready .instagram-grid__tile:nth-child(even) { transform: translate3d(0, var(--updates-even, 0px), 0); }
.motion-ready .profile__figure { transform: translate3d(0, var(--profile-shift, 0px), 0) rotate(var(--profile-turn, 0deg)); }
.motion-ready .event-article__thumb span { transform: rotate(var(--event-turn, -13deg)); }
.motion-ready .change-card > i { transform: translate3d(0, var(--changes-shift, 0px), 0) rotate(var(--changes-turn, 0deg)); }
.motion-ready .future__year { translate: 0 var(--future-shift, 0px); }
.motion-ready .faq summary i { transform: rotate(var(--faq-turn, 0deg)); }
.motion-ready .contact { position: relative; isolation: isolate; overflow: hidden; }
.motion-ready .contact::before {
  content: "";
  position: absolute;
  z-index: 0;
  top: 3%;
  right: -8%;
  width: min(38vw, 480px);
  aspect-ratio: 1;
  border: 2px solid rgba(255,253,248,.22);
  border-radius: 50%;
  transform: translate3d(var(--contact-x, 0px), var(--contact-y, 0px), 0);
  pointer-events: none;
}
.motion-ready .contact > * { position: relative; z-index: 1; }
.motion-ready .site-footer__line path { animation: none; }

@media (max-width: 767px) {
  .motion-ready .profile__figure { transform: translate3d(0, var(--profile-shift-mobile, 0px), 0) rotate(var(--profile-turn, 0deg)); }
  .motion-ready .contact::before { width: 65vw; right: -20%; top: 8%; }
}

@media (prefers-reduced-motion: reduce) {
  .breakout.is-assembling .breakout__brick { animation: none; }
}