/*
 * IMT — couche « vivante » : formes plus douces, survols, apparitions, galeries, logos défilants.
 * Chargée après imt.css. Tout mouvement est coupé si le visiteur demande à réduire les animations.
 */

:root {
	--imt-radius: 14px;
	--imt-radius-btn: 999px;
	--imt-ombre: 0 1px 2px rgba(15, 30, 58, .06), 0 8px 24px rgba(15, 30, 58, .06);
	--imt-ombre-haute: 0 2px 4px rgba(15, 30, 58, .06), 0 22px 44px rgba(15, 30, 58, .14);
	--imt-ressort: cubic-bezier(.2, .8, .2, 1.15);
	--imt-doux: cubic-bezier(.2, .7, .2, 1);
}

/* ---------- Apparition au défilement ---------- */
.imt-anime .imt-revele {
	transition: opacity .7s var(--imt-doux), transform .7s var(--imt-doux);
	transition-delay: var(--imt-delai, 0ms);
}
.imt-anime .imt-revele:not(.est-visible) {
	opacity: 0;
	transform: translateY(28px);
}
.imt-anime .imt-photo.imt-revele:not(.est-visible),
.imt-anime .imt-filiere-entete__photo.imt-revele:not(.est-visible) {
	transform: translateY(20px) scale(.97);
}

/* ---------- En-tête collant ---------- */
.imt-entete-collant {
	position: sticky;
	top: calc(var(--wp-admin--admin-bar--height, 0px) - var(--imt-bandeau-h, 0px));
	z-index: 50;
}
.imt-entete {
	transition: box-shadow .3s ease, background-color .3s ease;
}
.imt-a-defile .imt-entete {
	box-shadow: 0 6px 24px rgba(15, 30, 58, .10);
	background-color: rgba(255, 255, 255, .94) !important;
	backdrop-filter: saturate(1.4) blur(10px);
	-webkit-backdrop-filter: saturate(1.4) blur(10px);
}
.imt-entete .wp-block-site-logo img {
	transition: max-height .3s ease, transform .4s var(--imt-ressort);
}
.imt-a-defile .imt-entete .wp-block-site-logo img {
	max-height: 46px;
}
.imt-entete .wp-block-site-logo:hover img {
	transform: rotate(-6deg) scale(1.06);
}
.imt-entete .wp-block-navigation-item__content {
	position: relative;
}
.imt-entete .wp-block-navigation .wp-block-navigation-item__content::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: -6px;
	height: 3px;
	border-radius: 3px;
	background: var(--wp--preset--color--accent);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .35s var(--imt-doux);
}
.imt-entete .wp-block-navigation .wp-block-navigation-item__content:hover::after {
	transform: scaleX(1);
}

/* ---------- Boutons ---------- */
.wp-block-button__link,
.imt-bouton {
	transition: transform .25s var(--imt-ressort), box-shadow .25s ease, background-color .2s ease, color .2s ease;
}
.wp-block-button__link:hover,
.imt-bouton:hover {
	transform: translateY(-2px);
	box-shadow: 0 10px 22px rgba(15, 30, 58, .18);
}
.wp-block-button__link:active,
.imt-bouton:active {
	transform: translateY(0) scale(.98);
	box-shadow: none;
}
.wp-block-button.is-style-outline .wp-block-button__link {
	padding-left: 24px;
	padding-right: 24px;
}

/* Bouton WhatsApp : un léger battement pour attirer l'œil. */
.imt-bouton--whatsapp {
	position: relative;
}
.imt-bouton--whatsapp::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	box-shadow: 0 0 0 0 rgba(18, 140, 74, .45);
	animation: imt-onde 2.8s ease-out infinite;
	pointer-events: none;
}
@keyframes imt-onde {
	0% { box-shadow: 0 0 0 0 rgba(18, 140, 74, .45); }
	70%, 100% { box-shadow: 0 0 0 14px rgba(18, 140, 74, 0); }
}

/* ---------- Cartes ---------- */
.wp-block-group.is-style-carte {
	box-shadow: var(--imt-ombre);
	border-color: rgba(15, 30, 58, .08);
}
.imt-carte-lien,
.imt-pole,
.imt-carte-produit,
.imt-carte-filiere,
.imt-tuile {
	transition: transform .35s var(--imt-ressort), box-shadow .35s ease, border-color .25s ease;
}
.imt-carte-lien:hover,
.imt-pole:hover,
.imt-carte-produit:hover,
.imt-carte-filiere:hover,
.imt-tuile:hover {
	transform: translateY(-6px);
	box-shadow: var(--imt-ombre-haute);
}
.imt-pole,
.imt-carte-produit,
.imt-carte-filiere {
	border-radius: var(--imt-radius) !important;
	box-shadow: var(--imt-ombre);
}

