/* ═══════════════════════════════════════════════════════════
   Le Pignondor — responsive.css
   Breakpoints: 768 / 1024 / 1280.
   ═══════════════════════════════════════════════════════════ */

/* ── Mobile-only (< 768px) ──────────────────────────────── */
.header__nav { display: none; }
.header__utility { display: none; }
.header__hamburger { display: flex; }
.header__right .btn-primary { display: none; }
.header__mobile-nav { display: flex; }

/* Sidebar mobile → horizontal scroll (rule 36) */
.carte-sidebar {
    flex-direction: row;
    overflow-x: auto;
    white-space: nowrap;
    gap: 0;
    margin-bottom: var(--s-24);
    padding-bottom: var(--s-8);
}
.carte-sidebar__link {
    border-left: none;
    border-bottom: 2px solid transparent;
    padding: var(--s-8) var(--s-16);
    flex-shrink: 0;
}
.carte-sidebar__link.is-active {
    border-left-color: transparent;
    border-bottom-color: var(--c-accent);
}

/* ── Tablet (768px+) ────────────────────────────────────── */
@media (min-width: 768px) {
    /* Grids */
    .grid--2 { grid-template-columns: repeat(2, 1fr); }
    .grid--3 { grid-template-columns: repeat(2, 1fr); }
    .grid--4 { grid-template-columns: repeat(2, 1fr); }

    /* Hero stacks with photo on top */
    .hero { min-height: 400px; }

    /* Footer wraps 2+2 */
    .footer__grid { grid-template-columns: repeat(2, 1fr); }

    /* Form row */
    .pg-form__row { grid-template-columns: repeat(2, 1fr); }

    /* Predictor steps */
    .predictor-steps { grid-template-columns: repeat(2, 1fr); }

    /* Partner card grid */
    .partner-grid { grid-template-columns: repeat(2, 1fr); }

    /* Compliance row center */
    .footer__compliance { justify-content: flex-start; }
}

/* ── Desktop (1024px+) ──────────────────────────────────── */
@media (min-width: 1024px) {
    /* Header nav */
    .header__nav { display: flex; }
    .header__utility { display: flex; }
    .header__hamburger { display: none; }
    .header__right .btn-primary { display: inline-flex; }
    .header__mobile-nav { display: none !important; }

    /* Grids */
    .grid--3 { grid-template-columns: repeat(3, 1fr); }
    .grid--4 { grid-template-columns: repeat(4, 1fr); }

    /* Two-col helpers — desktop grid (fr units avoid % + gap overflow) */
    .two-col--55-45 { grid-template-columns: 55fr 45fr; }
    .two-col--45-55 { grid-template-columns: 45fr 55fr; }
    .two-col--60-40 { grid-template-columns: 60fr 40fr; }
    .two-col--40-60 { grid-template-columns: 40fr 60fr; }

    /* Hero — stage-profile 55/45 (fr units avoid % + gap overflow) */
    .hero { grid-template-columns: 55fr 45fr; }
    .hero--small { grid-template-columns: 40fr 60fr; }
    .hero__content { padding: var(--s-64) var(--s-48); }

    /* Footer 4 columns */
    .footer__grid { grid-template-columns: 1.4fr 1fr 1fr 1fr; }

    /* Carte layout (1fr + fixed sidebar avoids % overflow) */
    .carte-layout { grid-template-columns: 1fr 260px; }
    .carte-sidebar {
        flex-direction: column;
        overflow-x: visible;
        white-space: normal;
        position: sticky;
        top: calc(var(--header-h) + var(--s-24));
        align-self: start;
        order: 2;
    }
    .carte-sidebar__link {
        border-bottom: none;
        border-left: 2px solid transparent;
    }
    .carte-sidebar__link.is-active {
        border-bottom-color: transparent;
        border-left-color: var(--c-accent);
    }
    .carte-content { order: 1; }

    /* Predictor steps 4-col */
    .predictor-steps { grid-template-columns: repeat(4, 1fr); }

    /* Partner card grid */
    .partner-grid { grid-template-columns: repeat(4, 1fr); }

    /* Contact two-col */
    .contact-layout { grid-template-columns: 60fr 40fr; }
}

/* ── Wide (1280px+) ─────────────────────────────────────── */
@media (min-width: 1280px) {
    .container {
        padding-left: var(--s-32);
        padding-right: var(--s-32);
    }
}