/* MV Hero v2 — dark cinematic hero with slide stack, watermark, arrows and progress indicators. */

.mv-hv2 {
	--mv-bg:      #0a0a0a;
	--mv-accent:  #c9a96e;
	--mv-light:   #e8e4df;
	--mv-overlay: rgba(0,0,0,.82);
	--mv-arrow-bg: rgba(0,0,0,.4);

	--mv-max-w: 1500px;
	--mv-pad-y: 60px;
	--mv-pad-x: 80px;

	position: relative;
	background: var(--mv-bg);
	color: var(--mv-light);
	font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, sans-serif;
	overflow: hidden;
}

.mv-hv2 * { box-sizing: border-box; }

.mv-hv2__section {
	position: relative;
	display: flex; flex-direction: column;
	min-height: 100vh;               /* full viewport height for proper spacing */
	background: var(--mv-bg);
	overflow: hidden;
}
/* Slides are stacked in a single CSS-grid cell so the stack AUTO-SIZES to
   the tallest slide's content — no fixed height, so CTAs are never clipped
   on short laptops. All slides overlap for the crossfade. */
.mv-hv2__stack { 
	position: relative; 
	flex: 1 1 auto; 
	display: grid; 
	min-height: 0; 
	overflow: hidden;
}

/* Slides */
.mv-hv2__slide {
	grid-area: 1 / 1;                /* every slide occupies the same cell */
	position: relative;
	opacity: 0;
	transition: opacity 1.2s cubic-bezier(.22,1,.36,1);
	pointer-events: none;
	overflow: hidden;
}
.mv-hv2__slide.is-active { opacity: 1; pointer-events: auto; }
.mv-hv2__bg {
	position: absolute; inset: 0;
	background-size: cover; background-position: center; background-repeat: no-repeat;
	z-index: 0;
}
.mv-hv2__slide.is-active .mv-hv2__bg { animation: mvSlowZoom 7s ease-out both; }
.mv-hv2__scrim { position: absolute; inset: 0; background: var(--mv-overlay); z-index: 1; }

/* Watermark letters — fluid default size (Typography group / size control override) */
.mv-hv2__mark {
	position: absolute; top: 50%; right: -100px;
	transform: translateY(-50%);
	font-family: 'Cormorant Garamond', serif;
	font-weight: 700;
	font-size: clamp(220px, 42vw, 640px);
	line-height: .85;
	pointer-events: none; user-select: none;
	letter-spacing: -.05em;
	max-width: 100%;
}

/* Slide inner — content is anchored to the TOP (flex-start) with a safe
   header gap, so the kicker ribbon is always fully below a fixed site
   header. It only re-centers on tall viewports where there's clearly room. */
.mv-hv2 { --mv-safe-top: 140px; }
.mv-hv2__inner {
	position: relative; z-index: 2;
	min-height: 100%;
	width: 100%;
	display: flex; align-items: flex-start;
	padding: var(--mv-safe-top) var(--mv-pad-x) 80px;
	max-width: var(--mv-max-w);
	margin: 0 auto;
	box-sizing: border-box;
}
/* Only vertically centre when the viewport is tall enough that centring
   can't push the kicker up under the header or clip the CTAs. */
@media (min-height: 900px) {
	.mv-hv2__inner { align-items: center; padding-top: max(80px, var(--mv-safe-top)); }
}
.mv-hv2__body { max-width: 920px; }

/* Kicker */
.mv-hv2__kicker {
	display: inline-flex; align-items: center; gap: 20px;
	padding: 12px 28px;
	background: rgba(201,169,110,.12);
	border: 1px solid rgba(201,169,110,.35);
	margin-bottom: 32px;
	max-width: 100%;
}
.mv-hv2__kicker-dot {
	width: 8px; height: 8px; border-radius: 50%;
	background: var(--mv-accent);
	flex-shrink: 0;
}
.mv-hv2__kicker-text {
	color: var(--mv-accent);
	font-weight: 700;
	font-size: clamp(11px, 1.15vw, 15px);
	letter-spacing: clamp(2px, .4vw, 5px);
	text-transform: uppercase;
	line-height: 1.3;
	overflow-wrap: anywhere;
}

