@import url('https://fonts.googleapis.com/css2?family=Bodoni+Moda:opsz,wght@6..96,400;6..96,500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display&display=swap');

/* ==========================================================
   LPROJECT PHOTOS
   Astra Child v1.2
   ========================================================== */

:root{
	--lp-black:#050505;
	--lp-black-soft:#0b0b0c;
	--lp-cream:#e9dfc3;
	--lp-cream-soft:#f4edda;
	--lp-purple:#39213f;
	--lp-purple-light:#59315f;
	--lp-blue-black:#182224;
	--lp-white:#f7f4ed;
	--lp-muted:#b8b1a5;
	--lp-border:rgba(233,223,195,.25);

	--lp-serif:"Cormorant Garamond",Georgia,serif;
	--lp-sans:"Montserrat",Arial,sans-serif;

	/* Astra sans bleu */
	--ast-global-color-0:#39213f !important;
	--ast-global-color-1:#59315f !important;
	--ast-global-color-2:#f4edda !important;
	--ast-global-color-3:#e9dfc3 !important;
	--ast-global-color-4:#050505 !important;
	--ast-global-color-5:#0b0b0c !important;
	--ast-global-color-6:#b8b1a5 !important;
	--ast-global-color-7:#182224 !important;
	--ast-global-color-8:#f7f4ed !important;
}

*{
	box-sizing:border-box;
}

html{
	scroll-behavior:smooth;
}

body{
	margin:0;
	background:var(--lp-black);
	color:var(--lp-white);
	font-family:var(--lp-sans);
}

body:not(.home){
	padding-top:86px;
}

a{
	color:inherit;
	text-decoration:none;
}

img{
	max-width:100%;
	height:auto;
}

::selection{
	background:var(--lp-purple-light);
	color:var(--lp-white);
}

.lp-container{
	width:min(1220px,90vw);
	margin-inline:auto;
}

/* ==========================================================
   NEUTRALISATION ASTRA
   ========================================================== */

a,
.entry-content a,
.site-footer a,
.site-header a{
	color:var(--lp-cream);
}

a:hover,
a:focus,
a:active,
.entry-content a:hover,
.site-footer a:hover,
.site-header a:hover{
	color:var(--lp-cream-soft);
}

button,
.button,
.ast-button,
.wp-block-button__link,
input[type="button"],
input[type="submit"],
input[type="reset"],
.ast-custom-button{
	background-color:var(--lp-purple) !important;
	border-color:var(--lp-purple) !important;
	color:var(--lp-white) !important;
}

button:hover,
button:focus,
.button:hover,
.ast-button:hover,
.wp-block-button__link:hover,
input[type="button"]:hover,
input[type="submit"]:hover,
.ast-custom-button:hover{
	background-color:var(--lp-purple-light) !important;
	border-color:var(--lp-purple-light) !important;
	color:var(--lp-white) !important;
}

#ast-scroll-top,
.ast-scroll-top-icon,
.ast-scroll-to-top-right,
.ast-scroll-to-top-left{
	background-color:var(--lp-purple) !important;
	border-color:var(--lp-purple) !important;
	color:var(--lp-white) !important;
	box-shadow:none !important;
}

#ast-scroll-top:hover{
	background-color:var(--lp-purple-light) !important;
}

#ast-scroll-top svg,
#ast-scroll-top svg path{
	fill:var(--lp-white) !important;
	stroke:var(--lp-white) !important;
}

input,
textarea,
select{
	border-color:var(--lp-border) !important;
}

input:focus,
textarea:focus,
select:focus{
	border-color:var(--lp-purple-light) !important;
	box-shadow:0 0 0 1px var(--lp-purple-light) !important;
	outline:none !important;
}

