/* ============================================================================
   Section « Événements » — feuille d'EXTENSION du thème Kalium.
   ----------------------------------------------------------------------------
   Principe, et c'est tout le sujet : cette feuille ne redéfinit AUCUNE
   typographie. Pas de font-family, pas de font-size sur p/h1..h4/a, pas de
   couleur de texte générique. Tout cela vient de Kalium et doit continuer d'en
   venir — sinon la section ressemble à une pièce rapportée.
   Valeurs du thème relevées sur le site (14/08/2026), pour référence :
     police      Open Sans
     h1 64px/800 · h2 32px/800 · h3 26px/800   (noir, interligne 1.1)
     p  15px/300 italique #777, interligne 20px
     conteneur   1409px, marge interne 45px
   Ce qui est stylé ici : uniquement les composants que Kalium n'a pas —
   onglets, cadre QR, fiches d'événement, listes de programme, chiffres clés.
   Tout est cloisonné sous .bacchus-evt : rien ne peut fuir sur le reste du site.
   ============================================================================ */
.bacchus-evt {
  /* Neutres repris du thème, pas inventés. */
  --trait:      #e6e6e6;
  --gris:       #777777;
  --gris-clair: #999999;
  --encre:      #000000;
  --doux:       #f7f7f7;
  /* Rouge de l'Ordre de Malte : conservé UNIQUEMENT là où il porte du sens
     (QR code, onglet actif, bouton principal). Le site n'a pas d'accent. */
  --om-rouge:       #E2001A;
  --om-rouge-fonce: #B3000F;
}
/* ------------------------------- Rythme ---------------------------------- */
/* DEUXIÈME écart assumé, et le dernier. Le thème compose son texte courant en
   15px graisse 300 gris italique, interligne 20px (soit 1,33). Ce réglage tient
   pour les paragraphes courts des pages vitrine ; il ne tient pas pour un
   dossier de partenariat de 1 900 mots que des entreprises vont lire avant de
   décider si elles donnent de l'argent.
   On monte à 16px et on desserre l'interligne — UNIQUEMENT dans cette section.
   La police, la graisse, l'italique et la couleur restent ceux du thème :
   l'identité visuelle du site est intacte, seul le confort de lecture change. */
.bacchus-evt { font-size: 16px; }
.bacchus-evt p { line-height: 1.7; margin-bottom: 1.1em; }
.bacchus-evt h2 { margin-top: 1.8em; }
.bacchus-evt h3 { margin-top: 1.6em; }
.bacchus-evt > *:first-child { margin-top: 0; }
/* Filet court sous les titres : seule signature graphique ajoutée. */
.bacchus-evt .filet {
  width: 60px; height: 3px; background: var(--encre);
  border: 0; margin: 0 0 1.6em;
}
.bacchus-evt .surtitre {
  font-size: 13px; font-weight: 800; letter-spacing: .14em;
  text-transform: uppercase; color: var(--encre);
  font-style: normal; margin: 0 0 .8em;
}
.bacchus-evt .discret { color: var(--gris-clair); font-size: 14px; }
.bacchus-evt .mention-legale { color: var(--gris-clair); font-size: 14px; }
/* ⚠️ TAILLES EN PIXELS, JAMAIS EN REM.
   Kalium fixe la racine du document à 10px (mesuré le 14/08/2026), pas 16.
   Toute valeur écrite en rem est donc rendue 37 % plus petite que l'intention :
   un « .82rem » sort à 8,2px. Le transposeur refuse désormais rem et em. */
/* Contraste des liens. Le thème les rend en #b2b2b2 sur blanc, soit 2,0:1 —
   en dessous de tout seuil de lisibilité. Dans cette section, ils reprennent
   la couleur du texte courant (4,5:1) et se distinguent par le soulignement. */
.bacchus-evt a { color: var(--gris); text-decoration: underline; text-underline-offset: 3px; }
.bacchus-evt a:hover { color: var(--om-rouge); }
.bacchus-evt .bouton, .bacchus-evt .bouton:hover { text-decoration: none; }
/* --------------------------- Chapô de l'événement ------------------------ */
/* Pas de bandeau coloré : le thème affiche déjà le titre de la page en 64px.
   On enchaîne directement sur le chapô et les informations pratiques. */
