/*
  Maria Bolsas - Reveal elegante e seguro
  Aplicado somente em sites/novo.

  Regra:
  - Não esconde conteúdo.
  - Não usa blur.
  - Não some ao sair da tela.
  - Não aplica em checkout, carrinho, preço, botão, frete ou resumo do pedido.
*/

@keyframes mbQuietReveal {
  from {
    opacity: 0.94;
    transform: translateY(8px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.mb-quiet-reveal-run {
  animation: mbQuietReveal 220ms cubic-bezier(0.2, 0.7, 0.2, 1) both;
  will-change: opacity, transform;
}

.product-card,
.category-card,
.benefit,
.benefit-card,
.trust-card,
.trust-item,
.feature,
.feature-card {
  transition:
    transform 180ms ease,
    box-shadow 180ms ease,
    border-color 180ms ease;
}

.product-card:hover,
.category-card:hover,
.benefit-card:hover,
.trust-card:hover,
.feature-card:hover {
  transform: translateY(-2px);
}

button,
.btn,
.button,
a[class*="btn"],
a[class*="button"] {
  transition:
    transform 150ms ease,
    opacity 150ms ease,
    background-color 150ms ease,
    border-color 150ms ease;
}

button:hover,
.btn:hover,
.button:hover,
a[class*="btn"]:hover,
a[class*="button"]:hover {
  transform: translateY(-1px);
}

button:active,
.btn:active,
.button:active,
a[class*="btn"]:active,
a[class*="button"]:active {
  transform: scale(0.97);
}

@media (prefers-reduced-motion: reduce) {
  .mb-quiet-reveal-run {
    animation: none !important;
  }

  .product-card,
  .category-card,
  .benefit,
  .benefit-card,
  .trust-card,
  .trust-item,
  .feature,
  .feature-card,
  button,
  .btn,
  .button,
  a[class*="btn"],
  a[class*="button"] {
    transition: none !important;
    transform: none !important;
  }
}
