/* ============================================================
   Page événement (/agenda) — reprise de la maquette :
   ev-layout (titre + visuel | sidebar fixe), puis description pleine largeur.
   Largeur de page réduite (--ev-max).
   ============================================================ */
:root { --ev-max: 1080px; }

.ev-wrap { padding-bottom: 1rem; }

/* Bloc haut : 2 colonnes (contenu | sidebar) */
.ev-layout {
  max-width: var(--ev-max); margin: 0 auto; padding: 2.5rem var(--pad) 0;
  display: grid; grid-template-columns: minmax(0,1fr) 340px; gap: 3rem; align-items: start;
}
.ev-main { min-width: 0; }
.ev-type-row { margin-bottom: 1.1rem; }
/* Surtitre (cycle/festival) : simple, petit, jaune, sans fond */
.ev-cycle { display: inline-block; font-size: .72rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--jaune); }
/* Encart « ligne fond » : mention partenariat / infos pratiques (une ligne, fond distinct) */
.ev-note { display: block; background: var(--noir-3); border-left: 3px solid var(--jaune); border-radius: 5px; padding: .6rem .95rem; margin: 1rem 0; font-size: .88rem; line-height: 1.45; color: var(--gris-clair); }
.ev-note strong { color: var(--blanc); }
.ev-note i, .ev-note .fa, .ev-note .fas, .ev-note .far { color: var(--jaune); margin-right: .5rem; }
/* Sidebar : slideshow du 2e visuel (première partie), rotation rapide */
.sb-slideshow { position: relative; aspect-ratio: 1/1; overflow: hidden; }
.sb-slideshow .slide { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .8s ease; }
.sb-slideshow .slide.is-active { opacity: 1; }
.ev-title { font-family: var(--f-titre); font-size: clamp(2.6rem,6vw,4.6rem); line-height: .92; letter-spacing: .02em; color: var(--blanc); margin: 0; hyphens: none; -webkit-hyphens: none; overflow-wrap: break-word; }
.ev-title span { display: block; font-size: .42em !important; line-height: 1.12; color: var(--gris-clair); font-weight: 400; margin-top: .4rem; letter-spacing: .02em; }
.ev-title span i { font-style: normal; }

/* Texte + vidéo dans la colonne de gauche */
.ev-main .ev-text { margin-top: 1.7rem; }
.ev-main .ev-videos { margin-top: 2rem; max-width: 640px; }

/* Sidebar fixe (date, heure, lieu, tarifs, billetterie) */
.ev-sidebar { position: sticky; top: 96px; display: flex; flex-direction: column; gap: 1.5rem; }
.sidebar-card { background: var(--noir-2); border: 1px solid var(--noir-4); border-radius: 2px; overflow: hidden; }
.sb-affiche img { width: 100%; display: block; }
.sb-top { padding: 1.6rem; border-bottom: 1px solid var(--noir-4); }
.sb-date-big { font-family: var(--f-titre); font-size: 2.9rem; line-height: 1; color: var(--jaune); letter-spacing: .02em; }
.sb-date-detail { font-size: .84rem; color: var(--gris-clair); margin-top: .35rem; }
.sb-lieu { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--noir-4); font-size: .82rem; color: var(--gris); line-height: 1.5; }
.sb-lieu strong { color: var(--blanc); font-weight: 600; display: block; margin-bottom: .2rem; }

.sb-ticket { padding: 1.6rem; }
.sb-price-label { font-size: .72rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--gris); margin-bottom: .45rem; }
.sb-price { font-family: var(--f-titre); font-size: 2.2rem; line-height: 1; color: var(--blanc); margin-bottom: .6rem; }
.sb-price-reduit { font-size: .84rem; color: var(--gris); margin-top: .3rem; }
.sb-tarif-free { font-size: .9rem; color: var(--gris-clair); line-height: 1.55; }
/* Mini-tableau tarifaire prévente/sur place × réduit/plein */
.sb-tarifs { width: 100%; border-collapse: collapse; margin-bottom: .7rem; }
.sb-tarifs th, .sb-tarifs td { padding: .42rem .3rem; text-align: center; }
.sb-tarifs thead th { font-size: .62rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--gris); border-bottom: 1px solid var(--noir-4); padding-bottom: .35rem; }
.sb-tarifs tbody th { text-align: left; font-size: .72rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--gris-clair); white-space: nowrap; }
.sb-tarifs tbody td { font-family: var(--f-titre); font-size: 1.35rem; line-height: 1.1; color: var(--blanc); }
.sb-cta { display: flex; width: 100%; box-sizing: border-box; margin-top: 1.2rem; justify-content: center; font-size: .95rem; padding: 1rem; }

