/*
 * Événements et Dons — habillage éditorial, pas l'apparence par défaut d'un plugin.
 * Documenté dans _team/docs/composants.md (section ajoutée par la fiche 12).
 *
 * Repli assumé : The Events Calendar (widget "Événements à venir") et le bloc
 * Formulaire avancé de Kadence génèrent leur propre balisage (classes tribe-*,
 * kadence-form) qu'on ne peut pas réécrire sans forker ces plugins. On les
 * neutralise visuellement (habillage par défaut supprimé) et on réinjecte
 * la typographie/les couleurs/les espacements du thème enfant par-dessus,
 * plutôt que de les laisser avec leur apparence de plugin brute.
 */

/* ---------------------------------------------------------------------------
 * 1. Bannière événement (10e anniversaire) — asymétrique, pas une carte parmi
 * d'autres : grand bloc éditorial, image/affiche + texte, jamais une card.
 * ------------------------------------------------------------------------- */
.nwc-event-feature {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--nwc-space-6);
	background-color: var(--nwc-ink);
	color: var(--nwc-cream);
	border-radius: var(--nwc-radius-lg);
	overflow: hidden;
	margin-block-end: var(--nwc-space-9);
}

@media (min-width: 900px) {
	.nwc-event-feature {
		grid-template-columns: 1.1fr 1fr;
		align-items: stretch;
	}
}

/* Demande explicite de Jordan : l'affiche doit s'afficher ENTIÈRE, dans ses
   vraies proportions (1024×1536, portrait) — `object-fit: cover` dans un
   cadre de hauteur fixe la tronquait. `aspect-ratio` fixe la hauteur du
   conteneur sur celle de l'image réelle, `object-fit: contain` ne recadre
   jamais rien (laisse une marge de la couleur de fond plutôt que de couper). */
.nwc-event-feature__visual {
	position: relative;
	overflow: hidden;
	background-color: var(--nwc-ember);
	background-image: linear-gradient(155deg, var(--nwc-ember) 0%, var(--nwc-ink) 72%);
	aspect-ratio: 1024 / 1536;
}

.nwc-event-feature__visual img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	position: absolute;
	inset: 0;
}

.nwc-event-feature__body {
	padding: var(--nwc-space-7) var(--nwc-space-6) var(--nwc-space-8);
	display: flex;
	flex-direction: column;
	gap: var(--nwc-space-4);
}

.nwc-event-feature__body .nwc-eyebrow {
	color: var(--nwc-gold);
}

.nwc-event-feature__date {
	font-family: var(--nwc-font-mono);
	font-size: clamp(1.1rem, 2vw, 1.4rem);
	letter-spacing: 0.04em;
	color: var(--nwc-gold);
}

.nwc-event-feature__body h2 {
	color: var(--nwc-cream);
	font-size: clamp(2.4rem, 6vw, 4.4rem);
	line-height: 1.02;
	margin: 0;
	position: relative;
	padding-bottom: var(--nwc-space-4);
}

.nwc-event-feature__body h2::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 72px;
	height: 3px;
	background-color: var(--nwc-gold);
}

.nwc-event-feature__body p {
	color: var(--nwc-mist);
	max-width: 42ch;
}

.nwc-event-feature__program {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--nwc-space-4);
	margin-block: var(--nwc-space-3);
}

@media (min-width: 560px) {
	.nwc-event-feature__program { grid-template-columns: repeat(3, 1fr); }
}

.nwc-event-feature__day {
	border-top: 1.5px solid var(--nwc-gold);
	padding-top: var(--nwc-space-3);
}

.nwc-event-feature__day .nwc-eyebrow { color: var(--nwc-slate-light); }
.nwc-event-feature__day p { color: var(--nwc-cream); margin: var(--nwc-space-1) 0 0; font-size: var(--nwc-text-small); max-width: none; }

/* ---------------------------------------------------------------------------
 * 2. Flux d'événements réels (The Events Calendar) — on retire l'apparence
 * par défaut du widget Tribe et on le fait passer pour une liste éditoriale.
 * ------------------------------------------------------------------------- */
