
/* ==========================================================
   SERVIPRA 1.1.35 — Template Contact conforme à la maquette
   ========================================================== */

.sp-contact-template-1135{
	padding-top:36px;
	padding-bottom:48px;
}

.sp-contact-template-1135__container{
	width:min(calc(100% - 48px),1540px);
	max-width:1540px;
}

.sp-contact-template-1135__article{
	width:100%;
	max-width:none;
}

.sp-contact-template-1135__grid{
	display:grid;
	grid-template-columns:minmax(300px,.82fr) minmax(520px,1.32fr) minmax(360px,1fr);
	gap:24px;
	align-items:stretch;
}

.sp-contact-template-1135__card{
	margin:0;
	height:100%;
	padding:28px 28px 30px;
}

.sp-contact-template-1135__card .sp-eyebrow{
	margin-bottom:8px;
	color:#fff;
}

.sp-contact-template-1135__card h2{
	margin:0 0 10px;
	font-size:clamp(1.85rem,2.25vw,2.5rem);
	line-height:1.08;
}

.sp-contact-template-1135__card h3{
	margin:12px 0 7px;
	font-size:1.35rem;
}

.sp-contact-template-1135__card p{
	margin:0 0 10px;
	color:#fff;
	line-height:1.45;
}

.sp-contact-template-1135__checklist{
	margin:0 0 12px;
	padding:0;
	list-style:none;
}

.sp-contact-template-1135__checklist li{
	position:relative;
	margin:6px 0;
	padding-left:24px;
	color:#fff;
	line-height:1.35;
}

.sp-contact-template-1135__checklist li::before{
	content:"✓";
	position:absolute;
	left:0;
	top:0;
	color:#18a66f;
	font-weight:900;
}

.sp-contact-template-1135__zone{
	margin-top:8px !important;
}

.sp-contact-template-1135__form-column{
	min-width:0;
	padding:2px 0 0;
}

.sp-contact-template-1135__form-column > h2{
	margin:0 0 4px;
	font-size:clamp(2rem,2.45vw,2.7rem);
	line-height:1.08;
	color:var(--navy);
}

.sp-contact-template-1135__intro{
	margin:0 0 14px;
	max-width:720px;
	color:var(--muted);
	font-size:1rem;
	line-height:1.45;
}

.sp-contact-template-1135__form-column .sp-form{
	gap:12px;
}

.sp-contact-template-1135__form-column .sp-form-row{
	gap:12px;
}

.sp-contact-template-1135__form-column .sp-field label{
	margin-bottom:5px;
}

.sp-contact-template-1135__form-column .sp-field input,
.sp-contact-template-1135__form-column .sp-field select{
	min-height:46px;
}

.sp-contact-template-1135__form-column .sp-field textarea{
	min-height:94px;
}

.sp-contact-template-1135__form-column .sp-consent{
	margin-top:0;
}

.sp-contact-template-1135__form-column .sp-recaptcha-wrap{
	margin-top:2px;
}

.sp-contact-template-1135__right{
	display:flex;
	flex-direction:column;
	min-width:0;
	height:100%;
}

.sp-contact-template-1135__map{
	margin:0;
	padding:0;
	border:0;
	background:transparent;
	box-shadow:none;
}

.sp-contact-template-1135__map .sp-contact-map__head{
	display:block;
	margin:0 0 8px;
}

.sp-contact-template-1135__map .sp-contact-map__head .sp-eyebrow{
	margin:0 0 4px;
	font-size:.72rem;
}

.sp-contact-template-1135__map .sp-contact-map__head h2{
	margin:0 0 3px;
	font-size:1.12rem;
	line-height:1.15;
}

.sp-contact-template-1135__map .sp-contact-map__head p{
	margin:0 0 8px;
	font-size:.75rem;
	line-height:1.35;
	color:var(--muted);
}

.sp-contact-template-1135__map .sp-contact-map__head .sp-button{
	display:flex;
	width:100%;
	min-height:34px;
	margin:0;
	padding:6px 10px;
	align-items:center;
	justify-content:center;
	font-size:.7rem;
}

.sp-contact-template-1135__map .sp-contact-map__frame{
	height:220px;
	min-height:220px;
	border-radius:12px;
}

.sp-contact-template-1135__map .sp-contact-map__frame iframe{
	height:220px !important;
}

.sp-contact-template-1135__map .sp-contact-map__placeholder{
	padding:18px;
}