.bacchus-evt .chapeau {
  display: grid; grid-template-columns: 1.2fr .8fr; gap: 56px;
  align-items: start; margin-bottom: 56px;
}
@media (max-width: 900px) {
  .bacchus-evt .chapeau { grid-template-columns: 1fr; gap: 32px; }
}
/* SEUL écart assumé vis-à-vis du thème : le site laisse ses paragraphes courir
   sur 1409px, soit ~200 signes par ligne. Sur une page de 1 900 mots c'est
   illisible. On borne la mesure des textes d'introduction — et uniquement eux. */
.bacchus-evt .accroche { font-size: 18px; line-height: 1.6; max-width: 82ch; }
.bacchus-evt .meta-liste { list-style: none; margin: 1.8em 0 0; padding: 0; }
.bacchus-evt .meta-liste li {
  display: grid; grid-template-columns: 150px 1fr; gap: 20px;
  padding: 12px 0; border-bottom: 1px solid var(--trait); align-items: baseline;
}
.bacchus-evt .meta-liste li:last-child { border-bottom: 0; }
.bacchus-evt .meta-liste .cle {
  font-size: 13px; font-weight: 800; letter-spacing: .12em;
  text-transform: uppercase; color: var(--encre);
}
.bacchus-evt .meta-liste .valeur { font-weight: 400; color: var(--gris); }
@media (max-width: 520px) {
  .bacchus-evt .meta-liste li { grid-template-columns: 1fr; gap: 2px; }
}
/* --------------------------------- Onglets -------------------------------- */
/* Les six onglets doivent TOUS être visibles. Le défilement horizontal du
   paquet en cachait le dernier derrière une barre de défilement — un onglet
   qu'on ne voit pas n'existe pas. Ils passent donc à la ligne si besoin, et la
   marge interne est resserrée pour qu'ils tiennent sur une ligne en grand écran. */
