/* =============================================================================
   AIAssetsHub — Responsive CSS
   ============================================================================= */

/* ─── Breakpoints ─────────────────────────────────────────────────────────── */
/* xs: 360px | sm: 576px | md: 768px | lg: 992px | xl: 1200px | 2xl: 1440px  */

/* ─── Extra small devices (360–575px) ────────────────────────────────────── */
@media (max-width: 575px) {
  :root { --header-height: 60px; }
  .container { padding: 0 1rem; }
  .section { padding: var(--space-2xl) 0; }
  h1 { font-size: 1.75rem; }
  h2 { font-size: 1.35rem; }
  .hero-section { min-height: 80vh; }
  .hero-content { padding: 0; }
  .hero-buttons { flex-direction: column; }
  .hero-buttons .btn { width: 100%; }
  .product-card-actions { flex-direction: column; }
  .product-card-actions .btn { width: 100%; }
  .checkout-layout { grid-template-columns: 1fr; }
  .cart-layout { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; }
  .stats-row { flex-direction: column; }
  .section-title { margin-bottom: var(--space-xl); }
}

/* ─── Small devices (576–767px) ──────────────────────────────────────────── */
@media (min-width: 576px) and (max-width: 767px) {
  .products-grid { grid-template-columns: repeat(2, 1fr); }
  .category-grid { grid-template-columns: repeat(2, 1fr); }
  .membership-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
}

/* ─── Medium devices (768–991px) ─────────────────────────────────────────── */
@media (min-width: 768px) and (max-width: 991px) {
  .shop-layout { grid-template-columns: 220px 1fr; }
  .products-grid { grid-template-columns: repeat(2, 1fr); }
  .membership-grid { grid-template-columns: repeat(2, 1fr); }
  .account-layout { grid-template-columns: 200px 1fr; }
}

/* ─── Large devices (992px+) ─────────────────────────────────────────────── */
@media (min-width: 992px) {
  .products-grid { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
  .category-grid { grid-template-columns: repeat(4, 1fr); }
}

/* ─── XL devices (1200px+) ───────────────────────────────────────────────── */
@media (min-width: 1200px) {
  .products-grid { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
  .stats-grid { grid-template-columns: repeat(4, 1fr); }
}

/* ─── Overflow safety ─────────────────────────────────────────────────────── */
body, html {
  overflow-x: hidden;
  max-width: 100vw;
}

/* ─── Print ───────────────────────────────────────────────────────────────── */
@media print {
  .site-header, .site-footer, .sidebar, .admin-sidebar { display: none !important; }
  .admin-main, .account-content { margin: 0 !important; }
  body { background: #fff; color: #000; }
}