input[type="checkbox"],
input[type="radio"]{
	accent-color:var(--lp-purple) !important;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible{
	outline:2px solid var(--lp-cream) !important;
	outline-offset:3px;
	box-shadow:none !important;
}

/* ==========================================================
   HEADER GLOBAL
   ========================================================== */

.lp-site-header{
	position:fixed;
	z-index:9999;
	top:0;
	left:0;
	right:0;
	height:86px;
	display:flex;
	align-items:center;
	background:rgba(5,5,5,.96);
	border-bottom:1px solid rgba(233,223,195,.10);
	transition:
		background .25s ease,
		backdrop-filter .25s ease,
		border-color .25s ease;
}

body.home .lp-site-header{
	background:linear-gradient(
		to bottom,
		rgba(0,0,0,.74),
		rgba(0,0,0,.18)
	);
	border-bottom-color:transparent;
}

body.home .lp-site-header.is-scrolled{
	background:rgba(5,5,5,.92);
	backdrop-filter:blur(14px);
	border-bottom-color:rgba(233,223,195,.12);
}

.lp-header-inner{
	height:100%;
	display:flex;
	align-items:center;
	gap:34px;
}

.lp-header-brand{
	flex:0 0 auto;
	display:flex;
	align-items:center;
}

.lp-header-brand .custom-logo-link{
	display:flex;
	align-items:center;
}

.lp-header-brand .custom-logo{
	width:auto;
	max-width:130px;
	max-height:64px;
	object-fit:contain;
}

.lp-text-logo{
	color:var(--lp-cream-soft);
	font-family:var(--lp-serif);
	font-size:25px;
	letter-spacing:.14em;
	text-transform:uppercase;
}

.lp-header-navigation{
	flex:1;
	display:flex;
	align-items:center;
	justify-content:flex-end;
	gap:30px;
}

.lp-primary-nav{
	display:flex;
	align-items:center;
}

.lp-menu{
	display:flex;
	align-items:center;
	gap:27px;
	margin:0;
	padding:0;
	list-style:none;
}

.lp-menu li{
	position:relative;
	margin:0;
}

.lp-menu > li > a{
	position:relative;
	display:block;
	padding:32px 0 29px;
	color:var(--lp-cream-soft) !important;
	font-size:11px;
	font-weight:500;
	letter-spacing:.16em;
	text-transform:uppercase;
}

.lp-menu > li > a::after{
	content:"";
	position:absolute;
	left:0;
	right:100%;
	bottom:23px;
	height:1px;
	background:var(--lp-purple-light);
	transition:right .25s ease;
}

.lp-menu > li:hover > a::after,
.lp-menu > .current-menu-item > a::after,
.lp-menu > .current-menu-ancestor > a::after{
	right:0;
}

.lp-menu .sub-menu{
	position:absolute;
	top:100%;
	left:-20px;
	min-width:210px;
	margin:0;
	padding:12px 0;
	list-style:none;
	opacity:0;
	visibility:hidden;
	transform:translateY(8px);
	background:rgba(8,8,9,.98);
	border:1px solid var(--lp-border);
	transition:.2s ease;
}

.lp-menu li:hover > .sub-menu{
	opacity:1;
	visibility:visible;
	transform:none;
}

.lp-menu .sub-menu a{
	display:block;
	padding:12px 18px;
	color:var(--lp-cream) !important;
	font-size:11px;
	text-transform:uppercase;
	letter-spacing:.1em;
}

.lp-menu .sub-menu a:hover{
	background:rgba(89,49,95,.15);
	color:var(--lp-cream-soft) !important;
}

.lp-header-actions{
	display:flex;
	align-items:center;
	gap:20px;
}

.lp-header-link{
	color:var(--lp-cream) !important;
	font-size:11px;
	letter-spacing:.15em;
	text-transform:uppercase;
}

.lp-header-client{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-height:40px;
	padding:0 18px;
	border:1px solid var(--lp-purple-light);
	color:var(--lp-cream-soft) !important;
	font-size:10px;
	font-weight:500;
	letter-spacing:.15em;
	text-transform:uppercase;
	transition:.2s ease;
}

.lp-header-client:hover{
	background:var(--lp-purple);
	border-color:var(--lp-purple);
	color:var(--lp-white) !important;
}

.lp-menu-toggle{
	display:none;
	width:42px;
	height:42px;
	padding:9px !important;
	flex-direction:column;
	justify-content:center;
	gap:5px;
	background:transparent !important;
	border:0 !important;
}

.lp-menu-toggle span{
	display:block;
	width:100%;
	height:1px;
	background:var(--lp-cream);
	transition:.25s ease;
}

.lp-menu-toggle.is-open span:nth-child(1){
	transform:translateY(6px) rotate(45deg);
}

.lp-menu-toggle.is-open span:nth-child(2){
	opacity:0;
}

.lp-menu-toggle.is-open span:nth-child(3){
	transform:translateY(-6px) rotate(-45deg);
}

/* ==========================================================
   FOOTER GLOBAL
   ========================================================== */

.lp-site-footer{
	position:relative;
	background:
		linear-gradient(
			135deg,
			#050505 0%,
			#0b0b0c 55%,
			#070708 100%
		);
	border-top:1px solid rgba(233,223,195,.11);
}

.lp-footer-top{
	min-height:210px;
	display:grid;
	grid-template-columns:.8fr 1.7fr .6fr;
	align-items:center;
	gap:50px;
	padding-top:45px;
	padding-bottom:45px;
}

.lp-footer-brand .custom-logo{
	width:auto;
	max-width:150px;
	max-height:115px;
	object-fit:contain;
}

.lp-footer-brand .lp-text-logo{
	font-size:23px;
}

.lp-footer-about{
	text-align:center;
}

.lp-footer-location{
	margin:0 0 10px;
	color:var(--lp-cream);
	font-family:var(--lp-serif);
	font-size:14px;
	letter-spacing:.20em;
	text-transform:uppercase;
}

.lp-footer-tagline{
	margin:0;
	color:var(--lp-muted);
	font-size:10px;
	letter-spacing:.20em;
	text-transform:uppercase;
}

.lp-footer-socials{
	display:flex;
	justify-content:flex-end;
	align-items:center;
	gap:14px;
}

.lp-footer-socials a{
	width:38px;
	height:38px;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	border:1px solid rgba(233,223,195,.24);
	color:var(--lp-cream) !important;
	transition:.2s ease;
}

.lp-footer-socials a:hover{
	border-color:var(--lp-purple-light);
	background:var(--lp-purple);
	color:var(--lp-white) !important;
}

.lp-footer-socials svg{
	width:18px;
	height:18px;
	fill:none;
	stroke:currentColor;
	stroke-width:1.7;
}

.lp-footer-socials .lp-svg-fill{
	fill:currentColor;
	stroke:none;
}

.lp-footer-bottom{
	border-top:1px solid rgba(233,223,195,.09);
}

.lp-footer-bottom-inner{
	min-height:75px;
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:30px;
}

.lp-footer-copyright{
	color:#817b72;
	font-size:10px;
	letter-spacing:.12em;
	text-transform:uppercase;
}

.lp-footer-links{
	display:flex;
	align-items:center;
	gap:24px;
	margin:0;
	padding:0;
	list-style:none;
}

.lp-footer-links a{
	color:#aaa399 !important;
	font-size:9px;
	letter-spacing:.14em;
	text-transform:uppercase;
}

.lp-footer-links a:hover{
	color:var(--lp-cream) !important;
}

/* ==========================================================
   PAGES GÉNÉRIQUES
   ========================================================== */

.lp-page-main{
	min-height:60vh;
}

.lp-page-header{
	padding-top:80px;
	padding-bottom:35px;
}

.lp-page-header h1{
	margin:0;
	color:var(--lp-cream-soft);
	font-family:var(--lp-serif);
	font-size:clamp(48px,7vw,90px);
	font-weight:400;
	line-height:.95;
}

.lp-page-content{
	padding-bottom:90px;
}

/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width:980px){

	body:not(.home){
		padding-top:74px;
	}

	.lp-site-header{
		height:74px;
	}

	.lp-header-brand .custom-logo{
		max-width:105px;
		max-height:56px;
	}

	.lp-header-inner{
		justify-content:space-between;
	}

	.lp-menu-toggle{
		display:flex;
		margin-left:auto;
	}

	.lp-header-navigation{
		position:absolute;
		top:100%;
		left:0;
		right:0;
		display:none;
		padding:18px 5vw 28px;
		flex-direction:column;
		align-items:stretch;
		gap:20px;
		background:rgba(5,5,5,.98);
		border-top:1px solid rgba(233,223,195,.10);
		border-bottom:1px solid rgba(233,223,195,.15);
	}

	.lp-header-navigation.is-open{
		display:flex;
	}

	.lp-primary-nav{
		width:100%;
	}

	.lp-menu{
		width:100%;
		flex-direction:column;
		align-items:stretch;
		gap:0;
	}

	.lp-menu > li{
		border-bottom:1px solid rgba(233,223,195,.09);
	}

	.lp-menu > li > a{
		padding:15px 0;
	}

	.lp-menu > li > a::after{
		display:none;
	}

	.lp-menu .sub-menu{
		position:static;
		display:block;
		min-width:0;
		padding:0 0 9px 16px;
		opacity:1;
		visibility:visible;
		transform:none;
		background:transparent;
		border:0;
	}

	.lp-header-actions{
		width:100%;
		align-items:stretch;
		gap:10px;
	}

	.lp-header-link,
	.lp-header-client{
		flex:1;
		min-height:46px;
		display:flex;
		align-items:center;
		justify-content:center;
		border:1px solid var(--lp-border);
	}

	.lp-header-client{
		border-color:var(--lp-purple-light);
	}

	.lp-footer-top{
		grid-template-columns:1fr;
		text-align:center;
		gap:28px;
	}

	.lp-footer-brand{
		display:flex;
		justify-content:center;
	}

	.lp-footer-socials{
		justify-content:center;
	}

	.lp-footer-bottom-inner{
		padding-top:25px;
		padding-bottom:25px;
		flex-direction:column;
		text-align:center;
	}

	.lp-footer-links{
		justify-content:center;
		flex-wrap:wrap;
	}

}

