/* ═══════════════════════════════════════
   Soup N' Spud - Responsive Breakpoints
═══════════════════════════════════════ */

/* RESPONSIVE */
@media(max-width:900px){
  nav{padding:0 20px;}
  .hero{grid-template-columns:1fr;padding:48px 20px 0;min-height:auto;}
  .hero-right{display:none;}
  .hero-bottom-strip{padding:18px 20px;grid-template-columns:repeat(2,1fr);}
  .page-wrap{padding:40px 20px 80px;}
  .cards{grid-template-columns:1fr;}
  .byo-banner{grid-template-columns:1fr;padding:36px 28px;}
  .catering-hero{grid-template-columns:1fr;padding:36px 28px;}
  .catering-hero-stats{display:none;}
  .footer-grid{grid-template-columns:1fr 1fr;gap:32px;}
  footer{padding:48px 20px 24px;}
  .payment-grid{grid-template-columns:1fr;}
  .admin-wrap{padding:32px 16px 80px;}
  .admin-stats{gap:10px;}
  .admin-stat-card{padding:14px 16px;min-width:0;}
  .admin-stat-n{font-size:22px;}
  .admin-tabs{gap:4px;flex-wrap:wrap;}
  .admin-tab{padding:9px 12px;font-size:12px;}
  .admin-table{font-size:12px;}
  .admin-table th,.admin-table td{padding:10px 8px;}
  .order-card-body{padding:16px;}
  .order-info-grid{grid-template-columns:1fr;}
}

/* ── Tablet tweaks ── */
@media(max-width:768px){
  .nav-brand-logo{width:36px;height:36px;}
  .nav-brand-name{font-size:9px;letter-spacing:.18em;}
  .nav-account{padding:7px 10px;font-size:12px;gap:4px;}
  .nav-account-icon{font-size:13px;}
  #navAccountLabel{display:none;}
  .nav-cart{padding:8px 14px;font-size:12px;gap:5px;}
  .nav-right{gap:8px;}
  .hero-h1{margin-bottom:16px;}
  .hero-sub{margin-bottom:28px;}
  .hero-ctas .btn{padding:13px 28px;font-size:14px;}
  .hero-bottom-strip{gap:14px;}
  .hero-bottom-strip>div{font-size:12px;}
  .modal{max-width:100%;border-radius:18px;margin:10px;}
  .auth-box{width:min(400px,96vw);padding:32px 24px 24px;border-radius:18px;}
  .auth-tabs{margin-bottom:18px;}
  .account-panel{width:100vw;}
  .cart-drawer{width:min(380px,100vw);}
  .email-setting-card{flex-direction:column;align-items:flex-start;gap:14px;}
  .email-setting-card .email-toggle{align-self:flex-end;}
  .email-preview-bar{flex-direction:column;align-items:flex-start;gap:6px;}
}

/* ── Mobile phone ── */
@media(max-width:520px){
  nav{padding:0 14px;height:60px;}
  .nav-brand{gap:0;}
  .nav-brand-logo{width:30px;height:30px;}
  .nav-brand-name{font-size:8px;letter-spacing:.14em;}
  .nav-back{font-size:12px;}
  .nav-back svg{width:16px;height:16px;}
  .progress-bar{top:60px;}
  .hero{padding:32px 16px 0;gap:32px;}
  .hero-tag{font-size:10px;padding:4px 10px;}
  .hero-sub{font-size:14px;}
  .hero-ctas{flex-direction:column;gap:10px;}
  .hero-ctas .btn{width:100%;text-align:center;justify-content:center;}
  .hero-bottom-strip{padding:14px 16px;gap:10px;grid-template-columns:1fr 1fr;}
  .hero-bottom-strip>div{font-size:11px;gap:6px;}
  .page-wrap{padding:28px 16px 60px;}
  .section-tag{font-size:10px;}
  .section-h2{font-size:28px;}
  .section-sub{font-size:13px;}
  .card{border-radius:16px;}
  .card-body{padding:20px 18px;}
  .card-name{font-size:18px;}
  .card-price{font-size:15px;}
  .btn-add{padding:11px 0;font-size:13px;}
  .byo-banner{padding:28px 20px;border-radius:18px;}
  .byo-title{font-size:24px;}
  .byo-desc{font-size:13px;}
  .byo-grid{grid-template-columns:1fr 1fr;gap:10px;}
  .byo-item{padding:10px 8px;font-size:12px;}
  .catering-hero{padding:28px 20px;border-radius:18px;}
  .catering-hero-title{font-size:28px;}
  .footer-grid{grid-template-columns:1fr;gap:24px;}
  .footer-bottom{flex-direction:column;text-align:center;gap:8px;}
  .footer-legal{flex-wrap:wrap;justify-content:center;}
  /* Cart drawer mobile */
  .cart-drawer{width:100vw;border-radius:0;}
  .drawer-head{padding:16px;}
  .drawer-body{padding:12px 16px;}
  .drawer-footer{padding:12px 16px;}
