/* ============================================================
   Sweet Gypsy Design — Smooth Animations & Physics Engine
   ============================================================ */

/* ─── ANIMATION TIMING VARIABLES & CURVES ─── */
:root {
  --ease-smooth: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-in-out-smooth: cubic-bezier(0.65, 0, 0.35, 1);
  --transition-fast: 0.25s var(--ease-smooth);
  --transition-normal: 0.4s var(--ease-smooth);
  --transition-slow: 0.65s var(--ease-smooth);
}

/* ─── HARDWARE ACCELERATION UTILITIES ─── */
.gpu-accelerated,
.product-card,
.modal-sub-card,
.product-modal,
.cart-drawer,
.product-img-wrap img {
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  transform: translateZ(0);
}

/* ─── FADE UP (Hero & Entrance Animations) ─── */
@keyframes fadeUp {
  from {
    opacity: 0;
    transform: translateY(28px) scale(0.98);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

.hero-left > * {
  opacity: 0;
  animation: fadeUp 0.8s var(--ease-smooth) forwards;
}

.hero-tag {
  animation-delay: 0.08s;
}

.hero-title {
  animation-delay: 0.2s;
}

.hero-sub {
  animation-delay: 0.35s;
}

.hero-btns {
  animation-delay: 0.5s;
}

.hero-stats {
  animation-delay: 0.65s;
}

/* ─── FADE IN & SLIDE UP (Collection & Cards) ─── */
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(16px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes smoothScaleUp {
  from {
    opacity: 0;
    transform: scale(0.94) translateY(12px);
  }
  to {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}

/* ─── MARQUEE ─── */
@keyframes marquee {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%);
  }
}

/* ─── SPINNER ─── */
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

/* ─── FORM STATUS SLIDE IN ─── */
@keyframes statusSlideIn {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ─── SUCCESS PANEL ─── */
@keyframes successFadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@keyframes successBounce {
  0%   { transform: scale(0); opacity: 0; }
  60%  { transform: scale(1.15); opacity: 1; }
  100% { transform: scale(1); }
}

/* ─── TACTILE CLICK RIPPLE / PRESS EFFECT FOR BUTTONS ─── */
button:active,
.btn:active,
.product-overlay-btn:active,
.product-add-cart-btn:active,
.slider-arrow:active,
.modal-arrow:active,
.cart-nav-btn:active,
.lang-btn:active {
  transform: scale(0.95) !important;
  transition: transform 0.12s var(--ease-smooth) !important;
}

/* ─── REDUCED MOTION (Accessibility) ─── */
@media (prefers-reduced-motion: reduce) {
  *, ::before, ::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}