/* ============================================================
   StudyCIE — Responsive
   ============================================================ */

/* ===== Large desktop ===== */
@media (max-width: 1200px) {
  :root { --container: 960px; }
  .feature-grid { grid-template-columns: repeat(3, 1fr); }
}

/* ===== Tablet / small desktop ===== */
@media (max-width: 960px) {
  :root { --container: 100%; }

  .header-nav { display: none; }
  .header-hamburger {
    display: flex; align-items: center; justify-content: center;
    width: 38px; height: 38px; border-radius: var(--r-md);
    color: var(--text); transition: all var(--t-fast);
  }
  .header-hamburger:hover { background: var(--gray-100); }

  .two-col { grid-template-columns: 1fr; gap: var(--sp-8); }
  .two-col.reverse .two-col-text { order: 1; }
  .two-col.reverse .two-col-visual { order: 2; }

  .feature-grid { grid-template-columns: repeat(2, 1fr); }
  .subject-grid { grid-template-columns: repeat(2, 1fr); }
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .website-grid { grid-template-columns: repeat(2, 1fr); }

  .practice-layout { grid-template-columns: 1fr; }
  .practice-sidebar { order: 2; }

  .paper-row {
    grid-template-columns: 1fr;
    gap: var(--sp-3);
  }
  .paper-actions { flex-wrap: wrap; }

  .footer-grid { grid-template-columns: 1fr 1fr; gap: var(--sp-8); }
  .footer-brand { grid-column: 1 / -1; }

  .section { padding: var(--sp-12) 0; }
  .info-section { padding: var(--sp-10) 0; }
}

/* ===== Mobile ===== */
@media (max-width: 640px) {
  :root {
    --header-h: 56px;
  }

  .container, .container-narrow { padding: 0 var(--sp-4); }
  .header-inner { padding: 0 var(--sp-4); gap: var(--sp-3); }
  .header-logo { font-size: 1.125rem; }
  .header-logo-mark { width: 28px; height: 28px; font-size: 0.75rem; }

  .hero { padding: var(--sp-20) var(--sp-4) var(--sp-12); }
  .hero-actions { flex-direction: column; width: 100%; }
  .hero-actions .btn { width: 100%; justify-content: center; }

  .feature-grid { grid-template-columns: 1fr; }
  .subject-grid { grid-template-columns: 1fr; }
  .stats-grid { grid-template-columns: 1fr 1fr; gap: var(--sp-3); }
  .stat-card { padding: var(--sp-5) var(--sp-3); }
  .stat-card .stat-number { font-size: 1.5rem; }
  .website-grid { grid-template-columns: 1fr; }

  .visual-card { padding: var(--sp-6); }

  .section { padding: var(--sp-10) 0; }
  .section-head { margin-bottom: var(--sp-8); }

  .footer-grid { grid-template-columns: 1fr; gap: var(--sp-6); }
  .footer-bottom { flex-direction: column; text-align: center; }

  .filter-bar { flex-direction: column; align-items: stretch; }
  .filter-select, .filter-input { min-width: 0; width: 100%; }

  .pdf-viewer-panel { border-radius: var(--r-md); max-height: 100%; }
  .pdf-viewer-header { padding: var(--sp-3) var(--sp-4); flex-wrap: wrap; }
  .pdf-viewer-title { font-size: 0.8125rem; }

  .practice-main { padding: var(--sp-5); }
  .practice-actions { flex-direction: column; }
  .practice-actions .btn { width: 100%; justify-content: center; }

  .syllabus-topics { grid-template-columns: 1fr; }

  .search-panel { border-radius: var(--r-md); }
  .search-close-hint { display: none; }

  h1 { font-size: 2rem; }
  h2 { font-size: 1.5rem; }
}

/* ===== Very small mobile ===== */
@media (max-width: 380px) {
  .stats-grid { grid-template-columns: 1fr; }
  .hero-badge { font-size: 0.75rem; }
}

/* ===== Print ===== */
@media print {
  .site-header, .site-footer, .search-overlay, .mobile-nav, .pdf-viewer { display: none !important; }
  body { color: #000; background: #fff; }
}
