@import url('https://fonts.googleapis.com/css2?family=Bodoni+Moda:wght@400;500;600&display=swap');

:root{
	--p411-gold:#C8A45D;
	--p411-cream:#F4F1EA;
	--p411-navy:#1F2641;
	--p411-black:#050505;
}

.single-product .wc-auto-hero{
	display:none !important;
}

.single-product .p411-product-media{
	position:relative;
	left:50%;
	width:100vw;
	max-width:none !important;
	margin:0 0 42px -50vw;
	clear:both;
	background:#050505;
}

/* =========================================================
   HERO
   ========================================================= */

.p411-product-hero{
	position:relative;
	width:100%;
	height:100vh;
	min-height:620px;
	overflow:hidden;
	background:#050505;
}

.p411-product-hero__open{
	position:absolute;
	inset:0;
	z-index:1;
	display:block;
	width:100%;
	height:100%;
	padding:0 !important;
	margin:0 !important;
	background:none !important;
	border:0 !important;
	cursor:zoom-in;
}

.p411-product-hero__image{
	position:absolute;
	inset:0;
	width:100%;
	height:100%;
	object-fit:cover;
	object-position:center;
}

.p411-product-hero__shade{
	position:absolute;
	z-index:2;
	inset:0;
	pointer-events:none;
	background:
		linear-gradient(180deg,rgba(0,0,0,.02) 32%,rgba(0,0,0,.08) 57%,rgba(0,0,0,.62) 100%);
}

/* Desktop/tablet title ON the photo */
.p411-product-hero__desktop-title{
	position:absolute;
	z-index:3;
	left:max(34px,calc((100vw - 1420px)/2));
	right:auto;
	bottom:54px;
	max-width:min(850px,78vw);
	text-align:left;
}

.p411-product-hero__desktop-title-text{
	margin:0 !important;
	color:var(--p411-gold) !important;
	font-family:"Bodoni Moda",Georgia,serif !important;
	font-size:clamp(42px,5vw,78px) !important;
	font-weight:500 !important;
	line-height:1.03 !important;
	letter-spacing:.025em;
	text-transform:uppercase;
	text-shadow:0 4px 24px rgba(0,0,0,.72);
}

.p411-product-hero__desktop-title-text::after{
	content:"";
	display:block;
	width:100px;
	height:2px;
	margin:14px auto 0 0;
	background:var(--p411-cream);
}

/* Mobile title is hidden on desktop */
.p411-product-mobile-title{
	display:none;
}

/* =========================================================
   THUMBNAIL CAROUSEL
   ========================================================= */

.p411-product-carousel-wrap{
	position:relative;
	width:min(1420px,calc(100% - 40px));
	margin:0 auto;
	padding:24px 56px;
}

.p411-product-carousel{
	display:flex;
	gap:12px;
	overflow-x:auto;
	scroll-behavior:smooth;
	scroll-snap-type:x proximity;
	-ms-overflow-style:none;
	scrollbar-width:none;
}

.p411-product-carousel::-webkit-scrollbar{display:none}

.p411-product-thumb{
	position:relative;
	flex:0 0 clamp(180px,18vw,270px);
	aspect-ratio:16/10;
	padding:0;
	overflow:hidden;
	background:#0c0d10;
	border:1px solid rgba(255,255,255,.12);
	border-radius:0;
	scroll-snap-align:start;
	cursor:zoom-in;
	transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease;
}

.p411-product-thumb img{
	display:block;
	width:100%;
	height:100%;
	object-fit:cover;
	opacity:.72;
	transition:opacity .25s ease,transform .45s ease;
}

.p411-product-thumb:hover,
.p411-product-thumb.is-active{
	border-color:var(--p411-gold);
	box-shadow:0 12px 26px rgba(0,0,0,.32);
}

.p411-product-thumb:hover img,
.p411-product-thumb.is-active img{
	opacity:1;
	transform:scale(1.035);
}

.p411-product-carousel__nav{
	position:absolute;
	z-index:3;
	top:50%;
	display:flex;
	align-items:center;
	justify-content:center;
	width:38px;
	height:58px;
	padding:0;
	color:var(--p411-gold);
	background:#111317;
	border:1px solid rgba(200,164,93,.55);
	transform:translateY(-50%);
	cursor:pointer;
	font-size:28px;
	line-height:1;
}

.p411-product-carousel__nav:hover{
	color:#050505;
	background:var(--p411-gold);
	border-color:var(--p411-gold);
}

.p411-product-carousel__nav--prev{left:0}
.p411-product-carousel__nav--next{right:0}

/* =========================================================
   FULLSCREEN LIGHTBOX
   ========================================================= */

.p411-gallery-lightbox{
	position:fixed;
	z-index:999999;
	inset:0;
	display:none;
	align-items:center;
	justify-content:center;
	padding:28px;
}

.p411-gallery-lightbox.is-open{display:flex}

.p411-gallery-lightbox__backdrop{
	position:absolute;
	inset:0;
	background:rgba(0,0,0,.95);
	backdrop-filter:blur(8px);
}

.p411-gallery-lightbox__inner{
	position:relative;
	z-index:2;
	display:flex;
	align-items:center;
	justify-content:center;
	width:min(1500px,100%);
	height:min(92vh,1000px);
}

.p411-gallery-lightbox__figure{
	display:flex;
	align-items:center;
	justify-content:center;
	width:100%;
	height:100%;
	margin:0;
	padding:36px 78px;
}

.p411-gallery-lightbox__image{
	display:block;
	max-width:100%;
	max-height:100%;
	width:auto;
	height:auto;
	object-fit:contain;
	box-shadow:0 28px 90px rgba(0,0,0,.6);
}

