/*
 * WebCreare Commerce — animazioni (Fase 8): "piccole ma curate".
 * Hover prodotti, apertura mega menu e sticky sono già gestiti nei fogli di stile dei
 * singoli componenti (Fasi 3-6); qui il resto della lista: fade-in in ingresso, zoom
 * immagini non ancora coperti, pulsanti con feedback uniforme.
 * Caricato per ultimo (priorità più alta nel modulo wctheme) apposta: le regole di
 * transition qui sotto affinano quelle già dichiarate nei CSS dei singoli componenti,
 * senza doverle riscrivere file per file. prefers-reduced-motion è gestito globalmente
 * in theme.css (disattiva tutte le transition/animation, non lo stato finale).
 */

/* ---------- Fade-in in ingresso (scroll), gestito da animations.js ---------- */

.wc-reveal {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity 640ms cubic-bezier(0.16, 1, 0.3, 1), transform 640ms cubic-bezier(0.16, 1, 0.3, 1);
}

.wc-reveal.is-visible {
  opacity: 1;
  transform: none;
}

/* Stagger leggero per le griglie (categorie, USP, card prodotto) */
.wc-categories__grid > .wc-reveal:nth-child(2),
.wc-usp > .wc-reveal:nth-child(2),
.wc-product-section__grid > .wc-reveal:nth-child(2) {
  transition-delay: 70ms;
}

.wc-categories__grid > .wc-reveal:nth-child(3),
.wc-usp > .wc-reveal:nth-child(3),
.wc-product-section__grid > .wc-reveal:nth-child(3) {
  transition-delay: 140ms;
}

.wc-categories__grid > .wc-reveal:nth-child(4),
.wc-usp > .wc-reveal:nth-child(4),
.wc-product-section__grid > .wc-reveal:nth-child(4) {
  transition-delay: 210ms;
}

/* ---------- Zoom immagini ---------- */

.wc-gallery__main {
  overflow: hidden;
}

.wc-gallery__main img {
  transition: transform 420ms ease;
}

.wc-gallery__main:hover img {
  transform: scale(1.06);
}

.wc-categories__item img {
  transition: transform 420ms ease;
}

.wc-categories__item:hover img {
  transform: scale(1.08);
}

@media (hover: none) {
  .wc-gallery__main:hover img,
  .wc-categories__item:hover img {
    transform: none;
  }
}

/* ---------- Pulsanti moderni: feedback alla pressione, uniforme su tutte le CTA ---------- */

.wc-hero__cta,
.wc-banner__cta,
.wc-header__action,
.wc-mega__trigger,
.wc-product-card__cta,
.wc-buybox__cta,
.wc-search-panel__submit,
.wc-footer__newsletter-submit,
.wc-newsletter__submit {
  transition:
    transform 120ms ease,
    background var(--wc-transition),
    color var(--wc-transition),
    border-color var(--wc-transition),
    opacity var(--wc-transition);
}

.wc-hero__cta:active,
.wc-banner__cta:active,
.wc-product-card__cta:active,
.wc-buybox__cta:active,
.wc-search-panel__submit:active,
.wc-footer__newsletter-submit:active,
.wc-newsletter__submit:active {
  transform: scale(0.96);
}

.wc-header__action:active,
.wc-mega__trigger:active {
  transform: scale(0.92);
}