/* Variables globales (couleurs, polices, radius)*/
 :root {
     --background-color: #f8f7f5;
     --text-color: #252525;
     --title-font: 'Georgia', serif;
     --text-font: 'Poppins', sans-serif;
     --title-size: 3rem;
     --font-size: 0.8rem;
 }

 /* Style général de la page (body) */

 body {
     min-height: 100vh;
     font-family: var(--text-font);
     color: var(--text-color);
     background: var(--background-color);
     display: flex;
     flex-direction: column;
 }

 /* Disposition sur la page (flexbox) */

 main {
     flex: 1;
     display: flex;
     flex-direction: column;
     justify-content: center;
     align-items: center;
     text-align: center;
     padding: 2rem;
 }

 h1 {
     font-family: var(--title-font);
     font-size: var(--title-size);
     font-weight: 400;
     letter-spacing: 0.02em;
     margin-bottom: 2rem;
 }

 p {
     font-size: var(--font-size);
     text-transform: uppercase;
     letter-spacing: 0.35em;
     font-weight: 400;
 }

 footer {
     height: 70px;
     background: var(--text-color);
     display: flex;
     justify-content: center;
     align-items: center;
 }


 /* Responsive Design */
 @media (max-width: 768px) {
     main {
         padding: 1rem;
     }

     h1 {
         font-size: 2rem;
     }
 }