/* JPG VIDEO - styles (externalises depuis index.html) */

/* ============================================
           VARIABLES CSS - MODE SOMBRE (défaut)
           ============================================ */
        :root {
            /* Couleurs de fond - nuances subtiles mais perceptibles */
            --bg-primary: #121216;
            --bg-secondary: #1a1a21;
            --bg-tertiary: #232329;
            --bg-alt: #17171c;
            --bg-card: #1c1c23;
            --bg-card-hover: #26262e;
            
            /* Couleurs de texte */
            --text-primary: #f4f4f6;
            --text-secondary: #b5b5bd;
            --text-muted: #85858f;
            
            /* Couleurs d'accent */
            --accent: #e63946;
            --accent-dark: #c1121f;
            --accent-light: #ff6b6b;
            --rouge: #c81e32;
            
            /* Couleurs fixes */
            --noir: #0a0a0a;
            --noir-light: #1a1a21;
            
            /* Bordures et séparateurs */
            --border-color: rgba(255, 255, 255, 0.06);
            --border-color-strong: rgba(255, 255, 255, 0.12);
            
            /* Ombres */
            --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.2);
            --shadow-md: 0 8px 30px rgba(0, 0, 0, 0.3);
            --shadow-lg: 0 20px 60px rgba(0, 0, 0, 0.4);
            
            /* Overlays */
            --overlay-light: rgba(0, 0, 0, 0.3);
            --overlay-medium: rgba(0, 0, 0, 0.5);
            --overlay-strong: rgba(0, 0, 0, 0.7);
            
            /* Navigation */
            --nav-bg: rgba(18, 18, 22, 0.97);
            
            /* Tags et badges */
            --tag-bg: rgba(255, 255, 255, 0.06);
            --tag-text: #f4f4f6;
            
            /* Transitions */
            --transition: all 0.3s ease;
        }

        /* ============================================
           MODE CLAIR (préférence système)
           ============================================ */
        @media (prefers-color-scheme: light) {
            :root:not([data-theme="dark"]) {
                /* Couleurs de fond */
                --bg-primary: #FEFBF6;
                --bg-secondary: #ffffff;
                --bg-tertiary: #f5f5f5;
                --bg-alt: #f8f5f0;
                --bg-card: #ffffff;
                --bg-card-hover: #f8f8f8;
                --noir-light: #f0f0f0;
                
                /* Couleurs de texte */
                --text-primary: #1a1a2e;
                --text-secondary: #4a4a5a;
                --text-muted: #6c757d;
                
                /* Bordures et séparateurs */
                --border-color: rgba(0, 0, 0, 0.08);
                --border-color-strong: rgba(0, 0, 0, 0.15);
                
                /* Ombres */
                --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08);
                --shadow-md: 0 8px 30px rgba(0, 0, 0, 0.12);
                --shadow-lg: 0 20px 60px rgba(0, 0, 0, 0.15);
                
                /* Navigation */
                --nav-bg: rgba(254, 251, 246, 0.95);
                
                /* Tags et badges */
                --tag-bg: rgba(0, 0, 0, 0.05);
                --tag-text: #1a1a2e;
            }
        }

        /* ============================================
           MODE CLAIR FORCÉ (via toggle)
           ============================================ */
        :root[data-theme="light"] {
            --bg-primary: #FEFBF6;
            --bg-secondary: #ffffff;
            --bg-tertiary: #f5f5f5;
            --bg-alt: #f8f5f0;
            --bg-card: #ffffff;
            --bg-card-hover: #f8f8f8;
            --noir-light: #f0f0f0;
            --text-primary: #1a1a2e;
            --text-secondary: #4a4a5a;
            --text-muted: #6c757d;
            --border-color: rgba(0, 0, 0, 0.08);
            --border-color-strong: rgba(0, 0, 0, 0.15);
            --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08);
            --shadow-md: 0 8px 30px rgba(0, 0, 0, 0.12);
            --shadow-lg: 0 20px 60px rgba(0, 0, 0, 0.15);
            --nav-bg: rgba(254, 251, 246, 0.95);
            --tag-bg: rgba(0, 0, 0, 0.05);
            --tag-text: #1a1a2e;
        }

        /* ============================================
           MODE SOMBRE FORCÉ (via toggle)
           ============================================ */
        :root[data-theme="dark"] {
            --bg-primary: #121216;
            --bg-secondary: #1a1a21;
            --bg-tertiary: #232329;
            --bg-alt: #17171c;
            --bg-card: #1c1c23;
            --bg-card-hover: #26262e;
            --noir-light: #1a1a21;
            --text-primary: #f4f4f6;
            --text-secondary: #b5b5bd;
            --text-muted: #85858f;
            --border-color: rgba(255, 255, 255, 0.06);
            --border-color-strong: rgba(255, 255, 255, 0.12);
            --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.2);
            --shadow-md: 0 8px 30px rgba(0, 0, 0, 0.3);
            --shadow-lg: 0 20px 60px rgba(0, 0, 0, 0.4);
            --nav-bg: rgba(18, 18, 22, 0.97);
            --tag-bg: rgba(255, 255, 255, 0.06);
            --tag-text: #f4f4f6;
        }

        /* ============================================
           RESET & BASE - Tailles Apple-style
           ============================================ */
        * { margin: 0; padding: 0; box-sizing: border-box; }
        html { 
            scroll-behavior: smooth; 
            font-size: 18px; /* Base Apple-style */
        }
        
        body {
            font-family: 'Source Sans 3', sans-serif;
            background: var(--bg-primary);
            color: var(--text-primary);
            line-height: 1.7;
            font-size: 1.1rem;
            transition: background-color 0.3s ease, color 0.3s ease;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
        }

        /* ============================================
           NAVIGATION
           ============================================ */
        nav {
            position: fixed;
            top: 0; left: 0; right: 0;
            z-index: 1000;
            background: var(--nav-bg);
            backdrop-filter: blur(10px);
            border-bottom: 1px solid var(--border-color);
        }

        .nav-container {
            max-width: 1400px;
            margin: 0 auto;
            padding: 0 2rem;
            display: flex;
            justify-content: space-between;
            align-items: center;
            height: 70px;
        }

        .logo { display: flex; align-items: center; text-decoration: none; }
        .logo img { height: 40px; width: auto; }
        .logo span { color: var(--accent); }

        /* Badge NEW pour menu */
        .badge-new {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: var(--rouge);
            color: #fff;
            font-size: 0.55rem;
            font-weight: 700;
            padding: 0.15rem 0.4rem;
            border-radius: 7px;
            margin-left: 0.4rem;
            vertical-align: middle;
            text-transform: uppercase;
            letter-spacing: 0.3px;
        }

        .nav-links {
            display: flex;
            gap: 2rem;
            align-items: center;
            list-style: none;
        }

        .nav-links a {
            color: var(--text-primary);
            text-decoration: none;
            font-size: 1.15rem;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 1px;
            transition: var(--transition);
        }

        .nav-links a:hover { color: var(--accent); }

        .dropdown { position: relative; }

        .dropdown > a::after {
            content: ' ▾';
            font-size: 1.25rem;
            opacity: 0.7;
        }

        .dropdown-content {
            display: none;
            position: absolute;
            top: 100%; left: 0;
            background: var(--bg-card);
            min-width: 220px;
            border: 1px solid var(--border-color);
            border-radius: 8px;
            padding: 0.5rem 0;
            box-shadow: var(--shadow-md);
        }

        .dropdown:hover .dropdown-content { display: block; }

        .dropdown-content a {
            display: block;
            padding: 0.8rem 1.5rem;
            font-size: 1.25rem;
        }

        .dropdown-content a:hover { background: rgba(230, 57, 70, 0.1); }

        .btn-manager {
            background: var(--accent);
            color: #ffffff !important;
            padding: 0.7rem 1.5rem;
            border-radius: 4px;
            transition: var(--transition);
        }

        .btn-manager:hover { background: var(--accent-dark); }

        .menu-toggle {
            display: none;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            gap: 5px;
            width: 44px;
            height: 44px;
            background: transparent;
            border: none;
            cursor: pointer;
            padding: 10px;
            z-index: 1001;
        }

        .hamburger-line {
            display: block;
            width: 22px;
            height: 2px;
            background-color: #ffffff;
            border-radius: 2px;
            transition: all 0.3s ease;
        }

        .menu-toggle.active .hamburger-line:nth-child(1) {
            transform: translateY(7px) rotate(45deg);
        }

        .menu-toggle.active .hamburger-line:nth-child(2) {
            opacity: 0;
        }

        .menu-toggle.active .hamburger-line:nth-child(3) {
            transform: translateY(-7px) rotate(-45deg);
        }

        /* Theme toggle fixe en bas à droite */
        .theme-toggle-fixed {
            position: fixed;
            bottom: 1.5rem;
            right: 1.5rem;
            z-index: 1000;
            width: 50px;
            height: 50px;
            border-radius: 50%;
            background: var(--bg-card);
            border: 1px solid var(--border-color);
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.75rem;
            box-shadow: var(--shadow-md);
            transition: var(--transition);
        }

        .theme-toggle-fixed:hover {
            transform: scale(1.1);
            border-color: var(--accent);
        }

        /* ============================================
           PAGE SECTIONS
           ============================================ */
        .page-section { display: none; min-height: 100vh; }
        .page-section.active { display: block; }

        /* ============================================
           HERO
           ============================================ */
        .hero {
            height: 80vh;
            display: flex;
            align-items: center;
            justify-content: center;
            position: relative;
            overflow: hidden;
            background: linear-gradient(135deg, var(--bg-primary) 0%, var(--bg-tertiary) 100%);
        }

        .hero::before {
            content: '';
            position: absolute;
            top: 0; left: 0; right: 0; bottom: 0;
            background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><circle cx="50" cy="50" r="1" fill="rgba(255,255,255,0.03)"/></svg>');
            background-size: 50px 50px;
        }

        .hero .video-bg-desktop {
            position: absolute;
            top: 0; left: 0;
            width: 100%; height: 100%;
            z-index: 0;
            overflow: hidden;
        }

        .hero .video-bg-desktop iframe {
            position: absolute;
            top: 50%; left: 50%;
            width: 177.77777778vh;
            min-width: 100%;
            height: 80vh;
            min-height: 56.25vw;
            transform: translate(-50%, -50%);
        }

        .hero .video-bg-mobile {
            display: none;
            position: absolute;
            top: 0; left: 0;
            width: 100%; height: 100%;
            object-fit: cover;
            z-index: 0;
        }

        .hero-overlay {
            position: absolute;
            top: 0; left: 0;
            width: 100%; height: 100%;
            background: var(--overlay-medium);
            z-index: 1;
        }

        .hero-content {
            position: relative;
            z-index: 2;
            text-align: center;
            max-width: 1000px;
            padding: 2rem;
        }

        .hero h1 {
            font-family: 'Bebas Neue', sans-serif;
            font-size: clamp(3rem, 8vw, 5.5rem);
            letter-spacing: 4px;
            margin-bottom: 1.2rem;
            line-height: 1.05;
            color: #ffffff;
        }

        .hero h1 span { 
            color: #fff;
            text-decoration: underline;
            text-decoration-color: var(--rouge);
            text-decoration-thickness: 6px;
            text-underline-offset: 10px;
        }
        
        .hero h1 {
            font-size: clamp(4rem, 12vw, 8rem) !important;
            letter-spacing: 8px !important;
            line-height: 0.9 !important;
            margin-bottom: 1rem !important;
        }
        
        .hero-subtitle-small {
            font-family: 'Montserrat', sans-serif;
            font-size: clamp(0.9rem, 2vw, 1.4rem);
            font-weight: 300;
            letter-spacing: 6px;
            text-transform: uppercase;
            color: rgba(255,255,255,0.85);
            margin-top: 0.5rem;
        }

        .hero-subtitle {
            font-size: 1.3rem;
            color: rgba(255, 255, 255, 0.85);
            margin-bottom: 2rem;
            font-weight: 300;
            line-height: 1.5;
        }

        .hero-stats {
            display: inline-block;
            font-family: 'Montserrat', sans-serif;
            font-size: 1.1rem;
            font-weight: 600;
            letter-spacing: 3px;
            color: #fff;
            background: rgba(230, 57, 70, 0.9);
            padding: 0.75rem 1.5rem;
            border-radius: 4px;
            margin-bottom: 1.5rem;
            text-shadow: none;
        }

        /* Lien souligné rouge dans hero */
        .hero-underline {
            color: #fff;
            text-decoration: underline;
            text-decoration-color: var(--rouge);
            text-decoration-thickness: 2px;
            text-underline-offset: 4px;
        }

        /* Hero CTA buttons */
        .hero-cta {
            display: flex;
            gap: 1rem;
            justify-content: center;
            margin-top: 2rem;
            flex-wrap: wrap;
        }

        /* CTA Prochaine Formation — Carte flottante */
        .hero-formation-cta {
            position: absolute;
            bottom: 24px;
            right: 32px;
            z-index: 5;
        }

        .hero-formation-cta a {
            display: flex;
            align-items: stretch;
            background: rgba(12, 12, 12, 0.85);
            backdrop-filter: blur(20px);
            border: 1px solid rgba(255,255,255,0.1);
            border-radius: 16px;
            overflow: hidden;
            text-decoration: none;
            transition: all 0.4s cubic-bezier(0.19, 1, 0.22, 1);
            box-shadow: 0 12px 40px rgba(0,0,0,0.5);
            max-width: 420px;
        }

        .hero-formation-cta a:hover {
            transform: translateY(-4px);
            box-shadow: 0 20px 50px rgba(0,0,0,0.6);
            border-color: rgba(230,57,70,0.3);
        }

        .hero-formation-cta .hf-accent {
            width: 5px;
            background: linear-gradient(180deg, var(--rouge) 0%, #a01525 100%);
            flex-shrink: 0;
        }

        .hero-formation-cta .hf-body {
            padding: 0.9rem 1.2rem;
            display: flex;
            flex-direction: column;
            gap: 0.12rem;
        }

        .hero-formation-cta .hf-tag {
            font-size: 0.55rem;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 2px;
            color: var(--rouge);
            display: flex;
            align-items: center;
            gap: 0.4rem;
        }

        .hero-formation-cta .hf-pulse {
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background: var(--rouge);
            animation: hfPulse 2s ease-in-out infinite;
        }

        @keyframes hfPulse {
            0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgba(230,57,70,0.5); }
            50% { opacity: 0.7; box-shadow: 0 0 0 6px rgba(230,57,70,0); }
        }

        .hero-formation-cta .hf-title {
            font-family: 'Montserrat', sans-serif;
            font-size: 0.95rem;
            font-weight: 800;
            color: #fff;
            line-height: 1.2;
        }

        .hero-formation-cta .hf-meta {
            font-size: 0.72rem;
            color: rgba(255,255,255,0.45);
        }

        .hero-formation-cta .hf-bottom {
            display: flex;
            align-items: center;
            gap: 0.8rem;
            margin-top: 0.3rem;
        }

        .hero-formation-cta .hf-date {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 1.3rem;
            letter-spacing: 1px;
            color: #fff;
        }

        .hero-formation-cta .hf-btn {
            font-size: 0.6rem;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 1px;
            color: #fff;
            background: var(--rouge);
            padding: 0.35rem 0.8rem;
            border-radius: 6px;
            transition: background 0.2s;
        }

        .hero-formation-cta a:hover .hf-btn {
            background: #d32f3f;
        }

        .hero-formation-cta .hf-places {
            display: flex;
            align-items: center;
            gap: 0.35rem;
            font-size: 0.65rem;
            font-weight: 600;
            color: rgba(255,255,255,0.55);
        }

        .hero-formation-cta .hf-places-dot {
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background: #4CAF50;
        }

        .hero-formation-cta .hf-places-dot.low {
            background: #ff9800;
        }

        .btn-cta-primary {
            display: inline-block;
            padding: 1rem 2rem;
            background: var(--rouge);
            color: #fff;
            text-decoration: none;
            font-weight: 600;
            font-size: 1.1rem;
            border-radius: 6px;
            transition: all 0.3s ease;
            box-shadow: 0 4px 15px rgba(230, 57, 70, 0.4);
        }

        .btn-cta-primary:hover {
            background: #c0392b;
            transform: translateY(-2px);
            box-shadow: 0 6px 20px rgba(230, 57, 70, 0.5);
        }

        .btn-cta-secondary {
            display: inline-block;
            padding: 1rem 2rem;
            background: transparent;
            color: #fff;
            text-decoration: none;
            font-weight: 600;
            font-size: 1.1rem;
            border: 2px solid rgba(255,255,255,0.8);
            border-radius: 6px;
            transition: all 0.3s ease;
        }

        .btn-cta-secondary:hover {
            background: rgba(255,255,255,0.1);
            border-color: #fff;
        }

        /* ============================================
           TEAM INTRO
           ============================================ */
        .team-intro {
            background: var(--bg-primary);
            padding: 5rem 2rem;
            text-align: center;
        }

        .team-intro-content { max-width: 1000px; margin: 0 auto; }

        .team-intro h2 {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 2.8rem;
            letter-spacing: 3px;
            margin-bottom: 0.5rem;
            color: var(--text-primary);
        }

        .team-intro .subtitle {
            color: var(--text-muted);
            font-size: 1.4rem;
            margin-bottom: 3rem;
        }

        .team-intro-grid {
            display: flex;
            justify-content: center;
            gap: 3rem;
            flex-wrap: wrap;
        }

        .team-member-intro { text-align: center; }

        .team-member-intro .photo {
            width: 120px;
            height: 120px;
            border-radius: 50%;
            overflow: hidden;
            margin: 0 auto 1rem;
            border: 3px solid var(--border-color);
            transition: var(--transition);
        }

        .team-member-intro:hover .photo {
            border-color: var(--accent);
            transform: scale(1.05);
        }

        .team-member-intro .photo img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            filter: grayscale(100%);
            transition: var(--transition);
        }

        .team-member-intro:hover .photo img { filter: grayscale(0%); }

        .team-member-intro h4 {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 1.4rem;
            letter-spacing: 1px;
            margin-bottom: 0.2rem;
            color: var(--text-primary);
        }

        .team-member-intro .role {
            font-size: 1.15rem;
            color: var(--accent);
            margin-bottom: 0.5rem;
        }

        .team-member-intro .bio {
            font-size: 1.25rem;
            color: var(--text-muted);
            line-height: 1.5;
            max-width: 200px;
            margin: 0 auto 0.5rem;
        }

        .team-baseline {
            margin-top: 2.5rem;
            color: var(--text-muted);
            font-size: 1.25rem;
            padding-top: 1.5rem;
            border-top: 1px solid var(--border-color);
        }

        /* ============================================
           STATS BAR
           ============================================ */
        .stats-bar {
            background: var(--bg-secondary);
            padding: 3rem 2rem;
            border-top: 1px solid var(--border-color);
            border-bottom: 1px solid var(--border-color);
        }

        .stats-container {
            max-width: 1200px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 2rem;
            text-align: center;
        }

        .stat-item h3 {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 3.5rem;
            color: var(--accent);
            margin-bottom: 0.5rem;
        }

        .stat-item p {
            color: var(--text-muted);
            font-size: 1.05rem;
            text-transform: uppercase;
            letter-spacing: 1px;
        }

        /* ============================================
           SECTIONS
           ============================================ */
        section { 
            padding: 6rem 2rem;
            background: var(--bg-primary);
        }

        /* Sections avec fond alternatif pour rythmer la page */
        section.section-alt {
            background: var(--bg-secondary);
        }

        section.section-dark {
            background: var(--bg-tertiary);
        }

        .section-header {
            text-align: center;
            margin-bottom: 4rem;
        }

        .section-header h2 {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 3.8rem;
            letter-spacing: 4px;
            margin-bottom: 1.5rem;
            color: var(--text-primary);
        }

        .section-header p {
            color: var(--text-muted);
            max-width: 750px;
            margin: 0 auto;
            font-size: 1.25rem;
            line-height: 1.7;
        }

        .container { max-width: 1200px; margin: 0 auto; padding: 0 2rem; }

        /* ============================================
           SECTEURS D'EXPERTISE - Mosaïque 3 colonnes
           ============================================ */
        #secteurs {
            padding: 5rem 0;
            background: var(--bg-primary);
        }

        #secteurs .container {
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 2rem;
        }

        .secteurs-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            grid-auto-rows: 180px;
            gap: 1rem;
            grid-auto-flow: dense;
        }

        .secteur-item {
            position: relative;
            border-radius: 12px;
            overflow: hidden;
            cursor: pointer;
        }

        /* Mosaïque : tailles variées */
        .secteur-item.large {
            grid-column: span 2;
            grid-row: span 2;
        }

        .secteur-item.tall {
            grid-row: span 2;
        }

        .secteur-item.wide {
            grid-column: span 2;
        }

        .secteur-item img {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform 0.5s ease;
        }

        .secteur-item:hover img {
            transform: scale(1.1);
        }

        .secteur-item-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.3) 100%);
            transition: background 0.4s ease;
            z-index: 1;
        }

        .secteur-item:hover .secteur-item-overlay {
            background: linear-gradient(to top, rgba(200,30,50,0.9) 0%, rgba(0,0,0,0.4) 100%);
        }

        .secteur-item-content {
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            padding: 1.5rem;
            z-index: 2;
        }

        .secteur-item-icon {
            font-size: 2.2rem;
            display: block;
            margin-bottom: 0.5rem;
        }

        .secteur-item-content h3 {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 1.7rem;
            letter-spacing: 2px;
            color: #fff;
            margin: 0;
        }

        .secteur-item.large .secteur-item-content h3,
        .secteur-item.tall .secteur-item-content h3 {
            font-size: 2.3rem;
        }

        .secteur-item-content p {
            font-size: 1.15rem;
            color: rgba(255,255,255,0.8);
            margin: 0.5rem 0 0 0;
            opacity: 0;
            max-height: 0;
            overflow: hidden;
            transition: all 0.4s ease;
        }

        .secteur-item:hover .secteur-item-content p {
            opacity: 1;
            max-height: 50px;
        }

        .secteur-item-arrow {
            position: absolute;
            top: 1rem;
            right: 1rem;
            width: 40px;
            height: 40px;
            background: rgba(255,255,255,0.15);
            border: 2px solid rgba(255,255,255,0.3);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            color: #fff;
            font-size: 1.4rem;
            z-index: 2;
            transition: all 0.4s ease;
        }

        .secteur-item:hover .secteur-item-arrow {
            background: #c81e32;
            border-color: #c81e32;
            transform: rotate(45deg);
        }

        /* ============================================
           VIDÉOS VEDETTE
           ============================================ */
        .videos-vedette {
            background: var(--bg-secondary);
            padding: 5rem 0;
        }

        .videos-vedette-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 2rem;
        }

        .video-vedette-card {
            background: var(--bg-card);
            border-radius: 8px;
            overflow: hidden;
            transition: var(--transition);
            border: 1px solid var(--border-color);
        }

        .video-vedette-card:hover {
            transform: translateY(-5px);
            box-shadow: var(--shadow-lg);
        }

        .video-vedette-thumb {
            position: relative;
            aspect-ratio: 16/9;
            overflow: hidden;
            cursor: pointer;
        }

        .video-vedette-thumb img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform 0.5s ease;
        }

        .video-vedette-card:hover .video-vedette-thumb img { transform: scale(1.05); }

        .video-vedette-play {
            position: absolute;
            top: 50%; left: 50%;
            transform: translate(-50%, -50%);
            width: 60px; height: 60px;
            background: var(--accent);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: var(--transition);
        }

        .video-vedette-play::after {
            content: '';
            width: 0; height: 0;
            border-left: 18px solid #ffffff;
            border-top: 12px solid transparent;
            border-bottom: 12px solid transparent;
            margin-left: 4px;
        }

        .video-vedette-thumb:hover .video-vedette-play {
            transform: translate(-50%, -50%) scale(1.1);
        }

        .video-vedette-info { padding: 1.5rem; }

        .video-vedette-tag {
            display: inline-block;
            background: rgba(230, 57, 70, 0.15);
            color: var(--accent);
            padding: 0.35rem 0.9rem;
            border-radius: 4px;
            font-size: 0.9rem;
            font-weight: 600;
            text-transform: uppercase;
            margin-bottom: 0.5rem;
        }

        .video-vedette-info h4 {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 1.75rem;
            letter-spacing: 1px;
            margin-bottom: 0.4rem;
            color: var(--text-primary);
        }

        .video-vedette-info p { color: var(--text-muted); font-size: 1.1rem; }

        /* ============================================
           APPROACH
           ============================================ */
        .approach {
            background: var(--bg-primary);
            padding: 5rem 2rem;
        }

        .approach-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 4rem;
            align-items: start;
            max-width: 1200px;
            margin: 0 auto;
        }

        /* Formation page - video aligned with title */
        #page-formation .approach-grid {
            align-items: start;
        }

        #page-formation .formation-video-desktop {
            padding-top: 0;
            margin-top: 0;
        }

        #page-formation .formation-video-desktop .video-card {
            margin: 0;
        }

        #page-formation .formation-video-desktop .video-info {
            margin-top: 1rem;
        }

        #page-formation .approach-text h2 {
            margin-top: 0;
        }

        .approach-text h2 {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 2.8rem;
            letter-spacing: 2px;
            margin-bottom: 1.5rem;
            color: var(--text-primary);
        }

        .approach-text p {
            color: var(--text-secondary);
            font-size: 1.15rem;
            margin-bottom: 1.2rem;
            line-height: 1.7;
        }

        .approach-quote {
            font-size: 1.5rem;
            font-style: italic;
            color: var(--accent);
            border-left: 4px solid var(--accent);
            padding-left: 1.5rem;
            margin: 1.5rem 0;
        }

        .approach-steps {
            display: flex;
            flex-direction: column;
            gap: 1.5rem;
        }

        .step {
            display: flex;
            gap: 1.5rem;
            align-items: flex-start;
            background: var(--bg-card);
            padding: 1.5rem;
            border-radius: 8px;
            border: 1px solid var(--border-color);
        }

        .step-number {
            width: 50px; height: 50px;
            background: var(--accent);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-family: 'Bebas Neue', sans-serif;
            font-size: 1.75rem;
            color: #ffffff;
            flex-shrink: 0;
        }

        .step-content h4 {
            font-weight: 600;
            margin-bottom: 0.3rem;
            color: var(--text-primary);
        }

        .step-content p { color: var(--text-muted); font-size: 1.25rem; }

        /* ============================================
           ENGAGEMENTS
           ============================================ */
        .engagements-section {
            background: var(--bg-primary);
            padding: 5rem 2rem;
        }

        .engagements-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 1.5rem;
            max-width: 1200px;
            margin: 0 auto;
        }

        .engagement-card {
            background: var(--bg-card);
            border-radius: 8px;
            padding: 2rem;
            border: 1px solid var(--border-color);
            transition: var(--transition);
        }

        .engagement-card:hover {
            transform: translateY(-5px);
            box-shadow: var(--shadow-md);
            border-color: var(--accent);
        }

        .engagement-icon { font-size: 2.8rem; margin-bottom: 1rem; display: block; }

        .engagement-card h4 {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 1.4rem;
            letter-spacing: 1px;
            margin-bottom: 0.5rem;
            color: var(--text-primary);
        }

        .engagement-card p { color: var(--text-muted); font-size: 1.25rem; }

        /* ============================================
           ZONE INTERVENTION
           ============================================ */
        .zone-intervention {
            background: var(--bg-secondary);
            padding: 5rem 2rem;
        }

        .zone-grid {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 2rem;
            max-width: 1200px;
            margin: 0 auto;
        }

        .zone-item {
            background: var(--bg-card);
            border-radius: 8px;
            padding: 2rem;
            border: 1px solid var(--border-color);
        }

        .zone-item h3 {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 1.75rem;
            letter-spacing: 1px;
            margin-bottom: 1rem;
            color: var(--text-primary);
        }

        .zone-item p {
            color: var(--text-muted);
            font-size: 1.25rem;
            margin-bottom: 1rem;
        }

        .zone-list {
            display: flex;
            flex-wrap: wrap;
            gap: 0.5rem;
        }

        .zone-tag {
            background: var(--tag-bg);
            color: var(--text-primary);
            padding: 0.5rem 1rem;
            border-radius: 50px;
            font-size: 1.15rem;
            font-weight: 500;
        }

        /* Bouton voir plus références (masqué sur desktop) */
        .zone-expand-btn {
            display: none;
        }

        /* Bouton voir plus vidéos (masqué sur desktop) */
        .btn-voir-plus-videos {
            display: none;
        }

        /* ============================================
           SECTION 20 ANS
           ============================================ */
        .section-20ans {
            max-width: 1200px;
            margin: 0 auto;
        }
        
        .stats-20ans {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 2rem;
            margin: 3rem 0;
        }
        
        .stat-20ans {
            text-align: center;
            padding: 2rem 1rem;
            background: var(--bg-card);
            border-radius: 12px;
            border: 1px solid var(--border-color);
        }
        
        .stat-number {
            display: block;
            font-family: 'Bebas Neue', sans-serif;
            font-size: 3.5rem;
            color: var(--rouge);
            line-height: 1;
            margin-bottom: 0.5rem;
        }
        
        .stat-label {
            font-size: 1rem;
            color: var(--text-muted);
            text-transform: uppercase;
            letter-spacing: 1px;
        }
        
        .innovation-message {
            max-width: 900px;
            margin: 0 auto;
            text-align: center;
        }
        
        .innovation-message p {
            font-size: 1.15rem;
            line-height: 1.8;
            color: var(--text-secondary);
            margin-bottom: 1.5rem;
        }
        
        .innovation-message strong {
            color: var(--text-primary);
        }
        
        .innovation-highlight {
            font-size: 1.3rem !important;
            font-weight: 500;
            color: var(--text-primary) !important;
            font-style: italic;
            padding: 1.5rem 2rem;
            background: linear-gradient(135deg, rgba(230, 57, 70, 0.1) 0%, rgba(230, 57, 70, 0.05) 100%);
            border-left: 4px solid var(--rouge);
            border-radius: 0 8px 8px 0;
            text-align: left;
        }

        /* Bandeau éco-mobilité */
        .eco-mobility {
            display: flex;
            align-items: center;
            gap: 1.5rem;
            margin-top: 3rem;
            padding: 1.5rem 2rem;
            background: linear-gradient(135deg, rgba(34, 139, 34, 0.1) 0%, rgba(34, 139, 34, 0.05) 100%);
            border: 1px solid rgba(34, 139, 34, 0.2);
            border-radius: 12px;
        }

        .eco-icon {
            font-size: 2.8rem;
            flex-shrink: 0;
        }

        .eco-content {
            flex: 1;
        }

        .eco-content strong {
            display: block;
            font-family: 'Bebas Neue', sans-serif;
            font-size: 1.25rem;
            letter-spacing: 1px;
            color: #4CAF50;
            margin-bottom: 0.3rem;
        }

        .eco-content p {
            color: var(--text-secondary);
            font-size: 1.25rem;
            margin: 0;
        }

        .eco-badges {
            display: flex;
            gap: 0.8rem;
            flex-shrink: 0;
        }

        .eco-badge {
            background: rgba(34, 139, 34, 0.15);
            color: #4CAF50;
            padding: 0.5rem 1rem;
            border-radius: 50px;
            font-size: 1.15rem;
            font-weight: 500;
            white-space: nowrap;
        }

        /* ============================================
           TIMELINE SCROLL SPY (navigation fixe en bas)
           ============================================ */
        /* ============================================
           TIMELINE INTERACTIVE - Frise chronologique
           ============================================ */
        /* ============================================
           TIMELINE - Frise horizontale "Journey"
           ============================================ */
        /* ============================================
           TIMELINE - Frise Pellicule de Film
           ============================================ */
        .timeline-section {
            position: relative;
            padding: 4rem 0;
            overflow: hidden;
            background: var(--bg-secondary);
        }

        .timeline-container {
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 2rem;
        }

        /* Film Strip Container */
        .film-strip-wrapper {
            position: relative;
            margin-top: 3rem;
        }

        /* Perforations du film en haut et en bas */
        .film-perforations {
            display: flex;
            justify-content: space-around;
            padding: 0.5rem 0;
            background: #1a1a1a;
        }

        .film-perforations .perf {
            width: 20px;
            height: 12px;
            background: var(--bg-primary);
            border-radius: 3px;
        }

        /* Zone de scroll horizontal */
        .film-strip-scroll {
            overflow-x: auto;
            overflow-y: hidden;
            scrollbar-width: thin;
            scrollbar-color: var(--rouge) var(--bg-tertiary);
            padding: 2rem 0;
            background: linear-gradient(180deg, #1a1a1a 0%, #252525 50%, #1a1a1a 100%);
        }

        .film-strip-scroll::-webkit-scrollbar {
            height: 8px;
        }

        .film-strip-scroll::-webkit-scrollbar-track {
            background: var(--bg-tertiary);
            border-radius: 4px;
        }

        .film-strip-scroll::-webkit-scrollbar-thumb {
            background: var(--rouge);
            border-radius: 4px;
        }

        /* Contenu du film */
        .film-strip-content {
            display: flex;
            gap: 0;
            padding: 0 3rem;
            min-width: max-content;
        }

        /* Cadre de film (frame) */
        .film-frame {
            flex-shrink: 0;
            width: 320px;
            padding: 1.5rem;
            position: relative;
            cursor: pointer;
            transition: all 0.4s ease;
        }

        .film-frame::before {
            content: '';
            position: absolute;
            left: 0;
            top: 50%;
            transform: translateY(-50%);
            width: 2px;
            height: 60%;
            background: rgba(255,255,255,0.1);
        }

        .film-frame:first-child::before {
            display: none;
        }

        .film-frame:hover {
            transform: scale(1.02);
        }

        /* Carte dans le cadre */
        .frame-card {
            background: var(--bg-card);
            border-radius: 12px;
            overflow: hidden;
            border: 1px solid var(--border-color);
            transition: all 0.4s ease;
            height: 100%;
        }

        .film-frame:hover .frame-card {
            border-color: var(--rouge);
            box-shadow: 0 10px 40px rgba(200, 30, 50, 0.3);
        }

        /* En-tête avec année */
        .frame-header {
            background: linear-gradient(135deg, var(--rouge) 0%, #e63946 100%);
            padding: 1rem 1.5rem;
            display: flex;
            align-items: center;
            justify-content: space-between;
        }

        .frame-year {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 2.8rem;
            color: #fff;
            letter-spacing: 2px;
            line-height: 1;
        }

        .frame-icon {
            font-size: 2.25rem;
            filter: grayscale(100%) brightness(2);
        }

        /* Corps de la carte */
        .frame-body {
            padding: 1.5rem;
        }

        .frame-title {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 1.75rem;
            letter-spacing: 1px;
            color: var(--text-primary);
            margin-bottom: 0.8rem;
            line-height: 1.2;
        }

        .frame-text {
            font-size: 1.05rem;
            color: var(--text-muted);
            line-height: 1.6;
        }

        .frame-text strong {
            color: var(--text-secondary);
        }

        /* Indicateur de progression */
        .timeline-progress-indicator {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 1rem;
            margin-top: 2rem;
            padding: 1rem;
        }

        .progress-label {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 1.25rem;
            letter-spacing: 2px;
            color: var(--text-muted);
        }

        .progress-bar-container {
            flex: 1;
            max-width: 400px;
            height: 6px;
            background: var(--bg-tertiary);
            border-radius: 3px;
            overflow: hidden;
        }

        .progress-bar-fill {
            height: 100%;
            background: linear-gradient(90deg, var(--rouge) 0%, #ff6b6b 100%);
            border-radius: 3px;
            transition: width 0.3s ease;
            width: 0%;
        }

        /* Navigation rapide par décennie */
        .decade-nav {
            display: flex;
            justify-content: center;
            gap: 0.5rem;
            margin-top: 1.5rem;
        }

        .decade-btn {
            padding: 0.6rem 1.2rem;
            background: var(--bg-card);
            border: 1px solid var(--border-color);
            border-radius: 6px;
            color: var(--text-secondary);
            font-family: 'Bebas Neue', sans-serif;
            font-size: 1.15rem;
            letter-spacing: 1px;
            cursor: pointer;
            transition: all 0.3s ease;
        }

        .decade-btn:hover,
        .decade-btn.active {
            background: var(--rouge);
            border-color: var(--rouge);
            color: #fff;
        }

        /* Instructions de scroll */
        .scroll-hint {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 0.5rem;
            margin-top: 1rem;
            color: var(--text-muted);
            font-size: 1.15rem;
        }

        .scroll-hint-arrow {
            animation: scrollHint 1.5s ease-in-out infinite;
        }

        @keyframes scrollHint {
            0%, 100% { transform: translateX(0); }
            50% { transform: translateX(10px); }
        }

        /* Modal pour détails (optionnel) */
        .frame-expand-btn {
            display: inline-flex;
            align-items: center;
            gap: 0.3rem;
            margin-top: 1rem;
            padding: 0.4rem 0.8rem;
            background: transparent;
            border: 1px solid var(--border-color);
            border-radius: 4px;
            color: var(--text-muted);
            font-size: 1.25rem;
            cursor: pointer;
            transition: all 0.3s ease;
        }

        .frame-expand-btn:hover {
            border-color: var(--rouge);
            color: var(--rouge);
        }

        /* Texte expandable pour la page À propos */
        .text-expandable-apropos .text-preview-apropos {
            display: block;
        }

        .text-expandable-apropos .text-full-apropos {
            display: none;
        }

        .text-expandable-apropos.expanded .text-preview-apropos {
            display: none;
        }

        .text-expandable-apropos.expanded .text-full-apropos {
            display: block;
        }

        .btn-expand-apropos {
            display: inline-flex;
            align-items: center;
            gap: 0.5rem;
            margin-top: 1rem;
            padding: 0.6rem 1.2rem;
            background: transparent;
            border: 1px solid var(--accent);
            color: var(--accent);
            border-radius: 4px;
            font-size: 1.05rem;
            cursor: pointer;
            transition: var(--transition);
        }

        .btn-expand-apropos:hover {
            background: var(--accent);
            color: #ffffff;
        }

        .btn-expand-apropos .arrow {
            transition: transform 0.3s ease;
        }

        .text-expandable-apropos.expanded .btn-expand-apropos .arrow {
            transform: rotate(180deg);
        }

        /* ============================================
           CLIENTS
           ============================================ */
        .clients {
            background: var(--bg-primary);
            padding: 5rem 2rem;
        }

        .clients-grid {
            display: grid;
            grid-template-columns: repeat(6, 1fr);
            gap: 1.5rem;
            max-width: 1200px;
            margin: 0 auto;
        }

        .client-logo {
            background: var(--bg-secondary);
            padding: 1.5rem 1rem;
            border-radius: 8px;
            text-align: center;
            font-family: 'Bebas Neue', sans-serif;
            font-size: 1.25rem;
            letter-spacing: 1px;
            color: var(--text-primary);
            border: 1px solid var(--border-color-strong);
            transition: var(--transition);
            display: flex;
            align-items: center;
            justify-content: center;
            min-height: 70px;
        }

        .client-logo:hover {
            border-color: var(--accent);
            background: var(--bg-card);
            transform: translateY(-2px);
            box-shadow: var(--shadow-sm);
        }

        /* ============================================
           CTA SECTION
           ============================================ */
        .cta-section {
            background: linear-gradient(135deg, #1a1a2e 0%, #2d2d44 100%);
            padding: 5rem 2rem;
            text-align: center;
            position: relative;
            overflow: hidden;
        }

        .cta-section::before {
            pointer-events: none;
            content: '';
            position: absolute;
            top: 0; left: 0; right: 0; bottom: 0;
            background: radial-gradient(circle at 30% 50%, rgba(230, 57, 70, 0.15) 0%, transparent 50%);
        }

        .cta-content {
            position: relative;
            z-index: 2;
            max-width: 700px;
            margin: 0 auto;
        }

        .cta-section h2 {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 2.8rem;
            letter-spacing: 3px;
            margin-bottom: 1rem;
            color: #ffffff;
        }

        .cta-section p {
            color: rgba(255, 255, 255, 0.7);
            font-size: 1.25rem;
            margin-bottom: 2rem;
        }

        .cta-buttons {
            display: flex;
            gap: 1rem;
            justify-content: center;
            flex-wrap: wrap;
        }

        .btn {
            display: inline-flex;
            align-items: center;
            gap: 0.5rem;
            padding: 1rem 2rem;
            border-radius: 4px;
            text-decoration: none;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 1px;
            font-size: 1.05rem;
            transition: var(--transition);
            border: none;
            cursor: pointer;
        }

        .btn-white { background: #ffffff; color: var(--accent); }
        .btn-white:hover { background: #f0f0f0; transform: translateY(-2px); }

        .btn-outline {
            background: transparent;
            color: #ffffff;
            border: 2px solid rgba(255, 255, 255, 0.5);
        }
        .btn-outline:hover {
            background: #ffffff;
            color: #1a1a2e;
            border-color: #ffffff;
        }

        .btn-primary { background: var(--accent); color: #ffffff; }
        .btn-primary:hover { background: var(--accent-dark); transform: translateY(-2px); }

        /* ============================================
           PAGE HERO
           ============================================ */
        .page-hero {
            min-height: 60vh;
            display: flex;
            align-items: center;
            padding: 8rem 2rem 4rem;
            position: relative;
            overflow: hidden;
        }

        .page-hero .video-bg-desktop {
            position: absolute;
            top: 0; left: 0;
            width: 100%; height: 100%;
            z-index: 0;
            overflow: hidden;
        }

        .page-hero .video-bg-desktop iframe {
            position: absolute;
            top: 50%; left: 50%;
            width: 177.77777778vh;
            min-width: 100%;
            height: 100vh;
            min-height: 56.25vw;
            transform: translate(-50%, -50%);
        }

        .page-hero .video-bg-mobile {
            display: none;
            position: absolute;
            top: 0; left: 0;
            width: 100%; height: 100%;
            object-fit: cover;
            z-index: 0;
        }

        .page-hero-overlay {
            position: absolute;
            top: 0; left: 0;
            width: 100%; height: 100%;
            background: var(--overlay-medium);
            z-index: 1;
        }

        .page-hero-content {
            position: relative;
            z-index: 2;
            max-width: 1200px;
            margin: 0 auto;
            width: 100%;
        }

        .breadcrumb {
            font-size: 1.05rem;
            margin-bottom: 1.5rem;
            color: rgba(255, 255, 255, 0.7);
        }

        .breadcrumb a { color: #ffffff; text-decoration: none; }
        .breadcrumb a:hover { text-decoration: underline; }

        /* Bouton retour flottant pour les articles */
        .floating-back-btn {
            position: fixed;
            bottom: 2rem;
            left: 2rem;
            display: flex;
            align-items: center;
            gap: 0.5rem;
            padding: 0.75rem 1.25rem;
            background: var(--rouge);
            color: #fff;
            text-decoration: none;
            font-weight: 600;
            font-size: 0.95rem;
            border-radius: 50px;
            box-shadow: 0 4px 20px rgba(230, 57, 70, 0.4);
            z-index: 1000;
            transition: all 0.3s ease;
            opacity: 0;
            visibility: hidden;
            transform: translateY(20px);
        }

        .floating-back-btn.visible {
            opacity: 1;
            visibility: visible;
            transform: translateY(0);
        }

        .floating-back-btn:hover {
            background: #c1323d;
            box-shadow: 0 6px 25px rgba(230, 57, 70, 0.5);
            transform: translateY(-2px);
        }

        .floating-back-btn svg {
            width: 18px;
            height: 18px;
        }

        /* Boutons de partage */
        .share-buttons {
            display: flex;
            gap: 0.75rem;
            align-items: center;
            flex-wrap: wrap;
        }

        .share-btn {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 40px;
            height: 40px;
            border-radius: 50%;
            background: var(--noir-light);
            color: #fff;
            text-decoration: none;
            transition: all 0.3s ease;
            cursor: pointer;
            border: none;
        }

        .share-btn:hover {
            transform: translateY(-3px);
        }

        .share-btn.linkedin:hover { background: #0077b5; }
        .share-btn.facebook:hover { background: #1877f2; }
        .share-btn.twitter:hover { background: #000; }
        .share-btn.copy:hover { background: var(--rouge); }
        .share-btn.whatsapp:hover { background: #25d366; }

        .share-btn svg {
            width: 18px;
            height: 18px;
        }

        .share-label {
            font-size: 0.9rem;
            color: var(--gris);
            margin-right: 0.5rem;
        }

        /* Bouton partage sur vignette */
        .card-share-btn {
            position: absolute;
            top: 0.75rem;
            right: 0.75rem;
            width: 36px;
            height: 36px;
            border-radius: 50%;
            background: rgba(0,0,0,0.7);
            color: #fff;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            opacity: 1;
            transition: all 0.3s ease;
            border: none;
            z-index: 10;
        }

        .card-share-btn:hover {
            background: var(--rouge);
            transform: scale(1.1);
        }

        .card-share-btn svg {
            width: 16px;
            height: 16px;
        }

        .expertise-article:hover .card-share-btn {
            opacity: 1;
        }

        /* Menu partage popup */
        .share-popup {
            position: absolute;
            top: 50px;
            right: 0;
            background: var(--noir-deep);
            border-radius: 12px;
            padding: 1rem;
            box-shadow: 0 10px 40px rgba(0,0,0,0.5);
            display: none;
            z-index: 100;
            min-width: 200px;
        }

        .share-popup.active {
            display: block;
        }

        .share-popup-title {
            font-size: 0.85rem;
            color: var(--gris);
            margin-bottom: 0.75rem;
            padding-bottom: 0.5rem;
            border-bottom: 1px solid rgba(255,255,255,0.1);
        }

        .share-popup-links {
            display: flex;
            gap: 0.5rem;
        }

        .share-popup-links .share-btn {
            width: 36px;
            height: 36px;
        }

        /* Toast notification */
        .toast-notification {
            position: fixed;
            bottom: 2rem;
            left: 50%;
            transform: translateX(-50%) translateY(100px);
            background: var(--noir-deep);
            color: #fff;
            padding: 1rem 2rem;
            border-radius: 50px;
            box-shadow: 0 10px 40px rgba(0,0,0,0.4);
            z-index: 9999;
            opacity: 0;
            transition: all 0.3s ease;
            display: flex;
            align-items: center;
            gap: 0.75rem;
        }

        .toast-notification.show {
            opacity: 1;
            transform: translateX(-50%) translateY(0);
        }

        .toast-notification svg {
            color: #4ade80;
        }

        /* Mode clair - Boutons de partage */
        @media (prefers-color-scheme: light) {
            :root:not([data-theme="dark"]) .share-btn {
                background: #2d2d44;
                color: #fff;
            }
            :root:not([data-theme="dark"]) .share-popup {
                background: #fff;
                box-shadow: 0 10px 40px rgba(0,0,0,0.15);
                border: 1px solid rgba(0,0,0,0.1);
            }
            :root:not([data-theme="dark"]) .share-popup-title {
                color: #666;
                border-bottom-color: rgba(0,0,0,0.1);
            }
            :root:not([data-theme="dark"]) .toast-notification {
                background: #2d2d44;
                color: #fff;
            }
            :root:not([data-theme="dark"]) .share-label {
                color: #555;
            }
        }

        :root[data-theme="light"] .share-btn {
            background: #2d2d44;
            color: #fff;
        }
        :root[data-theme="light"] .share-popup {
            background: #fff;
            box-shadow: 0 10px 40px rgba(0,0,0,0.15);
            border: 1px solid rgba(0,0,0,0.1);
        }
        :root[data-theme="light"] .share-popup-title {
            color: #666;
            border-bottom-color: rgba(0,0,0,0.1);
        }
        :root[data-theme="light"] .toast-notification {
            background: #2d2d44;
            color: #fff;
        }
        :root[data-theme="light"] .share-label {
            color: #555;
        }

        .accent-line {
            width: 80px;
            height: 4px;
            background: var(--accent);
            margin-bottom: 2rem;
        }

        .page-hero h2 {
            font-family: 'Montserrat', sans-serif;
            font-size: clamp(2.5rem, 6vw, 4.5rem);
            font-weight: 900;
            letter-spacing: -2px;
            line-height: 1;
            margin-bottom: 1.5rem;
            text-transform: uppercase;
            color: #ffffff;
        }

        .page-hero h2 span {
            display: block;
            font-weight: 200;
            font-size: clamp(1rem, 2.5vw, 1.8rem);
            letter-spacing: 6px;
            margin-top: 0.5rem;
            color: rgba(255, 255, 255, 0.85);
        }

        .page-hero .subtitle {
            font-size: 1.4rem;
            font-weight: 300;
            max-width: 550px;
            line-height: 1.7;
            color: rgba(255, 255, 255, 0.9);
        }

        /* Style spécifique page À propos */
        .apropos-title {
            font-family: 'Montserrat', sans-serif;
            font-size: clamp(2rem, 6vw, 4.5rem);
            font-weight: 900;
            letter-spacing: -2px;
            line-height: 1;
            margin-bottom: 1.5rem;
            text-transform: uppercase;
            color: #ffffff;
            text-shadow: 0 4px 30px rgba(0,0,0,0.5);
        }

        .apropos-title span {
            display: block;
            font-weight: 200;
            font-size: clamp(0.9rem, 2.5vw, 1.8rem);
            letter-spacing: clamp(2px, 1vw, 6px);
            margin-top: 0.5rem;
            color: rgba(255, 255, 255, 0.85);
            text-shadow: 0 2px 10px rgba(0,0,0,0.4);
        }

        .apropos-intro {
            font-size: clamp(0.95rem, 2vw, 1.2rem);
            font-weight: 300;
            max-width: 550px;
            line-height: 1.7;
            color: rgba(255, 255, 255, 0.9);
            text-shadow: 0 1px 8px rgba(0,0,0,0.4);
        }

        /* Grille équipe page À propos */
        .team-grid-apropos {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 2rem;
            margin-top: 3rem;
        }

        .team-member-card {
            background: var(--bg-card);
            border: 1px solid var(--border-color);
            border-radius: 12px;
            padding: 2rem;
            text-align: center;
            transition: var(--transition);
        }

        .team-member-card:hover {
            border-color: var(--accent);
            transform: translateY(-5px);
            box-shadow: var(--shadow-md);
        }

        .team-photo {
            width: 120px;
            height: 120px;
            border-radius: 50%;
            margin: 0 auto 1.5rem;
            overflow: hidden;
            border: 3px solid var(--accent);
        }

        .team-photo img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .team-member-card h4 {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 1.4rem;
            letter-spacing: 1px;
            color: var(--text-primary);
            margin-bottom: 0.5rem;
        }

        .team-role {
            color: var(--accent);
            font-weight: 500;
            margin-bottom: 0.5rem;
        }

        .team-languages {
            margin-bottom: 1rem;
        }

        .team-languages span {
            margin: 0 0.2rem;
            font-size: 1.4rem;
        }

        .team-bio {
            color: var(--text-muted);
            font-size: 1.05rem;
            line-height: 1.6;
        }

        /* Bloc texte page À propos */
        .apropos-block {
            background: var(--bg-secondary);
            padding: 2.5rem;
            border-radius: 12px;
            margin-top: 2rem;
            border: 1px solid var(--border-color);
        }

        .apropos-block p {
            font-size: 1.05rem;
            line-height: 1.8;
            margin-bottom: 1.5rem;
            color: var(--text-secondary);
        }

        .apropos-block p:last-child {
            margin-bottom: 0;
        }

        .apropos-highlight {
            font-style: italic;
            color: var(--accent) !important;
        }

        /* ============================================
           NAV SECTEURS
           ============================================ */
        .nav-secteurs {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 1.5rem;
            padding: 1.5rem 2rem;
            background: var(--bg-primary);
            border-bottom: 1px solid var(--border-color);
            position: sticky;
            top: 70px;
            z-index: 100;
        }

        .nav-secteurs .arrow-btn {
            width: 45px; height: 45px;
            border-radius: 50%;
            background: var(--bg-secondary);
            border: 1px solid var(--border-color);
            color: var(--text-primary);
            font-size: 1.75rem;
            cursor: pointer;
            transition: var(--transition);
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
        }

        .nav-secteurs .arrow-btn:hover {
            background: var(--accent);
            border-color: var(--accent);
            color: #ffffff;
        }

        .nav-secteurs .sectors-list {
            display: flex;
            gap: 0.5rem;
            flex-wrap: wrap;
            justify-content: center;
        }

        .sector-link {
            display: inline-block;
            padding: 0.6rem 1.2rem;
            font-size: 1.15rem;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            color: var(--text-muted);
            background: var(--bg-secondary);
            border: 1px solid var(--border-color);
            border-radius: 50px;
            text-decoration: none;
            transition: var(--transition);
        }

        .sector-link:hover {
            color: var(--accent);
            border-color: var(--accent);
        }

        .sector-link.active {
            background: var(--accent);
            color: #ffffff;
            border-color: var(--accent);
        }

        /* ============================================
           SECTION TEXT + REFS
           ============================================ */
        .videos-section {
            background: var(--bg-primary);
            padding: 4rem 2rem;
        }

        .section-text-refs-f {
            display: flex;
            gap: 3rem;
            margin-bottom: 3rem;
        }

        .section-text-refs-f .main-text { flex: 2; }
        .section-text-refs-f .mini-refs { flex: 1; }

        .main-text h2 {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 2.25rem;
            letter-spacing: 1px;
            margin-bottom: 1.5rem;
            color: var(--text-primary);
        }

        .main-text p {
            color: var(--text-secondary);
            font-size: 1.15rem;
            margin-bottom: 1rem;
            line-height: 1.8;
        }

        .main-text strong { color: var(--accent); }

        .text-expandable .text-preview { display: block; }
        .text-expandable .text-full { display: none; }
        .text-expandable.expanded .text-preview { display: none; }
        .text-expandable.expanded .text-full { display: block; }

        .btn-expand {
            background: var(--bg-secondary);
            color: var(--accent);
            border: 1px solid var(--border-color);
            padding: 0.8rem 1.5rem;
            border-radius: 4px;
            font-weight: 600;
            cursor: pointer;
            margin-top: 1rem;
            transition: var(--transition);
            display: inline-flex;
            align-items: center;
            gap: 0.5rem;
        }

        .btn-expand:hover {
            background: var(--accent);
            color: #ffffff;
            border-color: var(--accent);
        }

        .btn-expand .arrow { transition: transform 0.3s ease; }
        .text-expandable.expanded .btn-expand .arrow { transform: rotate(180deg); }

        /* ============================================
           MINI REFS
           ============================================ */
        .mini-refs {
            background: var(--bg-card);
            border-radius: 8px;
            padding: 2rem;
            border: 1px solid var(--border-color);
            border-left: 3px solid var(--accent);
            position: sticky;
            top: 150px;
            height: fit-content;
        }

        .mini-refs h4 {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 1.4rem;
            letter-spacing: 1px;
            margin-bottom: 1.5rem;
            color: var(--text-primary);
        }

        .mini-refs ul { list-style: none; }

        .mini-refs li {
            padding: 0.7rem 0;
            border-bottom: 1px solid var(--border-color);
            font-weight: 500;
            color: var(--text-primary);
        }

        .cta-bottom {
            margin-top: 1.5rem;
            padding-top: 1.5rem;
            border-top: 1px solid var(--border-color);
        }

        .cta-bottom a {
            display: block;
            background: var(--accent);
            color: #ffffff;
            text-align: center;
            padding: 0.8rem 1.5rem;
            border-radius: 4px;
            text-decoration: none;
            font-weight: 600;
            transition: var(--transition);
        }

        .cta-bottom a:hover { background: var(--accent-dark); }

        /* ============================================
           VIDEO EXEMPLES
           ============================================ */
        .video-exemple-row {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 3rem;
            align-items: center;
            margin-bottom: 3rem;
            padding: 2rem;
            background: var(--bg-card);
            border-radius: 8px;
            border: 1px solid var(--border-color);
        }

        .video-card {
            border-radius: 8px;
            overflow: hidden;
            background: var(--bg-secondary);
        }

        .video-card iframe {
            width: 100%;
            aspect-ratio: 16/9;
            display: block;
            border: none;
        }

        /* ============================================
           PAGE NOTRE OFFRE - Prestations & Services
           ============================================ */
        .offre-section {
            padding: 5rem 0;
            background: var(--bg-primary);
        }

        .offre-section.services-accompagnement {
            background: var(--bg-secondary);
        }

        /* Bandeau Technologies */
        .tech-banner {
            margin: 2rem 0 4rem;
            padding: 2rem;
            background: var(--bg-card);
            border-radius: 12px;
            border: 1px solid var(--border-color);
            text-align: center;
        }

        .tech-banner-title {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 1.4rem;
            letter-spacing: 3px;
            color: var(--rouge);
            margin-bottom: 1.5rem;
        }

        .tech-items {
            display: flex;
            justify-content: center;
            flex-wrap: wrap;
            gap: 1rem;
        }

        .tech-item {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 0.5rem;
            padding: 1rem 1.5rem;
            background: var(--bg-tertiary);
            border-radius: 8px;
            transition: all 0.3s ease;
        }

        .tech-item:hover {
            background: rgba(200,30,50,0.15);
            transform: translateY(-3px);
        }

        .tech-icon {
            font-size: 1.8rem;
        }

        .tech-label {
            font-size: 1.25rem;
            color: var(--text-secondary);
            text-transform: uppercase;
            letter-spacing: 1px;
        }

        /* ============================================
           ARSENAL TECHNIQUE - Section complète
           ============================================ */
        .arsenal-section {
            background: var(--bg-secondary);
            border-radius: 16px;
            padding: 3rem;
            margin-bottom: 4rem;
            border: 1px solid var(--border-color);
        }

        .arsenal-header {
            text-align: center;
            margin-bottom: 2.5rem;
        }

        .arsenal-header h3 {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 2.5rem;
            letter-spacing: 3px;
            color: var(--text-primary);
            margin-bottom: 1rem;
        }

        .arsenal-manifeste {
            max-width: 800px;
            margin: 0 auto 2.5rem;
            text-align: center;
        }

        .arsenal-manifeste .accroche {
            font-size: 1.4rem;
            font-style: italic;
            color: var(--text-secondary);
            margin-bottom: 1.5rem;
            line-height: 1.6;
        }

        .arsenal-manifeste .accroche strong {
            color: var(--rouge);
            font-style: normal;
        }

        .arsenal-manifeste p {
            font-size: 1.15rem;
            color: var(--text-muted);
            line-height: 1.7;
            margin-bottom: 1rem;
        }

        .arsenal-highlight {
            background: linear-gradient(135deg, rgba(200,30,50,0.1) 0%, rgba(200,30,50,0.05) 100%);
            border: 1px solid rgba(200,30,50,0.2);
            border-radius: 12px;
            padding: 1.5rem 2rem;
            margin: 2rem auto;
            max-width: 600px;
            text-align: center;
        }

        .arsenal-highlight .icon {
            font-size: 2rem;
            margin-bottom: 0.5rem;
            display: block;
        }

        .arsenal-highlight strong {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 1.4rem;
            letter-spacing: 2px;
            color: var(--rouge);
            display: block;
            margin-bottom: 0.3rem;
        }

        .arsenal-highlight p {
            color: var(--text-secondary);
            font-size: 1.1rem;
            margin: 0;
        }

        /* Grille des techniques */
        .arsenal-grid {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 1.5rem;
            margin-top: 2.5rem;
        }

        .arsenal-item {
            background: var(--bg-card);
            border-radius: 12px;
            padding: 1.5rem;
            border: 1px solid var(--border-color);
            transition: all 0.3s ease;
            cursor: default;
        }

        .arsenal-item:hover {
            border-color: var(--rouge);
            transform: translateY(-3px);
            box-shadow: 0 10px 30px rgba(200,30,50,0.15);
        }

        .arsenal-item-header {
            display: flex;
            align-items: center;
            gap: 0.8rem;
            margin-bottom: 0.8rem;
        }

        .arsenal-item-icon {
            font-size: 1.8rem;
        }

        .arsenal-item-title {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 1.2rem;
            letter-spacing: 1px;
            color: var(--text-primary);
        }

        .arsenal-item-desc {
            font-size: 0.95rem;
            color: var(--text-muted);
            line-height: 1.5;
        }


        /* Blocs Prestations */
        .prestation-block {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 4rem;
            align-items: center;
            padding: 4rem 0;
            border-bottom: 1px solid var(--border-color);
        }

        .prestation-block:last-of-type {
            border-bottom: none;
        }

        .prestation-block.reverse {
            direction: rtl;
        }

        .prestation-block.reverse > * {
            direction: ltr;
        }

        .prestation-content {
            padding: 0 1rem;
        }

        .prestation-number {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 4.5rem;
            color: var(--rouge);
            opacity: 0.3;
            line-height: 1;
            display: block;
            margin-bottom: 0.5rem;
        }

        .prestation-content h3 {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 2.8rem;
            letter-spacing: 3px;
            margin-bottom: 1rem;
            color: var(--text-primary);
        }

        .prestation-content > p {
            font-size: 1.25rem;
            line-height: 1.7;
            color: var(--text-secondary);
            margin-bottom: 1.5rem;
        }

        .prestation-points {
            list-style: none;
            padding: 0;
            margin: 0;
        }

        .prestation-points li {
            padding: 0.5rem 0;
            padding-left: 1.5rem;
            position: relative;
            color: var(--text-muted);
            font-size: 1.25rem;
        }

        .prestation-points li::before {
            content: '→';
            position: absolute;
            left: 0;
            color: var(--rouge);
        }

        /* Video placeholder pour offre */
        .prestation-video,
        .service-visual {
            position: relative;
        }

        .video-placeholder-offer {
            position: relative;
            aspect-ratio: 16/9;
            border-radius: 12px;
            overflow: hidden;
            cursor: pointer;
        }

        .video-placeholder-offer img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform 0.5s ease;
        }

        .video-placeholder-offer:hover img {
            transform: scale(1.05);
        }

        .video-placeholder-offer::before {
            content: '';
            position: absolute;
            inset: 0;
            background: rgba(0,0,0,0.3);
            z-index: 1;
            transition: background 0.3s ease;
        }

        .video-placeholder-offer:hover::before {
            background: rgba(0,0,0,0.1);
        }

        .video-placeholder-offer .play-btn {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            width: 70px;
            height: 70px;
            background: var(--rouge);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.75rem;
            color: #fff;
            z-index: 2;
            transition: all 0.3s ease;
            box-shadow: 0 10px 30px rgba(0,0,0,0.3);
        }

        .video-placeholder-offer:hover .play-btn {
            transform: translate(-50%, -50%) scale(1.1);
            box-shadow: 0 15px 40px rgba(200,30,50,0.4);
        }

        /* Golf 360 Card - Lien vers site externe */
        .golf360-card {
            display: block;
            text-decoration: none;
            border-radius: 12px;
            overflow: hidden;
            position: relative;
        }

        .golf360-visual {
            position: relative;
            aspect-ratio: 16/9;
            overflow: hidden;
        }

        .golf360-visual img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform 0.5s ease;
        }

        .golf360-card:hover .golf360-visual img {
            transform: scale(1.1);
        }

        .golf360-overlay {
            position: absolute;
            inset: 0;
            background: linear-gradient(135deg, rgba(0,100,50,0.85) 0%, rgba(0,60,30,0.9) 100%);
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 0.5rem;
            transition: all 0.4s ease;
        }

        .golf360-card:hover .golf360-overlay {
            background: linear-gradient(135deg, rgba(0,120,60,0.9) 0%, rgba(0,80,40,0.95) 100%);
        }

        .golf360-icon {
            font-size: 3rem;
            margin-bottom: 0.5rem;
        }

        .golf360-label {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 1.8rem;
            letter-spacing: 3px;
            color: #fff;
        }

        .golf360-url {
            font-size: 1.1rem;
            color: rgba(255,255,255,0.8);
            padding: 0.5rem 1.5rem;
            border: 2px solid rgba(255,255,255,0.5);
            border-radius: 50px;
            margin-top: 0.5rem;
            transition: all 0.3s ease;
        }

        .golf360-card:hover .golf360-url {
            background: #fff;
            color: #006432;
            border-color: #fff;
        }

        /* Section Services (accompagnement) */
        .service-block {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 4rem;
            align-items: center;
            padding: 4rem 0;
            border-bottom: 1px solid var(--border-color);
        }

        .service-block:last-of-type {
            border-bottom: none;
        }

        .service-block.reverse {
            direction: rtl;
        }

        .service-block.reverse > * {
            direction: ltr;
        }

        .service-content {
            padding: 0 1rem;
        }

        .service-badge {
            display: inline-block;
            background: var(--rouge);
            color: #fff;
            padding: 0.4rem 1rem;
            border-radius: 4px;
            font-size: 0.75rem;
            font-weight: 600;
            letter-spacing: 2px;
            margin-bottom: 1rem;
        }

        .service-content h3 {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 2.8rem;
            letter-spacing: 3px;
            margin-bottom: 1rem;
            color: var(--text-primary);
        }

        .service-content > p {
            font-size: 1.25rem;
            line-height: 1.7;
            color: var(--text-secondary);
            margin-bottom: 1.5rem;
        }

        .service-features {
            list-style: none;
            padding: 0;
            margin: 0 0 2rem 0;
        }

        .service-features li {
            padding: 0.5rem 0;
            color: var(--text-muted);
            font-size: 1.25rem;
        }

        .btn-service {
            display: inline-block;
            padding: 0.8rem 1.5rem;
            background: transparent;
            border: 2px solid var(--rouge);
            color: var(--rouge);
            text-decoration: none;
            font-weight: 600;
            border-radius: 6px;
            transition: all 0.3s ease;
        }

        .btn-service:hover {
            background: var(--rouge);
            color: #fff;
        }

        /* Bandeau Prochaines Sessions Formation — Style Agenda */
        .prochaines-sessions-banner {
            background: linear-gradient(135deg, var(--rouge) 0%, #a01525 100%);
            padding: 1.6rem 0;
            position: relative;
            overflow: hidden;
        }

        .prochaines-sessions-banner::before {
            content: '';
            position: absolute;
            inset: 0;
            background: 
                radial-gradient(ellipse at 20% 50%, rgba(255,255,255,0.06) 0%, transparent 60%),
                radial-gradient(ellipse at 80% 50%, rgba(0,0,0,0.15) 0%, transparent 60%);
            pointer-events: none;
        }

        .banner-sessions-inner {
            position: relative;
            z-index: 1;
        }

        .banner-sessions-header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            margin-bottom: 1rem;
        }

        .banner-sessions-header-left {
            display: flex;
            align-items: center;
            gap: 0.8rem;
        }

        .banner-sessions-header-left svg {
            width: 22px;
            height: 22px;
            stroke: rgba(255,255,255,0.8);
            fill: none;
            stroke-width: 1.8;
        }

        .banner-sessions-header h3 {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 1.3rem;
            letter-spacing: 2px;
            color: #fff;
        }

        .banner-session-count {
            font-family: 'Montserrat', sans-serif;
            font-size: 0.65rem;
            font-weight: 600;
            color: rgba(255,255,255,0.6);
            background: rgba(255,255,255,0.1);
            padding: 0.25rem 0.7rem;
            border-radius: 50px;
        }

        .btn-inscription-banner {
            display: inline-flex;
            align-items: center;
            gap: 0.5rem;
            background: #fff;
            color: var(--rouge);
            text-decoration: none;
            font-family: 'Montserrat', sans-serif;
            font-weight: 700;
            font-size: 0.72rem;
            text-transform: uppercase;
            letter-spacing: 1px;
            padding: 0.65rem 1.3rem;
            border-radius: 50px;
            transition: all 0.3s;
            box-shadow: 0 4px 12px rgba(0,0,0,0.2);
            flex-shrink: 0;
            white-space: nowrap;
        }

        .btn-inscription-banner:hover {
            transform: translateY(-2px) scale(1.03);
            box-shadow: 0 6px 20px rgba(0,0,0,0.3);
        }

        .btn-inscription-banner svg {
            width: 14px;
            height: 14px;
            stroke: var(--rouge);
            fill: none;
            stroke-width: 2.5;
        }

        /* Timeline / Carrousel */
        .sessions-timeline {
            display: flex;
            gap: 1rem;
            overflow-x: auto;
            scrollbar-width: none;
            -webkit-overflow-scrolling: touch;
            padding: 0.3rem 0;
        }

        .sessions-timeline::-webkit-scrollbar { display: none; }

        /* Carte session style agenda */
        .session-card-agenda {
            background: rgba(255,255,255,0.07);
            border: 1px solid rgba(255,255,255,0.12);
            border-radius: 16px;
            min-width: 255px;
            flex-shrink: 0;
            text-decoration: none;
            transition: all 0.3s ease;
            overflow: hidden;
        }

        .session-card-agenda:hover {
            background: rgba(255,255,255,0.13);
            transform: translateY(-2px);
            box-shadow: 0 8px 24px rgba(0,0,0,0.25);
            border-color: rgba(255,255,255,0.25);
        }

        .session-card-top {
            padding: 0.9rem 1.1rem 0.7rem;
        }

        .session-card-date-row {
            display: flex;
            align-items: center;
            gap: 0.7rem;
        }

        .session-day-block {
            background: #fff;
            border-radius: 8px;
            padding: 0.35rem 0.55rem;
            text-align: center;
            min-width: 48px;
            box-shadow: 0 2px 6px rgba(0,0,0,0.15);
        }

        .session-day-block .day {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 1.5rem;
            color: var(--rouge);
            line-height: 1;
        }

        .session-day-block .month {
            font-family: 'Montserrat', sans-serif;
            font-size: 0.5rem;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            color: var(--rouge);
        }

        .session-card-info h4 {
            font-family: 'Montserrat', sans-serif;
            font-weight: 700;
            font-size: 0.88rem;
            color: #fff;
            line-height: 1.2;
        }

        .session-card-info .session-loc {
            font-size: 0.72rem;
            color: rgba(255,255,255,0.6);
            margin-top: 0.1rem;
        }

        .session-card-bottom {
            background: rgba(0,0,0,0.15);
            padding: 0.55rem 1.1rem;
            display: flex;
            align-items: center;
            justify-content: space-between;
        }

        .session-card-places {
            display: flex;
            align-items: center;
            gap: 0.35rem;
            font-size: 0.7rem;
            color: rgba(255,255,255,0.8);
        }

        .session-card-places .dot {
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background: #4CAF50;
        }

        .session-card-places .dot.low {
            background: #ff9800;
        }

        .session-card-action {
            display: flex;
            align-items: center;
            gap: 0.5rem;
        }

        .session-card-action a {
            font-family: 'Montserrat', sans-serif;
            font-size: 0.6rem;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            text-decoration: none;
            display: inline-flex;
            align-items: center;
            gap: 0.25rem;
            padding: 0.3rem 0.6rem;
            border-radius: 4px;
            transition: all 0.2s;
        }

        .session-card-action .btn-inscrire {
            background: var(--rouge);
            color: #fff;
        }

        .session-card-action .btn-inscrire:hover {
            background: #c81e32;
        }

        .session-card-action .btn-programme {
            background: rgba(255,255,255,0.1);
            color: rgba(255,255,255,0.8);
            border: 1px solid rgba(255,255,255,0.15);
        }

        .session-card-action .btn-programme:hover {
            background: rgba(255,255,255,0.18);
            color: #fff;
        }

        .session-card-action a svg {
            width: 10px;
            height: 10px;
            stroke: currentColor;
            fill: none;
            stroke-width: 2.5;
        }

        .session-card-agenda:hover .session-card-action {
            opacity: 1;
        }

        /* Formation (garde les styles existants) */
        .formation-grid {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 2rem;
        }

        .formation-card {
            background: var(--bg-card);
            border-radius: 8px;
            padding: 2rem;
            border: 1px solid var(--border-color);
        }

        .formation-tag {
            display: inline-block;
            background: var(--accent);
            color: #ffffff;
            padding: 0.3rem 0.8rem;
            border-radius: 4px;
            font-size: 1.25rem;
            font-weight: 600;
            margin-bottom: 1rem;
        }

        .formation-card h3 {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 1.75rem;
            letter-spacing: 1px;
            margin-bottom: 1rem;
            color: var(--text-primary);
        }

        .formation-card p { color: var(--text-muted); font-size: 1.25rem; margin-bottom: 0.5rem; }
        .formation-card ul { list-style: none; }
        .formation-card li { padding: 0.3rem 0; color: var(--text-secondary); font-size: 1.25rem; }

        .formation-card-featured {
            border: 2px solid var(--rouge) !important;
            position: relative;
        }
        .formation-card-cta {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            margin-top: 1.2rem;
            padding: 10px 20px;
            background: var(--rouge);
            color: #fff;
            border-radius: 8px;
            text-decoration: none;
            font-family: 'Montserrat', sans-serif;
            font-size: 0.75rem;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            transition: all 0.2s;
            box-shadow: 0 3px 12px rgba(230,57,70,0.25);
        }
        .formation-card-cta:hover {
            transform: translateY(-1px);
            box-shadow: 0 6px 20px rgba(230,57,70,0.35);
        }
        .formation-card-cta svg {
            width: 14px; height: 14px;
            stroke: #fff; fill: none; stroke-width: 2.5;
        }

        /* ============================================
           PHILOSOPHIE — Piliers
           ============================================ */
        .philo-pillars {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 1.5rem;
            margin-top: 3rem;
            max-width: 1200px;
        }

        .pillar {
            padding: 1.5rem;
            background: var(--bg-card);
            border: 1px solid var(--border-color);
            border-radius: 12px;
            text-align: center;
            transition: all 0.3s;
        }

        .pillar:hover {
            border-color: rgba(230,57,70,0.25);
            background: rgba(230,57,70,0.04);
        }

        .pillar-icon { font-size: 2rem; margin-bottom: 0.6rem; }

        .pillar h4 {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 1.15rem;
            letter-spacing: 1px;
            color: var(--text-primary);
            margin-bottom: 0.3rem;
        }

        .pillar p { font-size: 0.82rem; color: var(--text-muted); line-height: 1.5; }

        .pillar-cta-link {
            text-decoration: none;
            border: 2px solid var(--rouge) !important;
            cursor: pointer;
            position: relative;
        }
        .pillar-cta-link:hover {
            background: rgba(230,57,70,0.08);
            transform: translateY(-2px);
            box-shadow: 0 4px 15px rgba(230,57,70,0.15);
        }
        .pillar-link-text {
            display: inline-block;
            margin-top: 0.5rem;
            font-family: 'Montserrat', sans-serif;
            font-size: 0.7rem;
            font-weight: 700;
            color: var(--rouge);
            letter-spacing: 0.5px;
            transition: gap 0.2s;
        }

        /* CTA Appel candidature — pleine largeur */
        .cta-candidature-card {
            display: block;
            margin-top: 1.5rem;
            padding: 1.5rem;
            background: linear-gradient(135deg, rgba(230,57,70,0.1) 0%, rgba(230,57,70,0.04) 100%);
            border: 1px solid rgba(230,57,70,0.2);
            border-radius: 12px;
            text-decoration: none;
            transition: all 0.3s;
            position: relative;
            overflow: hidden;
            max-width: 1200px;
        }

        .cta-candidature-card:hover {
            border-color: rgba(230,57,70,0.4);
            background: linear-gradient(135deg, rgba(230,57,70,0.14) 0%, rgba(230,57,70,0.06) 100%);
            transform: translateY(-2px);
            box-shadow: 0 8px 25px rgba(230,57,70,0.15);
        }

        .cta-candidature-card .cta-cand-badge {
            display: inline-flex;
            align-items: center;
            gap: 0.5rem;
            font-family: 'Montserrat', sans-serif;
            font-size: 0.7rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: 2px;
            color: #fff;
            background: var(--rouge);
            padding: 0.55rem 1.3rem;
            border-radius: 50px;
            margin-bottom: 0.8rem;
        }

        .cta-candidature-card .cta-cand-badge .badge-emoji {
            font-size: 1.1rem;
        }

        .cta-candidature-card .cta-cand-title {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 1.4rem;
            letter-spacing: 1px;
            color: var(--text-primary);
            line-height: 1.2;
            margin-bottom: 0.4rem;
        }

        .cta-candidature-card .cta-cand-desc {
            font-size: 0.8rem;
            color: var(--text-muted);
            line-height: 1.5;
            margin-bottom: 0.8rem;
        }

        .cta-candidature-card .cta-cand-arrow {
            display: inline-flex;
            align-items: center;
            gap: 0.4rem;
            font-size: 0.7rem;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 1px;
            color: var(--rouge);
            transition: gap 0.2s;
        }

        .cta-candidature-card:hover .cta-cand-arrow {
            gap: 0.7rem;
        }

        .cta-candidature-card .cta-cand-arrow svg {
            width: 14px; height: 14px;
            stroke: var(--rouge); fill: none; stroke-width: 2.5;
        }

        /* ============================================
           PARCOURS PARTICIPANT — Comment ça se passe
           ============================================ */
        .parcours-section {
            padding: 3rem 0 4rem;
            position: relative;
        }
        .parcours-section::before {
            content: ''; position: absolute; top: 0; left: 10%; right: 10%;
            height: 1px;
            background: linear-gradient(90deg, transparent, rgba(255,255,255,0.06), transparent);
        }
        .parcours-header {
            text-align: center; margin-bottom: 3rem;
        }
        .parcours-overtitle {
            font-family: 'Montserrat', sans-serif; font-size: 0.6rem;
            font-weight: 700; letter-spacing: 3px; text-transform: uppercase;
            color: var(--rouge); margin-bottom: 0.6rem;
        }
        .parcours-header h2 {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 2.5rem; letter-spacing: 3px;
        }
        .parcours-header > p {
            font-size: 1.05rem; color: var(--gris);
            max-width: 550px; margin: 0.8rem auto 0;
        }
        .parcours-timeline {
            display: grid; grid-template-columns: repeat(4, 1fr);
            gap: 0; position: relative;
        }
        .parcours-timeline::before {
            content: '';
            position: absolute; top: 34px; left: 12%; right: 12%;
            height: 2px;
            background: linear-gradient(90deg,
                transparent 0%, rgba(230,57,70,0.15) 10%,
                rgba(230,57,70,0.35) 50%,
                rgba(230,57,70,0.15) 90%, transparent 100%
            );
        }
        .parcours-step {
            text-align: center; padding: 0 1rem;
            position: relative; z-index: 1;
        }
        .parcours-num {
            width: 48px; height: 48px; border-radius: 50%;
            background: var(--noir); border: 2px solid var(--rouge);
            color: var(--rouge); margin: 0 auto 1.2rem;
            display: flex; align-items: center; justify-content: center;
            font-family: 'Bebas Neue', sans-serif; font-size: 1.4rem;
            box-shadow: 0 0 0 8px var(--noir), 0 0 15px rgba(230,57,70,0.12);
        }
        .parcours-icon { font-size: 2rem; margin-bottom: 0.8rem; }
        .parcours-step h4 {
            font-family: 'Montserrat', sans-serif; font-size: 0.9rem;
            font-weight: 700; margin-bottom: 0.4rem;
        }
        .parcours-step p {
            font-size: 0.82rem; color: var(--gris); line-height: 1.55;
            max-width: 220px; margin: 0 auto;
        }
        .parcours-cta {
            text-align: center; margin-top: 2.5rem;
        }
        .parcours-cta-btn {
            display: inline-flex; align-items: center; gap: 10px;
            padding: 14px 32px;
            background: var(--rouge); color: #fff;
            border-radius: 12px; text-decoration: none;
            font-family: 'Montserrat', sans-serif;
            font-size: 0.85rem; font-weight: 700;
            text-transform: uppercase; letter-spacing: 1px;
            transition: all 0.2s;
            box-shadow: 0 4px 20px rgba(230,57,70,0.3);
        }
        .parcours-cta-btn:hover {
            transform: translateY(-2px);
            box-shadow: 0 8px 30px rgba(230,57,70,0.4);
        }
        .parcours-cta-btn svg { width: 18px; height: 18px; stroke: #fff; fill: none; stroke-width: 2; }

        @media (max-width: 900px) {
            .parcours-timeline { grid-template-columns: repeat(2, 1fr); gap: 2rem; }
            .parcours-timeline::before { display: none; }
        }
        @media (max-width: 600px) {
            .parcours-timeline { grid-template-columns: 1fr; }
        }

        /* Style for host-bonus label */
        .host-bonus-label {
            background: var(--rouge) !important;
            color: #fff !important;
            border: none !important;
        }

        /* ============================================
           CANDIDATURE — Bloc "On vient chez vous"
           ============================================ */
        .candidature-section {
            padding: 0 0 3rem;
        }

        .candidature-block {
            background: linear-gradient(135deg, rgba(230,57,70,0.08) 0%, rgba(230,57,70,0.02) 100%);
            border: 1px solid rgba(230,57,70,0.15);
            border-radius: 20px;
            overflow: hidden;
        }

        .candidature-top {
            padding: 3rem 3rem 2rem;
            position: relative;
        }

        .candidature-top::before {
            content: '';
            position: absolute;
            top: 0; left: 0; right: 0;
            height: 4px;
            background: linear-gradient(90deg, var(--rouge) 0%, #a01525 100%);
        }

        .candidature-badge {
            display: inline-flex;
            align-items: center;
            gap: 0.5rem;
            background: rgba(230,57,70,0.15);
            border: 1px solid rgba(230,57,70,0.25);
            padding: 0.4rem 1rem;
            border-radius: 50px;
            font-size: 0.65rem;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 2px;
            color: var(--rouge);
            margin-bottom: 1.2rem;
        }

        .candidature-badge svg {
            width: 14px; height: 14px;
            stroke: var(--rouge); fill: none; stroke-width: 2;
        }

        .candidature-top h3 {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 2.2rem;
            letter-spacing: 2px;
            color: var(--text-primary);
            margin-bottom: 0.4rem;
        }

        .candidature-top h3 span { color: var(--rouge); }

        .candidature-intro {
            font-size: 1.05rem;
            color: var(--text-secondary);
            max-width: 700px;
            line-height: 1.7;
            margin-bottom: 2rem;
        }

        .deal-grid {
            display: grid;
            grid-template-columns: 1fr auto 1fr;
            gap: 2rem;
            align-items: center;
        }

        .deal-col { display: flex; flex-direction: column; gap: 0.7rem; }

        .deal-col h4 {
            font-family: 'Montserrat', sans-serif;
            font-size: 0.7rem; font-weight: 700;
            text-transform: uppercase; letter-spacing: 2px;
            color: var(--text-muted); margin-bottom: 0.3rem;
        }

        .deal-item {
            display: flex; align-items: center; gap: 0.7rem;
            font-size: 0.9rem; color: var(--text-secondary);
        }

        .deal-item .emoji { font-size: 1.2rem; width: 28px; text-align: center; flex-shrink: 0; }

        .deal-separator {
            display: flex; flex-direction: column;
            align-items: center; gap: 0.5rem;
        }

        .deal-separator .line {
            width: 1px; height: 30px;
            background: rgba(255,255,255,0.1);
        }

        .deal-separator .icon {
            width: 44px; height: 44px; border-radius: 50%;
            background: var(--rouge);
            display: flex; align-items: center; justify-content: center;
            font-size: 1.2rem;
            box-shadow: 0 4px 15px rgba(230,57,70,0.3);
        }

        .villes-row {
            display: flex; align-items: center; gap: 0.8rem;
            margin-top: 1.5rem; padding-top: 1.5rem;
            border-top: 1px solid rgba(255,255,255,0.05);
        }

        .villes-label {
            font-size: 0.6rem; font-weight: 700;
            text-transform: uppercase; letter-spacing: 2px;
            color: var(--text-muted); flex-shrink: 0;
        }

        .ville-tag {
            font-size: 0.7rem; font-weight: 600;
            color: rgba(255,255,255,0.6);
            background: rgba(255,255,255,0.05);
            padding: 0.3rem 0.7rem; border-radius: 6px;
            border: 1px solid rgba(255,255,255,0.06);
        }

        /* Formulaire candidature */
        .candidature-form-area {
            background: rgba(0,0,0,0.2);
            padding: 2.5rem 3rem;
            border-top: 1px solid rgba(255,255,255,0.05);
        }

        .form-row {
            display: grid; grid-template-columns: 1fr 1fr;
            gap: 1rem; margin-bottom: 1rem;
        }

        .form-group { display: flex; flex-direction: column; gap: 0.3rem; }
        .form-group.full { grid-column: 1 / -1; }

        .form-group label {
            font-size: 0.75rem; font-weight: 600;
            color: var(--text-secondary);
        }

        .form-group input,
        .form-group select,
        .form-group textarea {
            background: rgba(255,255,255,0.05);
            border: 2px solid rgba(255,255,255,0.12);
            border-radius: 10px;
            padding: 0.75rem 1rem;
            color: var(--text-primary);
            font-family: 'Source Sans 3', sans-serif;
            font-size: 0.9rem;
            transition: all 0.2s;
            outline: none;
        }

        .form-group input:focus,
        .form-group select:focus,
        .form-group textarea:focus {
            border-color: var(--rouge);
            box-shadow: 0 0 0 3px rgba(230,57,70,0.15);
        }

        .form-group input::placeholder,
        .form-group textarea::placeholder {
            color: rgba(255,255,255,0.25);
        }

        .form-group textarea { resize: vertical; min-height: 90px; }

        .form-check {
            display: flex; gap: 0.6rem;
            align-items: flex-start; margin: 1.2rem 0;
        }

        .form-check input[type="checkbox"] {
            width: 18px; height: 18px; margin-top: 2px;
            accent-color: var(--rouge); flex-shrink: 0; cursor: pointer;
        }

        .form-check label {
            font-size: 0.8rem; color: var(--text-muted);
            line-height: 1.5; cursor: pointer;
        }

        .form-submit { display: flex; align-items: center; gap: 1.5rem; }

        .btn-submit {
            display: inline-flex; align-items: center; gap: 0.5rem;
            background: var(--rouge); color: #fff; border: none;
            padding: 0.9rem 2rem; border-radius: 8px;
            font-family: 'Montserrat', sans-serif;
            font-size: 0.85rem; font-weight: 700;
            text-transform: uppercase; letter-spacing: 1px;
            cursor: pointer; transition: all 0.3s;
            box-shadow: 0 4px 15px rgba(230,57,70,0.3);
        }

        .btn-submit:hover {
            background: #c81e32;
            transform: translateY(-2px);
            box-shadow: 0 6px 20px rgba(230,57,70,0.4);
        }

        .form-note { font-size: 0.7rem; color: var(--text-muted); line-height: 1.5; }

        /* Titre formulaire candidature */
        .cand-form-title {
            font-family: 'Montserrat', sans-serif;
            font-size: 1.2rem;
            font-weight: 700;
            color: var(--text-primary);
            margin-bottom: 1.5rem;
        }

        .cand-section-label {
            font-size: 0.75rem;
            font-weight: 700;
            color: var(--text-secondary);
            margin-bottom: 0.7rem;
            margin-top: 0.5rem;
        }

        /* Toggles équipements */
        .equip-toggles {
            display: flex;
            gap: 0.7rem;
            flex-wrap: wrap;
            margin-bottom: 1.5rem;
        }

        .equip-toggle {
            display: flex;
            align-items: center;
            gap: 0.5rem;
            padding: 0.65rem 1rem;
            background: rgba(255,255,255,0.04);
            border: 2px solid rgba(255,255,255,0.12);
            border-radius: 10px;
            cursor: pointer;
            transition: all 0.2s;
            user-select: none;
            font-size: 0.85rem;
            color: var(--text-secondary);
        }

        .equip-toggle:hover { border-color: rgba(230,57,70,0.4); }

        .equip-toggle.checked {
            background: rgba(230,57,70,0.1);
            border-color: var(--rouge);
            color: var(--text-primary);
        }

        .equip-check {
            width: 20px; height: 20px;
            border: 2px solid rgba(255,255,255,0.2);
            border-radius: 5px;
            display: flex; align-items: center; justify-content: center;
            transition: all 0.2s;
            background: rgba(255,255,255,0.05);
            flex-shrink: 0;
        }

        .equip-toggle.checked .equip-check {
            background: var(--rouge);
            border-color: var(--rouge);
        }

        .equip-check svg { opacity: 0; stroke: #fff; transition: opacity 0.2s; }
        .equip-toggle.checked .equip-check svg { opacity: 1; }
        .equip-emoji { font-size: 1.1rem; }

        /* Boutons ville */
        .cand-city-btns {
            display: flex;
            gap: 0.7rem;
            flex-wrap: wrap;
            margin-bottom: 0.8rem;
        }

        .cand-city {
            padding: 0.6rem 1.2rem;
            background: rgba(255,255,255,0.04);
            border: 2px solid rgba(255,255,255,0.12);
            border-radius: 10px;
            font-size: 0.85rem;
            font-weight: 600;
            color: var(--text-secondary);
            cursor: pointer;
            transition: all 0.2s;
            font-family: 'Montserrat', sans-serif;
        }

        .cand-city:hover { border-color: rgba(230,57,70,0.4); }

        .cand-city.selected {
            background: var(--rouge);
            border-color: var(--rouge);
            color: #fff;
        }

        .cand-city-other {
            background: transparent;
            border-style: dashed;
            color: var(--text-muted);
        }

        .cand-city-other:hover { color: var(--rouge); border-color: var(--rouge); }

        .cand-other-city {
            display: none;
            margin-top: 0.6rem;
            margin-bottom: 1rem;
        }

        .cand-other-city.visible { display: block; }

        .cand-other-city input {
            max-width: 300px;
            width: 100%;
            padding: 0.65rem 1rem;
            font-size: 0.85rem;
            background: rgba(255,255,255,0.05);
            border: 2px solid rgba(255,255,255,0.12);
            border-radius: 10px;
            color: var(--text-primary);
            font-family: 'Montserrat', sans-serif;
            outline: none;
            transition: border-color 0.2s;
        }

        .cand-other-city input:focus { border-color: var(--rouge); }
        .cand-other-city input::placeholder { color: rgba(255,255,255,0.25); }

        /* Bouton submit pill */
        .btn-submit-pill {
            border-radius: 50px;
            padding: 0.9rem 2rem;
        }

        /* Deal highlight — blanc en dark, rouge en light */
        .deal-highlight { color: #fff; font-weight: 700; }

        @media (prefers-color-scheme: light) {
            :root:not([data-theme="dark"]) .deal-highlight {
                color: var(--rouge) !important;
            }
        }
        :root[data-theme="light"] .deal-highlight {
            color: var(--rouge) !important;
        }

        /* ============================================
           PARCOURS — Overrides mode clair
           ============================================ */
        @media (prefers-color-scheme: light) {
            :root:not([data-theme="dark"]) .parcours-num {
                background: #fff;
                box-shadow: 0 0 0 8px #fff, 0 0 15px rgba(230,57,70,0.08);
            }
            :root:not([data-theme="dark"]) .parcours-section::before {
                background: linear-gradient(90deg, transparent, rgba(0,0,0,0.06), transparent);
            }
        }
        :root[data-theme="light"] .parcours-num {
            background: #fff;
            box-shadow: 0 0 0 8px #fff, 0 0 15px rgba(230,57,70,0.08);
        }
        :root[data-theme="light"] .parcours-section::before {
            background: linear-gradient(90deg, transparent, rgba(0,0,0,0.06), transparent);
        }

        /* ============================================
           CANDIDATURE — Overrides mode clair
           ============================================ */
        @media (prefers-color-scheme: light) {
            :root:not([data-theme="dark"]) .candidature-form-area {
                background: #ffffff;
                border-top: 1px solid rgba(0,0,0,0.08);
            }
            :root:not([data-theme="dark"]) .deal-separator .line {
                background: rgba(0,0,0,0.1);
            }
            :root:not([data-theme="dark"]) .form-group input,
            :root:not([data-theme="dark"]) .form-group select,
            :root:not([data-theme="dark"]) .form-group textarea {
                background: #f7f7f7;
                border-color: #d0d0d0;
            }
            :root:not([data-theme="dark"]) .form-group input::placeholder,
            :root:not([data-theme="dark"]) .form-group textarea::placeholder {
                color: #aaa;
            }
            :root:not([data-theme="dark"]) .equip-toggle {
                background: #f5f5f5;
                border-color: #d0d0d0;
            }
            :root:not([data-theme="dark"]) .equip-toggle.checked {
                background: var(--accent-light, #fee2e4);
                border-color: var(--rouge);
            }
            :root:not([data-theme="dark"]) .equip-check {
                border-color: #bbb;
                background: #fff;
            }
            :root:not([data-theme="dark"]) .equip-toggle.checked .equip-check {
                background: var(--rouge);
                border-color: var(--rouge);
            }
            :root:not([data-theme="dark"]) .cand-city {
                background: #f5f5f5;
                border-color: #d0d0d0;
            }
            :root:not([data-theme="dark"]) .cand-city-other {
                background: transparent;
                border-color: #ccc;
            }
            :root:not([data-theme="dark"]) .cand-other-city input {
                background: #f7f7f7;
                border-color: #d0d0d0;
            }
            :root:not([data-theme="dark"]) .cand-other-city input::placeholder {
                color: #aaa;
            }
        }

        :root[data-theme="light"] .candidature-form-area {
            background: #ffffff;
            border-top: 1px solid rgba(0,0,0,0.08);
        }
        :root[data-theme="light"] .deal-separator .line {
            background: rgba(0,0,0,0.1);
        }
        :root[data-theme="light"] .form-group input,
        :root[data-theme="light"] .form-group select,
        :root[data-theme="light"] .form-group textarea {
            background: #f7f7f7;
            border-color: #d0d0d0;
        }
        :root[data-theme="light"] .form-group input::placeholder,
        :root[data-theme="light"] .form-group textarea::placeholder {
            color: #aaa;
        }
        :root[data-theme="light"] .equip-toggle {
            background: #f5f5f5;
            border-color: #d0d0d0;
        }
        :root[data-theme="light"] .equip-toggle.checked {
            background: #fee2e4;
            border-color: var(--rouge);
        }
        :root[data-theme="light"] .equip-check {
            border-color: #bbb;
            background: #fff;
        }
        :root[data-theme="light"] .equip-toggle.checked .equip-check {
            background: var(--rouge);
            border-color: var(--rouge);
        }
        :root[data-theme="light"] .cand-city {
            background: #f5f5f5;
            border-color: #d0d0d0;
        }
        :root[data-theme="light"] .cand-city-other {
            background: transparent;
            border-color: #ccc;
        }
        :root[data-theme="light"] .cand-other-city input {
            background: #f7f7f7;
            border-color: #d0d0d0;
        }
        :root[data-theme="light"] .cand-other-city input::placeholder {
            color: #aaa;
        }

        /* Bloc Partenaire Qualiopi */
        .partner-qualiopi {
            background: var(--bg-secondary);
            padding: 3rem 0;
        }
        
        .qualiopi-block {
            display: flex;
            align-items: center;
            gap: 2rem;
            background: linear-gradient(135deg, rgba(230, 57, 70, 0.1) 0%, rgba(230, 57, 70, 0.05) 100%);
            border: 1px solid rgba(230, 57, 70, 0.3);
            border-radius: 12px;
            padding: 2rem;
        }
        
        .qualiopi-badge {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            min-width: 100px;
            padding: 1rem;
            background: var(--rouge);
            border-radius: 8px;
            text-align: center;
        }
        
        .qualiopi-icon {
            font-size: 2rem;
            color: #fff;
            margin-bottom: 0.25rem;
        }
        
        .qualiopi-label {
            font-family: 'Montserrat', sans-serif;
            font-size: 0.85rem;
            font-weight: 700;
            color: #fff;
            letter-spacing: 1px;
        }
        
        .qualiopi-content h3 {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 1.5rem;
            letter-spacing: 1px;
            color: var(--text-primary);
            margin-bottom: 0.75rem;
        }
        
        .qualiopi-content p {
            color: var(--text-secondary);
            font-size: 1.05rem;
            line-height: 1.6;
            margin-bottom: 1rem;
        }
        
        .qualiopi-content a {
            color: var(--rouge);
            text-decoration: none;
        }
        
        .qualiopi-content a:hover {
            text-decoration: underline;
        }
        
        .qualiopi-link {
            display: inline-block;
            font-weight: 600;
            font-size: 0.95rem;
        }

        /* ============================================
           EXPERTISE SEARCH
           ============================================ */
        .expertise-search {
            margin-bottom: 2rem;
        }
        
        .search-wrapper {
            position: relative;
            max-width: 500px;
        }
        
        .search-wrapper .search-icon {
            position: absolute;
            left: 1rem;
            top: 50%;
            transform: translateY(-50%);
            font-size: 1.2rem;
            opacity: 0.5;
        }
        
        .search-wrapper input {
            width: 100%;
            padding: 1rem 3rem 1rem 3rem;
            background: var(--bg-secondary);
            border: 1px solid var(--border-color);
            border-radius: 8px;
            color: var(--text-primary);
            font-size: 1rem;
            transition: border-color 0.3s ease;
        }
        
        .search-wrapper input:focus {
            outline: none;
            border-color: var(--rouge);
        }
        
        .search-wrapper input::placeholder {
            color: var(--text-muted);
        }
        
        .search-clear {
            position: absolute;
            right: 1rem;
            top: 50%;
            transform: translateY(-50%);
            background: none;
            border: none;
            color: var(--text-muted);
            font-size: 1.2rem;
            cursor: pointer;
            padding: 0.25rem;
            line-height: 1;
        }
        
        .search-clear:hover {
            color: var(--rouge);
        }
        
        .search-results-info {
            margin-top: 0.75rem;
            font-size: 0.9rem;
            color: var(--gris);
        }
        
        .search-results-info strong {
            color: var(--rouge);
        }

        /* Expertise Filters */
        .expertise-filters {
            display: flex;
            gap: 1rem;
            margin-bottom: 3rem;
            flex-wrap: wrap;
        }

        .filter-btn {
            padding: 0.8rem 1.5rem;
            background: var(--bg-card);
            color: var(--text-primary);
            border: 2px solid var(--border-color);
            border-radius: 6px;
            font-weight: 600;
            cursor: pointer;
            transition: all 0.3s ease;
            font-size: 0.95rem;
        }

        .filter-btn:hover {
            border-color: var(--rouge);
            color: var(--rouge);
        }

        .filter-btn.active {
            background: var(--rouge);
            color: #fff;
            border-color: var(--rouge);
        }

        /* ============================================
           FOOTER COMPACT - Fond sombre, texte blanc
           ============================================ */
        footer {
            background: #0a0a0a;
            padding: 0;
        }

        .footer-main {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 2rem;
            max-width: 1200px;
            margin: 0 auto;
            padding: 2.5rem 2rem;
            border-bottom: 1px solid rgba(255,255,255,0.08);
        }

        .footer-main h4 {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 1.25rem;
            letter-spacing: 2px;
            margin-bottom: 1rem;
            color: #c81e32;
        }

        .footer-main ul {
            list-style: none;
            padding: 0;
            margin: 0;
            display: flex;
            flex-wrap: wrap;
            gap: 0.4rem 1.5rem;
        }

        .footer-main a {
            color: rgba(255,255,255,0.6);
            font-size: 1.15rem;
            text-decoration: none;
            transition: color 0.2s;
        }

        .footer-main a:hover {
            color: #fff;
        }

        .footer-bottom {
            max-width: 1200px;
            margin: 0 auto;
            padding: 1.5rem 2rem;
            display: flex;
            justify-content: space-between;
            align-items: center;
            flex-wrap: wrap;
            gap: 1rem;
        }

        .footer-brand {
            display: flex;
            align-items: center;
            gap: 2rem;
        }

        .footer-brand img {
            height: 28px;
            opacity: 0.8;
        }

        .footer-contact {
            display: flex;
            align-items: center;
            gap: 2rem;
            color: rgba(255,255,255,0.5);
            font-size: 1.15rem;
        }

        .footer-contact a {
            color: rgba(255,255,255,0.5);
            text-decoration: none;
            transition: color 0.2s;
        }

        .footer-contact a:hover {
            color: #c81e32;
        }

        .footer-legal {
            display: flex;
            align-items: center;
            gap: 1.5rem;
            font-size: 1.25rem;
            color: rgba(255,255,255,0.35);
        }

        .footer-legal a {
            color: rgba(255,255,255,0.35);
            text-decoration: none;
            transition: color 0.2s;
        }

        .footer-legal a:hover {
            color: #c81e32;
        }

        .social-links {
            display: flex;
            gap: 0.4rem;
        }

        .social-links a {
            width: 32px;
            height: 32px;
            background: rgba(255,255,255,0.06);
            border-radius: 4px;
            display: flex;
            align-items: center;
            justify-content: center;
            color: rgba(255,255,255,0.6);
            font-size: 0.75rem;
            font-weight: 600;
            text-decoration: none;
            transition: all 0.2s;
        }

        .social-links a:hover {
            background: #c81e32;
            color: #fff;
        }

        /* ============================================
           RESPONSIVE - TABLETTE (1024px et moins)
           ============================================ */
        @media (max-width: 1024px) {
            /* Stats */
            .stats-container { 
                grid-template-columns: repeat(2, 1fr); 
            }
            
            /* Vidéos vedette */
            .videos-vedette-grid { 
                grid-template-columns: repeat(2, 1fr); 
            }
            
            /* Approche */
            .approach-grid { 
                grid-template-columns: 1fr; 
            }
            
            /* Engagements */
            .engagements-grid { 
                grid-template-columns: repeat(2, 1fr); 
            }
            
            /* Video exemples */
            .video-exemple-row { 
                grid-template-columns: 1fr !important; 
                gap: 2rem !important;
            }
            
            /* Arsenal */
            .arsenal-grid {
                grid-template-columns: repeat(3, 1fr);
            }
            
            /* Footer */
            .footer-bottom { 
                flex-direction: column; 
                gap: 1.5rem; 
                text-align: center; 
            }
            .footer-contact { 
                flex-wrap: wrap; 
                justify-content: center; 
                gap: 1rem; 
            }
        }

        /* ============================================
           RESPONSIVE - MOBILE (768px et moins)
           ============================================ */
        @media (max-width: 768px) {
            /* --- BOUTON RETOUR FLOTTANT --- */
            .floating-back-btn {
                bottom: 1rem;
                left: 1rem;
                padding: 0.6rem 1rem;
                font-size: 0.85rem;
            }

            /* --- BOUTONS PARTAGE --- */
            .share-buttons {
                justify-content: center;
            }

            .card-share-btn {
                opacity: 1;
            }
            
            /* --- NAVIGATION --- */
            #desktopMenu {
                display: none !important;
            }
            
            #menuBtn {
                display: flex !important;
            }
            
            nav {
                height: 60px;
                padding: 0 1rem;
            }
            
            /* --- HERO - 50vh --- */
            .hero {
                height: auto;
                min-height: 50vh;
                padding: 70px 1rem 1.5rem;
            }
            
            .hero .video-bg-desktop {
                display: none;
            }
            
            .hero .video-bg-mobile {
                display: block;
            }
            
            .hero-content {
                padding: 1rem;
            }
            
            .hero h1 {
                font-size: 2rem;
                letter-spacing: 2px;
                line-height: 1.15;
            }
            
            .hero-subtitle {
                font-size: 1rem;
                margin-bottom: 1rem;
            }
            
            .hero-stats {
                font-size: 0.7rem;
                letter-spacing: 1.5px;
                padding: 0.5rem 1rem;
                margin-bottom: 1rem;
            }
            
            /* Hero CTA mobile */
            .hero-cta {
                flex-direction: column;
                gap: 0.75rem;
                margin-top: 1.5rem;
            }

            /* CTA Formation hero mobile */
            .hero-formation-cta {
                bottom: 12px;
                right: 12px;
                left: 12px;
            }

            .hero-formation-cta a {
                max-width: none;
            }

            .hero-formation-cta .hf-title {
                font-size: 0.85rem;
            }

            .hero-formation-cta .hf-date {
                font-size: 1.1rem;
            }
            
            .btn-cta-primary,
            .btn-cta-secondary {
                padding: 0.9rem 1.5rem;
                font-size: 0.95rem;
                width: 100%;
                text-align: center;
            }
            
            /* --- TEAM INTRO - VERSION COMPACTE MOBILE --- */
            .team-intro {
                display: block;
                padding: 2rem 1rem;
            }
            
            .team-intro h2,
            .team-intro .subtitle,
            .team-intro .team-baseline {
                display: none;
            }
            
            .team-intro-grid {
                display: flex;
                justify-content: center;
                gap: 1.5rem;
            }
            
            .team-member-intro {
                text-align: center;
            }
            
            .team-member-intro .photo {
                width: 70px;
                height: 70px;
                margin-bottom: 0.5rem;
            }
            
            .team-member-intro h4 {
                font-size: 0.95rem;
                margin-bottom: 0;
            }
            
            .team-member-intro .role,
            .team-member-intro .bio,
            .team-member-intro .languages {
                display: none;
            }
            
            /* Texte sous l'équipe */
            .team-intro::after {
                content: "3 réalisateurs passionnés, 20 ans d'expérience";
                display: block;
                text-align: center;
                color: var(--text-muted);
                font-size: 0.9rem;
                margin-top: 1rem;
            }
            
            /* --- STATS --- */
            .stats-section {
                padding: 2rem 1rem;
            }
            
            .stats-container {
                grid-template-columns: repeat(2, 1fr);
                gap: 1rem;
            }
            
            .stat-item h3 {
                font-size: 1.8rem;
            }
            
            .stat-item p {
                font-size: 0.8rem;
            }
            
            /* --- SECTIONS GÉNÉRALES --- */
            .section {
                padding: 2.5rem 1rem;
            }
            
            .section-header {
                margin-bottom: 1.5rem;
            }
            
            .section-header h2 {
                font-size: 1.4rem;
            }
            
            .section-header p {
                font-size: 0.95rem;
            }
            
            /* --- SECTEURS - 4 CARDS SEULEMENT --- */
            .secteurs-grid {
                grid-template-columns: repeat(2, 1fr);
                gap: 0.75rem;
            }
            
            /* Masquer BTP, Agriculture, Événementiel sur mobile */
            .secteur-item:nth-child(n+5) {
                display: none;
            }
            
            /* Réinitialiser les tailles spéciales */
            .secteur-item.large,
            .secteur-item.tall {
                grid-column: span 1;
                grid-row: span 1;
            }
            
            .secteur-card {
                aspect-ratio: 16/9;
            }
            
            /* Afficher le lien "Voir tous les secteurs" sur mobile */
            .secteurs-voir-tous {
                display: block !important;
            }
            
            .secteur-card h3 {
                font-size: 1rem;
            }
            
            /* Titres secteurs - ajustement mobile */
            .secteur-item-content {
                padding: 0.75rem;
            }
            
            .secteur-item-icon {
                font-size: 1.5rem;
                margin-bottom: 0.25rem;
            }
            
            .secteur-item-content h3 {
                font-size: 0.9rem;
                letter-spacing: 0.5px;
                line-height: 1.2;
                word-wrap: break-word;
            }
            
            .secteur-item.large .secteur-item-content h3,
            .secteur-item.tall .secteur-item-content h3 {
                font-size: 0.9rem;
            }
            
            .secteur-item-arrow {
                width: 28px;
                height: 28px;
                font-size: 0.9rem;
            }
            
            /* --- VIDÉOS VEDETTE - 1 SEULE SUR MOBILE --- */
            .videos-vedette-grid {
                grid-template-columns: 1fr;
                gap: 1.5rem;
            }
            
            .video-vedette-card:nth-child(n+2) {
                display: none;
            }
            
            .video-vedette-card h4 {
                font-size: 1.1rem;
            }
            
            /* --- APPROCHE - ÉTAPES UNIQUEMENT --- */
            .approach {
                padding: 2.5rem 1rem;
            }
            
            .approach-grid {
                gap: 0;
            }
            
            /* Masquer le texte intro */
            .approach-text {
                display: none;
            }
            
            /* Ajouter un titre avant les étapes */
            .approach-steps::before {
                content: "NOTRE APPROCHE";
                display: block;
                font-family: 'Bebas Neue', sans-serif;
                font-size: 1.4rem;
                letter-spacing: 2px;
                color: var(--text-primary);
                text-align: center;
                margin-bottom: 1.5rem;
            }
            
            .approach-steps {
                width: 100%;
            }
            
            .step {
                padding: 1rem;
                margin-bottom: 0.75rem;
                background: var(--noir-light);
                border-radius: 8px;
            }
            
            .step-number {
                width: 32px;
                height: 32px;
                font-size: 1rem;
            }
            
            .step-content h4 {
                font-size: 1rem;
            }
            
            .step-content p {
                font-size: 0.85rem;
            }
            
            /* --- ENGAGEMENTS - MASQUÉ SUR MOBILE --- */
            .engagements-section {
                display: none;
            }
            
            /* --- ZONE INTERVENTION - MASQUÉ SUR MOBILE --- */
            .zone-section,
            .zone-intervention {
                display: none;
            }
            
            /* --- CLIENTS - MASQUÉ SUR MOBILE --- */
            .clients {
                display: none;
            }
            
            /* --- CTA SECTION --- */
            .cta-section {
                padding: 2.5rem 1.5rem;
            }
            
            .cta-section h2 {
                font-size: 1.6rem;
            }
            
            .cta-section p {
                font-size: 0.95rem;
            }
            
            /* --- NAV SECTEURS - AMÉLIORÉ --- */
            .nav-secteurs {
                padding: 0.75rem 0.5rem;
                gap: 0.5rem;
                background: var(--bg-secondary);
            }
            
            .nav-secteurs .arrow-btn {
                display: none; /* Masquer les flèches sur mobile */
            }
            
            .nav-secteurs .sectors-list {
                gap: 0.4rem;
                overflow-x: auto;
                -webkit-overflow-scrolling: touch;
                scrollbar-width: none;
                padding: 0.25rem 0;
                width: 100%;
                justify-content: flex-start;
            }
            
            .nav-secteurs .sectors-list::-webkit-scrollbar {
                display: none;
            }
            
            .nav-secteurs .sectors-list a {
                font-size: 0.7rem;
                padding: 0.6rem 0.8rem;
                white-space: nowrap;
                border-radius: 20px;
                background: var(--noir-light);
                flex-shrink: 0;
            }
            
            .nav-secteurs .sectors-list a.active,
            .nav-secteurs .sectors-list a:hover {
                background: var(--rouge);
            }
            
            /* --- VIDEO EXEMPLES (pages secteurs) --- */
            .video-exemple-row {
                grid-template-columns: 1fr !important;
                gap: 1rem !important;
                padding: 0.75rem !important;
                margin-bottom: 1rem !important;
            }
            
            /* Ajuster les marges des pages secteurs */
            #page-industrie .container,
            #page-pharma .container,
            #page-btp .container,
            #page-logistique .container,
            #page-agriculture .container,
            #page-evenementiel .container,
            #page-recrutement .container {
                padding: 0 1rem !important;
            }
            
            /* Padding videos-section sur mobile */
            #page-industrie .videos-section,
            #page-pharma .videos-section,
            #page-btp .videos-section,
            #page-logistique .videos-section,
            #page-agriculture .videos-section,
            #page-evenementiel .videos-section,
            #page-recrutement .videos-section {
                padding: 2rem 1rem !important;
            }
            
            /* S'assurer que les vidéos sont visibles */
            .video-exemple-row .video-card {
                margin: 0 !important;
                width: 100% !important;
            }
            
            .video-exemple-row .video-card > div[style*="padding:56.25%"] {
                border-radius: 8px;
                overflow: hidden;
            }
            
            /* Masquer les vidéos après la première sur mobile pour les PAGES SECTEURS (sauf si expanded) */
            #page-industrie:not(.videos-expanded) .video-exemple-row ~ .video-exemple-row,
            #page-pharma:not(.videos-expanded) .video-exemple-row ~ .video-exemple-row,
            #page-btp:not(.videos-expanded) .video-exemple-row ~ .video-exemple-row,
            #page-logistique:not(.videos-expanded) .video-exemple-row ~ .video-exemple-row,
            #page-agriculture:not(.videos-expanded) .video-exemple-row ~ .video-exemple-row,
            #page-evenementiel:not(.videos-expanded) .video-exemple-row ~ .video-exemple-row,
            #page-recrutement:not(.videos-expanded) .video-exemple-row ~ .video-exemple-row {
                display: none !important;
            }
            
            /* Bouton voir plus de vidéos */
            .btn-voir-plus-videos {
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 0.5rem;
                width: 100%;
                padding: 1rem;
                margin: 1rem 0 2rem;
                background: transparent;
                border: 2px solid var(--rouge);
                color: var(--rouge);
                font-family: 'Montserrat', sans-serif;
                font-size: 0.95rem;
                font-weight: 600;
                border-radius: 8px;
                cursor: pointer;
                transition: all 0.3s ease;
            }
            
            .btn-voir-plus-videos:hover {
                background: var(--rouge);
                color: #fff;
            }
            
            .btn-voir-plus-videos .arrow {
                transition: transform 0.3s ease;
            }
            
            .videos-expanded .btn-voir-plus-videos {
                display: none;
            }
            
            .video-exemple-row h3 {
                font-size: 1.3rem !important;
                margin: 0.3rem 0 0.5rem !important;
            }
            
            /* Masquer descriptions et tags sur mobile */
            .video-exemple-row p {
                display: none !important;
            }
            
            .video-exemple-row > div > div[style*="display: flex"][style*="gap"] {
                display: none !important;
            }
            
            /* Garder le type de vidéo visible mais compact */
            .video-exemple-row span[style*="color: var(--rouge)"] {
                font-size: 0.85rem !important;
            }
            
            /* Lazy loading vidéos avec vignettes */
            .lazy-placeholder {
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                cursor: pointer;
                display: flex;
                align-items: center;
                justify-content: center;
                background: #000;
                border-radius: 8px;
                overflow: hidden;
            }
            
            .lazy-thumb {
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                object-fit: cover;
            }
            
            .lazy-play {
                position: relative;
                z-index: 2;
                width: 60px;
                height: 60px;
                background: rgba(230, 57, 70, 0.9);
                border-radius: 50%;
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 1.5rem;
                color: #fff;
                box-shadow: 0 4px 20px rgba(0,0,0,0.4);
            }
            
            .video-lazy {
                position: relative;
            }
            
            /* --- SECTION TEXTE + REFS (pages secteurs) --- */
            .section-text-refs-f {
                display: block !important;
            }
            
            /* Masquer sidebar références sur mobile */
            .mini-refs {
                display: none !important;
            }
            
            /* Texte principal compact */
            .main-text.text-expandable {
                padding: 0 !important;
            }
            
            .main-text h2 {
                font-size: 1.3rem !important;
                margin-bottom: 1rem !important;
            }
            
            /* Masquer le bouton "Lire la suite" sur mobile */
            .btn-expand {
                display: none !important;
            }
            
            /* Afficher seulement le preview */
            .text-expandable .text-full {
                display: none !important;
            }
            
            .text-expandable .text-preview {
                display: block !important;
            }
            
            .text-preview p {
                font-size: 0.95rem !important;
                margin-bottom: 0.75rem !important;
            }
            
            /* --- PAGE HERO SECTEURS - COMPACT --- */
            .page-hero {
                height: auto;
                min-height: 40vh;
                padding: 70px 1rem 1.5rem;
            }
            
            .page-hero .video-bg-desktop {
                display: none;
            }
            
            /* Afficher image mobile */
            .page-hero .video-bg-mobile {
                display: block;
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                object-fit: cover;
                z-index: 0;
            }
            
            /* Masquer breadcrumb sur mobile */
            .page-hero .breadcrumb {
                display: none;
            }
            
            /* Masquer accroche paragraphe sur mobile */
            .page-hero-content > p {
                display: none;
            }
            
            /* Ligne rouge plus petite */
            .page-hero-content > div[style*="width: 80px"] {
                width: 50px !important;
                height: 3px !important;
                margin-bottom: 1rem !important;
            }
            
            .page-hero h2 {
                font-size: 2.2rem !important;
                margin-bottom: 0.5rem !important;
            }
            
            .page-hero h2 span {
                font-size: 0.95rem !important;
                letter-spacing: 3px !important;
            }
            
            /* --- ARSENAL TECHNIQUE - 6 ITEMS SUR MOBILE --- */
            .arsenal-section {
                padding: 2rem 1rem;
            }
            
            .arsenal-header h3 {
                font-size: 1.5rem;
            }
            
            /* Masquer le manifeste sur mobile */
            .arsenal-manifeste {
                display: none;
            }
            
            /* Garder le highlight visible */
            .arsenal-highlight {
                padding: 1rem;
                margin-bottom: 1.5rem;
            }
            
            .arsenal-highlight strong {
                font-size: 0.95rem;
            }
            
            .arsenal-highlight p {
                font-size: 0.85rem;
            }
            
            .arsenal-grid {
                grid-template-columns: repeat(2, 1fr);
                gap: 0.75rem;
            }
            
            /* Masquer les items 7 à 11 sur mobile */
            .arsenal-item:nth-child(n+7) {
                display: none;
            }
            
            .arsenal-item {
                padding: 1rem;
            }
            
            .arsenal-item-title {
                font-size: 0.85rem;
            }
            
            .arsenal-item-desc {
                font-size: 0.8rem;
            }
            
            /* Masquer le lien "En savoir plus" sur mobile */
            .arsenal-item span[style*="color: var(--rouge)"] {
                display: none !important;
            }
            
            /* Indicateur "..." pour Arsenal */
            .arsenal-more {
                display: flex !important;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                padding: 1.5rem;
                background: var(--noir-light);
                border-radius: 8px;
                border: 2px dashed rgba(255,255,255,0.2);
                transition: all 0.3s ease;
            }
            
            .arsenal-more:hover {
                border-color: var(--rouge);
                background: rgba(230, 57, 70, 0.1);
            }
            
            .arsenal-more-dots {
                font-size: 1.5rem;
                color: var(--rouge);
                letter-spacing: 3px;
                margin-bottom: 0.5rem;
            }
            
            .arsenal-more-text {
                font-size: 0.8rem;
                color: var(--text-muted);
                text-transform: uppercase;
                letter-spacing: 1px;
            }
            
            /* --- PAGE SERVICES - TOUTES PRESTATIONS VISIBLES --- */
            /* Les prestations restent toutes visibles sur mobile */
            
            /* Garder les 2 services (JPG Manager + Formation) visibles */
            .services-accompagnement .video-exemple-row {
                display: grid !important;
            }
            
            /* --- PAGE FORMATION --- */
            #page-formation .approach-grid {
                display: block;
            }
            
            /* Masquer la vidéo sur mobile */
            #page-formation .formation-video-desktop {
                display: none;
            }
            
            /* Marges identiques à la page d'accueil */
            #page-formation .videos-section {
                padding: 2rem 1rem !important;
            }
            
            #page-formation .container {
                padding: 0 !important;
            }
            
            /* Bandeau Prochaines Sessions mobile */
            .prochaines-sessions-banner {
                padding: 1.2rem 0;
            }

            .banner-sessions-header {
                flex-direction: column;
                align-items: flex-start;
                gap: 0.8rem;
            }

            .banner-sessions-header h3 {
                font-size: 1.1rem;
            }

            .session-card-agenda {
                min-width: 230px;
            }

            .session-day-block .day {
                font-size: 1.3rem;
            }

            .session-card-info h4 {
                font-size: 0.8rem;
            }

            .btn-inscription-banner {
                align-self: flex-start;
                padding: 0.6rem 1.1rem;
                font-size: 0.68rem;
            }
            
            /* Texte philosophie */
            #page-formation .approach-text {
                padding: 0;
            }
            
            #page-formation .approach-text h2 {
                font-size: 1.3rem;
                margin-bottom: 1rem;
            }
            
            #page-formation .approach-text p {
                font-size: 0.95rem;
                margin-bottom: 0.75rem;
            }
            
            #page-formation .approach-quote {
                font-size: 1rem;
                padding: 1rem;
                margin: 1rem 0;
            }
            
            /* Section header */
            #page-formation .section-header {
                margin-top: 2rem !important;
            }
            
            /* Cards formation */
            .formation-grid {
                grid-template-columns: 1fr !important;
                gap: 1rem !important;
            }
            
            .formation-card {
                padding: 1.25rem !important;
            }
            
            .formation-card h3 {
                font-size: 1.15rem !important;
                margin-bottom: 0.75rem !important;
            }
            
            .formation-card h4 {
                font-size: 0.95rem !important;
                margin-top: 1rem !important;
            }
            
            .formation-card p {
                font-size: 0.9rem !important;
            }
            
            .formation-card ul {
                margin-top: 0.5rem !important;
            }
            
            .formation-card li {
                font-size: 0.9rem !important;
                padding: 0.25rem 0 !important;
            }
            
            /* Tag visible */
            .formation-tag {
                font-size: 0.7rem !important;
                padding: 0.3rem 0.6rem !important;
            }

            /* Piliers philosophie mobile */
            .philo-pillars {
                grid-template-columns: 1fr;
                gap: 1rem;
            }

            .pillar {
                display: flex;
                align-items: center;
                gap: 1rem;
                text-align: left;
                padding: 1rem;
            }

            .pillar-icon { margin-bottom: 0; font-size: 1.5rem; }

            /* Candidature mobile */
            .candidature-top { padding: 2rem 1.5rem 1.5rem; }
            .candidature-form-area { padding: 1.5rem; }
            .candidature-top h3 { font-size: 1.6rem; }

            .deal-grid {
                grid-template-columns: 1fr;
                gap: 1.5rem;
            }

            .deal-separator {
                flex-direction: row;
                justify-content: center;
            }

            .deal-separator .line {
                width: 30px;
                height: 1px;
            }

            .form-row { grid-template-columns: 1fr; }
            .equip-toggles { flex-direction: column; }
            .cand-city-btns { flex-direction: column; }

            .form-submit {
                flex-direction: column;
                align-items: flex-start;
            }

            /* Bloc Qualiopi mobile */
            .partner-qualiopi {
                padding: 2rem 1rem;
            }
            
            .partner-qualiopi .container {
                padding: 0 !important;
            }
            
            .qualiopi-block {
                flex-direction: column;
                text-align: center;
                padding: 1.5rem;
                gap: 1.25rem;
            }
            
            .qualiopi-badge {
                min-width: auto;
                padding: 0.75rem 1.5rem;
                flex-direction: row;
                gap: 0.5rem;
            }
            
            .qualiopi-icon {
                font-size: 1.5rem;
                margin-bottom: 0;
            }
            
            .qualiopi-label {
                font-size: 0.8rem;
            }
            
            .qualiopi-content h3 {
                font-size: 1.25rem;
            }
            
            .qualiopi-content p {
                font-size: 0.95rem;
                text-align: left;
            }
            
            /* --- EXPERTISE SEARCH MOBILE --- */
            .expertise-search {
                margin-bottom: 1.5rem;
            }
            
            .search-wrapper {
                max-width: 100%;
            }
            
            .search-wrapper input {
                padding: 0.9rem 2.5rem 0.9rem 2.5rem;
                font-size: 0.9rem;
            }
            
            .search-wrapper .search-icon {
                font-size: 1rem;
                left: 0.75rem;
            }
            
            .search-wrapper input::placeholder {
                font-size: 0.85rem;
            }
            
            /* --- EXPERTISE FILTERS MOBILE --- */
            .expertise-filters {
                flex-wrap: nowrap !important;
                overflow-x: auto;
                -webkit-overflow-scrolling: touch;
                padding-bottom: 0.5rem;
                margin-bottom: 2rem !important;
                gap: 0.5rem;
            }
            
            .filter-btn {
                flex-shrink: 0;
                padding: 0.6rem 1rem;
                font-size: 0.85rem;
            }
            
            /* --- TIMELINE PELLICULE --- */
            .timeline-container {
                padding: 1rem;
            }
            
            .decade-nav {
                gap: 0.5rem;
                flex-wrap: wrap;
                justify-content: center;
            }
            
            .decade-nav button {
                font-size: 0.8rem;
                padding: 0.5rem 0.75rem;
            }
            
            .timeline-scroll {
                gap: 1rem;
            }
            
            .frame {
                min-width: 280px;
            }
            
            .frame-content h4 {
                font-size: 1rem;
            }
            
            .frame-content p {
                font-size: 0.85rem;
            }
            
            /* --- PAGE À PROPOS --- */
            #page-apropos .page-hero {
                min-height: 40vh;
            }
            
            /* Marges identiques à la page d'accueil */
            #page-apropos .videos-section {
                padding: 2rem 1rem !important;
            }
            
            #page-apropos .container {
                padding: 0 !important;
            }
            
            #page-apropos .page-hero-content h2 {
                font-size: 2.2rem;
            }
            
            #page-apropos .page-hero-content h2 span {
                font-size: 0.95rem !important;
                letter-spacing: 3px !important;
            }
            
            #page-apropos .apropos-intro {
                display: none;
            }
            
            /* Intro grid - 1 colonne */
            #page-apropos .approach-grid {
                display: block;
            }
            
            /* Masquer la vidéo présentation sur mobile */
            #page-apropos .approach-grid > div:last-child {
                display: none;
            }
            
            #page-apropos .approach-text h2 {
                font-size: 1.3rem;
            }
            
            #page-apropos .approach-text p {
                font-size: 0.95rem;
            }
            
            /* Bouton lire la suite */
            #page-apropos .btn-expand-apropos {
                font-size: 0.9rem;
                padding: 0.75rem 1.25rem;
            }
            
            /* Timeline pellicule compacte */
            #page-apropos .timeline-section .section-header {
                margin-top: 3rem !important;
            }
            
            #page-apropos .timeline-section .section-header h2 {
                font-size: 1.3rem;
            }
            
            #page-apropos .timeline-section .section-header p {
                font-size: 0.9rem;
            }
            
            #page-apropos .decade-nav {
                gap: 0.3rem;
            }
            
            #page-apropos .decade-nav button {
                padding: 0.4rem 0.6rem;
                font-size: 0.7rem;
            }
            
            /* Masquer les perforations sur mobile */
            #page-apropos .film-perforations {
                display: none;
            }
            
            /* Frames plus compactes */
            #page-apropos .film-frame {
                min-width: 240px;
            }
            
            #page-apropos .frame-card {
                padding: 1rem;
            }
            
            #page-apropos .frame-header {
                margin-bottom: 0.75rem;
            }
            
            #page-apropos .frame-year {
                font-size: 1.3rem;
            }
            
            #page-apropos .frame-icon {
                font-size: 1.3rem;
            }
            
            #page-apropos .frame-title {
                font-size: 0.95rem;
                margin-bottom: 0.4rem;
            }
            
            #page-apropos .frame-text {
                font-size: 0.8rem;
                line-height: 1.5;
            }
            
            /* Indicateur scroll simplifié */
            #page-apropos .scroll-hint {
                font-size: 0.8rem;
            }
            
            /* Section 20 ans - Mobile */
            .section-20ans .section-header {
                margin-top: 3rem !important;
            }
            
            .section-20ans .section-header h2 {
                font-size: 1.3rem;
            }
            
            .stats-20ans {
                grid-template-columns: repeat(2, 1fr);
                gap: 1rem;
                margin: 2rem 0;
            }
            
            .stat-20ans {
                padding: 1.25rem 0.75rem;
            }
            
            .stat-number {
                font-size: 2.5rem;
            }
            
            .stat-label {
                font-size: 0.8rem;
            }
            
            .innovation-message p {
                font-size: 0.95rem;
                text-align: left;
            }
            
            .innovation-highlight {
                font-size: 1rem !important;
                padding: 1rem 1.25rem;
            }
            
            /* Ancrage normand */
            #page-apropos .section-header[style*="margin-top: 5rem"] {
                margin-top: 3rem !important;
            }
            
            #page-apropos .apropos-block p {
                font-size: 0.95rem;
            }
            
            #page-apropos .apropos-highlight {
                font-size: 1rem;
                padding: 1rem;
            }
            
            /* Zone grid - 1 colonne */
            #page-apropos .zone-grid {
                grid-template-columns: 1fr !important;
                gap: 1.5rem !important;
                margin-top: 2rem !important;
            }
            
            #page-apropos .zone-item {
                padding: 1.25rem !important;
            }
            
            #page-apropos .zone-item h3 {
                font-size: 1.1rem;
                margin-bottom: 0.75rem;
            }
            
            /* Références - texte tronqué */
            #page-apropos .zone-item p {
                font-size: 0.85rem !important;
                line-height: 1.6 !important;
                max-height: 4.8em;
                overflow: hidden;
                position: relative;
            }
            
            #page-apropos .zone-item p::after {
                content: '...';
                position: absolute;
                bottom: 0;
                right: 0;
                background: linear-gradient(to right, transparent, var(--bg-card) 50%);
                padding-left: 2rem;
            }
            
            #page-apropos .zone-item.expanded p {
                max-height: none;
            }
            
            #page-apropos .zone-item.expanded p::after {
                display: none;
            }
            
            /* Bouton voir plus références */
            .zone-expand-btn {
                display: block !important;
                margin-top: 0.75rem;
                color: var(--rouge);
                font-size: 0.85rem;
                font-weight: 600;
                cursor: pointer;
                background: none;
                border: none;
                padding: 0;
            }
            
            #page-apropos .zone-list {
                flex-wrap: wrap;
                gap: 0.4rem;
                margin-top: 0.75rem !important;
            }
            
            #page-apropos .zone-tag {
                font-size: 0.75rem;
                padding: 0.3rem 0.6rem;
            }
            
            #page-apropos .zone-tag {
                font-size: 0.8rem;
                padding: 0.4rem 0.8rem;
            }
            
            /* --- CONTACT --- */
            #page-contact .videos-section {
                padding: 2rem 1rem !important;
            }
            
            #page-contact .container {
                padding: 0 !important;
            }
            
            /* Bouton appel principal */
            #page-contact .container > div[style*="text-align: center"] {
                margin-bottom: 2rem !important;
            }
            
            #page-contact .container > div[style*="text-align: center"] p {
                font-size: 1rem !important;
                margin-bottom: 1rem !important;
            }
            
            #page-contact .container > div[style*="text-align: center"] a[href*="tel"] {
                padding: 1rem 1.5rem !important;
                font-size: 1.5rem !important;
                border-radius: 8px !important;
            }
            
            #page-contact .container > div[style*="text-align: center"] a[href*="tel"] span {
                font-size: 1.3rem !important;
            }
            
            /* Grille coordonnées + formulaire */
            #page-contact .container > div[style*="grid-template-columns"] {
                grid-template-columns: 1fr !important;
                gap: 1.5rem !important;
            }
            
            /* Cards coordonnées et formulaire */
            #page-contact .container > div[style*="grid-template-columns"] > div {
                padding: 1.5rem !important;
                border-radius: 8px !important;
            }
            
            #page-contact .container > div[style*="grid-template-columns"] h3 {
                font-size: 1.3rem !important;
                margin-bottom: 1.5rem !important;
            }
            
            /* Formulaire - grilles en 1 colonne */
            #page-contact form > div[style*="grid-template-columns"] {
                grid-template-columns: 1fr !important;
                gap: 1rem !important;
            }
            
            #page-contact form label {
                font-size: 0.9rem !important;
            }
            
            #page-contact form input,
            #page-contact form textarea {
                padding: 0.9rem !important;
                font-size: 0.95rem !important;
            }
            
            #page-contact form button[type="submit"] {
                padding: 1rem !important;
                font-size: 1.1rem !important;
            }
            
            /* --- FOOTER --- */
            .footer-main {
                grid-template-columns: 1fr 1fr;
                gap: 2rem;
                padding: 2rem 1rem;
            }
            
            .footer-main h4 {
                font-size: 0.9rem;
            }
            
            .footer-main a {
                font-size: 0.85rem;
            }
            
            .footer-bottom {
                flex-direction: column;
                gap: 1.5rem;
                padding: 1.5rem 1rem 5rem; /* Extra padding pour CTA flottant */
                text-align: center;
            }
            
            .footer-brand {
                flex-direction: column;
                gap: 1rem;
            }
            
            .footer-brand img {
                height: 30px;
            }
            
            .footer-contact {
                flex-direction: column;
                gap: 0.5rem;
            }
            
            .footer-legal {
                font-size: 0.75rem;
            }
            
            /* --- CTA FLOTTANT TÉLÉPHONE --- */
            #floatingCTA {
                display: flex !important;
            }
            
            /* --- THEME TOGGLE - Déplacer à gauche sur mobile --- */
            .theme-toggle-fixed {
                right: auto;
                left: 1rem;
                bottom: 1rem;
                width: 45px;
                height: 45px;
                font-size: 1.5rem;
            }
        }

        /* ============================================
           RESPONSIVE - PETIT MOBILE (480px et moins)
           ============================================ */
        @media (max-width: 480px) {
            /* Hero */
            .hero h1 {
                font-size: 1.8rem;
            }
            
            .hero-subtitle {
                font-size: 1rem;
            }
            
            .hero-stats {
                font-size: 0.6rem;
                letter-spacing: 1px;
                padding: 0.4rem 0.8rem;
            }
            
            /* Stats */
            .stat-item h3 {
                font-size: 1.6rem;
            }
            
            /* Secteurs */
            .secteurs-grid {
                grid-template-columns: 1fr 1fr;
                gap: 0.5rem;
            }
            
            .secteur-item-content {
                padding: 0.5rem;
            }
            
            .secteur-item-icon {
                font-size: 1.2rem;
                margin-bottom: 0.15rem;
            }
            
            .secteur-item-content h3 {
                font-size: 0.75rem;
                letter-spacing: 0;
            }
            
            .secteur-item-arrow {
                width: 24px;
                height: 24px;
                font-size: 0.8rem;
                bottom: 0.4rem;
                right: 0.4rem;
            }
            
            /* Section headers */
            .section-header h2 {
                font-size: 1.3rem;
            }
            
            /* Arsenal - 1 colonne sur petit mobile */
            .arsenal-grid {
                grid-template-columns: 1fr;
            }
            
            /* Page hero */
            .page-hero h2 {
                font-size: 1.6rem;
            }
            
            /* Footer */
            .footer-main {
                grid-template-columns: 1fr;
            }
            
            /* JPG MANAGER section mobile - grille 2x3 compacte */
            .jpgmanager-section .jpgmanager-grid {
                grid-template-columns: repeat(2, 1fr);
            }
            
            .jpgmanager-section .jpgmanager-header h2 {
                font-size: 2.2rem;
            }
            
            .jpgmanager-section .feature-item {
                padding: 1rem;
                text-align: center;
            }
        }

        /* ============================================
           JPG MANAGER SECTION - SOLAR DESIGN
           ============================================ */
        .jpgmanager-section {
            background: linear-gradient(135deg, #1a1510 0%, #2d2318 50%, #1a1510 100%);
            padding: 6rem 2rem;
            position: relative;
            overflow: hidden;
        }
        
        /* Layout vidéo + features - VERSION A: CINÉMA */
        .jpgmanager-layout {
            display: flex;
            flex-direction: column;
            gap: 3rem;
            margin-bottom: 2.5rem;
        }
        
        /* Video wrapper - Grande et centrée */
        .jpgmanager-video-wrapper {
            position: relative;
            max-width: 900px;
            margin: 0 auto;
            width: 100%;
        }
        
        .jpgmanager-video-container {
            position: relative;
            padding-bottom: 56.25%;
            height: 0;
            overflow: hidden;
            border-radius: 20px;
            box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5), 0 0 80px rgba(251, 191, 36, 0.2);
            border: 3px solid rgba(251, 191, 36, 0.4);
        }
        
        .jpgmanager-video-container iframe {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            border-radius: 17px;
        }
        
        /* Features en bandeau horizontal */
        .jpgmanager-features {
            display: grid;
            grid-template-columns: repeat(6, 1fr);
            gap: 1.25rem;
        }
        
        .jpgmanager-section .jpgmanager-features .feature-item {
            padding: 1.5rem 1rem;
            text-align: center;
            background: linear-gradient(145deg, rgba(251, 191, 36, 0.08) 0%, rgba(245, 158, 11, 0.03) 100%);
            border: 1px solid rgba(251, 191, 36, 0.25);
            border-radius: 16px;
            transition: all 0.3s ease;
        }
        
        .jpgmanager-section .jpgmanager-features .feature-item:hover {
            transform: translateY(-5px);
            box-shadow: 0 10px 30px rgba(251, 191, 36, 0.2);
            border-color: rgba(251, 191, 36, 0.5);
        }
        
        .jpgmanager-section .jpgmanager-features .feature-item .feature-icon {
            font-size: 2rem;
            margin-bottom: 0.75rem;
            display: block;
        }
        
        .jpgmanager-section .jpgmanager-features .feature-item h4 {
            font-size: 0.95rem;
            margin-bottom: 0.5rem;
            color: #fbbf24;
        }
        
        .jpgmanager-section .jpgmanager-features .feature-item p {
            font-size: 0.8rem;
            line-height: 1.4;
            opacity: 0.85;
        }
        
        /* Container au-dessus */
        .jpgmanager-section .container {
            position: relative;
            z-index: 2;
        }
        
        /* Mode clair */
        @media (prefers-color-scheme: light) {
            :root:not([data-theme="dark"]) .jpgmanager-section {
                background: linear-gradient(135deg, #fffbf0 0%, #fff8e6 50%, #fffbf0 100%);
            }
            :root:not([data-theme="dark"]) .jpgmanager-video-container {
                box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15), 0 0 60px rgba(251, 191, 36, 0.1);
            }
        }
        :root[data-theme="light"] .jpgmanager-section {
            background: linear-gradient(135deg, #fffbf0 0%, #fff8e6 50%, #fffbf0 100%);
        }
        :root[data-theme="light"] .jpgmanager-video-container {
            box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15), 0 0 60px rgba(251, 191, 36, 0.1);
        }
        
        .jpgmanager-section::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            height: 3px;
            background: linear-gradient(90deg, transparent, #f59e0b, #fbbf24, #f59e0b, transparent);
            z-index: 3;
        }
        
        .jpgmanager-section::after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            height: 3px;
            background: linear-gradient(90deg, transparent, #f59e0b, #fbbf24, #f59e0b, transparent);
            z-index: 3;
        }
        
        /* Glow effect */
        .jpgmanager-section .container::before {
            content: '';
            position: absolute;
            top: -100px;
            left: 50%;
            transform: translateX(-50%);
            width: 600px;
            height: 600px;
            background: radial-gradient(circle, rgba(251, 191, 36, 0.08) 0%, transparent 70%);
            pointer-events: none;
        }
        
        .jpgmanager-header {
            text-align: center;
            margin-bottom: 3.5rem;
            position: relative;
        }
        
        .jpgmanager-header .exclusive-badge {
            display: inline-flex;
            align-items: center;
            gap: 0.5rem;
            background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
            color: #1a1510;
            padding: 0.6rem 1.5rem;
            border-radius: 30px;
            font-size: 0.8rem;
            font-weight: 800;
            letter-spacing: 2px;
            text-transform: uppercase;
            margin-bottom: 1.5rem;
            box-shadow: 0 4px 20px rgba(245, 158, 11, 0.4), 0 0 40px rgba(251, 191, 36, 0.2);
            animation: pulse-glow 2s ease-in-out infinite;
        }
        
        @keyframes pulse-glow {
            0%, 100% { box-shadow: 0 4px 20px rgba(245, 158, 11, 0.4), 0 0 40px rgba(251, 191, 36, 0.2); }
            50% { box-shadow: 0 4px 30px rgba(245, 158, 11, 0.6), 0 0 60px rgba(251, 191, 36, 0.3); }
        }
        
        .jpgmanager-header h2 {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 3.5rem;
            letter-spacing: 4px;
            margin-bottom: 0.75rem;
            color: var(--text-primary);
        }
        
        .jpgmanager-header h2 span {
            background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 50%, #d97706 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
        }
        
        .jpgmanager-header .subtitle {
            font-size: 1.2rem;
            color: var(--text-secondary);
            max-width: 650px;
            margin: 0 auto;
            line-height: 1.8;
        }
        
        .jpgmanager-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 1.5rem;
            max-width: 1100px;
            margin: 0 auto 3rem;
            position: relative;
        }
        
        .jpgmanager-section .feature-item {
            background: linear-gradient(145deg, rgba(251, 191, 36, 0.03) 0%, rgba(245, 158, 11, 0.01) 100%);
            border: 1px solid rgba(251, 191, 36, 0.15);
            border-radius: 16px;
            padding: 2rem;
            transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
            position: relative;
            backdrop-filter: blur(10px);
        }
        
        .jpgmanager-section .feature-item::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            height: 3px;
            background: linear-gradient(90deg, transparent, #fbbf24, transparent);
            opacity: 0;
            transition: opacity 0.3s ease;
            border-radius: 16px 16px 0 0;
        }
        
        .jpgmanager-section .feature-item:hover {
            transform: translateY(-8px);
            border-color: rgba(251, 191, 36, 0.4);
            box-shadow: 0 20px 50px rgba(251, 191, 36, 0.15), 0 0 30px rgba(245, 158, 11, 0.1);
            background: linear-gradient(145deg, rgba(251, 191, 36, 0.08) 0%, rgba(245, 158, 11, 0.03) 100%);
        }
        
        .jpgmanager-section .feature-item:hover::before {
            opacity: 1;
        }
        
        .jpgmanager-section .feature-item .feature-icon {
            font-size: 2.5rem;
            margin-bottom: 1.25rem;
            display: block;
            filter: drop-shadow(0 2px 8px rgba(251, 191, 36, 0.3));
        }
        
        .jpgmanager-section .feature-item h4 {
            font-family: 'Bebas Neue', sans-serif;
            font-size: 1.4rem;
            letter-spacing: 1px;
            margin-bottom: 0.75rem;
            color: #fbbf24;
        }
        
        .jpgmanager-section .feature-item p {
            font-size: 0.95rem;
            color: var(--text-secondary);
            line-height: 1.7;
            margin: 0;
        }
        
        .jpgmanager-security {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 2rem;
            padding: 2rem 2.5rem;
            background: linear-gradient(135deg, rgba(74, 222, 128, 0.08) 0%, rgba(34, 197, 94, 0.05) 100%);
            border: 2px solid rgba(74, 222, 128, 0.25);
            border-radius: 16px;
            max-width: 850px;
            margin: 0 auto;
            position: relative;
        }
        
        .jpgmanager-security::before {
            content: '';
            position: absolute;
            inset: -2px;
            border-radius: 18px;
            background: linear-gradient(135deg, rgba(74, 222, 128, 0.3), transparent, rgba(74, 222, 128, 0.3));
            z-index: -1;
            opacity: 0.5;
        }
        
        .jpgmanager-security .security-icon {
            font-size: 3rem;
            filter: drop-shadow(0 2px 10px rgba(74, 222, 128, 0.4));
        }
        
        .jpgmanager-security .security-text {
            text-align: left;
        }
        
        .jpgmanager-security .security-text strong {
            display: block;
            color: #4ade80;
            font-size: 1.1rem;
            margin-bottom: 0.4rem;
            letter-spacing: 0.5px;
        }
        
        .jpgmanager-security .security-text p {
            color: var(--text-secondary);
            font-size: 0.95rem;
            margin: 0;
        }
        
        /* CTA Button */
        .jpgmanager-cta {
            text-align: center;
            margin-top: 2.5rem;
        }
        
        .btn-jpgmanager {
            display: inline-flex;
            align-items: center;
            gap: 0.75rem;
            background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
            color: #1a1510;
            padding: 1rem 2.5rem;
            border-radius: 50px;
            font-family: 'Bebas Neue', sans-serif;
            font-size: 1.25rem;
            letter-spacing: 1.5px;
            text-decoration: none;
            font-weight: 700;
            transition: all 0.3s ease;
            box-shadow: 0 4px 20px rgba(245, 158, 11, 0.4), 0 0 40px rgba(251, 191, 36, 0.15);
            border: 2px solid transparent;
        }
        
        .btn-jpgmanager:hover {
            transform: translateY(-3px);
            box-shadow: 0 8px 30px rgba(245, 158, 11, 0.5), 0 0 60px rgba(251, 191, 36, 0.25);
            background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);
        }
        
        .btn-jpgmanager:active {
            transform: translateY(-1px);
        }
        
        .btn-jpgmanager svg {
            width: 20px;
            height: 20px;
            transition: transform 0.3s ease;
        }
        
        .btn-jpgmanager:hover svg {
            transform: translate(3px, -3px);
        }
        
        @media (max-width: 1100px) {
            .jpgmanager-features {
                grid-template-columns: repeat(3, 1fr);
            }
        }
        
        @media (max-width: 900px) {
            .jpgmanager-layout {
                gap: 2rem;
            }
            
            .jpgmanager-video-wrapper {
                max-width: 100%;
            }
            
            .jpgmanager-features {
                grid-template-columns: repeat(3, 1fr);
                gap: 0.75rem;
            }
            
            .jpgmanager-section .jpgmanager-features .feature-item {
                padding: 1rem;
            }
            
            .jpgmanager-section .jpgmanager-features .feature-item .feature-icon {
                font-size: 1.75rem;
            }
            
            .jpgmanager-section .jpgmanager-features .feature-item h4 {
                font-size: 0.9rem;
            }
            
            .jpgmanager-section .jpgmanager-features .feature-item p {
                font-size: 0.75rem;
            }
        }
        
        @media (max-width: 600px) {
            .jpgmanager-section {
                padding: 3rem 1rem;
            }
            
            .jpgmanager-section::before,
            .jpgmanager-section::after {
                height: 2px;
            }
            
            .jpgmanager-section .container::before {
                width: 300px;
                height: 300px;
                opacity: 0.6;
                top: -50px;
            }
            
            .jpgmanager-header {
                margin-bottom: 1.5rem;
            }
            
            .jpgmanager-header .exclusive-badge {
                padding: 0.5rem 1.2rem;
                font-size: 0.7rem;
                letter-spacing: 1.5px;
                margin-bottom: 1rem;
                box-shadow: 0 4px 15px rgba(245, 158, 11, 0.5);
            }
            
            .jpgmanager-header h2 {
                font-size: 2.4rem;
                letter-spacing: 3px;
                margin-bottom: 0.5rem;
            }
            
            .jpgmanager-header .subtitle {
                font-size: 0.9rem;
                line-height: 1.5;
                padding: 0 0.25rem;
                opacity: 0.9;
            }
            
            /* Video container mobile */
            .jpgmanager-video-container {
                border-radius: 12px;
                box-shadow: 0 8px 30px rgba(0, 0, 0, 0.3), 0 0 40px rgba(251, 191, 36, 0.1);
            }
            
            /* Features 2x3 grid mobile */
            .jpgmanager-features {
                grid-template-columns: repeat(2, 1fr);
                gap: 0.6rem;
            }
            
            /* Cards compactes */
            .jpgmanager-section .jpgmanager-features .feature-item {
                padding: 0.85rem 0.6rem;
                border-radius: 12px;
                text-align: center;
                border-radius: 14px;
                text-align: center;
                min-height: auto;
                background: linear-gradient(145deg, rgba(251, 191, 36, 0.06) 0%, rgba(245, 158, 11, 0.02) 100%);
                border: 1px solid rgba(251, 191, 36, 0.2);
                backdrop-filter: blur(8px);
            }
            
            .jpgmanager-section .feature-item::before {
                display: none;
            }
            
            /* Icônes avec glow doré */
            .jpgmanager-section .feature-item .feature-icon {
                font-size: 1.6rem;
                margin-bottom: 0.4rem;
                display: block;
                filter: drop-shadow(0 2px 6px rgba(251, 191, 36, 0.4));
            }
            
            .jpgmanager-section .feature-item h4 {
                font-size: 0.8rem;
                letter-spacing: 0.5px;
                margin-bottom: 0.3rem;
                line-height: 1.15;
                color: #fcd34d;
            }
            
            .jpgmanager-section .feature-item p {
                font-size: 0.7rem;
                line-height: 1.35;
                opacity: 0.8;
                display: -webkit-box;
                -webkit-line-clamp: 2;
                -webkit-box-orient: vertical;
                overflow: hidden;
                margin: 0;
            }
            
            /* Active state pour touch */
            .jpgmanager-section .feature-item:active {
                transform: scale(0.97);
                border-color: rgba(251, 191, 36, 0.5);
                box-shadow: 0 0 20px rgba(251, 191, 36, 0.2);
            }
            
            /* Security banner compact et élégant */
            .jpgmanager-security {
                flex-direction: row;
                align-items: center;
                gap: 0.85rem;
                padding: 1rem;
                border-radius: 14px;
                text-align: left;
                background: linear-gradient(135deg, rgba(74, 222, 128, 0.1) 0%, rgba(34, 197, 94, 0.05) 100%);
                border: 1px solid rgba(74, 222, 128, 0.25);
            }
            
            .jpgmanager-security::before {
                display: none;
            }
            
            .jpgmanager-security .security-icon {
                font-size: 1.75rem;
                flex-shrink: 0;
                filter: drop-shadow(0 2px 8px rgba(74, 222, 128, 0.4));
            }
            
            .jpgmanager-security .security-text {
                text-align: left;
            }
            
            .jpgmanager-security .security-text strong {
                font-size: 0.8rem;
                margin-bottom: 0.15rem;
                letter-spacing: 0.3px;
            }
            
            .jpgmanager-security .security-text p {
                font-size: 0.7rem;
                line-height: 1.35;
                margin: 0;
                opacity: 0.85;
            }
            
            /* CTA mobile */
            .jpgmanager-cta {
                margin-top: 1.5rem;
            }
            
            .btn-jpgmanager {
                padding: 0.85rem 2rem;
                font-size: 1.1rem;
                letter-spacing: 1px;
                gap: 0.5rem;
            }
            
            .btn-jpgmanager svg {
                width: 18px;
                height: 18px;
            }
        }
        
        /* Extra petit écran - ultra compact */
        @media (max-width: 380px) {
            .jpgmanager-section {
                padding: 2.5rem 0.75rem;
            }
            
            .jpgmanager-header h2 {
                font-size: 2rem;
            }
            
            .jpgmanager-header .subtitle {
                font-size: 0.85rem;
            }
            
            .jpgmanager-features {
                gap: 0.5rem;
            }
            
            .jpgmanager-section .jpgmanager-features .feature-item {
                padding: 0.75rem 0.5rem;
            }
            
            .jpgmanager-section .jpgmanager-features .feature-item .feature-icon {
                font-size: 1.3rem;
                margin-bottom: 0.25rem;
            }
            
            .jpgmanager-section .jpgmanager-features .feature-item h4 {
                font-size: 0.7rem;
            }
            
            .jpgmanager-section .jpgmanager-features .feature-item p {
                font-size: 0.6rem;
            }
            
            .jpgmanager-section .feature-item p {
                font-size: 0.65rem;
                -webkit-line-clamp: 2;
            }
            
            .jpgmanager-security {
                padding: 0.85rem;
                gap: 0.7rem;
            }
            
            .jpgmanager-security .security-icon {
                font-size: 1.5rem;
            }
            
            .jpgmanager-security .security-text strong {
                font-size: 0.75rem;
            }
            
            .jpgmanager-security .security-text p {
                font-size: 0.65rem;
            }
        }

