/* ==========================================================================
   Adriano's Organic Products — Estilos responsive
   ========================================================================== */

/* ----- Tablets grandes ----- */
@media (max-width: 1080px) {
  .grid-4 { grid-template-columns: repeat(3, 1fr); }
  .grid-6 { grid-template-columns: repeat(3, 1fr); }
  .products-layout { grid-template-columns: 220px 1fr; }
  .footer-top { grid-template-columns: 1.4fr 1fr 1fr; }
  .footer-col:last-child { grid-column: 1 / -1; }
}

/* ----- Tablets ----- */
@media (max-width: 900px) {
  :root { --header-height: 118px; }

  .main-nav,
  .search-box { display: none; }

  .hamburger { display: flex; }

  .hero .container { grid-template-columns: 1fr; text-align: center; }
  .hero p { margin-left: auto; margin-right: auto; }
  .hero-actions, .hero-badges { justify-content: center; }
  .hero-visual { margin-top: 20px; }

  .grid-3 { grid-template-columns: repeat(2, 1fr); }
  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .grid-6 { grid-template-columns: repeat(2, 1fr); }

  .products-layout { grid-template-columns: 1fr; }
  .filters-panel { position: static; }

  .product-detail { grid-template-columns: 1fr; }
  .about-hero { grid-template-columns: 1fr; }
  .about-hero .media-emoji { order: -1; }
  .values-grid { grid-template-columns: 1fr; }

  .cart-layout { grid-template-columns: 1fr; }
  .cart-summary { position: static; }

  .checkout-layout { grid-template-columns: 1fr; }
  .order-summary-box { position: static; }

  .contact-layout { grid-template-columns: 1fr; }

  .form-row { grid-template-columns: 1fr; }
  .radio-cards { grid-template-columns: 1fr; }

  section { padding: 56px 0; }
}

/* ----- Móviles ----- */
@media (max-width: 600px) {
  :root { --header-height: 108px; }

  .container { padding: 0 16px; }

  .topbar { font-size: 0.72rem; }

  .brand img { height: 42px; }
  .brand-text strong { font-size: 1rem; }
  .brand-text span { display: none; }

  .header-actions .btn-whatsapp span.label { display: none; }
  .header-actions { gap: 2px; }

  .hero { padding: 40px 0; }
  .hero-actions { flex-direction: column; align-items: stretch; }
  .hero-actions .btn { width: 100%; }
  .hero-circle { padding: 24px; gap: 10px; }

  .grid-2, .grid-3, .grid-4, .grid-6 { grid-template-columns: repeat(2, 1fr); gap: 14px; }

  .section-head { margin-bottom: 28px; }

  .product-actions .row { flex-direction: column; }

  .cta-final { margin: 0 12px; padding: 40px 20px; }

  .footer-top { grid-template-columns: 1fr; gap: 28px; padding: 40px 0 20px; }
  .footer-bottom { flex-direction: column; text-align: center; }

  .whatsapp-float { bottom: 16px; right: 16px; }
  .whatsapp-float .bubble { display: none; }
  .whatsapp-float a { width: 54px; height: 54px; font-size: 1.5rem; }
  .back-to-top { bottom: 16px; left: 16px; width: 42px; height: 42px; }

  .cart-item { grid-template-columns: 60px 1fr; grid-template-areas: "img info" "img price" "actions actions"; row-gap: 8px; }
  .cart-item .media-emoji { grid-area: img; width: 60px; height: 60px; font-size: 1.6rem; }
  .cart-item-info { grid-area: info; }
  .cart-item-price { grid-area: price; }
  .cart-item-remove { grid-area: actions; justify-self: end; }

  .detail-actions .btn { min-width: 100%; }

  .modal-box { padding: 22px; }
  .modal-actions { flex-direction: column; }

  .toast-container { left: 12px; right: 12px; }
  .toast { min-width: 0; width: 100%; }
}

/* ----- Móviles pequeños ----- */
@media (max-width: 380px) {
  .grid-2, .grid-3, .grid-4, .grid-6 { grid-template-columns: 1fr; }
}