/* FETRAINING Hero : remplace Slider Revolution (accueil) */
.fet-hero {
	position: relative;
	display: grid;
	overflow: hidden;
	background: #1d3a5c;
	color: #fff;
	font-family: Poppins, sans-serif;
}

/* Les slides sont empilées dans la même cellule : la hauteur suit la plus haute, rien n'est coupé */
.fet-hero__slide {
	position: relative;
	grid-area: 1 / 1;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: clamp(380px, 28vw, 480px);
	padding: 56px 24px 88px;
	opacity: 0;
	visibility: hidden;
	transition: opacity 1s ease, visibility 0s linear 1s;
}

.fet-hero__slide.is-active {
	opacity: 1;
	visibility: visible;
	transition: opacity 1s ease, visibility 0s;
}

.fet-hero__bg {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	object-position: center top;
}

/* Voile bleu, comme le rendu d'origine, et lisibilité du texte blanc */
.fet-hero__slide::after {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(20, 52, 92, .55);
}

.fet-hero__content {
	position: relative;
	z-index: 1;
	max-width: 960px;
	text-align: center;
}

.fet-hero__kicker {
	margin: 0 0 14px;
	font-size: 20px;
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: .35em;
	color: #fff;
}

.fet-hero__title {
	margin: 0 0 18px;
	font-size: 54px;
	font-weight: 700;
	line-height: 1.1;
	letter-spacing: .04em;
	color: #fff;
}

.fet-hero__text {
	max-width: 830px;
	margin: 0 auto 28px;
	font-size: 16px;
	line-height: 30px;
	color: #fff;
}

.fet-hero__btn {
	display: inline-block;
	padding: 15px 52px;
	border: 2px solid #fff;
	font-size: 18px;
	font-weight: 500;
	line-height: 1;
	color: #fff;
	text-decoration: none;
	transition: background-color .25s ease, border-color .25s ease, color .25s ease;
}

.fet-hero__btn:hover,
.fet-hero__btn:focus-visible {
	background: #fff;
	color: #14345c;
}

.fet-hero__btn--solid {
	background: #119ee6;
	border-color: #119ee6;
}

.fet-hero__btn--solid:hover,
.fet-hero__btn--solid:focus-visible {
	background: #0d86c4;
	border-color: #0d86c4;
	color: #fff;
}

.fet-hero__btn:focus-visible,
.fet-hero__nav button:focus-visible {
	outline: 2px solid #fff;
	outline-offset: 3px;
}

/* Entrée du texte, reprise des animations d'origine */
.fet-hero__slide .fet-hero__content > * {
	opacity: 0;
	transform: translateY(24px);
}

.fet-hero__slide.is-active .fet-hero__content > * {
	opacity: 1;
	transform: none;
	transition: opacity .8s ease, transform .8s cubic-bezier(.22, .61, .36, 1);
}

.fet-hero__slide.is-active .fet-hero__title { transition-delay: .15s; }
.fet-hero__slide.is-active .fet-hero__text { transition-delay: .3s; }
.fet-hero__slide.is-active .fet-hero__btn { transition-delay: .45s; }

/* Navigation : flèches et points */
.fet-hero__nav {
	position: absolute;
	z-index: 2;
	bottom: 32px;
	left: 50%;
	display: flex;
	align-items: center;
	gap: 14px;
	transform: translateX(-50%);
}

.fet-hero__nav button {
	padding: 0;
	border: 0;
	background: none;
	color: #fff;
	cursor: pointer;
}

.fet-hero__arrow {
	width: 28px;
	height: 28px;
	font-size: 26px;
	line-height: 1;
	opacity: .85;
}

.fet-hero__arrow:hover {
	opacity: 1;
}

.fet-hero__dot {
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background: #fff !important;
}

.fet-hero__dot.is-active {
	background: #119ee6 !important;
}

@media (max-width: 1024px) {
	.fet-hero__kicker { font-size: 16px; letter-spacing: .2em; }
	.fet-hero__title { font-size: 40px; }
}