/* Vidéo(s) sous la sidebar */
.ev-videos { display: flex; flex-direction: column; gap: 1rem; }
.ev-videos .videoWrapper { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; background: var(--noir-3); }
.ev-videos .videoWrapper iframe, .ev-videos iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* Description pleine largeur dessous */
.ev-body { max-width: var(--ev-max); margin: 0 auto; padding: clamp(2.5rem,5vw,3.5rem) var(--pad) 1rem; }
.ev-text h2 { font-family: var(--f-titre); font-size: 1.8rem; letter-spacing: .02em; color: var(--blanc); margin: 0 0 1rem; }
.ev-text { font-size: 1rem; color: var(--gris-clair); line-height: 1.85; }
.ev-text p { margin: 0 0 1.15rem; }
.ev-text p:last-child { margin-bottom: 0; }
.ev-text a { color: var(--jaune); }

@media (max-width: 900px) {
  /* Empilement mobile : titre (sur/sous-titre) -> sidebar -> texte -> vidéo */
  .ev-layout { display: flex; flex-direction: column; gap: 1.5rem; padding-top: 1.5rem; }
  .ev-main { display: contents; }
  .ev-type-row { order: 1; margin-bottom: 0; }
  .ev-title { order: 2; }
  .ev-sidebar { order: 3; position: static; width: 100%; align-self: stretch; }
  .ev-sidebar > .sidebar-card { width: 100%; }
  .ev-main .ev-text { order: 4; margin-top: 0; }
  .ev-main .ev-note { order: 4; }   /* sinon order:0 => remonte au-dessus du titre */
  .ev-main .ev-videos { order: 5; margin-top: 0; max-width: none; }
}

/* ── Section "À venir" (mini-cartes, design agenda en plus petit) ── */
.ev-avenir { margin-top: 1rem; padding: 3rem 0 4rem; }
.ev-avenir-inner { max-width: var(--ev-max); margin: 0 auto; padding: 3rem var(--pad) 0; border-top: 1px solid var(--noir-4); }
.ev-avenir .section-title { font-size: clamp(1.8rem,3.5vw,2.6rem); margin-bottom: 1.6rem; }
.ev-avenir-grid { display: grid !important; grid-template-columns: repeat(4, 1fr); gap: 1.2rem; width: 100% !important; margin: 0 !important; }
.ev-avenir-grid .unevt { width: auto; margin: 0; }
.ev-avenir-grid #titevt { font-size: 15px !important; line-height: 1.15 !important; min-height: 0 !important; margin-bottom: 4px !important; }
.ev-avenir-grid #ladateevt { font-size: 12px; }
@media (max-width: 900px) {
  .ev-avenir-grid { grid-template-columns: repeat(3, 1fr); }
  .ev-avenir-grid .unevt:nth-child(n+4) { display: none; }
}
@media (max-width: 620px) {
  .ev-avenir-grid { grid-template-columns: repeat(2, 1fr); gap: .8rem; }
  .ev-avenir-grid .unevt:nth-child(n+3) { display: none; }
  .ev-avenir-grid #titevt { font-size: 12px !important; }
  .ev-avenir-grid #ladateevt { font-size: 10.5px !important; }
  .ev-avenir-grid #lelieu { font-size: 10.5px !important; }
}
/* Bouton billetterie grisé "à venir" (event sans lien externe) */
.sb-cta-soon { opacity: .4; cursor: not-allowed; pointer-events: none; box-shadow: none; }
.sb-cta-soon-note { text-align: center; font-size: .72rem; color: var(--gris); margin-top: .45rem; text-transform: uppercase; letter-spacing: .08em; }