/* ============================================================
   Inter marK Systems V.B. — Responsive Stylesheet
   ============================================================ */

/* ── Tablet: ≤ 900px ── */
@media (max-width: 900px) {

    /* Nav */
    .nav-toggle { display: flex; }
    .site-header {
        top: 8px;
        width: calc(100% - 32px);
    }
    .nav-links {
        display: none;
        position: fixed;
        top: calc(var(--nav-h) + 20px);
        left: 16px;
        right: 16px;
        background: rgba(255,255,255,0.97);
        backdrop-filter: blur(12px);
        border: 1px solid var(--color-border);
        border-radius: 12px;
        flex-direction: column;
        align-items: flex-start;
        padding: 8px 0;
        box-shadow: 0 4px 20px rgba(0,0,0,0.10);
        z-index: 99;
    }
    .nav-links.open { display: flex; }
    .nav-links li { width: 100%; }
    .nav-links a {
        display: block;
        padding: 12px 20px;
        border-bottom: 1px solid var(--color-border);
        font-size: 15px;
    }
    .nav-links li:last-child a { border-bottom: none; }

    /* Cards grid 2→1 col */
    .cards-grid {
        grid-template-columns: 1fr;
    }

    /* Service card: stack vertically */
    .service-card {
        grid-template-columns: 1fr;
    }
    .service-card-image { min-height: 200px; }
    .service-card-image .img-placeholder { min-height: 200px; }

    /* Core values: stack */
    .corevalue-card {
        grid-template-columns: 1fr;
        min-height: auto;
    }
    .corevalue-image { order: -1; }
    .corevalue-image .img-placeholder { min-height: 200px; }

    /* Projects: 2 col */
    .projects-grid { grid-template-columns: repeat(2, 1fr); }

    /* Info page */
    .info-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    /* Footer */
    .site-footer {
        bottom: 8px;
        width: calc(100% - 32px);
    }
    .footer-inner { flex-wrap: wrap; gap: 8px; }
    .footer-cookie { margin-left: 0; width: 100%; order: 3; font-size: 11px; }
    .footer-top { margin-left: auto; }
}

/* ── Mobile: ≤ 600px ── */
@media (max-width: 600px) {

    .page-header { padding: 36px 0 28px; }

    /* Projects: 1 col */
    .projects-grid { grid-template-columns: 1fr; }

    /* Form row: stack */
    .form-row { grid-template-columns: 1fr; }

    /* Core value content padding */
    .corevalue-content { padding: 28px 24px; }
    .corevalue-content h3 { font-size: 22px; }

    /* Service card padding */
    .service-card-content { padding: 20px; }
    .bailor-card-content { padding: 18px 20px; }

    /* Project hero */
    .project-hero img,
    .project-hero .img-placeholder { height: 240px; }

    /* Chat box */
    .chat-box { height: 400px; }

    /* Footer */
    .footer-inner { gap: 6px; }
    .footer-copy { font-size: 12px; }
    .footer-cookie { font-size: 12px; }
}

/* ── Very small: ≤ 380px ── */
@media (max-width: 380px) {
    .container { padding: 0 16px; }
    .navbar { padding: 0 16px; }
    .footer-inner { padding: 0 16px; }
}
