/* ——— Homepage & shared story sections ——— */

.luv-sec {
	--luv-red: #b61d1d;
	--luv-red-mid: #9a2424;
	--luv-cream: #eadcd3;
	--luv-cream-2: #f3ebe4;
	--luv-ink: #121212;
	--luv-mute: #7a7470;
	--luv-ease: cubic-bezier(0.22, 1, 0.36, 1);
	position: relative;
	isolation: isolate;
	overflow: hidden;
	color: var(--luv-ink);
}

.luv-sec * {
	box-sizing: border-box;
}

.luv-sec__inner {
	width: min(1120px, calc(100% - 2.5rem));
	margin-inline: auto;
	position: relative;
	z-index: 1;
}

.luv-sec__eyebrow {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 0.72rem;
	font-weight: 500;
	letter-spacing: 0.28em;
	text-transform: uppercase;
	color: var(--luv-red);
	margin: 0 0 1rem;
}

.luv-sec__title {
	font-family: canter, Georgia, serif;
	font-weight: 700;
	font-size: clamp(2.4rem, 5vw, 4.2rem);
	line-height: 1.05;
	letter-spacing: 0.02em;
	margin: 0 0 0.85rem;
	text-wrap: balance;
}

.luv-sec__lead {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 1.05rem;
	line-height: 1.7;
	color: var(--luv-mute);
	max-width: 36rem;
	margin: 0;
}

.luv-sec__cta {
	display: inline-flex;
	align-items: center;
	gap: 0.55rem;
	margin-top: 1.75rem;
	padding: 0.95rem 1.6rem;
	border: 1.5px solid currentColor;
	border-radius: 999px;
	text-decoration: none;
	font-family: canter, Georgia, serif;
	font-size: 1.25rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	color: inherit;
	transition: transform 0.35s var(--luv-ease), background 0.35s var(--luv-ease), color 0.35s var(--luv-ease), box-shadow 0.35s var(--luv-ease);
}

.luv-sec__cta:hover {
	transform: translateY(-2px);
	box-shadow: 0 14px 34px rgba(0, 0, 0, 0.18);
}

/* Ritual */
.luv-ritual {
	padding: clamp(4.5rem, 9vw, 7.5rem) 0;
	background:
		radial-gradient(ellipse 70% 60% at 0% 0%, rgba(182, 29, 29, 0.08), transparent 55%),
		radial-gradient(ellipse 50% 45% at 100% 100%, rgba(80, 40, 30, 0.06), transparent 50%),
		linear-gradient(180deg, var(--luv-cream-2), var(--luv-cream));
}

.luv-ritual__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.25rem;
	margin-top: 3rem;
}

.luv-ritual__card {
	position: relative;
	padding: 2rem 1.6rem 1.8rem;
	background: rgba(255, 255, 255, 0.45);
	border: 1px solid rgba(90, 50, 40, 0.1);
	border-radius: 1.25rem;
	backdrop-filter: blur(8px);
	transition: transform 0.45s var(--luv-ease), box-shadow 0.45s var(--luv-ease);
}

.luv-ritual__card:hover {
	transform: translateY(-6px);
	box-shadow: 0 22px 50px rgba(40, 20, 15, 0.12);
}

.luv-ritual__num {
	font-family: canter, Georgia, serif;
	font-size: 3rem;
	line-height: 1;
	color: var(--luv-red);
	opacity: 0.85;
	margin-bottom: 1rem;
}

.luv-ritual__card h3 {
	font-family: canter, Georgia, serif;
	font-size: 1.85rem;
	margin: 0 0 0.65rem;
	font-weight: 700;
}

.luv-ritual__card p {
	margin: 0;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 0.95rem;
	line-height: 1.65;
	color: var(--luv-mute);
}

/* Moments strip */
.luv-moments {
	padding: clamp(4rem, 8vw, 6.5rem) 0;
	background: var(--luv-ink);
	color: #f2ece8;
}

.luv-moments .luv-sec__eyebrow {
	color: #e8a0a0;
}

.luv-moments .luv-sec__lead {
	color: #bdb4ae;
}

.luv-moments__rail {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1rem;
	margin-top: 2.75rem;
}

