/* Refonte 2026 : footer (voir am-refonte.css pour les variables --am-*) */

/*******************
 FOOTER
*******************/

/*
 * Maquette 1920 px (docs/specs/footer.md) : trait haut, 3 colonnes (logo, contact, menu),
 * puis mentions sous le logo et certifications sous contact + menu.
 * Les deux rangées partagent la même grille pour que les colonnes restent alignées :
 * départs mesurés à x = 80, 811 et 1336, soit 731 / 525 / 504 px sur 1760 px de contenu.
 * Aucun état survol ni responsive en maquette : propositions à valider.
 */
.am-footer {
	--am-footer-cols: minmax(0, 731fr) minmax(0, 525fr) minmax(0, 504fr);
	/* Calques CONTACT / EXPERTISES à 50 % d'opacité (gris #9B9B9B mesuré sur l'export, soit 42 % d'encre : 2,62:1 sur blanc).
	   Porté à 61 % pour l'AA (#70757D, 4,64:1), le gris le plus clair qui passe (tâche a11y, P7). */
	--am-footer-heading-color: color-mix(in srgb, var(--am-color-ink) 61%, transparent);
	--am-footer-line: 2px solid color-mix(in srgb, var(--am-color-slate) 30%, transparent); /* Ligne 5 : 2 px à 30 % d'opacité */
	--am-footer-fs: var(--am-fs-body-lg);
	--am-footer-fs-email: calc(1.75rem * var(--am-type-scale)); /* 28 px, variante locale hors échelle */
	font-family: var(--am-font-sans);
	font-size: var(--am-footer-fs);
	line-height: var(--am-lh-body-lg);
	font-weight: var(--am-fw-medium);
	color: var(--am-color-ink);
	background-color: var(--am-color-white);
	text-align: left;
	border-top: var(--am-footer-line);
	padding-bottom: var(--am-space-11);
}
/*
 * footer.am-footer : l'emporte sur « .page-template-page-reference footer » (page-references.css)
 * et sur « footer { text-align: center } » (inc/footer.css, < 700 px).
 * padding-top 46 px : haut des majuscules des libellés à 57 px du trait, comme en maquette.
 */
footer.am-footer {
	padding-top: 2.875rem;
	margin: 0;
	box-shadow: none;
	text-align: left;
}
/* Classes utilitaires de l'ancien thème (inc/start.css) posées sur les items de menu en back-office */
.am-footer [class*="bg-"] {
	background: none;
	color: inherit;
}

.am-footer__top,
.am-footer__bottom {
	display: grid;
	grid-template-columns: var(--am-footer-cols);
	align-items: start;
}
.am-footer__bottom {
	margin-top: 4.25rem; /* 68 px : mentions à 372 px du trait */
}

/* Libellés de colonnes (CONTACT, EXPERTISES, © Certifications) */
.am-footer__heading {
	font-family: var(--am-font-sans);
	font-size: var(--am-footer-fs);
	line-height: var(--am-lh-body-lg);
	font-weight: var(--am-fw-medium);
	color: var(--am-footer-heading-color);
	letter-spacing: 0;
	text-transform: none;
	margin: 0 0 var(--am-space-6);
	padding: 0;
}
/* « © Certifications » : même corps, mais en encre pleine (calque à 100 %) */
.am-footer__certifications .am-footer__heading {
	color: inherit;
	margin-bottom: 2.3125rem; /* 37 px : logos à 65 px du haut du libellé */
}

/* Liens : couleur du texte, rose au survol, anneau rose au focus clavier (comme le header) */
.am-footer a {
	color: inherit;
	text-decoration: none;
	transition: color var(--am-transition);
}
.am-footer a:hover {
	color: var(--am-color-pink);
}
.am-footer a:focus-visible {
	outline: var(--am-focus-ring);
	outline-offset: var(--am-focus-offset);
}


/*******************
 logo
*******************/

.am-footer__logo {
	display: inline-block;
	max-width: 100%;
	margin-top: 0.625rem; /* logo à 58 px du trait, libellés à 57 px */
}
.am-footer__logo img {
	display: block;
	width: 21.5688rem; /* 345 px : 406 px de la maquette - 15 % (18/09/2026) */
	max-width: 100%;
	height: auto;
}

/*
 * Slogan sous le logo (champ wysiwyg footer_slogan, réaffiché le 21/09/2026), en petite capitale
 * discrète. Le texte vient de la saisie, pas d'ici : la baseline « MAKING THE MOST OF YOUR TALENTS »
 * est déjà dessinée dans logo-amagar.svg, ce champ sert donc à autre chose.
 * Même rôle typographique que le surtitre .am-eyebrow (am-refonte.css)
 * et même gris que les libellés de colonnes (contraste AA vérifié).
 */
