/* =========================================================================
 * Pages de contenu simple — mentions légales, politique de confidentialité,
 * articles, résultats de recherche, page 404.
 * -------------------------------------------------------------------------
 * Ces gabarits (template-parts/single.php, archive.php, search.php, 404.php)
 * n'avaient AUCUN style propre : ils tombaient sur le socle absorbé de
 * hello-elementor (assets/css/base.css), d'où un H1 en police système et
 * surtout des liens en #c36 — le rose que tout le reste du site neutralise.
 * Ils détonnaient franchement à côté des pages métier.
 *
 * On ne réinvente rien : on reprend les variables et les choix typographiques
 * déjà en place (Montserrat, --spide-blue, --spide-noir, --spide-anthracite).
 * ========================================================================= */

.site-main{
	font-family:"Montserrat",sans-serif;
	color:var(--spide-noir,#2D2D2D);
	background:#fff;
}

/* ---- En-tête ---------------------------------------------------------- */
.site-main .page-header{
	max-width:1600px;
	margin:0 auto;
	padding:clamp(48px,6vw,96px) clamp(24px,4vw,72px) clamp(16px,2vw,28px);
}
.site-main .entry-title{
	font-family:"Montserrat",sans-serif;
	font-size:clamp(28px,3.4vw,44px);
	font-weight:700;
	line-height:1.1;
	text-transform:uppercase;
	color:var(--spide-noir,#2D2D2D);
	margin:0;
}

/* ---- Corps ------------------------------------------------------------
 * Largeur de lecture bornée : sur un écran large, une ligne de texte courant
 * qui traverse 1600px est illisible. */
.site-main .page-content{
	max-width:900px;
	margin:0 auto;
	padding:0 clamp(24px,4vw,72px) clamp(64px,8vw,120px);
	font-size:16px;
	line-height:1.7;
	color:var(--spide-anthracite,#767676);
}
.site-main .page-content > *:first-child{ margin-top:0; }

.site-main .page-content h2{
	font-size:clamp(20px,2vw,26px);
	font-weight:700;
	text-transform:uppercase;
	color:var(--spide-noir,#2D2D2D);
	margin:2.2em 0 .6em;
}
.site-main .page-content h3{
	font-size:clamp(17px,1.6vw,20px);
	font-weight:700;
	color:var(--spide-noir,#2D2D2D);
	margin:1.8em 0 .5em;
}
.site-main .page-content p,
.site-main .page-content li{ margin:0 0 1em; }
.site-main .page-content strong{ color:var(--spide-noir,#2D2D2D); font-weight:600; }
.site-main .page-content ul,
.site-main .page-content ol{ padding-left:1.4em; margin:0 0 1.4em; }

/* ---- Liens : le #c36 de hello-elementor n'a rien à faire ici ----------- */
.site-main a,
.site-main .page-content a{
	color:var(--spide-blue,#0000FF);
	text-decoration:underline;
	text-underline-offset:3px;
	transition:opacity .2s ease;
}
.site-main a:hover,
.site-main a:focus,
.site-main .page-content a:hover,
.site-main .page-content a:focus{
	color:var(--spide-blue,#0000FF);
	opacity:.7;
}

/* ---- Page 404 : le message est court, on le centre -------------------- */
.error404 .site-main .page-header,
.error404 .site-main .page-content{ text-align:center; }
.error404 .site-main .page-content{ padding-bottom:clamp(80px,10vw,160px); }

/* ---- Mobile ----------------------------------------------------------- */
@media (max-width:600px){
	.site-main .page-header{ padding:clamp(32px,8vw,48px) 20px 12px; }
	.site-main .page-content{ padding:0 20px clamp(48px,12vw,72px); }
}
