/* Spectra Shop — ajustements du dump Next.js (sobres, non destructifs) */

/* Transitions courtes et cohérentes sur les éléments interactifs */
a, button, [role="button"]{
  transition:color .18s ease-out, background-color .18s ease-out, border-color .18s ease-out, opacity .18s ease-out;
}

/* Cartes : léger lift au survol, sans halo */
.bg-card, [class*="rounded-2xl"][class*="border"], [class*="rounded-xl"][class*="border"]{
  transition:transform .18s ease-out, border-color .18s ease-out;
}
.bg-card:hover, [class*="rounded-2xl"][class*="border"]:hover, [class*="rounded-xl"][class*="border"]:hover{
  transform:translateY(-2px);
}

/* Zoom d'image très léger dans les cartes survolées */
.bg-card img, [class*="rounded-2xl"] img{ transition:transform .3s ease-out; }
.group:hover img, [class*="group/"]:hover img{ transform:scale(1.03); }

/* Marquee "Les plus demandés" : fondu aux bords, pause au survol */
[class*="marquee"]:hover{ animation-play-state:paused; }
.marquee-viewport{
  -webkit-mask-image:linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
          mask-image:linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
  padding-block:6px;
}
.marquee-track{ gap:20px; padding-inline:10px; }
.marquee-track > *{ flex:0 0 auto; }

@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
    scroll-behavior:auto !important;
  }
  .bg-card:hover, [class*="rounded-2xl"][class*="border"]:hover, [class*="rounded-xl"][class*="border"]:hover,
  .group:hover img{ transform:none; }
}