/* A steady frame, with a slow inward and outward movement of the service image. */
@keyframes atelier-v8-service-zoom{
  from{transform:scale(1)}
  to{transform:scale(var(--service-zoom-scale,1.075))}
}
.services .service-card .service-card-image>img{
  --service-zoom-scale:1.075;
  transform-origin:50% 50%;
  animation:atelier-v8-service-zoom 18s cubic-bezier(.45,0,.55,1) infinite alternate;
  transition:none;
  will-change:transform;
}
.services .service-card:nth-child(2n) .service-card-image>img{animation-delay:-7s}
.services .service-card:nth-child(3n) .service-card-image>img{animation-delay:-12s}
.services .service-card .service-card-image:hover>img{transition:none}
.services .service-card .service-card-image:focus-visible>img{animation-play-state:paused}

/* The light travels out and back, with a quiet interval between each pass. */
@keyframes atelier-v8-cta-sweep{
  0%,12%{transform:translateX(-120%) skewX(-12deg);opacity:0}
  18%{opacity:var(--cta-sweep-intensity,1)}
  40%{transform:translateX(120%) skewX(-12deg);opacity:var(--cta-sweep-intensity,1)}
  46%,54%{transform:translateX(120%) skewX(-12deg);opacity:0}
  60%{opacity:var(--cta-sweep-intensity,1)}
  82%{transform:translateX(-120%) skewX(-12deg);opacity:var(--cta-sweep-intensity,1)}
  88%,100%{transform:translateX(-120%) skewX(-12deg);opacity:0}
}
body:not(.legal-mode) :is(.button,.service-reserve,.header-cta,.about-v5-contact-button):not(:disabled):not([aria-disabled="true"])::before{
  --cta-sweep-intensity:1;
  content:'';
  position:absolute;
  z-index:0;
  inset:-30% -35%;
  border-radius:inherit;
  pointer-events:none;
  background:linear-gradient(105deg,transparent 35%,#ffffff00 43%,#ffffff30 50%,#ffffff00 57%,transparent 65%);
  animation:atelier-v8-cta-sweep 7s cubic-bezier(.4,0,.2,1) infinite;
  animation-delay:var(--cta-sweep-delay,0s);
  transition:none;
}
body:not(.legal-mode) .services .service-reserve::before{--cta-sweep-delay:-1.8s}
body:not(.legal-mode) .header-cta::before{--cta-sweep-delay:-3.6s}
body:not(.legal-mode) .about-v5-contact-button::before{--cta-sweep-delay:-1.2s}
body:not(.legal-mode) :is(.button,.service-reserve,.header-cta,.about-v5-contact-button):not(:disabled):not([aria-disabled="true"]):focus-visible::before,
body:not(.legal-mode) :is(.button,.service-reserve,.header-cta,.about-v5-contact-button):not(:disabled):not([aria-disabled="true"]):active::before{animation-play-state:paused}
.legal-mode :is(.button,.service-reserve,.header-cta,.about-v5-contact-button)::before{display:none;animation:none;transition:none}

/* Touch screens retain the effect at a lower amplitude and a slower pace. */
@media(pointer:coarse){
  .services .service-card .service-card-image>img{--service-zoom-scale:1.045;animation-duration:20s}
  .services .service-card .service-card-image:active>img{animation-play-state:paused}
  body:not(.legal-mode) :is(.button,.service-reserve,.header-cta,.about-v5-contact-button):not(:disabled):not([aria-disabled="true"])::before{
    --cta-sweep-intensity:.72;
    animation-duration:9s;
  }
}
@media(prefers-reduced-motion:reduce){
  .services .service-card .service-card-image>img,
  .services .service-card .service-card-image:hover>img,
  .services .service-card .service-card-image:focus-visible>img{
    animation:none!important;
    transform:none!important;
    transition:none!important;
    will-change:auto;
  }
  body:not(.legal-mode) :is(.button,.service-reserve,.header-cta,.about-v5-contact-button)::before{
    display:none!important;
    animation:none!important;
    opacity:0!important;
    transition:none!important;
  }
}