/*
 * LexNova front page styles (hand-written, not minified).
 * Colour custom properties (--lx-*) are printed inline from the Customizer
 * settings by lexnova_enqueue_front_page_assets() in functions.php.
 */

.lx-front { --lx-serif: var(--primary-font, Georgia), Georgia, "Times New Roman", serif; }
.lx-front svg { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

/* Sections ---------------------------------------------------------------- */
.lx-section { padding: 4.5rem 0; }
.lx-section--light { background: var(--lx-light); color: var(--lx-light-p); }
.lx-section--dark  { background: var(--lx-dark);  color: var(--lx-dark-p); }
.lx-section--navy  { background: var(--lx-navy);  color: var(--lx-dark-p); }
@media (min-width: 1024px) { .lx-section { padding: 7rem 0; } }

.lx-section--light h2, .lx-section--light h3 { color: var(--lx-light-h); }
.lx-section--dark h2, .lx-section--dark h3,
.lx-section--navy h2, .lx-hero h1 { color: var(--lx-dark-h); }

.lx-front h1, .lx-front h2, .lx-front h3 { font-family: var(--lx-serif); margin: 0; }

/* Section heading: title left, intro right on wide screens */
.lx-head { display: grid; gap: 1rem; margin-bottom: 3rem; }
.lx-head h2 { font-size: clamp(1.9rem, 4vw, 2.9rem); line-height: 1.15; }
.lx-head h2::after {
	content: ""; display: block; width: 3.5rem; height: 3px;
	margin-top: 1.25rem; background: var(--lx-gold);
}
.lx-head p { margin: 0; max-width: 34rem; font-size: 1.125rem; line-height: 1.7; }
@media (min-width: 900px) {
	.lx-head { grid-template-columns: 1fr 1fr; align-items: end; gap: 3rem; margin-bottom: 4rem; }
}

/* Buttons ----------------------------------------------------------------- */
.lx-btn {
	display: inline-flex; align-items: center; justify-content: center;
	min-height: 3rem; padding: 0.85rem 2rem; border: 1px solid var(--lx-gold);
	border-radius: 0.375rem; font-weight: 700; line-height: 1.2; text-decoration: none;
	transition: background-color 0.2s ease, box-shadow 0.2s ease;
}
.lx-btn--solid { background: var(--lx-gold); color: var(--lx-gold-t); }
.lx-btn--solid:hover { box-shadow: 0 0 0 4px var(--lx-gold-soft); }
.lx-btn--ghost { background: transparent; color: var(--lx-gold); }
.lx-btn--ghost:hover { background: var(--lx-gold-soft); }
.lx-btn:focus-visible, .lx-post a:focus-visible, .lx-person a:focus-visible {
	outline: 3px solid var(--lx-gold); outline-offset: 3px;
}

/* Hero -------------------------------------------------------------------- */
.lx-hero {
	padding: 5rem 0 0; color: var(--lx-dark-p); background-color: var(--lx-navy);
	background-image: radial-gradient(50rem 26rem at 90% -10%, var(--lx-gold-soft), transparent 70%);
}
.lx-hero__inner { max-width: 50rem; }
.lx-hero h1 { font-size: clamp(2.4rem, 6vw, 4.4rem); line-height: 1.08; margin-bottom: 1.5rem; }
.lx-hero__lead { margin: 0; max-width: 38rem; font-size: 1.2rem; line-height: 1.7; }
.lx-hero__actions { display: flex; flex-wrap: wrap; gap: 0.875rem; margin-top: 2.25rem; }

.lx-stats {
	display: grid; grid-template-columns: repeat(3, 1fr); margin: 4rem 0 0; padding: 0;
	border-top: 1px solid var(--lx-gold-line);
}
.lx-stats > div { display: flex; flex-direction: column-reverse; gap: 0.35rem; padding: 1.75rem 0.5rem 2.25rem 0; }
.lx-stats > div + div { padding-left: 1.25rem; border-left: 1px solid var(--lx-gold-line); }
.lx-stats dd { margin: 0; font-family: var(--lx-serif); font-size: clamp(1.75rem, 6vw, 2.9rem); line-height: 1; color: var(--lx-gold); }
.lx-stats dt { font-size: 0.9rem; line-height: 1.4; }
@media (min-width: 1024px) { .lx-hero { padding-top: 8rem; } }

/* Grids and cards --------------------------------------------------------- */
.lx-grid { display: grid; gap: 1.5rem; }
@media (min-width: 640px)  { .lx-grid--2, .lx-grid--4 { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 768px)  { .lx-grid--3 { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1024px) { .lx-grid--4 { grid-template-columns: repeat(4, 1fr); } }

.lx-card {
	padding: 2rem 1.75rem; background: var(--lx-card); color: var(--lx-light-p);
	border: 1px solid var(--lx-line); border-top: 3px solid var(--lx-gold); border-radius: 0.5rem;
}
.lx-card h3 { margin-bottom: 0.6rem; font-size: 1.3rem; line-height: 1.3; color: var(--lx-card-h); }
.lx-card p { margin: 0; line-height: 1.65; }
.lx-icon {
	display: grid; place-items: center; width: 3rem; height: 3rem; margin-bottom: 1.25rem;
	border-radius: 50%; background: var(--lx-gold-soft); color: var(--lx-card-h);
}
.lx-icon svg { width: 1.5rem; height: 1.5rem; }

/* Why choose us ----------------------------------------------------------- */
.lx-split { display: grid; gap: 3rem; align-items: center; }
@media (min-width: 1024px) { .lx-split { grid-template-columns: 1fr 1fr; gap: 5rem; } }
.lx-split h2 { margin-bottom: 1.5rem; font-size: clamp(1.9rem, 4vw, 2.9rem); line-height: 1.15; }
.lx-split p { margin: 0; max-width: 34rem; font-size: 1.125rem; line-height: 1.7; }
.lx-features { display: grid; gap: 1.25rem; }
.lx-feature {
	display: flex; gap: 1.25rem; padding: 1.75rem; border-radius: 0.5rem;
	background: var(--lx-gold-soft); border: 1px solid var(--lx-gold-line);
}
.lx-feature svg { flex: none; width: 2rem; height: 2rem; color: var(--lx-gold); }
.lx-feature h3 { margin-bottom: 0.4rem; font-size: 1.25rem; color: var(--lx-gold); }
.lx-feature p { font-size: 1rem; }

/* Attorneys --------------------------------------------------------------- */
.lx-person { padding: 2.25rem 1.5rem; text-align: center; }
.lx-person__avatar {
	display: grid; place-items: center; width: 6.5rem; height: 6.5rem; margin: 0 auto 1.25rem;
	overflow: hidden; border-radius: 50%; border: 2px solid var(--lx-gold);
	background: var(--lx-gold-soft); color: var(--lx-card-h);
	font-family: var(--lx-serif); font-size: 2.25rem; font-weight: 700;
}
.lx-person__avatar img { width: 100%; height: 100%; object-fit: cover; }
.lx-person h3 { margin-bottom: 0.25rem; font-size: 1.3rem; }
.lx-person h3 a { color: inherit; text-decoration: none; }
.lx-person h3 a:hover { text-decoration: underline; }
.lx-person p { font-size: 0.95rem; }

/* Testimonials ------------------------------------------------------------ */
.lx-quote {
	margin: 0; padding: 2.25rem; border-radius: 0.5rem;
	background: rgba(255, 255, 255, 0.04); border: 1px solid var(--lx-gold-line);
}
.lx-quote::before {
	content: "\201C"; display: block; height: 2.75rem; font-family: var(--lx-serif);
	font-size: 5rem; line-height: 1; color: var(--lx-gold);
}
.lx-quote blockquote { margin: 0 0 1.5rem; padding: 0; border: 0; font-size: 1.15rem; line-height: 1.75; color: var(--lx-dark-h); }
.lx-quote blockquote p { margin: 0; }
.lx-quote figcaption { font-weight: 700; color: var(--lx-gold); }

/* Latest posts ------------------------------------------------------------ */
.lx-post {
	position: relative; display: flex; flex-direction: column; overflow: hidden;
	background: var(--lx-card); border: 1px solid var(--lx-line); border-radius: 0.5rem;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.lx-post:hover, .lx-post:focus-within { border-color: var(--lx-gold); box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08); }
.lx-post__media { aspect-ratio: 16 / 10; background: var(--lx-gold-soft); overflow: hidden; }
.lx-post__media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.lx-post__body { padding: 1.75rem; }
.lx-post h3 { margin-bottom: 0.6rem; font-size: 1.2rem; line-height: 1.35; color: var(--lx-card-h); }
.lx-post h3 a { color: inherit; text-decoration: none; }
.lx-post h3 a::after { content: ""; position: absolute; inset: 0; }
.lx-post p { margin: 0; font-size: 0.95rem; line-height: 1.65; color: var(--lx-light-p); }

/* Closing call to action -------------------------------------------------- */
.lx-cta { text-align: center; border-top: 1px solid var(--lx-gold-line); }
.lx-cta h2 { margin-bottom: 1.25rem; font-size: clamp(2rem, 5vw, 3.2rem); line-height: 1.15; }
.lx-cta p { max-width: 36rem; margin: 0 auto 2.25rem; font-size: 1.15rem; line-height: 1.7; }

/* Static front page with regular editor content ------------------------------ */
.lx-standard { padding: 4rem 0; overflow-x: clip; background: var(--lx-light); color: var(--lx-light-p); }
@media (min-width: 1024px) { .lx-standard { padding: 6rem 0; } }

.lx-standard__content { max-width: 60rem; margin: 0 auto; font-size: 1.0625rem; line-height: 1.8; }
.lx-standard__content > * { margin-top: 0; margin-bottom: 1.5rem; }
.lx-standard__content > *:last-child { margin-bottom: 0; }
.lx-standard__content h1, .lx-standard__content h2, .lx-standard__content h3,
.lx-standard__content h4, .lx-standard__content h5, .lx-standard__content h6 {
	margin: 2.5rem 0 1rem; font-family: var(--primary-font, Georgia), Georgia, "Times New Roman", serif;
	line-height: 1.2; color: var(--lx-light-h);
}
.lx-standard__content > :first-child { margin-top: 0; }
.lx-standard__content h1 { font-size: clamp(2.2rem, 5vw, 3.4rem); }
.lx-standard__content h2 { font-size: clamp(1.8rem, 4vw, 2.6rem); }
.lx-standard__content h3 { font-size: clamp(1.4rem, 3vw, 1.8rem); }
.lx-standard__content h2::after {
	content: ""; display: block; width: 3.5rem; height: 3px; margin-top: 1rem; background: var(--lx-gold);
}
.lx-standard__content a { color: var(--lx-light-h); text-decoration-color: var(--lx-gold); text-underline-offset: 3px; }
.lx-standard__content a:hover { color: var(--lx-gold); }
.lx-standard__content img, .lx-standard__content video { max-width: 100%; height: auto; border-radius: 0.5rem; }
.lx-standard__content ul, .lx-standard__content ol { padding-left: 1.5rem; }
.lx-standard__content li + li { margin-top: 0.5rem; }
.lx-standard__content blockquote {
	margin-left: 0; margin-right: 0; padding: 0.5rem 0 0.5rem 1.5rem; border-left: 4px solid var(--lx-gold);
	font-size: 1.15rem; font-style: italic;
}
.lx-standard__content .wp-block-columns { gap: 2rem; }
.lx-standard__content .wp-block-column > :last-child { margin-bottom: 0; }
.lx-standard__content .wp-block-button__link { padding: 0.85rem 2rem; border-radius: 0.375rem; font-weight: 700; text-decoration: none; }
.lx-standard__content .wp-block-image figcaption { margin-top: 0.5rem; font-size: 0.9rem; text-align: center; }
.lx-standard__content .alignwide { width: min(80rem, calc(100vw - 2.5rem)); max-width: none; margin-left: 50%; transform: translateX(-50%); }
.lx-standard__content .alignfull { width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); }

@media (prefers-reduced-motion: reduce) {
	.lx-btn, .lx-post { transition: none; }
}