.sp-contact-template-1135__map .sp-contact-map__placeholder strong{
	font-size:.95rem;
}

.sp-contact-template-1135__map .sp-contact-map__placeholder p{
	margin:4px 0 12px;
	font-size:.72rem;
	line-height:1.35;
}

.sp-contact-template-1135__map .sp-contact-map__placeholder .sp-button{
	min-height:34px;
	padding:6px 12px;
	font-size:.72rem;
}

.sp-contact-template-1135__shelby{
	display:flex;
	flex:1 1 auto;
	align-items:flex-end;
	justify-content:center;
	min-height:300px;
	margin-top:16px;
	overflow:hidden;
}

.sp-contact-template-1135__shelby-img{
	display:block;
	width:100%;
	max-width:440px;
	height:auto;
	margin:auto auto 0;
	object-fit:contain;
}

/* Laptop : 3 colonnes conservées tant que la largeur le permet. */
@media(max-width:1220px){
	.sp-contact-template-1135__container{
		width:min(calc(100% - 34px),1180px);
	}

	.sp-contact-template-1135__grid{
		grid-template-columns:minmax(250px,.75fr) minmax(460px,1.25fr) minmax(300px,.9fr);
		gap:18px;
	}

	.sp-contact-template-1135__card{
		padding:24px;
	}
}

/* Tablette : bloc bleu + formulaire, puis Maps/Shelby pleine largeur. */
@media(max-width:1020px){
	.sp-contact-template-1135__grid{
		grid-template-columns:minmax(240px,.78fr) minmax(0,1.22fr);
	}

	.sp-contact-template-1135__right{
		grid-column:1 / -1;
		display:grid;
		grid-template-columns:1fr 1fr;
		gap:20px;
		align-items:end;
	}

	.sp-contact-template-1135__shelby{
		min-height:260px;
		margin-top:0;
	}
}

/* Mobile : empilement complet. */
@media(max-width:760px){
	.sp-contact-template-1135{
		padding-top:24px;
		padding-bottom:36px;
	}

	.sp-contact-template-1135__container{
		width:min(calc(100% - 30px),100%);
	}

	.sp-contact-template-1135__grid{
		display:block;
	}

	.sp-contact-template-1135__card,
	.sp-contact-template-1135__form-column,
	.sp-contact-template-1135__right{
		margin-bottom:20px;
	}

	.sp-contact-template-1135__right{
		display:block;
	}

	.sp-contact-template-1135__shelby{
		min-height:0;
		margin-top:16px;
	}

	.sp-contact-template-1135__shelby-img{
		max-width:390px;
	}
}


/* ==========================================================
   SERVIPRA 1.1.36 — Ajustements visuels d'après maquette
   La structure fonctionnelle 1.1.35 reste inchangée.
   ========================================================== */

