@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;1,400&family=Lato:wght@300;400;700&display=swap');

* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:'Lato',sans-serif; background-color:#f3eeea; color:#5c4333; }

/* ===== NAVBAR ===== */
.navbar { background-color:#7a5a47; display:flex; justify-content:space-between; align-items:center; padding:14px 30px; position:sticky; top:0; z-index:100; gap:20px; }
.nav-logo-img { height:48px; width:auto; }
.nav-user-nom { color:white; font-size:14px; font-weight:700; white-space:nowrap; }
.nav-user-role { font-weight:400; opacity:0.75; font-size:12px; margin-left:4px; }
.nav-links { display:flex; align-items:center; gap:24px; flex-wrap:wrap; }
.nav-links a { color:white; text-decoration:none; font-size:15px; font-weight:400; letter-spacing:0.5px; transition:opacity 0.2s; }
.nav-links a:hover { opacity:0.75; }
.btn-login { background-color:#c59a7c; color:white !important; padding:8px 20px; border-radius:25px; font-weight:700 !important; transition:background-color 0.2s !important; }
.btn-login:hover { background-color:#b08060 !important; opacity:1 !important; }
.btn-logout { background-color:#c0392b; color:white !important; padding:8px 18px; border-radius:25px; font-weight:700 !important; font-size:13px !important; transition:background-color 0.2s !important; }
.btn-logout:hover { background-color:#a93226 !important; opacity:1 !important; }

/* BURGER */
.burger { display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:4px; }

/* ===== BOUTONS CTA ===== */
.btn-cta { display:inline-block; background-color:#7a5a47; color:white !important; padding:16px 36px; border-radius:30px; font-size:17px; font-weight:700; text-decoration:none; margin-top:10px; transition:background-color 0.2s, transform 0.2s; }
.btn-cta:hover { background-color:#5c4333; transform:translateY(-2px); }
.btn-cta-outline { display:inline-block; background-color:transparent; color:#7a5a47; padding:14px 30px; border-radius:30px; font-size:16px; font-weight:700; text-decoration:none; border:2px solid #7a5a47; margin-top:10px; transition:all 0.2s; }
.btn-cta-outline:hover { background-color:#7a5a47; color:white; transform:translateY(-2px); }

/* ===== HEADER ===== */
.header { background-color:#c59a7c; text-align:center; padding:16px; }
.logo { width:420px; max-width:90%; }

/* ===== SLIDER ===== */
.bandeau-images { background-color:#f3eeea; overflow:hidden; padding:24px 0; }
.slider { display:flex; width:max-content; animation:defilement 25s linear infinite; }
.slider img { width:240px; height:360px; object-fit:cover; margin:0 10px; border-radius:8px; }
@keyframes defilement { 0%{transform:translateX(0);} 100%{transform:translateX(-50%);} }

/* ===== CONTENU ===== */
.contenu { padding:60px 40px; text-align:center; max-width:900px; margin:auto; }
.contenu h1 { font-family:'Playfair Display',serif; font-size:42px; color:#7a5a47; margin-bottom:20px; }
.contenu p { font-size:18px; line-height:1.8; color:#7a6055; max-width:700px; margin:auto; }

/* ===== AVANTAGES ACCUEIL ===== */
.section-avantages { display:flex; flex-wrap:wrap; gap:24px; justify-content:center; padding:40px; max-width:1000px; margin:0 auto 40px; }
.avantage-card { background:white; border-radius:12px; padding:30px 24px; width:260px; text-align:center; box-shadow:0 2px 12px rgba(122,90,71,0.10); transition:transform 0.2s; }
.avantage-card:hover { transform:translateY(-4px); }
.avantage-icone { font-size:36px; display:block; margin-bottom:14px; }
.avantage-card h3 { font-family:'Playfair Display',serif; font-size:18px; color:#7a5a47; margin-bottom:10px; }
.avantage-card p { font-size:14px; color:#7a6055; line-height:1.7; }

/* ===== CARDS ABOUT ===== */
.section-about { display:flex; flex-wrap:wrap; gap:40px; justify-content:center; padding:50px 40px; max-width:1100px; margin:auto; }
.card-about { background:white; border-radius:12px; padding:36px 30px; width:280px; text-align:center; box-shadow:0 2px 12px rgba(122,90,71,0.10); }
.card-about h3 { font-family:'Playfair Display',serif; font-size:22px; color:#7a5a47; margin-bottom:12px; }
.card-about p { font-size:15px; color:#7a6055; line-height:1.7; }

/* ===== CONTACT ===== */
.section-contact { background-color:#7a5a47; color:white; padding:60px 40px; text-align:center; }
.section-contact h2 { font-family:'Playfair Display',serif; font-size:32px; margin-bottom:16px; }
.section-contact p { font-size:17px; margin-bottom:8px; opacity:0.9; }

/* ===== LOCATIONS ===== */
.section-locations { display:flex; flex-wrap:wrap; gap:30px; justify-content:center; padding:50px 40px; max-width:1200px; margin:auto; }
.card-location { background:white; border-radius:12px; width:320px; overflow:hidden; box-shadow:0 2px 12px rgba(122,90,71,0.10); transition:transform 0.2s; }
.card-location:hover { transform:translateY(-4px); }
.card-location img { width:100%; height:200px; object-fit:cover; }
.card-location-info { padding:20px; }
.card-location h3 { font-family:'Playfair Display',serif; font-size:20px; color:#7a5a47; margin-bottom:8px; }
.card-location p { font-size:14px; color:#7a6055; line-height:1.6; margin-bottom:12px; }
.card-location .prix { font-weight:700; color:#c59a7c; font-size:16px; }

/* ===== STATUTS ===== */
.statut { padding:4px 12px; border-radius:20px; font-size:12px; font-weight:700; }
.statut.en_attente { background:#fff3cd; color:#856404; }
.statut.confirme   { background:#d1e7dd; color:#0f5132; }
.statut.annule     { background:#f8d7da; color:#842029; }

/* ===== MESSAGES ===== */
.message-ok { background:#d1e7dd; color:#0f5132; padding:14px 20px; border-radius:8px; margin-bottom:20px; font-weight:700; font-size:14px; border-left:4px solid #0f5132; }
.message-erreur { background:#fde8e8; color:#c0392b; padding:14px 20px; border-radius:8px; margin-bottom:20px; font-weight:700; font-size:14px; border-left:4px solid #c0392b; }

/* ===== FOOTER ===== */
footer { background-color:#5c4333; color:#e8ddd5; text-align:center; padding:24px; font-size:14px; margin-top:60px; }

/* ===== RESPONSIVE ===== */
@media (max-width:768px) {
    .burger { display:flex; }
    .nav-links { display:none; position:absolute; top:76px; right:0; left:0; background-color:#7a5a47; flex-direction:column; padding:20px 30px; gap:18px; box-shadow:0 4px 12px rgba(0,0,0,0.15); }
    .nav-links.open { display:flex; }
    .nav-links a { font-size:17px; }
    .contenu h1 { font-size:30px; }
    .slider img { width:160px; height:240px; }
    .nav-user { display:none; }
}