.luv-moments__item {
	min-height: 220px;
	padding: 1.6rem;
	border-radius: 1.15rem;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	background:
		linear-gradient(180deg, transparent 20%, rgba(0, 0, 0, 0.72) 100%),
		var(--item-bg, linear-gradient(135deg, #3a1818, #1a1010));
	background-size: cover;
	background-position: center;
	border: 1px solid rgba(255, 255, 255, 0.08);
	transition: transform 0.45s var(--luv-ease);
}

.luv-moments__item:nth-child(1) {
	background-image:
		linear-gradient(180deg, transparent 25%, rgba(0, 0, 0, 0.75)),
		radial-gradient(circle at 30% 20%, #8b2a2a, #1a0f0f 70%);
}

.luv-moments__item:nth-child(2) {
	background-image:
		linear-gradient(180deg, transparent 25%, rgba(0, 0, 0, 0.75)),
		radial-gradient(circle at 70% 30%, #6b3a28, #120e0c 70%);
}

.luv-moments__item:nth-child(3) {
	background-image:
		linear-gradient(180deg, transparent 25%, rgba(0, 0, 0, 0.75)),
		radial-gradient(circle at 40% 40%, #4a2a3a, #0e0c12 70%);
}

.luv-moments__item:nth-child(4) {
	background-image:
		linear-gradient(180deg, transparent 25%, rgba(0, 0, 0, 0.75)),
		radial-gradient(circle at 60% 20%, #7a2222, #140a0a 70%);
}

.luv-moments__item:hover {
	transform: translateY(-5px);
}

.luv-moments__item strong {
	font-family: canter, Georgia, serif;
	font-size: 1.65rem;
	font-weight: 700;
	display: block;
	margin-bottom: 0.35rem;
}

.luv-moments__item span {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 0.88rem;
	line-height: 1.5;
	color: #d5cdc7;
}

/* Love notes */
.luv-notes {
	padding: clamp(4.5rem, 9vw, 7rem) 0;
	background:
		linear-gradient(90deg, rgba(182, 29, 29, 0.05) 1px, transparent 1px) 0 0 / 48px 48px,
		linear-gradient(rgba(182, 29, 29, 0.05) 1px, transparent 1px) 0 0 / 48px 48px,
		var(--luv-cream);
}

.luv-notes__grid {
	display: grid;
	grid-template-columns: 1.1fr 1fr 1fr;
	gap: 1.1rem;
	margin-top: 2.75rem;
	align-items: stretch;
}

.luv-notes__quote {
	padding: 2rem 1.75rem;
	border-radius: 1.2rem;
	background: #fffaf7;
	border: 1px solid rgba(90, 40, 30, 0.1);
	box-shadow: 0 18px 40px rgba(40, 20, 10, 0.06);
}

.luv-notes__quote:first-child {
	background: linear-gradient(160deg, #2a1212, #4a1c1c);
	color: #f4ebe6;
	grid-row: span 1;
	min-height: 100%;
}

.luv-notes__quote p {
	font-family: canter, Georgia, serif;
	font-size: clamp(1.35rem, 2.4vw, 1.85rem);
	line-height: 1.35;
	margin: 0 0 1.25rem;
}

.luv-notes__quote:first-child p {
	font-size: clamp(1.6rem, 3vw, 2.2rem);
}

.luv-notes__quote cite {
	font-family: Helvetica, Arial, sans-serif;
	font-style: normal;
	font-size: 0.8rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	opacity: 0.7;
}

/* Gift CTA */
.luv-gift {
	padding: clamp(4rem, 8vw, 6rem) 0;
	background:
		radial-gradient(ellipse 80% 70% at 85% 50%, rgba(182, 29, 29, 0.35), transparent 55%),
		linear-gradient(115deg, #1a0e0e 0%, #3d1515 48%, #1a0e0e 100%);
	color: #f6efea;
}

.luv-gift .luv-sec__inner {
	display: grid;
	grid-template-columns: 1.2fr 0.8fr;
	gap: 2rem;
	align-items: center;
}

.luv-gift .luv-sec__eyebrow {
	color: #f0b4b4;
}

.luv-gift .luv-sec__lead {
	color: #cfc4bc;
}

.luv-gift .luv-sec__cta {
	background: #f6efea;
	color: #1a0e0e;
	border-color: #f6efea;
}

.luv-gift .luv-sec__cta:hover {
	background: transparent;
	color: #f6efea;
}

.luv-gift__panel {
	padding: 2rem;
	border-radius: 1.4rem;
	border: 1px solid rgba(255, 255, 255, 0.12);
	background: rgba(255, 255, 255, 0.04);
	backdrop-filter: blur(10px);
}

.luv-gift__panel ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 1rem;
}

.luv-gift__panel li {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 0.85rem;
	align-items: start;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 0.95rem;
	line-height: 1.55;
	color: #ddd3cc;
}

.luv-gift__dot {
	width: 0.65rem;
	height: 0.65rem;
	margin-top: 0.4rem;
	border-radius: 50%;
	background: var(--luv-red);
	box-shadow: 0 0 0 4px rgba(182, 29, 29, 0.25);
}

/* Reveal */
.luv-sec .luv-reveal-child {
	opacity: 0;
	transform: translateY(22px);
	transition: opacity 0.8s var(--luv-ease), transform 0.8s var(--luv-ease);
}

.luv-sec.is-in .luv-reveal-child {
	opacity: 1;
	transform: none;
}

.luv-sec.is-in .luv-reveal-child:nth-child(2) { transition-delay: 0.08s; }
.luv-sec.is-in .luv-reveal-child:nth-child(3) { transition-delay: 0.16s; }
.luv-sec.is-in .luv-reveal-child:nth-child(4) { transition-delay: 0.24s; }

@media (max-width: 900px) {
	.luv-ritual__grid,
	.luv-moments__rail,
	.luv-notes__grid,
	.luv-gift .luv-sec__inner {
		grid-template-columns: 1fr;
	}

	.luv-moments__rail {
		grid-template-columns: 1fr 1fr;
	}
}

@media (max-width: 560px) {
	.luv-moments__rail {
		grid-template-columns: 1fr;
	}
}

@media (prefers-reduced-motion: reduce) {
	.luv-sec .luv-reveal-child {
		opacity: 1;
		transform: none;
	}
}
