/* Premium motion: overlay enter/exit — quick, weighted, no content reveals.
   Page content stays fully painted; only overlays get a short open/close. */

.product-modal,
.contact-modal {
  visibility: hidden;
  pointer-events: none;
  transition: visibility 0.3s step-end;
}

.product-modal.is-open,
.contact-modal.is-open {
  visibility: visible;
  pointer-events: auto;
  transition: visibility 0s linear;
}

.product-modal-backdrop,
.contact-modal-backdrop,
.product-modal-shell,
.contact-modal-shell {
  opacity: 0;
  transition: opacity 0.3s cubic-bezier(0.22, 1, 0.36, 1);
}

.product-modal.is-open .product-modal-backdrop,
.contact-modal.is-open .contact-modal-backdrop,
.product-modal.is-open .product-modal-shell,
.contact-modal.is-open .contact-modal-shell {
  opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
  .product-modal,
  .contact-modal,
  .product-modal-backdrop,
  .contact-modal-backdrop,
  .product-modal-shell,
  .contact-modal-shell {
    transition: none !important;
    transform: none !important;
  }

  .product-modal-backdrop,
  .contact-modal-backdrop,
  .product-modal-shell,
  .contact-modal-shell {
    opacity: 1;
  }
}