/* ——— Luxury layer for Luvbox homepage ——— */

body.home.luv-home-active,
body.luv-commerce-active {
	--lh-gold: #c9a27a;
	--lh-gold-soft: #e2c6a6;
	--lh-ink: #0b0909;
	--lh-cream: #efe4da;
	--lh-cream-2: #f7f0ea;
	--lh-red: #c23b3b;
	--lh-red-2: #d44545;
	--lh-red-deep: #8e1717;
	--lh-rose: #e8a0a0;
	background: #0b0909;
}

.lh__wrap {
	width: min(1140px, calc(100% - 3rem));
}

/* Refined header */
.lh-header {
	padding: 1.15rem 0;
	border-bottom: 1px solid transparent;
}

.lh-header.is-solid {
	background: rgba(11, 9, 9, 0.9);
	backdrop-filter: blur(20px) saturate(1.12);
	-webkit-backdrop-filter: blur(20px) saturate(1.12);
	border-bottom-color: rgba(194, 59, 59, 0.4);
	box-shadow: 0 18px 50px rgba(0, 0, 0, 0.45);
}

.lh-logo strong {
	font-size: 1.35rem;
	letter-spacing: 0.22em;
	font-weight: 700;
}

.lh-logo img {
	width: 38px;
	height: 38px;
	filter: drop-shadow(0 6px 16px rgba(158, 28, 28, 0.35));
}

.lh-nav a {
	font-size: 0.7rem;
	letter-spacing: 0.24em;
	opacity: 0.72;
}

.lh-nav a:hover {
	color: var(--lh-rose);
	opacity: 1;
}

