/* ============================================================
   QUALIOPI RATE
   ============================================================ */
@media (max-width: 600px) {
    .qualiopi-rate {
        gap: 16px;
        min-height: 74px;
        padding: 12px 16px;
        border-radius: 16px;
    }
    .qualiopi-rate__logo {
        width: 128px;
        max-width: 34vw;
    }
    .qualiopi-rate__label {
        font-size: 13px !important;
        margin-bottom: 5px !important;
    }
    .qualiopi-rate__row {
        gap: 8px;
    }
    .qualiopi-rate__score {
        font-size: 22px;
    }
    .qualiopi-rate__stars {
        gap: 2px;
    }
    .qualiopi-rate__star {
        width: 16px;
        height: 16px;
        font-size: 16px;
        line-height: 16px;
    }
    .qualiopi-certification {
        gap: 26px;
    }
    .qualiopi-certification__card {
        grid-template-columns: 1fr;
        gap: 24px;
        min-height: 0;
        padding: 28px 24px;
    }
    .qualiopi-certification__logo {
        width: 240px;
    }
    .qualiopi-certification__content p {
        font-size: 15px !important;
    }
    .qualiopi-certification__content li {
        font-size: 16px !important;
    }
    .qualiopi-certification__button {
        width: min(100%, 214px);
    }
    .qualiopi-promobox {
        grid-template-columns: 1fr;
        justify-items: center;
        gap: 24px;
        min-height: 0;
        padding: 28px 22px 32px;
        text-align: center;
    }
    .qualiopi-promobox::after {
        top: 18px;
        right: -38px;
    }
    .qualiopi-promobox__media {
        width: min(100%, 257px);
        min-height: 116px;
    }
    .qualiopi-promobox__content {
        padding-bottom: 0;
    }
    .qualiopi-promobox__subtitle {
        font-size: 14px !important;
    }
    .qualiopi-promobox__button {
        width: min(100%, 214px);
    }
}

/* ============================================================
   SESSIONS MAP
   ============================================================ */
@media (max-width: 639px) {
    .sessions-map-carousel__head {
        gap: var(--space-4);
        margin-bottom: var(--space-4);
    }
    .sessions-map-carousel__rule,
    .sessions-map-carousel__nav { display: none; }
    .sessions-map-card {
        flex-basis: min(370px, calc(100vw - 40px));
        min-width: min(370px, calc(100vw - 40px));
    }
    .sessions-map-popup .sessions-map-card__duration { display: none; }
    .sessions-map-osm { height: 560px; }
    .sessions-map-popup-shell .leaflet-popup-content {
        width: min(292px, calc(100vw - 104px)) !important;
    }
    .sessions-map-popup { padding: var(--space-4); }
    .sessions-map-popup__pager {
        gap: var(--space-2);
        grid-template-columns: 32px 1fr 32px;
    }
    .sessions-map-popup__control {
        width: 32px;
        height: 32px;
    }
    .sessions-map-popup__page {
        width: min(32px, 10vw);
    }
}

/* ============================================================
   FAQ
   ============================================================ */
@media (max-width: 600px) {
    .faq-item summary { padding: 0 20px; min-height: 72px; }
    .faq-item__content { padding: 0 20px 24px; }
}

/* ============================================================
   FORMA STAT
   ============================================================ */
@media (max-width: 520px) {
    .forma-stat { min-height: 112px; padding: 20px 16px; }
    .forma-stat__number { font-size: 34px !important; }
    .forma-stat__description { font-size: 15px !important; max-width: none; }
}

/* ============================================================
   STAT CARD
   ============================================================ */
@media (max-width: 520px) {
    .stat-card-grid { grid-template-columns: 1fr; }
    .stat-card { min-width: 0; padding: 20px 20px 24px; gap: 16px; }
    .stat-card__icon { width: 58px; height: 58px; }
    .stat-card__icon .icon { width: 32px; height: 32px; font-size: 32px; }
    .stat-card__num { font-size: 2rem !important; }
    .stat-card__label { font-size: 0.9375rem !important; }
}

/* ============================================================
   CONTACT CARD
   ============================================================ */
@media (max-width: 520px) {
    .contact-card-list { gap: 32px; }
    .contact-card { gap: 16px; }
    .contact-card__logo { width: 58px; height: 58px; flex-basis: 58px; }
    .contact-card__logo .icon { font-size: 30px; }
    h4.contact-card__title { font-size: 18px !important; }
}

/* ============================================================
   CARD CONTACT
   ============================================================ */
@media (max-width: 620px) {
    .card-contact {
        grid-template-columns: 1fr;
        justify-items: center;
        text-align: center;
        gap: 18px;
        min-height: 0;
        padding: 24px 20px;
    }
    .card-contact__media {
        width: 96px;
        height: 96px;
    }
    .card-contact__body {
        align-items: center;
        width: 100%;
    }
    .card-contact__links {
        align-items: center;
        margin-bottom: 22px;
    }
    .card-contact__cta {
        width: min(100%, 260px);
        min-width: 0;
    }
}

/* ============================================================
   CARTE FORMATION
   ============================================================ */
@media (max-width: 620px) {
    .card-formation {
        width: 100%;
        min-height: 0;
        padding: 20px 20px 26px;
        border-radius: 16px;
    }
    .card-formation__media {
        aspect-ratio: 2.1 / 1;
        border-radius: 10px;
    }
    .card-formation__body {
        padding-top: 22px;
    }
    h3.card-formation__title {
        font-size: 24px !important;
    }
    .card-formation__description {
        max-width: none;
        font-size: 15px !important;
        margin-bottom: 24px !important;
    }
    .card-formation__cta {
        width: 100%;
        min-width: 0;
    }
}

