/* ========== Hero Carousel - Stable, aucun layout shift ========== */
    .hero-section-responsive {
        isolation: isolate;
        margin: 0;
        padding: 0;
        width: 100%;
    }
    .hero-section-responsive .carousel,
    .hero-section-responsive .carousel-inner {
        overflow: hidden;
    }
    /* Mobile : 768×500px — ratio 1.536 */
    .hero-section-responsive .carousel-item {
        position: relative;
        width: 100%;
        aspect-ratio: 768 / 500;
        overflow: hidden;
        will-change: opacity;
        backface-visibility: hidden;
        transform: translateZ(0);
    }
    /* Tablette : 1024×600px — ratio 1.707 */
    @media (min-width: 768px) {
        .hero-section-responsive .carousel-item { aspect-ratio: 1024 / 600; }
    }
    /* Desktop : 1920×800px — ratio 2.4, plafonné à 800px */
    @media (min-width: 1024px) {
        .hero-section-responsive .carousel-item {
            aspect-ratio: 1920 / 800;
            max-height: 800px;
        }
    }
    /* ========== Positionnement média, overlay, contenu ========== */
    .hero-section-responsive .hero-slide-media {
        position: absolute;
        inset: 0;
        overflow: hidden;
    }
    .hero-section-responsive .hero-slide-picture {
        display: block;
        width: 100%;
        height: 100%;
    }
    .hero-section-responsive .hero-slide-img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center center;
        transform: translateZ(0);
        backface-visibility: hidden;
        -webkit-backface-visibility: hidden;
    }
    /* Overlay supprimé — image affichée sans assombrissement */
    .hero-section-responsive .hero-slide-overlay { display: none; }
    .hero-section-responsive .hero-content-container {
        position: absolute;
        inset: 0;
        z-index: 2;
        display: flex;
        align-items: center;
    }

    /* ========== Typographie fluide (text-shadow pour lisibilité sans overlay) ========== */
    .hero-section-responsive .hero-title {
        font-size: clamp(1.15rem, 2.8vw + 0.8rem, 3rem);
        line-height: 1.25;
        text-shadow: 0 2px 10px rgba(0,0,0,0.65), 0 1px 3px rgba(0,0,0,0.4);
    }
    .hero-section-responsive .hero-description {
        font-size: clamp(0.8rem, 1.2vw + 0.6rem, 1.35rem);
        line-height: 1.6;
        text-shadow: 0 1px 6px rgba(0,0,0,0.55);
    }
    .hero-section-responsive .hero-cta {
        padding: clamp(0.45rem, 1vw + 0.3rem, 0.9rem) clamp(1rem, 2.5vw, 2.5rem);
        font-size: clamp(0.8rem, 0.9vw + 0.6rem, 1.1rem);
    }
    .hero-section-responsive .hero-content-inner {
        padding-left: max(clamp(0.5rem, 3vw, 1rem), env(safe-area-inset-left, 0px));
        padding-right: max(clamp(0.5rem, 3vw, 1rem), env(safe-area-inset-right, 0px));
    }

    /* ========== iPhone & Android — safe areas ========== */
    .hero-mobile-safe {
        padding-left: env(safe-area-inset-left, 0);
        padding-right: env(safe-area-inset-right, 0);
    }
    @media (max-width: 767.98px) {
        .hero-mobile-safe .carousel-control-prev,
        .hero-mobile-safe .carousel-control-next {
            width: 44px; height: 44px; min-width: 44px; min-height: 44px;
        }
        .hero-mobile-safe .carousel-control-prev { left: max(8px, env(safe-area-inset-left)); }
        .hero-mobile-safe .carousel-control-next { right: max(8px, env(safe-area-inset-right)); }
        .hero-mobile-safe .carousel-indicators { padding-bottom: max(10px, env(safe-area-inset-bottom)); }
    }
    .hero-section-responsive .hero-slide-default {
        position: absolute;
        inset: 0;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    }

    /* ========== Keyframes ========== */
    @keyframes fadeInUp {
        from { opacity: 0; transform: translateY(22px); }
        to   { opacity: 1; transform: translateY(0); }
    }
    @keyframes scaleIn {
        from { opacity: 0; transform: scale(0.93); }
        to   { opacity: 1; transform: scale(1); }
    }
    @keyframes pulse {
        0%, 100% { box-shadow: 0 0 0 0 rgba(102, 126, 234, 0.55); }
        50%       { box-shadow: 0 0 0 8px rgba(102, 126, 234, 0); }
    }
    @keyframes progressPulse {
        0%, 100% { opacity: 1; }
        50%       { opacity: 0.55; }
    }
    @keyframes ripple-expand {
        to { transform: scale(4); opacity: 0; }
    }

    /* ========== Cartes de niveaux — hover propre, SANS étirement ========== */
    .level-card-animated {
        opacity: 0;
        /* Uniquement les propriétés ciblées — JAMAIS 'all' pour éviter l'étirement au clic */
        transition: transform 0.25s ease, box-shadow 0.25s ease;
    }
    .level-card-animated.animate-in {
        animation: scaleIn 0.45s ease-out both;
    }
    /* Hover : lift + ombre uniquement — aucun scale qui cause l'allongement */
    .level-card-animated:hover {
        transform: translateY(-7px);
        box-shadow: 0 14px 32px rgba(0, 0, 0, 0.14) !important;
    }
    /* Zoom image contenu dans son wrapper (clippé par overflow:hidden du wrapper) */
    .level-card-img .level-card-img-el {
        transition: transform 0.35s ease !important;
    }
    .level-card-animated:hover .level-card-img .level-card-img-el {
        transform: translate(-50%, -50%) scale(1.07) !important;
    }
    .level-card-animated .btn-gradient-primary {
        transition: opacity 0.2s ease;
    }
    .level-card-animated:hover .btn-gradient-primary {
        opacity: 0.88;
    }
    .level-card-animated:hover .progress-bar {
        animation: progressPulse 1.2s ease-in-out infinite;
    }
    @media (max-width: 768px) {
        .level-card-animated:hover { transform: translateY(-3px); }
    }

    /* ========== Cartes statistiques — hover propre ========== */
    .stat-card-animated {
        opacity: 0;
        transition: transform 0.25s ease, box-shadow 0.25s ease;
    }
    .stat-card-animated.animate-in {
        animation: fadeInUp 0.45s ease-out both;
    }
    .stat-card-animated:hover {
        transform: translateY(-5px);
        box-shadow: 0 10px 26px rgba(0, 0, 0, 0.12) !important;
    }
    .stat-icon i {
        display: inline-block;
        transition: transform 0.25s ease;
    }
    .stat-card-animated:hover .stat-icon i { transform: scale(1.15) rotate(6deg); }
    .stat-number { transition: transform 0.25s ease; }
    .stat-card-animated:hover .stat-number { transform: scale(1.06); }
    @media (max-width: 768px) {
        .stat-card-animated:hover { transform: translateY(-2px); }
    }

    /* ========== Cartes disciplines ========== */
    .subject-card {
        transition: transform 0.25s ease, box-shadow 0.25s ease;
        cursor: pointer;
    }
    .subject-card:hover {
        transform: translateY(-6px);
        box-shadow: 0 10px 24px rgba(0, 0, 0, 0.13) !important;
    }
    .subject-card .subject-icon { transition: transform 0.25s ease; }
    .subject-card:hover .subject-icon { transform: scale(1.18) rotate(4deg); }

    /* ========== Hover lift générique ========== */
    .hover-lift { transition: transform 0.25s ease, box-shadow 0.25s ease; }
    .hover-lift:hover {
        transform: translateY(-4px);
        box-shadow: 0 8px 20px rgba(0,0,0,0.10) !important;
    }

    /* ========== Badge pulse ========== */
    .pulse-effect { animation: pulse 2.5s infinite; }

    /* ========== Séparateur & gradient texte ========== */
    .divider-gradient {
        height: 3px;
        background: linear-gradient(90deg, var(--primary-color), var(--secondary-color));
        border: none;
    }
    .text-gradient-primary {
        background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }

    /* ========== Catégories enseignant ========== */
    .category-card-animated {
        opacity: 0;
        transition: transform 0.25s ease, box-shadow 0.25s ease;
        cursor: pointer;
    }
    .category-card-animated.animate-in {
        animation: scaleIn 0.45s ease-out both;
    }
    .category-card-animated:hover {
        transform: translateY(-5px);
        box-shadow: 0 10px 24px rgba(0, 0, 0, 0.11) !important;
    }
    .category-icon-wrapper { transition: transform 0.25s ease; }
    .category-card-animated:hover .category-icon-wrapper { transform: scale(1.1); }
    @media (max-width: 767.98px) {
        .category-card-animated:hover { transform: translateY(-2px); }
    }
    .transition-fade-in { animation: fadeInUp 0.35s ease-out; }

    /* ========== Ripple ========== */
    .ripple {
        position: absolute;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.45);
        transform: scale(0);
        animation: ripple-expand 0.55s ease-out forwards;
        pointer-events: none;
    }

    /* ========== Barre de progression scroll ========== */
    #scroll-progress-bar {
        position: fixed;
        top: 0; left: 0;
        width: 0%;
        height: 3px;
        background: linear-gradient(90deg, var(--primary-color), var(--secondary-color));
        z-index: 9999;
        pointer-events: none;
        transition: width 0.1s linear;
        will-change: width;
    }