/* ---- bloc ---- */

/* Dropdown desktop hover */
        #desktopMenu .dropdown:hover .dropdown-content {
            display: block !important;
        }
        #desktopMenu .dropdown-content a:hover {
            background: #e63946 !important;
        }

/* ---- bloc ---- */

/* Styles Page Toutes les Vidéos */
            .videos-gallery-hero {
                padding: 7rem 2rem 2rem;
                background: var(--bg-primary);
            }
            .videos-gallery-hero .container {
                max-width: 1200px;
                margin: 0 auto;
            }
            .videos-gallery-hero h2 {
                font-family: 'Bebas Neue', sans-serif;
                font-size: 3.5rem;
                letter-spacing: 2px;
                margin-bottom: 0.5rem;
                color: var(--text-primary);
            }
            .videos-gallery-hero p {
                font-size: 1.1rem;
                color: var(--text-secondary);
                margin-bottom: 2rem;
            }
            
            /* Filtres */
            .filters-container {
                max-width: 1200px;
                margin: 0 auto 2rem;
                padding: 0 2rem;
            }
            .filters-label {
                font-size: 0.85rem;
                color: var(--text-muted);
                margin-bottom: 0.75rem;
                text-transform: uppercase;
                letter-spacing: 1px;
            }
            .filters-wrap {
                display: flex;
                flex-wrap: wrap;
                gap: 0.5rem;
            }
            .filter-btn {
                padding: 0.5rem 1rem;
                background: var(--bg-secondary);
                border: 1px solid var(--border-color);
                border-radius: 20px;
                color: var(--text-secondary);
                font-size: 0.85rem;
                cursor: pointer;
                transition: all 0.2s;
            }
            .filter-btn:hover {
                border-color: var(--rouge);
                color: var(--text-primary);
            }
            .filter-btn.active {
                background: var(--rouge);
                border-color: var(--rouge);
                color: white;
            }
            .filter-btn.filter-all {
                background: var(--bg-tertiary);
                font-weight: 600;
            }
            .filter-btn.filter-all.active {
                background: var(--rouge);
            }
            
            /* Grille vidéos */
            .videos-grid {
                display: grid;
                grid-template-columns: repeat(3, 1fr);
                gap: 1.5rem;
                max-width: 1200px;
                margin: 0 auto 4rem;
                padding: 0 2rem;
            }
            .video-card-gallery {
                background: var(--bg-secondary);
                border-radius: 10px;
                overflow: hidden;
                transition: transform 0.3s, box-shadow 0.3s;
                cursor: pointer;
            }
            .video-card-gallery:hover {
                transform: translateY(-4px);
                box-shadow: 0 12px 30px rgba(0,0,0,0.25);
            }
            .video-card-gallery.hidden {
                display: none;
            }
            .video-thumb {
                position: relative;
                padding-bottom: 56.25%;
                background: var(--bg-tertiary);
            }
            .video-thumb img {
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                object-fit: cover;
            }
            .video-thumb .play-overlay {
                position: absolute;
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                background: rgba(0,0,0,0.3);
                display: flex;
                align-items: center;
                justify-content: center;
                opacity: 0;
                transition: opacity 0.3s;
            }
            .video-card-gallery:hover .play-overlay {
                opacity: 1;
            }
            .play-overlay span {
                width: 60px;
                height: 60px;
                background: var(--rouge);
                border-radius: 50%;
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 1.5rem;
            }
            .video-card-body {
                padding: 1.25rem;
            }
            .video-card-secteur {
                font-size: 0.7rem;
                font-weight: 600;
                letter-spacing: 1px;
                text-transform: uppercase;
                color: var(--rouge);
                margin-bottom: 0.4rem;
            }
            .video-card-title {
                font-family: 'Montserrat', sans-serif;
                font-size: 1rem;
                font-weight: 600;
                line-height: 1.3;
                margin-bottom: 0.75rem;
                color: var(--text-primary);
            }
            .video-card-tags {
                display: flex;
                flex-wrap: wrap;
                gap: 0.4rem;
            }
            .video-card-tags span {
                padding: 0.2rem 0.5rem;
                background: var(--bg-tertiary);
                border-radius: 12px;
                font-size: 0.7rem;
                color: var(--text-muted);
            }
            
            /* Compteur résultats */
            .results-count {
                max-width: 1200px;
                margin: 0 auto 1rem;
                padding: 0 2rem;
                font-size: 0.9rem;
                color: var(--text-muted);
            }
            
            /* Modal vidéo */
            .video-modal {
                display: none;
                position: fixed;
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                background: rgba(0,0,0,0.95);
                z-index: 10000;
                align-items: center;
                justify-content: center;
                padding: 2rem;
            }
            .video-modal.active {
                display: flex;
            }
            .video-modal-content {
                width: 100%;
                max-width: 1000px;
                position: relative;
            }
            .video-modal-close {
                position: absolute;
                top: -50px;
                right: 0;
                background: none;
                border: none;
                color: white;
                font-size: 2rem;
                cursor: pointer;
            }
            .video-modal-iframe {
                width: 100%;
                aspect-ratio: 16/9;
                border-radius: 8px;
            }
            
            /* Responsive */
            @media (max-width: 900px) {
                .videos-grid { grid-template-columns: repeat(2, 1fr); }
            }
            @media (max-width: 600px) {
                .videos-gallery-hero { padding: 6rem 1.5rem 1.5rem; }
                .videos-gallery-hero h2 { font-size: 2.5rem; }
                .videos-grid { grid-template-columns: 1fr; padding: 0 1.5rem; }
                .filters-container { padding: 0 1.5rem; }
            }

