/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Sep 30 2025 | 01:37:13 */
/* ---------- Estilos para o cartão / container do produto ---------- */
/* Ajuste o seletor (.product-card) para o que seu tema usa:
   exemplos: .product, .product-item, .woocommerce-product-gallery, .product-image */
.product-card {
  position: relative;      /* necessário para o overlay pseudo-element */
  overflow: hidden;        /* evita que a imagem "vaze" para fora do cartão */
  border-radius: 12px;     /* canto arredondado opcional */
}

/* ---------- Imagem do produto ---------- */
.product-card img {
  display: block;
  width: 100%;
  height: auto;
  transition: transform 0.45s ease, filter 0.45s ease;
  will-change: transform, filter;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

/* ---------- Overlay degradê rosé -> branco ---------- */
/* o ::after coloca o degradê sobre a imagem sem alterar a imagem original */
.product-card::after {
  content: "";
  position: absolute;
  inset: 0; /* top:0; right:0; bottom:0; left:0; */
  pointer-events: none; /* overlay não bloqueia cliques */
  /* Gradiente: ajuste as cores/ângulo conforme quiser */
  background: linear-gradient(135deg,
    rgba(255, 190, 200, 0.36) 0%,
    rgba(255, 240, 245, 0.28) 40%,
    rgba(255, 255, 255, 0.55) 100%);
  mix-blend-mode: soft-light; /* modo de mistura para acabamento elegante */
  transition: opacity 0.35s ease, transform 0.35s ease;
  opacity: 1;
}

/* ---------- Hover: leve zoom e mais vibração ---------- */
.product-card:hover img {
  transform: scale(1.04);
  filter: saturate(1.06) brightness(1.02) contrast(1.02);
}
.product-card:hover::after {
  transform: scale(1.02); /* sutil "pulse" do degradê */
  opacity: 1;
}

/* ---------- Variante: versão mais dramática (se quiser) ---------- */
.product-card--intense::after {
  background: linear-gradient(120deg,
    rgba(255,160,185,0.45) 0%,
    rgba(255,230,240,0.30) 50%,
    rgba(255,255,255,0.6) 100%);
  mix-blend-mode: multiply;
}

/* ---------- Acessibilidade / fallback ------------ */
/* Se o navegador não suportar mix-blend-mode, o degradê continua visível
   (os navegadores modernos suportam mix-blend-mode; IE não) */


