/* Interactions keep the existing layout and respect system motion preferences. */
@media (prefers-reduced-motion: no-preference) {
  .craft-sewing, .guide-photo-detail { transform: translate3d(0, var(--scroll-shift, 0px), 0); }
  .button, .header-cta, .hero-actions > .text-link {
    transition: transform .3s ease, background-color .3s ease, border-color .3s ease, color .3s ease;
  }
  .button > span, .header-cta > span, .text-link > span, .material-paths strong > span {
    display: inline-block;
    transition: transform .35s cubic-bezier(.2,.7,.2,1);
  }
  .product-image img { transition: transform .85s cubic-bezier(.2,.7,.2,1); }
  .product-heading > span { transition: transform .4s ease, background-color .3s ease, color .3s ease; }
  .product-meta span:last-child { transition: background-color .3s ease, color .3s ease, border-color .3s ease; }
  .gallery-card > img { transition: transform .7s cubic-bezier(.2,.7,.2,1); }
  .desktop-nav a, .footer-top nav a {
    background: linear-gradient(currentColor, currentColor) left bottom / 0 2px no-repeat;
    transition: background-size .3s ease;
  }
  .desktop-nav a:hover, .footer-top nav a:hover { text-decoration: none; background-size: 100% 2px; }
  .faq-list summary::after { transition: transform .3s ease; }
  .button:active, .header-cta:active, .hero-actions > .text-link:active { transform: scale(.97); }
}
@media (prefers-reduced-motion: no-preference) and (hover: hover) and (pointer: fine) {
  .button:hover, .header-cta:hover, .hero-actions > .text-link:hover { transform: translateY(-3px); }
  .button:hover > span, .header-cta:hover > span, .text-link:hover > span,
  .material-paths a:hover strong > span { transform: translate(3px, -3px); }
  .hero-actions > .text-link:hover > span { transform: translateY(4px); }
  a.product-card:hover .product-image img { transform: scale(1.065); }
  .product-card:hover .product-heading > span { transform: rotate(45deg); }
  .product-card:hover .product-meta span:last-child { background: #111; color: #fff; }
  a.gallery-card:hover > img { transform: scale(1.018); }
}
@media (prefers-reduced-motion: reduce) {
  .craft-sewing, .guide-photo-detail, a.product-card:hover .product-image img,
  a.gallery-card:hover > img, .button, .header-cta, .hero-actions > .text-link { transform: none; }
}