@media (max-width: 767px) {
	.fet-hero__slide { min-height: 420px; padding: 40px 18px 80px; }
	.fet-hero__kicker { font-size: 13px; letter-spacing: .12em; }
	.fet-hero__title { font-size: 28px; letter-spacing: .02em; margin-bottom: 14px; }
	.fet-hero__text { font-size: 14px; line-height: 24px; margin-bottom: 22px; }
	.fet-hero__btn { padding: 13px 30px; font-size: 15px; }
}

@media (prefers-reduced-motion: reduce) {
	.fet-hero__slide,
	.fet-hero__slide.is-active,
	.fet-hero__slide .fet-hero__content > *,
	.fet-hero__slide.is-active .fet-hero__content > * {
		transition: none;
		transform: none;
	}
}

/* Vidéo (page Notre histoire), remplace le GIF de 2 Mo */
.fet-hero-video {
	margin: 0;
}

.fet-hero-video video {
	display: block;
	width: 100%;
	height: auto;
}

/* ---------- Accueil : message unique, texte + photo ---------- */
.fet-split {
	background: linear-gradient(180deg, #f6f8fb 0%, #ffffff 100%);
	color: #1f2a37;
	font-family: Poppins, system-ui, sans-serif;
}

.fet-split__inner {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
	gap: 64px;
	align-items: center;
	max-width: 1320px;
	margin: 0 auto;
	padding: 88px 24px 96px;
}

.fet-split .fet-split__kicker {
	margin: 0 0 20px;
	color: #1d5fa8;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: .06em;
	line-height: 1.5;
	text-transform: uppercase;
}

.fet-split .fet-split__title {
	margin: 0 0 24px;
	color: #12233a;
	font-family: Poppins, system-ui, sans-serif;
	font-size: clamp(34px, 4.2vw, 54px);
	font-weight: 600;
	letter-spacing: -.02em;
	line-height: 1.12;
	text-transform: none;
}

.fet-split__accent {
	display: block;
	color: #1d5fa8;
}

.fet-split .fet-split__text {
	max-width: 540px;
	margin: 0 0 36px;
	color: #5b6676;
	font-size: 17px;
	line-height: 1.7;
}

.fet-split__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px 28px;
}

.fet-split .fet-split__btn {
	display: inline-flex;
	align-items: center;
	padding: 15px 28px;
	border-radius: 8px;
	background: #1d5fa8;
	color: #fff;
	font-size: 15px;
	font-weight: 500;
	text-decoration: none;
	transition: background .2s ease;
}

