/* ===== Fluid motion module (v0.40.0) — site-wide motion in the style of the dashboard calendar tab =====
   Long, soft glides (cubic-bezier(.2,.8,.2,1)), springy little turns on arrows/chevrons (.34,1.56,.64,1), content that
   slides + fades in a beat after its container, and staggered arrivals. Works by re-tuning the motion kit in make.css
   (its --make-ease / --make-dur tokens and make-rise-in / make-pop-in / make-fade-in keyframes) plus a few extra hooks.
   Turn off: Site Customizer → Functions → Experiments → "Fluid motion" (or drop 'make_motion' from STATIC_SHEETS).
   Reduced-motion users get none of it. */

:root {
  --make-ease: cubic-bezier(.2, .8, .2, 1);
  --make-ease-spring: cubic-bezier(.34, 1.56, .64, 1);
  --make-ease-out: cubic-bezier(.4, 0, 1, 1);
  --make-dur-fast: .2s;
  --make-dur: .34s;
  --make-dur-slow: .6s;
}

/* Arrivals: rise a little further, settle softly (same keyframe names → everything already using them follows). */
@keyframes make-rise-in { from { opacity: 0; transform: translateY(18px) scale(.985); } to { opacity: 1; transform: none; } }
@keyframes make-fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes make-pop-in { from { opacity: 0; transform: translateY(-10px) scale(.97); } to { opacity: 1; transform: none; } }
@keyframes make-glide-in { from { opacity: 0; transform: translateX(18px); } to { opacity: 1; transform: none; } }
@keyframes make-drop-in { from { opacity: 0; transform: translateY(-12px); } to { opacity: 1; transform: none; } }

body.make-ready #page-wrapper { animation: make-fade-in .45s ease backwards; }
body.make-ready :is(.make-fb-usercard, .make-category-overview__card, .make-subcat-card, .make-course-card, .make-customizer__card) {
  animation-duration: var(--make-dur-slow) !important; animation-delay: calc(min(var(--i, 0), 12) * 60ms + 60ms); }

/* Page sections (banners, cards, rows on the MAKE pages) glide up in order. */
body.make-ready :is(.make-fbm > *, .make-prof > *, .make-prof__col > *, .make-th-wrap, .make-fbm-history .make-fbm-row) {
  animation: make-rise-in var(--make-dur-slow) var(--make-ease) backwards; }
body.make-ready .make-fbm > *:nth-child(2), body.make-ready .make-prof__col > *:nth-child(1) { animation-delay: 80ms; }
body.make-ready .make-fbm > *:nth-child(3), body.make-ready .make-prof__col > *:nth-child(2) { animation-delay: 160ms; }
body.make-ready .make-fbm > *:nth-child(4), body.make-ready .make-prof__col > *:nth-child(3) { animation-delay: 240ms; }
body.make-ready .make-fbm > *:nth-child(n+5), body.make-ready .make-prof__col > *:nth-child(n+4) { animation-delay: 300ms; }
body.make-ready .make-fbm-history .make-fbm-row:nth-child(-n+12) { animation-delay: calc(var(--i, 0) * 45ms + 120ms); }

/* Hover lift: slower and softer. */
.make-fb-usercard, .make-category-overview__card, .make-subcat-card, .make-continue-course__card, .make-course-card,
.make-team-project, .make-team-stat, .make-fbm-row, .make-prof__card, .make-prof__project {
  transition: transform .45s var(--make-ease), box-shadow .45s var(--make-ease), background-color var(--make-dur) var(--make-ease) !important; }

/* Pressables: colour glides, press springs back. */
.btn, .make-fbm-btn, .make-th__btn, .make-th__chip, .make-nav-drawer__link, .make-nav-drawer__sublink, .make-hero-strip__pill,
.make-customizer__tab, .nav-link, .dropdown-item, .make-fb-cs-chip, .make-team-member__back, .make-team-editbtn {
  transition: background-color var(--make-dur) var(--make-ease), color var(--make-dur) var(--make-ease), border-color var(--make-dur) var(--make-ease),
    box-shadow var(--make-dur) var(--make-ease), transform .42s var(--make-ease-spring), gap var(--make-dur) var(--make-ease), opacity var(--make-dur) var(--make-ease); }

/* Menus and pickers drop down from their anchor, content a beat later. */
.dropdown-menu.show, .popover-region-container, .make-fb-teampick[open] > .make-fb-teampick__panel, .make-fb-cs-subpick__panel, .make-naved__icons {
  animation: make-pop-in .38s var(--make-ease) both !important; }
.dropdown-menu.show > * { animation: make-drop-in .34s var(--make-ease) backwards; animation-delay: 60ms; }

/* Fold-outs (<details>): the inside glides down when opened; chevrons turn with a spring. */
/* (v0.40.2: <details> content is animated by javascript/make_motion.js — open and close — so no CSS keyframe here) */
details > summary :is(svg, [class*="chev"]), [class*="__chev"], .make-fbah__chev { transition: transform .5s var(--make-ease-spring) !important; }

/* Left nav: glides in/out like the calendar panel. */
.make-nav-drawer { transition: transform .5s var(--make-ease), opacity .3s ease !important; }
.make-nav-drawer__submenu { animation: make-drop-in .42s var(--make-ease) backwards; }

/* Tabs (Site Customizer, Divisions, team tabs): the new panel slides in sideways. */
.make-customizer__tabpanel.is-active { animation: make-glide-in .5s var(--make-ease) backwards; }

/* Modals: lift in. */
.modal.show .modal-dialog { animation: make-rise-in .5s var(--make-ease) backwards; }

/* Fields: focus ring eases in. */
input, select, textarea, .form-control, .form-select { transition: border-color var(--make-dur) var(--make-ease), box-shadow var(--make-dur) var(--make-ease), background-color var(--make-dur) var(--make-ease); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-delay: 0s !important; transition-duration: .01ms !important; }
}