:root {
  --encre: #231d30; --doux: #625a72; --fond: #faf7f1; --surface: #ffffff; --trait: #e7e0d4;
  --violet: #3b2470; --violet-clair: #efe9f8; --or: #b9842b; --or-clair: #fbf1dc;
  --rouge: #b3261e; --vert: #1e7a4d; --vert-clair: #e2f3ea;
  --titre: Georgia, 'Times New Roman', serif;
  --texte: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --rayon: 10px; --ombre: 0 1px 3px rgba(35, 29, 48, .08);
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--fond); color: var(--encre); font: 16px/1.55 var(--texte); }
h1, h2, h3 { font-family: var(--titre); line-height: 1.2; margin: 0 0 .5em; color: var(--violet); overflow-wrap: anywhere; }
h1 { font-size: clamp(1.7rem, 4vw, 2.3rem); } h2 { font-size: 1.4rem; } h3 { font-size: 1.1rem; }
p { margin: 0 0 1em; } a { color: var(--violet); }
img { max-width: 100%; }

.entete { position: sticky; top: 0; z-index: 1000; background: var(--violet); color: #fff; }
.entete-dedans { max-width: 1200px; margin: 0 auto; padding: 8px 16px; display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.marque { display: flex; align-items: center; gap: 8px; color: #fff; text-decoration: none; font: 1.2rem var(--titre); }
.marque b { color: #e6b95c; font-weight: 400; }
/* Menu regroupé par catégories. Par défaut en haut, les catégories s'ouvrent en listes déroulantes. */
.nav { display: flex; align-items: center; gap: 2px; flex: 1; flex-wrap: wrap; }
.nav a, .nav button { color: #e9e3f5; text-decoration: none; padding: 7px 9px; border-radius: 6px; font: 14px var(--texte); background: none; border: 0; cursor: pointer; text-align: left; }
.nav a:hover, .nav a.actif, .nav button:hover { background: rgba(255, 255, 255, .14); color: #fff; }
.groupe { position: relative; display: flex; }
.groupe.principal { gap: 2px; }
.groupe.compte { margin-left: auto; }
.groupe-titre { display: flex; align-items: center; gap: 4px; }
.groupe-titre span { font-size: 11px; opacity: .8; transition: transform .15s; }
.groupe.ouvert > .groupe-titre span { transform: rotate(180deg); }
.groupe.actif > .groupe-titre { color: #fff; box-shadow: inset 0 -2px 0 #e6b95c; }
.groupe-liens { display: none; position: absolute; top: calc(100% + 4px); left: 0; z-index: 1100; min-width: 210px; flex-direction: column; gap: 1px;
  background: #2f1c5c; border: 1px solid rgba(255, 255, 255, .18); border-radius: 8px; padding: 6px; box-shadow: 0 8px 24px rgba(20, 10, 40, .3); }
.groupe.compte .groupe-liens { left: auto; right: 0; }
.groupe.ouvert .groupe-liens { display: flex; }
.nav select { background: transparent; color: #fff; border: 1px solid rgba(255, 255, 255, .35); border-radius: 6px; padding: 4px; font-size: 13px; width: auto; margin-left: 4px; }
.nav select option { color: var(--encre); }
/* Bouton en haut à gauche : passe le menu du haut à la colonne de gauche, et inversement. */
.disposition { background: none; border: 1px solid rgba(255, 255, 255, .35); color: #fff; border-radius: 6px; padding: 4px 5px; cursor: pointer; display: flex; }
.disposition:hover { background: rgba(255, 255, 255, .14); }
.disposition .trait-haut { display: none; }
body.menu-lateral .disposition .trait-haut { display: inline; }
body.menu-lateral .disposition .trait-gauche { display: none; }
@media (min-width: 901px) {
  body.menu-lateral .entete-dedans { max-width: none; min-height: 54px; }
  body.menu-lateral .nav { position: fixed; top: 54px; left: 0; bottom: 0; width: 240px; overflow-y: auto; flex-direction: column; flex-wrap: nowrap; align-items: stretch;
    gap: 12px; padding: 14px 10px 24px; background: #2f1c5c; }
  body.menu-lateral .groupe { display: block; }
  body.menu-lateral .groupe.principal { display: flex; flex-direction: column; }
  body.menu-lateral .groupe.compte { margin-left: 0; }
  body.menu-lateral .groupe-titre { width: 100%; justify-content: space-between; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #c9bde6; }
  body.menu-lateral .groupe.actif > .groupe-titre { box-shadow: none; color: #e6b95c; }
  body.menu-lateral .groupe-liens { position: static; box-shadow: none; background: none; border: 0; padding: 2px 0 0; min-width: 0; }
  body.menu-lateral .nav select { align-self: flex-start; margin: 0 0 0 8px; }
  body.menu-lateral .page { margin-left: 240px; max-width: min(1200px, calc(100% - 240px)); }
  body.menu-lateral .pied { margin-left: 240px; }
}
.menu-bouton { display: none; margin-left: auto; background: none; border: 0; color: #fff; font-size: 24px; padding: 2px 8px; cursor: pointer; }

.page { max-width: 1200px; margin: 0 auto; padding: 24px 16px 48px; min-height: 70vh; outline: none; }
.pied { background: #2a1a52; color: #cfc6e2; font-size: 14px; }
.pied-dedans { max-width: 1200px; margin: 0 auto; padding: 24px 16px; display: flex; gap: 16px; justify-content: space-between; flex-wrap: wrap; }
.pied a { color: #e6b95c; }

.heros { background: var(--violet); color: #fff; border-radius: 14px; padding: clamp(28px, 6vw, 56px) clamp(18px, 5vw, 48px); margin-bottom: 24px; }
.heros h1 { color: #fff; font-size: clamp(1.9rem, 5vw, 3rem); max-width: 16em; }
.heros p { color: #dcd3ee; font-size: 1.1rem; max-width: 36em; }
.heros .surtitre { color: #e6b95c; font-size: .95rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; margin-bottom: .4em; }
.recherche { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 18px; }
.recherche input { flex: 1 1 240px; }
.recherche select { flex: 0 1 200px; }

.chiffres { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 12px; margin-bottom: 28px; }
.chiffre { background: var(--surface); border: 1px solid var(--trait); border-radius: var(--rayon); padding: 12px 16px; }
.chiffre b { display: block; font: 1.6rem var(--titre); color: var(--violet); }
.chiffre span { color: var(--doux); font-size: 14px; }
a.chiffre-lien { text-decoration: none; color: inherit; transition: border-color .15s; }
a.chiffre-lien:hover { border-color: var(--violet); }
.avis-admin { margin-bottom: 20px; border-color: #ecd7a8; background: var(--or-clair); }
.avis-admin .chiffres { margin-bottom: 0; }
.section > .carte, .section > .grille { margin-bottom: 16px; }

.grille { display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 16px; }
.carte { background: var(--surface); border: 1px solid var(--trait); border-radius: var(--rayon); box-shadow: var(--ombre); padding: 16px; min-width: 0; }
.carte h3 { margin-bottom: 4px; }
.carte-lien { display: block; text-decoration: none; color: inherit; padding: 0; overflow: hidden; }
.carte-lien:hover { border-color: var(--or); }
.carte-corps { padding: 14px 16px; }
.vignette { height: 130px; background: linear-gradient(135deg, #4c3189, #7d5bb5); color: #e6b95c; display: flex; align-items: center; justify-content: center; font: 2.6rem var(--titre); position: relative; }
.vignette img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.meta { color: var(--doux); font-size: 14px; margin: 0 0 6px; overflow-wrap: anywhere; }
.pastilles { display: flex; gap: 6px; flex-wrap: wrap; }
.pastille { display: inline-block; padding: 1px 8px; border-radius: 99px; background: var(--violet-clair); color: var(--violet); font-size: 12.5px; font-weight: 600; }
.pastille.ok { background: var(--vert-clair); color: var(--vert); }
.pastille.or { background: var(--or-clair); color: #805a15; }
.pastille.direct { background: var(--rouge); color: #fff; }
.section { margin: 32px 0; }
.section-tete { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
.section-tete h2 { margin: 0; }

label { display: block; font-size: 14px; font-weight: 600; margin-bottom: 12px; color: var(--encre); }
label small { display: block; font-weight: 400; color: var(--doux); }
input, select, textarea { display: block; width: 100%; margin-top: 4px; padding: 10px 12px; border: 1px solid #cfc7b8; border-radius: 8px; background: #fff; color: var(--encre); font: 16px var(--texte); }
input:focus-visible, select:focus-visible, textarea:focus-visible, button:focus-visible, a:focus-visible { outline: 2px solid var(--or); outline-offset: 1px; }
input[type=checkbox] { display: inline-block; width: auto; margin: 0 6px 0 0; }
.recherche input, .recherche select { margin-top: 0; }
.deux { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 0 14px; }
.btn { display: inline-block; padding: 10px 16px; border-radius: 8px; border: 1px solid var(--violet); background: var(--violet); color: #fff; font: 600 15px var(--texte); cursor: pointer; text-decoration: none; }
.btn:hover { background: #2d1a59; }
.btn.or { background: #e6b95c; border-color: #e6b95c; color: #2a1a52; }
.btn.or:hover { background: #d9a944; }
.btn.clair { background: transparent; color: var(--violet); }
.btn.clair:hover { background: var(--violet-clair); }
.btn.petit { padding: 5px 10px; font-size: 13.5px; }
.btn.danger { background: transparent; color: var(--rouge); border-color: var(--rouge); }
.btn:disabled { opacity: .55; cursor: default; }
.actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }

.deux-colonnes { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 20px; align-items: start; }
.filtres { position: sticky; top: 70px; }
.carte-monde { height: 340px; border-radius: var(--rayon); border: 1px solid var(--trait); margin-bottom: 16px; z-index: 0; }
.fiche-tete { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 20px; align-items: start; }
.fiche-photo { height: 240px; border-radius: var(--rayon); overflow: hidden; margin-bottom: 16px; }
.fiche-photo.vignette { font-size: 4rem; }
.ligne { display: flex; justify-content: space-between; gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--trait); align-items: center; flex-wrap: wrap; }
.ligne:last-child { border-bottom: 0; }
.video { position: relative; aspect-ratio: 16 / 9; background: #000; border-radius: 8px; overflow: hidden; margin-bottom: 10px; }
.video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

.tarifs { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 16px; align-items: stretch; }
.tarif { display: flex; flex-direction: column; }
.tarif.conseille { border: 2px solid var(--or); }
.tarif .prix { font: 2rem var(--titre); color: var(--violet); margin: 4px 0 0; }
.tarif ul { padding-left: 18px; margin: 12px 0; flex: 1; font-size: 15px; }
.onglets { display: flex; gap: 4px; overflow-x: auto; border-bottom: 1px solid var(--trait); margin-bottom: 18px; padding-bottom: 1px; }
.onglets a { padding: 8px 12px; text-decoration: none; color: var(--doux); white-space: nowrap; border-bottom: 2px solid transparent; font-size: 15px; }
.onglets a.actif { color: var(--violet); border-color: var(--or); font-weight: 600; }
.jauge { height: 10px; background: var(--trait); border-radius: 99px; overflow: hidden; margin: 6px 0 12px; }
.jauge i { display: block; height: 100%; background: var(--or); }
.avis { padding: 10px 14px; border-radius: 8px; background: var(--or-clair); border: 1px solid #ecd7a8; margin-bottom: 16px; font-size: 15px; }
.avis.simulation { background: var(--violet-clair); border-color: #d6cbea; }
.vide { color: var(--doux); padding: 24px; text-align: center; background: var(--surface); border: 1px dashed var(--trait); border-radius: var(--rayon); }
.etroit { max-width: 480px; margin: 0 auto; }
.moyen { padding: 14px; border: 1px solid var(--trait); border-radius: 8px; margin-bottom: 12px; }
.toast { position: fixed; bottom: 18px; left: 50%; transform: translateX(-50%); background: var(--encre); color: #fff; padding: 10px 16px; border-radius: 8px; z-index: 2000; display: none; max-width: calc(100vw - 32px); }
.toast.visible { display: block; }
.toast.erreur { background: var(--rouge); }
table { width: 100%; border-collapse: collapse; font-size: 15px; }
th, td { text-align: left; padding: 8px; border-bottom: 1px solid var(--trait); }
.defile { overflow-x: auto; }
.a-imprimer { max-width: 760px; margin: 0 auto; text-align: center; border: 6px double var(--or); padding: 40px 20px; background: #fff; }

@media (max-width: 900px) {
  .menu-bouton { display: block; }
  .nav { display: none; flex-basis: 100%; flex-direction: column; align-items: stretch; }
  .nav.ouvert { display: flex; }
  .disposition { display: none; }
  .groupe, .groupe.principal { display: block; }
  .groupe.principal a { display: block; }
  .groupe.compte { margin-left: 0; }
  .groupe-titre { width: 100%; justify-content: space-between; }
  .groupe-liens { position: static; box-shadow: none; border: 0; min-width: 0; padding: 2px 0 2px 12px; background: none; }
  .nav select { align-self: flex-start; margin: 6px 0 0; }
  .deux-colonnes, .fiche-tete { grid-template-columns: minmax(0, 1fr); }
  .filtres { position: static; }
}
@media print {
  .entete, .pied, .actions { display: none; }
}

/* Lancement : tableaux de suivi et affiches à imprimer (deux par page A4, à découper). */
.tableau { overflow-x: auto; }
.tableau table { width: 100%; border-collapse: collapse; font-size: 15px; }
.tableau th, .tableau td { text-align: right; padding: 6px 10px; border-bottom: 1px solid var(--trait); }
.tableau th:first-child, .tableau td:first-child { text-align: left; }
.affiches { display: none; }
@media print {
  @page { size: A4; margin: 10mm; }
  body.impression > :not(.affiches) { display: none !important; }
  body.impression { background: #fff; }
  body.impression .affiches { display: block; }
  .affiche { height: 133mm; box-sizing: border-box; padding: 8mm 10mm; border: 1px dashed #999; margin-bottom: 4mm; break-inside: avoid; color: #000;
    display: flex; flex-direction: column; font: 11.5pt/1.35 Georgia, serif; overflow: hidden; }
  .affiche:nth-child(2n) { break-after: page; }
  .affiche-tete { display: flex; justify-content: space-between; color: #2a1a52; font-size: 10pt; border-bottom: 2px solid #e6b95c; padding-bottom: 2mm; }
  .affiche-tete b { font-size: 13pt; }
  .affiche h2 { font-size: 18pt; margin: 3mm 0 0; color: #2a1a52; line-height: 1.15; }
  .affiche-lieu { margin: 0 0 2mm; color: #555; }
  .affiche p { margin: 0 0 2mm; }
  .affiche-corps { display: flex; gap: 6mm; align-items: flex-start; flex: 1; }
  .affiche-qr { flex: none; width: 42mm; text-align: center; font-size: 8.5pt; word-break: break-all; }
  .affiche-qr img { width: 42mm; height: 42mm; display: block; }
  .affiche ol { margin: 0; padding-left: 5mm; font-size: 10.5pt; }
  .affiche li { margin-bottom: 2mm; }
  .affiche i { color: #444; }
  .affiche-pied { font-size: 9pt; color: #555; text-align: right; margin: 0; }
}

/* Case à cocher avec un texte sur plusieurs lignes (acceptation des conditions). */
.case { display: flex; gap: 8px; align-items: flex-start; font-weight: 400; }
.case input { width: auto; margin-top: 3px; flex: none; }
button.lien { background: none; border: 0; padding: 0; color: var(--violet); text-decoration: underline; font: inherit; cursor: pointer; }
.texte-legal { max-width: 760px; }
.texte-legal h2 { font-size: 1.2rem; margin-top: 1.4em; }