.fet-split .fet-split__btn:hover { background: #14467f; color: #fff; }

.fet-split .fet-split__link {
	color: #1f2a37;
	font-size: 15px;
	font-weight: 500;
	text-decoration: none;
}

.fet-split .fet-split__link span { display: inline-block; transition: transform .2s ease; }
.fet-split .fet-split__link:hover { color: #1d5fa8; }
.fet-split .fet-split__link:hover span { transform: translateX(4px); }

.fet-split__btn:focus-visible,
.fet-split__link:focus-visible { outline: 2px solid #1d5fa8; outline-offset: 3px; }

/* Chiffres clés : séparés par un filet, sans encadré */
.fet-split__stats {
	display: flex;
	flex-wrap: wrap;
	gap: 24px 40px;
	margin: 56px 0 0;
	padding: 28px 0 0;
	border-top: 1px solid #e6eaf0;
}

.fet-split__stat dt {
	margin: 0;
	color: #12233a;
	font-size: 28px;
	font-weight: 600;
	letter-spacing: -.01em;
	line-height: 1.1;
}

.fet-split__stat dd {
	margin: 4px 0 0;
	color: #5b6676;
	font-size: 13.5px;
}

.fet-split__media {
	position: relative;
}

/* Bloc décoratif doux derrière la photo */
.fet-split__media::before {
	content: "";
	position: absolute;
	top: 28px;
	right: -20px;
	bottom: -20px;
	left: 28px;
	border-radius: 20px;
	background: #e8eff8;
}

.fet-split .fet-split__img {
	display: block;
	position: relative;
	width: 100%;
	height: auto;
	max-width: none;
	aspect-ratio: 4 / 3;
	border-radius: 16px;
	box-shadow: 0 24px 48px rgba(18, 35, 58, .12);
	object-fit: cover;
}

@media (max-width: 900px) {
	.fet-split__inner {
		grid-template-columns: 1fr;
		gap: 48px;
		padding: 48px 20px 64px;
	}
	.fet-split .fet-split__text { font-size: 16px; }
	.fet-split__stats { gap: 20px 28px; margin-top: 40px; }
	.fet-split__stat dt { font-size: 24px; }
	.fet-split__media::before { top: 16px; right: -10px; bottom: -10px; left: 16px; }
}

@media (max-width: 480px) {
	.fet-split .fet-split__kicker { font-size: 12px; }
	.fet-split .fet-split__text { font-size: 15px; line-height: 1.65; }
	.fet-split__stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
	.fet-split__stat dt { font-size: 22px; }
	.fet-split__stat dd { font-size: 12.5px; line-height: 1.35; }
	.fet-split__actions { flex-direction: column; align-items: stretch; }
	.fet-split .fet-split__btn { justify-content: center; }
	.fet-split .fet-split__link { text-align: center; }
}

/* ---------- Accueil v3 : photo pleine largeur + bande d'atouts ---------- */
/* Colonne : le contenu occupe l'espace, les chiffres se posent en bas de la photo */
.fet-cover {
	position: relative;
	display: flex;
	flex-direction: column;
	min-height: clamp(560px, 74vh, 660px);
	overflow: hidden;
	background: #12335c;
	color: #fff;
	font-family: Poppins, system-ui, sans-serif;
}

.fet-cover .fet-cover__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	object-position: 70% 35%;
}

/* Voile bleu nuit à gauche pour la lisibilité, la photo reste visible à droite */
.fet-cover::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(12, 32, 60, .96) 0%, rgba(12, 32, 60, .9) 42%, rgba(12, 32, 60, .12) 60%, rgba(12, 32, 60, 0) 100%);
}

.fet-cover .fet-cover__text { max-width: 54ch; }

.fet-cover__inner {
	position: relative;
	z-index: 1;
	display: flex;
	flex: 1 0 auto;
	align-items: center;
	width: 100%;
	max-width: 1320px;
	margin: 0 auto;
	padding: 56px 24px 40px;
}

/* Bandeau des chiffres, translucide, en bas du hero */
.fet-cover__stats {
	position: relative;
	z-index: 1;
	border-top: 1px solid rgba(255, 255, 255, .14);
	background: rgba(10, 28, 52, .55);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
}

.fet-cover .fet-cover__stats-list {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 24px;
}

.fet-cover__stat {
	display: flex;
	flex-direction: column-reverse;
	gap: 4px;
	padding: 22px 24px;
}

.fet-cover__stat:first-child { padding-left: 0; }
.fet-cover__stat + .fet-cover__stat { border-left: 1px solid rgba(255, 255, 255, .16); }

.fet-cover .fet-cover__stat dd {
	margin: 0;
	color: #fff;
	font-size: clamp(28px, 2.6vw, 38px);
	font-weight: 600;
	letter-spacing: -.02em;
	line-height: 1;
}

.fet-cover .fet-cover__stat dt {
	color: rgba(255, 255, 255, .78);
	font-size: 14px;
	font-weight: 500;
}

.fet-cover__content { max-width: 760px; }

.fet-cover .fet-cover__kicker {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0 0 18px;
	color: #e8a32a;
	font-size: 15px;
	font-weight: 500;
}

.fet-cover .fet-cover__kicker::before {
	content: "";
	width: 28px;
	height: 2px;
	border-radius: 2px;
	background: #e8a32a;
}

