/* --- 1. VARIABLES ISSUES DU JSON --- */
:root {
    --forest: #2d5a27;
    --sand: #f4f1ea;
    --dark-green: #1B2A1E;   /* fond_sombre */
    --accent-green: #869C4A; /* bouton */
    --hover-green: #758A3E;  /* bouton_hover */
    --input-bg: #2A3C2E;     /* fond_input */
}

/* --- 2. CONFIGURATION GÉNÉRALE --- */
html {
    scroll-behavior: smooth;
    overflow-x: hidden;
}

body {
    font-family: 'Inter', sans-serif;
    color: #334155;
    line-height: 1.6;
}

/* Classes utilitaires forcées */
.bg-forest { background-color: var(--forest) !important; }
.text-forest { color: var(--forest) !important; }
.bg-sand { background-color: var(--sand) !important; }

/* --- 3. COMPOSANTS RÉUTILISABLES --- */

.btn-signature {
    display: inline-block;
    border-radius: 2px;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
}

.btn-signature:hover {
    filter: brightness(1.1);
    transform: translateY(-3px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}

/* --- 4. SECTION À PROPOS (Image & Citation) --- */

#about-parallax-container {
    /* Ombrage intense et profond demandé */
    box-shadow: 0 30px 70px rgba(0,0,0,0.5), 0 10px 20px rgba(0,0,0,0.2);
    border-radius: 4px;
    background-color: #f8fafc;
}

#about-signature {
    font-family: 'Lavishly Yours', cursive !important;
    font-weight: 400;
}

/* --- 5. ANIMATIONS & SCROLL EFFECTS --- */

/* Assure la fluidité du parallaxe géré par le JS */
#hero-img-element, #about-img, #parallax-bg-chiffres {
    will-change: transform;
    transition: transform 0.1s ease-out;
}

/* Animation des chiffres clés */
.animated-number {
    display: inline-block;
}

/* --- 6. GALERIE & LIGHTBOX --- */

#lightbox {
    transition: opacity 0.3s ease-in-out;
    background-color: rgba(255, 255, 255, 0.98);
}

.group:hover img {
    transform: scale(1.1);
}

/* --- 7. SLIDER AVIS GOOGLE --- */

#reviews-container {
    display: flex;
    will-change: transform;
    transition: transform 0.5s ease-in-out;
}

/* --- 8. FORMULAIRE DE CONTACT (Couleurs du JSON) --- */

#contact input, #contact select, #contact textarea {
    background-color: var(--input-bg) !important;
    color: white;
    border: 1px solid rgba(255,255,255,0.05);
    border-radius: 2px;
}

#contact input:focus, #contact select:focus, #contact textarea:focus {
    outline: none;
    box-shadow: 0 0 0 1px var(--accent-green);
}

#contact button[type="submit"] {
    background-color: var(--accent-green);
    transition: background-color 0.3s ease;
}

#contact button[type="submit"]:hover {
    background-color: var(--hover-green);
}

/* --- 9. LOGOS & FOOTER --- */

.ynweb-logo {
    filter: brightness(0) invert(1);
    transition: all 0.4s ease;
    opacity: 0.6;
}

.ynweb-link:hover .ynweb-logo {
    filter: brightness(1) invert(0);
    opacity: 1;
    transform: translateY(-2px);
}

#back-to-top {
    transition: all 0.5s ease;
    border-radius: 2px;
}
@media (max-width: 768px) {
    #hero-title {
        font-size: 3.5rem !important; /* Taille plus adaptée aux petits écrans */
        line-height: 1.2;
    }
    
    .py-24 {
        padding-top: 4rem !important;
        padding-bottom: 4rem !important;
    }

    /* Empêcher le scroll horizontal pendant les animations */
    body {
        position: relative;
        overflow-x: hidden;
    }
}
/* À ajouter dans votre fichier CSS */
#apropos {
    overflow-x: hidden; /* Empêche le scroll horizontal pendant l'effet de glisse */
}

/* Optionnel : pour un effet plus doux sur le texte */
#about-text-content {
    will-change: transform, opacity;
}
/* Style du bouton expand */
#expand-img {
    transition: all 0.3s ease;
    opacity: 0.6;
}

#expand-img:hover {
    opacity: 1;
    transform: scale(1.1);
}

/* On s'assure que l'image ne dépasse pas du conteneur lors du zoom */
.flex-1.bg-slate-50 {
    overflow: hidden;
}
@media (max-width: 768px) {
    #lightbox-img {
        /* Indique visuellement que l'image peut être manipulée horizontalement */
        touch-action: pan-y; 
    }
}