/**
 * Legendary About — Tailwind CSS v3–accurate port of legendary_about_ui_concept.jsx
 * (neutral palette, type scale, radii, spacing). Global site header/footer are outside this canvas.
 */

:root {
	/*
	 * Tailwind CSS v3 default palette (legendary_about_ui_concept.jsx).
	 * neutral-950 #0a0a0a · neutral-900 #171717 · neutral-500 #737373 · neutral-400 #a3a3a3 · neutral-300 #d4d4d4
	 */
	--lau-n950: #0a0a0a;
	--lau-n900: #171717;
	--lau-n500: #737373;
	--lau-n400: #a3a3a3;
	--lau-n300: #d4d4d4;
	--lau-white-10: rgb(255 255 255 / 0.1);
	--lau-white-7: rgb(255 255 255 / 0.07);
	--lau-white-5: rgb(255 255 255 / 0.05);
	--lau-white-3: rgb(255 255 255 / 0.03);
	--lau-white-2: rgb(255 255 255 / 0.02);
	--lau-n900-70: rgb(23 23 23 / 0.7);
	--lau-max-7xl: 80rem;
	--lau-max-4xl: 56rem;
	--lau-max-3xl: 48rem;
	--lau-max-2xl: 42rem;
	--lau-r2xl: 1rem;
	--lau-r15: 1.5rem;
	--lau-r2: 2rem;
	--lau-r225: 2.25rem;
	/* Tailwind default fontFamily.sans — same string as legendary-contact.css / JSX preset */
	--lau-font-sans: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
		"Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji",
		"Segoe UI Symbol", "Noto Color Emoji";
}

