/* ==========================================================================
   Fiche formation — XD « Formation SIG - Catalogue – Fiche Formation » (1920 x 3970)
   Description (blanc) · Certifications et modalités (gris) · Autres formations (blanc)
   ========================================================================== */

/* ---------- Description : titre, durée / niveau, intro à gauche ; slider 802 x 534 à droite ;
              puis objectifs à gauche et programme à droite ---------- */
.fiche { padding-block: clamp(40px, 5.36vw, 103px) clamp(48px, 5.6vw, 107px); }
.fiche__grid {
	display: grid;
	grid-template-columns: minmax(0, 795fr) minmax(0, 802fr);
	gap: clamp(40px, 3.7vw, 71px) clamp(40px, 5.26vw, 101px);
	align-items: start;
}
/* Colonnes fixes : sans images, les objectifs ne remontent pas à la place du slider */
.fiche__head,
.fiche__objectifs { grid-column: 1; }
.fiche__media,
.fiche__programme { grid-column: 2; }
.fiche__head,
.fiche__media { grid-row: 1; }
.fiche__objectifs,
.fiche__programme { grid-row: 2; }
.fiche__title {
	max-width: 15em;
	font-size: var(--fs-h2); /* taille des titres du site (retour client), XD 48px */
	font-weight: 700;
	line-height: 1.146;
	color: var(--c-text);
}
/* Bold 28px/34px, interlettrage 60, valeurs en vert */
.fiche__meta {
	margin: clamp(10px, .9vw, 17px) 0 0;
	font-size: clamp(18px, 1.46vw, 28px); /* XD 28px : n'est pas un sur-titre, garde sa taille */
	font-weight: 700;
	line-height: 1.21;
	letter-spacing: .06em;
	color: var(--c-text);
}
.fiche__meta dt,
.fiche__meta dd { display: inline; margin: 0; }
.fiche__meta dd { color: var(--c-green); }
.fiche__intro {
	max-width: 740px;
	margin-top: clamp(24px, 2.8vw, 54px);
	font-size: var(--fs-22); /* retour client du 03/11/2026 : 22px au lieu de 30px (fiche formation et article) */
	line-height: 1.45;
}

/* Texte de présentation en éditeur visuel : paragraphes espacés comme avant les retours à la ligne */
.fiche__intro p,
.fiche-infos__text p { margin: 0; }
.fiche__intro p + p,
.fiche-infos__text p + p { margin-top: .6em; }

/* Bouton « Bordure » de l'éditeur (fiche formation : présentation, contenu du programme), retour client du 05/11/2026 :
   passage encadré d'un filet vert ; sur plusieurs lignes, chaque ligne est encadrée */
.fsig-bordure {
	padding: .05em .35em;
	border: 2px solid var(--c-green);
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;
}

/* Carrousel : une image à la fois, flèches à cheval sur les bords */
.fiche__media { margin-top: clamp(0px, .36vw, 7px); }
.fiche__slide { aspect-ratio: 802 / 534; background: var(--c-border); }
.fiche__media .slider__arrow--prev { left: calc(clamp(44px, 4.5vw, 86px) / -2); }
.fiche__media .slider__arrow--next { right: calc(clamp(44px, 4.5vw, 86px) / -2); }
/* Fiche formation : images de la même taille que sur les fiches webinaire / événement (retour client du 11/11/2026).
   Événement = 2/5 de la grille (3fr / 2fr), fiche = 802/1597 : 0,4 x 1597 / 802 = 79,65 % de la colonne, calée à droite.
   Le programme (sous l'image) prend la même largeur, calé à droite, pour que son bord gauche soit aligné sur celui de l'image.
   Colonnes et objectifs inchangés ; en dessous de 1141px, une seule colonne pleine largeur comme l'événement. */
@media (min-width: 1141px) {
	.fiche:not(.fiche--article) :is(.fiche__media, .fiche__programme) { width: 79.65%; justify-self: end; }
	/* Haut de l'image aligné sur le haut du titre, comme sur les fiches webinaire / événement (retour client du 12/11/2026) */
	.fiche:not(.fiche--article) .fiche__media { margin-top: 0; }
}

.fiche__subtitle {
	max-width: 740px;
	margin-bottom: clamp(16px, 1.1vw, 21px);
	font-size: var(--fs-30);
	font-weight: 400;
	line-height: 1.333;
	color: var(--c-text);
}
.fiche__subtitle--strong { font-weight: 700; margin-bottom: clamp(20px, 2.4vw, 47px); }

/* Objectifs : Regular 22px, une ligne tous les 48px, triangle vert 27px pointé à droite */
.arrow-list { display: grid; gap: clamp(10px, 1.1vw, 21px); }
.arrow-list li {
	position: relative;
	padding-left: clamp(26px, 1.93vw, 37px);
	font-size: var(--fs-22);
	line-height: 1.23;
}
.arrow-list__title { font: inherit; color: inherit; } /* objectif en H3 : même rendu que le texte simple */
.arrow-list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: .08em;
	width: clamp(10px, .78vw, 15px);
	height: clamp(18px, 1.41vw, 27px);
	background: var(--c-green);
	clip-path: polygon(0 0, 100% 50%, 0 100%);
}