/* Liens fléchés « … → » : la flèche avance au survol. */
.imt-carte-lien p:last-child,
.imt-carte-filiere__lien {
	transition: letter-spacing .3s var(--imt-doux), transform .3s var(--imt-doux);
}
.imt-carte-lien:hover p:last-child,
.imt-carte-filiere:hover .imt-carte-filiere__lien {
	transform: translateX(6px);
}

/* Carte avec photo pleine largeur en tête. */
.wp-block-group.imt-carte-photo {
	padding-top: 0 !important;
	overflow: hidden;
}
.imt-carte-photo .imt-carte-photo__img {
	margin: 0 -24px 6px !important;
	width: calc(100% + 48px);
	max-width: none;
	aspect-ratio: 16 / 10;
	overflow: hidden;
}
.imt-carte-photo .imt-carte-photo__img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 50% 25%;
	display: block;
	transition: transform .8s var(--imt-doux);
}
.imt-carte-photo:hover .imt-carte-photo__img img {
	transform: scale(1.07);
}

/* ---------- Photos ---------- */
.imt-photo img {
	border-radius: var(--imt-radius);
}
.imt-photo--bandeau img {
	aspect-ratio: 21 / 9;
	height: auto;
	box-shadow: var(--imt-ombre-haute);
}
.imt-photo--portrait img {
	aspect-ratio: 4 / 5;
	height: auto;
	border-radius: 18px 18px 18px 72px;
	box-shadow: var(--imt-ombre-haute);
}

/* Photo d'accueil : formes colorées qui flottent derrière. */
.imt-photo--hero {
	position: relative;
	isolation: isolate;
}
.imt-photo--hero img {
	border-radius: 24px 24px 24px 96px;
	box-shadow: var(--imt-ombre-haute);
}
.imt-photo--hero::before,
.imt-photo--hero::after {
	content: "";
	position: absolute;
	z-index: -1;
	border-radius: 50%;
	pointer-events: none;
}
.imt-photo--hero::before {
	width: 46%;
	aspect-ratio: 1;
	right: -6%;
	top: -8%;
	background: var(--wp--preset--color--accent);
	opacity: .9;
	animation: imt-flotte 9s ease-in-out infinite;
}
.imt-photo--hero::after {
	width: 30%;
	aspect-ratio: 1;
	left: -7%;
	bottom: -7%;
	background: radial-gradient(circle, var(--wp--preset--color--primary) 2px, transparent 2.5px) 0 0 / 14px 14px;
	border-radius: 0;
	opacity: .55;
	animation: imt-flotte 11s ease-in-out infinite reverse;
}
@keyframes imt-flotte {
	0%, 100% { transform: translate(0, 0) rotate(0deg); }
	50% { transform: translate(-10px, 14px) rotate(8deg); }
}
@media (max-width: 781px) {
	.imt-photo--hero::before { right: -2%; top: -4%; }
	.imt-photo--hero::after { left: -2%; bottom: -4%; }
}

/* Entrée du titre principal. */
.imt-anime main h1 {
	text-wrap: balance;
}

/* ---------- Galerie « La vie à l'IMT » / « Sur le terrain » ---------- */
.imt-galerie {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	grid-auto-rows: 230px;
	gap: 16px;
}
.imt-galerie > * {
	margin: 0 !important;
}
/* 6 photos : une grande à gauche, deux à droite, trois en bas. */
.imt-galerie > .wp-block-image:nth-child(1) { grid-column: span 2; grid-row: span 2; }
/* 4 photos : une grande, deux petites, une large. */
.imt-galerie--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.imt-galerie--4 > .wp-block-image:nth-child(4) { grid-column: span 2; }
.imt-galerie .wp-block-image {
	position: relative;
	overflow: hidden;
	border-radius: var(--imt-radius);
	box-shadow: var(--imt-ombre);
}
.imt-galerie .wp-block-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform .9s var(--imt-doux);
}
.imt-galerie .wp-block-image:hover img {
	transform: scale(1.08);
}
.imt-galerie .wp-block-image figcaption {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	margin: 0;
	padding: 40px 16px 14px;
	color: #fff;
	font-family: var(--imt-titres);
	font-weight: 700;
	font-size: 15px;
	text-align: left;
	background: linear-gradient(to top, rgba(10, 20, 40, .78), transparent);
	transform: translateY(6px);
	transition: transform .4s var(--imt-doux);
}
.imt-galerie .wp-block-image:hover figcaption {
	transform: translateY(0);
}
@media (max-width: 900px) {
	.imt-galerie, .imt-galerie--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 180px; }
	.imt-galerie--4 > .wp-block-image:nth-child(4) { grid-column: span 1; }
}
@media (max-width: 520px) {
	.imt-galerie { grid-auto-rows: 150px; gap: 10px; }
	.imt-galerie .wp-block-image figcaption { font-size: 13px; padding: 28px 10px 8px; }
}

