@font-face {
    font-family: great-vibes;
    src: url(./assets/fonts/GreatVibes-Regular.ttf);
}
:root {
    --rouge-accent: #841d0e;
    --vert-sapin: #1C3A2D;
    --doré: #CBA135;
    --neutre-clair: #F5F2EC;
    --gris-doux: #B5B5B5;
    --texte-principal: #1C3A2D;
    --texte-secondaire: #4F4F4F;
    --font-titre: 'great-vibes', serif;
    --font-corps: 'Open Sans', sans-serif;
}
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
body {
    background-color: var(--neutre-clair);
    color: var(--texte-principal);
    font-family: var(--font-corps);
    line-height: 1.6;
    scroll-behavior: smooth;
}
header {
    height: 100vh;
    width: 100%;
    background: linear-gradient(
    rgba(0, 0, 0, 0.6),
    rgba(0, 0, 0, 0.2)
    ),
    url('./images/accueil.png');
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}
header h1 {
    font-family: var(--font-titre);
    font-size: 8rem;
    color: var(--rouge-accent);
    text-shadow: 2px 2px 8px rgba(0,0,0,0.4);
}
header p.subtitle {
    font-family: var(--font-titre);
    margin: 0 1rem ;
    font-size: 3rem;
    color: var(--doré);
}
.countdown {
    font-family: var(--font-titre);
    font-size: 2rem;
    color: var(--doré);
    margin-top: 1rem;
}
@media (max-width: 768px) {
    header h1 {
    font-size: 2.8rem;
    }
    section {
    padding: 4rem 1rem;
    }
}