/* FacMed — Divisions : fiche division + grille. Couleurs = presets du thème (palette UdeM). */

.fdiv-zone,
.fdiv-zone-contenu {
	padding: var(--wp--preset--spacing--x-large, 4rem) var(--wp--preset--spacing--small, 1rem);
	margin-block: 0 !important;
}
/* Zone de gabarit dont le shortcode n'a rien rendu (pas de programmes, pas de membres…) */
.fdiv-zone:not(:has(.fdiv-section, .fdiv-chef, .fdiv-don, .fdiv-autres)) {
	display: none;
}
.fdiv-zone-chef {
	background: var(--wp--preset--color--main-accent, #e5f0f8);
	padding-block: var(--wp--preset--spacing--medium, 2rem);
}
.fdiv-zone-programmes { background: var(--wp--preset--color--tertiary, #f7f7f8); }
.fdiv-zone-actualites { background: var(--wp--preset--color--main-accent, #e5f0f8); }
.fdiv-zone-don {
	background: var(--wp--preset--color--custom-jaune, #ffca40);
	color: var(--wp--preset--color--custom-bleu-fonc, #0b113a);
}
.fdiv-zone-autres { border-top: 1px solid var(--wp--preset--color--border-light, #d9dae3); }

/* Le contenu des zones prend la largeur « wide » */
.fdiv-zone > .fdiv-section,
.fdiv-zone > .fdiv-chef,
.fdiv-zone > .fdiv-don,
.fdiv-zone > .fdiv-autres {
	max-width: var(--wp--style--global--wide-size, 1280px) !important;
}

/* ── Titres de section ─────────────────────────────────────────────────────── */
.fdiv-surtitre {
	margin: 0 0 .5rem;
	font-size: var(--wp--preset--font-size--x-small, .8rem);
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--wp--preset--color--custom-bleu-principal, #0057ac);
}
.fdiv-section-titre {
	margin: 0 0 var(--wp--preset--spacing--medium, 2rem);
	font-family: var(--wp--preset--font-family--figtree, inherit);
}
/* Titre de section + mention à droite (ex. nombre de membres), en gris neutre
   pour ne pas doubler le surtitre bleu */
.fdiv-section-tete {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: .25rem 1.5rem;
	margin-bottom: var(--wp--preset--spacing--medium, 2rem);
}
.fdiv-section-tete .fdiv-section-titre { margin: 0; }
.fdiv-section-aside {
	margin: 0;
	font-size: var(--wp--preset--font-size--small, .95rem);
	color: #5a5f7a;
}

/* ── Boutons ───────────────────────────────────────────────────────────────── */
.fdiv-btn {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	padding: .7rem 1.1rem;
	font-weight: 600;
	font-size: var(--wp--preset--font-size--small, .95rem);
	line-height: 1.2;
	text-decoration: none;
	border: 2px solid var(--wp--preset--color--primary, #0b113a);
	transition: background-color .2s ease, color .2s ease;
}
.fdiv-btn-lien {
	background: transparent;
	color: var(--wp--preset--color--primary, #0b113a);
}
.fdiv-btn-lien:hover,
.fdiv-btn-lien:focus-visible {
	background: var(--wp--preset--color--primary, #0b113a);
	color: #fff;
}
.fdiv-btn-don {
	background: var(--wp--preset--color--custom-bleu-fonc, #0b113a);
	border-color: var(--wp--preset--color--custom-bleu-fonc, #0b113a);
	color: #fff;
}
.fdiv-btn-don:hover,
.fdiv-btn-don:focus-visible {
	background: #fff;
	border-color: #fff;
	color: var(--wp--preset--color--custom-bleu-fonc, #0b113a);
}

/* ── Carte du chef ─────────────────────────────────────────────────────────── */
.fdiv-chef {
	display: grid;
	grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
	align-items: center;
	gap: var(--wp--preset--spacing--medium, 2rem);
}
.fdiv-chef-personne {
	display: flex;
	align-items: center;
	gap: 1.25rem;
}
.fdiv-chef-photo {
	flex: none;
	width: 112px;
	height: 112px;
	object-fit: cover;
	object-position: top;
	border-radius: 50%;
}
.fdiv-chef-personne p { margin: 0; }
.fdiv-chef-role {
	font-size: var(--wp--preset--font-size--x-small, .8rem);
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var(--wp--preset--color--custom-bleu-principal, #0057ac);
}
.fdiv-chef-nom {
	font-size: var(--wp--preset--font-size--large, 1.5rem);
	font-weight: 600;
	line-height: 1.2;
	color: var(--wp--preset--color--primary, #0b113a);
}
.fdiv-chef-depuis { font-size: var(--wp--preset--font-size--small, .95rem); }
.fdiv-chef-liens {
	display: flex;
	flex-wrap: wrap;
	gap: .4rem 1.25rem;
	margin-top: .6rem !important;
}
.fdiv-icone {
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	font-size: var(--wp--preset--font-size--small, .95rem);
	font-weight: 600;
	color: var(--wp--preset--color--custom-bleu-principal, #0057ac);
	text-decoration: none;
}
.fdiv-icone:hover,
.fdiv-icone:focus-visible { text-decoration: underline; text-underline-offset: .2em; }
.fdiv-etablissements-titre {
	margin: 0 0 .5rem;
	font-weight: 600;
	font-size: var(--wp--preset--font-size--small, .95rem);
}
.fdiv-etablissements ul {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: .4rem;
}
.fdiv-etablissements li {
	padding: .3rem .6rem;
	background: var(--wp--preset--color--base, #fff);
	border-left: 3px solid var(--wp--preset--color--custom-bleu-principal, #0057ac);
	font-size: var(--wp--preset--font-size--x-small, .8rem);
	line-height: 1.3;
}
/* Initiales (photo absente) — même cercle que la photo du chef */
.fdiv-initiales {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--wp--preset--color--custom-bleu-principal, #0057ac);
	color: #fff;
	font-weight: 600;
	letter-spacing: .02em;
}
.fdiv-chef-photo.fdiv-initiales { font-size: 2rem; }

/* ── Contenu + sommaire ────────────────────────────────────────────────────── */
.fdiv-colonnes { gap: var(--wp--preset--spacing--x-large, 4rem) !important; }
.fdiv-col-texte { max-width: 46rem; }
.fdiv-col-texte h2 {
	scroll-margin-top: calc(var(--eoa-header-h, 80px) + 1.5rem);
	margin-top: var(--wp--preset--spacing--large, 3rem);
	font-family: var(--wp--preset--font-family--figtree, inherit);
}
.fdiv-col-texte h2:first-child { margin-top: 0; }
.fdiv-section { scroll-margin-top: calc(var(--eoa-header-h, 80px) + 1.5rem); }

.fdiv-sommaire {
	position: sticky;
	top: calc(var(--eoa-header-h, 80px) + 1.5rem);
}
.fdiv-sommaire-titre {
	margin: 0 0 .75rem;
	font-size: var(--wp--preset--font-size--x-small, .8rem);
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--wp--preset--color--custom-bleu-principal, #0057ac);
}
.fdiv-sommaire ul {
	margin: 0;
	padding: 0;
	list-style: none;
	border-left: 2px solid var(--wp--preset--color--border-light, #d9dae3);
}
.fdiv-sommaire a {
	display: block;
	margin-left: -2px;
	padding: .45rem 0 .45rem 1rem;
	border-left: 2px solid transparent;
	color: var(--wp--preset--color--primary, #0b113a);
	text-decoration: none;
	font-size: var(--wp--preset--font-size--small, .95rem);
	line-height: 1.35;
}
.fdiv-sommaire a:hover,
.fdiv-sommaire a:focus-visible {
	border-left-color: var(--wp--preset--color--custom-bleu-principal, #0057ac);
	color: var(--wp--preset--color--custom-bleu-principal, #0057ac);
}

/* ── Programmes ────────────────────────────────────────────────────────────── */
.fdiv-progs,
.fdiv-membres,
.fdiv-actus,
.fdiv-grille {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: var(--wp--preset--spacing--small, 1rem);
}
.fdiv-progs { grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr)); }
.fdiv-prog a {
	display: flex;
	flex-direction: column;
	gap: .4rem;
	height: 100%;
	padding: 1.25rem;
	background: var(--wp--preset--color--base, #fff);
	border: 1px solid var(--wp--preset--color--border-light, #d9dae3);
	border-top: 4px solid var(--wp--preset--color--custom-bleu-principal, #0057ac);
	color: var(--wp--preset--color--primary, #0b113a);
	text-decoration: none;
	transition: box-shadow .2s ease, transform .2s ease;
}
.fdiv-prog a:hover,
.fdiv-prog a:focus-visible {
	box-shadow: 0 8px 18px rgba(11, 17, 58, .12);
	transform: translateY(-2px);
}
.fdiv-prog-titre { font-weight: 600; line-height: 1.35; flex: 1; }
.fdiv-prog-lien {
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	font-size: var(--wp--preset--font-size--small, .95rem);
	text-decoration: underline;
	text-underline-offset: 3px;
}
.fdiv-prog-lien svg { flex: none; }

/* ── Membres ───────────────────────────────────────────────────────────────── */
/* Même carte que le répertoire des chercheurs (facmed-chercheurs .fchr-carte) */
.fdiv-membres { grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr)); gap: 1.25rem; }
.fdiv-membre-lien {
	display: flex;
	align-items: center;
	gap: 1rem;
	height: 100%;
	padding: 1.1rem 1.25rem;
	background: var(--wp--preset--color--main-accent, #e5f0f8);
	border-radius: 12px;
	color: var(--wp--preset--color--primary, #0b113a);
	text-decoration: none;
	transition: background-color .2s ease;
}
a.fdiv-membre-lien:hover,
a.fdiv-membre-lien:focus-visible { background: var(--wp--preset--color--custom-bleu-principal, #0057ac); }
.fdiv-membre-corps { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: flex-start; }
.fdiv-membre-nom {
	font-family: var(--wp--preset--font-family--lora, 'Lora', serif);
	font-size: 1.25rem;
	font-weight: 500;
	line-height: 1.25;
}
.fdiv-membre-titre { margin-top: .2rem; font-size: var(--wp--preset--font-size--small, .95rem); line-height: 1.4; color: #4a5070; }
.fdiv-membre-photo { flex: none; width: 72px; height: 72px; object-fit: cover; object-position: top; filter: grayscale(100%); transition: filter .2s; }
a.fdiv-membre-lien:is(:hover, :focus-visible) :is(.fdiv-membre-nom, .fdiv-membre-titre) { color: #fff; }
a.fdiv-membre-lien:is(:hover, :focus-visible) .fdiv-membre-photo { filter: none; }

/* ── Actualités ────────────────────────────────────────────────────────────── */
.fdiv-actus { grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr)); }
.fdiv-actu {
	position: relative;
	background: var(--wp--preset--color--base, #fff);
}
.fdiv-actu-img { overflow: hidden; aspect-ratio: 3 / 2; }
.fdiv-actu-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.fdiv-actu:hover .fdiv-actu-img img { transform: scale(1.05); }
.fdiv-actu-date {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	height: 100%;
	background: var(--wp--preset--color--custom-bleu-principal, #0057ac);
	color: #fff;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .06em;
}
.fdiv-actu-jour { font-size: clamp(3rem, 2.5rem + 2vw, 4.5rem); line-height: 1; letter-spacing: 0; }
.fdiv-actu-corps { padding: 1rem 1.1rem 1.25rem; }
.fdiv-actu p { margin: 0; }
.fdiv-actu-meta { font-size: var(--wp--preset--font-size--x-small, .8rem); }
.fdiv-actu-type {
	display: inline-block;
	margin-right: .4rem;
	padding: .1rem .45rem;
	background: var(--wp--preset--color--primary, #0b113a);
	color: #fff;
	font-weight: 600;
}
.fdiv-actu-titre { margin-top: .5rem !important; font-weight: 600; line-height: 1.35; }
.fdiv-actu-titre a { color: var(--wp--preset--color--primary, #0b113a); text-decoration: none; }
.fdiv-actu-titre a::after { content: ""; position: absolute; inset: 0; } /* carte entière cliquable */
.fdiv-actu:hover .fdiv-actu-titre a { text-decoration: underline; }

/* ── Don ───────────────────────────────────────────────────────────────────── */
.fdiv-don {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--medium, 2rem);
}
.fdiv-don > div { max-width: 44rem; }
.fdiv-don .fdiv-surtitre { color: var(--wp--preset--color--primary-alt, #0057ac); }
.fdiv-don-titre { margin: 0 0 .75rem; color: var(--wp--preset--color--custom-bleu-fonc, #0b113a); font-family: var(--wp--preset--font-family--figtree, inherit); }
.fdiv-don p { margin: 0; }

/* ── Autres divisions ──────────────────────────────────────────────────────── */
.fdiv-autres ul {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
}
.fdiv-autres a {
	display: inline-block;
	padding: .55rem 1.1rem;
	border: 1px solid var(--wp--preset--color--border-light, #d9dae3);
	border-radius: 999px;
	color: var(--wp--preset--color--primary, #0b113a);
	text-decoration: none;
	font-size: var(--wp--preset--font-size--small, .95rem);
	transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
.fdiv-autres a:hover,
.fdiv-autres a:focus-visible {
	background: var(--wp--preset--color--custom-bleu-principal, #0057ac);
	border-color: var(--wp--preset--color--custom-bleu-principal, #0057ac);
	color: #fff;
}

/* ── Grille des divisions ([fdiv_grille]) ─────────────────────────────────── */
.fdiv-grille { gap: var(--wp--preset--spacing--medium, 2rem); }
.fdiv-cols-2 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 22rem), 1fr)); }
/* 3 colonnes (grille des divisions) : cartes lisibles, 2 colonnes sur tablette, 1 sur téléphone */
.fdiv-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--wp--preset--spacing--medium, 2rem); }
@media (max-width: 1023px) { .fdiv-cols-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 599px) { .fdiv-cols-3 { grid-template-columns: 1fr; gap: var(--wp--preset--spacing--small, 1rem); } }
.fdiv-cols-4 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 14rem), 1fr)); }
/* 5 colonnes : 10 divisions = 2 rangées pleines ; 2 colonnes en dessous (5 rangées pleines), 1 sur téléphone */
.fdiv-cols-5 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--wp--preset--spacing--small, 1rem); }
@media (min-width: 1200px) { .fdiv-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
@media (max-width: 599px) { .fdiv-cols-5 { grid-template-columns: 1fr; } }
.fdiv-carte {
	position: relative;
	display: flex;
	flex-direction: column;
	background: var(--wp--preset--color--base, #fff);
	border-bottom: 4px solid var(--wp--preset--color--custom-bleu-principal, #0057ac);
}
.fdiv-carte-img { overflow: hidden; aspect-ratio: 3 / 2; background: var(--wp--preset--color--main-accent, #e5f0f8); }
.fdiv-carte-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.fdiv-carte:hover .fdiv-carte-img img { transform: scale(1.05); }
.fdiv-carte-corps { padding: 1rem 1.1rem 1.25rem; }
/* Carte à pictogramme de spécialité : le nom de la division est l'élément principal ; pictogramme
   bleu principal sur petit carré bleu pâle, à gauche du nom ; une seule couleur (guide de marque UdeM).
   Chef en texte normal, nombre de membres en retrait. Survol : trait du bas bleu, ombre légère. */
.fdiv-carte--picto {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	align-items: start;
	column-gap: 1rem;
	padding: 1.5rem 1.5rem 1.4rem;
	border-bottom: 1px solid var(--wp--preset--color--border-light, #d9dfe9);
	transition: border-color .2s ease, box-shadow .25s ease;
}
.fdiv-carte--picto .fdiv-carte-corps { padding: 0; }
.fdiv-carte-picto {
	display: grid;
	place-items: center;
	width: 52px;
	height: 52px;
	background: var(--wp--preset--color--main-accent, #e5f0f8);
	color: var(--wp--preset--color--custom-bleu-principal, #0057ac);
}
.fdiv-carte--picto .fdiv-carte-titre { margin: 0 0 .5rem; font-size: clamp(1.15rem, 1.05rem + .35vw, 1.3rem); }
.fdiv-carte--picto .fdiv-carte-chef { margin: 0; font-size: var(--wp--preset--font-size--small, .92rem); color: var(--wp--preset--color--custom-bleu-fonc, #0b113a); }
.fdiv-carte--picto .fdiv-carte-nb { margin: .15rem 0 0; font-size: var(--wp--preset--font-size--x-small, .85rem); color: color-mix(in srgb, var(--wp--preset--color--custom-bleu-fonc, #0b113a) 68%, transparent); }
.fdiv-carte--picto:hover,
.fdiv-carte--picto:focus-within { border-bottom-color: var(--wp--preset--color--custom-bleu-principal, #0057ac); box-shadow: 0 1px 2px rgba(11, 17, 58, .05), 0 10px 24px rgba(11, 17, 58, .08); }
.fdiv-carte--picto:hover .fdiv-carte-titre a,
.fdiv-carte--picto .fdiv-carte-titre a:focus-visible { color: var(--wp--preset--color--custom-bleu-principal, #0057ac); }
/* Titre : trait qui se dessine de gauche à droite au survol (même effet que les liens .footer-bloc
   du site, 0,5 s). En dégradé de fond plutôt qu'en ::before : le ::after du lien sert déjà à rendre
   toute la carte cliquable, et le trait suit les titres sur deux lignes. */
.fdiv-carte--picto .fdiv-carte-titre a {
	text-decoration: none !important;
	background: linear-gradient(currentColor, currentColor) 0 100% / 0 2px no-repeat;
	padding-bottom: 2px;
	transition: background-size .5s, color .2s ease;
}
.fdiv-carte--picto:hover .fdiv-carte-titre a,
.fdiv-carte--picto:focus-within .fdiv-carte-titre a { background-size: 100% 2px; }
.fdiv-carte-corps p { margin: .3rem 0 0; font-size: var(--wp--preset--font-size--x-small, .85rem); }
.fdiv-carte-titre {
	margin: 0 0 .4rem;
	font-size: clamp(1.1rem, 1rem + .4vw, 1.3rem);
	font-family: var(--wp--preset--font-family--figtree, inherit);
	font-weight: 600;
	line-height: 1.25;
}
.fdiv-carte-titre a { color: var(--wp--preset--color--primary, #0b113a); text-decoration: none; }
.fdiv-carte-titre a::after { content: ""; position: absolute; inset: 0; }
.fdiv-carte:hover .fdiv-carte-titre a,
.fdiv-carte-titre a:focus-visible { text-decoration: underline; text-underline-offset: 4px; }
.fdiv-carte-nb { color: var(--wp--preset--color--custom-bleu-fonc, #0b113a); font-weight: 400; }

/* ── Responsive ────────────────────────────────────────────────────────────── */
@media (max-width: 960px) {
	.fdiv-chef { grid-template-columns: 1fr; }
}
@media (max-width: 781px) {
	.fdiv-col-sommaire { display: none; } /* colonnes empilées : le sommaire n'apporterait que de la hauteur */
	.fdiv-col-texte { max-width: none; }
	.fdiv-chef-photo { width: 88px; height: 88px; }
}
@media (prefers-reduced-motion: reduce) {
	.fdiv-prog a, .fdiv-actu-img img, .fdiv-carte-img img, .fdiv-carte--picto, .fdiv-carte--picto .fdiv-carte-titre a { transition: none; }
}