.nwc-events-feed {
	margin-block: var(--nwc-space-8);
}

.nwc-events-feed .nwc-eyebrow { display: block; margin-block-end: var(--nwc-space-3); }

.nwc-events-feed .tribe-common,
.nwc-events-feed .tribe-events-widget {
	font-family: var(--nwc-font-body) !important;
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
}

.nwc-events-feed .tribe-events-widget-events-list__widget-title,
.nwc-events-feed .tribe-events-widget-events-list__header,
.nwc-events-feed .tribe-common-c-svgicon {
	display: none !important; /* on remplace le titre par notre propre .nwc-eyebrow */
}

.nwc-events-feed .tribe-events-widget-events-list__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: var(--nwc-space-5);
}

.nwc-events-feed .tribe-events-widget-events-list__event {
	border: 1px solid var(--nwc-mist) !important;
	background-color: var(--nwc-paper) !important;
	border-radius: var(--nwc-radius-lg) !important;
	padding: var(--nwc-space-5) !important;
}

.nwc-events-feed .tribe-events-widget-events-list__event-title a {
	font-family: var(--nwc-font-display) !important;
	color: var(--nwc-ink) !important;
	font-size: var(--nwc-text-h3) !important;
	text-decoration: none !important;
}

.nwc-events-feed .tribe-events-widget-events-list__event-datetime {
	font-family: var(--nwc-font-mono) !important;
	color: var(--nwc-slate) !important;
	letter-spacing: 0.04em;
}

/* État vide : jamais le texte sec par défaut du plugin — on le masque et on
   affiche notre propre message chaleureux (.nwc-empty-state, toujours présent
   dans le gabarit, visible seulement si aucun événement réel n'est publié). */
.nwc-events-feed .tribe-events-widget-events-list__no-upcoming-events,
.nwc-events-feed .tribe-common-form-control-text {
	display: none !important;
}

.nwc-empty-state {
	border: 1.5px dashed var(--nwc-mist-deep);
	border-radius: var(--nwc-radius-lg);
	padding: var(--nwc-space-6);
	color: var(--nwc-ink-soft);
	font-family: var(--nwc-font-body);
}

/* ---------------------------------------------------------------------------
 * 3. Page Dons — cartes de méthode distinctes (jamais mélangées, cf. specs §8),
 * la carte "à confirmer" a un traitement visuel volontairement différent.
 * ------------------------------------------------------------------------- */
/* Repli : le wrapper .nwc-give-grid posé sur le bloc Rowlayout Kadence n'est pas le
   parent direct des colonnes (Kadence insère son propre .kt-row-column-wrap entre les
   deux) — la grille doit donc cibler ce conteneur intermédiaire, pas .nwc-give-grid lui-même.
   Kadence imprime aussi un <style> par bloc dans le <head> (sélecteur
   ".kb-row-layout-id... > .kt-row-column-wrap", même spécificité que la nôtre, chargé après) qui
   fige "grid-template-columns: minmax(0,1fr)" — on ajoute une classe déjà présente sur l'élément
   (".kt-row-layout-equal") du côté droit pour gagner en spécificité sans !important ni retouche
   du générateur Kadence. */
.nwc-give-grid > .kt-row-column-wrap.kt-row-layout-equal {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--nwc-space-6);
	margin-block: var(--nwc-space-7);
}

@media (min-width: 800px) {
	.nwc-give-grid > .kt-row-column-wrap.kt-row-layout-equal { grid-template-columns: repeat(2, 1fr); }
}

.nwc-give-method {
	background-color: var(--nwc-paper);
	border: 1px solid var(--nwc-mist);
	border-radius: var(--nwc-radius-lg);
	padding: var(--nwc-space-6);
}

.nwc-give-method__iban {
	font-family: var(--nwc-font-mono);
	font-size: var(--nwc-text-body);
	background-color: var(--nwc-cream);
	border-radius: var(--nwc-radius-sm);
	padding: var(--nwc-space-3) var(--nwc-space-4);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--nwc-space-3);
	margin-block: var(--nwc-space-4);
}

