@media(prefers-reduced-motion:no-preference) {
  .motion-ready [data-reveal] {
    opacity:0;
    transform:translateY(30px);
    transition:opacity .7s ease,transform .8s cubic-bezier(.22,.61,.36,1)
  }
  .motion-ready [data-reveal].revealed {
    opacity:1;
    transform:none
  }
  .hero-copy h1 {
    animation:hero-in .9s cubic-bezier(.2,.6,.3,1) both
  }
  .hero-burger {
    animation:product-in 1.2s ease both
  }
  .button,.circle-link,.rail-controls button {
    transition:background .2s,color .2s,transform .2s
  }
  .product-image img {
    transition:transform .5s cubic-bezier(.2,.6,.3,1)
  }
  .view-label {
    transition:opacity .2s
  }
  .hero-seal {
    transition:transform .3s
  }
  .desktop-nav a,.footer-grid a {
    transition:color .2s
  }
  @keyframes hero-in {
    from {
      opacity:0;
      transform:translateY(25px)
    }
    to {
      opacity:1;
      transform:none
    }
  }
  @keyframes product-in {
    from {
      opacity:0;
      transform:scale(1.035)
    }
    to {
      opacity:1;
      transform:scale(1)
    }
  }
}
@media(hover:hover) {
  .desktop-nav a:hover,.footer-grid a:hover {
    color:var(--color-accent)
  }
  .button:hover {
    background:#fff;
    color:#111;
    transform:translateY(-2px)
  }
  .product-image:hover img {
    transform:scale(1.045)
  }
  .product-image:hover .view-label,.product-image:focus-visible .view-label {
    opacity:1
  }
  .hero-seal:hover {
    transform:rotate(0)
  }
  .circle-link:hover {
    background:#111;
    color:var(--color-accent);
    transform:rotate(8deg)
  }
  .rail-controls button:hover {
    background:var(--color-accent);
    color:#111
  }
  .text-link:hover {
    opacity:.7
  }
}
.motion-off *, .motion-off *::before,.motion-off *::after {
  animation:none!important;
  transition:none!important;
  scroll-behavior:auto!important
}
.motion-off [data-reveal] {
  opacity:1!important;
  transform:none!important
}
.motion-off .kat-section {
  height:auto!important
}
.motion-off .kat-stage {
  position:relative!important
}
.motion-off .kat-play {
  display:block!important
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
  *,*::before,*::after {
    animation:none!important;
    transition:none!important
  }
  .kat-section {
    height:auto!important
  }
  .kat-stage {
    position:relative!important
  }
  .kat-play {
    display:block!important
  }
  [data-reveal] {
    opacity:1!important;
    transform:none!important
  }
}
