/**
 * Animations du thème Espoir Hérault.
 *
 * Feuille séparée, chargée après theme.css : le mouvement est isolé du reste,
 * on peut le couper d'un seul retrait dans functions.php sans toucher aux
 * styles de mise en page.
 *
 * Règle de conduite : toute animation de cette feuille doit être neutralisée
 * sous `prefers-reduced-motion`. Un halo qui pulse en boucle est exactement le
 * genre de mouvement périphérique et permanent qui déclenche gêne, nausée ou
 * crise chez les personnes sensibles au mouvement — et le réglage système
 * existe pour ça.
 */

/* ---------------------------------------------------------------------------
 * Halo luisant du bouton d'ouverture du menu (mobile)
 *
 * L'onde est portée par un pseudo-élément et non par le bouton lui-même : la
 * pastille garde ainsi son ombre portée fixe (`1px 1px 5px grey`), que le
 * halo viendrait sinon écraser à chaque image de l'animation.
 * ------------------------------------------------------------------------ */

/*
 * Découpage temporel de l'animation, sur 2.3s :
 *
 *   0 -> 30%    (0,69s)  l'onde part et se dissipe
 *   30 -> 100%  (1,61s)  temps mort, rien à l'écran
 *
 * Le palier à 30.01% ramène l'onde à zéro *pendant* qu'elle est transparente :
 * sans lui, le navigateur interpolerait le retour à l'état initial sur les 70%
 * restants et le temps mort n'existerait pas — l'onde rétrécirait lentement au
 * lieu de disparaître.
 */
@keyframes eh-halo {
	0% {
		box-shadow:
			0 0 0 0 rgba(236, 104, 72, 0.7),
			0 0 3px 1px rgba(236, 104, 72, 0.4);
	}

	30% {
		box-shadow:
			0 0 0 8px rgba(236, 104, 72, 0),
			0 0 8px 3px rgba(236, 104, 72, 0);
	}

	30.01%,
	100% {
		box-shadow:
			0 0 0 0 rgba(236, 104, 72, 0),
			0 0 3px 1px rgba(236, 104, 72, 0);
	}
}

@media (max-width: 991.98px) {
	.navbar .navbar-toggler::after {
		content: "";
		position: absolute;
		inset: -2px;
		border-radius: 50%;
		pointer-events: none;
		animation: eh-halo 2.3s ease-out infinite;
	}

	/* Le halo s'interrompt quand le menu est ouvert : il a rempli son office. */
	.navbar .navbar-toggler[aria-expanded="true"]::after {
		animation: none;
	}
}

/* ---------------------------------------------------------------------------
 * Flèche des boutons « Lire la suite » / « Toutes nos actualités » et de
 * l'encart promo de l'accueil (.eh-promo)
 *
 * Au survol ou au focus clavier du bouton, la flèche glisse de 3px vers la
 * droite, puis revient — le mouvement de l'encart promo de la v1
 * (.home-promo-encart-arrow), repris tel quel. La flèche seule bouge, pas le
 * libellé : la transition est posée sur l'icône, le déclencheur est le bouton.
 * ------------------------------------------------------------------------ */

.eh-news-more-arrow,
.eh-promo-arrow,
.eh-page-next-arrow,
.eh-page-prev-arrow {
	transition: transform 0.2s ease;
}

/* La flèche du « Précédent » glisse vers la gauche. */
.eh-page-prev:hover .eh-page-prev-arrow,
.eh-page-prev:focus-visible .eh-page-prev-arrow {
	transform: translateX(-3px);
}

.eh-news-more:hover .eh-news-more-arrow,
.eh-news-more:focus-visible .eh-news-more-arrow,
.eh-promo:hover .eh-promo-arrow,
.eh-promo:focus-visible .eh-promo-arrow,
.eh-page-next:hover .eh-page-next-arrow,
.eh-page-next:focus-visible .eh-page-next-arrow {
	transform: translateX(3px);
}