.nwc-give-method--placeholder {
	background-color: transparent;
	border: 1.5px dashed var(--nwc-mist-deep);
}

.nwc-give-method--placeholder .nwc-eyebrow {
	color: var(--nwc-ember);
}

@media (prefers-reduced-motion: reduce) {
	.nwc-event-feature, .nwc-give-method, .nwc-events-feed .tribe-events-widget-events-list__event {
		transition: none;
	}
}

/* ---------------------------------------------------------------------------
 * 4. Formulaire de contact (bloc "Formulaire avancé" de Kadence, id 1773) —
 * repli assumé : le bloc génère son propre balisage (.kadence-form), on ne
 * peut pas le remplacer, seulement l'habiller avec les jetons du thème.
 * ------------------------------------------------------------------------- */
.nwc-form-card .kadence-form {
	margin-top: var(--nwc-space-4);
}

.nwc-form-card .kb-forms-field-wrap label {
	font-family: var(--nwc-font-body);
	font-weight: 600;
	color: var(--nwc-ink);
}

.nwc-form-card input[type="text"],
.nwc-form-card input[type="email"],
.nwc-form-card input[type="tel"],
.nwc-form-card select,
.nwc-form-card textarea {
	font-family: var(--nwc-font-body) !important;
	border: 1.5px solid var(--nwc-mist-deep) !important;
	border-radius: var(--nwc-radius-sm) !important;
	min-height: 44px;
}

.nwc-form-card button[type="submit"] {
	font-family: var(--nwc-font-body) !important;
	background-color: var(--nwc-gold) !important;
	color: var(--nwc-ink) !important;
	border-radius: var(--nwc-radius-md) !important;
	border: none !important;
}

/* ---------------------------------------------------------------------------
 * 5. Page Événements — fond plein cadre (demande explicite de Jordan, référence
 * visuelle "Partiful", `_team/research/references_visuelles/
 * ref_evenements_partiful_dashboard.png` : dégradé coloré immersif continu
 * derrière toute la zone du haut, les cartes "flottent" dessus avec de vraies
 * marges). Palette du thème (encre/or/braise), pas le violet/bleu de la
 * référence. Un seul événement réel existe (10e anniversaire) : pas de grille
 * à plusieurs cartes inventée, sa carte devient le point focal flottant.
 * ------------------------------------------------------------------------- */

/* Fond flamboyant (dégradés chauds + photo "Halo doré sur fond bleu nuit")
   remplacé à la demande explicite de Jordan (18/10/2026) : "je veux un fond
   clair et épuré" sur la page Actualité. Fond uni désormais géré directement
   sur .nwc-events-darkzone (section 6 plus bas) — toute cette couche
   d'atmosphère (lueurs, photo, halos, particules) est neutralisée ci-dessous
   plutôt que repeinte en clair, pour un vrai fond plat sans dégradé, cohérent
   avec la même demande sur la page Messages. */
.nwc-hero__atmosphere--wide {
	background: none;
}

.nwc-hero__atmosphere--wide::before {
	content: none;
}

/* ---------------------------------------------------------------------------
 * 1bis. Animation douce du fond — particules + halos qui respirent
 * (demande de Jordan, 9/10/2026 : fond jugé trop statique). Scopé à la page
 * Actualité (.nwc-events-darkzone) pour l'instant — pas étendu à l'accueil ni
 * aux autres pages à fond sombre tant que Jordan n'a pas validé le résultat.
 * CSS pur (@keyframes), aucun JS/canvas : coût de performance négligeable,
 * juste `opacity`/`transform`, jamais de propriété qui redéclenche le layout.
 * prefers-reduced-motion : neutralisé via les jetons --nwc-duration-* déjà
 * globaux (tokens.css les met à 0ms), donc animation-duration:0 suffit à
 * figer particules et halos sans dupliquer la media query ici.
 * ------------------------------------------------------------------------- */

