/* ── Hero responsive ── */
@media (max-width: 860px) {
  /* El hero-section ya se maneja con los selectores de atributo en styles.css */
  .hero-section {
    grid-template-columns: 1fr !important;
    justify-items: center;
    text-align: center;
  }
  .hero-section #hero-text {
    padding: 40px 24px 20px !important;
  }
  .hero-bottle-col {
    display: none !important;
  }
}