/* =========================================================
   Nous localiser + Entre nous: details left, map right (slanted edge).
   ========================================================= */
.location { background: #fff; }
.location__info { padding: 56px var(--gutter) 40px; }
.location .location__title { margin: 0 0 16px; padding: 0; border: 0; color: var(--navy); font-size: clamp(32px, 4.2vw, 58px); font-weight: 600; line-height: 1.08; letter-spacing: -.02em; }
.location address { font-size: clamp(18px, 1.7vw, 22px); font-style: normal; font-weight: 500; line-height: 1.4; }
.location ul { margin: 0; padding: 0; list-style: none; }
.location a { color: var(--navy); text-decoration: none; }
.location a:visited { color: var(--navy); }
.location a:focus-visible { outline: 3px solid var(--navy); outline-offset: 2px; }
.location__contact { margin-top: 12px !important; }
.location__contact a { display: inline-flex; align-items: center; min-height: 44px; font-size: 16px; font-weight: 500; }
.location__contact a:hover { text-decoration: underline; text-decoration-color: var(--yellow); text-decoration-thickness: 3px; text-underline-offset: 5px; }
.location h4 { margin: 32px 0 6px; padding-top: 28px; border-top: 1px solid var(--line); color: var(--navy); font-size: 22px; font-weight: 600; line-height: 1.25; }
.location h5 { max-width: 42ch; margin: 0 0 16px; font-size: 15px; font-weight: 400; line-height: 1.6; }
.signup { margin-top: 32px; padding-top: 28px; border-top: 1px solid var(--line); }
.signup .signup__title { margin: 0 0 12px; color: var(--navy); font-size: 22px; font-weight: 600; line-height: 1.25; }
.signup__form { display: flex; flex-wrap: wrap; gap: 8px; }
.signup__form input[type="email"] { flex: 1 1 200px; min-width: 0; min-height: 44px; padding: 0 14px; border: 1px solid var(--navy); border-radius: 6px; font: inherit; font-size: 16px; }
.signup__form button { min-height: 44px; padding: 0 20px; border: 0; border-radius: 6px; background: var(--navy); color: #fff; font-weight: 600; cursor: pointer; }
.signup__form button:hover { background: #0a3d75; }
.signup__form :focus-visible { outline: 3px solid var(--navy); outline-offset: 2px; }
.signup__trap { position: absolute; left: -9999px; }
.signup__msg { margin: 0 0 12px; font-size: 15px; font-weight: 600; color: var(--navy); }
.signup__legal { margin: 12px 0 0; font-size: 14px; line-height: 1.55; }
.signup__legal a { text-decoration: underline; }
.location__social { display: flex; flex-wrap: wrap; gap: 8px; }
.location__social a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	justify-content: center;
	width: 48px;
	min-height: 48px;
	border: 1px solid var(--navy);
	border-radius: 6px;
	font-size: 15px;
	font-weight: 600;
	transition: background-color .15s ease, color .15s ease;
}
.location__social a:hover, .location__social a:active { background: var(--navy); color: #fff; }
.location__map { height: 340px; background: var(--wash); }
.location__map iframe { display: block; width: 100%; height: 100%; border: 0; }

@media (min-width: 700px) {
	.location__info { padding-block: 72px 48px; }
	.location__map { height: 420px; }
}

@media (min-width: 1100px) {
	.location { display: grid; grid-template-columns: 5fr 7fr; }
	.location__info { padding-block: 88px 80px; }
	.location__map { height: auto; min-height: 620px; position: relative; clip-path: polygon(90px 0, 100% 0, 100% 100%, 0 100%); }
	/* Google's top-left link would be cut by the slant: move it out of view (our own link is in the details) */
	.location__map iframe { position: absolute; top: -60px; left: 0; height: calc(100% + 60px); }
}

.location__icon { display: inline-block; width: 20px; height: 20px; margin-right: 8px; vertical-align: -4px; object-fit: contain; }
.location__icon { filter: brightness(0) saturate(100%) invert(11%) sepia(62%) saturate(2700%) hue-rotate(195deg) brightness(92%); }