/* ---------------------------------------------------------------------------
 * Cartes d'actualités de l'accueil : zoom de l'image au survol
 *
 * Au survol de la carte entière, ou quand un de ses liens a le focus clavier
 * (`:focus-within`), l'image grossit de 6 % à l'intérieur de son cadre, qui
 * ne bouge pas : le cadre est coupé (`overflow: hidden`) et garde les coins
 * arrondis de la carte. Le texte et le bouton restent immobiles. Accueil
 * seulement (`.home`), pas sur la liste par année. La transition légèrement
 * plus longue au retour (0,5s) évite l'effet de « claquement » quand la
 * souris quitte la carte.
 * ------------------------------------------------------------------------ */

.home .eh-news-image {
	display: block;
	overflow: hidden;
	border-radius: var(--bs-card-inner-border-radius) var(--bs-card-inner-border-radius) 0 0;
}

.home .eh-news-image img {
	transform: scale(1);
	transform-origin: center;
	transition: transform 0.5s ease;
	will-change: transform;
}

.home .eh-news-card:hover .eh-news-image img,
.home .eh-news-card:focus-within .eh-news-image img {
	transform: scale(1.06);
	transition-duration: 0.35s;
}

/* ---------------------------------------------------------------------------
 * Blocs-image des sections de l'accueil (.eh-block-image) : même zoom de
 * l'image au survol que les cartes d'actualités.
 * ------------------------------------------------------------------------ */

.eh-block-image .eh-block-bg {
	transform: scale(1);
	transition: transform 0.5s ease;
	will-change: transform;
}

a.eh-block-image:hover .eh-block-bg,
a.eh-block-image:focus-visible .eh-block-bg {
	transform: scale(1.06);
	transition-duration: 0.35s;
}

/* ---------------------------------------------------------------------------
 * Défilement des logos partenaires (.eh-marquee)
 *
 * La piste contient N copies de la ligne (variable --eh-marquee-copies, posée
 * par le fragment) et se déplace d'exactement une copie, soit 100/N % de sa
 * largeur, avant de reboucler : la première image de l'animation et la
 * dernière sont identiques, le raccord est invisible. Ligne 1 vers la droite
 * (de -1/N à 0), ligne 2 vers la gauche (de 0 à -1/N). Durée par ligne dans
 * --eh-marquee-duration (5 s par logo). Le survol met la ligne en pause, pour
 * cliquer sur un logo. Le passage du gris à la couleur est adouci.
 * ------------------------------------------------------------------------ */

@keyframes eh-marquee-ltr {
	from { transform: translateX(calc(-100% / var(--eh-marquee-copies, 4))); }
	to   { transform: translateX(0); }
}

@keyframes eh-marquee-rtl {
	from { transform: translateX(0); }
	to   { transform: translateX(calc(-100% / var(--eh-marquee-copies, 4))); }
}

.eh-marquee-track {
	animation: eh-marquee-rtl var(--eh-marquee-duration, 40s) linear infinite;
	will-change: transform;
}

.eh-marquee-ltr .eh-marquee-track {
	animation-name: eh-marquee-ltr;
}

.eh-marquee:hover .eh-marquee-track,
.eh-marquee:focus-within .eh-marquee-track {
	animation-play-state: paused;
}

.eh-partner-logo {
	transition: filter 0.3s ease, opacity 0.3s ease;
}

/* ---------------------------------------------------------------------------
 * Cartes des pages de section (.eh-section-card) : au survol, l'ombre
 * s'atténue et la carte descend de 3px — elle semble s'aplatir, comme
 * enfoncée. Valeurs dans theme.css, ici seulement la transition.
 * ------------------------------------------------------------------------ */

.eh-section-card {
	transition: box-shadow 0.12s ease-out, transform 0.12s ease-out;
}

/* ---------------------------------------------------------------------------
 * Retour en haut de page (.eh-back-to-top)
 *
 * theme.js retire l'attribut `hidden` et pose `.is-visible` après 300px de
 * défilement : le bouton monte de 8px en apparaissant, redescend en
 * disparaissant. Le défilement vers le haut lui-même est demandé en
 * `behavior: smooth` par theme.js, sauf sous mouvement réduit.
 * ------------------------------------------------------------------------ */