/* Halos : les radial-gradient existants (background statique ci-dessus,
   règle .nwc-hero__atmosphere--wide) restent en place pour la lecture
   immédiate de la page (jamais écran vide avant que l'animation démarre) —
   .nwc-halo-breathe (vrai élément enfant dans le balisage, post 1575, PAS un
   ::after : .nwc-hero__atmosphere::after est déjà pris par le grain SVG de
   base.css, se le réapproprier ici aurait écrasé cette texture sur TOUTES
   les pages qui réutilisent .nwc-hero__atmosphere) superpose une COPIE des
   mêmes lueurs qui respire doucement en opacité, par-dessus la version fixe. */
/* Reprendre les MÊMES dégradés que le fond statique (comme avant) les rendait
   quasi invisibles : en haut de page, le fond est déjà très lumineux (photo
   dorée), un halo doré de plus par-dessus ne se voit pas ; le gain
   d'opacité (0.55→1 sur une couleur déjà présente) ne suffisait pas à se
   distinguer (constat de Jordan : "je ne vois aucun halo"). Nouvelle
   version : un halo plus VIF et plus GRAND que les dégradés de fond,
   `background-blend-mode: screen` pour qu'il éclaircisse visiblement même
   la zone sombre du bas de page (où le fond est encre unie, donc tout
   ajout de lumière y est immédiatement visible), et une teinte légèrement
   différente (un halo chaud + un halo plus frais) pour un vrai effet de
   profondeur plutôt qu'une simple variation d'un même dégradé. */
/* Halo devenu un élément répétable (comme .nwc-sparkle) : plusieurs
   instances positionnées via variables inline dans le balisage (post 1575),
   demande de Jordan ("plus nombreux et en mouvement plus rapide" — après
   un premier réglage où il demandait l'inverse, "trop en mouvement" : donc
   le déplacement reste modéré en amplitude, mais le RYTHME (durée de la
   boucle) est maintenant rapide ; plusieurs halos désynchronisés donnent
   l'impression de mouvement constant sans qu'un seul élément ne doive
   bouger beaucoup). Teinte et taille variables par instance. */
.nwc-halo-breathe {
	position: absolute;
	left: var(--nwc-halo-x, 25%);
	top: var(--nwc-halo-y, 20%);
	width: var(--nwc-halo-size, 42rem);
	height: var(--nwc-halo-size, 42rem);
	transform: translate(-50%, -50%);
	margin: 0;
	pointer-events: none;
	mix-blend-mode: screen;
	background: radial-gradient(circle, var(--nwc-halo-color, oklch(85% 0.15 80 / 1)), transparent 58%);
	animation: nwc-halo-breathe var(--nwc-halo-duration, 6s) ease-in-out infinite;
	animation-delay: var(--nwc-halo-delay, 0s);
	will-change: opacity, transform;
}

@keyframes nwc-halo-breathe {
	0%   { opacity: 0.45; transform: translate(-50%, -50%) scale(1); }
	30%  { opacity: 1;    transform: translate(calc(-50% + 1.5%), calc(-50% - 2%)) scale(1.06); }
	55%  { opacity: 0.45; transform: translate(calc(-50% - 2%), calc(-50% + 1.3%)) scale(0.95); }
	80%  { opacity: 0.85; transform: translate(calc(-50% + 1.3%), calc(-50% + 2%)) scale(1.04); }
	100% { opacity: 0.45; transform: translate(-50%, -50%) scale(1); }
}

/* Particules : petits points or, montée très lente + scintillement, délais et
   durées différents par particule (variables inline dans le balisage, post
   1575) pour un effet non synchronisé — jamais un "clignotement" groupé. */
.nwc-sparkle {
	position: absolute;
	left: var(--nwc-sparkle-x, 50%);
	top: var(--nwc-sparkle-y, 50%);
	width: 3px;
	height: 3px;
	border-radius: 50%;
	background: var(--nwc-gold);
	box-shadow: 0 0 6px 1px oklch(74% 0.135 75 / 0.7);
	opacity: 0;
	animation-name: nwc-sparkle-drift;
	animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;
	animation-duration: var(--nwc-sparkle-duration, 8s);
	animation-delay: var(--nwc-sparkle-delay, 0s);
	will-change: opacity, transform;
}