/* Headline / subhead / desc — fluid default sizes; Typography controls override */
.mv-hv2__headline {
	font-family: 'Cormorant Garamond', serif;
	font-weight: 600;
	font-size: clamp(38px, 5.4vw, 68px);
	line-height: 1;
	margin: 0 0 20px;
	color: #fff;
	letter-spacing: -.015em;
	overflow-wrap: break-word;
}
.mv-hv2__headline .mv-hv2__hl-accent {
	font-style: italic;
	color: var(--mv-accent);
}
.mv-hv2__subhead {
	font-family: 'Cormorant Garamond', serif;
	font-weight: 400; font-style: italic;
	font-size: clamp(18px, 2.2vw, 26px);
	color: rgba(232,228,223,.85);
	margin: 0 0 32px;
	letter-spacing: .02em;
	overflow-wrap: break-word;
}
.mv-hv2__desc {
	font-size: clamp(15px, 1.5vw, 17px);
	line-height: 1.7;
	color: rgba(232,228,223,.72);
	max-width: 680px;
	margin: 0 0 42px;
	font-weight: 300;
	overflow-wrap: break-word;
}

/* CTAs */
.mv-hv2__ctas { display: flex; gap: 20px; flex-wrap: wrap; }
.mv-hv2__cta {
	display: inline-flex; align-items: center; justify-content: center; gap: 12px;
	padding: 20px 44px;
	font-weight: 700;
	font-size: clamp(11px, 1vw, 13px);
	letter-spacing: clamp(1.5px, .25vw, 2.5px);
	text-transform: uppercase;
	text-decoration: none;
	transition: all .4s ease;
	line-height: 1;
	border: 2px solid transparent;
	cursor: pointer;
	max-width: 100%;
}
.mv-hv2__cta--solid {
	background: var(--mv-accent);
	color: #000;
	border-color: var(--mv-accent);
}
.mv-hv2__cta--solid:hover {
	background: #fff; color: #000;
	transform: translateY(-2px);
	box-shadow: 0 14px 36px rgba(201,169,110,.35);
}
.mv-hv2__cta--ghost {
	background: transparent;
	color: var(--mv-accent);
	border-color: rgba(201,169,110,.5);
}
.mv-hv2__cta--ghost:hover {
	border-color: var(--mv-accent);
	background: rgba(201,169,110,.1);
}
.mv-hv2__cta svg { flex-shrink: 0; }

/* Slide entrance animations */
.mv-hv2__slide.is-active .mv-hv2__kicker   { animation: mvFadeUp 1s   ease-out .3s both; }
.mv-hv2__slide.is-active .mv-hv2__headline { animation: mvFadeUp 1.1s ease-out .5s both; }
.mv-hv2__slide.is-active .mv-hv2__subhead  { animation: mvFadeUp 1.1s ease-out .7s both; }
.mv-hv2__slide.is-active .mv-hv2__desc     { animation: mvFadeUp 1.1s ease-out .9s both; }
.mv-hv2__slide.is-active .mv-hv2__ctas     { animation: mvFadeUp 1.1s ease-out 1.1s both; }

@keyframes mvFadeUp   { from { opacity: 0; transform: translateY(30px);} to { opacity: 1; transform: none;} }
@keyframes mvSlowZoom { 0% { transform: scale(1.12);} 100% { transform: scale(1);} }

/* Arrows */
.mv-hv2__nav {
	position: absolute; top: 50%;
	transform: translateY(-50%);
	z-index: 20;
	width: 56px; height: 56px;
	background: var(--mv-arrow-bg);
	border: 1px solid rgba(201,169,110,.4);
	color: var(--mv-accent);
	cursor: pointer;
	display: flex; align-items: center; justify-content: center;
	backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
	transition: background .3s ease, color .3s ease, border-color .3s ease;
	padding: 0;
}
.mv-hv2__nav:hover {
	background: var(--mv-accent);
	color: #000;
	border-color: var(--mv-accent);
}
.mv-hv2__nav--prev { left: 40px; }
.mv-hv2__nav--next { right: 40px; }
.mv-hv2__nav svg { display: block; }

/* Bottom bar - always visible at bottom */
.mv-hv2__bar {
	position: relative;
	z-index: 15;
	background: #000;
	border-top: 1px solid rgba(201,169,110,.2);
	flex-shrink: 0;
}
.mv-hv2__stats {
	display: flex; justify-content: center; align-items: center;
	gap: 48px;
	padding: 20px 80px 16px;
	flex-wrap: wrap;
}
.mv-hv2__stat { display: flex; align-items: center; gap: 20px; }
.mv-hv2__stat-num {
	font-family: 'Cormorant Garamond', serif;
	font-weight: 600;
	font-size: clamp(24px, 3vw, 32px);
	color: var(--mv-accent);
	line-height: 1;
}
.mv-hv2__stat-lbl {
	font-size: clamp(9px, 1vw, 11px);
	letter-spacing: clamp(1.5px, .3vw, 2.5px);
	text-transform: uppercase;
	color: rgba(232,228,223,.8);
	font-weight: 600;
	line-height: 1.4;
}
.mv-hv2__stat-div {
	width: 1px; height: 40px;
	background: rgba(201,169,110,.3);
}
.mv-hv2__dots {
	display: flex; align-items: center; justify-content: center;
	gap: 14px;
	padding: 0 0 18px;
}
.mv-hv2__dot {
	height: 2px; width: 44px;
	background: rgba(201,169,110,.2);
	border: none; padding: 0;
	cursor: pointer;
	position: relative;
	overflow: hidden;
}
.mv-hv2__dot-fill {
	position: absolute; inset: 0;
	background: var(--mv-accent);
	transform-origin: left;
	width: 0%;
}

