/* EXTRA SMALL DEVICES (<=480px) */
@media (max-width: 480px) {
  .book-card-image-wrap { aspect-ratio: 1 / 1.5; }
  .book-card-title { font-size: 0.75rem; }
  .book-card-price-current { font-size: 0.875rem; }
  .book-card-body { padding: 8px; gap: 4px; }
  .add-to-cart-btn { font-size: 0.75rem; padding: 6px 12px; }
  .discount-badge { font-size: 0.625rem; padding: 2px 6px; }
  .section-title h2 { font-size: 1rem; }
  .modal-content { padding: 20px; }
  .category-banners { gap: 8px; }
  .subject-card { padding: 14px 12px; font-size: 0.8125rem; }
}

/* SMALL DEVICES (>=640px) */
@media (min-width: 640px) {
  .header-logo span { font-size: 1.5rem; }

  .subject-tab { font-size: 0.9375rem; }
}

/* MEDIUM DEVICES (>=768px) */
@media (min-width: 768px) {
  .book-grid { grid-template-columns: repeat(3, 1fr); }
  .category-banners { grid-template-columns: repeat(3, 1fr); }
  .subject-grid { grid-template-columns: repeat(3, 1fr); }
  .modal-body { flex-direction: row; align-items: flex-start; }
  .subject-card { padding: 24px 20px; font-size: 0.9375rem; }
}

/* LARGE DEVICES (>=1024px) */
@media (min-width: 1024px) {
  .book-grid { grid-template-columns: repeat(4, 1fr); }
  .header-inner { padding: 0 32px; }

  .subject-grid { grid-template-columns: repeat(4, 1fr); }
  .subject-tab { padding: 12px 32px; font-size: 1rem; }
}

/* EXTRA LARGE DEVICES (>=1280px) */
@media (min-width: 1280px) {
  .book-grid { grid-template-columns: repeat(4, 1fr); }
  .book-card-body { padding: 16px; gap: 8px; }
  .book-card-title { font-size: 0.875rem; }
}

/* TABLET PORTRAIT */
@media (min-width: 768px) and (max-width: 1023px) {
  .book-grid { grid-template-columns: repeat(3, 1fr); gap: 16px; }
  .category-banners { gap: 12px; }
}

/* LANDSCAPE PHONES */
@media (min-width: 480px) and (max-width: 767px) {
  .book-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .subject-grid { grid-template-columns: repeat(2, 1fr); }
}

/* DARK MODE (future) */
@media (prefers-color-scheme: dark) {
  :root { --muted: #1e293b; }
}

/* PRINT */
@media print {
  .header, .bottom-nav, .mobile-menu-overlay, .search-overlay, .search-panel { display: none; }
  body { padding-bottom: 0; }
}

/* WHATSAPP FLOATING BUTTON - MOBILE SPACING */
@media (max-width: 767px) {
  .whatsapp-float { bottom: 80px; }
}

/* ACCESSIBILITY */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}