/**
 * Let's Boat typography system
 *
 * Applies design tokens to base type + long-form / CMS prose so headings,
 * body copy, and spacing stay consistent across blocks and legal pages.
 */

/* ——— Base ——— */
body {
	font-family: var(--lb-font-sans);
	font-size: var(--lb-text-body);
	font-weight: var(--lb-fw-regular);
	line-height: var(--lb-lh-body);
	letter-spacing: var(--lb-tracking);
	color: var(--lb-deep);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* Hero brand — only place that uses display scale */
.hero__headline {
	font-family: var(--lb-font-display);
	font-size: var(--lb-text-display);
	font-weight: var(--lb-fw-medium);
	line-height: var(--lb-lh-display);
	letter-spacing: -0.01em;
}

.hero__headline.small-title {
	font-size: var(--lb-text-display-sm);
}

@media only screen and (max-width: 767px) {
	.hero__headline.small-title {
		font-size: var(--lb-text-display-sm-mobile);
		line-height: 1;
	}
}

/*
 * Section titles — one size sitewide
 * (FAQ, about, accordion, memberships header, boat slider, cover CTA, columns…)
 */
.cover__headline,
.faq-section__headline,
.boat-section__headline,
.membership-card__big-title,
.boat-slider-card__big-title,
.logo-slider-title,
.columns__title,
.logo-grid-title,
.image-accordion-section .title,
.two-columns__title {
	font-family: var(--lb-font-display);
	font-size: var(--lb-text-h1);
	font-weight: var(--lb-fw-regular);
	line-height: var(--lb-lh-heading);
	letter-spacing: 0.01em;
}

.cover__headline {
	font-weight: var(--lb-fw-medium);
	line-height: var(--lb-lh-display);
	letter-spacing: -0.01em;
}

.cover__headline.small-title {
	font-size: var(--lb-text-display-sm);
}

@media only screen and (max-width: 767px) {
	.cover__headline.small-title {
		font-size: var(--lb-text-display-sm-mobile);
		line-height: 1;
	}
}

/* Script accents under section titles */
.hero__subheadline,
.cover__subtext--alt,
.membership-card__subtitle,
.boat-slider-card__subtitle,
.image-accordion-section .subtitle {
	font-family: var(--lb-font-script);
	font-size: var(--lb-text-script);
	font-weight: var(--lb-fw-regular);
	line-height: var(--lb-lh-normal);
}

/* Card / item titles (boats, membership packs) */
.boat-title,
.membership-card__name {
	font-family: var(--lb-font-sans);
	font-size: var(--lb-text-h2);
	font-weight: var(--lb-fw-medium);
	line-height: var(--lb-lh-heading);
	letter-spacing: var(--lb-tracking-wide);
	text-transform: uppercase;
}

/* ——— Long-form prose (CMS HTML in columns, default content, legal) ——— */
.lb-prose,
.columns__text,
.default-content,
.two-columns__content {
	font-family: var(--lb-font-sans);
	font-size: var(--lb-text-body);
	font-weight: var(--lb-fw-regular);
	line-height: var(--lb-lh-body);
	letter-spacing: var(--lb-tracking);
	color: var(--lb-slate);
}

/* Readable measure for full-width legal / prose columns */
.columns__column--full .columns__text,
.default-content {
	max-width: var(--lb-prose-max);
	white-space: normal;
}

.lb-prose h1,
.columns__text h1,
.default-content h1 {
	font-family: var(--lb-font-display);
	font-size: var(--lb-text-h1);
	font-weight: var(--lb-fw-regular);
	line-height: var(--lb-lh-heading);
	letter-spacing: -0.01em;
	color: var(--lb-deep);
	margin: 0 0 var(--lb-space-5);
}

.lb-prose h2,
.columns__text h2,
.default-content h2 {
	font-family: var(--lb-font-display);
	font-size: var(--lb-text-h2);
	font-weight: var(--lb-fw-regular);
	line-height: var(--lb-lh-heading);
	color: var(--lb-deep);
	margin: var(--lb-prose-heading-top) 0 var(--lb-space-3);
}

.lb-prose h3,
.columns__text h3,
.default-content h3,
.two-columns__content h3 {
	font-family: var(--lb-font-display);
	font-size: var(--lb-text-h3);
	font-weight: var(--lb-fw-regular);
	line-height: var(--lb-lh-heading);
	color: var(--lb-deep);
	margin: var(--lb-prose-heading-top) 0 var(--lb-space-3);
}

.lb-prose h2:first-child,
.lb-prose h3:first-child,
.columns__text h2:first-child,
.columns__text h3:first-child,
.default-content h2:first-child,
.default-content h3:first-child,
.two-columns__content h3:first-child {
	margin-top: 0;
}

.lb-prose h4,
.columns__text h4,
.default-content h4 {
	font-family: var(--lb-font-sans);
	font-size: var(--lb-text-lead);
	font-weight: var(--lb-fw-medium);
	line-height: var(--lb-lh-heading);
	color: var(--lb-deep);
	margin: var(--lb-space-6) 0 var(--lb-space-2);
}

.lb-prose p,
.columns__text p,
.default-content p,
.two-columns__content p {
	margin: 0 0 var(--lb-prose-gap);
}

.lb-prose p:last-child,
.columns__text p:last-child,
.default-content p:last-child,
.two-columns__content p:last-child {
	margin-bottom: 0;
}

.lb-prose ul,
.lb-prose ol,
.columns__text ul,
.columns__text ol,
.default-content ul,
.default-content ol {
	margin: 0 0 var(--lb-prose-gap);
	padding-left: 1.25em;
	line-height: var(--lb-lh-body);
}

.lb-prose li,
.columns__text li,
.default-content li {
	margin-bottom: var(--lb-space-2);
}

.lb-prose li:last-child,
.columns__text li:last-child,
.default-content li:last-child {
	margin-bottom: 0;
}

.lb-prose a,
.columns__text a,
.default-content a {
	color: var(--lb-accent);
	text-decoration: none;
	transition: color var(--lb-duration) var(--lb-ease);
}

.lb-prose a:hover,
.columns__text a:hover,
.default-content a:hover {
	text-decoration: underline;
	color: var(--lb-deep);
}

.lb-prose strong,
.columns__text strong,
.default-content strong {
	font-weight: var(--lb-fw-medium);
	color: var(--lb-deep);
}

/* ——— Compact page heroes (legal / simple pages) ——— */
.letsboat-legal-page .cover.full-height,
.letsboat-legal-page .hero.full-height {
	height: var(--lb-hero-compact);
	min-height: var(--lb-hero-compact);
}

.letsboat-legal-page .cover.full-height .cover__overlay,
.letsboat-legal-page .hero.full-height .hero__overlay {
	min-height: 100%;
	height: 100%;
}

.letsboat-legal-page .cover.full-height .cover__container,
.letsboat-legal-page .hero.full-height .hero__container {
	min-height: unset;
	justify-content: flex-end;
	padding-top: calc(95px + var(--lb-space-6));
	padding-bottom: var(--lb-space-10);
}

.letsboat-legal-page .cover.full-height .cover__headline,
.letsboat-legal-page .hero.full-height .hero__headline {
	font-size: var(--lb-text-h1);
	max-width: 40rem;
}

@media (max-width: 992px) {
	.letsboat-legal-page .cover.full-height,
	.letsboat-legal-page .hero.full-height {
		height: var(--lb-hero-compact-sm);
		min-height: var(--lb-hero-compact-sm);
	}

	.letsboat-legal-page .cover.full-height .cover__container,
	.letsboat-legal-page .hero.full-height .hero__container {
		padding-top: calc(85px + var(--lb-space-5));
		padding-bottom: var(--lb-space-8);
		min-height: unset;
	}
}

.letsboat-legal-page .cover + .columns,
.letsboat-legal-page .hero + .columns {
	margin-top: var(--lb-space-12) !important;
	margin-bottom: var(--lb-space-16) !important;
}

@media (max-width: 992px) {
	.letsboat-legal-page .cover + .columns,
	.letsboat-legal-page .hero + .columns {
		margin-top: var(--lb-space-8) !important;
		margin-bottom: var(--lb-space-12) !important;
	}
}

/* Legal body: slightly more open measure + breathing room */
.letsboat-legal-page .columns__column--full .columns__text {
	max-width: var(--lb-prose-max);
}

.letsboat-legal-page .columns__text h3 {
	margin-top: var(--lb-space-10);
	margin-bottom: var(--lb-space-3);
}

.letsboat-legal-page .columns__text h3:first-child {
	margin-top: 0;
}

.letsboat-legal-page .columns__text p {
	margin-bottom: var(--lb-space-5);
}