/* ============================================================
   SHAMS AL GHAIL CAFETERIA — responsive.css
   ============================================================ */

/* ===== XL (≥1400px) ===== */
@media (min-width: 1400px) {
  .hero-title { font-size: 7rem; }
  :root { --section-py: 7rem; }
}

/* ===== LG (≥992px) ===== */
@media (min-width: 992px) {
  .hero-image-col { position: relative; }
  .about-accent-img { display: block; }
}

/* ===== MD (≥768px) ===== */
@media (min-width: 768px) {
  .hero-stats { gap: 3rem; }
  .gallery-masonry { columns: 3; }
}

/* ===== SM (≥576px) ===== */
@media (min-width: 576px) {
  .hero-cta { flex-wrap: nowrap; }
}

/* ===== Max MD (<768px) ===== */
@media (max-width: 767px) {
  :root { --section-py: 4rem; }

  .hero-title { font-size: clamp(2.2rem, 10vw, 3.5rem); }
  .hero-stats { gap: 1.5rem; }
  .hero-stat-num { font-size: 1.8rem; }

  .about-accent-img { display: none; }
  .about-years-badge { right: 0; }

  .about-features { grid-template-columns: 1fr; }

  .hero-image-frame .hero-badge {
    bottom: -.75rem;
    left: -.75rem;
    min-width: 100px;
    padding: 1rem;
  }
  .hero-badge .badge-num { font-size: 1.5rem; }

  .stat-divider { display: none; }

  .contact-form-card { padding: 1.5rem; }

  .footer-bottom { flex-direction: column; text-align: center; }

  .lightbox-img { max-width: 95vw; }

  .cta-title { font-size: 2rem; }
}

/* ===== Max SM (<576px) ===== */
@media (max-width: 575px) {
  .hero-eyebrow { font-size: .65rem; letter-spacing: .2em; }
  .hero-cta { flex-direction: column; }
  .hero-cta .btn-gold,
  .hero-cta .btn-outline { width: 100%; justify-content: center; }

  .cta-btns { flex-direction: column; align-items: center; }
  .cta-btns .btn-gold,
  .cta-btns .btn-outline { width: 100%; max-width: 300px; justify-content: center; }

  .menu-tabs { gap: .35rem; }
  .menu-tab-btn { font-size: .72rem; padding: .45rem 1rem; }

  .gallery-filters { gap: .35rem; }
  .gallery-filter-btn { font-size: .7rem; padding: .4rem 1rem; }

  .section-title { font-size: 1.8rem; }
  .testimonial-card { padding: 1.75rem; }

  #backToTop { bottom: 1.25rem; right: 1.25rem; }
}

/* ===== Touch device improvements ===== */
@media (hover: none) {
  .gallery-item-overlay { opacity: 1; }
  .menu-card:hover { transform: none; }
  .feature-card:hover { transform: none; }
  .why-card:hover { transform: none; }
}

/* ===== Print ===== */
@media print {
  #mainNav, #backToTop, #pageLoader { display: none !important; }
  body { background: #fff; color: #000; }
  section { page-break-inside: avoid; }
}