/* ---------- Article (single.php) : même grille, contenu rédigé sur toute la largeur sous le titre et les images ---------- */
.fiche--article .eyebrow { margin-bottom: clamp(8px, .7vw, 14px); }
.fiche--article .fiche__title { max-width: none; }
/* Événement : haut des images aligné sur le haut du titre, pas sur le sur-titre (catégorie) au-dessus
   (retour client du 09/11/2026, après un essai centré verticalement). Décalage = hauteur du sur-titre + sa marge. */
.fiche--article .fiche__media { margin-top: 0; }
@media (min-width: 1141px) {
	.fiche--article .fiche__grid:has(.fiche__head > .eyebrow) .fiche__media {
		margin-top: calc(var(--fs-eyebrow) * var(--eyebrow-lh, 1.55) + clamp(8px, .7vw, 14px));
	}
}
/* Événement : 60 % texte / 40 % images au-dessus de 1140px (retour client du 09/11/2026) ; en dessous, une seule colonne comme la fiche */
@media (min-width: 1141px) {
	.fiche--article .fiche__grid { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); }
}
/* Plusieurs lignes d'informations (dates, horaire, lieu, inscription) : valeurs longues, on peut passer à la ligne */
.fiche--article .fiche__meta { display: grid; gap: 2px; }
.fiche__content {
	grid-column: 1 / -1;
	grid-row: auto; /* sous les objectifs / programme s'il y en a (rangée 2), sinon juste sous le titre et les images */
	max-width: 1100px;
	font-size: var(--fs-22);
	line-height: 1.45;
}
.fiche__content :is(h2, h3, h4) { margin-top: 1.6em; font-weight: 700; line-height: 1.2; color: var(--c-text); }
.fiche__content h2 { font-size: var(--fs-h2); }
.fiche__content h3 { font-size: var(--fs-30); }
.fiche__content h4 { font-size: var(--fs-24); }
.fiche__content a { color: var(--c-green); text-decoration: underline; text-underline-offset: 3px; }
.fiche__content img { height: auto; }
.fiche__content ol { padding-left: 1.2em; }
.fiche__content li + li { margin-top: .35em; }
/* Listes à puces du contenu (événement / article) : triangles verts des objectifs de la fiche formation (retour client du 05/11/2026) */
.fiche__content ul { padding-left: 0; list-style: none; }
.fiche__content ul > li { position: relative; padding-left: clamp(26px, 1.93vw, 37px); }
.fiche__content ul > li + li { margin-top: clamp(10px, 1.1vw, 21px); }
.fiche__content ul > li::before {
	content: "";
	position: absolute;
	left: 0;
	top: .2em;
	width: clamp(10px, .78vw, 15px);
	height: clamp(18px, 1.41vw, 27px);
	background: var(--c-green);
	clip-path: polygon(0 0, 100% 50%, 0 100%);
}
.fiche__content blockquote { margin: 1.4em 0; padding-left: 1em; border-left: 3px solid var(--c-green); font-style: italic; }

/* ---------- Certifications et modalités : deux colonnes sur fond gris (titres Bold 48px, texte 22px/28px) ---------- */
.fiche-infos { padding-block: clamp(48px, 4.84vw, 93px) clamp(48px, 4.2vw, 80px); }
.fiche-infos__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 48px clamp(32px, 4.8vw, 92px);
	align-items: start;
}
.fiche-infos__title {
	margin-bottom: clamp(16px, 1.5vw, 29px);
	font-size: var(--fs-h2); /* taille des titres du site (retour client), XD 48px */
	font-weight: 700;
	line-height: 1.035;
	color: var(--c-text);
}
.fiche-infos__text { max-width: 686px; font-size: var(--fs-22); line-height: 1.27; }
.fiche-infos .more-link { margin-top: clamp(16px, 1.2vw, 23px); }
.fiche-infos__logos { display: flex; flex-wrap: wrap; gap: clamp(16px, 1.6vw, 30px); margin-top: clamp(24px, 2.2vw, 42px); }
.fiche-infos__logos img { width: clamp(110px, 9.53vw, 183px); height: clamp(110px, 9.53vw, 183px); object-fit: contain; }

/* ---------- Autres formations ---------- */
.fiche-liees { padding-block: clamp(56px, 5.6vw, 107px) clamp(56px, 6.7vw, 128px); }

/* ---------- Tablette ---------- */
@media (max-width: 1140px) {
	.fiche__grid { grid-template-columns: minmax(0, 1fr); }
	.fiche__grid > * { grid-column: 1; grid-row: auto; }
	.fiche__title { max-width: none; }
	.fiche__media { margin-top: 0; }
}

/* ---------- Mobile ---------- */
@media (max-width: 768px) {
	.fiche__intro { line-height: 1.5; }
	.fiche__media .slider__arrow--prev { left: 8px; }
	.fiche__media .slider__arrow--next { right: 8px; }
	.fiche-infos__grid { grid-template-columns: minmax(0, 1fr); }
}

/* Article : « Autres actualités » sur fond gris, cartes à bloc texte blanc (comme sur l'accueil) */
.fiche-liees.actualites { --c-card: var(--c-bg); }