/* ============================================================
   responsive.css
   Loaded last so its rules win the cascade at this breakpoint
   without needing !important anywhere.
   ============================================================ */

@media (max-width: 900px) {
  .intro-grid, .about-grid, .contact-grid { grid-template-columns: 1fr; }
  .nav-links { display: none; }
  .nav-links.active {
    display: flex; flex-direction: column; gap: 16px;
    position: absolute; top: 100%; left: 0; right: 0;
    padding: 24px 32px; background: rgba(3, 3, 5, 0.98);
    border-bottom: 1px solid var(--border);
  }
  .menu-toggle { display: flex; }
  .hero h1 { font-size: 2.2rem; }
  section { padding: 60px 20px; }
  .projects-grid, .github-repo-grid { grid-template-columns: 1fr; }
  .github-profile { flex-direction: column; text-align: center; }
  .github-stats-row { justify-content: center; }
}
