/* Estilos específicos para la página de Promociones */
.promociones-grid .card.plan {
  border: 1px solid rgba(54,3,74,0.06);
  border-radius: 14px;
  background: #ffffff;
  overflow: hidden;
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.promociones-grid .card.plan:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 46px rgba(54,3,74,0.08);
  border-color: rgba(54,3,74,0.12);
}
.promociones-grid .plan-header {
  padding: 1.25rem 1.25rem 0.5rem 1.25rem;
  background: linear-gradient(90deg, rgba(54,3,74,0.08), rgba(255,43,80,0.06));
}
.promociones-grid .card-body {
  padding: 1.25rem;
}
.promociones-grid .price-tag {
  font-weight: 700;
  color: #FF2B50; /* color acento */
}
.promocion-ribbon {
  position: absolute;
  top: 12px;
  right: -36px;
  background: #FF2B50; /* acento */
  color: #FFFFFF;
  padding: 6px 56px;
  transform: rotate(45deg);
  font-size: 0.85rem;
  box-shadow: 0 6px 16px rgba(54,3,74,0.12);
}
.plan-icon {
  font-size: 2.1rem;
  color: #36034A; /* marca principal */
  margin-right: 0.75rem;
}

/* Asegurar contraste: texto oscuro sobre fondo blanco */
.promociones-grid .card.plan,
.promociones-grid .card.plan .card-body,
.promociones-grid .card.plan .plan-header {
  color: #36034A; /* texto principal */
}
.promociones-grid .card.plan .card-body p,
.promociones-grid .card.plan .promocion-features li {
  color: #333333;
}

/* Tarjeta destacada: fondo oscuro con texto blanco */
.promociones-grid .card.plan.featured {
  background: linear-gradient(120deg, #36034A 0%, #2b0138 100%);
  color: #FFFFFF;
  border-color: rgba(255,255,255,0.06);
}
.promociones-grid .card.plan.featured .plan-header,
.promociones-grid .card.plan.featured .card-body {
  color: #FFFFFF;
}
.promociones-grid .card.plan.featured .price-tag {
  color: #FFFFFF;
}
.promociones-grid .card.plan.featured .promocion-cta.btn-primary {
  background: #FFFFFF !important;
  color: #36034A !important;
}
.promociones-grid .card.plan.featured .plan-icon {
  color: #FFFFFF !important;
}
.promociones-grid .card.plan.featured .promocion-features li,
.promociones-grid .card.plan.featured .card-body p,
.promociones-grid .card.plan.featured .plan-header,
.promociones-grid .card.plan.featured .card-body {
  color: #FFFFFF !important;
}
.promocion-features li { margin-bottom: .35rem; }
.promocion-cta { width: 100%; }

/* Botones específicos para promociones con colores de marca */
.Promociones .btn-primary, .promociones-grid .promocion-cta.btn-primary {
  background: linear-gradient(90deg, #FF2B50, #e01f3f) !important;
  border: none !important;
  color: #FFFFFF !important;
}
.promociones-grid .promocion-cta.btn-outline-primary {
  border-color: #36034A !important;
  color: #36034A !important;
  background: transparent !important;
}

@media (max-width: 767px) {
  .promocion-ribbon { display: none; }
}
/* Estilos específicos para la página Promociones (separado) */
.Promociones .card { border-radius: 12px; box-shadow: 0 10px 30px rgba(50,0,90,0.06); }
.Promociones h2 { color: var(--brand-primary); }
.Promociones .accordion-button { font-weight: 600; }
.Promociones .badge { font-weight:700; }

@media (max-width: 576px) {
  .Promociones .card { padding: 18px; }
}