/* ============================================================
 * SPIDE — Page unique d'une réalisation (single-solution.php)
 * Même grammaire que les pages Secteur : bande grise pointillée,
 * sur-titre « + », filets #DCDCDC, bande bleue pour le rappel.
 * ============================================================ */
:root{
	--spide-blue:#0000FF;
	--spide-anthracite:#767676;
	--spide-black:#2D2D2D;
	--spide-white:#F1F1F1;
}

.spide-realisation,
.spide-realisation *,
.spide-realisation *::before,
.spide-realisation *::after{ box-sizing:border-box; }

.spide-realisation{
	font-family:"Montserrat",sans-serif;
	background:#fff;
	color:var(--spide-black);
}

/* ============ EN-TÊTE ============ */
.spide-real-hero__inner{
	max-width:1600px;
	margin-inline:auto;
	padding-inline:clamp(24px,4vw,72px);
	display:grid;
	grid-template-columns:minmax(0,1fr) minmax(0,1fr);
	gap:clamp(32px,5vw,80px);
	align-items:center;
	background:
		radial-gradient(rgba(45,45,45,.13) 1.1px, transparent 1.4px) 0 0 / 22px 22px,
		#F3F3F3;
	background-clip:content-box;
}
.spide-real-hero__text{
	padding:clamp(40px,5vw,84px) clamp(24px,2.5vw,48px) clamp(40px,5vw,84px) clamp(24px,3vw,56px);
}
.spide-real-hero__overline{
	display:block;
	margin-bottom:22px;
	font-size:14px;
	font-weight:600;
	color:var(--spide-anthracite);
}
.spide-real-hero__overline .plus{ color:var(--spide-blue); }
.spide-real-hero__overline a{ color:inherit; text-decoration:none; border-bottom:1px solid rgba(118,118,118,.4); }
.spide-real-hero__overline a:hover{ color:var(--spide-blue); border-color:currentColor; }
.spide-real-hero__title{
	margin:0;
	font-size:clamp(24px,2.8vw,34px);
	font-weight:700;
	line-height:1.22;
	text-transform:uppercase;
	color:var(--spide-black);
}
.spide-real-hero__meta{
	margin:clamp(24px,3vw,36px) 0 0;
	display:grid;
	gap:14px;
	border-top:1px solid #DCDCDC;
	padding-top:clamp(20px,2.5vw,28px);
}
.spide-real-hero__meta > div{
	display:grid;
	grid-template-columns:150px minmax(0,1fr);
	gap:16px;
	align-items:baseline;
}
.spide-real-hero__meta dt{
	font-size:13px;
	font-weight:700;
	text-transform:uppercase;
	color:var(--spide-black);
}
.spide-real-hero__meta dd{
	margin:0;
	font-size:clamp(14px,1vw,16px);
	line-height:1.6;
	color:var(--spide-anthracite);
}
.spide-real__link{
	display:inline-flex;
	align-items:center;
	gap:5px;
	margin-left:8px;
	color:var(--spide-blue);
	font-weight:600;
	text-decoration:none;
	white-space:nowrap;
}
.spide-real__link:hover{ text-decoration:underline; }

.spide-real-hero__media{
	height:clamp(320px,34vw,520px);
	margin-block:clamp(24px,3vw,48px);
	overflow:hidden;
}
.spide-real-hero__media img{ width:100%; height:100%; object-fit:cover; display:block; }

/* ============ LE PROJET ============ */
.spide-real-intro__inner{
	max-width:1600px;
	margin-inline:auto;
	padding:clamp(48px,6vw,90px) clamp(24px,4vw,72px) clamp(24px,3vw,40px);
	display:grid;
	grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);
	gap:clamp(24px,5vw,80px);
	align-items:start;
}
.spide-real-intro__title{
	margin:0;
	font-size:clamp(20px,2.2vw,28px);
	font-weight:700;
	text-transform:uppercase;
}
.spide-real-intro__text{
	color:var(--spide-anthracite);
	font-size:clamp(15px,1.05vw,17px);
	line-height:1.8;
}
.spide-real-intro__text p{ margin:0 0 16px; }
.spide-real-intro__text p:last-child{ margin-bottom:0; }
.spide-real-intro__text strong{ color:var(--spide-black); font-weight:600; }

