/* ============================================================
   GOLDEN PIZZA CAFE — RESPONSIVE RULES
   ============================================================ */

@media (max-width: 980px) {
  .hero-grid { grid-template-columns: 1fr; }
  .hero-visual { order: -1; max-width: 420px; margin: 0 auto; }
  .two-col { grid-template-columns: 1fr; }
  .contact-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .poster-grid { grid-template-columns: 1fr 1fr; }
  .gallery-grid { columns: 2; }
}

@media (max-width: 760px) {
  .nav-links { display: none; }
  .nav-search { display: none; }
  .hamburger { display: flex; }
  .hero { padding: 46px 0 40px; }
  .hero-actions { flex-direction: column; align-items: stretch; }
  .hero-actions .btn { width: 100%; }
  section { padding: 48px 0; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 26px; }
  .poster-grid { grid-template-columns: 1fr; }
  .gallery-grid { columns: 1; }
  .payment-opts { grid-template-columns: 1fr; }
  .form-grid-2 { grid-template-columns: 1fr; }
  .cart-drawer { max-width: 100%; right: -100%; }
  .brand-name { font-size: 15px; }
  .brand img { height: 38px; width: 38px; }
  table { min-width: 560px; }
}

@media (max-width: 480px) {
  .container { padding: 0 16px; }
  .footer-grid { grid-template-columns: 1fr; }
  .product-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
  .product-body { padding: 12px; }
  .product-name { font-size: 14px; }
  .price-tag { font-size: 16px; }
  .size-opt { font-size: 10px; padding: 6px 3px; }
  .hero-chip { left: 8px; bottom: -14px; padding: 10px 14px; }
  .hero-chip .big { font-size: 20px; }
}

/* Mobile bottom tab bar (Home / Menu / Cart / Orders / Account) */
.mobile-tabbar {
  display: none;
}
@media (max-width: 760px) {
  .mobile-tabbar {
    display: flex;
    position: fixed;
    bottom: 0; left: 0; right: 0;
    background: rgba(20,14,12,0.97);
    border-top: 1px solid var(--line);
    backdrop-filter: blur(10px);
    z-index: 180;
    padding: 8px 6px calc(8px + env(safe-area-inset-bottom));
  }
  .mobile-tabbar a {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    font-size: 10px;
    color: var(--text-muted);
    font-family: var(--font-mono);
    text-transform: uppercase;
    letter-spacing: 0.02em;
  }
  .mobile-tabbar a.active { color: var(--gold); }
  body { padding-bottom: 68px; }
  .floating-actions { bottom: 78px; }
  .toast { bottom: calc(150px + env(safe-area-inset-bottom)); }
}