/* Responsive */
@media (max-width: 1024px) {
	.mv-hv2 { --mv-pad-x: 48px; --mv-pad-y: 50px; --mv-safe-top: 110px; }
	.mv-hv2__inner { padding-bottom: 60px; }
	.mv-hv2__nav--prev { left: 20px; }
	.mv-hv2__nav--next { right: 20px; }
	.mv-hv2__nav { width: 48px; height: 48px; }
	.mv-hv2__mark { right: -60px; }
}
@media (max-width: 768px) {
	.mv-hv2 { --mv-pad-x: 32px; --mv-pad-y: 40px; --mv-safe-top: 100px; }
	.mv-hv2__inner { padding-bottom: 50px; }
	.mv-hv2__section { min-height: 100vh; }
	.mv-hv2__nav { display: none; }
	.mv-hv2__stats { gap: 32px; padding: 18px 32px 14px; }
	.mv-hv2__stat { gap: 14px; }
	.mv-hv2__stat-div { display: none; }
	.mv-hv2__ctas { gap: 16px; }
	.mv-hv2__body { max-width: 100%; }
	.mv-hv2__mark { right: -40px; }
	.mv-hv2__dots { padding-bottom: 16px; }
}
@media (max-width: 480px) {
	.mv-hv2 { --mv-pad-x: 24px; --mv-pad-y: 36px; --mv-safe-top: 90px; }
	.mv-hv2__inner { padding-bottom: 40px; }
	.mv-hv2__section { min-height: 100vh; }
	.mv-hv2__dot { width: 32px; }
	.mv-hv2__ctas { flex-direction: column; align-items: stretch; gap: 12px; }
	.mv-hv2__cta { width: 100%; }
	.mv-hv2__mark { display: none; }
	.mv-hv2__stat-lbl br { display: none; }
	.mv-hv2__stat-lbl { line-height: 1.3; }
	.mv-hv2__stats { gap: 24px; padding: 16px 24px 12px; }
	.mv-hv2__dots { padding-bottom: 14px; }
}

/* Tablet / mobile — header is usually shorter (nav collapses to a burger),
   so the safe gap can shrink, keeping the ribbon visible without wasting
   space. Content stays anchored to the top. */
@media (max-width: 900px) {
	.mv-hv2 { --mv-safe-top: 100px; }
	.mv-hv2__inner { align-items: flex-start !important; }
}
@media (max-width: 480px) {
	.mv-hv2 { --mv-safe-top: 90px; --mv-pad-y: 36px; }
	.mv-hv2__kicker { padding: 10px 20px; gap: 12px; margin-bottom: 24px; }
	.mv-hv2__kicker-text { font-size: 10px; letter-spacing: 1.5px; }
	.mv-hv2__headline { margin-bottom: 16px; }
	.mv-hv2__subhead { margin-bottom: 24px; }
	.mv-hv2__desc { margin-bottom: 32px; }
}

/* Short / landscape viewports — tighten vertical rhythm for short screens */
@media (max-height: 700px) {
	.mv-hv2 { --mv-safe-top: 80px; --mv-pad-y: 40px; }
	.mv-hv2__inner { align-items: flex-start; padding-bottom: 40px; }
	.mv-hv2__kicker { margin-bottom: 16px; }
	.mv-hv2__subhead { margin-bottom: 20px; }
	.mv-hv2__desc { margin-bottom: 28px; }
	.mv-hv2__headline { margin-bottom: 14px; }
	.mv-hv2__stats { padding: 16px 60px 12px; }
	.mv-hv2__dots { padding-bottom: 14px; }
}

/* Respect reduced-motion */
@media (prefers-reduced-motion: reduce) {
	.mv-hv2__slide, .mv-hv2__bg,
	.mv-hv2__slide.is-active .mv-hv2__kicker,
	.mv-hv2__slide.is-active .mv-hv2__headline,
	.mv-hv2__slide.is-active .mv-hv2__subhead,
	.mv-hv2__slide.is-active .mv-hv2__desc,
	.mv-hv2__slide.is-active .mv-hv2__ctas {
		animation: none !important;
	}
}