@keyframes nwc-sparkle-drift {
	0% { opacity: 0; transform: translateY(0); }
	15% { opacity: 0.9; }
	50% { opacity: 0.35; transform: translateY(-14px); }
	85% { opacity: 0.8; }
	100% { opacity: 0; transform: translateY(-26px); }
}

/* reduced motion : figé net (pas de transition résiduelle), en plus du repli
   global --nwc-duration-slow:0ms déjà appliqué au halo via la variable. */
@media (prefers-reduced-motion: reduce) {
	.nwc-halo-breathe {
		animation: none;
		opacity: 0.55;
	}

	.nwc-sparkle {
		animation: none;
		opacity: 0.5;
	}
}

/* 9rem de padding-bottom (ex var(--nwc-space-10)) + 2rem de margin-top sur
   la grille juste en dessous créaient un vide de ~11rem entre le texte
   d'intro et les cartes — bien trop (second constat de Jordan, après avoir
   déjà réduit une première fois le chevauchement négatif d'origine). Réduit
   aux deux au minimum nécessaire pour respirer sans excès. */
.nwc-hero--events {
	padding-bottom: var(--nwc-space-5) !important;
}

/* Titre/sous-titre du hero (balisage éditeur, couleur inline color:var(--nwc-cream)
   / color:var(--nwc-mist) pensée pour l'ancien fond sombre) : repasse en encre pour
   rester lisible sur le nouveau fond clair. !important nécessaire pour battre le
   style inline. */
.nwc-hero--events,
.nwc-hero--events h1 {
	color: var(--nwc-ink) !important;
}

.nwc-hero--events .nwc-lead {
	color: var(--nwc-ink-soft) !important;
}

.nwc-event-feature-wrap {
	position: relative;
	z-index: 1;
	margin-top: 0;
	/* Grille resserrée (constat de Jordan : "les carrés sont beaucoup trop
	   grands") : à 3 colonnes sur la pleine largeur du conteneur standard
	   (72rem), chaque carte dépassait 350px de large. Plafond dédié, plus
	   étroit, pour des cartes à taille plus éditoriale. */
	max-width: 58rem;
	margin-inline: auto;
}

.nwc-event-feature {
	box-shadow: var(--nwc-shadow-lg);
}

@media (max-width: 48rem) {
	.nwc-event-feature-wrap {
		margin-top: var(--nwc-space-5);
	}
}

/* ---------------------------------------------------------------------------
 * 6. Zone sombre continue — correction suite au contrôle indépendant
 * [VERIF-EVENEMENTS] (verdict : le dégradé s'arrêtait net après la carte
 * événement, rupture nette avec le reste de la page resté sur fond blanc).
 * Le fond chaud/texturé couvre maintenant tout le bloc hero + carte +
 * calendrier + infos hebdomadaires, pas seulement le haut — "plein cadre"
 * demandé par Jordan sur toute la zone de contenu de la page, le footer
 * (hors de cette zone) reste sur le fond crème standard du site.
 * ------------------------------------------------------------------------- */
.nwc-events-darkzone {
	position: relative;
	/* Fond clair uni (demande de Jordan, 18/10/2026) : une seule couleur plate,
	   pas de dégradé, même teinte que le reste du site (--nwc-cream, déjà le
	   fond chaleureux utilisé ailleurs) — et même choix que la page Messages
	   pour rester cohérent entre les deux. */
	background-color: var(--nwc-cream);
	overflow: hidden;
}

/* Halos/particules/photo : conçus pour un fond sombre, neutralisés ici plutôt
   que repeints — un fond clair "épuré" n'en a plus besoin. */
.nwc-events-darkzone__atmosphere {
	display: none;
}

