/* ==========================================================
   LPROJECT PORTFOLIO
   ========================================================== */

.lppo-page{
	--lppo-bg:#070707;
	--lppo-cream:#efe7da;
	--lppo-muted:#aaa198;
	--lppo-purple:#55265d;
	--lppo-purple2:#75417f;
	--lppo-line:rgba(239,231,218,.14);
	background:var(--lppo-bg);
	color:var(--lppo-cream);
}

.lppo-wrap{
	width:calc(100vw - 96px);
	max-width:none;
	margin:0 auto;
}

.lppo-kicker{
	margin:0 0 15px;
	color:#b58abe;
	font-size:12px;
	font-weight:700;
	letter-spacing:.22em;
	text-transform:uppercase;
}


/* HERO */
.lppo-hero{
	position:relative;
	min-height:470px;
	display:flex;
	align-items:flex-end;
	overflow:hidden;
	isolation:isolate;
	background:#090909;
}

.lppo-hero-media{
	position:absolute;
	inset:0;
	z-index:-3;
}

.lppo-hero-media img{
	width:100%;
	height:100%;
	object-fit:cover;
}

.lppo-hero-overlay{
	position:absolute;
	inset:0;
	z-index:-2;
	background:
		linear-gradient(
			90deg,
			rgba(7,7,7,.98) 0%,
			rgba(7,7,7,.86) 31%,
			rgba(7,7,7,.42) 62%,
			rgba(7,7,7,.12) 100%
		),
		linear-gradient(0deg,rgba(7,7,7,.55),rgba(7,7,7,0) 54%);
}

.lppo-hero-content{
	padding:160px 0 58px;
}

.lppo-hero h1{
	margin:0;
	color:var(--lppo-cream);
	font-family:"DM Serif Display",Georgia,serif;
	font-size:clamp(72px,8vw,124px);
	font-weight:400;
	line-height:.86;
	letter-spacing:-.04em;
}

.lppo-hero-text{
	max-width:620px;
	margin:25px 0 0;
	color:#c1b8ae;
	font-size:18px;
	line-height:1.72;
}


/* GALLERY */
.lppo-gallery-section{
	padding:38px 0 90px;
}

.lppo-filters{
	display:flex;
	flex-wrap:wrap;
	gap:12px;
	margin-bottom:34px;
}

.lppo-filter{
	min-height:48px;
	padding:0 22px !important;
	border:1px solid rgba(178,138,186,.28) !important;
	border-radius:0 !important;
	background:#0b0b0c !important;
	color:#c5bbb1 !important;
	box-shadow:none !important;
	font-family:inherit !important;
	font-size:14px !important;
	font-weight:500 !important;
	letter-spacing:0 !important;
	text-transform:none !important;
	cursor:pointer;
	transition:.2s ease;
}

.lppo-filter:hover,
.lppo-filter.is-active{
	background:var(--lppo-purple) !important;
	border-color:var(--lppo-purple2) !important;
	color:#fff !important;
}

.lppo-masonry{
	column-count:4;
	column-gap:10px;
}

.lppo-item{
	display:block;
	margin:0 0 10px;
	break-inside:avoid;
	overflow:hidden;
	background:#0d0d0e;
}

.lppo-item.is-hidden{
	display:none;
}

.lppo-photo-button{
	display:block !important;
	width:100% !important;
	margin:0 !important;
	padding:0 !important;
	border:0 !important;
	border-radius:0 !important;
	background:transparent !important;
	box-shadow:none !important;
	line-height:0 !important;
	cursor:zoom-in;
}

.lppo-photo-button img{
	display:block;
	width:100%;
	height:auto;
	transition:
		transform .45s ease,
		filter .45s ease;
}

.lppo-photo-button:hover img{
	transform:scale(1.015);
	filter:brightness(.9);
}

.lppo-empty{
	padding:90px 20px;
	border:1px solid var(--lppo-line);
	text-align:center;
}

.lppo-empty p{
	margin:0;
	color:var(--lppo-muted);
	font-size:17px;
}


/* CTA */
.lppo-cta{
	position:relative;
	min-height:420px;
	display:flex;
	align-items:center;
	overflow:hidden;
	isolation:isolate;
	border-top:1px solid var(--lppo-line);
}

