/*
Theme Name: La Petite Laverie FSE
Description: Thème bloc reprenant l'identité de La Petite Laverie (Dijon) — valeurs extraites du DOM de production. Janda/Overpass/Open Sans, indigo #393185, cyan #23a5da, magenta #f44ee4.
Author: Karastudio
Version: 0.3.0
*/

/* ================================================================
   Page « Nos Laveries » : fond photo lessive + blend screen (extrait)
   ================================================================ */
/* Listing/fiches uniquement — l'accueil a son propre décor (.lpl-hero) */
body:has(.lpl-app):not(:has(.lpl-hero)) {
	background:
		linear-gradient(180deg, #ffffff 0%, #23a5da 100%),
		url(assets/lessive.jpg) center / cover no-repeat fixed;
	background-blend-mode: screen;
}

/* Bandeau titre sur fond bulles (extrait : parallax bg-bules) */
body:has(.lpl-app) .wp-block-post-title,
body:has(.lpl-app) h1.lpl-page-title {
	background: url(assets/bg-bules.png) center / cover no-repeat;
	color: var(--wp--preset--color--indigo);
	text-align: center;
	font-family: var(--wp--preset--font-family--janda);
	font-size: clamp(2.6rem, 6vw, 4rem);
	padding: 4rem 1rem 3.5rem;
	margin: 0 calc(50% - 50vw) 2rem;
	width: 100vw;
	max-width: none;
	box-sizing: border-box;
}

body:has(.lpl-app) main,
body:has(.lpl-app) .wp-block-post-content {
	background: transparent;
}

/* ================================================================
   HÉROS accueil (extrait section_0 : 751px, parallax bulles)
   ================================================================ */
.lpl-hero {
	position: relative;
	/* extrait : parallax bg-bules.png seul — l'image contient déjà son dégradé bleu */
	background: #8fd4ef url(assets/bg-bules.png) center / cover no-repeat;
	overflow: hidden;
}
.lpl-hero-title {
	font-family: var(--wp--preset--font-family--janda);
	font-size: clamp(2.6rem, 5.5vw, 4rem) !important;
	line-height: 1.05;
	font-weight: 400;
	color: var(--wp--preset--color--bleu-ciel) !important;
}
.lpl-hero-title span {
	font-size: clamp(3.2rem, 7vw, 5.2rem);
	color: var(--wp--preset--color--bleu-ciel);
	-webkit-text-stroke: 2.5px var(--wp--preset--color--indigo);
	paint-order: stroke fill;
	text-shadow: 3px 3px 0 rgba(57, 49, 133, .35);
}
.lpl-hero-baseline {
	font-family: var(--wp--preset--font-family--janda);
	font-size: clamp(1.3rem, 2.2vw, 1.7rem);
	color: var(--wp--preset--color--bleu-ciel);
	margin-top: .5rem;
}
.lpl-hero-text {
	color: var(--wp--preset--color--indigo);
	font-size: 23px;                        /* extrait : Open Sans 23px */
	max-width: 34rem;
	line-height: 1.55;
}
.lpl-hero .lpl-mascotte {
	position: absolute;
	right: 2%;
	bottom: -4%;
	width: min(609px, 46vw);               /* extrait : mascotte 609px */
	height: auto;
	pointer-events: none;
}

/* CTA — extrait : #f44ee4, radius 100px, Overpass 14px, pad 20/30 */
.lpl-cta .wp-element-button,
.lpl-hero-cta .wp-element-button {
	font-family: "Overpass", Helvetica, Arial, Lucida, sans-serif;
	font-size: 14px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .5px;
	background: var(--wp--preset--color--magenta) !important;
	color: #fff !important;
	border-radius: 100px;
	padding: 20px 30px;
	border: none;
}
.lpl-cta .wp-element-button:hover,
.lpl-hero-cta .wp-element-button:hover {
	background: #d633c2 !important;
}

/* ================================================================
   INTRO « 14 laveries » (extrait section_2 : photo délavée sur radial)
   ================================================================ */
.lpl-intro {
	/* extrait : photo lessive délavée par overlay blanc (rendu quasi-blanc de la prod) */
	background:
		linear-gradient(rgba(255,255,255,.92), rgba(255,255,255,.88)),
		url(assets/lessive.jpg) center / cover no-repeat;
}
.lpl-intro-title {
	font-family: var(--wp--preset--font-family--janda);
	font-size: clamp(2.2rem, 4.5vw, 45px) !important;   /* extrait : Janda 45px */
	font-weight: 400;
	line-height: 1.15;
	color: var(--wp--preset--color--bleu-ciel) !important;
}
.lpl-intro-title::after {
	content: "";
	display: block;
	width: 78px;
	height: 4px;
	background: var(--wp--preset--color--magenta);
	border-radius: 4px;
	margin-top: .8rem;
}
.lpl-intro-text {
	font-family: "Open Sans", Arial, sans-serif;
	font-size: 23px;                         /* extrait : Open Sans 23px cyan */
	line-height: 1.5;
	color: var(--wp--preset--color--bleu-ciel);
}
.lpl-intro-text strong { color: var(--wp--preset--color--indigo); }

/* ================================================================
   GRILLE LAVERIES accueil (extrait section_4 : parallax bg-bules)
   ================================================================ */
.lpl-home-grid {
	position: relative;
	/* extrait : parallax bg-bules.png seul — même image que le héros */
	background: #8fd4ef url(assets/bg-bules.png) center / cover no-repeat;
}
.lpl-home-grid .lpl-grid-title {
	font-family: var(--wp--preset--font-family--janda);
	font-size: clamp(2.6rem, 6vw, 64px) !important;    /* extrait : Janda 64px */
	font-weight: 400;
	text-align: center;
	text-transform: uppercase;
	color: var(--wp--preset--color--indigo) !important;
}
.lpl-home-grid .lpl-grid-sub {
	text-align: center;
	font-weight: 700;
	color: var(--wp--preset--color--indigo);
}

/* Bandeau photo : rasé contre les sections adjacentes (pas de block-gap) */
.wp-block-cover.lpl-photo { margin: 0; }

/* ================================================================
   SERVICES (extrait section_5 : colonnes texte simples, PAS cartes)
   ================================================================ */
.lpl-service-title {
	font-family: var(--wp--preset--font-family--janda);
	font-size: clamp(1.4rem, 2.4vw, 1.9rem);
	font-weight: 400;
	color: var(--wp--preset--color--indigo);
	margin-top: 0;
}
.lpl-service-text {
	font-size: .95rem;
	line-height: 1.6;
	color: var(--wp--preset--color--texte);
}
.lpl-service-text strong { color: var(--wp--preset--color--indigo); }

/* ================================================================
   FOOTER contact + barre basse #222 (extrait : #main-footer #222)
   ================================================================ */
.lpl-contact-block {
	background: var(--wp--preset--color--indigo);
}
.lpl-contact-block h2,
.lpl-contact-block .lpl-service-title {
	color: #fff !important;
}
.lpl-contact-block p,
.lpl-contact-block li {
	color: rgba(255,255,255,.92);
}
.lpl-footer-bar {
	background: #222;                        /* extrait : #main-footer #222 */
	color: #999;
	text-align: center;
	font-size: .85rem;
	padding: 1.2rem 1rem;
}
.lpl-footer-bar a { color: #ccc; text-decoration: none; }
.lpl-footer-bar a:hover { color: var(--wp--preset--color--bleu-ciel); }

.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
}

/* ================================================================
   HEADER (extrait : fixed blanc 114px, nav Open Sans 700 16px indigo)
   ================================================================ */
.wp-block-navigation a { text-decoration: none; }
.wp-block-navigation .wp-block-navigation-item__content {
	font-family: "Open Sans", Arial, sans-serif;
	font-weight: 700;
	font-size: 16px;
	text-transform: uppercase;
	color: var(--wp--preset--color--indigo) !important;
}
.wp-block-navigation .current-menu-item > a,
.wp-block-navigation a:hover {
	color: var(--wp--preset--color--bleu-ciel) !important;
}
</content>