/* ====================================================================
   PAGE ACCESSOIRES — EN COURS DE CONSTRUCTION
   Banniere identique a celle de la boutique, puis l'illustration du
   flacon en fond avec le message d'attente par-dessus.
   Toutes les regles sont cantonnees a body.lmc-page-accessoires :
   aucune autre page ne peut etre touchee.
   ==================================================================== */

/* La banniere sort en 100vw : on supprime le debordement horizontal
   sans creer de conteneur de defilement (« clip » et non « hidden »,
   qui casserait l'en-tete collant). */
body.lmc-page-accessoires .site-content {
	overflow-x: clip;
}

/* Sans WPBakery, le theme enferme la page dans une colonne de 66 %.
   On lui rend la pleine largeur, sinon la banniere est tronquee. */
body.lmc-page-accessoires .main-content,
body.lmc-page-accessoires .col-lg-8 {
	flex: 0 0 100% !important;
	max-width: 100% !important;
	width: 100% !important;
}

/* Le titre de page du theme ferait doublon avec celui du bloc. */
body.lmc-page-accessoires .page-header,
body.lmc-page-accessoires .hero-header,
body.lmc-page-accessoires .entry-header {
	display: none !important;
}

body.lmc-page-accessoires .entry-content,
body.lmc-page-accessoires .page-content {
	padding-top: 0;
	margin-top: 0;
}

/* Aucun blanc entre le bloc bleu et le pied de page : le theme laisse
   du retrait sous la zone de contenu, on l'annule sur cette page. Le
   bleu doit venir toucher le pied de page. */
body.lmc-page-accessoires .site-content,
body.lmc-page-accessoires .site-content > .container,
body.lmc-page-accessoires .site-content > .container > .row,
body.lmc-page-accessoires .main-content,
body.lmc-page-accessoires .entry-content,
body.lmc-page-accessoires .page-content,
body.lmc-page-accessoires article,
body.lmc-page-accessoires .page-padding {
	padding-bottom: 0 !important;
	margin-bottom: 0 !important;
}

body.lmc-page-accessoires .lmc-chantier {
	margin-bottom: 0 !important;
}

/* --------------------------------------------------------------------
   Le bloc « en construction »
   L'illustration est posee en fond ; le retrait haut vaut exactement
   « decalage + hauteur de l'image + respiration », ce qui garantit que
   le texte ne chevauche jamais le flacon, quelle que soit la largeur.
   Rapport de l'image : 1011 x 815, soit 0,806.
   -------------------------------------------------------------------- */
.lmc-chantier {
	--lmc-illu: clamp(280px, 40vw, 520px);
	--lmc-haut: 64px;

	position: relative;
	width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	padding: calc(var(--lmc-haut) + var(--lmc-illu) * 0.806 + 38px) 24px 92px;
	background-color: #ebf2f8;
	background-image: var(--lmc-illustration);
	background-repeat: no-repeat;
	background-position: center var(--lmc-haut);
	background-size: var(--lmc-illu) auto;
	text-align: center;
}

/* Le surtitre bleu a ete retire de l'affichage a la demande de la
   cliente. On le conserve dans le code, hors du champ visuel : il reste
   le titre de premier niveau de la page pour les moteurs de recherche
   et les lecteurs d'ecran, sans rien afficher. */
.lmc-chantier__titre {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	white-space: nowrap;
	clip-path: inset(50%);
	border: 0;
}

/* Message volontairement discret : plus petit, plus aere, et d'un navy
   legerement adouci. Georgia n'ayant pas de graisse fine, la legerete
   vient de la taille, de l'interlettrage et de l'opacite. */
.lmc-chantier__message {
	margin: 0 auto 32px;
	max-width: 26em;
	font-size: clamp(14px, 1.6vw, 18px);
	line-height: 1.6;
	letter-spacing: .05em;
	color: rgba(13, 34, 50, .74);
	font-weight: 400;
}

.lmc-chantier__lien {
	display: inline-block;
	padding: 10px 22px;
	border: 1px solid rgba(13, 34, 50, .4);
	border-radius: 2px;
	color: #0d2232 !important;
	font-size: 11px;
	letter-spacing: .1em;
	text-transform: uppercase;
	text-decoration: none !important;
	transition: background-color .25s ease, color .25s ease, border-color .25s ease;
}

.lmc-chantier__lien:hover,
.lmc-chantier__lien:focus-visible {
	background-color: #0d2232;
	border-color: #0d2232;
	color: #ffffff !important;
}

@media (max-width: 767px) {
	.lmc-chantier {
		--lmc-illu: clamp(220px, 62vw, 320px);
		--lmc-haut: 44px;
		padding-bottom: 64px;
	}

	.lmc-chantier__message {
		margin-bottom: 26px;
	}
}