/* Fix All That motion layer.
   Background = port of magicui "Animated Grid Pattern" (ui-lab source:
   app/ui-lab/live/generated/magicui--animated-grid-pattern). Blueprint grid
   with squares fading in and out at random cells. transform/opacity only. */

/* scroll reveal (classes applied by fat-motion.js; no JS = everything visible) */
.fm-reveal {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity .45s cubic-bezier(.22, 1, .36, 1),
              transform .45s cubic-bezier(.22, 1, .36, 1);
  will-change: opacity, transform;
}
.fm-in {
  opacity: 1;
  transform: none;
}

/* slow settle on banner photos */
@keyframes fmKb {
  from { transform: scale(1.08); }
  to   { transform: scale(1.02); }
}
.fm-kb { animation: fmKb 12s cubic-bezier(.22, 1, .36, 1) forwards; }

/* ---- animated grid background ---- */
.fm-host { position: relative; overflow: hidden; }
.fm-host > .base-container { position: relative; z-index: 1; }
.fm-grid {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 0;
  /* brand orange grid on cream sections */
  color: #e0560a;
  stroke: rgba(224, 86, 10, .16);
  fill: rgba(224, 86, 10, .16);
}
/* cream grid on the orange CTA band */
.fm-grid.fm-light {
  color: #f2ead9;
  stroke: rgba(242, 234, 217, .28);
  fill: rgba(242, 234, 217, .28);
}
/* fade the grid out toward the middle so text sits on calm ground */
.fm-grid.fm-masked {
  -webkit-mask-image: radial-gradient(ellipse 90% 90% at 50% 45%, transparent 38%, black 78%);
  mask-image: radial-gradient(ellipse 90% 90% at 50% 45%, transparent 38%, black 78%);
}
.fm-grid .fm-cell {
  fill: currentColor;
  opacity: 0;
  will-change: opacity;
}

/* button micro-interactions on top of Webflow's own hover fill */
.primary-button, .primary-white-button {
  transition: transform .18s cubic-bezier(.4, 0, .2, 1),
              box-shadow .18s cubic-bezier(.4, 0, .2, 1);
}
.primary-button:hover, .primary-white-button:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 24px -12px rgba(20, 20, 16, .45);
}
.primary-button:active, .primary-white-button:active {
  transform: translateY(0) scale(.98);
  box-shadow: none;
}

/* accessibility: static grid, no cell animation, no motion */
@media (prefers-reduced-motion: reduce) {
  .fm-reveal { opacity: 1; transform: none; transition: none; }
  .fm-kb { animation: none; }
  .fm-grid .fm-cell { display: none; }
  .primary-button, .primary-white-button { transition: none; }
  .primary-button:hover, .primary-white-button:hover { transform: none; box-shadow: none; }
}