/* LDR_Hero — full-viewport homepage hero */

.ldr-hero {
	position: relative;
	min-height: 100vh;
	display: flex;
	align-items: center;
	overflow: hidden;
	color: #fff;
	isolation: isolate;
}

.ldr-hero__bg { position: absolute; inset: 0; z-index: 0; }
.ldr-hero img.ldr-hero__bg-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	max-width: none;
}

.ldr-hero__overlay { position: absolute; inset: 0; }
.ldr-hero__overlay--horizontal {
	background: linear-gradient(to right,
		oklch(0.25 0.06 250 / 0.8),
		oklch(0.25 0.06 250 / 0.5) 50%,
		transparent
	);
}
.ldr-hero__overlay--vertical {
	background: linear-gradient(to top,
		oklch(0.25 0.06 250 / 0.6),
		transparent 50%,
		oklch(0.25 0.06 250 / 0.2)
	);
}

.ldr-hero__inner {
	position: relative;
	z-index: 1;
	padding-top: 96px;        /* pt-24 */
	padding-bottom: 64px;     /* pb-16 */
}

.ldr-hero__content {
	max-width: 56rem;         /* max-w-4xl — wider title/description column */
	display: flex;
	flex-direction: column;
	gap: 24px;                /* space-y-6 */
}

.ldr-hero__pill {
	align-self: flex-start;
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	background: oklch(0.72 0.14 75 / 0.20);
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);
	border: 1px solid oklch(0.72 0.14 75 / 0.30);
	border-radius: var(--ldr-radius-pill);
	padding: 0.5rem 1rem;
	color: var(--ldr-gold);
	font-family: var(--ldr-font-heading);
	font-weight: 600;
	font-size: 0.875rem;
}
.ldr-hero__pill svg { color: var(--ldr-gold); }

.ldr-hero__heading {
	font-family: var(--ldr-font-heading);
	font-weight: 900;
	font-size: 2.25rem;       /* text-4xl 36px */
	line-height: 1.1;
	color: #fff;
	margin: 0;
	letter-spacing: -0.01em;
}
.ldr-hero__heading-gold {
	color: var(--ldr-gold);
	display: inline;          /* keep gold "Lake Day" inline with "Starts Here" so the H1 is 2 lines instead of 3 */
}
/* one short space between "Lake Day" and "Starts Here" — esc_html keeps PHP whitespace, but ensure no leftover spaces collapse oddly */
.ldr-hero__heading-gold + br { display: none; }
@media (min-width: 640px) { .ldr-hero__heading { font-size: 3rem;   } }   /* sm:text-5xl 48 */
@media (min-width: 1024px) { .ldr-hero__heading { font-size: 4.5rem; } }  /* lg:text-7xl 72 */

.ldr-hero__intro {
	font-size: 1.125rem;      /* text-lg 18 */
	line-height: 1.625;
	color: rgb(255 255 255 / 0.8);
	max-width: 44rem;         /* widened from max-w-lg → ~700px */
	margin: 0;
}
@media (min-width: 640px) { .ldr-hero__intro { font-size: 1.25rem; } } /* sm:text-xl */

.ldr-hero__ctas {
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding-top: 8px;
}
@media (min-width: 640px) { .ldr-hero__ctas { flex-direction: row; } }

.ldr-hero__cta-primary,
.ldr-hero__cta-secondary {
	padding: 1.25rem 2rem;    /* py-6 px-8 */
	font-size: 1rem;          /* text-base */
}

.ldr-hero__wave {
	position: absolute;
	left: 0;
	right: 0;
	bottom: -1px;        /* drop 1px to cover any sub-pixel seam from preserveAspectRatio="none" SVG anti-aliasing */
	z-index: 2;          /* float above any container border on the next section */
	line-height: 0;
}
.ldr-hero__wave svg {
	width: 100%;
	height: auto;
	display: block;
	margin-bottom: -1px; /* belt-and-braces: collapse any inline-block baseline gap */
}

/* Remove any 1px hairline that Elementor's container CSS might paint between
   the hero container and the next one. */
.ldr-hero + *,
.elementor-widget-ldr_hero + * { border-top: 0 !important; }

/* Entry animations — match production's framer-motion fade-up cascade. */
@keyframes ldr-hero-fade-up {
	from { opacity: 0; transform: translateY(20px); }
	to   { opacity: 1; transform: translateY(0); }
}
.ldr-hero__pill,
.ldr-hero__heading,
.ldr-hero__intro,
.ldr-hero__ctas {
	animation: ldr-hero-fade-up 0.7s var(--ldr-ease) both;
}
.ldr-hero__pill    { animation-delay: 0ms; }
.ldr-hero__heading { animation-delay: 100ms; animation-duration: 0.8s; }
.ldr-hero__intro   { animation-delay: 300ms; }
.ldr-hero__ctas    { animation-delay: 500ms; }

@media ( prefers-reduced-motion: reduce ) {
	.ldr-hero__pill,
	.ldr-hero__heading,
	.ldr-hero__intro,
	.ldr-hero__ctas { animation: none; }
}
