/* ==========================================================================
   DIGINETWORK LLC — Responsive styles
   Breakpoints: 1024px (tablet landscape), 860px (tablet / nav switch),
   640px (mobile)
   ========================================================================== */

@media (max-width: 1024px) {
    .card-grid-4 {
        grid-template-columns: repeat(2, 1fr);
    }

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

    .service-layout {
        grid-template-columns: 1fr 280px;
        gap: 32px;
    }

    .footer-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .footer-about {
        grid-column: 1 / -1;
    }
}

@media (max-width: 860px) {
    /* --- Mobile navigation ------------------------------------------------ */
    .nav-toggle {
        display: block;
    }

    .main-nav {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background: var(--color-white);
        border-bottom: 1px solid var(--color-border);
        box-shadow: var(--shadow);
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        padding: 12px 24px 20px;
        display: none;
    }

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

    .nav-list {
        flex-direction: column;
        align-items: stretch;
        gap: 0;
    }

    .nav-link {
        padding: 13px 8px;
        border-bottom: 1px solid var(--color-border);
        border-radius: 0;
        font-size: 1rem;
    }

    .nav-link.is-active {
        box-shadow: inset 3px 0 0 var(--color-accent);
        padding-left: 14px;
    }

    .nav-actions {
        flex-direction: column;
        align-items: stretch;
        margin-top: 14px;
        gap: 10px;
    }

    /* --- Layout stacks ---------------------------------------------------- */
    .hero {
        padding: 48px 0;
    }

    .hero-grid {
        grid-template-columns: 1fr;
        gap: 36px;
    }

    .hero-visual {
        max-width: 520px;
        margin: 0 auto;
    }

    .trust-grid {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .card-grid-3 {
        grid-template-columns: 1fr;
    }

    .pricing-table-grid {
        grid-template-columns: 1fr;
    }

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

    .service-row-side {
        border-left: none;
        border-top: 1px solid var(--color-border);
        padding-left: 0;
        padding-top: 22px;
    }

    .service-layout {
        grid-template-columns: 1fr;
    }

    .service-sidebar {
        position: static;
        order: -1;
    }

    .portfolio-detail {
        grid-template-columns: 1fr;
        padding: 24px;
    }

    .contact-layout {
        grid-template-columns: 1fr;
    }

    .section {
        padding: 52px 0;
    }
}

@media (max-width: 640px) {
    .container {
        padding: 0 18px;
    }

    .card-grid-4 {
        grid-template-columns: 1fr;
    }

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

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

    .form-card {
        padding: 22px 18px;
    }

    .result-card {
        padding: 36px 22px;
    }

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

    .hero-actions .btn {
        width: 100%;
    }

    .cookie-notice-inner {
        flex-direction: column;
        align-items: stretch;
        text-align: left;
    }

    .cookie-notice-actions {
        justify-content: stretch;
    }

    .cookie-notice-actions .btn {
        flex: 1;
    }

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

    .footer-bottom {
        flex-direction: column;
    }

    .process-stage {
        gap: 14px;
    }

    .meta-chips li {
        width: 100%;
    }
}

@media (max-width: 480px) {
    .pricing-facts div,
    .sidebar-facts div,
    .portfolio-facts div,
    .info-list div {
        grid-template-columns: 1fr;
        gap: 4px;
    }
}

/* Print: hide interactive chrome */
@media print {
    .announcement-bar,
    .site-header,
    .cookie-notice,
    .cta-band,
    .site-footer .footer-social {
        display: none !important;
    }
}