.eh-back-to-top {
	opacity: 0;
	transform: translateY(8px);
	transition: opacity 0.25s ease, transform 0.25s ease, background-color 0.2s ease;
	pointer-events: none;
}

.eh-back-to-top.is-visible {
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
}

/* ---------------------------------------------------------------------------
 * Cartes des partenaires (.eh-partner-card) : le logo grossit de 6 % au
 * survol, le cadre change de couleur en douceur.
 * ------------------------------------------------------------------------ */

.eh-partner-card {
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.eh-partner-grid-logo {
	transition: transform 0.35s ease;
}

.eh-partner-card:hover .eh-partner-grid-logo,
.eh-partner-card:focus-visible .eh-partner-grid-logo {
	transform: scale(1.06);
}

/* ---------------------------------------------------------------------------
 * Onglets en boutons : le dernier bouton pulse doucement (la v1 mettait en
 * avant « Vente solidaire » ainsi), s'arrête au survol et une fois ouvert.
 * ------------------------------------------------------------------------ */

@keyframes eh-bouton-pulse {
	0% { transform: scale(1); box-shadow: 3px 3px 4px #bfbfbf, 0 0 0 0 rgba(236, 104, 72, 0.5); }
	70% { transform: scale(1.04); box-shadow: 3px 3px 4px #bfbfbf, 0 0 0 12px rgba(236, 104, 72, 0); }
	100% { transform: scale(1); box-shadow: 3px 3px 4px #bfbfbf, 0 0 0 0 rgba(236, 104, 72, 0); }
}

.eh-tabs-buttons .nav-link {
	transition: background-color 0.2s ease, color 0.2s ease;
}

.eh-tabs-buttons .nav-item:last-child .nav-link:not(.active):not(:hover) {
	animation: eh-bouton-pulse 2s ease-out infinite;
}

/* ---------------------------------------------------------------------------
 * Mouvement réduit
 * ------------------------------------------------------------------------ */

@media (prefers-reduced-motion: reduce) {
	.navbar .navbar-toggler::after {
		animation: none;
	}

	.eh-news-more-arrow,
	.eh-promo-arrow,
	.eh-page-next-arrow,
	.eh-page-prev-arrow {
		transition: none;
	}

	.eh-page-prev:hover .eh-page-prev-arrow,
	.eh-page-prev:focus-visible .eh-page-prev-arrow {
		transform: none;
	}

	.eh-news-more:hover .eh-news-more-arrow,
	.eh-news-more:focus-visible .eh-news-more-arrow,
	.eh-promo:hover .eh-promo-arrow,
	.eh-promo:focus-visible .eh-promo-arrow,
	.eh-page-next:hover .eh-page-next-arrow,
	.eh-page-next:focus-visible .eh-page-next-arrow {
		transform: none;
	}

	.home .eh-news-image img {
		transition: none;
		will-change: auto;
	}

	.home .eh-news-card:hover .eh-news-image img,
	.home .eh-news-card:focus-within .eh-news-image img {
		transform: none;
	}

	.eh-block-image .eh-block-bg {
		transition: none;
		will-change: auto;
	}

	a.eh-block-image:hover .eh-block-bg,
	a.eh-block-image:focus-visible .eh-block-bg {
		transform: none;
	}

	.eh-marquee-track {
		animation: none;
		will-change: auto;
	}

	.eh-section-card {
		transition: none;
	}

	.eh-back-to-top {
		transition: none;
		transform: none;
	}

	.eh-partner-card,
	.eh-partner-grid-logo {
		transition: none;
	}

	.eh-tabs-buttons .nav-item:last-child .nav-link:not(.active):not(:hover) {
		animation: none;
	}

	.eh-partner-card:hover .eh-partner-grid-logo,
	.eh-partner-card:focus-visible .eh-partner-grid-logo {
		transform: none;
	}

	.eh-section-card:hover,
	.eh-section-card:focus-within {
		transform: none;
	}

	.eh-partner-logo {
		transition: none;
	}
}