.fet-cover .fet-cover__title {
	margin: 0 0 22px;
	color: #fff;
	font-family: Poppins, system-ui, sans-serif;
	font-size: clamp(32px, 3.5vw, 52px);
	font-weight: 600;
	letter-spacing: -.02em;
	line-height: 1.12;
	text-transform: none;
}

.fet-cover__title span { display: block; color: #e8a32a; }

.fet-cover .fet-cover__text {
	max-width: 52ch;
	margin: 0 0 34px;
	color: rgba(255, 255, 255, .88);
	font-size: 17px;
	line-height: 1.65;
}

.fet-cover__actions { display: flex; flex-wrap: wrap; gap: 14px; }

.fet-cover .fet-cover__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 14px 28px;
	border: 1.5px solid transparent;
	border-radius: 999px;
	font-size: 15px;
	font-weight: 600;
	text-decoration: none;
	transition: background .2s ease, color .2s ease, border-color .2s ease;
}

.fet-cover .fet-cover__btn--primary { border-color: #e8a32a; background: #e8a32a; color: #13233b; }
.fet-cover .fet-cover__btn--primary:hover { border-color: #d48f18; background: #d48f18; color: #13233b; }
.fet-cover .fet-cover__btn--ghost { border-color: rgba(255, 255, 255, .85); color: #fff; }
.fet-cover .fet-cover__btn--ghost:hover { background: #fff; color: #13233b; }
.fet-cover__btn:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }

/* ---------- Animations du hero ----------
   Une seule séquence au chargement : la photo se pose (léger zoom arrière), puis le texte monte ligne à ligne,
   les boutons apparaissent et le bandeau des chiffres glisse depuis le bas (les chiffres comptent, voir hero-cover.js). */
@keyframes fet-kenburns { from { transform: scale(1.12); } to { transform: scale(1); } }
@keyframes fet-rise { from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: none; } }
@keyframes fet-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes fet-grow { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes fet-bar-up { from { opacity: 0; transform: translateY(100%); } to { opacity: 1; transform: none; } }

.fet-cover .fet-cover__img { animation: fet-kenburns 9s cubic-bezier(.2, .6, .3, 1) both; }
.fet-cover::after { animation: fet-fade 1.2s ease both; }

.fet-cover .fet-cover__kicker { animation: fet-rise .7s .15s cubic-bezier(.2, .7, .3, 1) both; }
.fet-cover .fet-cover__kicker::before { transform-origin: left; animation: fet-grow .6s .45s ease both; }
.fet-cover .fet-cover__title { animation: fet-rise .8s .3s cubic-bezier(.2, .7, .3, 1) both; }
.fet-cover .fet-cover__title span { animation: fet-rise .8s .5s cubic-bezier(.2, .7, .3, 1) both; }
.fet-cover .fet-cover__text { animation: fet-rise .8s .7s cubic-bezier(.2, .7, .3, 1) both; }
.fet-cover .fet-cover__btn--primary { animation: fet-rise .7s .9s cubic-bezier(.2, .7, .3, 1) both; }
.fet-cover .fet-cover__btn--ghost { animation: fet-rise .7s 1s cubic-bezier(.2, .7, .3, 1) both; }
.fet-cover .fet-cover__stats { animation: fet-bar-up .9s 1.1s cubic-bezier(.2, .7, .3, 1) both; }

/* Boutons : légère élévation au survol, la pilule orange s'illumine */
.fet-cover .fet-cover__btn {
	position: relative;
	overflow: hidden;
	transition: background .25s ease, color .25s ease, border-color .25s ease, transform .25s ease, box-shadow .25s ease;
}

.fet-cover .fet-cover__btn:hover { transform: translateY(-2px); }
.fet-cover .fet-cover__btn--primary:hover { box-shadow: 0 10px 24px rgba(232, 163, 42, .35); }
.fet-cover .fet-cover__btn--ghost:hover { box-shadow: 0 10px 24px rgba(0, 0, 0, .2); }

/* Reflet qui traverse le bouton principal au survol */
.fet-cover .fet-cover__btn--primary::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: -60%;
	width: 40%;
	background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .45), transparent);
	transform: skewX(-20deg);
	transition: left .6s ease;
}

