:root {
  --motion-ease: cubic-bezier(.22, 1, .36, 1);
}

.motion-ready [data-motion] {
  transition:
    opacity .78s var(--motion-ease) var(--motion-delay, 0ms),
    transform .9s var(--motion-ease) var(--motion-delay, 0ms),
    filter .82s var(--motion-ease) var(--motion-delay, 0ms),
    clip-path 1s var(--motion-ease) var(--motion-delay, 0ms);
  will-change: opacity, transform, filter;
}

.motion-ready [data-motion="rise"]:not(.motion-in),
.motion-ready [data-motion="heading"]:not(.motion-in) {
  filter: blur(5px);
  opacity: 0;
  transform: translate3d(0, 28px, 0);
}

.motion-ready [data-motion="heading"]:not(.motion-in) {
  clip-path: inset(0 0 100% 0);
  transform: translate3d(0, 20px, 0);
}

.motion-ready [data-motion="card"]:not(.motion-in) {
  filter: blur(3px);
  opacity: 0;
  transform: translate3d(0, 24px, 0) scale(.975);
}

.motion-ready [data-motion="image"]:not(.motion-in) {
  clip-path: inset(0 0 14% 0 round 3px);
  filter: saturate(.72) blur(3px);
  opacity: 0;
  transform: translate3d(0, 24px, 0) scale(.985);
}

.motion-ready [data-motion="fade"]:not(.motion-in) { opacity: 0; }

.motion-ready .topbar-inner {
  animation: site-header-in .65s var(--motion-ease) both;
}
.motion-ready .site-header .brand {
  animation: site-header-in .8s var(--motion-ease) .06s both;
}
.motion-ready .header-motto {
  animation: site-header-in .8s var(--motion-ease) .14s both;
}
.motion-ready .header-admission,
.motion-ready .menu-toggle {
  animation: site-header-in .8s var(--motion-ease) .2s both;
}
.motion-ready .nav-inner > a {
  animation: site-nav-in .62s var(--motion-ease) both;
  animation-delay: calc(.18s + var(--nav-index, 0) * 35ms);
}

@keyframes site-header-in {
  from { filter: blur(5px); opacity: 0; transform: translateY(-12px); }
  to { filter: blur(0); opacity: 1; transform: translateY(0); }
}
@keyframes site-nav-in {
  from { opacity: 0; transform: translateY(-8px); }
  to { opacity: 1; transform: translateY(0); }
}

.button .icon,
.text-link .icon,
.notice-row > .icon {
  transition: transform .35s var(--motion-ease);
}
.button:hover .icon,
.text-link:hover .icon,
.notice-row:hover > .icon { transform: translateX(5px); }

.motion-ready [data-motion="image"] img,
.motion-ready .gallery-item img,
.motion-ready .life-card > img {
  transition: transform .85s var(--motion-ease), filter .6s ease;
}

@media (hover: hover) {
  .motion-ready [data-motion="image"]:hover img,
  .motion-ready .gallery-item:hover img,
  .motion-ready .life-card:hover > img { transform: scale(1.035); }

  .motion-ready .why-grid article,
  .motion-ready .achievement-preview article,
  .motion-ready .values-grid > article,
  .motion-ready .leader-card,
  .motion-ready .album-card,
  .motion-ready .details-list article {
    transition: transform .45s var(--motion-ease), box-shadow .45s ease, border-color .35s ease;
  }
  .motion-ready .why-grid article:hover,
  .motion-ready .achievement-preview article:hover,
  .motion-ready .values-grid > article:hover,
  .motion-ready .leader-card:hover,
  .motion-ready .album-card:hover,
  .motion-ready .details-list article:hover {
    border-color: rgba(164, 124, 36, .38);
    box-shadow: 0 18px 44px rgba(59, 16, 24, .08);
    transform: translateY(-5px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .motion-ready [data-motion],
  .motion-ready .topbar-inner,
  .motion-ready .site-header .brand,
  .motion-ready .header-motto,
  .motion-ready .header-admission,
  .motion-ready .menu-toggle,
  .motion-ready .nav-inner > a {
    animation: none !important;
    clip-path: none !important;
    filter: none !important;
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}