.bacchus-evt .onglets-barre {
  display: flex; flex-wrap: wrap; gap: 0;
  border-bottom: 1px solid var(--trait);
  margin: 0 0 48px; position: sticky; top: 0; background: #fff; z-index: 20;
}
.bacchus-evt .onglet {
  appearance: none; background: none; border: 0; cursor: pointer; font: inherit;
  font-size: 14px; font-weight: 800; letter-spacing: .03em; text-transform: uppercase;
  color: var(--gris-clair); padding: 18px 9px;
  border-bottom: 2px solid transparent; margin-bottom: -1px;
  transition: color .15s, border-color .15s;
}
.bacchus-evt .onglet:hover { color: var(--encre); }
.bacchus-evt .onglet[aria-selected="true"] {
  color: var(--encre); border-bottom-color: var(--om-rouge);
}
.bacchus-evt .onglet:focus-visible { outline: 2px solid var(--om-rouge); outline-offset: -4px; }
.bacchus-evt .onglet-numero {
  display: inline-block; min-width: 1.5em; margin-right: .3em;
  color: var(--gris-clair); font-variant-numeric: tabular-nums;
}
.bacchus-evt .onglet[aria-selected="true"] .onglet-numero { color: var(--om-rouge); }
.bacchus-evt .panneau { padding: 0 0 64px; }
.bacchus-evt .panneau[hidden] { display: none; }
/* -------------------------------- Grilles -------------------------------- */
.bacchus-evt .grille { display: grid; gap: 40px; }
.bacchus-evt .grille-2 { grid-template-columns: repeat(2, 1fr); }
.bacchus-evt .grille-3 { grid-template-columns: repeat(3, 1fr); }
.bacchus-evt .grille-texte-media { grid-template-columns: 1.05fr .95fr; gap: 56px; align-items: start; }
@media (max-width: 900px) {
  .bacchus-evt .grille-2, .bacchus-evt .grille-3,
  .bacchus-evt .grille-texte-media { grid-template-columns: 1fr; gap: 28px; }
}
/* Liste « 01 / intitulé / explication », reprise du dossier imprimé. */
.bacchus-evt .points { list-style: none; margin: 0; padding: 0; }
.bacchus-evt .points > li {
  display: grid; grid-template-columns: 46px 200px 1fr; gap: 24px;
  padding: 22px 0; border-bottom: 1px solid var(--trait); align-items: baseline;
}
.bacchus-evt .points > li:last-child { border-bottom: 0; }
.bacchus-evt .points .rang {
  color: var(--om-rouge); font-weight: 800; font-size: 13px;
  font-variant-numeric: tabular-nums;
}
.bacchus-evt .points .intitule { font-weight: 800; color: var(--encre); }
.bacchus-evt .points .detail { color: var(--gris); }
@media (max-width: 700px) {
  .bacchus-evt .points > li { grid-template-columns: 40px 1fr; }
  .bacchus-evt .points .detail { grid-column: 2; }
}
/* Programme horaire */
.bacchus-evt .horaire { list-style: none; margin: 0; padding: 0; }
.bacchus-evt .horaire > li { padding: 20px 0; border-bottom: 1px solid var(--trait); }
.bacchus-evt .horaire > li:last-child { border-bottom: 0; }
.bacchus-evt .horaire .creneau {
  display: block; font-size: 13px; font-weight: 800; letter-spacing: .12em;
  text-transform: uppercase; color: var(--om-rouge); margin-bottom: .3em;
}
.bacchus-evt .horaire .intitule { font-weight: 800; color: var(--encre); display: block; }
.bacchus-evt .horaire .detail { color: var(--gris); }
/* Encadrés : un simple filet, pas une carte ombrée — le site n'en a pas. */
.bacchus-evt .carte { border-top: 3px solid var(--encre); padding: 20px 0 0; }
.bacchus-evt .carte h3 { margin-top: 0; }
.bacchus-evt .carte p:last-child { margin-bottom: 0; }
.bacchus-evt .carte-douce { border-top-color: var(--trait); }
/* Chiffres clés */
.bacchus-evt .chiffres { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
.bacchus-evt .chiffres > div { border-top: 3px solid var(--om-rouge); padding-top: 16px; }
.bacchus-evt .chiffres .valeur {
  font-size: 38px; font-weight: 800; line-height: 1.05;
  display: block; color: var(--encre);
}
.bacchus-evt .chiffres .libelle { color: var(--gris); font-size: 14px; }
@media (max-width: 640px) { .bacchus-evt .chiffres { grid-template-columns: 1fr 1fr; } }
/* Montants de la vente aux enchères */
.bacchus-evt .montants { list-style: none; margin: 0; padding: 0; }
.bacchus-evt .montants > li { padding: 22px 0; border-bottom: 1px solid var(--trait); }
.bacchus-evt .montants > li:last-child { border-bottom: 0; }
.bacchus-evt .montants .somme {
  color: var(--encre); font-size: 34px; font-weight: 800;
  line-height: 1.05; display: block;
}
.bacchus-evt .montants .libelle { font-weight: 800; color: var(--encre); }
/* Étiquettes des contributions recherchées */
.bacchus-evt .etiquettes {
  display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none;
}
.bacchus-evt .etiquettes li {
  border: 1px solid var(--trait); padding: 10px 18px; font-size: 14px;
  font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: var(--encre);
}
/* ------------------------------- Boutons --------------------------------- */
/* Kalium n'expose pas de bouton dans le contenu de ces pages : on en dessine
   un sobre, aligné sur la typographie du thème (800, majuscules, sans rayon). */
.bacchus-evt .actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 2em 0 0; }
.bacchus-evt .bouton {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--encre); color: #fff !important; text-decoration: none;
  font-size: 13px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase;
  padding: 15px 28px; border: 2px solid var(--encre); cursor: pointer;
  transition: background .15s, border-color .15s, color .15s;
}
.bacchus-evt .bouton:hover { background: var(--om-rouge); border-color: var(--om-rouge); }
.bacchus-evt .bouton-secondaire { background: transparent; color: var(--encre) !important; }
.bacchus-evt .bouton-secondaire:hover { background: var(--encre); color: #fff !important; }
/* --------------------------------- QR ------------------------------------ */
.bacchus-evt .bloc-qr {
  border-top: 3px solid var(--encre); padding-top: 24px;
  display: grid; grid-template-columns: 200px 1fr; gap: 24px; align-items: start;
}
.bacchus-evt .bloc-qr .cadre-qr { width: 200px; }
.bacchus-evt .bloc-qr .cadre-qr svg { width: 100%; height: auto; display: block; }
.bacchus-evt .qr-erreur { color: var(--om-rouge-fonce); font-size: 13px; }
@media (max-width: 640px) {
  .bacchus-evt .bloc-qr { grid-template-columns: 1fr; }
}
/* ------------------------- Fiches d'événement (liste) --------------------- */
/* Calque sur la grille de « Nos Destinations » : image nette sans rayon ni
   ombre, texte dessous. C'est le motif visuel dominant du site. */
.bacchus-evt .liste-evenements {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 48px 32px;
}
/* Une seule fiche dans une grille de quatre colonnes = une vignette perdue au
   bord gauche d'un conteneur de 1409px. Tant qu'il n'y a qu'un événement, la
   fiche s'étale : image à gauche, texte à droite. Dès qu'il y en a deux ou
   plus, la grille reprend la main — c'est le transposeur qui décide. */
.bacchus-evt .liste-evenements.liste-solo { grid-template-columns: 1fr; }
.bacchus-evt .liste-solo .fiche-evenement {
  display: grid; grid-template-columns: .55fr .45fr; gap: 48px; align-items: center;
}
.bacchus-evt .liste-solo .fiche-evenement .visuel { margin-bottom: 0; }
/* Fiche dont l'image n'est pas encore fournie : elle occupe toute la largeur au
   lieu de laisser une colonne vide à côté d'un rectangle gris. */
.bacchus-evt .liste-solo .fiche-sans-visuel { grid-template-columns: 1fr; }
.bacchus-evt .fiche-sans-visuel .corps { max-width: 82ch; }
@media (max-width: 860px) {
  .bacchus-evt .liste-solo .fiche-evenement { grid-template-columns: 1fr; gap: 24px; }
  .bacchus-evt .liste-solo .fiche-evenement .visuel { margin-bottom: 20px; }
}
.bacchus-evt .fiche-evenement { display: flex; flex-direction: column; }
.bacchus-evt .fiche-evenement .visuel {
  aspect-ratio: 16 / 10; background: var(--doux) center/cover no-repeat; margin-bottom: 20px;
}
.bacchus-evt .fiche-evenement .corps { display: flex; flex-direction: column; flex: 1; }
.bacchus-evt .fiche-evenement h3 { margin: 0 0 .3em; }
.bacchus-evt .fiche-evenement .lieu-date {
  color: var(--gris-clair); font-size: 14px; font-weight: 800;
  letter-spacing: .06em; text-transform: uppercase; font-style: normal; margin-bottom: 1em;
}
.bacchus-evt .fiche-evenement .resume { color: var(--gris); flex: 1; }
.bacchus-evt .fiche-evenement .actions { margin-top: 1.4em; }
.bacchus-evt .pastille {
  display: inline-block; font-size: 13px; font-weight: 800; letter-spacing: .12em;
  text-transform: uppercase; margin-bottom: 12px; color: var(--om-rouge); font-style: normal;
}
.bacchus-evt .pastille-passe { color: var(--gris-clair); }
/* -------------------------------- Encarts -------------------------------- */
.bacchus-evt .encart {
  border-top: 3px solid var(--encre); padding: 24px 0 0; margin: 48px 0 0;
}
.bacchus-evt .encart p:last-child { margin-bottom: 0; }
.bacchus-evt .encart strong { color: var(--encre); }
/* -------------------------------- Impression ----------------------------- */
/* Les six onglets se déplient : la page ressort en dossier complet. */
@media print {
  .site-header, .site-footer, .mobile-menu-wrapper,
  .mobile-menu-overlay, .qlwapp-wrapper { display: none !important; }
  .bacchus-evt .onglets-barre, .bacchus-evt .actions { display: none !important; }
  .bacchus-evt .panneau[hidden] { display: block !important; }
  .bacchus-evt .panneau { page-break-before: always; padding-bottom: 24px; }
  .bacchus-evt .panneau:first-of-type { page-break-before: avoid; }
  .bacchus-evt a[href^="http"]::after {
    content: " (" attr(href) ")"; font-size: .8em; color: #666; word-break: break-all;
  }
}
@media (prefers-reduced-motion: reduce) {
  .bacchus-evt * { transition: none !important; }
}