/* CONFIGURATION GÉNÉRALE */
:root {
    --navy: #00204A;
    --cream: #F5F5DC;
    --fade-duration: 3s; 
}

* { box-sizing: border-box; }

body, html { 
    margin: 0; padding: 0; 
    height: 100%; width: 100%;
    overflow: hidden;
    background-color: var(--navy); 
    font-family: 'Helvetica Neue', Arial, sans-serif; 
    position: fixed; 
}

/* COUCHES D'ARRIÈRE-PLAN */
#background-container, #overlay { 
    position: absolute; 
    top: 0; left: 0; 
    width: 100%; height: 100%; 
    z-index: 1;
    overflow: hidden;
}

#overlay { 
    background: linear-gradient(to bottom, rgba(0,32,74,0.3), rgba(0,32,74,0.8)); 
    z-index: 2; pointer-events: none;
    opacity: 1; 
    transition: opacity var(--fade-duration) ease-in-out;
}
#overlay.hidden { opacity: 0; }

/* SLIDES */
.slide {
    position: absolute; top: 0; left: 0; 
    width: 100%; height: 100%;
    object-fit: cover; opacity: 0; 
    transition: opacity var(--fade-duration) ease-in-out;
    will-change: opacity, transform;
}
.slide.visible { opacity: 1; }

/* CONTENEUR PRINCIPAL */
#main-wrapper {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    z-index: 3;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 20px;
}

#content { 
    text-align: center; 
    color: var(--cream); 
    width: 100%; 
    max-width: 900px;
    flex-shrink: 0; 
}

/* CHORÉGRAPHIES */
.anim-zoom { animation: zoomIn 25s infinite alternate linear; }
@keyframes zoomIn { 0% { transform: scale(1); } 100% { transform: scale(1.15); } }

.anim-pan-up { animation: panUp 30s infinite alternate linear; }
@keyframes panUp { 0% { transform: scale(1.1) translate(0, 0); } 100% { transform: scale(1.1) translate(0, -10%); } }

.anim-pan-down { animation: panDown 30s infinite alternate linear; }
@keyframes panDown { 0% { transform: scale(1.1) translate(0, 0); } 100% { transform: scale(1.1) translate(0, 10%); } }

.anim-panorama-travel { animation: panoramaFlow 25s infinite linear; }
@keyframes panoramaFlow {
    0% { object-position: 100% center; transform: scale(1); }
    100% { object-position: 0% center; transform: scale(1.05); }
}

/* --- TYPOGRAPHIE & LOGO --- */

/* Logo (Inchangé) */
#logo-svg { 
    width: max(130px, 22vmin); 
    height: auto; 
    margin-bottom: 5vh; /* Un peu plus d'espace avant les titres */
    filter: drop-shadow(0 5px 15px rgba(0,0,0,0.5)); 
    max-height: 35vh; 
}

/* LES TITRES PRINCIPAUX (Recherche + Négociation) */
/* Ils partagent le même style pour être sur un pied d'égalité */
.main-title { 
    font-family: 'Helvetica Neue', Arial, sans-serif;
    font-size: clamp(1.4rem, 3.5vw, 2.2rem); /* Taille statutaire */
    font-weight: 600; /* Semi-Bold pour l'assise */
    text-transform: uppercase; /* Le côté "Institution"  */
    letter-spacing: 4px; /* Un peu d'air entre les lettres */
    margin: 5px 0; /* Très peu d'espace entre les deux lignes pour les grouper */
    line-height: 1.2;
    opacity: 1; /* Pleine visibilité */
}

/* Le Séparateur */
.divider { 
    width: 40px; /* Plus court, plus discret */
    height: 1px; 
    background-color: #4A90E2; /* Bleu clair */
    margin: 25px auto; /* Espace avant le slogan */
    opacity: 0.7;
}

/* LE SLOGAN (La touche subtile) */
.slogan {
    font-size: clamp(0.9rem, 2vw, 1.1rem); /* Plus petit que les titres */
    font-weight: 300; /* Light / Fin */
    font-style: italic; /* Optionnel : donne un côté "citation" ou "mission" */
    color: #F5F5DC; /* Crème */
    opacity: 0.6; /* LA TRANSPARENCE DEMANDÉE (60%) */
    margin: 0 0 35px 0;
    letter-spacing: 0.5px;
}

/* L'Adresse (Inchangée) */
p.address { 
    font-size: 0.8rem; opacity: 0.8; 
    font-family: monospace; line-height: 1.6;
}
						
/* Style spécifique pour le lien email dans l'adresse */
p.address a {
    color: #4A90E2;          /* Le code couleur exact de votre séparateur (.divider) */
    text-decoration: none;   /* Supprime le soulignement */
    font-weight: 500;        /* Un tout petit peu plus gras pour la lisibilité */
    transition: opacity 0.3s ease; /* Transition douce */
}

/* Petit effet au survol pour garder l'aspect interactif */
p.address a:hover {
    opacity: 0.8;            /* S'éclaircit légèrement quand on passe la souris dessus */
    /* text-decoration: underline;  <-- Décommentez cette ligne si vous voulez que le soulignement réapparaisse uniquement au survol */
}

/* PIED DE PAGE LÉGAL */
.legal-footer {
						  
	/*position: absolute; /* On le sort du flux normal */
    /*bottom: 15px;       /* Collé à 15px du bas de l'écran */
    /*left: 0;
    /*width: 100%;        /* Prend toute la largeur */
    /*text-align: center; /* Texte centré */
    /*z-index: 10;        /* S'assure qu'il est au-dessus du fond */
    
    /* Style du texte (inchangé) */
   /* padding: 10px 20px;*/
	/*margin-top: 20;
    padding: 20px;
    border-top: 1px solid rgba(245, 245, 220, 0.2); /* Ligne très fine couleur crème */
						  
	position: absolute;
    bottom: 20px;       /* Décollé du bas de l'écran */
    
    /* LA MAGIE DU CENTRAGE ABSOLU */
    left: 50%;
    transform: translateX(-50%); /* On le déporte de la moitié de sa propre largeur pour le centrer pile poil */
    
    /* ON COPIE LA LARGEUR DU CONTENU (#content) */
    width: 90%;         /* Comme votre bloc #content sur mobile */
    max-width: 800px;   /* La largeur max de lecture (à ajuster si votre content est plus large) */
    
    text-align: center;
    z-index: 10;
    
    /* LE TRAIT DE SÉPARATION */
    border-top: 1px solid rgba(245, 245, 220, 0.3); /* Un trait fin couleur crème, semi-transparent */
    padding-top: 15px;  /* Espace entre le trait et le texte */
}

.legal-footer p {
    font-family: 'Helvetica Neue', Arial, sans-serif;
    font-size: 0.65rem; 
    line-height: 1.5;
    opacity: 0.6; 
    /*text-transform: uppercase;*/
    letter-spacing: 1px;
    margin: 0;
    color: var(--cream);
}

/* --- SPÉCIAL MOBILE PAYSAGE --- */
@media (max-height: 500px) and (orientation: landscape) {
    #logo-svg { width: 90px; margin-bottom: 5px; } 
    
    .main-title { 
        font-size: 1rem; /* On réduit drastiquement */
        margin: 2px 0; 
    }
    
    .divider { margin: 5px auto; }
    
    .slogan { 
        font-size: 0.8rem; 
        margin: 5px 0 10px 0;
    }
    
    p.address { margin-top: 5px; font-size: 0.6rem; }
    .legal-footer { display: none; }
}