/* Carte événement : l'encre uni d'origine devient redondant maintenant que
   tout l'arrière-plan est déjà sombre/texturé — surface légèrement plus
   claire que le fond pour continuer à se distinguer comme une carte. */
.nwc-events-darkzone .nwc-event-feature {
	background-color: oklch(27% 0.05 265 / 0.92);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
}

/* Widget "Événements à venir" (The Events Calendar, legacy widget) : texte
   et cartes adaptés pour rester lisibles sur fond sombre — seules des
   propriétés de couleur/fond sont redéfinies, aucune structure touchée. */
.nwc-events-darkzone .nwc-events-feed {
	position: relative;
	z-index: 1;
	/* Texte ambiant posé directement sur le fond clair (pas sur une carte sombre) :
	   encre, pas crème. */
	color: var(--nwc-ink);
}

.nwc-events-darkzone .tribe-events-widget-events-list__event-title a,
.nwc-events-darkzone .tribe-events-widget-events-list__event-datetime,
.nwc-events-darkzone .tribe-events-widget-events-list__event-venue {
	color: var(--nwc-cream) !important;
}

.nwc-events-darkzone .tribe-events-widget-events-list__event-title a {
	text-decoration-color: var(--nwc-gold) !important;
}

.nwc-events-darkzone .tribe-events-widget-events-list__event {
	background-color: oklch(27% 0.05 265 / 0.85) !important;
	border-radius: var(--nwc-radius-md);
	box-shadow: var(--nwc-shadow-sm);
}

.nwc-events-darkzone .tribe-events-widget-events-list__event-date-tag-datetime,
.nwc-events-darkzone .tribe-events-widget-events-list__event-date-tag-weekday {
	color: var(--nwc-gold) !important;
}

.nwc-events-darkzone a:not(.nwc-button) {
	/* --nwc-gold manque de contraste sur le fond clair (ratio ~2.1:1, pensé pour
	   l'ancien fond sombre) — gold-deep (~3.5:1) sur un fond désormais clair. */
	color: var(--nwc-gold-deep);
}

.nwc-events-darkzone a.nwc-button--primary {
	color: var(--nwc-ink) !important;
}

/* Encart "Chaque semaine" : fond désormais clair — bordure et texte redeviennent
   sombres (comme l'état par défaut de .nwc-empty-state, section 2) plutôt que
   la variante claire pensée pour l'ancien fond sombre. */
.nwc-events-darkzone .nwc-empty-state {
	border-color: var(--nwc-mist-deep) !important;
	background-color: transparent;
	color: var(--nwc-ink-soft);
}

.nwc-events-darkzone .nwc-events-panel__empty {
	border-color: var(--nwc-mist-deep);
	color: var(--nwc-ink-soft);
}

.nwc-events-darkzone .nwc-events-panel__empty strong {
	color: var(--nwc-ink);
}

/* ---------------------------------------------------------------------------
 * 7. Dashboard d'événements (grille de cartes) — refonte suite au retour de
 * Jordan sur la V1 (une seule grande carte, pas une grille). Inspiration
 * Partiful ("mes événements" : onglets + grille de cartes portrait), adaptée
 * au contexte église : onglets "À venir / Récurrents / Passés" (pas de
 * Hosting/Attended, pas de système d'inscription utilisateur sur ce site),
 * cartes avec badge date + titre/lieu sous la carte à la place de
 * "Hosted by + avatar". Le fond continu (.nwc-events-darkzone, section 6
 * ci-dessus, désormais clair et uni) reste inchangé par cette section, ces
 * cartes flottent dessus.
 * ------------------------------------------------------------------------- */

/* --- Onglets de filtre --- */
.nwc-events-tabbar {
	display: flex;
	gap: var(--nwc-space-2);
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
	padding-block: var(--nwc-space-1);
}

.nwc-events-tabbar::-webkit-scrollbar {
	display: none;
}

/* Onglets posés directement sur le fond ambiant désormais clair (section 6) :
   couleurs claires (mist/cream, pensées pour l'ancien fond sombre) devenues
   illisibles — repassées en encre (retour de Jordan du 18/10/2026 sur les
   titres de carte juste au-dessus, même cause ici). */
