/*
 * Bloc « coordonnees » : bandeau horizontal (intitule a gauche, pole + items a droite). Empilement mobile.
 * Icone d'item = double-chevron de charte masque, teinte orange. Tokens theme.json.
 */

.mx-coordonnees {
	box-sizing: border-box;
	padding-block: var(--wp--preset--spacing--50); /* 40 */
}

.mx-coordonnees.is-fond-gris  { background-color: var(--wp--preset--color--grey-ultralight); }
.mx-coordonnees.is-fond-clair { background-color: var(--wp--preset--color--white); }

.mx-coordonnees__inner {
	box-sizing: border-box;
	max-width: var(--wp--style--global--wide-size, 1400px);
	margin-inline: auto;
	padding-inline: var(--wp--preset--spacing--60); /* 104 */
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--wp--preset--spacing--55); /* 80 */
	flex-wrap: wrap;
}

/* Intitule a chevron : H2 de charte (Urbanist Black 28). */
.mx-coordonnees__cta {
	margin: 0;
	font-family: var(--wp--preset--font-family--urbanist);
	font-weight: 900;
	font-size: var(--wp--preset--font-size--title); /* 28 */
	line-height: 1.1;
	color: var(--wp--preset--color--grey-dark);
	text-decoration: none;
}

a.mx-coordonnees__cta:hover,
a.mx-coordonnees__cta:focus-visible {
	text-decoration: underline;
}

a.mx-coordonnees__cta:focus-visible {
	outline: 2px solid var(--wp--preset--color--yellow);
	outline-offset: 3px;
}

/* Pole : titre + items. */
.mx-coordonnees__pole {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--20); /* 8 */
}

.mx-coordonnees__pole-titre {
	margin: 0;
	font-family: var(--wp--preset--font-family--anta); /* H4 de charte */
	font-weight: 400;
	font-size: var(--wp--preset--font-size--subtitle); /* 22 */
	line-height: 1.1;
	color: var(--wp--preset--color--grey-dark);
}

.mx-coordonnees__items {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--30) var(--wp--preset--spacing--45); /* 16 32 */
}

.mx-coordonnees__item {
	display: flex;
	align-items: center;
	gap: var(--wp--preset--spacing--20); /* 8 */
	font-family: var(--wp--preset--font-family--titillium);
	font-size: var(--wp--preset--font-size--md); /* 16 */
	line-height: 1.2;
	color: var(--wp--preset--color--grey-dark);
}

.mx-coordonnees__item-icone {
	flex: 0 0 auto;
	width: 17px; /* cote Figma */
	height: 17px;
	background-color: var(--wp--preset--color--orange-dark);
	-webkit-mask: url("../icons/arrow_double-24x24.svg") center / contain no-repeat;
	mask: url("../icons/arrow_double-24x24.svg") center / contain no-repeat;
}

.mx-coordonnees__item-lien {
	color: var(--wp--preset--color--grey-dark);
	text-decoration: none;
}

.mx-coordonnees__item-lien:hover,
.mx-coordonnees__item-lien:focus-visible {
	text-decoration: underline;
	color: var(--wp--preset--color--orange-dark);
}

.mx-coordonnees__item-lien:focus-visible {
	outline: 2px solid var(--wp--preset--color--yellow);
	outline-offset: 3px;
}

/* ---- Responsive ---- */
@media (max-width: 900px) {
	.mx-coordonnees__inner {
		justify-content: flex-start;
		gap: var(--wp--preset--spacing--40); /* 24 */
	}
}

@media (max-width: 680px) {
	.mx-coordonnees__inner {
		padding-inline: var(--wp--preset--spacing--40); /* 24 */
		flex-direction: column;
		align-items: flex-start;
	}
}