.lppo-cta-media{
	position:absolute;
	inset:0;
	z-index:-3;
}

.lppo-cta-media img{
	width:100%;
	height:100%;
	object-fit:cover;
}

.lppo-cta-overlay{
	position:absolute;
	inset:0;
	z-index:-2;
	background:
		linear-gradient(
			90deg,
			rgba(7,7,7,.88) 0%,
			rgba(7,7,7,.70) 38%,
			rgba(7,7,7,.26) 75%,
			rgba(7,7,7,.20) 100%
		),
		linear-gradient(0deg,rgba(7,7,7,.50),rgba(7,7,7,.08));
}

.lppo-cta-content{
	padding:72px 0;
}

.lppo-cta h2{
	max-width:760px;
	margin:0;
	color:var(--lppo-cream);
	font-family:"DM Serif Display",Georgia,serif;
	font-size:clamp(50px,5.6vw,86px);
	font-weight:400;
	line-height:.96;
	letter-spacing:-.03em;
}

.lppo-cta-content > p:not(.lppo-kicker){
	max-width:650px;
	margin:25px 0 30px;
	color:#c2b8af;
	font-size:17px;
	line-height:1.75;
}

.lppo-button{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:14px;
	min-height:56px;
	padding:0 26px;
	border:1px solid var(--lppo-purple2);
	background:var(--lppo-purple);
	color:#fff !important;
	font-size:12px;
	font-weight:700;
	letter-spacing:.12em;
	text-decoration:none !important;
	text-transform:uppercase;
}


/* LIGHTBOX */
.lppo-lightbox{
	position:fixed;
	inset:0;
	z-index:999999;
	display:none;
	align-items:center;
	justify-content:center;
	background:rgba(0,0,0,.95);
}

.lppo-lightbox.is-open{
	display:flex;
}

.lppo-lightbox-stage{
	width:min(88vw,1500px);
	height:88vh;
	display:flex;
	align-items:center;
	justify-content:center;
}

.lppo-lightbox-stage img{
	display:block;
	max-width:100%;
	max-height:100%;
	width:auto;
	height:auto;
	object-fit:contain;
}

.lppo-lightbox-close,
.lppo-lightbox-prev,
.lppo-lightbox-next{
	position:absolute !important;
	z-index:2;
	display:flex !important;
	align-items:center !important;
	justify-content:center !important;
	margin:0 !important;
	padding:0 !important;
	border:1px solid rgba(255,255,255,.18) !important;
	border-radius:50% !important;
	background:rgba(15,15,15,.72) !important;
	color:#fff !important;
	box-shadow:none !important;
	font-family:Arial,sans-serif !important;
	font-weight:300 !important;
	cursor:pointer !important;
}

.lppo-lightbox-close{
	top:22px;
	right:22px;
	width:48px;
	height:48px;
	font-size:33px !important;
	line-height:1 !important;
}

.lppo-lightbox-prev,
.lppo-lightbox-next{
	top:50%;
	width:52px;
	height:52px;
	transform:translateY(-50%);
	font-size:38px !important;
	line-height:1 !important;
}

.lppo-lightbox-prev{
	left:24px;
}

.lppo-lightbox-next{
	right:24px;
}


/* RESPONSIVE */
@media(max-width:1200px){
	.lppo-wrap{
		width:calc(100% - 48px);
	}

	.lppo-masonry{
		column-count:3;
	}
}

@media(max-width:800px){
	.lppo-hero{
		min-height:430px;
	}

	.lppo-hero-content{
		padding:145px 0 50px;
	}

	.lppo-masonry{
		column-count:2;
	}

	.lppo-filters{
		gap:8px;
	}

	.lppo-filter{
		min-height:44px;
		padding:0 16px !important;
		font-size:13px !important;
	}
}