.nwc-events-tab {
	flex: 0 0 auto;
	font-family: var(--nwc-font-body);
	font-size: var(--nwc-text-small);
	font-weight: 600;
	color: var(--nwc-ink-soft);
	background: transparent;
	border: none;
	border-radius: 999px;
	padding: var(--nwc-space-2) var(--nwc-space-4);
	cursor: pointer;
	transition: background-color var(--nwc-duration-fast) var(--nwc-ease),
		color var(--nwc-duration-fast) var(--nwc-ease);
}

.nwc-events-tab:hover {
	color: var(--nwc-ink);
}

.nwc-events-tab:focus-visible {
	outline: 2px solid var(--nwc-gold);
	outline-offset: 2px;
}

.nwc-events-tab.is-active {
	background-color: var(--nwc-cream);
	color: var(--nwc-ink);
}

/* --- Panneaux --- */
.nwc-events-panels {
	margin-top: var(--nwc-space-6);
}

[data-nwc-events-panel][hidden] {
	display: none;
}

.nwc-events-panel__empty {
	border: 1.5px dashed oklch(97% 0.014 83 / 0.25);
	border-radius: var(--nwc-radius-lg);
	padding: var(--nwc-space-6);
	color: var(--nwc-mist);
	font-family: var(--nwc-font-body);
}

.nwc-events-panel__empty strong {
	color: var(--nwc-cream);
}

/* --- Grille de cartes --- */
.nwc-event-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: var(--nwc-space-4);
}

@media (min-width: 640px) {
	.nwc-event-grid { grid-template-columns: repeat(3, 1fr); gap: var(--nwc-space-5); }
}

@media (min-width: 960px) {
	.nwc-event-grid { grid-template-columns: repeat(3, 1fr); gap: var(--nwc-space-6); }
}

.nwc-event-card {
	display: block;
	text-decoration: none;
	color: inherit;
}

.nwc-event-card__frame {
	position: relative;
	aspect-ratio: 3 / 4;
	border-radius: var(--nwc-radius-lg);
	overflow: hidden;
	background-color: var(--nwc-ink);
	background-image: linear-gradient(155deg, var(--nwc-ember) 0%, var(--nwc-ink) 72%);
	box-shadow: var(--nwc-shadow-md);
	transition: transform var(--nwc-duration-fast) var(--nwc-ease);
}

a.nwc-event-card:hover .nwc-event-card__frame,
a.nwc-event-card:focus-visible .nwc-event-card__frame {
	transform: translateY(-3px);
}

a.nwc-event-card:focus-visible {
	outline: 2px solid var(--nwc-gold);
	outline-offset: 3px;
	border-radius: var(--nwc-radius-lg);
}

.nwc-event-card__frame img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

.nwc-event-card__frame--cover img {
	object-fit: cover;
}

/* Affiche officielle (10e anniversaire) : doit s'afficher ENTIÈRE (exigence
   déjà actée section 1 ci-dessus), jamais recadrée même dans une carte
   de grille — object-fit: contain, le dégradé de fond comble les marges. */
.nwc-event-card__frame--contain img {
	object-fit: contain;
}

.nwc-event-card__badge-date {
	position: absolute;
	top: var(--nwc-space-3);
	left: var(--nwc-space-3);
	background-color: var(--nwc-paper);
	color: var(--nwc-ink);
	font-family: var(--nwc-font-mono);
	font-size: 0.6875rem;
	letter-spacing: 0.02em;
	font-weight: 600;
	border-radius: 999px;
	padding: 0.35em 0.75em;
	line-height: 1.3;
}

.nwc-event-card__badge-tag {
	position: absolute;
	bottom: var(--nwc-space-3);
	right: var(--nwc-space-3);
	background-color: oklch(23% 0.05 265 / 0.72);
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
	color: var(--nwc-cream);
	font-family: var(--nwc-font-mono);
	font-size: 0.6875rem;
	letter-spacing: 0.04em;
	font-weight: 600;
	border-radius: 999px;
	padding: 0.35em 0.75em;
}

