/* Hero desktop híbrido: gráfico exportado a 1920 × 960 + texto HTML posicionado sobre el artboard. */
@media (min-width: 768px) {
  .hero { height: auto; min-height: 0; max-height: none; aspect-ratio: 2 / 1; }
  .hero:after { display: none; }

  /* Marca y titular. Los doodles y trazos viven ya en el JPG gráfico. */
  .hero-copy { left: 14.3%; top: 5.8%; width: 24%; }
  .hero-logo { left: -12.25vw; top: 1.2vw; width: 8vw; max-width: none; min-width: 0; }
  .hero-title { position: relative; font-size: 5.2vw; line-height: .76; letter-spacing: .08vw; }
  .hero-title-top { display: block; width: max-content; }
  .hero-title strong { display: block; margin-top: .38vw; font-size: 1.85em; }
  .hero-title .heart, .hero-title .drops { display: none; }
  .tagline { position: absolute; left: -2.2vw; top: 13.15vw; width: 22.4vw; height: 3.15vw; min-height: 0; margin: 0; }
  .tagline > img { display: none; }
  .tagline span { position: absolute; inset: 0; display: grid; place-items: center; padding: 0; color: var(--text-light); white-space: nowrap; font-size: 2.45vw; line-height: 1; transform: none; }

  /* Precios: solo texto sobre los badges ya integrados en el gráfico. */
  .hero-prices { inset: 0; display: block; }
  .price-list { position: absolute; left: 10.8%; top: 44.25%; display: flex; gap: 5.45vw; }
  .price-option { position: relative; width: 9.6vw; height: 16vw; min-width: 0; min-height: 0; padding: 0; color: var(--text-light); }
  .price-option > .badge-pizza, .price-option span img { display: none; }
  .price-option > div { position: relative; z-index: 1; padding: .33vw .2vw 0; display: flex; flex-direction: column; align-items: center; text-align: center; }
  .price-option em { font: 2.25vw/1 var(--font-display); text-transform: uppercase; font-style: normal; }
  .price-option b { margin-top: 1.28vw; font: 2.85vw/.88 var(--font-display); text-transform: uppercase; }
  .price-option small { margin-top: .46vw; font: 1.35vw/1.05 var(--font-display); text-transform: uppercase; white-space: nowrap; }
  .price-option small i { display: block; margin-top: .35vw; color: var(--color-dorado); font-size: .66em; font-style: normal; }
  .price-option span { position: absolute; z-index: 1; left: 0; top: 10.65vw; width: 100%; height: 4.9vw; display: grid; place-items: center; color: var(--text-light); background: none; clip-path: none; font: 3.2vw/1 var(--font-display); transform: none; }

  /* Promo: su botella y trazo rojo ya están en el gráfico. */
  .promo-art { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; color: var(--text-light); }
  .promo-brush, .bottle { display: none; }
  .promo-art p { position: absolute; left: 10.85vw; top: 41.2vw; margin: 0; font: 1.9vw/1.03 var(--font-display); text-transform: uppercase; }
  .promo-art p > span { position: absolute; left: 0; top: 2.6vw; display: block; white-space: nowrap; font: 1.9vw/1 var(--font-display); }
  .promo-art strong { position: absolute; left: 12.35vw; top: -.75vw; display: block; color: var(--color-dorado); font: 6.25vw/1 var(--font-display); }
  .promo-art small { position: absolute; left: 1.6vw; top: 5.35vw; display: block; white-space: nowrap; color: var(--color-kraft); font: 1.55vw/1 var(--font-display); text-transform: uppercase; }
}

@media (max-width: 767px) {
  .price-list { display: contents; }
}