/* =========================================================
   Motion
   Every animation on the site lives in this file and motion.js.
   All of it switches off for visitors whose device asks for
   reduced motion (see the bottom of this file).
   ========================================================= */

/* ---------- Keyframes ---------- */
@keyframes spin { to { rotate: 360deg; } }
@keyframes popIn { from { opacity: 0; scale: .3; } to { opacity: 1; scale: 1; } }
@keyframes dropIn { from { opacity: 0; translate: 0 -48px; scale: .8; } to { opacity: 1; translate: 0 0; scale: 1; } }
@keyframes fadeUp { from { opacity: 0; translate: 0 28px; } to { opacity: 1; translate: 0 0; } }
@keyframes wordPop {
  from { opacity: 0; transform: translateY(60px) scale(.3) rotate(-14deg); }
  60% { opacity: 1; }
  to { opacity: 1; transform: none; }
}
@keyframes letterWave {
  0%, 14%, 100% { translate: 0 0; rotate: 0deg; }
  5% { translate: 0 -.16em; rotate: -8deg; }
  9% { translate: 0 .03em; rotate: 5deg; }
}
@keyframes letterHop {
  0%, 100% { translate: 0 0; rotate: 0deg; }
  40% { translate: 0 -.3em; rotate: -10deg; }
  70% { translate: 0 .04em; rotate: 4deg; }
}
@keyframes letterDrop { from { opacity: 0; translate: 0 -.9em; rotate: -30deg; } to { opacity: 1; translate: 0 0; rotate: 0deg; } }
@keyframes blobIn { from { scale: 0; } to { scale: 1; } }
@keyframes blobBreathe { from { scale: 1; rotate: 0deg; } to { scale: 1.08; rotate: 10deg; } }
@keyframes draw { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
@keyframes photoIn { from { opacity: 0; transform: translateY(90px) rotate(-5deg) scale(.88); } to { opacity: 1; transform: none; } }
@keyframes floaty { 0%, 100% { translate: 0 0; rotate: 0deg; } 50% { translate: 0 -12px; rotate: -.8deg; } }
@keyframes badgeIn { from { opacity: 0; scale: 0; rotate: -220deg; } to { opacity: 1; scale: 1; rotate: 0deg; } }
@keyframes wobble { 0%, 100% { rotate: 0deg; scale: 1; } 50% { rotate: -12deg; scale: 1.08; } }
@keyframes twinkle { 0%, 100% { scale: 0; rotate: 0deg; opacity: 0; } 40%, 60% { scale: 1; rotate: 90deg; opacity: 1; } }
@keyframes bob { 0%, 100% { translate: 0 0; } 50% { translate: 0 -10px; } }
@keyframes hop {
  0%, 60%, 100% { translate: 0 0; scale: 1 1; }
  20% { translate: 0 -7px; scale: .95 1.08; }
  35% { translate: 0 0; scale: 1.1 .9; }
}
@keyframes jelly {
  0%, 100% { scale: 1 1; }
  25% { scale: 1.25 .8; }
  50% { scale: .85 1.2; }
  75% { scale: 1.08 .95; }
}
@keyframes swing { 0%, 100% { rotate: -5deg; } 50% { rotate: 5deg; } }
@keyframes pulse { 0%, 100% { scale: 1; } 50% { scale: 1.1; } }
@keyframes ping { from { scale: 1; opacity: .75; } to { scale: 2.1; opacity: 0; } }
@keyframes pinDrop {
  from { opacity: 0; translate: 0 -110px; }
  60% { opacity: 1; translate: 0 8px; }
  80% { translate: 0 -6px; }
  to { opacity: 1; translate: 0 0; }
}
@keyframes waveFlex { from { scale: 1 1; } to { scale: 1 1.7; } }
@keyframes numPop { from { opacity: 0; scale: 0; rotate: -180deg; } to { opacity: 1; scale: 1; rotate: 0deg; } }
@keyframes nudge {
  0%, 12%, 100% { scale: 1; rotate: 0deg; }
  4% { scale: 1.22; rotate: -12deg; }
  8% { scale: .94; rotate: 6deg; }
}
@keyframes ring {
  0%, 30%, 100% { rotate: 0deg; }
  5% { rotate: -16deg; }
  10% { rotate: 14deg; }
  15% { rotate: -9deg; }
  20% { rotate: 6deg; }
}
@keyframes marquee { to { translate: -50% 0; } }
@keyframes shimmer { 0%, 55% { translate: -130% 0; } 100% { translate: 130% 0; } }
@keyframes wiggle {
  0%, 100% { rotate: 0deg; }
  20% { rotate: -8deg; }
  40% { rotate: 7deg; }
  60% { rotate: -5deg; }
  80% { rotate: 3deg; }
}
@keyframes nudgeRight { 0%, 100% { translate: 0 0; } 50% { translate: 5px 0; } }
@keyframes snowFall { from { translate: 0 0; rotate: 0deg; } to { translate: 0 var(--fall, 900px); rotate: 320deg; } }
@keyframes snowSway { from { translate: calc(var(--sway, 20px) * -1) 0; } to { translate: var(--sway, 20px) 0; } }
@keyframes ballBounce {
  0% { translate: 0 0; scale: 1 1; rotate: 0deg; }
  85% { translate: 0 110px; scale: 1 1; }
  100% { translate: 0 116px; scale: 1.18 .82; rotate: 180deg; }
}
@keyframes shadowPulse { from { scale: .45; opacity: .12; } to { scale: 1; opacity: .3; } }
@keyframes chipPop { 0% { scale: 1; } 40% { scale: 1.15; } 100% { scale: 1; } }

.ch { display: inline-block; }

/* ---------- Scroll progress bar ---------- */
.scroll-progress {
  position: fixed; top: 0; left: 0; right: 0; z-index: 70;
  height: 5px;
  background: linear-gradient(90deg, var(--orange), var(--red), var(--blue));
  transform-origin: 0 50%;
  scale: var(--p, 0) 1;
  pointer-events: none;
}

/* ---------- Scroll reveal (motion.js adds .in as things scroll into view) ---------- */
.js .reveal {
  opacity: 0;
  translate: 0 32px;
  transition:
    opacity .7s ease,
    translate .8s cubic-bezier(.2, .8, .2, 1),
    scale .8s cubic-bezier(.34, 1.56, .64, 1),
    rotate .8s cubic-bezier(.34, 1.56, .64, 1),
    transform .25s ease-out,
    box-shadow .25s ease,
    background-color .15s ease;
}
.js .reveal[data-anim="pop"] { translate: 0 50px; scale: .6; rotate: -8deg; }
.js .reveal[data-anim="pop"]:where(:nth-child(even)) { rotate: 8deg; }
.js .reveal[data-anim="left"] { translate: -70px 0; }
.js .reveal[data-anim="right"] { translate: 70px 0; rotate: 4deg; }
.js .reveal[data-anim="zoom"] { scale: .5; rotate: -12deg; }
.js .reveal.in { opacity: 1; translate: none; scale: none; rotate: none; }

/* ---------- Announcement bar + header ---------- */
.announce-flake { animation: spin 9s linear infinite; }
.announce a::after { content: " →"; display: inline-block; white-space: pre; animation: nudgeRight 1.2s ease-in-out infinite; }
.brand:hover img { animation: wiggle .7s ease; }

/* ---------- Hero: entrance ---------- */
.hero .pill { animation: dropIn .8s cubic-bezier(.34, 1.56, .64, 1) .05s both; }
.tagline > span { cursor: pointer; animation: wordPop .9s cubic-bezier(.34, 1.56, .64, 1) both; }
.tagline > span:nth-child(1) { animation-delay: .25s; }
.tagline > span:nth-child(2) { animation-delay: .43s; }
.tagline > span:nth-child(3) { animation-delay: .61s; }
.hero .lead { animation: fadeUp .8s ease .8s both; }
.hero-actions .btn { animation: popIn .6s cubic-bezier(.34, 1.56, .64, 1) both; }
.hero-actions .btn:nth-child(1) { animation-delay: .95s; }
.hero-actions .btn:nth-child(2) { animation-delay: 1.08s; }

/* Tagline letters take turns hopping every few seconds, and jump when hovered */
.tagline .ch { animation: letterWave 7s ease-in-out infinite; animation-delay: calc(2.4s + var(--i) * 70ms); }
.tagline > span:nth-child(2) .ch { animation-delay: calc(2.8s + var(--i) * 70ms); }
.tagline > span:nth-child(3) .ch { animation-delay: calc(3.2s + var(--i) * 70ms); }
.tagline > span:hover .ch { animation: letterHop .6s cubic-bezier(.34, 1.56, .64, 1) both; animation-delay: calc(var(--i) * 45ms); }

/* Blobs grow in, breathe, and drift with the mouse (motion.js sets --mx/--my) */
.hero-blob {
  animation: blobIn 1.1s cubic-bezier(.34, 1.56, .64, 1) both, blobBreathe 7s ease-in-out 1.2s infinite alternate;
  translate: calc(var(--mx, 0) * -26px) calc(var(--my, 0) * -20px);
  transition: translate .6s ease-out;
}
.hero-blob-orange {
  animation-delay: .15s, 1.35s;
  translate: calc(var(--mx, 0) * 32px) calc(var(--my, 0) * 24px);
}
.squiggle path { stroke-dasharray: 1; }
.squiggle-hero path { animation: draw 1.8s ease .9s both; }

.hero-copy { position: relative; }
.sparkle { position: absolute; width: 26px; height: 26px; pointer-events: none; animation: twinkle 2.8s ease-in-out infinite both; }
.sp-1 { fill: var(--orange); left: 3%; top: 30%; animation-delay: 1.6s; }
.sp-2 { fill: var(--red); right: 5%; top: 16%; width: 20px; height: 20px; animation-delay: 2.3s; }
.sp-3 { fill: var(--blue); right: 12%; top: 64%; width: 16px; height: 16px; animation-delay: 3s; }
.sp-4 { fill: var(--sun); left: 14%; top: 8%; width: 18px; height: 18px; animation-delay: 3.6s; }

.hero-photo {
  animation: photoIn 1.1s cubic-bezier(.2, .9, .3, 1.2) .55s both;
  translate: calc(var(--mx, 0) * 12px) calc(var(--my, 0) * 10px);
  transition: translate .6s ease-out;
}
.photo-frame { animation: floaty 6s ease-in-out 1.8s infinite; }
.photo-frame img { transition: scale .6s ease; }
.hero-photo:hover .photo-frame img { scale: 1.04; }
.badge-venues { cursor: pointer; animation: badgeIn 1s cubic-bezier(.34, 1.56, .64, 1) 1.35s both, wobble 3.2s ease-in-out 2.5s infinite; }

/* Falling snow (motion.js adds the flakes) */
.snow { position: absolute; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; }
.flakelet {
  position: absolute; top: -30px;
  width: calc(10px * var(--s, 1)); height: calc(10px * var(--s, 1));
  animation: snowFall var(--dur, 12s) linear infinite;
}
.flakelet > * { display: block; width: 100%; height: 100%; animation: snowSway calc(var(--dur, 12s) / 4) ease-in-out infinite alternate; }
.flakelet > span { border-radius: 50%; background: var(--snow); opacity: .8; }
.flakelet-svg { width: calc(22px * var(--s, 1)); height: calc(22px * var(--s, 1)); }
.flakelet-svg svg { fill: none; stroke: var(--snow); stroke-width: 1.8; stroke-linecap: round; }

/* Facts band pops in, then each icon keeps moving */
.facts { animation: popIn .8s cubic-bezier(.34, 1.56, .64, 1) 1.15s both; }
.facts li { animation: popIn .6s cubic-bezier(.34, 1.56, .64, 1) both; }
.facts li:nth-child(1) { animation-delay: 1.45s; }
.facts li:nth-child(2) { animation-delay: 1.57s; }
.facts li:nth-child(3) { animation-delay: 1.69s; }
.facts li:nth-child(4) { animation-delay: 1.81s; }
.facts li:nth-child(1) svg { animation: bob 3s ease-in-out 2.4s infinite; }
.facts li:nth-child(3) svg { animation: hop 2.6s ease-in-out 2.6s infinite; }
.facts li:nth-child(4) svg { animation: hop 2.2s ease-in-out 2.9s infinite; }
.clock-hand { transform-box: view-box; transform-origin: 12px 12px; animation: spin 6s linear infinite; }

/* ---------- Section headings: the burst dashes radiate ---------- */
@keyframes burstPulse { 0%, 100% { scale: .8; opacity: .6; } 50% { scale: 1.12; opacity: 1; } }
.burst::before, .burst::after { animation: burstPulse 1.8s ease-in-out infinite; }

/* ---------- Activities ---------- */
.activities .container { position: relative; }
.act { transform: perspective(800px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); }
.act:hover { transform: perspective(800px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)) translateY(-8px); }
.act-icon { position: relative; animation: bob 4s ease-in-out infinite; }
.act:nth-child(2) .act-icon { animation-delay: -.6s; }
.act:nth-child(3) .act-icon { animation-delay: -1.2s; }
.act:nth-child(4) .act-icon { animation-delay: -1.8s; }
.act:nth-child(5) .act-icon { animation-delay: -2.4s; }
.act:nth-child(6) .act-icon { animation-delay: -3s; }
.act:nth-child(7) .act-icon { animation-delay: -3.6s; }
.act-icon::after {
  content: ""; position: absolute; inset: -13px;
  border-radius: 50%;
  border: 2.5px dashed var(--c);
  opacity: 0; scale: .8;
  transition: opacity .3s ease, scale .3s ease;
}
.act:hover .act-icon::after { opacity: 1; scale: 1; animation: spin 7s linear infinite; }
.act:hover .act-icon svg { animation: jelly .7s ease; }