/* Badge "Chaque semaine" (demande de Jordan) : distingue visuellement les
   événements récurrents du badge "10 ANS" (ponctuel) — fond or plutôt
   qu'encre translucide, posé en haut à gauche pour ne pas se chevaucher
   avec le badge-date de la 10e anniversaire (en haut à droite ailleurs),
   et rester lisible même sur une affiche déjà chargée en haut. */
.nwc-event-card__badge-tag--recurring {
	top: var(--nwc-space-3);
	bottom: auto;
	left: var(--nwc-space-3);
	right: auto;
	background-color: var(--nwc-gold);
	color: var(--nwc-ink);
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
}

.nwc-event-card__meta {
	margin-top: var(--nwc-space-3);
}

/* Texte sous la carte (titre + lieu) : posé directement sur le fond ambiant
   de la page (.nwc-events-darkzone, section 6 — désormais --nwc-cream plat),
   PAS sur la photo/dégradé de la carte elle-même (.nwc-event-card__frame,
   qui reste sombre et garde son propre texte clair quand il y en a). Couleurs
   claires (cream/mist, pensées pour l'ancien fond sombre plein cadre)
   devenues illisibles sur fond clair — retour direct de Jordan avec capture,
   18/10/2026. Repassées en encre, même méthode que .nwc-hero--events plus haut. */
.nwc-event-card__title {
	display: block;
	font-family: var(--nwc-font-display);
	font-weight: 700;
	color: var(--nwc-ink);
	font-size: var(--nwc-text-small);
	line-height: var(--nwc-leading-snug);
}

.nwc-event-card__place {
	display: flex;
	align-items: center;
	gap: 0.4em;
	margin-top: 0.3em;
	color: var(--nwc-ink-soft);
	font-family: var(--nwc-font-body);
	font-size: 0.8125rem;
}

.nwc-event-card__place svg {
	flex: 0 0 auto;
	width: 12px;
	height: 12px;
	color: var(--nwc-gold);
}

@media (prefers-reduced-motion: reduce) {
	.nwc-event-card__frame, .nwc-events-tab {
		transition: none;
	}
}

/* ---------------------------------------------------------------------------
   Entrée en cascade + survol renforcé des cartes événement (demande de
   Jordan, 10/10/2026, "rendre la page visuellement dynamique") : la grille
   entière (.nwc-event-grid.nwc-reveal) ne faisait qu'un seul fondu en bloc —
   chaque carte entre maintenant individuellement, décalée dans le temps (voir
   js/events-dynamic.js), sans dépendre du système .nwc-reveal générique
   (cartes issues d'un plugin, pas de notre markup).
--------------------------------------------------------------------------- */
.nwc-event-card {
	opacity: 0;
	transform: translateY(18px);
	transition: opacity 0.6s var(--nwc-ease), transform 0.6s var(--nwc-ease), filter var(--nwc-duration-fast) var(--nwc-ease);
	transition-delay: calc(var(--nwc-card-i, 0) * 70ms);
}

.nwc-event-card.is-visible {
	opacity: 1;
	transform: translateY(0);
}

a.nwc-event-card:hover .nwc-event-card__frame,
a.nwc-event-card:focus-visible .nwc-event-card__frame {
	transform: translateY(-6px) scale(1.015);
	box-shadow: 0 22px 44px oklch(23% 0.05 265 / 0.3), 0 8px 16px oklch(23% 0.05 265 / 0.18);
}

a.nwc-event-card:hover .nwc-event-card__frame img,
a.nwc-event-card:focus-visible .nwc-event-card__frame img {
	transform: scale(1.06);
}

.nwc-event-card__frame img {
	transition: transform 0.6s var(--nwc-ease);
}

@media (prefers-reduced-motion: reduce) {
	.nwc-event-card {
		opacity: 1;
		transform: none;
		transition: none;
	}
}