@media(max-width:560px){
	.lppo-wrap{
		width:calc(100% - 28px);
	}

	.lppo-hero h1{
		font-size:64px;
	}

	.lppo-hero-text{
		font-size:17px;
	}

	.lppo-gallery-section{
		padding-top:25px;
	}

	.lppo-masonry{
		column-count:2;
		column-gap:6px;
	}

	.lppo-item{
		margin-bottom:6px;
	}

	.lppo-cta{
		min-height:390px;
	}

	.lppo-cta h2{
		font-size:45px;
	}

	.lppo-lightbox-prev{
		left:8px;
	}

	.lppo-lightbox-next{
		right:8px;
	}

	.lppo-lightbox-close{
		top:12px;
		right:12px;
	}
}


/* ==========================================================
   V2.0.0 — PORTFOLIO PLUS COMPACT
   ========================================================== */

/* Galerie plus dense */
.lppo-gallery-section{
	padding:30px 0 76px !important;
}

.lppo-filters{
	gap:9px !important;
	margin-bottom:24px !important;
}

.lppo-filter{
	min-height:42px !important;
	padding:0 18px !important;
	font-size:13px !important;
}

/* 5 colonnes sur grand écran */
.lppo-masonry{
	column-count:5 !important;
	column-gap:6px !important;
}

.lppo-item{
	margin:0 0 6px !important;
}

/* Effet hover plus discret */
.lppo-photo-button:hover img{
	transform:scale(1.008) !important;
}

/* Hero légèrement plus compact pour laisser davantage de place au portfolio */
.lppo-hero{
	min-height:410px !important;
}

.lppo-hero-content{
	padding:145px 0 48px !important;
}

.lppo-hero h1{
	font-size:clamp(66px,7vw,108px) !important;
}

.lppo-hero-text{
	max-width:590px !important;
	font-size:17px !important;
}

/* Écrans intermédiaires */
@media(max-width:1500px){
	.lppo-masonry{
		column-count:4 !important;
	}
}

@media(max-width:1100px){
	.lppo-masonry{
		column-count:3 !important;
		column-gap:6px !important;
	}

	.lppo-item{
		margin-bottom:6px !important;
	}
}

@media(max-width:700px){
	.lppo-gallery-section{
		padding-top:22px !important;
	}

	.lppo-masonry{
		column-count:2 !important;
		column-gap:5px !important;
	}

	.lppo-item{
		margin-bottom:5px !important;
	}

	.lppo-filters{
		gap:6px !important;
		margin-bottom:18px !important;
	}

	.lppo-filter{
		min-height:40px !important;
		padding:0 13px !important;
		font-size:12px !important;
	}

	.lppo-hero{
		min-height:380px !important;
	}

	.lppo-hero-content{
		padding:132px 0 42px !important;
	}

	.lppo-hero h1{
		font-size:58px !important;
	}
}


/* ==========================================================
   V3.0.0 — GALERIE JUSTIFIÉE / PLUS FINE
   ========================================================== */

/* Hero plus discret */
.lppo-hero{
	min-height:350px !important;
}

.lppo-hero-content{
	padding:125px 0 42px !important;
}

.lppo-hero h1{
	font-size:clamp(58px,6vw,94px) !important;
}

.lppo-hero-text{
	max-width:560px !important;
	margin-top:18px !important;
	font-size:16px !important;
	line-height:1.65 !important;
}


/* Galerie : on annule totalement l'ancien column-count */
.lppo-gallery-section{
	padding:22px 0 62px !important;
}

.lppo-masonry{
	display:flex !important;
	flex-wrap:wrap !important;
	align-items:flex-start !important;
	align-content:flex-start !important;
	column-count:unset !important;
	columns:auto !important;
	column-gap:0 !important;
	gap:4px !important;
	width:100% !important;
}

.lppo-item{
	display:block !important;
	flex:0 0 auto;
	margin:0 !important;
	padding:0 !important;
	break-inside:auto !important;
	overflow:hidden !important;
	background:#0b0b0c !important;
}

.lppo-item.is-hidden{
	display:none !important;
}

.lppo-photo-button{
	width:100% !important;
	height:100% !important;
	overflow:hidden !important;
}

.lppo-photo-button img{
	width:100% !important;
	height:100% !important;
	object-fit:cover !important;
	display:block !important;
}


/* Filtres moins massifs */
.lppo-filters{
	gap:7px !important;
	margin-bottom:18px !important;
}

