/* Motion adds to the static Figma layout; the underlying card rotations stay intact. */
@keyframes hero-enter{from{opacity:0;transform:translate3d(var(--entry-x,-64px),18px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@keyframes navbar-enter{from{opacity:0;translate:0 -12px}to{opacity:1;translate:0 0}}
.header{animation:navbar-enter .75s cubic-bezier(.22,1,.36,1) both}
.hero h1 span{animation:hero-enter 1.15s cubic-bezier(.22,1,.36,1) both}
.hero h1 span:nth-child(1){animation-delay:.12s}.hero h1 span:nth-child(2){animation-delay:.24s}
.hero h1 span:nth-child(3){--entry-x:64px;animation-delay:.36s}.hero h1 span:nth-child(4){--entry-x:64px;animation-delay:.48s}
.motion-ready .reveal{transition:opacity .75s ease var(--reveal-delay,0ms),translate .85s cubic-bezier(.22,1,.36,1) var(--reveal-delay,0ms)}
.motion-ready .reveal:not(.is-visible){opacity:0;translate:0 28px}
.motion-ready .reveal.is-visible{opacity:1;translate:0 0}
@media(prefers-reduced-motion:reduce){.header,.hero h1 span{animation:none}.motion-ready .reveal{opacity:1!important;translate:none!important;transition:none!important}}

/* Interactive feedback stays on controls, independent of card entrance animations. */
:where(.pill,.filters button,.carousel-controls button,.menu-toggle,.menu-close,.close-dialog){transition:background-color .22s ease,border-color .22s ease,color .22s ease,box-shadow .22s ease,transform .22s cubic-bezier(.22,1,.36,1)}
.institution-card a{text-decoration:underline;text-decoration-color:transparent;text-underline-offset:4px;transition:text-decoration-color .22s ease}
.institution-card a img,.pill img,.carousel-controls button img,.menu-toggle img{transition:transform .28s cubic-bezier(.22,1,.36,1),opacity .22s ease}
.menu-close{border-radius:50%}
.institution-card a:focus-visible{text-decoration-color:currentColor}
.institution-card a:focus-visible img{transform:translateX(6px)}
.pill:focus-visible{background:#e6dfd6;border-color:#d6cabe;box-shadow:0 6px 16px #20202012;transform:translateY(-2px)}
.pill.primary:focus-visible{background:#5264df;border-color:#5264df;box-shadow:0 6px 18px #5264df30}
.pill:focus-visible img{transform:translateX(3px)}
.filters button:focus-visible{background:#d8c9b8}
.carousel-controls button:focus-visible,.close-dialog:focus-visible,.menu-close:focus-visible{background:#e6dfd6}
@media(hover:hover) and (pointer:fine){
  .institution-card a:hover{text-decoration-color:currentColor}
  .institution-card a:hover img{transform:translateX(6px)}
  .pill:hover{background:#e6dfd6;border-color:#d6cabe;box-shadow:0 6px 16px #20202012;transform:translateY(-2px)}
  .pill.primary:hover{background:#5264df;border-color:#5264df;box-shadow:0 6px 18px #5264df30}
  .pill:hover img{transform:translateX(3px)}
  .filters button:hover{background:#d8c9b8}
  .filters button.active:hover{background:#cebaa3}
  .carousel-controls button:hover{background:#e6dfd6;box-shadow:0 4px 12px #20202010}
  #previous:hover img{transform:translateX(-3px)}
  #next:hover img{transform:translateX(3px)}
  .close-dialog:hover,.menu-close:hover{background:#e6dfd6;transform:rotate(90deg)}
  .menu-toggle:hover img{transform:scale(1.06);opacity:.72}
}
:where(.pill,.filters button,.carousel-controls button,.menu-toggle,.menu-close,.close-dialog):not(:disabled):not([aria-disabled=true]):active{transform:scale(.97);box-shadow:none}
@media(prefers-reduced-motion:reduce){
  :where(.pill,.filters button,.carousel-controls button,.menu-toggle,.menu-close,.close-dialog),.institution-card a,.institution-card a img,.pill img,.carousel-controls button img,.menu-toggle img{transition:none!important}
  :where(.pill,.filters button,.carousel-controls button,.menu-toggle,.menu-close,.close-dialog),.institution-card a img,.pill img,.carousel-controls button img,.menu-toggle img{transform:none!important}
}