/* Lower-page motion: a quiet reveal, image depth, and responsive controls. */
.motion-lp { --motion-ease: cubic-bezier(.22,1,.36,1); }
.motion-lp .motion-reveal {
  transition: opacity .8s var(--motion-ease), translate .95s var(--motion-ease), clip-path .95s var(--motion-ease);
  transition-delay: var(--reveal-delay,0ms);
}
.motion-lp .motion-waiting { opacity: 0; translate: 0 26px; }
.motion-lp .reference-photo.motion-waiting { clip-path: inset(0 0 16% 0 round 8px); }
.motion-lp .motion-shown { opacity: 1; translate: 0 0; }
.motion-lp .reference-photo.motion-shown { clip-path: inset(0 round 8px); }
/* Motion is on the variant; the image keeps its independently authored crop. */
.motion-lp .photo-depth .image-variant {
  translate: 0 var(--photo-drift,0px);
  scale: var(--photo-depth-scale,1.08);
  transition: scale 1s var(--motion-ease);
}
/* Contained product images keep their resting fit, but still respond to interaction. */
.motion-lp .photo-depth.is-contained .image-variant { translate: none; scale: var(--contained-depth-scale,1); }
.motion-lp .button { transition: background-color .3s, color .3s, border-color .3s, translate .45s var(--motion-ease), scale .25s var(--motion-ease); }
.motion-lp .button > span[aria-hidden] { display:inline-block; transition:translate .45s var(--motion-ease); }
.motion-lp .text-link { position:relative; transition:color .25s, border-color .25s; }
.motion-lp .text-link::after { content:''; position:absolute; left:0; right:0; bottom:-1px; height:1px; background:currentColor; transform:scaleX(0); transform-origin:right; transition:transform .55s var(--motion-ease); }
.motion-lp :is(.event-action,.entry-link,.menu-dialog nav a) { transition:color .25s, translate .45s var(--motion-ease); }
.motion-lp summary { cursor:pointer; transition:color .25s, background-color .25s; }
.motion-lp summary .plus::after { transition:transform .4s var(--motion-ease); }
.motion-lp details.is-collapsing > summary .plus::after { transform:rotate(90deg); }
.motion-lp .menu-dialog { overscroll-behavior:contain; }
.motion-lp .menu-dialog.is-menu-closing::backdrop { animation:menu-backdrop-out .24s both; }
.motion-lp .menu-dialog:not(.is-menu-closing)::backdrop { animation:menu-backdrop-in .4s both; }
.motion-lp .button:active { scale:.97; }
.motion-lp :is(.menu-button,.close-button):active { scale:.91; }
.motion-lp :is(.menu-button,.close-button) { transition:scale .25s var(--motion-ease); }
@media(hover:hover) and (pointer:fine) {
  .motion-lp .product-card:hover .photo-depth { --photo-depth-scale:1.12; --contained-depth-scale:1.04; }
  .motion-lp .button:hover { translate:0 -2px; }
  .motion-lp .button:hover > span[aria-hidden] { translate:3px -3px; }
  .motion-lp .text-link:hover::after { transform:scaleX(1); transform-origin:left; }
  .motion-lp :is(.event-action,.entry-link):hover { translate:3px 0; }
  .motion-lp .menu-dialog nav a:hover { translate:8px 0; }
  .motion-lp summary:hover { color:#607585; }
}
/* Touch presses and keyboard focus get the same feedback as pointer hover. */
@media(prefers-reduced-motion:no-preference) {
  .motion-lp .product-card:is(:active,:focus-within) .photo-depth { --photo-depth-scale:1.12; --contained-depth-scale:1.04; }
}
.motion-lp .text-link:focus-visible::after { transform:scaleX(1); transform-origin:left; }
.motion-lp .button:focus-visible > span[aria-hidden] { translate:3px -3px; }
@media(max-width:800px) {
  .motion-lp .motion-waiting { translate:0 16px; }
  .motion-lp .motion-reveal { transition-duration:.65s,.8s,.8s; transition-delay:0ms; }
  .motion-lp .photo-depth { --photo-depth-scale:1.06; }
}
@keyframes menu-backdrop-in { from { opacity:0; } to { opacity:1; } }
@keyframes menu-backdrop-out { from { opacity:1; } to { opacity:0; } }
@media(prefers-reduced-motion:reduce) {
  .motion-lp .motion-reveal { opacity:1; translate:none; clip-path:none; transition:none; }
  .motion-lp .photo-depth .image-variant,
  .motion-lp .photo-depth.is-contained .image-variant { translate:none; scale:1; transition:none; }
  .motion-lp :is(.button,.button > span,.text-link,.text-link::after,.event-action,.entry-link,summary,.plus::after,.menu-dialog nav a,.menu-button,.close-button) { transition:none; translate:none; scale:1; }
  .motion-lp .menu-dialog::backdrop { animation:none!important; }
}