/* ============ BESOIN / SOLUTION / ENJEUX ============ */
.spide-real-blocs__inner{
	max-width:1600px;
	margin-inline:auto;
	padding:clamp(24px,3vw,40px) clamp(24px,4vw,72px) clamp(48px,6vw,90px);
	display:grid;
	grid-template-columns:repeat(3, minmax(0,1fr));
	gap:0;
	border-top:1px solid #DCDCDC;
}
.spide-real-bloc{
	padding:clamp(28px,3vw,44px) clamp(20px,2.4vw,40px);
	border-left:1px solid #DCDCDC;
}
.spide-real-bloc:first-child{ border-left:0; padding-left:0; }
.spide-real-bloc__title{
	margin:0 0 14px;
	font-size:clamp(15px,1.2vw,18px);
	font-weight:700;
	text-transform:uppercase;
	color:var(--spide-black);
}
.spide-real-bloc__title .plus{ color:var(--spide-blue); }
.spide-real-bloc__text{
	font-size:clamp(14px,1vw,16px);
	line-height:1.75;
	color:var(--spide-anthracite);
}
.spide-real-bloc__text strong{ color:var(--spide-black); font-weight:600; }

/* ============ SECOND VISUEL ============ */
.spide-real-visuel{
	max-width:1600px;
	margin-inline:auto;
	padding:0 clamp(24px,4vw,72px) clamp(48px,6vw,90px);
}
.spide-real-visuel img{
	width:100%;
	height:clamp(260px,38vw,560px);
	object-fit:cover;
	display:block;
	background:#ECECEC;
}

/* ============ AUTRES RÉALISATIONS ============ */
.spide-real-autres{ background:var(--spide-white); }
.spide-real-autres__inner{
	max-width:1600px;
	margin-inline:auto;
	padding:clamp(48px,6vw,90px) clamp(24px,4vw,72px);
}
.spide-real-autres__title{
	margin:0 0 clamp(28px,3vw,40px);
	font-size:clamp(18px,1.9vw,24px);
	font-weight:700;
	text-transform:uppercase;
}
.spide-real-autres__list{
	list-style:none; margin:0; padding:0;
	display:grid;
	grid-template-columns:repeat(3, minmax(0,1fr));
	gap:clamp(16px,2vw,28px);
}
.spide-real-autre a{
	display:block;
	background:#fff;
	text-decoration:none;
	color:inherit;
	height:100%;
	transition:transform .2s ease;
}
.spide-real-autre a:hover{ transform:translateY(-3px); }
.spide-real-autre__img{
	display:block;
	aspect-ratio:16/10;
	overflow:hidden;
	background:#ECECEC;
}
.spide-real-autre__img img{ width:100%; height:100%; object-fit:cover; display:block; }
.spide-real-autre__body{ display:block; padding:18px 20px 22px; }
.spide-real-autre__name{
	display:block;
	font-size:15px;
	font-weight:700;
	line-height:1.35;
	text-transform:uppercase;
}
.spide-real-autre__year{
	display:inline-block;
	margin-top:8px;
	font-size:13px;
	font-weight:600;
	color:var(--spide-blue);
}

/* ============ APPEL À L'ACTION ============ */
.spide-real-cta__inner{
	max-width:900px;
	margin-inline:auto;
	padding:clamp(48px,6vw,90px) clamp(24px,4vw,72px) clamp(56px,7vw,110px);
	text-align:center;
}
.spide-real-cta__title{
	margin:0 0 24px;
	font-size:clamp(20px,2.2vw,28px);
	font-weight:700;
	text-transform:uppercase;
}
.spide-real-cta__btn{ width:auto; justify-content:center; }

/* ============ RESPONSIVE ============ */
@media (max-width:1100px){
	.spide-real-blocs__inner{ grid-template-columns:minmax(0,1fr); }
	.spide-real-bloc{ border-left:0; border-top:1px solid #DCDCDC; padding-left:0; padding-right:0; }
	.spide-real-bloc:first-child{ border-top:0; }
	.spide-real-autres__list{ grid-template-columns:repeat(2, minmax(0,1fr)); }
}
@media (max-width:900px){
	.spide-real-hero__inner{ grid-template-columns:minmax(0,1fr); }
	.spide-real-hero__media{ height:clamp(220px,52vw,340px); margin-top:0; }
	.spide-real-intro__inner{ grid-template-columns:minmax(0,1fr); }
}
@media (max-width:640px){
	.spide-real-hero__meta > div{ grid-template-columns:minmax(0,1fr); gap:4px; }
	.spide-real-autres__list{ grid-template-columns:minmax(0,1fr); }
}