.lh-cart {
	background: linear-gradient(145deg, #d44545, #8e1717);
	box-shadow: 0 10px 28px rgba(194, 59, 59, 0.55);
}

/* Cinematic hero — soft dark veil, light red only */
.lh-hero {
	min-height: 100vh;
	min-height: 100dvh;
	padding: 8.5rem 0 5.5rem;
	align-items: end;
	background:
		radial-gradient(ellipse 55% 45% at 70% 30%, rgba(194, 59, 59, 0.12), transparent 60%),
		linear-gradient(180deg, rgba(11, 9, 9, 0.15) 0%, rgba(11, 9, 9, 0.35) 45%, rgba(11, 9, 9, 0.86) 82%, #0b0909 100%),
		var(--lh-hero-img) center / cover no-repeat;
}

.lh-hero__kicker {
	display: inline-flex;
	align-items: center;
	gap: 0.75rem;
	margin: 0 0 1.35rem;
	font-size: 0.68rem;
	letter-spacing: 0.32em;
	text-transform: uppercase;
	color: var(--lh-rose);
	animation: lh-rise 1.1s var(--lh-ease) both;
}

.lh-hero__kicker::before,
.lh-hero__kicker::after {
	content: "";
	width: 2rem;
	height: 1px;
	background: linear-gradient(90deg, transparent, var(--lh-red));
}

.lh-hero__kicker::after {
	background: linear-gradient(90deg, var(--lh-red), transparent);
}

.lh-hero__brand {
	font-size: clamp(5rem, 15vw, 10.5rem);
	letter-spacing: 0.06em;
	margin-bottom: 1.35rem;
	background: linear-gradient(115deg, #f7f0ea 6%, #e8b4b4 28%, #c23b3b 52%, #f0d2c8 78%, #e2c6a6 95%);
	-webkit-background-clip: text;
	background-clip: text;
	filter: drop-shadow(0 20px 40px rgba(0, 0, 0, 0.35));
}

.lh-hero__title {
	font-size: clamp(1.55rem, 2.8vw, 2.15rem);
	font-weight: 400;
	letter-spacing: 0.08em;
	color: #f3ebe4;
	opacity: 0.92;
}

.lh-hero__lead {
	max-width: 26rem;
	font-size: 0.98rem;
	line-height: 1.8;
	color: #c8bdb3;
	letter-spacing: 0.02em;
}

.lh-hero__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.85rem 1.4rem;
	margin: 0 0 1.75rem;
	padding: 0;
	list-style: none;
	animation: lh-rise 1.1s var(--lh-ease) 0.28s both;
}

.lh-hero__meta li {
	font-size: 0.68rem;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: rgba(232, 160, 160, 0.9);
}

.lh-hero__meta li + li {
	padding-left: 1.4rem;
	border-left: 1px solid rgba(194, 59, 59, 0.45);
}

.lh-hero__cta {
	background: linear-gradient(180deg, #f7f0ea, #e8dccf);
	color: #120e0e !important;
	letter-spacing: 0.08em;
	font-size: 1.15rem;
	padding: 1.05rem 1.9rem;
	box-shadow: 0 18px 48px rgba(0, 0, 0, 0.4);
}

.lh-hero__cta:hover {
	background: #fff;
	color: #120e0e !important;
}

.lh-hero__scroll {
	color: var(--lh-rose);
	letter-spacing: 0.36em;
}

/* Shared luxury type */
.lh-eyebrow {
	color: var(--lh-red-2) !important;
	letter-spacing: 0.34em;
	font-size: 0.66rem;
}

.lh-title {
	font-size: clamp(2.6rem, 5.2vw, 4.5rem);
	letter-spacing: 0.03em;
	font-weight: 700;
}

.lh-lead {
	font-size: 1.02rem;
	line-height: 1.85;
	letter-spacing: 0.015em;
}

.lh-sec {
	padding: clamp(5rem, 10vw, 8.5rem) 0;
}

/* Pillars as quiet luxury markers */
.lh-pillars {
	padding: clamp(2.8rem, 5vw, 4rem) 0;
	background:
		radial-gradient(ellipse 60% 80% at 50% 50%, rgba(194, 59, 59, 0.12), transparent 65%),
		#0b0909;
	border-block: 1px solid rgba(194, 59, 59, 0.28);
}

.lh-pillar {
	min-height: 150px;
	border-radius: 0;
	border: 0;
	border-right: 1px solid rgba(194, 59, 59, 0.22);
	background: transparent;
	padding: 1.4rem 1.5rem 1.2rem;
}

.lh-pillar:last-child {
	border-right: 0;
}

.lh-pillar::before {
	display: block;
	height: 2px;
	background: linear-gradient(90deg, transparent, var(--lh-red), transparent);
	opacity: 0.85;
}

.lh-pillar:hover {
	transform: none;
	box-shadow: none;
	border-color: rgba(194, 59, 59, 0.22);
}

.lh-pillar:hover strong {
	color: var(--lh-rose);
}

.lh-pillar__idx {
	color: rgba(194, 59, 59, 0.55);
	font-size: 1.6rem;
	top: 0.85rem;
	right: 1rem;
}

.lh-pillar strong {
	font-size: clamp(1.05rem, 1.6vw, 1.35rem);
	letter-spacing: 0.12em;
	color: #f0d2c8;
	font-weight: 700;
}

/* Intro: quiet salon feel */
.lh-intro {
	background:
		radial-gradient(ellipse 40% 50% at 50% 0%, rgba(201, 162, 122, 0.12), transparent 60%),
		var(--lh-cream-2);
	padding: clamp(4.5rem, 9vw, 7rem) 0;
}

.lh-intro .lh-title {
	max-width: 16ch;
	margin-inline: auto;
	color: #1a1412;
}

/* Collection as boutique gallery */
.lh-collection {
	background:
		radial-gradient(ellipse 45% 35% at 90% 5%, rgba(194, 59, 59, 0.16), transparent 55%),
		#0b0909;
}

.lh-collection .lh-lead {
	color: #b7aea5;
}

.lh-collection__grid {
	gap: 1.5rem;
	margin-top: 3.25rem;
}

.lh-card {
	position: relative;
	border-radius: 1.1rem;
	border: 1px solid rgba(234, 220, 211, 0.12);
	background:
		linear-gradient(165deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.015));
	overflow: hidden;
	box-shadow: 0 18px 40px rgba(0, 0, 0, 0.28);
	backdrop-filter: blur(6px);
}

.lh-card::before {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	padding: 1px;
	background: linear-gradient(160deg, rgba(232, 160, 160, 0.35), transparent 40%, rgba(194, 59, 59, 0.2));
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;
	pointer-events: none;
	opacity: 0.7;
	transition: opacity 0.4s var(--lh-ease);
}

.lh-card:hover {
	border-color: rgba(194, 59, 59, 0.4);
	box-shadow: 0 32px 64px rgba(0, 0, 0, 0.42), 0 0 0 1px rgba(194, 59, 59, 0.15);
	transform: translateY(-10px);
}

.lh-card:hover::before {
	opacity: 1;
}

.lh-card__media {
	aspect-ratio: 4 / 5;
	position: relative;
	margin: 0.7rem 0.7rem 0;
	border-radius: 0.75rem;
	overflow: hidden;
	background: #161111;
}

.lh-card__media::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, transparent 50%, rgba(11, 9, 9, 0.35));
	pointer-events: none;
	opacity: 0.85;
}

.lh-card__media img {
	transition: transform 0.9s var(--lh-ease), filter 0.9s var(--lh-ease);
}

.lh-card:hover .lh-card__media img {
	transform: scale(1.07);
	filter: brightness(1.05) saturate(1.05);
}

.lh-card__body {
	padding: 1.25rem 1.2rem 1.4rem;
	border-top: 0;
	display: grid;
	gap: 0.35rem;
}

.lh-card__body h3 {
	font-size: 1.4rem;
	letter-spacing: 0.04em;
	margin: 0;
	line-height: 1.2;
}

.lh-card__price {
	color: #f0b4b4;
	font-size: 1.4rem;
	letter-spacing: 0.04em;
	margin-top: 0.15rem;
}

.lh-card__hint {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	margin-top: 0.55rem;
	padding: 0.35rem 0;
	font-size: 0.66rem;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: rgba(232, 160, 160, 0.9);
	border-top: 1px solid rgba(194, 59, 59, 0.2);
	padding-top: 0.75rem;
	width: 100%;
	transition: color 0.35s var(--lh-ease), gap 0.35s var(--lh-ease);
}

