/* === RESET & VARIABLES === */
        * { margin: 0; padding: 0; box-sizing: border-box; }
        :root {
            --primary: #D3212D;
            --primary-dark: #7C0A02;
            --bg-dark: #1a1a1a;
            --bg-darker: #111111;
            --text-main: #333333;
            --text-light: #666666;
            --white: #ffffff;
            --shadow: 0 4px 20px rgba(0,0,0,0.25);
            --radius: 12px;
            --transition: all 0.3s ease;
        }
        body { 
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; 
            color: var(--text-main); 
            background: var(--bg-dark); 
            line-height: 1.6; 
            overflow-x: hidden;
        }
        
        /* === CONTENEUR PRINCIPAL === */
        .container { 
            max-width: 1280px; 
            margin: 0 auto; 
            padding: 0 40px; 
            width: 100%;
        }
        
        /* === HEADER === */
        .site-header { 
            background: var(--bg-darker); 
            padding: 15px 0; 
            position: sticky; 
            top: 0; 
            z-index: 100; 
            border-bottom: 2px solid var(--primary); 
        }
        .header-content { 
            display: flex; 
            justify-content: space-between; 
            align-items: center; 
        }
        .logo img { 
            height: 50px; 
            width: auto; 
            filter: drop-shadow(0 2px 6px rgba(0,0,0,0.4)); 
        }
        .main-nav { 
            display: flex; 
            gap: 25px; 
            align-items: center; 
        }
        .main-nav a { 
            color: #cccccc; 
            text-decoration: none; 
            font-size: 15px; 
            font-weight: 500; 
            transition: color 0.2s; 
        }
        .main-nav a:hover, .main-nav a.active { 
            color: var(--primary); 
        }
        .nav-spaces { 
            display: flex; 
            gap: 15px; 
            border-left: 1px solid #444; 
            padding-left: 20px; 
            margin-left: 10px; 
        }
        .mobile-menu-btn { 
            display: none; 
            background: none; 
            border: none; 
            color: var(--white); 
            font-size: 26px; 
            cursor: pointer; 
        }
        
        /* === HERO === */
        .hero { 
            background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%); 
            color: var(--white); 
            padding: 80px 0; 
            text-align: center; 
        }
        .hero h1 { 
            font-size: 2.8em; 
            margin: 0 0 15px; 
            text-transform: uppercase; 
            letter-spacing: 1px; 
            line-height: 1.1; 
        }
        .hero p { 
            font-size: 1.25em; 
            opacity: 0.95; 
            margin-bottom: 30px; 
            max-width: 750px; 
            margin-left: auto; 
            margin-right: auto; 
        }
        .hero-ctas { 
            display: flex; 
            gap: 15px; 
            justify-content: center; 
            flex-wrap: wrap; 
        }
        .hero-logo { 
            flex-shrink: 0; 
            margin-left: 30px; 
        }
        .hero-logo img {
            width: 150px;
            height: auto;
            border-radius: 8px;
            filter: drop-shadow(0 4px 8px rgba(0,0,0,0.3));
        }
        
        /* === BOUTONS === */
        .btn { 
            padding: 14px 28px; 
            border-radius: 8px; 
            text-decoration: none; 
            font-weight: 600; 
            font-size: 16px; 
            transition: var(--transition); 
            display: inline-flex; 
            align-items: center; 
            gap: 8px; 
        }
        .btn-primary { 
            background: var(--white); 
            color: var(--primary); 
        }
        .btn-primary:hover { 
            background: #f0f0f0; 
            transform: translateY(-2px); 
            box-shadow: 0 6px 20px rgba(0,0,0,0.25); 
        }
        .btn-secondary { 
            background: rgba(0,0,0,0.35); 
            color: var(--white); 
            border: 2px solid var(--white); 
        }
        .btn-secondary:hover { 
            background: var(--white); 
            color: var(--primary); 
            transform: translateY(-2px); 
        }
        .btn-outline { 
            background: transparent; 
            color: var(--primary); 
            border: 2px solid var(--primary); 
        }
        .btn-outline:hover { 
            background: var(--primary); 
            color: var(--white); 
        }
        
        /* === OPPORTUNITÉS (TIKTOK COPY) === */
        .opportunities { 
            padding: 70px 0; 
            background: var(--bg-darker); 
            border-top: 3px solid var(--primary);
            border-bottom: 3px solid var(--primary);
        }
        .opp-header { 
            text-align: center; 
            margin-bottom: 40px; 
        }
        .opp-header h2 { 
            color: var(--white); 
            font-size: 2.2em; 
            margin-bottom: 10px; 
        }
        .opp-header .subtitle { 
            color: #ff6b6b; 
            font-weight: 600; 
            font-size: 1.3em; 
            margin-bottom: 20px; 
        }
        .opp-grid { 
            display: grid; 
            grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); 
            gap: 25px; 
            margin-bottom: 40px; 
        }
        .opp-card { 
            background: var(--white); 
            padding: 25px; 
            border-radius: var(--radius); 
            border-left: 4px solid var(--primary); 
            box-shadow: var(--shadow); 
        }
        .opp-card h4 { 
            color: var(--primary); 
            margin-bottom: 12px; 
            font-size: 1.15em; 
        }
        .opp-card ul { 
            list-style: none; 
            padding-left: 0; 
        }
        .opp-card li { 
            margin-bottom: 8px; 
            font-size: 0.95em; 
            color: var(--text-light); 
        }
        .opp-card li::before { 
            content: "✓ "; 
            color: var(--primary); 
            font-weight: bold; 
            margin-right: 5px; 
        }
        .cta-box { 
            background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%); 
            color: var(--white); 
            padding: 30px; 
            border-radius: var(--radius); 
            text-align: center; 
            margin-top: 20px; 
        }
        .cta-box p { 
            margin-bottom: 20px; 
            font-size: 1.1em; 
        }
        .contact-info { 
            display: flex; 
            justify-content: center; 
            gap: 25px; 
            flex-wrap: wrap; 
            margin-top: 15px; 
        }
        .contact-item { 
            display: flex; 
            align-items: center; 
            gap: 8px; 
            font-size: 1.05em; 
        }
        .contact-item a { 
            color: var(--white); 
            text-decoration: none; 
            font-weight: 600; 
        }
        .contact-item a:hover { 
            text-decoration: underline; 
        }
        
        /* === GALERIE TRACTEURS (NOUVEAU) === */
        .tractors-showcase {
            padding: 60px 0;
            background: var(--bg-dark);
        }
        .showcase-header {
            text-align: center;
            margin-bottom: 40px;
        }
        .showcase-header h2 {
            color: var(--white);
            font-size: 2em;
            margin-bottom: 15px;
        }
        .showcase-header .fire {
            color: #ff6b6b;
            font-size: 1.5em;
            margin-bottom: 20px;
        }
        .showcase-intro {
            color: #ccc;
            max-width: 900px;
            margin: 0 auto 30px;
            font-size: 1.05em;
            line-height: 1.7;
        }
        .brands-list {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            gap: 10px;
            margin: 20px 0;
        }
        .brand-badge {
            background: rgba(211, 33, 45, 0.2);
            color: var(--white);
            padding: 6px 14px;
            border-radius: 16px;
            font-size: 0.9em;
            border: 1px solid var(--primary);
        }
        .features-benefits {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
            gap: 15px;
            margin: 30px 0;
            text-align: left;
        }
        .feature-item {
            background: rgba(255,255,255,0.05);
            padding: 15px;
            border-radius: 8px;
            border-left: 3px solid var(--primary);
        }
        .feature-item strong {
            color: var(--primary);
            display: block;
            margin-bottom: 5px;
        }
        .feature-item span {
            color: #aaa;
            font-size: 0.95em;
        }
        
        /* Carrousel optimisé mobile */
        .tractor-carousel {
            position: relative;
            margin: 40px 0;
            overflow: hidden;
            border-radius: var(--radius);
            background: var(--bg-darker);
            padding: 20px 0;
        }
        .carousel-track {
            display: flex;
            gap: 20px;
            transition: transform 0.5s ease;
            cursor: grab;
        }
        .carousel-track:active {
            cursor: grabbing;
        }
        .tractor-card {
            flex: 0 0 calc(33.333% - 14px);
            min-width: 280px;
            background: var(--white);
            border-radius: 8px;
            overflow: hidden;
            box-shadow: var(--shadow);
            transition: transform 0.3s;
        }
        .tractor-card:hover {
            transform: translateY(-5px);
        }
        .tractor-card img {
            width: 100%;
            height: 220px;
            object-fit: cover;
            display: block;
        }
        .tractor-info {
            padding: 15px;
            text-align: center;
        }
        .tractor-info h4 {
            color: var(--primary);
            font-size: 1.1em;
            margin-bottom: 5px;
        }
        .tractor-info p {
            color: var(--text-light);
            font-size: 0.9em;
        }
        .carousel-controls {
            display: flex;
            justify-content: center;
            gap: 15px;
            margin-top: 20px;
        }
        .carousel-btn {
            background: var(--primary);
            color: var(--white);
            border: none;
            width: 45px;
            height: 45px;
            border-radius: 50%;
            cursor: pointer;
            font-size: 1.2em;
            transition: var(--transition);
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .carousel-btn:hover {
            background: var(--primary-dark);
            transform: scale(1.1);
        }
        .carousel-dots {
            display: flex;
            justify-content: center;
            gap: 8px;
            margin-top: 15px;
        }
        .dot {
            width: 10px;
            height: 10px;
            border-radius: 50%;
            background: #555;
            cursor: pointer;
            transition: var(--transition);
        }
        .dot.active {
            background: var(--primary);
            width: 30px;
            border-radius: 5px;
        }
        
        /* Responsive carousel */
        @media (max-width: 900px) {
            .tractor-card {
                flex: 0 0 calc(50% - 10px);
                min-width: 250px;
            }
        }
        @media (max-width: 600px) {
            .tractor-card {
                flex: 0 0 100%;
            }
            .carousel-controls {
                gap: 30px;
            }
            .carousel-btn {
                width: 50px;
                height: 50px;
                font-size: 1.4em;
            }
            .features-benefits {
                grid-template-columns: 1fr;
            }
        }
        
        /* === COMMENT ÇA MARCHE === */
        .steps { 
            padding: 70px 0; 
            background: var(--bg-dark); 
        }
        .section-title { 
            text-align: center; 
            color: var(--white); 
            font-size: 2.2em; 
            margin-bottom: 45px; 
        }
        .steps-grid { 
            display: grid; 
            grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); 
            gap: 30px; 
        }
        .step-card { 
            background: var(--white); 
            padding: 30px 20px; 
            border-radius: var(--radius); 
            text-align: center; 
            box-shadow: var(--shadow); 
            border-top: 4px solid var(--primary); 
            transition: transform 0.25s; 
        }
        .step-card:hover { 
            transform: translateY(-6px); 
        }
        .step-icon { 
            font-size: 42px; 
            margin-bottom: 15px; 
            display: block; 
        }
        .step-card h3 { 
            color: var(--primary); 
            margin: 10px 0 10px; 
            font-size: 1.2em; 
        }
        .step-card p { 
            color: var(--text-light); 
            font-size: 0.95em; 
            margin: 0; 
        }
        
        /* === MARQUES & ÉQUIPEMENTS (SEO) === */
        .brands-section { 
            padding: 60px 0; 
            background: var(--bg-darker); 
        }
        .brands-grid { 
            display: flex; 
            flex-wrap: wrap; 
            justify-content: center; 
            gap: 12px; 
            margin-top: 25px; 
        }
        .brand-tag { 
            background: var(--white); 
            color: var(--text-main); 
            padding: 8px 16px; 
            border-radius: 20px; 
            font-size: 0.9em; 
            font-weight: 500; 
            transition: var(--transition); 
            border: 1px solid #ddd; 
        }
        .brand-tag:hover { 
            background: var(--primary); 
            color: var(--white); 
            border-color: var(--primary); 
            transform: translateY(-2px); 
        }
        .equipment-list { 
            display: flex; 
            flex-wrap: wrap; 
            justify-content: center; 
            gap: 10px; 
            margin-top: 20px; 
        }
        .equip-tag { 
            background: rgba(211, 33, 45, 0.15); 
            color: var(--primary); 
            padding: 6px 14px; 
            border-radius: 16px; 
            font-size: 0.85em; 
            border: 1px solid var(--primary); 
        }
        
        /* === RÉSEAU D'AGENTS === */
        .network { 
            padding: 70px 0; 
            background: var(--bg-dark); 
        }
        .network-content { 
            display: flex; 
            gap: 50px; 
            align-items: center; 
            flex-wrap: wrap; 
        }
        .network-text { 
            flex: 1; 
            min-width: 300px; 
            color: #cccccc; 
        }
        .network-text h2 { 
            color: var(--white); 
            margin-bottom: 20px; 
            font-size: 2em; 
        }
        .network-text p { 
            font-size: 1.1em; 
            margin-bottom: 20px; 
        }
        .features-list { 
            list-style: none; 
            padding: 0; 
            margin: 0 0 25px; 
        }
        .features-list li { 
            margin-bottom: 12px; 
            font-size: 1.05em; 
        }
        .network-visual { 
            flex: 1; 
            min-width: 300px; 
        }
        .map-placeholder { 
            background: #1a1a1a; 
            border: 2px dashed #444; 
            border-radius: var(--radius); 
            height: 280px; 
            display: flex; 
            align-items: center; 
            justify-content: center; 
            color: #666; 
            font-size: 1.2em; 
            text-align: center; 
            padding: 25px; 
        }
        
        /* === FOOTER === */
        .site-footer { 
            background: #0a0a0a; 
            color: #999999; 
            padding: 50px 0 25px; 
            border-top: 3px solid var(--primary); 
        }
        .footer-grid { 
            display: grid; 
            grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); 
            gap: 35px; 
            margin-bottom: 35px; 
        }
        .footer-brand h3 { 
            color: var(--white); 
            margin: 0 0 10px; 
            font-size: 1.3em; 
        }
        .footer-col h4 { 
            color: var(--white); 
            margin: 0 0 15px; 
            font-size: 1.1em; 
        }
        .footer-col a { 
            display: block; 
            color: #999; 
            text-decoration: none; 
            margin-bottom: 8px; 
            transition: 0.2s; 
        }
        .footer-col a:hover { 
            color: var(--primary); 
        }
        .social-icons { 
            display: flex; 
            gap: 10px; 
        }
        .social-icons a { 
            background: #222; 
            color: var(--white); 
            width: 40px; 
            height: 40px; 
            border-radius: 50%; 
            display: flex; 
            align-items: center; 
            justify-content: center; 
            text-decoration: none; 
            font-weight: bold; 
            transition: 0.2s; 
            font-size: 14px; 
        }
        .social-icons a:hover { 
            background: var(--primary); 
        }
        .copyright { 
            text-align: center; 
            padding-top: 20px; 
            border-top: 1px solid #333; 
            font-size: 0.9em; 
        }
        
        /* === RESPONSIVE === */
        @media (max-width: 900px) {
            .hero h1 { font-size: 2em; }
            .hero p { font-size: 1.1em; }
            .container { padding: 0 25px; }
            .hero-logo { margin-left: 0; margin-top: 20px; }
        }
        @media (max-width: 768px) {
            .main-nav { 
                display: none; 
                position: absolute; 
                top: 100%; 
                left: 0; 
                right: 0; 
                background: #111; 
                flex-direction: column; 
                padding: 25px; 
                gap: 18px; 
                border-bottom: 2px solid var(--primary); 
            }
            .main-nav.active { display: flex; }
            .nav-spaces { 
                border-left: none; 
                padding-left: 0; 
                margin-left: 0; 
                flex-direction: column; 
                width: 100%; 
                text-align: center; 
            }
            .mobile-menu-btn { display: block; }
            .hero { padding: 60px 0; }
            .hero h1 { font-size: 1.8em; }
            .hero-ctas { flex-direction: column; align-items: center; }
            .btn { width: 100%; max-width: 300px; justify-content: center; }
            .network-content { flex-direction: column; }
            .network-text h2 { text-align: center; }
            .contact-info { flex-direction: column; gap: 12px; }
            .showcase-header h2 { font-size: 1.6em; }
            .showcase-header .fire { font-size: 1.2em; }
        }
        
        /* === SOCIAL ICONS === */
        .social-links { display: flex; gap: 12px; }
        .social-links a { color: white; font-size: 1.3rem; transition: var(--transition); }
        .social-links a:hover { color: var(--primary); transform: translateY(-3px); }
		@font-face{font-family:"Font Awesome 6 Brands";font-style:normal;font-weight:400;font-display:block;src:url(../webfonts/fa-brands-400.woff2) format("woff2"),url(../webfonts/fa-brands-400.ttf) format("truetype")}
        .fa-brands, .fab { font-family: "Font Awesome 6 Brands"; font-weight: 400; }
        .fab { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; display: inline-block; font-style: normal; font-variant: normal; line-height: 1; text-rendering: auto; }
        .fa-facebook:before{content:"\f09a"} .fa-facebook-f:before{content:"\f39e"}
        .fa-instagram:before{content:"\f16d"} .fa-tiktok:before{content:"\e07b"} 
		.fa-youtube:before{content:"\f167"}
		
		/* Flags marketplace */
	.marketplace-flags {
		display: flex;
		gap: 8px;
		flex-wrap: wrap;
		margin: 10px 0;
	}

	.flag-badge {
		display: inline-flex;
		align-items: center;
		gap: 5px;
		padding: 4px 10px;
		border-radius: 12px;
		font-size: 0.8em;
		font-weight: 600;
		white-space: nowrap;
	}

	.flag-option-achat {
		background: #fff3cd;
		color: #856404;
		border: 1px solid #ffc107;
	}

	.flag-tres-demande {
		background: #f8d7da;
		color: #721c24;
		border: 1px solid #dc3545;
	}