.lppo-filter{
	min-height:38px !important;
	padding:0 14px !important;
	font-size:12px !important;
}


/* CTA plus fin */
.lppo-cta{
	min-height:320px !important;
}

.lppo-cta-content{
	padding:52px 0 !important;
}

.lppo-cta h2{
	max-width:690px !important;
	font-size:clamp(44px,4.8vw,70px) !important;
}

.lppo-cta-content > p:not(.lppo-kicker){
	max-width:600px !important;
	margin:18px 0 24px !important;
	font-size:16px !important;
}


/* Tablet */
@media(max-width:900px){
	.lppo-hero{
		min-height:330px !important;
	}

	.lppo-hero-content{
		padding:115px 0 38px !important;
	}

	.lppo-masonry{
		gap:3px !important;
	}
}


/* Mobile */
@media(max-width:560px){
	.lppo-hero{
		min-height:305px !important;
	}

	.lppo-hero-content{
		padding:105px 0 34px !important;
	}

	.lppo-hero h1{
		font-size:52px !important;
	}

	.lppo-gallery-section{
		padding-top:16px !important;
		padding-bottom:46px !important;
	}

	.lppo-masonry{
		gap:3px !important;
	}

	.lppo-filter{
		min-height:36px !important;
		padding:0 11px !important;
		font-size:11px !important;
	}

	.lppo-cta{
		min-height:300px !important;
	}

	.lppo-cta h2{
		font-size:40px !important;
	}
}


/* ==========================================================
   V3.0.2 — PROTECTION DES PHOTOS
   ========================================================== */

.lppo-page img{
	-webkit-user-drag:none;
	-webkit-touch-callout:none;
	user-select:none;
	-webkit-user-select:none;
}

.lppo-protect-modal{
	position:fixed;
	inset:0;
	z-index:1000000;
	display:none;
	align-items:center;
	justify-content:center;
	padding:20px;
}

.lppo-protect-modal.is-open{
	display:flex;
}

.lppo-protect-backdrop{
	position:absolute;
	inset:0;
	background:rgba(0,0,0,.78);
	backdrop-filter:blur(5px);
	-webkit-backdrop-filter:blur(5px);
}

.lppo-protect-card{
	position:relative;
	z-index:1;
	width:min(440px,calc(100vw - 34px));
	padding:34px 32px 30px;
	border:1px solid rgba(178,138,186,.28);
	background:
		linear-gradient(145deg,rgba(87,45,91,.10),transparent 48%),
		#0d0d0f;
	box-shadow:0 24px 80px rgba(0,0,0,.55);
	text-align:center;
}

.lppo-protect-logo{
	display:block;
	width:88px;
	height:88px;
	margin:0 auto 20px;
	object-fit:contain;
}

.lppo-protect-kicker{
	margin:0 0 9px;
	color:#b58abe;
	font-size:10px;
	font-weight:700;
	letter-spacing:.22em;
	text-transform:uppercase;
}

.lppo-protect-card h3{
	margin:0;
	color:#efe7da;
	font-family:"DM Serif Display",Georgia,serif;
	font-size:32px;
	font-weight:400;
	line-height:1.05;
}

.lppo-protect-message{
	margin:18px auto 24px;
	max-width:340px;
	color:#b8aea5;
	font-size:15px;
	line-height:1.7;
}

.lppo-protect-close{
	min-height:48px !important;
	padding:0 24px !important;
	border:1px solid #75417f !important;
	border-radius:0 !important;
	background:#55265d !important;
	color:#fff !important;
	box-shadow:none !important;
	font-family:inherit !important;
	font-size:11px !important;
	font-weight:700 !important;
	letter-spacing:.12em !important;
	text-transform:uppercase !important;
	cursor:pointer !important;
}

.lppo-protect-close:hover{
	background:#67306f !important;
}

@media(max-width:560px){
	.lppo-protect-card{
		padding:28px 22px 25px;
	}

	.lppo-protect-logo{
		width:74px;
		height:74px;
	}

	.lppo-protect-card h3{
		font-size:28px;
	}

	.lppo-protect-message{
		font-size:14px;
	}
}