/* ============================================================
   PROCESS
   ============================================================ */
@media (max-width: 639px) {
    .process {
        flex-direction: column;
        gap: 0;
    }
    .process-step {
        flex-direction: row;
        align-items: stretch;
        text-align: left;
        gap: 16px;
        padding-top: 0 !important;
    }
    .process-step__icon-group {
        flex-shrink: 0;
        align-self: stretch;
    }
    .process-step__connector {
        flex: 1;
        height: auto;
        min-height: 24px;
        padding: 4px 0;
    }
    .process-step__body {
        padding-top: 12px;
        padding-bottom: 20px;
    }
    .process-step__title { margin-top: 0; }
}

/* ============================================================
   CTA BOUTONS
   ============================================================ */
@media (max-width: 520px) {
    .cta-buttons {
        flex-direction: column;
        align-items: stretch;
        gap: 14px;
    }
    .cta-buttons__button,
    .cta-buttons__button:first-child {
        width: 100%;
        min-width: 0;
    }
}

/* ============================================================
   CHAT BUTTON
   ============================================================ */
@media (max-width: 520px) {
    .chat-button {
        width: 100%;
        min-width: 0;
    }
}

/* ============================================================
   CTA FOOTER
   ============================================================ */
@media (max-width: 620px) {
    .cta-footer {
        padding: 38px 18px;
    }
    h2.cta-footer__title {
        font-size: 27px !important;
        line-height: 1.22 !important;
        margin-bottom: 18px !important;
    }
    .cta-footer__content {
        max-width: 440px;
        font-size: 15px !important;
        margin-bottom: 32px !important;
    }
    .cta-footer__button {
        width: min(100%, 240px);
        min-width: 0;
    }
}

/* ============================================================
   HIGHLIGHT ITEM
   ============================================================ */
@media (max-width: 520px) {
    .highlight-item {
        align-items: flex-start;
        gap: 16px;
        min-height: 0;
    }
    .highlight-item__media {
        width: 70px;
        height: 70px;
        flex-basis: 70px;
    }
    .highlight-item__media .icon {
        font-size: 36px;
    }
    .highlight-item__image {
        max-width: 44px;
        max-height: 44px;
    }
    h3.highlight-item__title {
        font-size: 18px !important;
    }
    .highlight-item__content {
        max-width: none;
        font-size: 15px !important;
    }
}

/* ============================================================
   PAGE DÉTAIL FORMATION
   ============================================================ */
@media (max-width: 900px) {
    .formation-detail-layout {
        grid-template-columns: 1fr;
    }
    .sw-formation-single .breadcrumb { display: none; }
    .formation-detail-wrapper { margin-top: 30px; }
    .specs-row { gap: 0; margin-bottom: 15px !important; }
    .spec-item {
        flex: 0 0 100%;
        width: 100%;
        margin-bottom: 30px;
    }
    .sessions-card {
        position: static;
        order: 2;
        margin-bottom: 60px;
    }
    .tabs { display: none; }
}

@media (max-width: 639px) {
    .formation-detail-wrapper { padding: 0 16px 48px; }
    .formation-hero__body { grid-template-columns: 1fr; }
    .formation-hero__thumb { width: 100%; height: auto; min-height: 150px; }
    .formation-hero__thumb img { position: static; height: auto; }
}

/* ============================================================
   CARROUSEL FORMATION
   ============================================================ */
@media (max-width: 639px) {
    .formation-carousel__nav { display: none; }
    .formation-carousel__track .formation-card { flex: 0 0 100%; max-width: 100%; }
}

/* ============================================================
   GRILLE FORMATIONS PAR CATÉGORIE
   ============================================================ */
@media (max-width: 780px) {
    .formation-card-grid {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 768px) {
    .formation-card--horizontal {
        flex-direction: column;
    }
    .formation-card--horizontal .formation-card__media {
        position: relative;
        left: auto;
        top: auto;
        bottom: auto;
        width: 100%;
        height: 180px;
    }
    .formation-card--horizontal .formation-card__body {
        margin-left: 0;
    }
    .formation-card--horizontal .formation-card__cta {
        align-self: stretch;
    }
}

/* ============================================================
   FORMULAIRE DE CONTACT
   ============================================================ */
@media (max-width: 639px) {
    .forma-contact__row { grid-template-columns: 1fr; }
}

/* ============================================================
   MODAL INSCRIPTION (WIZARD)
   ============================================================ */
@media (max-width: 639px) {
    .inscription-wizard__row { grid-template-columns: 1fr; }
}

@media (max-width: 520px) {
    .inscription-modal { padding: 0; align-items: flex-end; }
    .inscription-modal__card {
        max-width: 100%;
        border-radius: var(--radius-lg) var(--radius-lg) 0 0;
        max-height: min(750px, 92vh);
    }
    .inscription-wizard__slide { max-height: min(550px, 92vh - 200px); }
}

/* ============================================================
   FOOTER WIDGETS
   ============================================================ */
@media (max-width: 760px) {
    .forma-copyright-menu {
        flex-direction: column;
        align-items: flex-start;
        gap: 22px;
    }
    .forma-copyright-menu__list {
        justify-content: flex-start;
        gap: 14px 26px;
    }
}

/* ============================================================
   TARTE AU CITRON (COOKIES)
   ============================================================ */
@media (max-width: 767px) {
    div#tarteaucitronRoot div#tarteaucitronAlertBig {
        min-width: 86% !important;
        right: 0.9em !important;
    }
}