/* ---------- Logos qui défilent ---------- */
.imt-defile {
	overflow: hidden;
	-webkit-mask-image: linear-gradient(to right, transparent, #000 8%, #000 92%, transparent);
	mask-image: linear-gradient(to right, transparent, #000 8%, #000 92%, transparent);
	margin-bottom: 12px;
}
.imt-defile__rail {
	display: flex;
	width: max-content;
	animation: imt-defile var(--imt-defile-duree, 40s) linear infinite;
}
.imt-defile:hover .imt-defile__rail {
	animation-play-state: paused;
}
.imt-defile__piste {
	display: flex;
	align-items: center;
	gap: 56px;
	padding-right: 56px;
}
.imt-defile .wp-block-image,
.imt-defile figure {
	margin: 0 !important;
	flex: 0 0 auto;
}
.imt-defile img {
	height: 64px;
	width: auto;
	max-width: 180px;
	object-fit: contain;
	filter: saturate(.85);
	opacity: .92;
	transition: filter .3s ease, opacity .3s ease, transform .3s var(--imt-ressort);
}
.imt-defile img:hover {
	filter: none;
	opacity: 1;
	transform: scale(1.08);
}
@keyframes imt-defile {
	to { transform: translateX(-50%); }
}
/* Sans JavaScript : une simple rangée qui passe à la ligne. */
.imt-defile:not(:has(.imt-defile__rail)) {
	display: flex;
	flex-wrap: wrap;
	gap: 32px;
	align-items: center;
	-webkit-mask-image: none;
	mask-image: none;
}

/* ---------- Divers ---------- */
.is-style-surtitre::before {
	content: "";
	display: inline-block;
	width: 22px;
	height: 3px;
	margin-right: 10px;
	vertical-align: middle;
	border-radius: 3px;
	background: currentColor;
	transition: width .6s var(--imt-doux) .2s;
}
.imt-anime .is-style-surtitre.imt-revele:not(.est-visible)::before {
	width: 0;
}

/* « Ma demande » : petit rebond quand un article est ajouté. */
.imt-pop {
	animation: imt-pop .5s var(--imt-ressort);
}
@keyframes imt-pop {
	0% { transform: scale(1); }
	40% { transform: scale(1.18); }
	100% { transform: scale(1); }
}

/* Bouton WhatsApp flottant. */
.imt-wa-flottant {
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 60;
	width: 58px;
	height: 58px;
	border-radius: 50%;
	display: grid;
	place-items: center;
	background: var(--wp--preset--color--whatsapp, #128C4A);
	color: #fff;
	box-shadow: 0 10px 28px rgba(18, 140, 74, .45);
	transition: transform .3s var(--imt-ressort);
	animation: imt-arrivee .6s var(--imt-ressort) 1.2s both;
}
.imt-wa-flottant::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: 50%;
	animation: imt-onde 2.8s ease-out 2s infinite;
}
.imt-wa-flottant:hover {
	transform: scale(1.1) rotate(-8deg);
	color: #fff;
}
.imt-wa-flottant svg {
	width: 28px;
	height: 28px;
}
@keyframes imt-arrivee {
	from { transform: scale(0) rotate(-90deg); opacity: 0; }
	to { transform: scale(1) rotate(0); opacity: 1; }
}

/* ---------- Respect du réglage « réduire les animations » ---------- */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
		scroll-behavior: auto !important;
	}
	.imt-defile__rail { animation: none !important; }
}

/* Boutons arrondis (blocs Bouton). */
.wp-block-button__link { border-radius: var(--imt-radius-btn) !important; }
html { scroll-behavior: smooth; }

/* Les formes décoratives ne créent jamais de défilement horizontal. */
.wp-site-blocks { overflow-x: clip; }