.fet-cover .fet-cover__btn--primary:hover::after { left: 120%; }

/* Chiffres : un trait orange se dessine sous le chiffre survolé */
.fet-cover__stat { position: relative; transition: background .3s ease; }
.fet-cover__stat:hover { background: rgba(255, 255, 255, .05); }
.fet-cover__stat::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 24px;
	width: 32px;
	height: 2px;
	background: #e8a32a;
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .35s ease;
}

.fet-cover__stat:first-child::after { left: 0; }
.fet-cover__stat:hover::after { transform: scaleX(1); }

@media (prefers-reduced-motion: reduce) {
	.fet-cover .fet-cover__img,
	.fet-cover::after,
	.fet-cover .fet-cover__kicker,
	.fet-cover .fet-cover__kicker::before,
	.fet-cover .fet-cover__title,
	.fet-cover .fet-cover__title span,
	.fet-cover .fet-cover__text,
	.fet-cover .fet-cover__btn,
	.fet-cover .fet-cover__stats { animation: none; }
	.fet-cover .fet-cover__btn,
	.fet-cover .fet-cover__btn::after,
	.fet-cover__stat,
	.fet-cover__stat::after { transition: none; }
	.fet-cover .fet-cover__btn:hover { transform: none; }
}

/* Chiffres clés : 4 colonnes séparées par des filets, chiffre au-dessus du libellé */
.fet-stats {
	border-bottom: 1px solid #e6eaf0;
	background: #fff;
	font-family: Poppins, system-ui, sans-serif;
}

.fet-stats .fet-stats__list {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 24px;
}

.fet-stats__item {
	display: flex;
	flex-direction: column-reverse;
	align-items: center;
	gap: 6px;
	padding: 34px 16px;
	text-align: center;
}

