       /* Hero Section */
        .hero {
            padding: 6rem 0 4rem;
            text-align: center;
            position: relative;
            /* Pas de background-image ici — voir ::before */
        }

        /* Image de fond : opacity modifiable indépendamment du texte */
        .hero::before {
            content: "";
            position: absolute;
            inset: 0;
            background-image: url('ressources/clouds-97453_1920.jpg');
            background-size: cover;
            background-position: center;
            opacity: 0.2; /* ← Modifier uniquement ici pour l'opacité de l'image */
            z-index: 1;
        }

        /* Overlay dégradé coloré au-dessus de l'image */
        .hero::after {
            content: "";
            position: absolute;
            inset: 0;
            /*background-color:rgba(139, 111, 71, 0.60);	*/
			background-color:rgba(167, 203, 224, 0.50);			
			/*
            background: linear-gradient(
                135deg,
                rgba(200, 230, 215, 0.80) 0%,
                rgba(165, 201, 224, 0.75) 50%,
                rgba(139, 111, 71, 0.50) 100%
            );
			*/
            z-index: 2;
        }

        .hero .container,
        .hero-content {
            position: relative;
            z-index: 3; /* Au-dessus des pseudo-éléments */
        }
        
        .hero-content {
            max-width: 1000px;
            margin: 0 auto;
        }
        
        .hero h1 {
            font-size: 3.2rem;
            color: var(--marron);
            margin-bottom: 1.5rem;
            line-height: 1.2;
        }

        @media (max-width: 768px) {
            .hero h1 {
                font-size: 2.1rem;
            }
        }

        @media (max-width: 480px) {
            .hero h1 {
                font-size: 1.7rem;
            }
        }
        
        .hero .subtitle {
            font-size: 1.4rem;
            color: var(--gris-fonce);
            margin-bottom: 2.5rem;
            font-style: italic;
        }
        
        .hero .cta-buttons {
            display: flex;
            gap: 1.5rem;
            justify-content: center;
            flex-wrap: wrap;
			
        }