/* ============================================================
   SHAZWEBSOLUTIONS — RESPONSIVE.CSS
   ============================================================ */

/* ── 1080px ─────────────────────────────────────── */
@media (max-width: 1080px) {
    .services-grid {
        grid-template-columns: repeat(2, 1fr);
    }

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

    .contact-panel {
        grid-template-columns: 1fr;
        gap: 52px;
    }

    .contact-copy > p { max-width: none; }

    /* Remove horizontal connector line — cards are stacked */
    .process-grid::before { display: none; }

}

/* ── 820px — mobile nav ──────────────────────────── */
@media (max-width: 820px) {
    .nav-toggle { display: flex; }

    .nav-links {
        position: absolute;
        top: calc(100% + 8px);
        left: 0;
        right: 0;
        display: none;
        flex-direction: column;
        align-items: stretch;
        gap: 4px;
        padding: 12px;
        background: rgba(9, 9, 15, 0.97);
        border: 1px solid var(--border);
        border-radius: var(--radius);
        backdrop-filter: blur(28px);
        -webkit-backdrop-filter: blur(28px);
    }

    .nav-links.is-open { display: flex; }

    .nav-links a:not(.nav-cta) {
        padding: 10px 14px;
        border-radius: var(--radius-sm);
        transition: background 0.2s var(--ease);
    }

    .nav-links a:not(.nav-cta):hover { background: var(--glass); }

    /* Hide underline in mobile dropdown */
    .nav-links a:not(.nav-cta)::after { display: none; }

    .nav-cta {
        margin-top: 6px;
        border-radius: var(--radius-sm) !important;
        text-align: center;
    }

    /* Hero */
    .hero-section {
        padding-top: 96px;
        padding-bottom: 64px;
        min-height: unset;
    }

    .hero-scroll-indicator { display: none; }

    /* Projects */
    .projects-grid { grid-template-columns: 1fr; }
    .project-details-grid { grid-template-columns: 1fr; gap: 24px; }

    /* Process */
    .process-grid { grid-template-columns: 1fr; gap: 16px; }

    /* Sections */
    .section { padding: 88px 0; }
    .section-header { margin-bottom: 48px; }
    .stats-section { padding: 56px 0; }
}

/* ── 640px — single column ───────────────────────── */
@media (max-width: 640px) {
    .container { width: min(var(--container), calc(100% - 32px)); }

    .hero-section { padding-top: 80px; }

    .hero-actions { flex-direction: column; }

    .btn { width: 100%; justify-content: center; }

    .services-grid { grid-template-columns: 1fr; }

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

    .form-row { grid-template-columns: 1fr; }

    .contact-form { padding: 24px 20px; }

    .section { padding: 64px 0; }
    .section-header { margin-bottom: 40px; }

    .footer-inner {
        flex-direction: column;
        align-items: flex-start;
        gap: 14px;
    }

    .marquee-fade { width: 64px; }
}
