/* Le bloc « Events (theme) » de /events (22/10/2026, App\Blocs\Evenements). Les cartes du site (blanc, filet #eef0f4,
   coins de 6 px, ombre legere), la tuile de date a bande orange du logo et libelle encre (PR 268), le texte justifie.
   « passes » : une carte par evenement, texte a gauche et publication LinkedIn a droite (504 px, la largeur du cadre de
   LinkedIn) ; avec deux publications ou plus, elles passent sous le texte, cote a cote. « agenda » : une seule grille de
   cartes, le mois sur la tuile, sur une bande grise. Le texte justifie des cartes etroites est coupe (hyphens). Les jours
   de la tuile se lisent de gauche a droite, en arabe aussi (« 4–10 »). L'attente d'une publication a la hauteur du cadre : rien ne bouge quand il se charge. */
.evenements__tete{max-width:820px;margin:0 auto 40px;text-align:center}
.evenements__titre{margin-bottom:16px}
.evenements__intro,.evenements__intro p{text-align:justify;color:#505459;font-size:17px;line-height:1.6}
.evenements__intro p:last-child{margin-bottom:0}
.evenements__groupe{margin:0 auto 40px;max-width:1140px}
.evenements__groupe:last-of-type{margin-bottom:0}
.evenements__groupe-nom{display:flex;align-items:center;gap:16px;font-size:28px;font-weight:700;color:#1f222b;margin:0 0 20px;line-height:1.2}
.evenements__groupe-nom::after{content:"";flex:1;height:2px;background:linear-gradient(90deg,#F19417 0,#F19417 48px,#eef0f4 48px)}
[dir=rtl] .evenements__groupe-nom::after{background:linear-gradient(270deg,#F19417 0,#F19417 48px,#eef0f4 48px)}
.evenements__liste{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:20px}
.evenement{background:#fff;border:1px solid #eef0f4;border-radius:6px;box-shadow:0 8px 24px rgba(31,34,43,.06);padding:24px;min-width:0;display:grid;grid-template-columns:minmax(0,1fr);gap:24px}
.evenement--publications{grid-template-columns:minmax(0,1fr) minmax(0,504px);align-items:start}
.evenement__corps{min-width:0}
.evenement__tete{display:flex;align-items:center;gap:16px;margin:0 0 14px}
.evenement__date{flex:0 0 76px;margin:0;border:1px solid #eef0f4;border-radius:6px;overflow:hidden;text-align:center;background:#fff;line-height:1.1}
.evenement__mois{display:block;background:#F19417;color:#1f222b;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:4px 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.evenement__jours{display:block;font-size:20px;font-weight:700;color:#1f222b;padding:6px 2px 0;white-space:nowrap;direction:ltr;unicode-bidi:isolate}
.evenement__an{display:block;font-size:12px;color:#6b7078;padding:2px 2px 6px}
.evenement__titre{font-size:20px;font-weight:700;color:#1f222b;margin:0;line-height:1.3;overflow-wrap:anywhere}
.evenement__texte,.evenement__texte p{text-align:justify;hyphens:auto;color:#505459;font-size:16px;line-height:1.6}
.evenement__texte p:last-child{margin-bottom:0}
.evenement__texte a{hyphens:none}
/* Audit UI du 26/10/2026 (lot 1) : un evenement sans publication LinkedIn prend toute la carte : son texte s'arrete a la
   largeur de lecture des blocs (760 px au lieu de 1 090 px). */
.evenement__texte{max-width:760px}
/* En japonais et en chinois, une adresse qui ne tient pas sur la ligne etirait la ligne justifiee d'avant : elle se coupe. */
:lang(ja) .evenement__texte a,:lang(zh) .evenement__texte a{word-break:break-all}
.evenement__publications{display:flex;flex-direction:column;gap:16px;min-width:0}
/* Deux publications ou plus : sous le texte, cote a cote. */
.evenement--publications:has(.publication + .publication){grid-template-columns:minmax(0,1fr)}
.evenement--publications:has(.publication + .publication) .evenement__publications{flex-direction:row;flex-wrap:wrap;align-items:flex-start}
.evenement--publications:has(.publication + .publication) .publication{flex:1 1 360px;max-width:504px}
.publication{position:relative;width:100%;max-width:504px;height:var(--publication-h,560px);border-radius:6px;background:#f7f8fa;border:1px solid #eef0f4;overflow:hidden}
.publication__attente{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:24px;text-align:center}
.publication__source{margin:0;font-size:18px;font-weight:700;color:#0a66c2}
.publication__texte{margin:0;max-width:340px;font-size:14px;line-height:1.5;color:#505459}
.publication__actions{margin:6px 0 0;display:flex;flex-direction:column;align-items:center;gap:8px}
/* Petit texte orange sur fond clair : #9F620F, la nuance lisible de l'orange du logo (palette du 16/10/2026). */
.publication__voir{background:none;border:0;padding:0;font:inherit;font-size:16px;font-weight:600;color:#9F620F;cursor:pointer;text-decoration:none}
.publication__voir:hover,.publication__voir:focus-visible{text-decoration:underline}
.publication__lien{font-size:14px;color:#1f222b;text-decoration:underline}
/* Audit UI du 26/10/2026 (lot 1) : au doigt, « Show the post » et « Open on LinkedIn » gagnent une zone de toucher de 44 px ;
   l'ecart passe de 8 a 22 px pour que les deux zones ne se chevauchent pas. */
@media (pointer:coarse){.publication__actions{gap:22px}.publication__voir,.publication__lien{position:relative}.publication__voir::after,.publication__lien::after{content:"";position:absolute;inset:-11px -4px}}
.publication--chargee{background:#fff}
.publication--chargee .publication__attente{display:none}
.publication__cadre{display:block;width:100%;height:100%;border:0}
.evenements__note{max-width:820px;margin:32px auto 0;padding-top:20px;border-top:1px solid #eef0f4;color:#505459;text-align:center}
.evenements__note p{margin:0}
.evenements__vide{text-align:center;color:#505459}
/* L'agenda : une bande grise, une grille de cartes par mois. */
.evenements--agenda{background:#f7f8fa}
.evenements--agenda .evenements__groupe{max-width:1140px}
.evenements--agenda .evenements__liste{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px}
.evenements--agenda .evenement{padding:20px;box-shadow:none;gap:0}
.evenements--agenda .evenement__titre{font-size:18px}
.evenements--agenda .evenement__texte,.evenements--agenda .evenement__texte p{font-size:15px}
@media (max-width:1100px){
    .evenement--publications{grid-template-columns:minmax(0,1fr)}
    .evenement__publications{align-items:center}
}
@media (max-width:767px){
    .evenements__tete{margin-bottom:28px}
    .evenements__groupe-nom{font-size:24px}
    .evenement{padding:16px;gap:16px}
    .evenement__date{flex-basis:64px}
    .evenement__jours{font-size:18px}
    .evenement__titre{font-size:18px}
    .evenements--agenda .evenements__liste{grid-template-columns:minmax(0,1fr)}
    .evenement--publications:has(.publication + .publication) .publication{flex-basis:100%}
    /* Sur un telephone, l'attente ne garde pas la hauteur du cadre (des pages de gris) : elle s'agrandit au chargement. */
    .publication:not(.publication--chargee){height:auto;min-height:200px}
}