.fet-stats__item + .fet-stats__item { border-left: 1px solid #e6eaf0; }

.fet-stats .fet-stats__item dd {
	margin: 0;
	color: #1d5fa8;
	font-size: clamp(32px, 3vw, 42px);
	font-weight: 600;
	letter-spacing: -.02em;
	line-height: 1;
}

.fet-stats .fet-stats__item dt {
	color: #5b6676;
	font-size: 14.5px;
	font-weight: 500;
}

@media (max-width: 760px) {
	.fet-stats .fet-stats__list { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 0 8px; }
	.fet-stats__item { padding: 24px 10px; }
	.fet-stats__item:nth-child(3) { border-left: 0; }
	.fet-stats__item:nth-child(-n+2) { border-bottom: 1px solid #e6eaf0; }
}

/* Bande d'atouts : 5 colonnes séparées par des filets */
.fet-values {
	border-bottom: 1px solid #e6eaf0;
	background: #fff;
	font-family: Poppins, system-ui, sans-serif;
}

.fet-values .fet-values__list {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 24px;
	list-style: none;
}

.fet-values__item {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	padding: 30px 16px;
	text-align: center;
}

.fet-values__item + .fet-values__item { border-left: 1px solid #e6eaf0; }

.fet-values__icon {
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	margin-bottom: 8px;
	color: #1d5fa8;
}

.fet-values__icon svg { width: 32px; height: 32px; }

.fet-values__item strong { color: #13233b; font-size: 15px; font-weight: 600; line-height: 1.35; }
.fet-values__sub { color: #5b6676; font-size: 13.5px; line-height: 1.45; }

@media (max-width: 1100px) {
	.fet-values .fet-values__list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.fet-values__item + .fet-values__item { border-left: 0; }
	.fet-values__item { border-bottom: 1px solid #e6eaf0; }
}

/* Mobile : la photo en bandeau, puis le texte sur bleu nuit uni (pas de texte sur l'image) */
@media (max-width: 760px) {
	.fet-cover { display: block; min-height: 0; }
	.fet-cover .fet-cover__img { position: relative; height: 190px; object-position: 60% 40%; }
	.fet-cover::after { display: none; }
	.fet-cover__inner { padding: 32px 20px 36px; }
	.fet-cover__stats { background: rgba(255, 255, 255, .04); -webkit-backdrop-filter: none; backdrop-filter: none; }
	.fet-cover .fet-cover__stats-list { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 0 20px; }
	.fet-cover__stat,
	.fet-cover__stat:first-child { padding: 20px 0 20px 16px; }
	.fet-cover__stat:nth-child(odd) { padding-left: 0; border-left: 0; }
	.fet-cover__stat:nth-child(-n+2) { border-bottom: 1px solid rgba(255, 255, 255, .14); }
	.fet-cover .fet-cover__text { font-size: 15.5px; }
	.fet-cover__actions { flex-direction: column; }
	.fet-values .fet-values__list { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 0 8px; }
	.fet-values__item { padding: 22px 10px; }
	.fet-values__item:last-child { grid-column: 1 / -1; border-bottom: 0; }
}

/* ---------- Accueil v2 : titre + triptyque des trois métiers ----------
   Les trois couleurs du logo servent de clé : bleu = matériel, orange = aménagement, vert = formation. */
.fet-tri {
	--tri-ink: #13233b;
	--tri-text: #4e5a6b;
	--tri-line: #e2e7ee;
	--tri-blue: #1d5fa8;
	background: #fff;
	color: var(--tri-ink);
	font-family: Poppins, system-ui, sans-serif;
}

.fet-tri__inner {
	max-width: 1320px;
	margin: 0 auto;
	padding: 72px 24px 80px;
}

.fet-tri__intro {
	display: grid;
	grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
	gap: 32px 64px;
	align-items: end;
	margin-bottom: 56px;
}

.fet-tri .fet-tri__title {
	max-width: 20ch;
	margin: 0;
	color: var(--tri-ink);
	font-family: Poppins, system-ui, sans-serif;
	font-size: clamp(32px, 3.9vw, 56px);
	font-weight: 500;
	letter-spacing: -.028em;
	line-height: 1.08;
	text-transform: none;
}

.fet-tri .fet-tri__text {
	max-width: 46ch;
	margin: 0 0 28px;
	color: var(--tri-text);
	font-size: 17px;
	line-height: 1.65;
}

.fet-tri__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px 28px;
}

.fet-tri .fet-tri__btn {
	display: inline-flex;
	align-items: center;
	padding: 14px 26px;
	border-radius: 6px;
	background: var(--tri-blue);
	color: #fff;
	font-size: 15px;
	font-weight: 500;
	text-decoration: none;
	transition: background .2s ease;
}

.fet-tri .fet-tri__btn:hover { background: #14467f; color: #fff; }

.fet-tri .fet-tri__call {
	padding-bottom: 2px;
	border-bottom: 1px solid var(--tri-line);
	color: var(--tri-ink);
	font-size: 15px;
	font-weight: 500;
	text-decoration: none;
	transition: border-color .2s ease, color .2s ease;
}

.fet-tri .fet-tri__call:hover { border-color: var(--tri-blue); color: var(--tri-blue); }

.fet-tri__btn:focus-visible,
.fet-tri__call:focus-visible { outline: 2px solid var(--tri-blue); outline-offset: 3px; }

/* Triptyque : la salle au centre, plus large */
.fet-tri .fet-tri__panels {
	display: grid;
	grid-template-columns: 1fr 1.45fr 1fr;
	gap: 16px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.fet-tri__panel { margin: 0; }
.fet-tri__panel figure { margin: 0; }

.fet-tri .fet-tri__img {
	display: block;
	width: 100%;
	height: clamp(220px, 22vw, 330px);
	max-width: none;
	border-radius: 4px;
	object-fit: cover;
}

.fet-tri__panel figcaption {
	display: grid;
	gap: 2px;
	padding-top: 16px;
}

/* Trait de couleur : la clé du métier */
.fet-tri__panel figcaption::before {
	content: "";
	width: 28px;
	height: 3px;
	margin-bottom: 10px;
	border-radius: 2px;
	background: var(--tri-key);
}

.fet-tri__panel--materiel { --tri-key: #1d5fa8; }
.fet-tri__panel--amenagement { --tri-key: #e8a32a; }
.fet-tri__panel--formation { --tri-key: #8cc63f; }

.fet-tri__panel figcaption strong {
	color: var(--tri-ink);
	font-size: 15.5px;
	font-weight: 500;
}

.fet-tri__panel figcaption span {
	color: var(--tri-text);
	font-size: 14px;
}

@media (max-width: 960px) {
	.fet-tri__intro { grid-template-columns: 1fr; gap: 24px; margin-bottom: 40px; }
	.fet-tri .fet-tri__title { max-width: 20ch; }
}

/* Mobile : les photos défilent à l'horizontale, la suivante dépasse pour inviter au glissement */
@media (max-width: 760px) {
	.fet-tri__inner { padding: 40px 0 56px; }
	.fet-tri__intro { padding: 0 20px; }
	.fet-tri .fet-tri__text { font-size: 16px; }
	.fet-tri__actions { flex-direction: column; align-items: stretch; gap: 18px; }
	.fet-tri .fet-tri__btn { justify-content: center; padding: 15px 24px; }
	.fet-tri .fet-tri__call { align-self: center; }
	.fet-tri .fet-tri__panels {
		grid-template-columns: none;
		grid-auto-columns: 82%;
		grid-auto-flow: column;
		gap: 12px;
		overflow-x: auto;
		padding: 0 20px 4px;
		scroll-padding: 0 20px;
		scroll-snap-type: x mandatory;
		scrollbar-width: none;
	}
	.fet-tri .fet-tri__panels::-webkit-scrollbar { display: none; }
	.fet-tri__panel { scroll-snap-align: start; }
	.fet-tri .fet-tri__img { height: 240px; }
}

/* Home mobile hero aligned with the Formations banner. Desktop styles are preserved. */
@media(max-width:760px){
 .fet-cover{position:relative;isolation:isolate;background:#12335c;min-height:0;display:block}
 .fet-cover .fet-cover__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:0;animation:none;transform:none}
 .fet-cover::after{display:block;z-index:0;background:linear-gradient(90deg,#12335cf2,#12335cb8);animation:none}
 .fet-cover__inner{position:relative;z-index:1;display:block;padding:22px 22px 45px}
 .fet-cover__content{max-width:100%}
 .fet-cover .fet-cover__kicker{font-size:10px;line-height:1.6;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:#d9e5f2;margin:0 0 20px;animation:none}
 .fet-cover .fet-cover__kicker::before{display:none}
 .fet-cover .fet-cover__title{font-size:36px;line-height:1.15;letter-spacing:-.035em;font-weight:600;margin:0 0 25px;animation:none}
 .fet-cover .fet-cover__title span{color:#f2b85d;animation:none}
 .fet-cover .fet-cover__text{font-size:15px;line-height:1.8;color:#dbe5f2;margin:0 0 22px;max-width:680px;animation:none}
 .fet-cover__actions{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:20px;margin-top:32px}
 .fet-cover .fet-cover__btn{font-size:13px;line-height:1.8;animation:none;min-width:0;max-width:100%;transform:none;box-shadow:none}
 .fet-cover .fet-cover__btn--primary{padding:15px 24px;border:0;border-radius:4px;background:#e8a32a;color:#13233b;font-weight:600}
 .fet-cover .fet-cover__btn--primary::after{display:none}
 .fet-cover .fet-cover__btn--ghost{padding:5px 0;border:0;border-bottom:1px solid #ffffff50;border-radius:0;color:#fff;background:transparent;font-weight:400}
 .fet-cover .fet-cover__btn--ghost:hover{background:transparent;color:#fff;border-bottom-color:#fff;box-shadow:none}
 .fet-cover .fet-cover__stats{position:relative;z-index:1;background:#12335cbd;animation:none}
}