.am-footer__slogan {
	margin-top: var(--am-space-5);
	font-family: var(--am-font-sans);
	font-size: var(--am-fs-eyebrow);
	line-height: var(--am-lh-eyebrow);
	font-weight: var(--am-fw-regular);
	letter-spacing: var(--am-tracking-eyebrow);
	text-transform: uppercase;
	color: var(--am-footer-heading-color);
}
.am-footer__slogan p {
	margin: 0;
}
.am-footer__slogan p + p {
	margin-top: var(--am-space-2);
}


/*******************
 contact (champ wysiwyg footer_contacts)
*******************/

.am-footer__address {
	font-style: normal;
	overflow-wrap: anywhere;
}
.am-footer__address p {
	margin: 0;
}
.am-footer__address p + p {
	margin-top: var(--am-space-5);
}
.am-footer__address a[href^="mailto:"],
.am-footer__address strong {
	font-size: var(--am-footer-fs-email);
	font-weight: var(--am-fw-semibold);
}
/* E-mail détaché des lignes d'adresse (après un <br> dans le wysiwyg) */
.am-footer__address a[href^="mailto:"] {
	display: inline-block;
	margin-top: 1.875rem;
}


/*******************
 menu (emplacement am-footer-menu)
*******************/

.am-footer__menu {
	list-style: none;
	margin: 0;
	padding: 0;
}
.am-footer__menu li {
	margin: 0;
	padding: 0;
}


/*******************
 mentions et certifications
*******************/

.am-footer__legal p {
	margin: 0;
}

.am-footer__certifications {
	grid-column: 2 / -1;
}
.am-footer__logos {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: center;
	gap: var(--am-space-6) 1.75rem;
}
.am-footer__logo-item {
	margin: 0;
	padding: 0;
}
.am-footer__logo-item a {
	display: block;
}
/*
 * Tous les logos à la même hauteur, quelle que soit la forme de l'image (décision d'Antoine du 23/09/2026,
 * à quatre certifications) : 80 px de haut, bornés à 200 px de large pour que les lockups très allongés
 * (map&match, Positive Intelligence) ne mangent pas la rangée, et rangée centrée.
 * Les modificateurs --portrait et --landscape qu'imprime amCertificationLogoHtml() ne sont plus employés ici ;
 * ils servent toujours au bloc de la page Métier (assets/css/inc/page-metier.css).
 */
.am-footer__logo-img {
	display: block;
	width: auto;
	height: 5rem; /* 80 px */
	max-width: 12.5rem; /* 200 px */
	object-fit: contain;
}


/*******************
 responsive (hors maquette, proposition)
*******************/

/* 1024-1599 px : la grille maquette rend la colonne contact trop étroite pour l'e-mail, on l'élargit */
@media screen and (max-width: 1599px) {
	.am-footer {
		--am-footer-cols: minmax(0, 460fr) minmax(0, 460fr) minmax(0, 190fr);
	}
	.am-footer__top,
	.am-footer__bottom {
		column-gap: var(--am-space-6);
	}
}

/* Points de rupture : échelle commune (am-refonte.css) */
@media screen and (max-width: 1279px) {
	.am-footer {
		--am-footer-fs: calc(1.25rem * var(--am-type-scale));
		--am-footer-fs-email: calc(1.5rem * var(--am-type-scale));
	}
	.am-footer__logo img { width: 15.3rem; }
	.am-footer__logo-img { height: 3.5rem; } /* hauteur commune, cf. la regle de base */
}

/* 640-1023 px : logo sur toute la largeur, contact et menu côte à côte, puis mentions et certifications */
@media screen and (max-width: 1023px) {
	.am-footer {
		--am-footer-cols: minmax(0, 1fr) minmax(0, 1fr);
	}
	.am-footer__top,
	.am-footer__bottom {
		row-gap: var(--am-space-7);
	}
	.am-footer__bottom {
		margin-top: var(--am-space-8);
	}
	.am-footer__brand,
	.am-footer__legal,
	.am-footer__certifications {
		grid-column: 1 / -1;
	}
}

/* < 640 px : empilement vertical */
@media screen and (max-width: 639px) {
	.am-footer {
		--am-footer-cols: minmax(0, 1fr);
		--am-footer-fs: calc(1.125rem * var(--am-type-scale));
		--am-footer-fs-email: calc(1.25rem * var(--am-type-scale));
	}
	.am-footer__heading {
		margin-bottom: var(--am-space-4);
	}
	.am-footer__logo img { width: 11.9rem; }
	.am-footer__logos { gap: var(--am-space-5); }
	.am-footer__logo-img { height: 3rem; } /* hauteur commune, cf. la regle de base */
}

/* Mobile : liens du menu espacés pour le doigt (cible d'au moins 24 px de haut, WCAG 2.5.8) */
@media screen and (max-width: 767px) {
	.am-footer__menu a {
		display: inline-block;
		padding: 0.25em 0;
	}
}