.offers-hero {
  margin: 28px 35px;
  padding: 45px;
  border-radius: 22px;
  background: linear-gradient(135deg, #061224, #0d3b78);
  color: white;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.offers-text span {
  color: #ff4d4d;
  font-weight: bold;
  font-size: 14px;
}

.offers-text h2 {
  margin-top: 10px;
  font-size: 42px;
}

.offers-text strong {
  color: #1e88ff;
}

.offers-text p {
  margin-top: 10px;
  color: #dbeafe;
}

.offers-date {
  margin-top: 18px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 18px;
  border-radius: 999px;
  background: rgba(20, 40, 70, 0.8);
  border: 1px solid rgba(0, 150, 255, 0.4);
  color: #dbeafe;
  font-size: 14px;
  backdrop-filter: blur(6px);
}

.offers-img {
  width: 200px;
  height: 200px;
  display: grid;
  place-items: center;
}


/* FILTROS */
.offer-filters {
  margin: 0 35px 0px;
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.offer-filters button {
  border: 1px solid #e2e8f0;
  background: white; /* 👈 blanco */
  color: #0d6efd;
  padding: 10px 16px;
  border-radius: 999px;
  font-weight: bold;
  cursor: pointer;
  transition: 0.2s;
}

.offer-filters button.active {
  background: #0d6efd;
  color: white;
  border: none;
}

/* ETIQUETA DE DESCUENTO */
.product-card {
  position: relative;
}


/* PRECIO */
.old-price {
  text-decoration: line-through;
  color: #94a3b8;
  font-size: 13px;
}
.offers-img {
  width: 520px;
  min-height: 260px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.offer-img {
  width: 100%;
  max-width: 520px;
  height: auto;
  object-fit: contain;
}
.offers-hero {
  position: relative;
  overflow: hidden;
}

.offers-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(120deg, transparent 20%, rgba(0, 145, 255, .45) 21%, transparent 23%),
    linear-gradient(120deg, transparent 55%, rgba(0, 145, 255, .35) 56%, transparent 58%),
    linear-gradient(120deg, transparent 75%, rgba(255, 70, 70, .35) 76%, transparent 77%);
  opacity: .55;
  pointer-events: none;
}

.offers-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(circle, #1e88ff 1px, transparent 2px),
    radial-gradient(circle, #ff4d4d 1px, transparent 2px),
    radial-gradient(circle, #ffb020 1px, transparent 2px);
  background-size: 180px 120px, 260px 180px, 220px 150px;
  opacity: .8;
  pointer-events: none;
}

.offers-img {
  position: relative;
  z-index: 2;
}
.offer-img {
  width: 100%;
  max-width: 500px;
  height: auto;
  object-fit: contain;
  animation: float 4s ease-in-out infinite;
}
@keyframes float {
  0% {
    transform: translateY(0px) rotate(-2deg);
  }
  50% {
    transform: translateY(-15px) rotate(2deg);
  }
  100% {
    transform: translateY(0px) rotate(-2deg);
  }
}
.clock-icon {
  color: #ff4d4d;
  font-size: 16px;
}
.offers-date {
  position: relative;
  z-index: 5;
}
.discount-bar {
  position: absolute;
  top: 12px;
  left: 12px;
  right: auto;
  width: auto;
  background: #ef233c;
  color: white;
  padding: 6px 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  z-index: 5;
}
.offers-hero,
.offer-filters,
.products-section {
  max-width: 1400px;
  margin-left: auto;
  margin-right: auto;
}
.products-section {
  margin-top: 10px !important;
}
/* OFERTAS RESPONSIVE */
@media (max-width: 768px) {
  .offers-hero {
    margin: 0 !important;
    padding: 28px 18px !important;
    border-radius: 0 !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 18px !important;
  }

  .offers-text h2 {
    font-size: 42px !important;
    line-height: 1.12 !important;
  }

  .offers-text p {
    max-width: 240px !important;
  }

.offers-img {
  position: absolute !important;
  right: 12px !important;
  top: 95px !important;
  width: 105px !important;
  min-height: auto !important;
  opacity: 0.85 !important;
  z-index: 1 !important;
}

.offer-img {
  width: 105px !important;
  max-width: 105px !important;
  animation: none !important;
}

.offers-text {
  position: relative !important;
  z-index: 2 !important;
}

.offers-text h2 {
  max-width: 270px !important;
}
  .offer-filters {
    margin: 0 !important;
    padding: 14px 12px !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    background: #f5f8fc !important;
  }

  .offer-filters button {
    flex: 1 1 calc(50% - 10px) !important;
    min-width: 135px !important;
    padding: 11px 12px !important;
    font-size: 13px !important;
    border-radius: 999px !important;
    white-space: nowrap !important;
  }
}
@media (max-width: 768px) {
  .offers-img {
    display: none !important;
  }
}
.product-card {
  position: relative;
}

.product-card .offer-badge {
  position: absolute !important;
  top: 14px !important;
  left: 14px !important;
  background: #ef4444 !important;
  color: #ffffff !important;
  font-weight: 900 !important;
  font-size: 13px !important;
  padding: 7px 12px !important;
  border-radius: 999px !important;
  box-shadow: 0 8px 18px rgba(239, 68, 68, 0.25) !important;
  z-index: 20 !important;
  display: inline-flex !important;
  align-items: center !important;
}

.old-price {
  color: #94a3b8;
  text-decoration: line-through;
  font-weight: 700;
  margin-top: 10px;
}
.product-card {
  position: relative !important;
  overflow: visible !important;
}