.p411-gallery-lightbox__close{
	position:absolute;
	z-index:5;
	top:0;
	right:0;
	width:48px;
	height:48px;
	padding:0;
	color:#F4F1EA;
	background:#111317;
	border:1px solid rgba(200,164,93,.75);
	border-radius:0;
	font-size:30px;
	cursor:pointer;
}

.p411-gallery-lightbox__close:hover{
	color:#050505;
	background:#C8A45D;
}

.p411-gallery-lightbox__arrow{
	position:absolute;
	z-index:5;
	top:50%;
	width:54px;
	height:74px;
	padding:0;
	color:#C8A45D;
	background:rgba(17,19,23,.75);
	border:1px solid rgba(200,164,93,.65);
	border-radius:0;
	transform:translateY(-50%);
	font-size:40px;
	cursor:pointer;
}

.p411-gallery-lightbox__arrow:hover{
	color:#050505;
	background:#C8A45D;
}

.p411-gallery-lightbox__arrow--prev{left:0}
.p411-gallery-lightbox__arrow--next{right:0}

.p411-gallery-lightbox__counter{
	position:absolute;
	z-index:5;
	left:50%;
	bottom:0;
	display:flex;
	gap:8px;
	padding:9px 14px;
	color:#F4F1EA;
	background:rgba(17,19,23,.75);
	border:1px solid rgba(200,164,93,.5);
	transform:translateX(-50%);
	font-size:12px;
	letter-spacing:.14em;
}

body.p411-gallery-open{overflow:hidden !important}

.single-product div.product .summary .product_title,
.single-product div.product .summary h1.entry-title{
	display:none !important;
}

/* =========================================================
   TABLET
   ========================================================= */

@media(max-width:900px) and (min-width:601px){
	.p411-product-hero{
		height:78vh;
		min-height:540px;
	}

	.p411-product-hero__desktop-title{
		left:24px;
		bottom:40px;
		max-width:calc(100% - 48px);
	}

	.p411-product-hero__desktop-title-text{
		font-size:clamp(34px,7vw,56px) !important;
	}

	.p411-product-carousel-wrap{
		width:calc(100% - 24px);
		padding:18px 44px;
	}

	.p411-product-thumb{
		flex-basis:220px;
	}
}

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

@media(max-width:600px){

	/* Move the entire gallery a little lower under the mobile header */
	.single-product .p411-product-media{
		margin-top:24px !important;
		margin-bottom:24px !important;
	}

	/* No fake gap, no overflow title tricks */
	.p411-product-hero{
		height:auto !important;
		min-height:0 !important;
		aspect-ratio:4 / 3;
		overflow:hidden !important;
		margin:0 !important;
	}

	.p411-product-hero__image{
		object-position:center center;
	}

	/* Desktop title completely hidden on phone */
	.p411-product-hero__desktop-title{
		display:none !important;
	}

	/* Mobile title is normal flow directly below photo */
	.p411-product-mobile-title{
		display:block !important;
		width:calc(100% - 36px);
		margin:0 auto !important;
		padding:14px 0 6px !important;
	}

	.p411-product-mobile-title__text{
		margin:0 !important;
		color:var(--p411-gold) !important;
		font-family:"Bodoni Moda",Georgia,serif !important;
		font-size:clamp(24px,7.5vw,32px) !important;
		font-weight:500 !important;
		line-height:1.04 !important;
		letter-spacing:.015em !important;
		text-transform:uppercase;
		text-align:left !important;
		text-shadow:none !important;
	}

	.p411-product-mobile-title__text::after{
		content:"";
		display:block;
		width:62px;
		height:2px;
		margin:10px auto 0 0;
		background:var(--p411-cream);
	}

	/* Carousel follows title immediately */
	.p411-product-carousel-wrap{
		width:100%;
		margin:0 !important;
		padding:12px 12px 14px !important;
	}

	.p411-product-carousel{
		gap:8px;
		padding:0 2px;
	}

	.p411-product-thumb{
		flex-basis:150px;
	}

	.p411-product-carousel__nav{
		display:none;
	}

	/* Mobile lightbox safe-area */
	.p411-gallery-lightbox{
		padding:
			max(12px, env(safe-area-inset-top))
			max(12px, env(safe-area-inset-right))
			max(12px, env(safe-area-inset-bottom))
			max(12px, env(safe-area-inset-left)) !important;
		overflow:hidden !important;
	}

	.p411-gallery-lightbox__inner{
		width:100% !important;
		height:100% !important;
		max-width:none !important;
		max-height:none !important;
		overflow:hidden !important;
	}

	.p411-gallery-lightbox__close{
		top:max(10px, env(safe-area-inset-top)) !important;
		right:max(10px, env(safe-area-inset-right)) !important;
		width:44px !important;
		height:44px !important;
	}

	.p411-gallery-lightbox__figure{
		padding:64px 10px 78px !important;
	}

	.p411-gallery-lightbox__arrow{
		top:auto !important;
		bottom:max(14px, env(safe-area-inset-bottom)) !important;
		width:46px !important;
		height:46px !important;
		transform:none !important;
		font-size:32px !important;
	}

	.p411-gallery-lightbox__arrow--prev{
		left:max(12px, env(safe-area-inset-left)) !important;
	}

	.p411-gallery-lightbox__arrow--next{
		right:max(12px, env(safe-area-inset-right)) !important;
	}

	.p411-gallery-lightbox__counter{
		bottom:max(14px, env(safe-area-inset-bottom)) !important;
	}
}