@media (min-width:1040px){

	/* Bandeau Contact compact : même logique 3 colonnes que le corps.
	   Col.1 = eyebrow SERVIPRA, Col.2 = titre + description, Col.3 vide. */
	body.sp-page-contact .sp-page-hero{
		padding:10px 0 8px !important;
		min-height:0 !important;
	}

	body.sp-page-contact .sp-page-hero > .sp-container{
		width:min(calc(100% - 48px),1600px) !important;
		max-width:1600px !important;
	}

	body.sp-page-contact .sp-page-hero-grid{
		display:grid !important;
		grid-template-columns:minmax(300px,.78fr) minmax(520px,1.28fr) minmax(390px,1.08fr) !important;
		column-gap:24px !important;
		align-items:center !important;
		min-height:72px !important;
	}

	body.sp-page-contact .sp-page-hero-copy{
		display:contents !important;
	}

	body.sp-page-contact .sp-page-hero-copy > .sp-eyebrow{
		grid-column:1 !important;
		margin:0 !important;
		align-self:center !important;
	}

	body.sp-page-contact .sp-page-hero-copy > h1{
		grid-column:2 !important;
		grid-row:1 !important;
		align-self:start !important;
		margin:0 0 4px !important;
		font-size:clamp(2.2rem,2.8vw,3rem) !important;
		line-height:1.02 !important;
	}

	body.sp-page-contact .sp-page-hero-copy > p:not(.sp-eyebrow){
		grid-column:2 !important;
		grid-row:1 !important;
		align-self:end !important;
		margin:36px 0 0 !important;
		max-width:760px !important;
		font-size:.96rem !important;
		line-height:1.4 !important;
	}

	/* Pas de seconde Shelby dans le bandeau : la mascotte reste sous Maps. */
	body.sp-page-contact .sp-page-mascot{
		display:none !important;
	}

	/* Corps plus large, fidèle à la maquette fournie. */
	body.sp-page-contact .sp-contact-template-1135{
		padding-top:14px !important;
		padding-bottom:20px !important;
	}

	body.sp-page-contact .sp-contact-template-1135__container{
		width:min(calc(100% - 42px),1600px) !important;
		max-width:1600px !important;
	}

	body.sp-page-contact .sp-contact-template-1135__grid{
		grid-template-columns:minmax(300px,.78fr) minmax(520px,1.28fr) minmax(390px,1.08fr) !important;
		gap:24px !important;
	}

	/* Un peu plus de présence pour le bloc gauche, sans toucher au contenu. */
	body.sp-page-contact .sp-contact-template-1135__card{
		padding:28px 28px 30px !important;
	}

	/* Colonne Maps légèrement plus généreuse. */
	body.sp-page-contact .sp-contact-template-1135__map .sp-contact-map__frame{
		height:226px !important;
		min-height:226px !important;
	}

	body.sp-page-contact .sp-contact-template-1135__map .sp-contact-map__frame iframe{
		height:226px !important;
	}

	/* Shelby plus grande et plus proche du rendu de la maquette. */
	body.sp-page-contact .sp-contact-template-1135__shelby{
		min-height:300px !important;
		margin-top:14px !important;
	}

	body.sp-page-contact .sp-contact-template-1135__shelby-img{
		width:100% !important;
		max-width:500px !important;
	}
}

/* Portable intermédiaire : on conserve les 3 colonnes mais avec des proportions plus souples. */
@media (min-width:1040px) and (max-width:1280px){
	body.sp-page-contact .sp-page-hero > .sp-container,
	body.sp-page-contact .sp-contact-template-1135__container{
		width:calc(100% - 28px) !important;
	}

	body.sp-page-contact .sp-page-hero-grid,
	body.sp-page-contact .sp-contact-template-1135__grid{
		grid-template-columns:minmax(260px,.76fr) minmax(470px,1.26fr) minmax(330px,1fr) !important;
		gap:18px !important;
	}
}

/* Tablette/mobile : le bandeau redevient simple ; Shelby de hero reste masquée
   pour éviter la répétition avec celle de la colonne localisation. */
@media (max-width:1039px){
	body.sp-page-contact .sp-page-mascot{
		display:none !important;
	}

	body.sp-page-contact .sp-page-hero{
		padding-top:18px !important;
		padding-bottom:18px !important;
	}
}


/* ==========================================================
   SERVIPRA 1.1.37 — Correction chevauchement hero Contact
   ========================================================== */

@media (min-width:1040px){

	body.sp-page-contact .sp-page-hero-grid{
		grid-template-rows:auto auto !important;
		align-items:start !important;
	}

	body.sp-page-contact .sp-page-hero-copy > .sp-eyebrow{
		grid-column:1 !important;
		grid-row:1 / span 2 !important;
		align-self:center !important;
	}

	/* Titre plus compact pour éviter le chevauchement. */
	body.sp-page-contact .sp-page-hero-copy > h1{
		grid-column:2 !important;
		grid-row:1 !important;
		align-self:end !important;
		margin:0 !important;
		font-size:clamp(1.9rem,2.25vw,2.55rem) !important;
		line-height:1.02 !important;
	}

	/* La phrase est désormais réellement sur une ligne distincte dessous. */
	body.sp-page-contact .sp-page-hero-copy > p:not(.sp-eyebrow){
		grid-column:2 !important;
		grid-row:2 !important;
		align-self:start !important;
		margin:4px 0 0 !important;
		max-width:760px !important;
		font-size:.92rem !important;
		line-height:1.4 !important;
	}
}

@media (max-width:1039px){
	body.sp-page-contact .sp-page-hero-copy > h1{
		font-size:clamp(2rem,7vw,2.5rem) !important;
		line-height:1.05 !important;
		margin-bottom:6px !important;
	}

	body.sp-page-contact .sp-page-hero-copy > p:not(.sp-eyebrow){
		margin-top:0 !important;
	}
}
