/****
    *
    *		@Author [Benoit Hinck]
    *		@Copyright [2007]
    *
    *		@Pagename : base-style.css 
    *
    *		@Revisions
    *			Le 03/11/2025 : Création
    *
    ****/
    
    /* =============================================================== */
    /* ---------------------- VARIABLES GLOBALES --------------------- */
    /* =============================================================== */
    :root {
        --primary:          linear-gradient(135deg, #004080, #037ffa);
        --primary-2:        #F8F5EE;
        --bg-outside:       #E5E2DA;       /* fond extérieur (body) */
        --accent:           #C4A000;
        --danger:           #D9534F;
        --muted:            #F4F4F4;
        --text:             #222;
        --card-bg:          #ffffff;
        --glass:            rgba(255,255,255,0.85);
        --max-width:        1280px;
        --radius:           10px;
        font-family: 'Helvetica Neue', Arial, sans-serif;
        -webkit-font-smoothing:     antialiased;
        -moz-osx-font-smoothing:    grayscale;
    }

    /* =============================================================== */
    /* ------------------------ RESET BASIQUE ------------------------ */
    /* =============================================================== */
    *{
        box-sizing: border-box;
        margin: 0;
        padding: 0;
    }
    
    /* =============================================================== */
    /* -------------------- BODY = fond extérieur -------------------- */
    /* =============================================================== */
    body {
        animation:      fadeInBody 0.8s ease-in;
        background:     var(--bg-outside);
        color:          var(--text);
        font-family:    'Inter', sans-serif;
        scroll-behavior: smooth;
        transition: background-color 0.5s ease;
    }

    /* Animations */
    @keyframes fadeInBody {
        from    { opacity: 0; }
        to      { opacity: 1; }
    }

    body.fade-out {
        animation: fadeOutBody 0.4s ease-out forwards;
    }

    @keyframes fadeOutBody {
        to { opacity: 0; }
    }
    
    .page-title {
        display: flex;
        margin: 0 auto;
        padding: 0 20px;
        padding-top: 40px;
        margin-bottom: 24px;
        text-align: left;
    }

    /* =============================================================== */
    /* ----------------------- WRAPPER CENTRAL ----------------------- */
    /* =============================================================== */
    .wrapper {
        background: var(--primary); /* fond du centre */
        margin: 0 auto;
        max-width: var(--max-width);
        padding: 0 20px 20px 20px;
    }
    
    /* liens / images fade-in */
    a, img {
        opacity: 0;
        animation: fadeInElement 0.8s ease forwards;
    }

    @keyframes fadeInElement {
        to { opacity: 1; }
    }

    /* =============================================================== */