/*	===================================================================================================================================================
																\style.css
===================================================================================================================================================*/
/* --- Remise à zéro et typographie --- */
* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; background-color: #f4f7f6; color: #333; display: flex; flex-direction: column; min-height: 100vh; }

/* --- Entête --- */
.header { text-align: center; padding: 2.5rem 1rem 1.5rem; background: #ffffff; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05); }
.header h1 { font-size: 2rem; color: #1a252f; margin-bottom: 0.5rem; }
.header p { color: #7f8c8d; font-size: 1rem; }

/* --- Conteneur & Grille (Max 4 colonnes) --- */
.container { max-width: 1200px; margin: 2rem auto; padding: 0 1.5rem; flex: 1; }
.grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; }

/* --- Adaptation pour tablettes et mobiles --- */
@media (max-width: 992px) { .grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 576px) { .grid { grid-template-columns: 1fr; } }

/* --- Cartes (Cases) --- */
.card { position: relative; background: #ffffff; border-radius: 12px; overflow: hidden; text-decoration: none; color: inherit; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.06); transition: transform 0.3s ease, box-shadow 0.3s ease; display: flex; flex-direction: column; }
.card:hover { transform: translateY(-6px); box-shadow: 0 10px 25px rgba(0, 0, 0, 0.12); }

/* Images des cartes */
.card-image { height: 160px; background-size: cover; background-position: center; transition: transform 0.5s ease; }
.card:hover .card-image { transform: scale(1.05); }

/* Contenu des cartes */
.card-content { padding: 1.25rem; background: #ffffff; z-index: 1; flex-grow: 1; }
.card-content h2 { font-size: 1.15rem; color: #2c3e50; margin-bottom: 0.4rem; }
.card-content p { font-size: 0.85rem; color: #666; line-height: 1.4; }

/* Style spécifique pour la case "À venir" */
.card-disabled { cursor: not-allowed; opacity: 0.8; }
.card-disabled:hover { transform: none; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.06); }
.card-disabled .card-image { filter: grayscale(80%); }
.badge { position: absolute; top: 12px; right: 12px; background-color: #e74c3c; color: #ffffff; font-size: 0.75rem; font-weight: bold; padding: 4px 10px; border-radius: 20px; z-index: 2; text-transform: uppercase; letter-spacing: 0.5px; }

/* --- Pied de page --- */
.footer { text-align: center; padding: 1.5rem; background-color: #ffffff; color: #95a5a6; font-size: 0.85rem; margin-top: 2rem; border-top: 1px solid #eaeaea; }