/* Bouncing ball and wobbling cone beside the heading (wide screens) */
.deco { position: absolute; pointer-events: none; }
.deco-ball { width: 54px; left: 2%; top: -10px; animation: ballBounce .7s cubic-bezier(.55, 0, 1, .45) infinite alternate; }
.deco-shadow {
  width: 50px; height: 10px; left: calc(2% + 2px); top: 160px;
  border-radius: 50%; background: var(--blue);
  animation: shadowPulse .7s cubic-bezier(.55, 0, 1, .45) infinite alternate;
}
.deco-cone { width: 52px; right: 3%; top: 96px; transform-origin: 50% 100%; animation: wiggle 2.4s ease-in-out infinite; }
@media (max-width: 1000px) { .deco { display: none; } }

/* ---------- Scrolling ticker bands ---------- */
.marquee { position: relative; z-index: 3; overflow: hidden; padding: 34px 0; margin: -24px 0; pointer-events: none; }
.marquee-band {
  width: 112%; margin-left: -6%;
  rotate: -2.2deg;
  padding: 16px 0;
  background: var(--blue);
  box-shadow: 0 8px 0 rgb(30 36 85 / .15);
}
.marquee-orange .marquee-band { background: var(--orange); rotate: 1.8deg; }
.marquee-track {
  display: flex; align-items: center; width: max-content;
  animation: marquee 30s linear infinite;
  font: 600 clamp(1.25rem, 1rem + 1.4vw, 2rem)/1 var(--font-label);
  letter-spacing: .06em; text-transform: uppercase;
  color: #fff;
}
.marquee-orange .marquee-track { color: var(--ink); animation-direction: reverse; }
.marquee-track > * { flex: none; padding-right: 26px; }
.marquee-track b { display: flex; color: var(--orange); }
.marquee-orange .marquee-track b { color: #fff; }
.marquee-track b svg { width: .8em; height: .8em; fill: currentColor; animation: spin 4s linear infinite; }

/* ---------- Photo strip ---------- */
.photo-track { animation: marquee 60s linear infinite; }
.photo-strip:hover .photo-track { animation-play-state: paused; }
.photo-track img { transition: scale .3s ease, rotate .3s ease; }
.photo-track img:hover { scale: 1.08; rotate: 0deg; }

/* ---------- Play / Learn / Grow ---------- */
.pillars-photos::before { animation: spin 50s linear infinite; }
.pillars-photos::after { animation: pulse 3.2s ease-in-out infinite; }
.ph-smile { animation: bob 5.5s ease-in-out infinite; }
.ph-hang { transform-origin: 50% 6%; animation: swing 3.4s ease-in-out infinite; }
.pillars-photos.in .squiggle path { animation: draw 1.6s ease .5s both; }
.pillar-list li.in h3 .ch { animation: letterDrop .7s cubic-bezier(.34, 1.56, .64, 1) both; animation-delay: calc(var(--d, 0ms) + 250ms + var(--i) * 80ms); }
.pillar-list li:hover h3 .ch { animation: letterHop .6s ease both; animation-delay: calc(var(--i) * 50ms); }

/* ---------- Venues ---------- */
.venue { transform: perspective(900px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); }
.venue.in .venue-pin { animation: pinDrop .9s cubic-bezier(.3, .9, .4, 1) calc(var(--d, 0ms) + .3s) both; }
.venue-pin::after {
  content: ""; position: absolute; inset: 0;
  border-radius: 50%;
  border: 3px solid var(--red-btn);
  animation: ping 2.2s ease-out 1.4s infinite both;
}
.venue-pin svg { animation: hop 2.4s ease-in-out 1.6s infinite; }
.venue-link span { display: inline-block; transition: translate .2s ease; }
.venue-link:hover span { translate: 3px -3px; }
.venues .wave-top { transform-origin: 50% 0; animation: waveFlex 5s ease-in-out infinite alternate; }
.venues .wave-bottom { transform-origin: 50% 100%; animation: waveFlex 6s ease-in-out infinite alternate-reverse; }

/* ---------- How to apply ---------- */
.steps { position: relative; --g: clamp(16px, 3vw, 36px); }
@media (min-width: 1001px) {
  /* Dotted trail joining the number bubbles; it draws itself in */
  .steps::before {
    content: ""; position: absolute; top: -4px; left: 60px;
    right: calc((100% - 3 * var(--g)) / 4 - 60px);
    border-top: 4px dashed var(--snow);
  }
  .js .steps::before { clip-path: inset(0 100% 0 0); transition: clip-path 1.8s ease .4s; }
  .js .steps.in::before { clip-path: inset(0 0 0 0); }
}
.steps li.in::before { animation: numPop .8s cubic-bezier(.34, 1.56, .64, 1) calc(var(--d, 0ms) + .15s) both, nudge 6s ease-in-out 2s infinite; }
.steps li:nth-child(2).in::before { animation-delay: calc(var(--d, 0ms) + .15s), 2.6s; }
.steps li:nth-child(3).in::before { animation-delay: calc(var(--d, 0ms) + .15s), 3.2s; }
.steps li:nth-child(4).in::before { animation-delay: calc(var(--d, 0ms) + .15s), 3.8s; }
.steps li:hover .step-icon { animation: jelly .7s ease; }

/* ---------- Apply ---------- */
.ci-green { position: relative; }
.ci-green::after {
  content: ""; position: absolute; inset: 0;
  border-radius: 14px;
  border: 3px solid var(--whatsapp);
  animation: ping 2.4s ease-out infinite;
}
.btn-red { position: relative; overflow: hidden; isolation: isolate; }
.btn-red::after {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(110deg, transparent 30%, rgb(255 255 255 / .35) 50%, transparent 70%);
  animation: shimmer 3.6s ease-in-out infinite;
}
.field > label { transition: color .2s ease, translate .2s ease; }
.field:focus-within > label { color: var(--blue); translate: 4px 0; }
.chip input:checked + span { animation: chipPop .35s cubic-bezier(.34, 1.56, .64, 1); }

/* ---------- Footer + floating WhatsApp button ---------- */
.footer-tag span { display: inline-block; transition: translate .25s cubic-bezier(.34, 1.56, .64, 1); }
.footer-tag span:hover { translate: 0 -6px; }
.footer-logo { transition: rotate .3s ease, scale .3s ease; }
.footer-logo:hover { rotate: -4deg; scale: 1.05; }
.sticky-wa::before {
  content: ""; position: absolute; inset: 0;
  border-radius: 50%;
  border: 3px solid var(--whatsapp);
  animation: ping 2s ease-out infinite;
}
.sticky-apply.show .sticky-wa svg { animation: ring 3.5s ease-in-out 1s infinite; }


/* ---------- New home sections ---------- */
.value .i { animation: bob 4s ease-in-out infinite; }
.value:nth-child(2) .i { animation-delay: -.8s; }
.value:nth-child(3) .i { animation-delay: -1.6s; }
.value:nth-child(4) .i { animation-delay: -2.4s; }
.value:nth-child(5) .i { animation-delay: -3.2s; }
.value:hover .i { animation: jelly .7s ease; }
.value { transition: translate .2s ease; }
.value:hover { translate: 0 -4px; }
.reasons li:hover .reason-icon { animation: jelly .7s ease; }
.reasons li { transition: box-shadow .25s ease, transform .25s ease; }
.reasons li:hover { transform: translateX(6px); box-shadow: var(--shadow); }
.group-ages { animation: wobble 4s ease-in-out infinite; }
.group-card:nth-child(2) .group-ages { animation-delay: -2s; }
.venue-highlight .i { animation: swing 2.6s ease-in-out infinite; transform-origin: 50% 90%; }
.map-embed.is-loaded iframe { animation: fadeUp .5s ease both; }
.cta-blob { animation: blobBreathe 8s ease-in-out infinite alternate; }
.cta-facts li { transition: background-color .2s ease, translate .2s ease; }
.cta-facts li:hover { background: rgb(255 255 255 / .18); translate: 6px 0; }

/* ---------- Inner page banners ---------- */
.page-eyebrow { animation: dropIn .7s cubic-bezier(.34, 1.56, .64, 1) .05s both; }
.page-title { animation: wordPop .9s cubic-bezier(.34, 1.56, .64, 1) .2s both; }
.page-lead { animation: fadeUp .8s ease .55s both; }
.page-hero .btn-row, .page-hero .thanks-card { animation: fadeUp .8s ease .75s both; }
.chip-nav a { animation: popIn .55s cubic-bezier(.34, 1.56, .64, 1) both; }
.chip-nav a:nth-child(1) { animation-delay: .7s; }
.chip-nav a:nth-child(2) { animation-delay: .8s; }
.chip-nav a:nth-child(3) { animation-delay: .9s; }
.chip-nav a:nth-child(4) { animation-delay: 1s; }
.age-sticker { animation: badgeIn 1s cubic-bezier(.34, 1.56, .64, 1) .6s both, wobble 3.2s ease-in-out 1.8s infinite; }
.ph-blob { animation: blobIn 1.1s cubic-bezier(.34, 1.56, .64, 1) both, blobBreathe 7s ease-in-out 1.2s infinite alternate; }
.ph-blob-2 { animation-delay: .15s, 1.4s; }
.squiggle-page path { animation: draw 1.8s ease .6s both; }

/* ---------- Inner page details ---------- */
.mini-group:hover .i, .other-group:hover .i { animation: nudgeRight .8s ease-in-out infinite; }
.other:hover .other-icon, .choice-card:hover .choice-icon { animation: jelly .7s ease; }
.coach-badge .i { transform-origin: 50% 50%; animation: wiggle 2.8s ease-in-out infinite; }
.coach-badge { animation: pulse 3s ease-in-out infinite; }
.highlight-icon .i { animation: swing 2.6s ease-in-out infinite; transform-origin: 50% 90%; }
.map-placeholder .i { animation: hop 2.2s ease-in-out infinite; }
.faq-item[open] .faq-answer { animation: fadeUp .35s ease both; }
.faq-item { transition: box-shadow .2s ease, translate .2s ease; }
.faq-item:hover { translate: 0 -2px; box-shadow: var(--shadow); }
.faq-aside-icon { animation: wobble 3.4s ease-in-out infinite; }
.lightbox[open] img { animation: popIn .35s cubic-bezier(.34, 1.56, .64, 1) both; }
.choice-card input:checked + .choice-body::after, .age-note:not([hidden]) { animation: chipPop .4s cubic-bezier(.34, 1.56, .64, 1); }
@keyframes shake { 0%, 100% { translate: 0 0; } 20%, 60% { translate: -6px 0; } 40%, 80% { translate: 6px 0; } }
.error-summary:not([hidden]) { animation: shake .45s ease; }
.apply-done-icon { animation: hop 2.2s ease-in-out infinite; }
.mini-venue .venue-pin svg { animation: hop 2.4s ease-in-out 1s infinite; }

/* Confetti pieces (motion.js) */
.confetti { position: fixed; z-index: 100; pointer-events: none; }

/* ---------- Reduced motion: everything off ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .js .reveal { opacity: 1; translate: none; scale: none; rotate: none; }
  .scroll-progress, .snow { display: none; }
}