* {
    box-sizing: border-box;                            /* Inclut bordures/paddings dans la taille */
    margin: 0;                                         /* Supprime les marges externes par défaut */
    padding: 0;                                        /* Supprime les marges internes par défaut */
}

:root {
    --bg-dark: #121212;                                /* Couleur de fond principal sombre */
    --bg-card: #1e1117;                                /* Fond pour cartes / blocs */
    --bordeaux-dark: #4a0d1b;                          /* Variante bordeaux très foncée */
    --bordeaux-main: #6b1426;                          /* Couleur bordeaux principale */
    --bordeaux-light: #942138;                         /* Variante bordeaux claire */
    --bordeaux-bright: #b82d49;                        /* Bordeaux vif pour accents */
    --text-main: #f5f5f5;                              /* Couleur du texte principal */
    --text-muted: #bfb0b5;                             /* Couleur de texte secondaire */
    --border-color: #521522;                           /* Couleur de bordure par défaut */
    --font-family: Verdana, sans-serif;                /* Police globale */
}

body {
    background-color: var(--bg-dark);                  /* Applique le fond sombre */
    color: var(--text-main);                           /* Applique la couleur de texte */
    font-family: var(--font-family);                   /* Applique la police globale */
    min-height: 100vh;                                 /* Force la hauteur à 100% de l'écran */
    display: flex;                                     /* Active Flexbox */
    flex-direction: column;                            /* Empile les éléments verticalement */
    margin: 0;                                         /* Sécurité pour la marge du body */
}

.header-global {
    width: 100%;                                       /* Occupe toute la largeur */
    background: linear-gradient(180deg, var(--bordeaux-dark) 0%, #20050c 100%); /* Dégradé bordeaux */
    border-bottom: 2px solid var(--bordeaux-main);     /* Ligne de séparation basse */
    padding: 1.5rem 2rem;                              /* Espacement interne */
    display: flex;                                     /* Alignement horizontal */
    align-items: center;                               /* Aligne le contenu verticalement */
    justify-content: space-between;                    /* Espacement aux extrémités */
    position: relative;                                /* Repère pour positionnement enfant */
}

.header-container {
    text-align: center;                                /* Centre le texte */
    flex-grow: 1;                                      /* Prend tout l'espace disponible */
}

.header-container h1 {
    font-size: 1.8rem;                                 /* Taille du titre */
    color: #ffffff;                                    /* Couleur blanche */
    letter-spacing: 1px;                               /* Espacement des lettres */
}

.header-container p {
    color: var(--text-muted);                          /* Couleur atténuée */
    font-size: 0.9rem;                                 /* Taille réduite */
    margin-top: 0.3rem;                                /* Marge au-dessus */
}

.btn-back-home {
    background-color: var(--bordeaux-main);            /* Couleur de fond */
    color: white;                                      /* Texte blanc */
    border: 1px solid var(--bordeaux-light);           /* Bordure fine */
    padding: 0.6rem 1.2rem;                            /* Taille du bouton */
    border-radius: 6px;                                /* Coins arrondis */
    cursor: pointer;                                   /* Curseur en main */
    text-decoration: none;                             /* Supprime le soulignement */
    font-size: 0.85rem;                                /* Taille du texte */
    font-weight: bold;                                 /* Texte en gras */
    transition: background-color 0.2s, transform 0.1s; /* Animation fluide */
}

.btn-back-home:hover {
    background-color: var(--bordeaux-light);           /* Fond éclairci au survol */
    border: 1px solid var(--bordeaux-light);           /* Bordure au survol */
    border-radius: 6px;                                /* Maintient l'arrondi */
    /* transform: translateY(-1px); */                 /* Effet de levée désactivé */
}

footer {
    margin-top: auto;                                  /* Pousse le footer en bas (flexbox) */
    padding: 1rem;                                     /* Espacement interne */
    text-align: center;                                /* Texte centré */
    background-color: #0a0406;                         /* Fond très sombre */
    border-top: 1px solid #2a0a12;                     /* Ligne de séparation haute */
    color: var(--text-muted);                          /* Texte discret */
    font-size: 0.8rem;                                 /* Petite taille */
}