/* Elementos compartidos por todas las campañas */
[hidden] {
  display: none !important;
}

.purchase-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: -8px 0 20px;
}

.purchase-option {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 3px;
  min-height: 82px;
  padding: 13px 15px;
  border: 2px solid #dedede;
  border-radius: 10px;
  background: #fff;
  color: #252525;
  font-family: 'Quicksand', sans-serif;
  text-align: left;
  cursor: pointer;
  transition: border-color 0.15s, box-shadow 0.15s, transform 0.15s;
}

.purchase-option:hover {
  border-color: var(--campaign-accent, #DD1820);
  transform: translateY(-1px);
}

.purchase-option.active {
  border-color: var(--campaign-accent, #DD1820);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--campaign-accent, #DD1820) 16%, transparent);
}

.purchase-option-label {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.4px;
  text-transform: uppercase;
}

.purchase-option strong {
  font-size: 19px;
}

.purchase-option small {
  color: #55725f;
  font-size: 11px;
  font-weight: 700;
}

.campaign-chip {
  display: inline-flex;
  align-items: center;
  margin-left: 8px;
  padding: 4px 9px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.5px;
  vertical-align: middle;
}

.campaign-preview-badge {
  position: fixed;
  right: 16px;
  bottom: 16px;
  z-index: 9998;
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 999px;
  background: rgba(20, 20, 20, 0.92);
  color: #fff;
  padding: 10px 16px;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.28);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.3px;
  pointer-events: none;
}

/* VERANO: conserva la identidad roja y amarilla actual */
html[data-campaign="verano"] .campaign-chip {
  background: #fff0a6;
  color: #8c5000;
}

html[data-campaign="verano"] {
  --campaign-accent: #DD1820;
}

html[data-campaign="verano"] .features-section {
  background:
    radial-gradient(circle at 10% 15%, rgba(255, 212, 59, 0.18), transparent 22%),
    #fff8f8;
}

/* OTOÑO */
html[data-campaign="otono"] body {
  background: #fffaf2;
}

html[data-campaign="otono"] {
  --campaign-accent: #a4421f;
}

html[data-campaign="otono"] .announcement-bar {
  background: linear-gradient(90deg, #5f2917, #9b4d22, #5f2917);
  color: #fff1c7;
}

html[data-campaign="otono"] header,
html[data-campaign="otono"] .mobile-nav {
  background: #8c351d;
  border-bottom: 2px solid #e7a83e;
}

html[data-campaign="otono"] .campaign-chip {
  background: #fff0c9;
  color: #7c3518;
  box-shadow: inset 0 0 0 1px #e6b45f;
}

html[data-campaign="otono"] .product-brand,
html[data-campaign="otono"] .price-sale,
html[data-campaign="otono"] .accordion-header .icon {
  color: #a4421f;
}

html[data-campaign="otono"] .thumb.active {
  border-color: #c46b2d;
}

html[data-campaign="otono"] .badge-sale {
  background: #e7a83e;
  color: #432111;
}

html[data-campaign="otono"] .btn-buy-stripe {
  background: linear-gradient(135deg, #b34d24, #873018);
  box-shadow: 0 8px 20px rgba(135, 48, 24, 0.22);
}

html[data-campaign="otono"] .btn-buy-stripe:hover {
  background: linear-gradient(135deg, #9c3f1d, #702714);
}

html[data-campaign="otono"] .features-section {
  background:
    radial-gradient(circle at 12% 20%, rgba(231, 168, 62, 0.22), transparent 24%),
    radial-gradient(circle at 88% 76%, rgba(140, 53, 29, 0.12), transparent 22%),
    #fff4df;
  border-color: #b34d24;
}

html[data-campaign="otono"] .feature-card {
  border-color: #f0dcc0;
  box-shadow: 0 8px 24px rgba(95, 41, 23, 0.07);
}

html[data-campaign="otono"] .feature-card:hover {
  border-color: #c46b2d;
}

html[data-campaign="otono"] .btn-show-more {
  border-color: #8c351d;
  color: #8c351d;
}

html[data-campaign="otono"] .btn-show-more:hover {
  background: #8c351d;
  color: #fff;
}

html[data-campaign="otono"] .cta-band {
  background:
    radial-gradient(circle at 15% 30%, rgba(255, 222, 157, 0.14), transparent 24%),
    linear-gradient(135deg, #9b4d22, #622616);
  border-top: 3px solid #e7a83e;
}

html[data-campaign="otono"] .btn-cta-big {
  background: #f2c15d;
  color: #432111;
}

/* BLACK FRIDAY */
html[data-campaign="black-friday"] body {
  background: #f6f2e8;
}

html[data-campaign="black-friday"] {
  --campaign-accent: #e94d00;
}

html[data-campaign="black-friday"] .announcement-bar {
  background: linear-gradient(90deg, #050505, #242424, #050505);
  color: #ffd43b;
}

html[data-campaign="black-friday"] header,
html[data-campaign="black-friday"] .mobile-nav {
  background: #090909;
  border-bottom: 2px solid #ffd43b;
}

html[data-campaign="black-friday"] .product-section,
html[data-campaign="black-friday"] .accordion-section,
html[data-campaign="black-friday"] .reviews-section {
  position: relative;
}

html[data-campaign="black-friday"] .campaign-chip {
  background: #151515;
  color: #ffd43b;
  box-shadow: inset 0 0 0 1px #ffd43b;
}

html[data-campaign="black-friday"] .product-brand,
html[data-campaign="black-friday"] .price-sale,
html[data-campaign="black-friday"] .accordion-header .icon {
  color: #e94d00;
}

html[data-campaign="black-friday"] .thumb.active {
  border-color: #ffd43b;
  box-shadow: 0 0 0 1px #111;
}

html[data-campaign="black-friday"] .badge-sale {
  background: #111;
  color: #ffd43b;
  box-shadow: 0 0 0 1px #ffd43b;
}

html[data-campaign="black-friday"] .btn-buy-stripe {
  background: linear-gradient(135deg, #ff6a00, #dd3600);
  box-shadow: 0 8px 20px rgba(221, 54, 0, 0.24);
}

html[data-campaign="black-friday"] .btn-buy-stripe:hover {
  background: linear-gradient(135deg, #e95700, #be2e00);
}

html[data-campaign="black-friday"] .features-section {
  background:
    linear-gradient(135deg, rgba(255, 212, 59, 0.08) 25%, transparent 25%) 0 0 / 28px 28px,
    #111;
  border-color: #ffd43b;
}

html[data-campaign="black-friday"] .features-section .section-title {
  color: #ffd43b;
}

html[data-campaign="black-friday"] .feature-card {
  border-color: #2c2c2c;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.24);
}

html[data-campaign="black-friday"] .feature-card:hover {
  border-color: #ffd43b;
}

html[data-campaign="black-friday"] .btn-show-more {
  border-color: #111;
  color: #111;
}

html[data-campaign="black-friday"] .btn-show-more:hover {
  background: #111;
  color: #ffd43b;
}

html[data-campaign="black-friday"] .cta-band {
  background:
    radial-gradient(circle at 15% 50%, rgba(255, 212, 59, 0.14), transparent 28%),
    #090909;
  color: #fff;
  border-top: 3px solid #ffd43b;
}

html[data-campaign="black-friday"] .btn-cta-big {
  background: #ffd43b;
  color: #090909;
}

/* CYBER MONDAY */
html[data-campaign="cyber-monday"] body {
  background: #f1f8fb;
}

html[data-campaign="cyber-monday"] {
  --campaign-accent: #007f91;
}

html[data-campaign="cyber-monday"] .announcement-bar {
  background: linear-gradient(90deg, #020712, #08263b, #020712);
  color: #5ff5ff;
}

html[data-campaign="cyber-monday"] header,
html[data-campaign="cyber-monday"] .mobile-nav {
  background: #061421;
  border-bottom: 2px solid #29dce7;
}

html[data-campaign="cyber-monday"] .campaign-chip {
  background: #071b2a;
  color: #5ff5ff;
  box-shadow: inset 0 0 0 1px #29dce7;
}

html[data-campaign="cyber-monday"] .product-brand,
html[data-campaign="cyber-monday"] .price-sale,
html[data-campaign="cyber-monday"] .accordion-header .icon {
  color: #007f91;
}

html[data-campaign="cyber-monday"] .thumb.active {
  border-color: #11baca;
  box-shadow: 0 0 0 1px #061421;
}

html[data-campaign="cyber-monday"] .badge-sale {
  background: #071b2a;
  color: #5ff5ff;
  box-shadow: 0 0 0 1px #29dce7;
}

html[data-campaign="cyber-monday"] .btn-buy-stripe {
  background: linear-gradient(135deg, #00aebe, #006c91);
  box-shadow: 0 8px 22px rgba(0, 108, 145, 0.24);
}

html[data-campaign="cyber-monday"] .btn-buy-stripe:hover {
  background: linear-gradient(135deg, #0095a3, #005b79);
}

html[data-campaign="cyber-monday"] .features-section {
  background:
    linear-gradient(rgba(41, 220, 231, 0.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(41, 220, 231, 0.07) 1px, transparent 1px),
    #061421;
  background-size: 28px 28px;
  border-color: #29dce7;
}

html[data-campaign="cyber-monday"] .features-section .section-title {
  color: #5ff5ff;
}

html[data-campaign="cyber-monday"] .feature-card {
  border-color: #bde8eb;
  box-shadow: 0 8px 24px rgba(0, 108, 145, 0.12);
}

html[data-campaign="cyber-monday"] .feature-card:hover {
  border-color: #29dce7;
}

html[data-campaign="cyber-monday"] .btn-show-more {
  border-color: #007f91;
  color: #007f91;
}

html[data-campaign="cyber-monday"] .btn-show-more:hover {
  background: #007f91;
  color: #fff;
}

html[data-campaign="cyber-monday"] .cta-band {
  background:
    radial-gradient(circle at 18% 40%, rgba(95, 245, 255, 0.12), transparent 26%),
    linear-gradient(135deg, #08263b, #020712);
  border-top: 3px solid #29dce7;
}

html[data-campaign="cyber-monday"] .btn-cta-big {
  background: #5ff5ff;
  color: #061421;
}

/* NAVIDAD / INVIERNO */
html[data-campaign="navidad"] body {
  background: #f5fbfa;
}

html[data-campaign="navidad"] {
  --campaign-accent: #a6121b;
}

html[data-campaign="navidad"] .announcement-bar {
  background: linear-gradient(90deg, #0b4b3f, #146b58, #0b4b3f);
  color: #fff7d1;
}

html[data-campaign="navidad"] header,
html[data-campaign="navidad"] .mobile-nav {
  background: #a6121b;
  border-bottom: 2px solid #f2d06b;
}

html[data-campaign="navidad"] .campaign-chip {
  background: #e8f5ef;
  color: #0b644f;
  box-shadow: inset 0 0 0 1px #8dbfac;
}

html[data-campaign="navidad"] .product-brand,
html[data-campaign="navidad"] .price-sale,
html[data-campaign="navidad"] .accordion-header .icon {
  color: #a6121b;
}

html[data-campaign="navidad"] .thumb.active {
  border-color: #0b644f;
}

html[data-campaign="navidad"] .badge-sale {
  background: #0b644f;
  color: #fff;
}

html[data-campaign="navidad"] .btn-buy-stripe {
  background: linear-gradient(135deg, #bf1824, #941019);
  box-shadow: 0 8px 20px rgba(148, 16, 25, 0.22);
}

html[data-campaign="navidad"] .btn-buy-stripe:hover {
  background: linear-gradient(135deg, #a8131d, #7d0d15);
}

html[data-campaign="navidad"] .features-section {
  background:
    radial-gradient(circle, rgba(255,255,255,0.95) 0 2px, transparent 2.5px) 0 0 / 30px 30px,
    linear-gradient(135deg, #eaf7f3, #fff8ee);
  border-color: #0b644f;
}

html[data-campaign="navidad"] .feature-card {
  border-color: #d9ebe5;
  box-shadow: 0 8px 24px rgba(11, 100, 79, 0.08);
}

html[data-campaign="navidad"] .feature-card:hover {
  border-color: #a6121b;
}

html[data-campaign="navidad"] .btn-show-more {
  border-color: #0b644f;
  color: #0b644f;
}

html[data-campaign="navidad"] .btn-show-more:hover {
  background: #0b644f;
  color: #fff;
}

html[data-campaign="navidad"] .cta-band {
  background:
    radial-gradient(circle at 20% 30%, rgba(255,255,255,0.13), transparent 24%),
    linear-gradient(135deg, #0b644f, #083e34);
  color: #fff;
  border-top: 3px solid #f2d06b;
}

html[data-campaign="navidad"] .btn-cta-big {
  background: #f2d06b;
  color: #17382f;
}

html[data-campaign="navidad"] footer {
  border-top: 3px solid #a6121b;
}

@media (max-width: 600px) {
  .purchase-options {
    grid-template-columns: 1fr;
  }

  .campaign-chip {
    display: flex;
    width: max-content;
    margin: 8px 0 0;
  }

  .campaign-preview-badge {
    right: 10px;
    bottom: 10px;
  }
}