/* ============================================
   RESPONSIVE - TEKNOPAM
============================================ */

@media (max-width: 1100px) {
    .navbar-nav {
        gap: 18px;
    }

    .navbar-nav a {
        font-size: 14px;
    }

    .hero-text h1 {
        font-size: 42px;
    }

    .services-grid,
    .realisations-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .footer-content {
        grid-template-columns: 1fr 1fr;
    }
}

/* Tablettes : menu replié */
@media (max-width: 960px) {
    :root {
        --header-h: 64px;
    }

    .navbar {
        flex-wrap: wrap;
    }

    .navbar-brand .logo {
        height: 46px;
    }

    .navbar-toggler {
        display: flex;
    }

    .navbar-collapse {
        display: none;
        width: 100%;
        padding: 8px 0 16px;
    }

    .navbar-collapse.open {
        display: block;
    }

    .navbar-nav {
        flex-direction: column;
        align-items: stretch;
        gap: 2px;
    }

    .navbar-nav a {
        display: block;
        padding: 12px 8px;
        font-size: 16px;
        border-bottom: none;
        border-radius: var(--radius-sm);
    }

    .navbar-nav a:hover,
    .navbar-nav .active a {
        background: var(--surface);
    }

    .navbar-nav .btn-contact {
        margin-top: 8px;
        text-align: center;
        padding: 12px 20px;
    }

    .hero-grid,
    .feature-grid {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .hero-text {
        text-align: center;
    }

    .hero-text .subtitle {
        margin-left: auto;
        margin-right: auto;
    }

    .hero-buttons {
        justify-content: center;
    }

    .axes-stage {
        max-height: 400px;
    }

    .stats-grid {
        grid-template-columns: repeat(2, 1fr);
        row-gap: 28px;
    }

    .actualites-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .steps {
        grid-template-columns: repeat(2, 1fr);
    }

    .step:nth-child(3) {
        padding-left: 0;
        border-left: none;
    }

    .step:nth-child(n + 3) {
        padding-top: 32px;
    }

    .pillars,
    .principles-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .featured-project,
    .news-lead {
        grid-template-columns: 1fr;
    }

    .featured-image,
    .news-lead .actualite-image {
        aspect-ratio: 16 / 9;
        min-height: 0;
    }

    .featured-content,
    .news-lead .actualite-content {
        padding: 28px;
    }

    .founder,
    .contact-grid {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .bench-body {
        grid-template-columns: 1fr;
    }

    .bench-steps {
        border-right: none;
        border-bottom: 1px solid var(--border);
    }
}

/* Mobiles */
@media (max-width: 680px) {
    .container {
        padding: 0 16px;
    }

    .page-section {
        padding: 40px 0 64px;
    }

    .page-header h1,
    .hero-text h1 {
        font-size: 32px;
    }

    .page-header--left {
        margin-bottom: 48px;
    }

    .lead,
    .hero-text .subtitle {
        font-size: 17px;
    }

    .hero {
        padding: 36px 0 44px;
    }

    .hero-buttons {
        flex-direction: column;
        align-items: stretch;
    }

    .axes-tabs {
        flex-wrap: nowrap;
        overflow-x: auto;
        scrollbar-width: none;
    }

    .axis-tab {
        flex: 0 0 auto;
        padding: 10px 8px 12px;
        font-size: 13.5px;
    }

    .axis-index {
        display: none;
    }

    .stat-number {
        font-size: 30px;
    }

    .feature-section,
    .actualites-section {
        padding: 56px 0;
    }

    .feature-text h2,
    .section-header h2,
    .about-block > h2,
    .block-heading h2 {
        font-size: 26px;
    }

    .about-block {
        margin-bottom: 56px;
    }

    .actualites-grid,
    .services-grid,
    .realisations-grid,
    .sectors-grid,
    .pillars,
    .principles-grid,
    .spec-grid,
    .form-row {
        grid-template-columns: 1fr;
    }

    .steps {
        grid-template-columns: 1fr;
    }

    .step,
    .step + .step {
        padding: 20px 0;
        border-left: none;
        border-bottom: 1px solid var(--border);
    }

    .founder,
    .split-card {
        padding: 24px;
    }

    .split-card {
        flex-direction: column;
        align-items: stretch;
    }

    .bench-readouts {
        grid-template-columns: 1fr 1fr 1fr;
        gap: 8px;
    }

    .readout {
        padding: 10px;
    }

    .bench {
        --bench-value: 24px;
    }

    .bench.is-workshop {
        --bench-value: 32px;
    }

    .bench-trace th,
    .bench-trace td {
        padding: 6px 12px;
    }

    .modal-container {
        padding: 16px;
        max-height: 94vh;
    }

    .modal-article h2,
    .modal-project h2 {
        font-size: 24px;
    }

    .contact-form .btn {
        align-self: stretch;
    }

    .footer-content {
        grid-template-columns: 1fr;
        gap: 28px;
    }

    .footer-bottom {
        flex-direction: column;
    }
}

@media (max-width: 400px) {
    .readout-label {
        font-size: 11px;
    }

    .readout-range {
        display: none;
    }
}
