/* ============================================================
   Edwin H Graphics — Responsive Styles
   ============================================================ */

/* ── 1200px ─────────────────────────────────────────────── */
@media (max-width: 1200px) {
    .footer-grid { grid-template-columns: 1fr 1fr; gap: var(--space-md); }
    .about-hero-grid { grid-template-columns: 1fr; gap: var(--space-lg); }
    .about-portrait { max-width: 420px; }
    .story-grid { grid-template-columns: 1fr; }
    .story-image { order: -1; }
    .contact-grid { grid-template-columns: 1fr; }
}

/* ── 992px ──────────────────────────────────────────────── */
@media (max-width: 992px) {
    :root { --space-xl: 4rem; --space-xxl: 5rem; }

    /* Nav collapse */
    .hamburger { display: flex; }
    .header-cta { display: none; }

    .main-nav {
        position: fixed;
        top: var(--header-h);
        left: 0; right: 0;
        background: rgba(5,5,5,0.98);
        backdrop-filter: blur(16px);
        border-bottom: 1px solid var(--color-border);
        padding: var(--space-md) var(--space-md) var(--space-lg);
        transform: translateY(-110%);
        opacity: 0;
        visibility: hidden;
        transition: all var(--transition);
        z-index: 999;
        margin-left: 0;
    }
    .main-nav.nav-open {
        transform: translateY(0);
        opacity: 1;
        visibility: visible;
    }
    .nav-list {
        flex-direction: column;
        align-items: flex-start;
        gap: 0;
    }
    .nav-list li { width: 100%; }
    .nav-link {
        display: block;
        padding: var(--space-sm) 0;
        font-size: 1.4rem;
        border-bottom: 1px solid var(--color-border);
        font-family: var(--font-heading);
        letter-spacing: 0.05em;
        color: var(--color-white);
    }
    .nav-link:last-child { border-bottom: none; }
    .nav-list::after {
        content: '';
        display: block;
        margin-top: var(--space-md);
    }

    /* Mobile CTA inside nav */
    .nav-mobile-cta {
        display: block !important;
        margin-top: var(--space-md);
        width: 100%;
        text-align: center;
    }

    .process-preview-grid { grid-template-columns: repeat(2, 1fr); }
    .process-preview-grid::before { display: none; }

    /* Timeline collapses to single column on tablet */
    .process-timeline-line { left: 28px; }
    .process-tl-item {
        grid-template-columns: 56px 1fr;
        grid-template-rows: auto;
        gap: 0 1.2rem;
        margin-bottom: 2rem;
    }
    .process-tl-left .process-tl-card,
    .process-tl-right .process-tl-card  { grid-column: 2; grid-row: 1; text-align: left; }
    .process-tl-left .process-tl-node,
    .process-tl-right .process-tl-node  { grid-column: 1; grid-row: 1; }
    .process-tl-left .process-tl-spacer,
    .process-tl-right .process-tl-spacer{ display: none; }
    .process-tl-list li { flex-direction: row !important; justify-content: flex-start !important; }
    .intake-layout { grid-template-columns: 1fr; }
    .intake-sidebar { display: none; }

    .hero { min-height: auto; padding: calc(var(--header-h) + var(--space-lg)) 0 var(--space-xl); }
    .trust-points { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .hero-bg img { object-position: 58% center; }
    .services-hero .hero-bg img { object-position: 60% center; }
    .work-hero .hero-bg img { object-position: 62% center; }
    .process-hero .hero-bg img { object-position: 62% center; }
    .contact-hero { padding: calc(var(--header-h) + var(--space-md)) 0 var(--space-lg); }
    .contact-hero .hero-bg img { object-position: 62% center; }
    .about-page-hero .hero-bg img { object-position: 56% center; }
}

/* ── 768px ──────────────────────────────────────────────── */
@media (max-width: 768px) {
    :root { --space-xl: 3rem; }

    h1 { font-size: clamp(2.5rem, 10vw, 4rem); }
    h2 { font-size: clamp(1.8rem, 8vw, 3rem); }

    .portfolio-grid { grid-template-columns: 1fr; }
    .services-grid { grid-template-columns: 1fr; }
    .benefits-grid { grid-template-columns: 1fr; }
    .values-grid { grid-template-columns: 1fr 1fr; }
    .stats-row { gap: var(--space-md); justify-content: center; }
    .footer-grid { grid-template-columns: 1fr; }
    .footer-bottom { flex-direction: column; gap: 0.5rem; text-align: center; }

    .form-row { grid-template-columns: 1fr; }
    .form-card { padding: var(--space-md); }

    .project-body-grid { grid-template-columns: 1fr; }
    .project-meta-row { flex-direction: column; gap: var(--space-sm); }
    .gallery-grid { grid-template-columns: 1fr; }
    .project-results { grid-template-columns: repeat(2, 1fr); }

    .next-project-inner { flex-direction: column; align-items: flex-start; }
    .section-header { flex-direction: column; align-items: flex-start; }

    .about-portrait img { height: 380px; }
    .story-image img { height: 280px; }

    .process-step { grid-template-columns: 60px 1fr; }
    .process-num { font-size: 3rem; }

    .cta-section::before {
        background-image:
            linear-gradient(90deg, rgba(5,5,5,0.94) 0%, rgba(5,5,5,0.82) 48%, rgba(5,5,5,0.94) 100%),
            url('/assets/images/cta/cta-bg-800.jpg');
        background-image:
            linear-gradient(90deg, rgba(5,5,5,0.94) 0%, rgba(5,5,5,0.82) 48%, rgba(5,5,5,0.94) 100%),
            image-set(url('/assets/images/cta/cta-bg-800.webp') type('image/webp') 1x);
    }

    .brand-strip-inner { gap: var(--space-md); }
    .brand-names { gap: var(--space-md); }

    .reports-grid { grid-template-columns: 1fr; }
    .process-preview-grid { grid-template-columns: 1fr; }
    .trust-points { grid-template-columns: 1fr; max-width: 520px; }
    .trust-point { min-height: 0; }
}

/* ── 576px ──────────────────────────────────────────────── */
@media (max-width: 576px) {
    :root { --space-lg: 2.5rem; --space-xl: 2.5rem; }

    .container { padding: 0 var(--space-sm); }

    .hero-actions { flex-direction: column; align-items: flex-start; }
    .btn { width: 100%; justify-content: center; }
    .hero-actions .btn { width: auto; }

    .values-grid { grid-template-columns: 1fr; }
    .project-results { grid-template-columns: 1fr 1fr; }
    .cta-actions { flex-direction: column; }
    .cta-actions .btn { width: 100%; justify-content: center; }
    .error-actions { flex-direction: column; }

    .filter-btn { font-size: 0.72rem; padding: 0.4rem 0.8rem; }
    .portfolio-filters { gap: 0.3rem; }

    .portfolio-thumb { height: 180px; }
    .trust-point { padding: 0.95rem; }
    .trust-point-icon { width: 42px; height: 42px; flex-basis: 42px; }

    .stat-number { font-size: 2.2rem; }
}

/* ── Print ──────────────────────────────────────────────── */
@media print {
    .site-header, .site-footer, .back-to-top, .hamburger { display: none; }
    body { background: white; color: black; }
}