/* =====================================================
   responsive.css — mobile breakpoints
   ===================================================== */

@media (max-width: 900px) {
    .hero-inner, .about-inner, .contact-inner {
        grid-template-columns: 1fr;
    }
    .hero-media, .about-media { order: -1; }

    .services-grid, .portfolio-grid, .blog-home-grid, .testimonials-track {
        grid-template-columns: repeat(2, 1fr);
    }

    .statistics-grid { grid-template-columns: repeat(2, 1fr); gap: var(--space-8); }
    .skills-list { grid-template-columns: 1fr; }

    .hero-title { font-size: var(--text-4xl); }
}

@media (max-width: 640px) {
    section { padding: var(--space-16) var(--content-padding); }

    .navbar-links {
        position: fixed; top: 64px; left: 0; right: 0;
        background: var(--bg); border-bottom: 1px solid var(--border);
        max-height: 0; overflow: hidden; transition: max-height var(--duration) var(--ease);
    }
    .navbar-links.open { max-height: 320px; }
    .navbar-links ul { flex-direction: column; padding: var(--space-4) var(--content-padding); gap: var(--space-4); }
    .navbar-cta { display: none; }
    .navbar-burger { display: flex; }

    .services-grid, .portfolio-grid, .blog-home-grid, .testimonials-track, .statistics-grid {
        grid-template-columns: 1fr;
    }

    .hero-title { font-size: var(--text-3xl); }
    .hero-actions { flex-direction: column; }
    .hero-actions .btn { width: 100%; }

    .project-gallery { grid-template-columns: 1fr; }
    .status-line { font-size: var(--text-xs); flex-wrap: wrap; }
}