/* ---- bloc ---- */

/* ===== THEME CLAIR RESSOURCES ===== */
            #page-ressources {
                --bg-primary: #FEFBF6;
                --bg-secondary: #ffffff;
                --bg-tertiary: #f5f0e8;
                --noir-light: #f5f0e8;
                --text-primary: #1a1a2e;
                --text-secondary: #4a4a5a;
                --text-muted: #6c757d;
                --border-color: rgba(0,0,0,0.08);
                background: #FEFBF6;
            }

            /* Styles Ressources - Version Compacte */
            .ressources-hero-compact {
                padding: 7rem 2rem 2rem;
                background: var(--bg-primary);
            }
            .ressources-hero-compact .container {
                max-width: 1200px;
                margin: 0 auto;
            }
            .ressources-hero-compact h2 {
                font-family: 'Bebas Neue', sans-serif;
                font-size: 3.5rem;
                letter-spacing: 2px;
                margin-bottom: 0.5rem;
                color: var(--text-primary);
            }
            .ressources-hero-compact p {
                font-size: 1.1rem;
                color: var(--text-secondary);
                max-width: 600px;
            }
            
            /* Featured Article - Horizontal */
            .featured-card-horizontal {
                display: grid;
                grid-template-columns: 1fr 1fr;
                background: var(--bg-secondary);
                border-radius: 12px;
                overflow: hidden;
                margin: 2rem auto 3rem;
                max-width: 1200px;
                text-decoration: none;
                color: inherit;
                transition: transform 0.3s, box-shadow 0.3s;
                border: 1px solid var(--border-color);
                box-shadow: 0 4px 12px rgba(0,0,0,0.04);
            }
            .featured-card-horizontal:hover {
                transform: translateY(-4px);
                box-shadow: 0 20px 40px rgba(0,0,0,0.1);
            }
            .featured-card-img {
                height: 300px;
                background-size: cover;
                background-position: center;
            }
            .featured-card-content {
                padding: 2.5rem;
                display: flex;
                flex-direction: column;
                justify-content: center;
            }
            .featured-badge {
                display: inline-flex;
                align-items: center;
                gap: 0.5rem;
                background: var(--rouge);
                color: white;
                padding: 0.3rem 0.8rem;
                font-size: 0.7rem;
                font-weight: 600;
                letter-spacing: 1px;
                text-transform: uppercase;
                margin-bottom: 1rem;
                width: fit-content;
                border-radius: 3px;
            }
            .featured-card-content h2 {
                font-family: 'Montserrat', sans-serif;
                font-size: 1.6rem;
                font-weight: 700;
                line-height: 1.3;
                margin-bottom: 1rem;
                color: var(--text-primary);
            }
            .featured-card-content p {
                font-size: 1rem;
                color: var(--text-secondary);
                line-height: 1.6;
                margin-bottom: 1.5rem;
            }
            .featured-card-meta {
                display: flex;
                gap: 1.5rem;
                font-size: 0.85rem;
                color: var(--text-muted);
            }
            
            /* Articles Grid */
            .articles-grid {
                display: grid;
                grid-template-columns: repeat(3, 1fr);
                gap: 1.5rem;
                max-width: 1200px;
                margin: 0 auto 4rem;
                padding: 0 2rem;
            }
            .article-card {
                background: var(--bg-secondary);
                border-radius: 10px;
                overflow: hidden;
                text-decoration: none;
                color: inherit;
                transition: transform 0.3s, box-shadow 0.3s;
                display: flex;
                flex-direction: column;
                border: 1px solid var(--border-color);
                box-shadow: 0 2px 8px rgba(0,0,0,0.03);
            }
            .article-card:hover {
                transform: translateY(-4px);
                box-shadow: 0 12px 30px rgba(0,0,0,0.08);
            }
            .article-card-img {
                height: 160px;
                background: linear-gradient(135deg, var(--bg-tertiary) 0%, var(--noir-light) 100%);
                background-size: cover;
                background-position: center;
                position: relative;
            }
            .article-card-img .category-tag {
                position: absolute;
                bottom: 10px;
                left: 10px;
                background: var(--rouge);
                color: white;
                padding: 0.25rem 0.6rem;
                font-size: 0.65rem;
                font-weight: 600;
                letter-spacing: 1px;
                text-transform: uppercase;
                border-radius: 3px;
            }
            .article-card-body {
                padding: 1.25rem;
                flex: 1;
                display: flex;
                flex-direction: column;
            }
            .article-card-body h3 {
                font-family: 'Montserrat', sans-serif;
                font-size: 1.05rem;
                font-weight: 600;
                line-height: 1.35;
                margin-bottom: 0.75rem;
                color: var(--text-primary);
            }
            .article-card-body p {
                font-size: 0.9rem;
                color: var(--text-secondary);
                line-height: 1.5;
                flex: 1;
            }
            .article-card-footer {
                display: flex;
                justify-content: space-between;
                align-items: center;
                padding-top: 1rem;
                margin-top: auto;
                border-top: 1px solid var(--border-color);
                font-size: 0.8rem;
                color: var(--text-muted);
            }
            .article-card-footer .read-more {
                color: var(--rouge);
                font-weight: 600;
            }
            
            /* Section Focus */
            .focus-section {
                background: var(--bg-tertiary);
                padding: 3rem 2rem;
                margin-bottom: 0;
            }
            .focus-section .container {
                max-width: 1200px;
                margin: 0 auto;
            }
            .focus-section h2 {
                font-family: 'Bebas Neue', sans-serif;
                font-size: 2rem;
                letter-spacing: 2px;
                margin-bottom: 0.5rem;
                color: var(--text-primary);
            }
            .focus-section > .container > p {
                color: var(--text-secondary);
                margin-bottom: 2rem;
            }
            .focus-grid {
                display: grid;
                grid-template-columns: repeat(3, 1fr);
                gap: 1.5rem;
            }
            
            /* Responsive */
            @media (max-width: 1000px) {
                .articles-grid, .focus-grid { grid-template-columns: repeat(2, 1fr); }
                .featured-card-horizontal { grid-template-columns: 1fr; }
                .featured-card-img { height: 220px; }
            }
            @media (max-width: 650px) {
                .ressources-hero-compact { padding: 6rem 1.5rem 1.5rem; }
                .ressources-hero-compact h2 { font-size: 2.5rem; }
                .articles-grid, .focus-grid { grid-template-columns: 1fr; padding: 0 1.5rem; }
                .featured-card-horizontal { margin: 1.5rem; border-radius: 10px; }
            }

