@media(prefers-reduced-motion:no-preference){
 .gallery-photo img{transition:transform .7s cubic-bezier(.2,.7,.2,1)}
 #photo-dialog[open]{animation:dialog-arrive .28s ease-out}
 #photo-dialog[open]::backdrop{animation:backdrop-arrive .28s ease-out}
 @keyframes dialog-arrive{from{opacity:0;transform:translateY(8px) scale(.99)}to{opacity:1;transform:none}}
 @keyframes backdrop-arrive{from{opacity:0}to{opacity:1}}
 @keyframes balloon-nod{0%,100%{transform:rotate(0)}35%{transform:rotate(-8deg) translateY(-2px)}70%{transform:rotate(4deg)}}
 @keyframes flower-sway{0%,100%{transform:rotate(0)}30%{transform:rotate(6deg)}65%{transform:rotate(-4deg)}}
 @keyframes arch-draw{from{stroke-dashoffset:220}to{stroke-dashoffset:0}}
 @media(hover:hover) and (pointer:fine){
  .services article:nth-child(1):hover .service-icon{transform-origin:50% 90%;animation:balloon-nod 1.1s ease-in-out}
  .services article:nth-child(2):hover .service-icon{transform-origin:50% 90%;animation:flower-sway 1.2s ease-in-out}
  .services article:nth-child(3):hover .service-icon path{stroke-dasharray:220;animation:arch-draw 1.1s ease-out both}
 }
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}.gallery-photo img,.button,header nav a:after{transition:none!important}.gallery-photo:hover img,.button:hover{transform:none!important}}