/* ============================================================
   RESPONSIVE
   Breakpoints: 1180 (container) / 1024 laptop / 860 tablet / 600 mobile
   ============================================================ */

/* ---- Laptop ---- */
@media (max-width: 1024px) {
  .project-grid, .grid-cols-3, .grid-cols-4 { grid-template-columns: repeat(2, 1fr); }
  .stats-row { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .hero-grid { gap: 40px; }
  .blog-post-layout { grid-template-columns: 180px 1fr; gap: 36px; }
  .resume-sheet { padding: 40px; }
}

/* ---- Tablet ---- */
@media (max-width: 860px) {
  .section { padding: 76px 0; }

  .hero { padding: 52px 0 64px; }
  .hero-grid { grid-template-columns: 1fr; }
  .hero-lede { max-width: 100%; }
  .terminal { order: -1; }
  .terminal-body { min-height: 220px; }

  .nav-links { display: none; }
  .nav-toggle {
    display: flex;
    width: 40px; height: 40px;
    align-items: center; justify-content: center;
    border-radius: var(--radius-sm);
    border: 1px solid var(--border);
  }
  .nav-toggle svg { width: 20px; height: 20px; }

  .mobile-menu {
    display: block;
    position: fixed;
    inset: calc(var(--nav-h) + var(--status-h)) 0 0 0;
    background: var(--bg);
    z-index: 99;
    padding: 24px;
    transform: translateY(-12px);
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s var(--ease);
    overflow-y: auto;
  }
  .mobile-menu.open { transform: translateY(0); opacity: 1; visibility: visible; }
  .mobile-menu a {
    display: block;
    padding: 16px 4px;
    font-family: var(--font-display);
    font-size: 1.3rem;
    border-bottom: 1px solid var(--border);
    color: var(--text-primary);
  }
  .mobile-menu .mobile-actions { display: flex; gap: 10px; margin-top: 28px; }

  .project-grid, .grid-cols-2, .grid-cols-3, .grid-cols-4 { grid-template-columns: 1fr; }
  .stats-row { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }

  .filter-bar { flex-direction: column; align-items: stretch; }
  .search-box { min-width: 0; }

  .blog-post-layout { grid-template-columns: 1fr; }
  .toc-aside { position: static; order: 2; border-top: 1px solid var(--border); padding-top: 24px; margin-top: 12px; }
  .blog-post-body { order: 1; max-width: 100%; }

  .resume-entry { grid-template-columns: 1fr; gap: 6px; }
  .resume-header { flex-direction: column; }
}

/* ---- Mobile ---- */
@media (max-width: 600px) {
  .container { padding: 0 18px; }
  h1 { font-size: clamp(2rem, 8vw, 2.6rem); }
  .section { padding: 60px 0; }
  .hero { padding: 40px 0 48px; }

  .hero-actions { flex-direction: column; align-items: stretch; }
  .hero-actions .btn { width: 100%; }

  .stats-row { grid-template-columns: 1fr 1fr; }
  .stat-cell { padding: 22px 14px; }

  .nav-actions > a.btn { display: none; }

  .footer-grid { grid-template-columns: 1fr; gap: 28px; }
  .footer-bottom { flex-direction: column; align-items: flex-start; }

  .tabs { overflow-x: auto; flex-wrap: nowrap; }
  .tab-btn { flex-shrink: 0; }

  .back-to-top { right: 16px; bottom: 16px; width: 42px; height: 42px; }

  .profile-card { max-width: 100%; }

  table { display: block; overflow-x: auto; white-space: nowrap; }
}

/* ---- Print (resume page) ---- */
@media print {
  .site-nav, .status-strip, .site-footer, .back-to-top, .no-print { display: none !important; }
  body { background: #fff; color: #111; }
  .page-hero { background: none !important; border-radius: 0 !important; }
  .dot-cluster { display: none !important; }
  a { color: #111; text-decoration: underline; }
  .section { padding: 12px 0; }
}