/* ---- bloc ---- */

/* Styles spécifiques Ressources */
            .ressources-hero {
                padding: 10rem 2rem 4rem;
                background: var(--bg-primary);
                border-bottom: 1px solid var(--border-color);
            }
            .ressources-hero-inner {
                max-width: 1200px;
                margin: 0 auto;
                display: flex;
                justify-content: space-between;
                align-items: flex-end;
                gap: 2rem;
            }
            .ressources-hero-left { max-width: 700px; }
            .ressources-eyebrow {
                display: inline-flex;
                align-items: center;
                gap: 1rem;
                margin-bottom: 2rem;
            }
            .ressources-eyebrow-line {
                width: 60px;
                height: 2px;
                background: var(--rouge);
            }
            .ressources-eyebrow-text {
                font-size: 0.8rem;
                font-weight: 600;
                letter-spacing: 3px;
                text-transform: uppercase;
                color: var(--rouge);
            }
            .ressources-hero h2 {
                font-family: 'Bebas Neue', sans-serif;
                font-size: 5rem;
                letter-spacing: 2px;
                line-height: 1;
                margin-bottom: 1.5rem;
                color: var(--text-primary);
            }
            .ressources-hero p {
                font-size: 1.25rem;
                color: var(--text-secondary);
                max-width: 500px;
            }
            .ressources-layout {
                display: grid;
                grid-template-columns: 1fr 320px;
                gap: 0;
                max-width: 1200px;
                margin: 0 auto;
            }
            .ressources-main {
                border-right: 1px solid var(--border-color);
            }
            /* Featured Article */
            .ressources-featured {
                display: grid;
                grid-template-columns: 1fr 1fr;
                border-bottom: 1px solid var(--border-color);
            }
            .featured-image {
                background: linear-gradient(135deg, var(--bg-secondary) 0%, var(--bg-tertiary) 100%);
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 8rem;
                min-height: 400px;
            }
            .featured-content {
                padding: 3rem;
                display: flex;
                flex-direction: column;
                justify-content: center;
                background: var(--bg-secondary);
            }
            .featured-badge {
                display: inline-flex;
                align-items: center;
                gap: 0.5rem;
                background: var(--rouge);
                color: white;
                padding: 0.4rem 1rem;
                font-size: 0.75rem;
                font-weight: 600;
                letter-spacing: 1px;
                text-transform: uppercase;
                margin-bottom: 1.5rem;
                width: fit-content;
            }
            .featured-title {
                font-family: 'Montserrat', sans-serif;
                font-size: 1.8rem;
                font-weight: 700;
                line-height: 1.25;
                margin-bottom: 1rem;
                color: var(--text-primary);
            }
            .featured-excerpt {
                font-size: 1.05rem;
                color: var(--text-secondary);
                line-height: 1.7;
                margin-bottom: 1.5rem;
            }
            .featured-meta {
                display: flex;
                gap: 1.5rem;
                font-size: 0.9rem;
                color: var(--text-muted);
                margin-bottom: 2rem;
            }
            .featured-link {
                display: inline-flex;
                align-items: center;
                gap: 0.5rem;
                color: var(--rouge);
                font-weight: 600;
                text-decoration: none;
                font-size: 1rem;
                transition: gap 0.3s;
            }
            .featured-link:hover { gap: 0.75rem; }
            /* Articles List */
            .articles-list { padding: 0; }
            .article-item {
                display: grid;
                grid-template-columns: 80px 1fr auto;
                gap: 2rem;
                padding: 2rem 3rem;
                border-bottom: 1px solid var(--border-color);
                align-items: center;
                transition: background 0.3s;
                cursor: pointer;
            }
            .article-item:hover {
                background: var(--bg-card-hover);
            }
            .article-number {
                font-family: 'Bebas Neue', sans-serif;
                font-size: 3rem;
                color: var(--border-color-strong);
                transition: color 0.3s;
            }
            .article-item:hover .article-number {
                color: var(--rouge);
            }
            .article-info { flex: 1; }
            .article-category {
                font-size: 0.75rem;
                font-weight: 600;
                letter-spacing: 1px;
                text-transform: uppercase;
                color: var(--rouge);
                margin-bottom: 0.4rem;
            }
            .article-title-item {
                font-family: 'Montserrat', sans-serif;
                font-size: 1.2rem;
                font-weight: 600;
                line-height: 1.3;
                margin-bottom: 0.4rem;
                color: var(--text-primary);
            }
            .article-excerpt-item {
                font-size: 0.9rem;
                color: var(--text-secondary);
            }
            .article-meta-item {
                text-align: right;
                color: var(--text-muted);
                font-size: 0.85rem;
            }
            .article-arrow {
                width: 40px;
                height: 40px;
                display: flex;
                align-items: center;
                justify-content: center;
                background: var(--bg-tertiary);
                color: var(--text-muted);
                transition: all 0.3s;
                margin-top: 0.75rem;
            }
            .article-item:hover .article-arrow {
                background: var(--rouge);
                color: white;
            }
            /* Sidebar */
            .ressources-sidebar {
                padding: 3rem 2rem;
                background: var(--bg-secondary);
            }
            .sidebar-section { margin-bottom: 2.5rem; }
            .sidebar-title {
                font-size: 0.75rem;
                font-weight: 600;
                letter-spacing: 2px;
                text-transform: uppercase;
                color: var(--text-muted);
                margin-bottom: 1.5rem;
                padding-bottom: 0.75rem;
                border-bottom: 1px solid var(--border-color);
            }
            .sidebar-categories { list-style: none; padding: 0; margin: 0; }
            .sidebar-categories li { margin-bottom: 0.5rem; }
            .sidebar-categories a {
                display: flex;
                justify-content: space-between;
                align-items: center;
                color: var(--text-primary);
                text-decoration: none;
                font-size: 0.95rem;
                padding: 0.6rem 0;
                border-bottom: 1px solid var(--border-color);
                transition: color 0.3s;
            }
            .sidebar-categories a:hover { color: var(--rouge); }
            .sidebar-categories .count {
                font-size: 0.85rem;
                color: var(--text-muted);
            }
            .sidebar-newsletter {
                background: rgba(230, 57, 70, 0.1);
                border: 1px solid rgba(230, 57, 70, 0.2);
                padding: 2rem;
            }
            .sidebar-newsletter h3 {
                font-family: 'Montserrat', sans-serif;
                font-size: 1.2rem;
                font-weight: 700;
                margin-bottom: 0.5rem;
                color: var(--text-primary);
            }
            .sidebar-newsletter p {
                font-size: 0.9rem;
                color: var(--text-secondary);
                margin-bottom: 1.5rem;
            }
            .sidebar-newsletter input {
                width: 100%;
                padding: 0.75rem 1rem;
                background: var(--bg-primary);
                border: 1px solid var(--border-color);
                color: var(--text-primary);
                font-size: 0.95rem;
                margin-bottom: 0.75rem;
            }
            .sidebar-newsletter button {
                width: 100%;
                padding: 0.75rem;
                background: var(--rouge);
                border: none;
                color: white;
                font-size: 0.95rem;
                font-weight: 600;
                cursor: pointer;
                transition: background 0.3s;
            }
            .sidebar-newsletter button:hover { background: #c62828; }
            .sidebar-contact {
                background: var(--bg-tertiary);
                padding: 2rem;
                text-align: center;
            }
            .sidebar-contact h3 {
                font-family: 'Montserrat', sans-serif;
                font-size: 1.1rem;
                font-weight: 700;
                margin-bottom: 0.5rem;
                color: var(--text-primary);
            }
            .sidebar-contact p {
                font-size: 0.9rem;
                color: var(--text-secondary);
                margin-bottom: 1rem;
            }
            .sidebar-contact a {
                color: var(--rouge);
                text-decoration: none;
                font-weight: 600;
                font-size: 1.1rem;
            }
            /* Responsive Ressources */
            @media (max-width: 1000px) {
                .ressources-layout { grid-template-columns: 1fr; }
                .ressources-main { border-right: none; }
                .ressources-sidebar { display: none; }
                .ressources-featured { grid-template-columns: 1fr; }
                .featured-image { min-height: 250px; font-size: 5rem; }
            }
            @media (max-width: 768px) {
                .ressources-hero { padding: 8rem 1.5rem 3rem; }
                .ressources-hero h2 { font-size: 3rem; }
                .ressources-hero-inner { flex-direction: column; align-items: flex-start; }
                .article-item { grid-template-columns: 1fr; gap: 1rem; padding: 1.5rem; }
                .article-number { font-size: 2rem; }
                .article-meta-item { text-align: left; display: flex; gap: 1rem; }
                .featured-content { padding: 2rem; }
                .featured-title { font-size: 1.4rem; }
            }

/* ---- bloc ---- */

/* Styles Article */
            .article-page-nav {
                position: fixed;
                top: 60px;
                left: 0;
                right: 0;
                padding: 1rem 2rem;
                background: var(--bg-primary);
                border-bottom: 1px solid var(--border-color);
                z-index: 50;
                display: flex;
                justify-content: space-between;
                align-items: center;
            }
            .article-page-back {
                display: flex;
                align-items: center;
                gap: 0.5rem;
                color: var(--text-secondary);
                text-decoration: none;
                font-size: 0.9rem;
                transition: color 0.3s;
            }
            .article-page-back:hover { color: var(--rouge); }
            .article-hero-section {
                min-height: 80vh;
                display: grid;
                grid-template-columns: 1fr 1fr;
            }
            .article-hero-content {
                padding: 6rem 4rem;
                display: flex;
                flex-direction: column;
                justify-content: center;
                background: var(--bg-primary);
            }
            .article-category-tag {
                display: inline-flex;
                align-items: center;
                gap: 0.75rem;
                margin-bottom: 2rem;
            }
            .article-category-line {
                width: 60px;
                height: 2px;
                background: var(--rouge);
            }
            .article-category-text {
                font-size: 0.85rem;
                font-weight: 600;
                letter-spacing: 3px;
                text-transform: uppercase;
                color: var(--rouge);
            }
            .article-main-title {
                font-family: 'Montserrat', sans-serif;
                font-size: 2.8rem;
                font-weight: 800;
                line-height: 1.15;
                margin-bottom: 2rem;
                color: var(--text-primary);
            }
            .article-subtitle {
                font-size: 1.3rem;
                font-weight: 300;
                color: var(--text-secondary);
                margin-bottom: 3rem;
                max-width: 500px;
            }
            .article-meta-info {
                display: flex;
                align-items: center;
                gap: 2rem;
                padding-top: 2rem;
                border-top: 1px solid var(--border-color);
            }
            .meta-info-item {
                display: flex;
                align-items: center;
                gap: 0.5rem;
                font-size: 0.9rem;
                color: var(--text-muted);
            }
            .article-hero-visual {
                position: relative;
                background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
                display: flex;
                align-items: center;
                justify-content: center;
                overflow: hidden;
            }
            .article-hero-visual::before {
                content: '';
                position: absolute;
                top: 0; left: 0; right: 0; bottom: 0;
                background: radial-gradient(circle at center, rgba(230, 57, 70, 0.1) 0%, transparent 60%);
            }
            .article-hero-icon {
                font-size: 12rem;
                opacity: 0.2;
                animation: floatIcon 6s ease-in-out infinite;
            }
            @keyframes floatIcon {
                0%, 100% { transform: translateY(0); }
                50% { transform: translateY(-20px); }
            }
            .article-date-badge {
                position: absolute;
                bottom: 4rem;
                left: 4rem;
                background: var(--rouge);
                color: white;
                padding: 1.5rem 2rem;
            }
            .article-date-badge .year {
                font-family: 'Bebas Neue', sans-serif;
                font-size: 4rem;
                line-height: 1;
            }
            .article-date-badge .label {
                font-size: 0.85rem;
                letter-spacing: 2px;
                text-transform: uppercase;
                opacity: 0.9;
            }
            /* Article Content */
            .article-body {
                max-width: 800px;
                margin: 0 auto;
                padding: 4rem 2rem;
            }
            .article-intro {
                font-size: 1.3rem;
                font-weight: 300;
                line-height: 1.9;
                color: var(--text-primary);
                margin-bottom: 3rem;
                padding-bottom: 3rem;
                border-bottom: 1px solid var(--border-color);
            }
            .article-intro strong {
                font-weight: 600;
                color: var(--rouge);
            }
            .article-section {
                margin-bottom: 3rem;
            }
            .section-num {
                font-family: 'Bebas Neue', sans-serif;
                font-size: 5rem;
                color: rgba(230, 57, 70, 0.15);
                line-height: 1;
                margin-bottom: -1.5rem;
            }
            .article-section h2 {
                font-family: 'Montserrat', sans-serif;
                font-size: 1.8rem;
                font-weight: 700;
                margin-bottom: 1.5rem;
                color: var(--text-primary);
            }
            .article-section p {
                font-size: 1.1rem;
                color: var(--text-secondary);
                margin-bottom: 1.5rem;
                line-height: 1.8;
            }
            .article-section strong {
                color: var(--text-primary);
                font-weight: 600;
            }
            /* Included Box */
            .included-box {
                background: linear-gradient(135deg, var(--rouge) 0%, #c62828 100%);
                color: white;
                padding: 2.5rem;
                margin: 3rem 0;
                position: relative;
                overflow: hidden;
            }
            .included-box::before {
                content: '✓';
                position: absolute;
                top: -20px;
                right: 20px;
                font-size: 10rem;
                opacity: 0.1;
                font-weight: 900;
            }
            .included-box-label {
                display: inline-block;
                background: rgba(255,255,255,0.2);
                padding: 0.35rem 1rem;
                font-size: 0.8rem;
                font-weight: 600;
                letter-spacing: 2px;
                text-transform: uppercase;
                margin-bottom: 1rem;
                border-radius: 3px;
            }
            .included-box h3 {
                font-family: 'Montserrat', sans-serif;
                font-size: 1.5rem;
                font-weight: 700;
                margin-bottom: 1rem;
            }
            .included-box p {
                font-size: 1.05rem;
                line-height: 1.7;
                opacity: 0.95;
            }
            .included-box .highlight {
                font-weight: 700;
                text-decoration: underline;
                text-underline-offset: 3px;
            }
            /* Info Cards */
            .info-cards-grid {
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 2rem;
                margin: 3rem 0;
            }
            .info-card-item {
                background: var(--bg-secondary);
                border: 1px solid var(--border-color);
                padding: 2rem;
                position: relative;
            }
            .info-card-item::before {
                content: '';
                position: absolute;
                top: 0; left: 0;
                width: 4px;
                height: 100%;
                background: var(--rouge);
            }
            .info-card-num {
                font-family: 'Bebas Neue', sans-serif;
                font-size: 3rem;
                color: var(--rouge);
                opacity: 0.3;
                position: absolute;
                top: 1rem;
                right: 1.5rem;
            }
            .info-card-item h3 {
                font-family: 'Montserrat', sans-serif;
                font-size: 1.2rem;
                font-weight: 700;
                margin-bottom: 0.5rem;
                color: var(--text-primary);
            }
            .info-card-item > p {
                font-size: 0.9rem;
                color: var(--rouge);
                font-weight: 500;
                margin-bottom: 1rem;
            }
            .info-card-item ul {
                list-style: none;
                padding: 0;
                margin: 0;
            }
            .info-card-item ul li {
                font-size: 0.95rem;
                color: var(--text-secondary);
                padding: 0.5rem 0;
                padding-left: 1.5rem;
                position: relative;
                line-height: 1.5;
            }
            .info-card-item ul li::before {
                content: '→';
                position: absolute;
                left: 0;
                color: var(--rouge);
            }
            /* Highlight Box */
            .highlight-box {
                background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
                color: white;
                padding: 3rem;
                margin: 3rem 0;
                position: relative;
            }
            .highlight-box::before {
                content: '"';
                font-family: 'Bebas Neue', sans-serif;
                font-size: 8rem;
                position: absolute;
                top: -1rem;
                left: 2rem;
                opacity: 0.1;
                color: var(--rouge);
            }
            .highlight-box h3 {
                font-family: 'Montserrat', sans-serif;
                font-size: 1.4rem;
                font-weight: 700;
                margin-bottom: 1rem;
                color: var(--rouge);
            }
            .highlight-box p {
                font-size: 1.1rem;
                line-height: 1.8;
                opacity: 0.9;
            }
            .highlight-box strong {
                color: white;
                font-weight: 600;
            }
            /* Client Section */
            .client-section {
                background: var(--bg-secondary);
                border: 2px solid rgba(230, 57, 70, 0.2);
                padding: 2.5rem;
                margin: 3rem 0;
            }
            .client-section h3 {
                font-family: 'Montserrat', sans-serif;
                font-size: 1.4rem;
                font-weight: 700;
                margin-bottom: 1.5rem;
                color: var(--text-primary);
            }
            .client-section p {
                font-size: 1.05rem;
                color: var(--text-secondary);
                margin-bottom: 1rem;
                line-height: 1.8;
            }
            /* Changes List */
            .changes-list {
                background: var(--bg-secondary);
                padding: 2.5rem;
                margin: 3rem 0;
                border: 1px solid var(--border-color);
            }
            .changes-list h3 {
                font-family: 'Montserrat', sans-serif;
                font-size: 1.4rem;
                font-weight: 700;
                margin-bottom: 2rem;
                color: var(--text-primary);
            }
            .change-item {
                display: flex;
                align-items: flex-start;
                gap: 1.5rem;
                padding: 1.5rem 0;
                border-bottom: 1px solid var(--border-color);
            }
            .change-item:last-child { border-bottom: none; }
            .change-icon {
                width: 50px;
                height: 50px;
                background: var(--bg-tertiary);
                border-radius: 50%;
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 1.5rem;
                flex-shrink: 0;
            }
            .change-content h4 {
                font-size: 1.1rem;
                font-weight: 600;
                margin-bottom: 0.25rem;
                color: var(--text-primary);
            }
            .change-content p {
                font-size: 0.95rem;
                color: var(--text-secondary);
                line-height: 1.6;
            }
            /* Team Section */
            .team-section-article {
                text-align: center;
                padding: 4rem 0;
                border-top: 1px solid var(--border-color);
                margin-top: 4rem;
            }
            .team-section-article h3 {
                font-family: 'Montserrat', sans-serif;
                font-size: 1.6rem;
                font-weight: 700;
                margin-bottom: 1rem;
                color: var(--text-primary);
            }
            .team-section-article > p {
                font-size: 1.1rem;
                color: var(--text-secondary);
                margin-bottom: 2rem;
            }
            .team-names-article {
                display: flex;
                justify-content: center;
                gap: 3rem;
            }
            .team-name-article {
                font-family: 'Montserrat', sans-serif;
                font-size: 1.1rem;
                font-weight: 600;
                color: var(--text-primary);
            }
            .team-name-article span {
                display: block;
                font-size: 0.85rem;
                font-weight: 400;
                color: var(--text-muted);
                margin-top: 0.25rem;
            }
            /* Contact Section */
            .contact-section-article {
                background: var(--bg-secondary);
                padding: 2.5rem;
                margin: 3rem 0;
                text-align: center;
                border: 1px solid var(--border-color);
            }
            .contact-section-article h3 {
                font-family: 'Montserrat', sans-serif;
                font-size: 1.4rem;
                font-weight: 700;
                margin-bottom: 1rem;
                color: var(--text-primary);
            }
            .contact-section-article p {
                font-size: 1.05rem;
                color: var(--text-secondary);
                margin-bottom: 0.5rem;
            }
            /* CTA Section */
            .article-cta {
                background: var(--rouge);
                color: white;
                text-align: center;
                padding: 5rem 2rem;
            }
            .article-cta h2 {
                font-family: 'Bebas Neue', sans-serif;
                font-size: 2.5rem;
                letter-spacing: 2px;
                margin-bottom: 1rem;
            }
            .article-cta p {
                font-size: 1.2rem;
                opacity: 0.9;
                margin-bottom: 2rem;
            }
            .article-cta-buttons {
                display: flex;
                justify-content: center;
                gap: 1rem;
            }
            .btn-article {
                padding: 1rem 2.5rem;
                font-size: 1rem;
                font-weight: 600;
                text-decoration: none;
                transition: all 0.3s;
            }
            .btn-article-white {
                background: white;
                color: var(--rouge);
            }
            .btn-article-white:hover {
                background: var(--noir);
                color: white;
            }
            .btn-article-outline {
                background: transparent;
                color: white;
                border: 2px solid white;
            }
            .btn-article-outline:hover {
                background: white;
                color: var(--rouge);
            }
            /* Responsive Article */
            @media (max-width: 900px) {
                .article-hero-section {
                    grid-template-columns: 1fr;
                    min-height: auto;
                }
                .article-hero-content {
                    padding: 8rem 2rem 4rem;
                }
                .article-hero-visual {
                    height: 300px;
                }
                .article-main-title { font-size: 2rem; }
                .info-cards-grid { grid-template-columns: 1fr; }
                .team-names-article { flex-direction: column; gap: 1.5rem; }
                .article-cta-buttons { flex-direction: column; }
                .article-date-badge {
                    bottom: 2rem;
                    left: 2rem;
                    padding: 1rem 1.5rem;
                }
                .article-date-badge .year { font-size: 2.5rem; }
            }