.lh-card__hint::after {
	content: "→";
	font-size: 0.9rem;
	transition: transform 0.35s var(--lh-ease);
}

.lh-card:hover .lh-card__hint {
	color: #ffd0d0;
	gap: 0.65rem;
}

.lh-card:hover .lh-card__hint::after {
	transform: translateX(3px);
}

/* Story */
.lh-story {
	background:
		radial-gradient(ellipse 50% 40% at 0% 20%, rgba(201, 162, 122, 0.1), transparent 55%),
		var(--lh-cream);
}

.lh-story__visual {
	border-radius: 0.35rem;
	min-height: 480px;
	box-shadow: 0 40px 80px rgba(40, 20, 15, 0.2);
}

.lh-story__btn {
	border-color: #1a1412;
	border-radius: 999px;
	letter-spacing: 0.08em;
	font-size: 1.05rem;
	padding: 0.95rem 1.6rem;
}

/* Ritual */
.lh-ritual {
	background: #0b0909;
}

.lh-ritual .lh-lead {
	color: #b7aea5;
}

.lh-ritual__item {
	border-radius: 0.35rem;
	border-color: rgba(194, 59, 59, 0.22);
	background: linear-gradient(165deg, rgba(194, 59, 59, 0.08), rgba(255, 255, 255, 0.01));
	padding: 2rem 1.6rem;
}

.lh-ritual__item:hover {
	border-color: rgba(212, 69, 69, 0.5);
}

.lh-ritual__num {
	color: var(--lh-red-2);
	font-size: 2.4rem;
}

.lh-ritual__item h3 {
	letter-spacing: 0.04em;
}

/* Moments */
.lh-moments {
	background: var(--lh-cream-2);
}

.lh-moment {
	border-radius: 0.35rem;
	min-height: 300px;
}

.lh-moment strong {
	letter-spacing: 0.06em;
}

/* Quote salon */
.lh-quote {
	background:
		radial-gradient(ellipse 55% 65% at 50% 50%, rgba(194, 59, 59, 0.28), transparent 60%),
		#0b0909;
	padding: clamp(5rem, 10vw, 8rem) 0;
}

.lh-quote blockquote {
	max-width: 16ch;
	background: linear-gradient(120deg, #f7f0ea, #e8b4b4 40%, #c23b3b 70%, #e2c6a6);
	-webkit-background-clip: text;
	background-clip: text;
	letter-spacing: 0.02em;
}

.lh-quote cite {
	letter-spacing: 0.28em;
	color: rgba(232, 160, 160, 0.75);
}

/* CTA */
.lh-cta {
	background:
		radial-gradient(ellipse 55% 85% at 85% 50%, rgba(212, 69, 69, 0.35), transparent 50%),
		linear-gradient(115deg, #6e1414, #c23b3b 48%, #4a0f0f);
	padding: clamp(4.5rem, 9vw, 6.5rem) 0;
}

.lh-cta .lh-eyebrow {
	color: #f0c0c0 !important;
}

.lh-cta__btn {
	background: linear-gradient(180deg, #f7f0ea, #e8dccf);
	color: #120e0e !important;
	letter-spacing: 0.08em;
	font-size: 1.15rem;
}

.lh-cta__btn:hover {
	background: #fff;
	color: #120e0e !important;
}

/* Footer luxury */
.lh-footer {
	background:
		radial-gradient(ellipse 50% 40% at 10% 0%, rgba(194, 59, 59, 0.32), transparent 55%),
		#080707;
}

.lh-footer::after {
	color: rgba(194, 59, 59, 0.06);
}

.lh-footer__brand p {
	color: #b7aea5;
}

.lh-footer a:hover {
	color: var(--lh-rose);
}

.lh-footer__bar {
	border-top-color: rgba(194, 59, 59, 0.25);
	color: rgba(232, 160, 160, 0.55);
	letter-spacing: 0.2em;
}

.lh-cart-drawer {
	border-color: rgba(194, 59, 59, 0.3);
	background: rgba(11, 9, 9, 0.98);
}

.lh-cart-drawer__cta {
	background: linear-gradient(180deg, #f7f0ea, #e8dccf);
	color: #120e0e !important;
}

/* Intro cream with soft red wash */
.lh-intro {
	background:
		radial-gradient(ellipse 45% 55% at 50% 0%, rgba(194, 59, 59, 0.14), transparent 60%),
		var(--lh-cream-2);
}

.lh-story {
	background:
		radial-gradient(ellipse 50% 40% at 0% 20%, rgba(194, 59, 59, 0.1), transparent 55%),
		var(--lh-cream);
}

@media (max-width: 960px) {
	.lh-pillar {
		border-right: 0;
		border-bottom: 1px solid rgba(194, 59, 59, 0.22);
	}

	.lh-hero__meta li + li {
		padding-left: 0;
		border-left: 0;
	}
}