body.legendary-about-page {
	background-color: var(--lau-n950) !important;
	color: #fff !important;
	font-family: var(--lau-font-sans) !important;
	font-size: 1rem !important;
	line-height: 1.5 !important;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

body.legendary-about-page #wrapper,
body.legendary-about-page #inner-wrap,
body.legendary-about-page .site,
body.legendary-about-page .content-bg {
	background-color: var(--lau-n950) !important;
}

body.legendary-about-page .entry-hero,
body.legendary-about-page .kadence-entry-hero,
body.legendary-about-page .entry-header,
body.legendary-about-page .kadence-breadcrumbs,
body.legendary-about-page .kadence-breadcrumbs-container,
body.legendary-about-page .page-title,
body.legendary-about-page h1.entry-title,
body.legendary-about-page .hero-section {
	display: none !important;
}

body.legendary-about-page .site-main,
body.legendary-about-page .entry-content,
body.legendary-about-page .entry-content-wrap {
	color: #fff !important;
	font-family: var(--lau-font-sans) !important;
	font-size: 1rem !important;
	line-height: 1.5 !important;
	padding-top: 0 !important;
}

.legendary-about-canvas {
	box-sizing: border-box;
	min-height: 100vh;
	background-color: var(--lau-n950);
	color: #fff;
	font-family: var(--lau-font-sans);
	font-size: 1rem;
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.legendary-about-canvas *,
.legendary-about-canvas *::before,
.legendary-about-canvas *::after {
	box-sizing: border-box;
}

.legendary-about-canvas h1,
.legendary-about-canvas h2,
.legendary-about-canvas h3 {
	margin: 0;
}

.legendary-about-canvas p {
	margin: 0;
}

/*
 * Lock JSX colors + Inter/system sans: parent theme (Kadence) often sets heading/link colors.
 * legendary_about_ui_concept: min-h-screen bg-neutral-950 text-white + text-neutral-* on children.
 */
body.legendary-about-page .legendary-about-canvas,
body.legendary-about-page .legendary-about-canvas .lau-btn,
body.legendary-about-page .legendary-about-canvas .lau-input,
body.legendary-about-page .legendary-about-canvas .lau-textarea {
	font-family: var(--lau-font-sans) !important;
}

body.legendary-about-page .legendary-about-canvas .lau-h1,
body.legendary-about-page .legendary-about-canvas .lau-h2,
body.legendary-about-page .legendary-about-canvas .lau-faq-q,
body.legendary-about-page .legendary-about-canvas .lau-stat-value,
body.legendary-about-page .legendary-about-canvas .lau-value-title {
	color: #ffffff !important;
}

body.legendary-about-page .legendary-about-canvas .lau-pill {
	color: var(--lau-n300) !important;
	font-size: 0.75rem !important;
	line-height: 1rem !important;
	letter-spacing: 0.25em !important;
	text-transform: uppercase !important;
}

body.legendary-about-page .legendary-about-canvas .lau-lead,
body.legendary-about-page .legendary-about-canvas .lau-prose--who,
body.legendary-about-page .legendary-about-canvas .lau-prose--seo,
body.legendary-about-page .legendary-about-canvas .lau-prose--primary,
body.legendary-about-page .legendary-about-canvas .lau-seo-body,
body.legendary-about-page .legendary-about-canvas .lau-benefit,
body.legendary-about-page .legendary-about-canvas .lau-final-lead {
	color: var(--lau-n300) !important;
}

body.legendary-about-page .legendary-about-canvas .lau-kicker {
	color: var(--lau-n400) !important;
	letter-spacing: 0.24em !important;
	text-transform: uppercase !important;
}

body.legendary-about-page .legendary-about-canvas .lau-kicker--seo {
	color: var(--lau-n500) !important;
	letter-spacing: 0.2em !important;
	text-transform: uppercase !important;
}

body.legendary-about-page .legendary-about-canvas .lau-stat-label,
body.legendary-about-page .legendary-about-canvas .lau-value-desc,
body.legendary-about-page .legendary-about-canvas .lau-faq-a {
	color: var(--lau-n400) !important;
}

body.legendary-about-page .legendary-about-canvas .lau-btn--primary {
	background-color: #ffffff !important;
	color: var(--lau-n950) !important;
	border-color: #ffffff !important;
	font-weight: 500 !important;
}

body.legendary-about-page .legendary-about-canvas .lau-btn--outline {
	color: #ffffff !important;
	background-color: transparent !important;
	border-color: var(--lau-white-10) !important;
	font-weight: 400 !important;
}

body.legendary-about-page .legendary-about-canvas .lau-input,
body.legendary-about-page .legendary-about-canvas .lau-textarea {
	background-color: var(--lau-n900) !important;
	color: #ffffff !important;
	border-color: var(--lau-white-10) !important;
}

body.legendary-about-page .legendary-about-canvas .lau-input::placeholder,
body.legendary-about-page .legendary-about-canvas .lau-textarea::placeholder {
	color: var(--lau-n400) !important;
	opacity: 1 !important;
}

/* text-4xl / sm:text-5xl / lg:text-6xl + font-semibold + leading-tight */
body.legendary-about-page .legendary-about-canvas .lau-h1 {
	font-size: 2.25rem !important;
	line-height: 1.25 !important;
	font-weight: 600 !important;
}

@media (min-width: 640px) {
	body.legendary-about-page .legendary-about-canvas .lau-h1 {
		font-size: 3rem !important;
	}
}

@media (min-width: 1024px) {
	body.legendary-about-page .legendary-about-canvas .lau-h1 {
		font-size: 3.75rem !important;
	}
}

/* text-base leading-8 sm:text-lg */
body.legendary-about-page .legendary-about-canvas .lau-lead {
	font-size: 1rem !important;
	line-height: 2rem !important;
}

@media (min-width: 640px) {
	body.legendary-about-page .legendary-about-canvas .lau-lead {
		font-size: 1.125rem !important;
		line-height: 1.75rem !important;
	}
}

/* text-3xl font-semibold */
body.legendary-about-page .legendary-about-canvas .lau-h2 {
	font-size: 1.875rem !important;
	line-height: 2.25rem !important;
	font-weight: 600 !important;
}

/* text-3xl sm:text-4xl (final CTA title) */
body.legendary-about-page .legendary-about-canvas .lau-h2--final {
	font-size: 1.875rem !important;
	line-height: 2.25rem !important;
}

@media (min-width: 640px) {
	body.legendary-about-page .legendary-about-canvas .lau-h2--final {
		font-size: 2.25rem !important;
		line-height: 2.5rem !important;
	}
}

/* text-sm leading-8 sm:text-base */
body.legendary-about-page .legendary-about-canvas .lau-prose--who,
body.legendary-about-page .legendary-about-canvas .lau-prose--seo {
	font-size: 0.875rem !important;
	line-height: 2rem !important;
}

@media (min-width: 640px) {
	body.legendary-about-page .legendary-about-canvas .lau-prose--who,
	body.legendary-about-page .legendary-about-canvas .lau-prose--seo {
		font-size: 1rem !important;
		line-height: 1.5rem !important;
	}
}

body.legendary-about-page .legendary-about-canvas .lau-prose--primary {
	font-size: 0.875rem !important;
	line-height: 2rem !important;
}

@media (min-width: 640px) {
	body.legendary-about-page .legendary-about-canvas .lau-prose--primary {
		font-size: 1rem !important;
		line-height: 1.5rem !important;
	}
}

/* text-sm leading-8 sm:text-base (final lead) */
body.legendary-about-page .legendary-about-canvas .lau-final-lead {
	font-size: 0.875rem !important;
	line-height: 2rem !important;
}

@media (min-width: 640px) {
	body.legendary-about-page .legendary-about-canvas .lau-final-lead {
		font-size: 1rem !important;
		line-height: 1.5rem !important;
	}
}

/* text-2xl font-semibold (stat values) */
body.legendary-about-page .legendary-about-canvas .lau-stat-value {
	font-size: 1.5rem !important;
	line-height: 2rem !important;
	font-weight: 600 !important;
}

/* text-sm (stat labels, kickers, buttons, inputs) */
body.legendary-about-page .legendary-about-canvas .lau-stat-label,
body.legendary-about-page .legendary-about-canvas .lau-kicker {
	font-size: 0.875rem !important;
	line-height: 1.25rem !important;
}

body.legendary-about-page .legendary-about-canvas .lau-btn,
body.legendary-about-page .legendary-about-canvas .lau-input,
body.legendary-about-page .legendary-about-canvas .lau-textarea,
body.legendary-about-page .legendary-about-canvas .lau-benefit {
	font-size: 0.875rem !important;
	line-height: 1.25rem !important;
}

/* text-base leading-7 (SEO blurb in stats card) */
body.legendary-about-page .legendary-about-canvas .lau-seo-body {
	font-size: 1rem !important;
	line-height: 1.75rem !important;
}

/* text-lg font-medium */
body.legendary-about-page .legendary-about-canvas .lau-value-title,
body.legendary-about-page .legendary-about-canvas .lau-faq-q {
	font-size: 1.125rem !important;
	line-height: 1.75rem !important;
	font-weight: 500 !important;
}

/* text-sm leading-7 */
body.legendary-about-page .legendary-about-canvas .lau-value-desc,
body.legendary-about-page .legendary-about-canvas .lau-faq-a {
	font-size: 0.875rem !important;
	line-height: 1.75rem !important;
}

/* --- Hero: border-b + radial bg --- */
.lau-hero {
	border-bottom: 1px solid var(--lau-white-10);
	background-image: radial-gradient(circle at top right, rgba(255, 255, 255, 0.14), transparent 28%),
		radial-gradient(circle at left, rgba(255, 255, 255, 0.06), transparent 24%);
}

.lau-container {
	width: 100%;
	max-width: var(--lau-max-7xl);
	margin-left: auto;
	margin-right: auto;
	padding-left: 1.5rem;
	padding-right: 1.5rem;
}

@media (min-width: 1024px) {
	.lau-container {
		padding-left: 2rem;
		padding-right: 2rem;
	}
}

/* py-16 lg:py-24 */
.lau-container--hero {
	padding-top: 4rem;
	padding-bottom: 4rem;
}

@media (min-width: 1024px) {
	.lau-container--hero {
		padding-top: 6rem;
		padding-bottom: 6rem;
	}
}

/* gap-10 lg:grid-cols-[1.05fr_0.95fr] lg:items-center */
.lau-hero-grid {
	display: grid;
	gap: 2.5rem;
	align-items: center;
}

@media (min-width: 1024px) {
	.lau-hero-grid {
		grid-template-columns: 1.05fr 0.95fr;
	}
}

/* Pill: inline-flex rounded-full border bg-white/5 px-4 py-2 text-xs tracking-[0.25em] text-neutral-300 */
.lau-pill {
	display: inline-flex;
	align-items: center;
	border-radius: 9999px;
	border: 1px solid var(--lau-white-10);
	background: var(--lau-white-5);
	padding: 0.5rem 1rem;
	font-size: 0.75rem;
	line-height: 1rem;
	text-transform: uppercase;
	letter-spacing: 0.25em;
	color: var(--lau-n300);
}

/* h1: mt-5 max-w-4xl — font sizes in body… lock block */
.lau-h1 {
	margin-top: 1.25rem;
	max-width: var(--lau-max-4xl);
}

/* Lead: mt-6 max-w-3xl — typography in lock block */
.lau-lead {
	margin-top: 1.5rem;
	max-width: var(--lau-max-3xl);
}

/* mt-8 flex flex-wrap gap-4 */
.lau-cta-row {
	margin-top: 2rem;
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
}

.lau-cta-row--center {
	justify-content: center;
}

/* rounded-[2rem] border bg-white/[0.03] */
.lau-card {
	border-radius: var(--lau-r2);
	border: 1px solid var(--lau-white-10);
}

.lau-card--glass {
	background: var(--lau-white-3);
}

.lau-card--gradient {
	background-image: linear-gradient(to bottom right, var(--lau-white-7), var(--lau-white-2));
}

.lau-card--solid {
	background: var(--lau-n900-70);
}

.lau-card--p6 {
	padding: 1.5rem;
}

.lau-card--p8 {
	padding: 2rem;
}

/* stats: grid-cols-2 gap-4 */
.lau-stats-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1rem;
}

/* rounded-[1.5rem] border bg-neutral-900/70 p-5 */
.lau-stat {
	border-radius: var(--lau-r15);
	border: 1px solid var(--lau-white-10);
	background: var(--lau-n900-70);
	padding: 1.25rem;
}

/* stat value / label — colors & type in lock block */
.lau-stat-label {
	margin-top: 0.5rem;
}

/* mt-6 rounded-[1.5rem] ... p-5 */
.lau-seo-block {
	margin-top: 1.5rem;
	border-radius: var(--lau-r15);
	border: 1px solid var(--lau-white-10);
	background: var(--lau-n900-70);
	padding: 1.25rem;
}

/* kicker + SEO blurb — type/colors in lock block */
.lau-kicker {
	text-transform: uppercase;
	letter-spacing: 0.24em;
}

.lau-kicker--seo {
	letter-spacing: 0.2em;
}

.lau-seo-body {
	margin-top: 0.75rem;
}

/* Section py-16 */
.lau-section {
	padding-top: 4rem;
	padding-bottom: 4rem;
}

/* py-4 */
.lau-section--tight {
	padding-top: 1rem;
	padding-bottom: 1rem;
}

/* mb-8 */
.lau-section-head {
	margin-bottom: 2rem;
}

/* gap-8 lg:grid-cols */
.lau-split-grid {
	display: grid;
	gap: 2rem;
}

@media (min-width: 1024px) {
	.lau-split-grid--who {
		grid-template-columns: 1fr 0.95fr;
	}

	.lau-split-grid--seo {
		grid-template-columns: 0.95fr 1.05fr;
	}
}

/* h2 — font sizes in lock block */
.lau-h2--mt2 {
	margin-top: 0.5rem;
}

.lau-h2--mt3 {
	margin-top: 0.75rem;
}

.lau-h2--center {
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}

.lau-prose--who,
.lau-prose--seo {
	margin-top: 1.25rem;
}

.lau-prose--who + .lau-prose--who,
.lau-prose--seo + .lau-prose--seo {
	margin-top: 1.25rem;
}

.lau-prose--primary {
	margin-top: 1rem;
}

/* mt-6 space-y-3 */
.lau-benefits {
	margin-top: 1.5rem;
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}

.lau-benefit {
	border-radius: var(--lau-r2xl);
	border: 1px solid var(--lau-white-10);
	background: var(--lau-n900-70);
	padding: 1rem;
}

/* gap-6 lg:grid-cols-3 */
.lau-values-grid {
	display: grid;
	gap: 1.5rem;
}

@media (min-width: 1024px) {
	.lau-values-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

/* rounded-[2rem] p-6 */
.lau-value-card {
	border-radius: var(--lau-r2);
	border: 1px solid var(--lau-white-10);
	background: var(--lau-n900-70);
	padding: 1.5rem;
}

.lau-value-desc {
	margin-top: 0.75rem;
}

/* mt-6 flex flex-wrap gap-3 */
.lau-btn-row {
	margin-top: 1.5rem;
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
}

.lau-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	border-radius: var(--lau-r2xl);
	border: 1px solid transparent;
	font-family: inherit;
	transition: opacity 0.15s ease, background 0.15s ease;
}

.lau-btn--primary:hover {
	opacity: 0.92;
}

.lau-btn--outline:hover {
	background: var(--lau-white-5);
}

/* px-6 py-3 text-sm */
.lau-btn--hero {
	padding: 0.75rem 1.5rem;
}

/* px-5 py-3 text-sm */
.lau-btn--compact {
	padding: 0.75rem 1.25rem;
}

button.lau-btn {
	appearance: none;
}

/* Form: mt-6 grid gap-4 sm:grid-cols-2 */
.lau-form {
	margin-top: 1.5rem;
}

.lau-form-grid {
	display: grid;
	gap: 1rem;
}

@media (min-width: 640px) {
	.lau-form-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

.lau-input,
.lau-textarea {
	width: 100%;
	border-radius: var(--lau-r2xl);
	padding: 0.75rem 1rem;
	font-family: inherit;
}

@media (min-width: 640px) {
	.lau-input--full {
		grid-column: span 2;
	}

	.lau-textarea {
		grid-column: span 2;
	}
}

/* h-28 rounded-2xl ... */
.lau-textarea {
	min-height: 7rem;
	resize: vertical;
}

.lau-form-actions {
	margin-top: 1.5rem;
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
}

.lau-hp-wrap {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* FAQ space-y-4 */
.lau-faq-list {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.lau-faq-item {
	border-radius: var(--lau-r2);
	border: 1px solid var(--lau-white-10);
	background: var(--lau-n900-70);
	padding: 1.5rem;
}

.lau-faq-a {
	margin-top: 0.75rem;
}

/* rounded-[2.25rem] border gradient p-8 lg:p-10 text-center */
.lau-final-cta {
	border-radius: var(--lau-r225);
	border: 1px solid var(--lau-white-10);
	background-image: linear-gradient(to bottom right, var(--lau-white-7), var(--lau-white-2));
	padding: 2rem;
	text-align: center;
}

@media (min-width: 1024px) {
	.lau-final-cta {
		padding: 2.5rem;
	}
}

.lau-final-cta .lau-h2--final {
	margin-top: 0.75rem;
}

.lau-final-lead {
	margin-top: 1rem;
	margin-left: auto;
	margin-right: auto;
	max-width: var(--lau-max-2xl);
}

.lau-final-cta .lau-cta-row {
	margin-top: 2rem;
}

/* Notices */
.lau-notice-wrap {
	padding-top: 1rem;
}

.lau-notice {
	padding: 1rem 1.25rem;
	font-size: 0.875rem;
	line-height: 1.25rem;
	border-radius: var(--lau-r2xl);
	border: 1px solid var(--lau-white-10);
}

.lau-notice--success {
	border-color: rgba(74, 222, 128, 0.35);
	background: rgba(22, 101, 52, 0.25);
	color: #bbf7d0;
}

.lau-notice--error {
	border-color: rgba(248, 113, 113, 0.35);
	background: rgba(127, 29, 29, 0.25);
	color: #fecaca;
}
