/* Maquette neutre : les couleurs sont regroupées ici pour être changées en un endroit */
:root{
  --fond:#fffaf5; --surface:#ffffff; --bord:#f0e2d5;
  --texte:#1c1a17; --doux:#6f6a63;
  --accent:#c2410c; --accent-clair:#fdecdf; --accent-fonce:#9a3412;
  --alerte:#b91c1c; --succes:#15803d;
  --radius:14px; --ombre:0 1px 2px rgba(28,26,23,.05), 0 8px 24px rgba(28,26,23,.05);
  --police:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:var(--police);background:var(--fond);color:var(--texte);line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
.wrap{max-width:1040px;margin:0 auto;padding:0 20px}

/* barre du haut */
.nav{position:sticky;top:var(--mvp-bar);z-index:50;background:rgba(250,249,247,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--bord)}
.nav-in{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:64px;flex-wrap:wrap;padding:8px 20px}
.logo{display:flex;align-items:center;gap:10px;font-weight:600;text-decoration:none;font-size:1.05rem}
.logo-mark{width:30px;height:30px;border-radius:9px;background:var(--accent);color:#fff;display:grid;place-items:center;font-size:.85rem;font-weight:700}
.nav-links{display:flex;gap:26px;list-style:none;align-items:center}
.nav-links a{color:var(--doux);text-decoration:none;font-size:.94rem;font-weight:500;white-space:nowrap}
.nav-links a:hover,.nav-links a[aria-current]{color:var(--texte)}

/* boutons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid transparent;border-radius:10px;padding:11px 20px;font:inherit;font-weight:600;font-size:.95rem;cursor:pointer;text-decoration:none;white-space:normal;transition:.15s}
.btn-primaire{background:var(--accent);color:#fff}
.btn-primaire:hover{background:var(--accent-fonce)}
.btn-neutre{background:var(--surface);border-color:var(--bord);color:var(--texte)}
.btn-neutre:hover{border-color:var(--doux)}
.btn-discret{background:none;color:var(--doux);padding:8px 0;text-decoration:underline}
.btn-lg{padding:14px 26px;font-size:1rem;width:100%}
.btn[disabled]{opacity:.45;cursor:not-allowed}

/* structure */
main{padding:40px 0 80px}
.titre-page{font-size:clamp(1.6rem,3.5vw,2.2rem);letter-spacing:-.02em;margin-bottom:6px}
.sous-titre{color:var(--doux);margin-bottom:32px}
.section-titre{font-size:1.05rem;font-weight:600;margin:36px 0 14px}

/* cartes */
.grille{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:18px}
.carte{background:var(--surface);border:1px solid var(--bord);border-radius:var(--radius);padding:22px;box-shadow:var(--ombre)}
.carte a{text-decoration:none}
.carte-evt{display:flex;flex-direction:column;gap:10px;text-decoration:none;color:inherit;padding:0;overflow:hidden;transition:.2s cubic-bezier(.2,.8,.2,1)}
.carte-evt:hover{transform:translateY(-3px);box-shadow:0 18px 40px -20px rgba(0,0,0,.35)}
.evt-photo{display:block;aspect-ratio:16/9;background:var(--surface-2) center/cover;margin:-1px -1px 4px;transition:transform .55s cubic-bezier(.2,.8,.2,1)}
.carte-evt:hover .evt-photo{transform:scale(1.05)}
.carte-evt>*:not(.evt-photo){margin-left:20px;margin-right:20px}
.carte-evt>*:last-child{margin-bottom:20px}
.date-pastille{display:inline-flex;flex-direction:column;align-items:center;background:var(--accent-clair);color:var(--accent-fonce);border-radius:10px;padding:8px 12px;min-width:56px;font-weight:700;line-height:1.15}
.date-pastille span:first-child{font-size:1.3rem}
.date-pastille span:last-child{font-size:.7rem;text-transform:uppercase;letter-spacing:.06em;font-weight:600}
.evt-haut{display:flex;gap:14px;align-items:flex-start}
.evt-titre{font-size:1.08rem;font-weight:600;line-height:1.35}
.meta{color:var(--doux);font-size:.9rem}
.badges{display:flex;gap:8px;flex-wrap:wrap;margin-top:2px}
.badge{font-size:.78rem;font-weight:600;padding:4px 10px;border-radius:999px;background:var(--accent-clair);color:var(--accent-fonce)}
.badge-chaud{background:#fbeee9;color:var(--alerte)}
.badge-gris{background:#f0eeea;color:var(--doux)}

/* jauge de places */
.jauge{height:7px;background:#eeeae4;border-radius:999px;overflow:hidden}
.jauge i{display:block;height:100%;background:var(--accent);border-radius:999px}

/* formulaires */
.form{display:flex;flex-direction:column;gap:16px;max-width:420px}
.champ{display:flex;flex-direction:column;gap:6px}
.champ label{font-size:.9rem;font-weight:600}
.champ input,.champ select,.champ textarea{font:inherit;padding:11px 13px;border:1px solid var(--bord);border-radius:10px;background:var(--surface);color:var(--texte);width:100%}
.champ input:focus,.champ select:focus,.champ textarea:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:transparent}
.aide{font-size:.82rem;color:var(--doux)}
.puces{display:flex;flex-wrap:wrap;gap:8px}
.puce{border:1px solid var(--bord);background:var(--surface);border-radius:999px;padding:7px 14px;font-size:.88rem;cursor:pointer}
.puce[aria-pressed="true"]{background:var(--accent-clair);border-color:var(--accent);color:var(--accent-fonce);font-weight:600}

/* participants */
.participants{display:flex;flex-wrap:wrap;gap:10px}
.pers{display:flex;align-items:center;gap:9px;background:var(--surface);border:1px solid var(--bord);border-radius:999px;padding:5px 13px 5px 5px;font-size:.88rem}
.avatar{width:28px;height:28px;border-radius:50%;background:var(--accent-clair);color:var(--accent-fonce);display:grid;place-items:center;font-size:.75rem;font-weight:700}

/* tableau admin */
.tableau-scroll{overflow-x:auto}
table{width:100%;border-collapse:collapse;background:var(--surface);border:1px solid var(--bord);border-radius:var(--radius);overflow:hidden;min-width:520px}
th,td{padding:13px 16px;text-align:left;border-bottom:1px solid var(--bord);font-size:.93rem}
th{background:#f5f2ee;font-weight:600;font-size:.85rem;text-transform:uppercase;letter-spacing:.04em;color:var(--doux)}
tr:last-child td{border-bottom:none}

/* divers */
.bandeau{background:var(--accent-clair);border:1px solid #cfe0d9;border-radius:var(--radius);padding:16px 18px;font-size:.92rem;display:flex;gap:12px;align-items:flex-start;margin-bottom:26px}
.prix{font-size:2.6rem;font-weight:700;letter-spacing:-.03em}
.prix small{font-size:.95rem;font-weight:500;color:var(--doux)}
.liste-ok{list-style:none;display:flex;flex-direction:column;gap:10px;margin:18px 0}
.liste-ok li{display:flex;gap:10px;font-size:.95rem}
.liste-ok li::before{content:"✓";color:var(--accent);font-weight:700}
.pied{border-top:1px solid var(--bord);padding:28px 0;color:var(--doux);font-size:.87rem;text-align:center}
.filtres{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:24px}
.demo{background:#fff8e6;border:1px solid #f0dfae;color:#6b5417;border-radius:10px;padding:10px 14px;font-size:.85rem;margin-bottom:22px}

@media(max-width:900px){
  .nav-in > nav{order:3;flex-basis:100%;min-width:0}
  .nav-links{gap:18px;overflow-x:auto;padding:6px 0 2px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .nav-links::-webkit-scrollbar{display:none}
  .nav-links a{font-size:.9rem}
  .nav-etat .meta{display:none}
}
@media(max-width:640px){
  main{padding:26px 0 60px}
  .grille{grid-template-columns:1fr}
  .btn{white-space:normal}
}

/* version cliquable */
#toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(20px);background:var(--texte);color:#fff;padding:12px 18px;border-radius:12px;font-size:.92rem;opacity:0;pointer-events:none;transition:.25s;max-width:calc(100% - 32px);text-align:center;z-index:100}
#toast.visible{opacity:1;transform:translateX(-50%) translateY(0)}
.badge-ok{background:#dcfce7;color:#15803d}
.pers-moi{border-color:var(--accent);background:var(--accent-clair)}
.champ-erreur{outline:2px solid var(--alerte)!important;outline-offset:1px}
.erreur{color:var(--alerte)}
.nav-etat{display:flex;gap:8px;align-items:center;justify-content:flex-end;margin-left:auto;flex-shrink:0}
.nav-etat .btn{white-space:nowrap}
.nav-etat .btn{padding:9px 14px;font-size:.88rem}
.stripe{border:1px solid var(--bord);border-radius:var(--radius);padding:22px;background:var(--surface);max-width:420px}
.stripe-tete{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;padding-bottom:14px;border-bottom:1px solid var(--bord)}
.stripe-logo{font-weight:700;letter-spacing:-.02em;color:#635bff}
.stripe-2col{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.cache{display:none}
@media(max-width:640px){ .nav-etat .btn{padding:8px 11px;font-size:.82rem} .logo span:last-child{font-size:.95rem} .btn-deco,.btn-inscription{display:none} }

#demo-chip{position:fixed;right:14px;bottom:14px;z-index:9999;display:flex;align-items:center;gap:8px;
 background:rgba(17,17,20,.9);color:#fff;border:1px solid rgba(255,255,255,.16);border-radius:999px;
 padding:8px 14px 8px 11px;font:600 12.5px/1 Inter,system-ui,sans-serif;text-decoration:none;
 box-shadow:0 6px 22px rgba(0,0,0,.28);backdrop-filter:blur(8px);transition:.16s}
#demo-chip:hover{background:rgba(17,17,20,1);transform:translateY(-1px)}
#demo-chip i{width:7px;height:7px;border-radius:50%;background:#3ddc97;display:block;flex-shrink:0}
@media(max-width:520px){#demo-chip{right:10px;bottom:10px;padding:7px 12px 7px 10px;font-size:11.5px}}

/* ── bandeau MonMVP ──────────────────────── */
:root{--mvp-bar:30px}
#mvp-bar{position:fixed;top:0;left:0;right:0;z-index:99999;height:var(--mvp-bar);
 display:flex;align-items:center;gap:12px;padding:0 14px;background:#7c5cff;color:#fff;
 font:500 11.5px/1 'Inter',-apple-system,BlinkMacSystemFont,system-ui,sans-serif;letter-spacing:.005em;
 white-space:nowrap;overflow:hidden;box-shadow:0 1px 12px rgba(23,10,60,.35)}
#mvp-bar a{text-decoration:none;color:inherit}
#mvp-bar .mvp-marque{font-weight:700;font-size:12.5px;letter-spacing:-.02em;flex-shrink:0}
#mvp-bar .mvp-marque b{font-weight:700;color:#dfd6ff}
#mvp-bar .mvp-txt{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;color:rgba(255,255,255,.88);margin:0}
#mvp-bar .mvp-lien{flex-shrink:0;font-weight:600;border-bottom:1px solid rgba(255,255,255,.45);padding-bottom:1px;transition:.15s}
#mvp-bar .mvp-lien:hover{border-bottom-color:#fff}
body{padding-top:var(--mvp-bar)}
.modale,.lightbox{padding-top:calc(var(--mvp-bar) + 16px)}
.tiroir{top:var(--mvp-bar)}
@media(max-width:860px){#mvp-bar .mvp-lien{display:none}}
@media(max-width:720px){:root{--mvp-bar:27px}#mvp-bar{font-size:10.6px;gap:9px;padding:0 10px}#mvp-bar .mvp-marque{font-size:11.5px}}