@media (max-width:600px){

	.lp-container{
		width:calc(100% - 40px);
	}

	.lp-header-actions{
		flex-direction:column;
	}

	.lp-footer-links{
		flex-direction:column;
		gap:14px;
	}

}


/* ==========================================================
   PAGE D'ACCUEIL — V1
   ========================================================== */

.lp-home{
	background:var(--lp-black);
}

.lp-home-hero{
	position:relative;
	min-height:100vh;
	display:flex;
	align-items:center;
	overflow:hidden;
	isolation:isolate;
	background:
		radial-gradient(circle at 70% 35%, rgba(89,49,95,.18), transparent 33%),
		linear-gradient(135deg,#111 0%,#050505 68%);
}

.lp-home-hero-bg{
	position:absolute;
	inset:0;
	z-index:-3;
}

.lp-home-hero-bg img{
	width:100%;
	height:100%;
	object-fit:cover;
	object-position:center;
}

.lp-home-hero-overlay{
	position:absolute;
	inset:0;
	z-index:-2;
	background:
		linear-gradient(
			90deg,
			rgba(0,0,0,.83) 0%,
			rgba(0,0,0,.60) 30%,
			rgba(0,0,0,.20) 62%,
			rgba(0,0,0,.30) 100%
		),
		linear-gradient(
			to top,
			rgba(0,0,0,.55),
			transparent 40%
		);
}

.lp-home-hero-content{
	padding-top:120px;
	padding-bottom:80px;
}

.lp-home-kicker{
	margin:0 0 22px;
	color:var(--lp-cream);
	font-size:11px;
	font-weight:500;
	letter-spacing:.28em;
	text-transform:uppercase;
}

.lp-home-hero h1{
	max-width:780px;

	font-family:"DM Serif Display", serif !important;

	font-size:clamp(68px,6.3vw,118px);
	font-weight:400;

	line-height:.86;
	letter-spacing:-0.015em;

	color:var(--lp-cream-soft);

	text-transform:uppercase;
}

.lp-home-hero-subtitle{
	margin:25px 0 12px;
	color:var(--lp-cream-soft);
	font-family:var(--lp-serif);
	font-size:clamp(21px,2.5vw,34px);
	letter-spacing:.14em;
}

.lp-home-hero-categories{
	margin:0 0 34px;
	color:#d3ccc0;
	font-size:12px;
	letter-spacing:.08em;
}

.lp-home-hero-categories span{
	margin:0 9px;
	color:var(--lp-purple-light);
}

.lp-outline-button{
	min-height:52px;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:17px;
	padding:0 27px;
	border:1px solid rgba(233,223,195,.62);
	color:var(--lp-cream-soft) !important;
	font-size:10px;
	font-weight:500;
	letter-spacing:.18em;
	text-transform:uppercase;
	transition:.25s ease;
}

.lp-outline-button:hover{
	border-color:var(--lp-purple-light);
	background:rgba(57,33,63,.45);
	color:var(--lp-white) !important;
}

.lp-outline-button span{
	font-family:Georgia,serif;
	font-size:18px;
}

.lp-home-scroll{
	position:absolute;
	z-index:2;
	right:25px;
	top:52%;
	display:flex;
	flex-direction:column;
	align-items:center;
	gap:14px;
	color:#bcb4a8;
	font-size:8px;
	letter-spacing:.24em;
	text-transform:uppercase;
	writing-mode:vertical-rl;
}

.lp-home-scroll i{
	width:1px;
	height:42px;
	display:block;
	background:var(--lp-cream);
}


/* APPROCHE */

.lp-home-approach{
	background:
		linear-gradient(135deg,#070707,#0b0b0c);
	border-top:1px solid rgba(255,255,255,.06);
}

.lp-approach-grid{
	display:grid;
	grid-template-columns:1.08fr 1fr .95fr;
	min-height:580px;
}

.lp-approach-image{
	position:relative;
	min-height:260px;
	overflow:hidden;
	background:#111;
}

.lp-approach-image img{
	width:100%;
	height:100%;
	object-fit:cover;
	filter:saturate(.88);
	transition:transform .8s cubic-bezier(.2,.7,.2,1);
}

.lp-approach-image:hover img{
	transform:scale(1.025);
}

.lp-approach-image-main{
	min-height:580px;
}

.lp-approach-copy{
	padding:75px 52px;
	display:flex;
	flex-direction:column;
	justify-content:center;
	background:
		radial-gradient(circle at 100% 0%,rgba(89,49,95,.13),transparent 32%),
		#090909;
}

.lp-section-kicker{
	margin:0 0 20px;
	color:var(--lp-cream);
	font-size:10px;
	letter-spacing:.28em;
	text-transform:uppercase;
}

.lp-approach-copy h2{
	max-width:500px;
	margin:0;
	color:var(--lp-cream-soft);
	font-family:var(--lp-serif);
	font-size:clamp(43px,4.7vw,72px);
	font-weight:400;
	line-height:.93;
	text-transform:uppercase;
}

.lp-short-line{
	width:52px;
	height:2px;
	margin:25px 0;
	background:var(--lp-purple-light);
}

.lp-approach-copy > p:not(.lp-section-kicker){
	max-width:500px;
	margin:0 0 28px;
	color:#cbc4b9;
	font-size:13px;
	font-weight:300;
	line-height:1.8;
}

.lp-outline-button-small{
	align-self:flex-start;
	min-height:45px;
	padding:0 20px;
	font-size:9px;
}

.lp-approach-side{
	display:grid;
	grid-template-rows:1fr 1fr;
	min-height:580px;
}


/* UNIVERS */

.lp-home-universes{
	display:grid;
	grid-template-columns:repeat(3,1fr);
	min-height:460px;
	background:#060606;
}

.lp-universe-card{
	position:relative;
	min-height:460px;
	display:flex;
	align-items:flex-end;
	overflow:hidden;
	isolation:isolate;
	border-top:1px solid rgba(233,223,195,.08);
}

.lp-universe-card:not(:last-child){
	border-right:1px solid rgba(233,223,195,.14);
}

.lp-universe-bg{
	position:absolute;
	inset:0;
	z-index:-3;
}

.lp-universe-bg img{
	width:100%;
	height:100%;
	object-fit:cover;
	transition:transform .9s cubic-bezier(.2,.7,.2,1);
}

.lp-universe-card:hover .lp-universe-bg img{
	transform:scale(1.035);
}

.lp-universe-overlay{
	position:absolute;
	inset:0;
	z-index:-2;
	background:
		linear-gradient(
			to top,
			rgba(0,0,0,.95) 0%,
			rgba(0,0,0,.56) 48%,
			rgba(0,0,0,.12) 100%
		);
}

.lp-universe-content{
	width:100%;
	padding:35px 42px 40px;
}

.lp-universe-number{
	display:block;
	margin-bottom:8px;
	color:var(--lp-cream);
	font-family:var(--lp-serif);
	font-size:13px;
	letter-spacing:.2em;
}

.lp-universe-content h3{
	margin:0 0 18px;
	color:var(--lp-cream-soft);
	font-family:var(--lp-serif);
	font-size:clamp(31px,3vw,48px);
	font-weight:400;
}

.lp-universe-list{
	display:flex;
	flex-direction:column;
	gap:3px;
	margin-bottom:22px;
	color:#ddd5c9;
	font-size:12px;
	font-weight:300;
	line-height:1.5;
}

.lp-universe-link{
	position:relative;
	display:inline-flex;
	gap:12px;
	padding-bottom:5px;
	color:var(--lp-cream) !important;
	font-size:9px;
	letter-spacing:.18em;
	text-transform:uppercase;
}

.lp-universe-link::after{
	content:"";
	position:absolute;
	left:0;
	bottom:0;
	width:32px;
	height:1px;
	background:var(--lp-purple-light);
	transition:width .25s ease;
}

.lp-universe-link:hover::after{
	width:100%;
}


/* PROVISOIRE POUR LA SUITE */

.lp-home-next{
	padding:100px 0;
	background:var(--lp-cream-soft);
	color:#191713;
}

.lp-home-next .lp-section-kicker{
	color:var(--lp-purple);
}

.lp-home-next h2{
	max-width:850px;
	margin:0 0 25px;
	font-family:var(--lp-serif);
	font-size:clamp(48px,6vw,88px);
	font-weight:400;
	line-height:.95;
	text-transform:uppercase;
}

.lp-home-next p:last-child{
	max-width:650px;
	margin:0;
	font-size:14px;
	line-height:1.8;
}


/* ==========================================================
   ACCUEIL RESPONSIVE
   ========================================================== */

@media(max-width:1050px){

	.lp-approach-grid{
		grid-template-columns:1fr 1fr;
	}

	.lp-approach-image-main{
		min-height:620px;
	}

	.lp-approach-side{
		grid-column:1 / -1;
		grid-template-columns:1fr 1fr;
		grid-template-rows:300px;
		min-height:0;
	}

	.lp-home-universes{
		grid-template-columns:1fr;
	}

	.lp-universe-card{
		min-height:420px;
		border-right:0 !important;
		border-bottom:1px solid rgba(233,223,195,.14);
	}

}

@media(max-width:760px){

	.lp-home-hero{
		min-height:820px;
		align-items:flex-end;
	}

	.lp-home-hero-bg img{
		object-position:62% center;
	}

	.lp-home-hero-overlay{
		background:
			linear-gradient(
				to bottom,
				rgba(0,0,0,.28) 0%,
				rgba(0,0,0,.15) 28%,
				rgba(0,0,0,.67) 60%,
				rgba(0,0,0,.96) 100%
			);
	}

	.lp-home-hero-content{
		padding-top:120px;
		padding-bottom:75px;
	}

	.lp-home-hero h1{
		font-size:clamp(55px,17vw,82px);
		line-height:.86;
	}

	.lp-home-hero-subtitle{
		font-size:22px;
		line-height:1.15;
		letter-spacing:.06em;
	}

	.lp-home-hero-categories{
		line-height:1.8;
	}

	.lp-home-scroll{
		display:none;
	}

	.lp-approach-grid{
		grid-template-columns:1fr;
	}

	.lp-approach-image-main{
		min-height:480px;
	}

	.lp-approach-copy{
		padding:55px 24px;
	}

	.lp-approach-side{
		grid-column:auto;
		grid-template-columns:1fr 1fr;
		grid-template-rows:250px;
	}

	.lp-universe-card{
		min-height:390px;
	}

	.lp-universe-content{
		padding:30px 24px;
	}

	.lp-home-next{
		padding:75px 0;
	}
}

@media(max-width:500px){

	.lp-home-hero-categories span{
		margin:0 5px;
	}

	.lp-outline-button{
		width:100%;
	}

	.lp-approach-side{
		grid-template-columns:1fr;
		grid-template-rows:300px 300px;
	}

}

/* ==========================================================
   LPROJECT — CORRECTIONS FINALES ACCUEIL
   Header réellement transparent / noir au scroll
   ========================================================== */


/* ==========================================================
   1. PAGE DE MAINTENANCE
   ========================================================== */

.page-id-8867 .lp-site-header{
	display:none !important;
}

body.page-id-8867{
	padding-top:0 !important;
}


/* ==========================================================
   2. PAGE ACCUEIL DE CONSTRUCTION
   WordPress peut générer :
   .page-template-template-accueil-lproject
   OU
   .page-template-template-accueil-lproject-php
   ========================================================== */

body.page-template-template-accueil-lproject,
body.page-template-template-accueil-lproject-php,
body:has(.lp-home-construction){
	padding-top:0 !important;
	margin-top:0 !important;
}


/*
 * Empêche tout conteneur de laisser un espace au-dessus du Hero.
 */
body.page-template-template-accueil-lproject .lp-home-construction,
body.page-template-template-accueil-lproject-php .lp-home-construction,
body:has(.lp-home-construction) .lp-home-construction{
	margin-top:0 !important;
	padding-top:0 !important;
}


/*
 * Le HERO commence vraiment tout en haut de la fenêtre,
 * donc la photo se trouve derrière le header.
 */
body.page-template-template-accueil-lproject .lp-home-hero,
body.page-template-template-accueil-lproject-php .lp-home-hero,
body:has(.lp-home-construction) .lp-home-hero{
	margin-top:0 !important;
}


/* ==========================================================
   3. HEADER GLOBAL
   ========================================================== */

.lp-site-header{
	position:fixed !important;

	z-index:99999 !important;

	top:0 !important;
	left:0 !important;
	right:0 !important;

	height:100px;

	display:flex;
	align-items:center;

	border:0 !important;
	border-top:0 !important;
	border-bottom:0 !important;

	box-shadow:none !important;

	transition:
		background-color .28s ease,
		backdrop-filter .28s ease,
		-webkit-backdrop-filter .28s ease;
}


/* ==========================================================
   4. HEADER TRANSPARENT SUR LA PAGE DE TRAVAIL
   ========================================================== */

body.page-template-template-accueil-lproject .lp-site-header,
body.page-template-template-accueil-lproject-php .lp-site-header,
body:has(.lp-home-construction) .lp-site-header{

	background:rgba(0,0,0,0) !important;

	border:0 !important;
	border-bottom:0 !important;

	box-shadow:none !important;

	backdrop-filter:none !important;
	-webkit-backdrop-filter:none !important;
}


/*
 * AU SCROLL : noir.
 * lproject.js ajoute automatiquement .is-scrolled.
 */
body.page-template-template-accueil-lproject .lp-site-header.is-scrolled,
body.page-template-template-accueil-lproject-php .lp-site-header.is-scrolled,
body:has(.lp-home-construction) .lp-site-header.is-scrolled{

	background:rgba(5,5,5,.97) !important;

	border:0 !important;
	border-bottom:0 !important;

	box-shadow:0 8px 26px rgba(0,0,0,.18) !important;

	backdrop-filter:blur(12px) !important;
	-webkit-backdrop-filter:blur(12px) !important;
}


/* ==========================================================
   5. FUTURE VRAIE PAGE D'ACCUEIL
   Quand on retirera la maintenance
   ========================================================== */

body.home{
	padding-top:0 !important;
}

body.home .lp-site-header{
	background:transparent !important;

	border:0 !important;
	border-bottom:0 !important;

	box-shadow:none !important;

	backdrop-filter:none !important;
	-webkit-backdrop-filter:none !important;
}

body.home .lp-site-header.is-scrolled{
	background:rgba(5,5,5,.97) !important;

	border:0 !important;
	border-bottom:0 !important;

	box-shadow:0 8px 26px rgba(0,0,0,.18) !important;

	backdrop-filter:blur(12px) !important;
	-webkit-backdrop-filter:blur(12px) !important;
}


/* ==========================================================
   6. HEADER — CONTENU
   ========================================================== */

.lp-header-inner{
	width:90vw !important;
	max-width:none !important;

	height:100%;

	margin-inline:auto;

	display:flex;
	align-items:center;

	gap:34px;
}


/* Logo */
.lp-header-brand{
	flex:0 0 auto;

	display:flex;
	align-items:center;
}

.lp-header-brand .custom-logo-link{
	width:100px !important;
	height:88px !important;

	display:flex;
	align-items:center;
	justify-content:center;
}

.lp-header-brand .custom-logo{
	width:100px !important;
	height:88px !important;

	max-width:100px !important;
	max-height:88px !important;

	object-fit:contain;
}


/* Menu */
.lp-header-navigation{
	flex:1;

	display:flex;
	align-items:center;
	justify-content:flex-end;

	gap:30px;
}

.lp-menu{
	display:flex;
	align-items:center;

	gap:27px;

	margin:0;
	padding:0;

	list-style:none;
}

.lp-menu > li > a{
	position:relative;

	display:block;

	padding:38px 0 34px;

	color:var(--lp-cream-soft) !important;

	font-size:12px;
	font-weight:500;

	letter-spacing:.15em;
	text-transform:uppercase;
}

.lp-menu > li > a::after{
	content:"";

	position:absolute;

	left:0;
	right:100%;
	bottom:28px;

	height:1px;

	background:var(--lp-purple-light);

	transition:right .25s ease;
}

.lp-menu > li:hover > a::after,
.lp-menu > .current-menu-item > a::after,
.lp-menu > .current-menu-ancestor > a::after{
	right:0;
}


/* ==========================================================
   7. HERO
   ========================================================== */

body.page-template-template-accueil-lproject .lp-home-hero-content,
body.page-template-template-accueil-lproject-php .lp-home-hero-content,
body:has(.lp-home-construction) .lp-home-hero-content{

	width:90vw !important;
	max-width:none !important;

	margin-inline:auto;

	padding-top:120px;
	padding-bottom:80px;
}

.lp-home-hero-content > *{
	max-width:850px;
}

.lp-home-hero h1{
	max-width:780px;

	font-size:clamp(68px,6.3vw,118px);
	line-height:.82;
}

.lp-home-hero-subtitle{
	max-width:900px;
}

.lp-home-hero-bg img{
	width:100%;
	height:100%;

	object-fit:cover;
}


/* ==========================================================
   8. SECTION DÉMARCHE
   ========================================================== */

.lp-approach-grid{
	min-height:620px;
}

.lp-approach-image-main,
.lp-approach-side{
	min-height:620px;
}


/* Placeholders */
.lp-image-placeholder{
	position:absolute;
	inset:0;

	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;

	gap:7px;
	padding:25px;

	text-align:center;

	background:
		linear-gradient(
			135deg,
			#101011,
			#070708
		);

	color:var(--lp-cream);
}

.lp-image-placeholder::before{
	content:"";

	width:36px;
	height:2px;

	margin-bottom:8px;

	background:var(--lp-purple-light);
}

.lp-image-placeholder span{
	font-family:var(--lp-serif);
	font-size:22px;
}

.lp-image-placeholder small{
	color:var(--lp-muted);

	font-size:9px;
	letter-spacing:.14em;

	text-transform:uppercase;
}


/* ==========================================================
   9. FOOTER
   ========================================================== */

.lp-footer-brand .custom-logo{
	width:100px;
	height:100px;

	max-width:none;
	max-height:none;

	object-fit:contain;
}


/* ==========================================================
   10. TABLETTE
   ========================================================== */

@media(max-width:980px){

	.lp-site-header{
		height:78px;
	}

	.lp-header-inner{
		width:calc(100% - 40px) !important;
	}

	.lp-header-brand .custom-logo-link{
		width:68px !important;
		height:65px !important;
	}

	.lp-header-brand .custom-logo{
		width:68px !important;
		height:65px !important;

		max-width:68px !important;
		max-height:65px !important;
	}

	body.page-template-template-accueil-lproject .lp-home-hero-content,
	body.page-template-template-accueil-lproject-php .lp-home-hero-content,
	body:has(.lp-home-construction) .lp-home-hero-content{
		width:calc(100% - 48px) !important;
	}

}


/* ==========================================================
   11. MOBILE
   ========================================================== */

@media(max-width:760px){

	.lp-home-hero h1{
		font-size:clamp(55px,17vw,82px);
	}

	.lp-approach-grid{
		min-height:0;
	}

	.lp-approach-image-main{
		min-height:480px;
	}

	.lp-approach-side{
		min-height:0;
	}

}

/* ==========================================================
   LOGO HEADER — GRAND MAIS NON COUPÉ
   ========================================================== */

.lp-header-brand{
	overflow:visible !important;
}

.lp-header-brand .custom-logo-link{
	width:150px !important;
	height:100px !important;

	display:flex;
	align-items:center;
	justify-content:center;

	overflow:visible !important;
}

.lp-header-brand .custom-logo{
	width:125px !important;
	height:125px !important;

	max-width:none !important;
	max-height:none !important;

	object-fit:contain;

	/* Même taille visuelle, mais légèrement plus bas */
	transform:translateY(42px) scale(1.35);
	transform-origin:center;
}


/* TABLETTE / MOBILE */
@media(max-width:980px){

	.lp-header-brand .custom-logo-link{
		width:90px !important;
		height:78px !important;
	}

	.lp-header-brand .custom-logo{
		width:80px !important;
		height:80px !important;

		transform:translateY(10px) scale(1.25);
	}
}

/* ==========================================================
   TITRE SECTION DÉMARCHE
   ========================================================== */

.lp-approach-title{
	margin-bottom:26px;
}

.lp-approach-title-first{
	margin:0 0 10px !important;

	font-family:"DM Serif Display", serif;
	font-size:clamp(22px,2vw,32px);
	font-weight:400;

	line-height:1.05;

	color:var(--lp-cream);

	text-transform:uppercase;
	letter-spacing:.02em;
}

.lp-approach-title h2{
	margin:0;

	font-family:"DM Serif Display", serif;

	font-size:clamp(42px,4vw,68px);
	font-weight:400;

	line-height:.92;
	letter-spacing:-.02em;

	color:var(--lp-cream-soft);

	text-transform:uppercase;
}

/* ==========================================================
   SECTION DÉMARCHE — VERSION LARGE FINALE
   ========================================================== */

.lp-home-approach{
	position:relative;

	background:#070707;

	padding:78px 0 86px;

	overflow:hidden;
}


/* ==========================================================
   GRILLE PRINCIPALE
   ========================================================== */

.lp-approach-grid{
	width:calc(100vw - 120px) !important;
	max-width:none !important;

	height:680px !important;
	min-height:0 !important;

	margin:0 auto !important;

	display:grid !important;

	grid-template-columns:
		minmax(0,1.12fr)
		minmax(0,1.05fr)
		minmax(0,.76fr) !important;

	gap:20px !important;
}


/* ==========================================================
   PHOTOS — RÈGLES COMMUNES
   ========================================================== */

.lp-approach-image,
.lp-approach-image-main{
	position:relative;

	width:100%;
	height:100% !important;
	min-height:0 !important;

	overflow:hidden;

	background:#0b0b0b;
}


.lp-approach-image img{
	position:absolute;
	inset:0;

	width:100% !important;
	height:100% !important;

	max-width:none !important;

	object-fit:cover;

	filter:saturate(.94);

	transition:
		transform .75s cubic-bezier(.2,.7,.2,1),
		filter .4s ease;
}


.lp-approach-image:hover img{
	transform:scale(1.018);

	filter:saturate(1);
}


/* ==========================================================
   GRANDE PHOTO GAUCHE
   ========================================================== */

.lp-approach-image-main{
	height:680px !important;
}


.lp-approach-image-main img{
	object-position:center center;
}


/* ==========================================================
   COLONNE TEXTE
   ========================================================== */

.lp-approach-copy{
	position:relative;

	width:100%;
	height:680px !important;

	box-sizing:border-box;

	padding:62px 58px;

	display:flex;
	flex-direction:column;
	justify-content:center;

	overflow:hidden;

	background:
		radial-gradient(
			circle at 100% 0%,
			rgba(89,49,95,.13),
			transparent 46%
		),
		linear-gradient(
			145deg,
			#0b0a0c 0%,
			#080808 65%,
			#090909 100%
		);
}


.lp-approach-title{
	width:100%;
	max-width:none;

	margin:0 0 26px;
}


/* Première phrase */
.lp-approach-title-first{
	max-width:560px;

	margin:0 0 14px !important;

	font-family:"DM Serif Display", serif !important;

	font-size:clamp(19px,1.18vw,24px) !important;
	font-weight:400;

	line-height:1.08 !important;

	letter-spacing:.01em;

	color:var(--lp-cream);

	text-transform:uppercase;
}


/* Deuxième phrase */
.lp-approach-title h2{
	width:100%;
	max-width:620px !important;

	margin:0 !important;

	font-family:"DM Serif Display", serif !important;

	font-size:clamp(50px,3.65vw,76px) !important;
	font-weight:400;

	line-height:.91 !important;

	letter-spacing:-.025em;

	color:var(--lp-cream-soft);

	text-transform:uppercase;

	word-break:normal !important;
	overflow-wrap:normal !important;
	hyphens:none !important;
}


/* Ligne violette */
.lp-short-line{
	width:48px;
	height:2px;

	margin:28px 0 24px;

	background:var(--lp-purple-light);
}


/* Texte explicatif */
.lp-approach-text{
	max-width:570px;

	margin:0 0 30px !important;

	color:#beb7ad !important;

	font-size:13px !important;
	font-weight:300;

	line-height:1.75 !important;
}


/* Bouton */
.lp-approach-copy .lp-outline-button-small{
	align-self:flex-start;

	min-height:46px;

	padding:0 22px;
}


/* ==========================================================
   COLONNE DROITE
   ========================================================== */

.lp-approach-side{
	width:100%;
	height:680px !important;
	min-height:0 !important;

	display:grid !important;

	grid-template-columns:1fr !important;
	grid-template-rows:58% 42% !important;

	gap:20px !important;
}


.lp-approach-side .lp-approach-image{
	min-height:0 !important;
	height:100% !important;
}


/* Portrait du haut */
.lp-approach-side .lp-approach-image:first-child img{
	object-position:center 35%;
}


/* Portrait du bas */
.lp-approach-side .lp-approach-image:last-child img{
	object-position:center center;
}


/* ==========================================================
   PLACEHOLDERS
   ========================================================== */

.lp-approach-grid .lp-image-placeholder{
	position:absolute;
	inset:0;

	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;

	gap:7px;

	padding:25px;

	text-align:center;

	background:
		linear-gradient(
			135deg,
			#101011,
			#070708
		);

	color:var(--lp-cream);
}


.lp-approach-grid .lp-image-placeholder::before{
	content:"";

	width:36px;
	height:2px;

	margin-bottom:8px;

	background:var(--lp-purple-light);
}


.lp-approach-grid .lp-image-placeholder span{
	font-family:var(--lp-serif);

	font-size:22px;
}


.lp-approach-grid .lp-image-placeholder small{
	color:var(--lp-muted);

	font-size:9px;

	letter-spacing:.14em;

	text-transform:uppercase;
}


/* ==========================================================
   GRAND ÉCRAN
   ========================================================== */

@media(min-width:1700px){

	.lp-approach-grid{
		width:calc(100vw - 150px) !important;
	}

	.lp-approach-copy{
		padding-left:70px;
		padding-right:70px;
	}

}


/* ==========================================================
   TABLETTE / PETIT DESKTOP
   ========================================================== */

@media(max-width:1100px){

	.lp-home-approach{
		padding:55px 0;
	}

	.lp-approach-grid{
		width:calc(100% - 48px) !important;

		height:auto !important;

		grid-template-columns:1fr 1fr !important;

		gap:16px !important;
	}

	.lp-approach-image-main{
		height:600px !important;
	}

	.lp-approach-copy{
		height:600px !important;

		padding:48px 38px;
	}

	.lp-approach-title h2{
		font-size:clamp(44px,5vw,62px) !important;
	}

	.lp-approach-side{
		grid-column:1 / -1;

		height:380px !important;

		grid-template-columns:1fr 1fr !important;
		grid-template-rows:1fr !important;

		gap:16px !important;
	}

}


/* ==========================================================
   MOBILE
   ========================================================== */

@media(max-width:700px){

	.lp-home-approach{
		padding:24px 0 34px;
	}

	.lp-approach-grid{
		width:calc(100% - 30px) !important;

		height:auto !important;

		display:flex !important;
		flex-direction:column;

		gap:12px !important;
	}

	.lp-approach-image-main{
		height:500px !important;
	}

	.lp-approach-copy{
		height:auto !important;

		padding:48px 26px;
	}

	.lp-approach-title{
		margin-bottom:22px;
	}

	.lp-approach-title-first{
		font-size:18px !important;
	}

	.lp-approach-title h2{
		font-size:44px !important;

		line-height:.94 !important;
	}

	.lp-approach-text{
		font-size:12px !important;
	}

	.lp-approach-side{
		height:auto !important;

		display:grid !important;

		grid-template-columns:1fr !important;
		grid-template-rows:440px 360px !important;

		gap:12px !important;
	}

}


/* ==========================================================
   TRÈS PETIT MOBILE
   ========================================================== */

@media(max-width:440px){

	.lp-approach-image-main{
		height:440px !important;
	}

	.lp-approach-copy{
		padding:42px 22px;
	}

	.lp-approach-title h2{
		font-size:39px !important;
	}

	.lp-approach-side{
		grid-template-rows:380px 320px !important;
	}

}
