/* Motion enhances the visible page; content never depends on it. */
.motion-enabled .hero-copy > *{
  animation:glanz-arrive 620ms cubic-bezier(.2,.7,.2,1) both;
}
.motion-enabled .hero-copy > h1{animation-delay:65ms}
.motion-enabled .hero-description{animation-delay:125ms}
.motion-enabled .hero-actions{animation-delay:185ms}
.motion-enabled .hero-caption{animation-delay:245ms}
.motion-enabled .hero-visual img{animation:glanz-logo-arrive 850ms ease-out both}
.motion-enabled .hero-visual:after{animation:glanz-light-pulse 3200ms ease-in-out 300ms 1}

.motion-enabled [data-motion-pending]{opacity:0;translate:0 12px}
.motion-enabled .is-revealing{
  animation:glanz-arrive 580ms cubic-bezier(.2,.7,.2,1) var(--reveal-delay,0ms) both;
}
.motion-enabled [data-motion-pending]:focus-within{opacity:1;translate:none}
.motion-enabled dialog[open]{animation:glanz-dialog-arrive 180ms ease-out}

.button{overflow:hidden}
.button:before{content:'';position:absolute;inset:-1px;pointer-events:none;opacity:0;background:linear-gradient(105deg,transparent 30%,#ffffff21 49%,transparent 68%);transform:translateX(-115%)}
.button svg,.text-link svg,.service-action svg{transition:transform 180ms ease-out}
@media(hover:hover) and (pointer:fine){
  .motion-enabled .button:hover:before{animation:glanz-sheen 500ms ease-out}
  .motion-enabled .button:hover svg,.motion-enabled .text-link:hover svg{transform:translateX(3px)}
  .motion-enabled .service-action:hover svg{transform:translate(2px,-2px)}
}
.motion-enabled .button:focus-visible svg,.motion-enabled .service-action:focus-visible svg{transform:translateX(2px)}
@media(hover:none){.button:hover,.service-item:hover{transform:none}}

@keyframes glanz-arrive{
  from{opacity:0;translate:0 12px}
  to{opacity:1;translate:0 0}
}
@keyframes glanz-logo-arrive{from{opacity:0}to{opacity:1}}
@keyframes glanz-light-pulse{
  0%,100%{opacity:1;transform:scaleX(1)}
  40%{opacity:.38;transform:scaleX(.9)}
  70%{opacity:1;transform:scaleX(1.035)}
}
@keyframes glanz-sheen{
  0%{opacity:0;transform:translateX(-115%)}
  20%,70%{opacity:1}
  100%{opacity:0;transform:translateX(115%)}
}
@keyframes glanz-dialog-arrive{
  from{opacity:0;translate:0 7px}
  to{opacity:1;translate:0 0}
}

/* This also exposes pending content if the setting changes during a reveal. */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{animation:none!important;transition:none!important}
  [data-motion-pending],.is-revealing{opacity:1!important;translate:none!important}
  .motion-enabled .hero-visual img,.motion-enabled .hero-copy > *{opacity:1!important;translate:none!important}
  .button:hover,.service-item:hover,.button svg,.text-link svg,.service-action svg{transform:none!important}
}