/* ====================================================================
   BANNIERE DE LA PAGE BOUTIQUE
   Bandeau pleine largeur en tete de « Tous les produits ».

   Le fichier fourni comporte de larges marges blanches : le sujet
   n'occupe que 65 % de la hauteur. Plutot que d'etirer le bandeau pour
   compenser, on affiche l'image plus grande que la bande et on laisse
   les marges sortir du cadre. Le coffret garde ainsi sa presence dans
   un en-tete deux fois moins haut, et rien n'est rogne sur le sujet.
   ==================================================================== */

/* « clip » plutot que « hidden » : on supprime le debordement horizontal
   provoque par 100vw sans creer de conteneur de defilement, ce qui
   casserait l'en-tete collant. */
body.woocommerce-shop .site-content {
	overflow-x: clip;
}

.lmc-hero-boutique {
	--lmc-bande: clamp(140px, 20vw, 290px);

	display: flex;
	align-items: center;
	justify-content: center;
	width: 100vw;
	height: var(--lmc-bande);
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	margin-bottom: 0;
	overflow: hidden;
	/* Le visuel est detoure sur blanc : le bandeau reprend ce blanc, les
	   bords de l'image deviennent invisibles. */
	background-color: #ffffff;
	line-height: 0;
}

.lmc-hero-boutique__img {
	/* 1,54 = hauteur totale / hauteur du sujet : le coffret occupe alors
	   toute la hauteur du bandeau, les marges blanches passent dehors. */
	height: calc(var(--lmc-bande) * 1.54);
	width: auto;
	max-width: none;
	object-fit: contain;
	flex: 0 0 auto;
}

/* Sous la banniere, le theme cumulait 96 px de vide : sa propre marge de
   section (30 px), celle du bloc de titre (40 px) et la nôtre (26 px).
   On ramene l'ensemble a une respiration unique. */
body.woocommerce-shop .hero-header.page-padding {
	padding-top: 0;
}

body.woocommerce-shop .regular-title {
	padding-top: 34px;
}

body.woocommerce-shop .woocommerce-products-header {
	margin-top: 0;
}

@media (max-width: 767px) {
	.lmc-hero-boutique {
		--lmc-bande: clamp(112px, 30vw, 160px);
	}

	body.woocommerce-shop .regular-title {
		padding-top: 24px;
	}
}