/*
 * Page Contact : bande bleu nuit (H1 + délai de réponse), grille formulaire + colonne collée qui remonte
 * sur la bande, puis plan d'accès. Le formulaire lui-même est stylé par blocks/contact-form/style.css.
 */

.wp-site-blocks > .cp-main { margin-block-start: 0; }
.cp-main > .cp-page,
.cp-main > .cp-page > * { margin-block: 0 !important; }

.cp-ct-head,
.cp-ct-body,
.cp-ct-map { --cp-ct-navy: var(--wp--preset--color--navy, #000033); --cp-ct-orange: var(--wp--preset--color--orange, #FF9900); --cp-ct-mute: var(--wp--preset--color--mute, #555B6B); --cp-ct-sky: #EDF2F9; }
.cp-ct-head,
.cp-ct-head *,
.cp-ct-body,
.cp-ct-body *,
.cp-ct-map,
.cp-ct-map * { box-sizing: border-box; }
.cp-ct-head > *,
.cp-ct-body > *,
.cp-ct-grid > *,
.cp-ct-aside > *,
.cp-ct-box > *,
.cp-ct-map > * { margin-block: 0 !important; }

/* Bande d'en-tête : le bas laisse la place à la carte du formulaire qui remonte dessus. */
.cp-ct-head { padding-block: clamp(56px, 7vw, 96px) clamp(148px, 16vw, 208px); background: var(--cp-ct-navy); }
.cp-ct-head .cp-ct-head__title { color: #fff; font-size: clamp(34px, 4vw, 58px); line-height: 1.05; font-weight: 700; letter-spacing: -.01em; text-wrap: balance; }
.cp-ct-head .cp-ct-head__lead { margin-top: 18px !important; color: #C6C8DC; font-size: 19px; line-height: 1.5; }
.cp-ct-head .cp-ct-head__lead strong { color: #fff; }

/* La carte remonte sur la bande : la règle doit battre la remise à zéro des marges du contenu (.cp-main > .cp-page > *). */
.cp-main > .cp-page > .cp-ct-body { margin-top: clamp(-160px, -12vw, -100px) !important; }
.cp-ct-body { position: relative; z-index: 1; padding-bottom: clamp(64px, 8vw, 112px); }
.cp-ct-body .cp-ct-grid { display: grid; grid-template-columns: minmax(0, 1.75fr) minmax(0, 1fr); gap: clamp(24px, 3vw, 48px); align-items: start; }

/* Colonne collée : téléphone, agences. */
.cp-ct-body .cp-ct-aside { position: sticky; top: calc(var(--wp-admin--admin-bar--height, 0px) + 76px + 32px); display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.cp-ct-body .cp-ct-box { padding: 24px 26px; border-radius: 8px; background: var(--cp-ct-sky); }
.cp-ct-body .cp-ct-box--dark { background: var(--cp-ct-navy); }
.cp-ct-body .cp-ct-box__title { margin-bottom: 8px !important; color: var(--cp-ct-navy); font-size: 18px; line-height: 1.3; font-weight: 700; }
.cp-ct-body .cp-ct-box--dark .cp-ct-box__title { color: #fff; }
.cp-ct-body .cp-ct-box p { color: var(--cp-ct-navy); font-size: 17px; line-height: 1.55; }
.cp-ct-body .cp-ct-tel a { display: inline-flex; align-items: center; gap: 12px; color: #fff; font-size: 30px; font-weight: 700; line-height: 1.1; text-decoration: none; font-variant-numeric: tabular-nums; }
.cp-ct-body .cp-ct-tel a::before {
	content: "";
	flex: none;
	width: 26px;
	height: 26px;
	background: var(--cp-ct-orange);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2'/%3E%3C/svg%3E") center / contain no-repeat;
}
.cp-ct-body .cp-ct-tel a:focus-visible,
.cp-ct-body .cp-ct-link a:focus-visible { outline: 2px solid var(--cp-ct-orange); outline-offset: 3px; }
.cp-ct-body .cp-ct-link { margin-top: 12px !important; }
.cp-ct-body .cp-ct-link a { display: inline-flex; align-items: center; gap: 8px; padding-bottom: 2px; border-bottom: 2px solid var(--cp-ct-orange); color: var(--cp-ct-navy); font-size: 15px; font-weight: 700; text-decoration: none; }
.cp-ct-body .cp-ct-link a::after {
	content: "";
	width: 15px;
	height: 15px;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M2 8h11M9 4l4 4-4 4' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M2 8h11M9 4l4 4-4 4' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Plan d'accès : trait de cote au-dessus, comme entre les sections de l'accueil. */
.cp-ct-map { position: relative; padding-block: clamp(56px, 7vw, 96px); background: var(--wp--preset--color--mist, #F3F4F8); box-shadow: inset 0 1px 0 rgba(0, 0, 51, .10); }
.cp-ct-map::after { content: ""; position: absolute; top: -1px; left: max(var(--wp--style--root--padding-left, 16px), calc((100% - 1400px) / 2)); width: 48px; height: 3px; background: var(--cp-ct-orange); }
.cp-ct-map .cp-ct-map__title { margin-bottom: 24px !important; color: var(--cp-ct-navy); font-size: clamp(26px, 2.6vw, 38px); line-height: 1.15; font-weight: 700; }
.cp-ct-map .cp-ct-map__plan { margin: 0; }
.cp-ct-map .cp-ct-map__plan img { display: block; width: 100%; height: auto; max-height: 560px; object-fit: cover; border-radius: 8px; }
.cp-ct-map .cp-ct-map__plan figcaption { margin-top: 10px; color: var(--cp-ct-mute); font-size: 13.5px; text-align: left; }

/* Cartes Google des deux agences (intégrations Google Maps : le bouton Itinéraire lance la navigation sur téléphone). */
.cp-ct-map .cp-ct-maps { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(20px, 2.4vw, 36px); }
.cp-ct-maps > *,
.cp-ct-maps__item > * { margin-block: 0 !important; }
.cp-ct-maps__item { display: flex; flex-direction: column; min-width: 0; }
.cp-ct-map .cp-ct-maps__name { color: var(--cp-ct-navy); font-size: 22px; line-height: 1.25; font-weight: 700; }
.cp-ct-map .cp-ct-maps__addr { margin: 4px 0 14px !important; color: var(--cp-ct-mute); font-size: 16px; }
.cp-ct-maps__item iframe { display: block; width: 100%; height: clamp(320px, 32vw, 440px); max-width: 100%; border: 0; border-radius: 8px; background: #E7E9EF; }

@media (max-width: 1100px) {
	.cp-ct-body .cp-ct-grid { grid-template-columns: minmax(0, 1fr); }
	.cp-ct-body .cp-ct-aside { position: static; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
	.cp-ct-body .cp-ct-aside { grid-template-columns: minmax(0, 1fr); }
	.cp-ct-map .cp-ct-maps { grid-template-columns: minmax(0, 1fr); }
	.cp-ct-body .cp-ct-tel a { font-size: 26px; }
}