/* ═══════════════════════════════════════════════════════════════
   BASE
   ═══════════════════════════════════════════════════════════════ */

* { box-sizing: border-box; }

body {
	margin: 0;
	font-family: var(--lw-font);
	color: var(--lw-body);
	background: var(--lw-canvas);
	-webkit-font-smoothing: antialiased;
}

img { max-width: 100%; display: block; }
a { color: inherit; }

.lw-navy-text { color: var(--lw-navy); }
.lw-red-text  { color: var(--lw-red); }

/* ═══════════════════════════════════════════════════════════════
   BUTTONS
   ═══════════════════════════════════════════════════════════════ */

.lw-btn {
	display: inline-block;
	font-family: var(--lw-font);
	font-weight: 700;
	text-decoration: none;
	border-radius: var(--lw-radius-sm);
	transition: background-color 0.15s ease, transform 0.15s ease;
	white-space: nowrap;
}

.lw-btn--red {
	background: var(--lw-red);
	color: #fff;
}
.lw-btn--red:hover {
	background: var(--lw-red-dark);
}

.lw-btn--sm {
	padding: 0.6rem 1.1rem;
	font-size: 0.75rem;
	letter-spacing: 0.03em;
}

.lw-btn--lg {
	padding: 0.95rem 1.8rem;
	font-size: 0.95rem;
	letter-spacing: 0.02em;
	box-shadow: 0 6px 16px rgba(157, 22, 36, 0.25);
}

/* CTA attention (Alice, 2026-09-08) — a crisp light "sheen" sweeps across
   the waitlist button every few seconds, then rests. No blur (hard
   gradient band), directional, and easy to ignore between sweeps. */
.lw-cta-trigger {
	position: relative;
	overflow: hidden;
	transition: background-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}
.lw-cta-trigger::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: -75%;
	width: 55%;
	background: linear-gradient(100deg, transparent 0%, rgba(255, 255, 255, 0.30) 50%, transparent 100%);
	transform: skewX(-20deg);
	pointer-events: none;
	animation: lw-cta-sheen 5s ease-in-out infinite;
}
@keyframes lw-cta-sheen {
	0%   { left: -75%; }
	14%  { left: 135%; }
	100% { left: 135%; }
}
.lw-cta-trigger:hover {
	transform: translateY(-2px);
	box-shadow: 0 10px 22px rgba(157, 22, 36, 0.35);
}
@media (prefers-reduced-motion: reduce) {
	.lw-cta-trigger::after { display: none; }
	.lw-cta-trigger:hover { transform: none; }
}

/* ═══════════════════════════════════════════════════════════════
   STICKY SIDE CTA (Alice, 2026-09-08)
   Always reachable wherever the visitor scrolls. Carries .lw-cta-trigger
   for the modal hook, so these rules override the button styles above.
   Desktop: a vertical tab on the right edge. Mobile: a bottom bar.
   ═══════════════════════════════════════════════════════════════ */

.lw-sticky-cta {
	position: fixed;
	z-index: 90;
	background: var(--lw-red);
	color: #fff;
	text-decoration: none;
	font-family: var(--lw-font);
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	line-height: 1;
	overflow: hidden;
	box-shadow: -4px 4px 22px rgba(1, 28, 60, 0.30);
	transition: background-color 0.15s ease, transform 0.18s ease;
}
.lw-sticky-cta:hover { background: var(--lw-red-dark); }

/* its own sheen (the .lw-cta-trigger one sweeps horizontally; override) */
.lw-sticky-cta::after {
	content: "";
	position: absolute;
	inset: 0;
	left: auto;
	width: auto;
	transform: none;
	background: linear-gradient(115deg, transparent 42%, rgba(255, 255, 255, 0.32) 50%, transparent 58%);
	background-size: 280% 100%;
	background-position: 150% 0;
	animation: lw-sticky-sheen 5s ease-in-out infinite;
}
@keyframes lw-sticky-sheen {
	0%   { background-position: 150% 0; }
	14%  { background-position: -150% 0; }
	100% { background-position: -150% 0; }
}

@media (min-width: 768px) {
	.lw-sticky-cta {
		right: 0;
		top: 50%;
		transform: translateY(-50%);
		writing-mode: vertical-rl;
		padding: 1.2rem 0.62rem;
		font-size: 0.78rem;
		border-radius: 12px 0 0 12px;
	}
	.lw-sticky-cta:hover { transform: translateY(-50%) translateX(-3px); }
}

@media (max-width: 767px) {
	/* A floating rounded button, not a full-width bar (Alice, 2026-10-08):
	   it reads as something to tap, and the page shows round it. */
	.lw-sticky-cta {
		left: 1rem;
		right: 1rem;
		bottom: calc(0.75rem + env(safe-area-inset-bottom, 0px));
		text-align: center;
		padding: 1rem 1.25rem;
		font-size: 0.9rem;
		border-radius: 999px;
		border: 2px solid rgba(255, 255, 255, 0.85);
		box-shadow: 0 8px 22px rgba(1, 28, 60, 0.38), 0 2px 6px rgba(1, 28, 60, 0.25);
	}
	.lw-sticky-cta__text::after { content: "\00a0\2192"; }
	.lw-sticky-cta:active { transform: scale(0.98); }
	body { padding-bottom: 5rem; }
}

@media (prefers-reduced-motion: reduce) {
	.lw-sticky-cta::after { display: none; }
}

/* ═══════════════════════════════════════════════════════════════
   HEADER
   ═══════════════════════════════════════════════════════════════ */

.lw-header {
	background: var(--lw-navy);
	border-bottom: 3px solid var(--lw-red);
}

.lw-header__inner {
	max-width: var(--lw-max);
	margin: 0 auto;
	padding: 1.1rem 2rem;
	display: flex;
	align-items: center;
	gap: 2rem;
}

.lw-logo {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	text-decoration: none;
	margin-right: auto;
}

/* Updated logo lockup (Alice, 2026-09-13) — the full "Lawryse Publications"
   wordmark, noticeably wider than the old mark at the same height. Sized
   down from 46px (Alice: "much smaller... same size as depicted in the
   dashboard") so it doesn't dominate the header, with more header padding
   to give it room. Height-driven; SVG so it stays crisp at any size. */
.lw-logo__img {
	display: block;
	height: 34px;
	width: auto;
}
@media (max-width: 560px) {
	.lw-logo__img { height: 28px; }
}

.lw-nav {
	display: flex;
	gap: 1.75rem;
}
.lw-nav a {
	text-decoration: none;
	color: rgba(255, 255, 255, 0.82);
	font-size: 0.875rem;
	font-weight: 500;
}
.lw-nav a:hover { color: #fff; }

@media (max-width: 900px) {
	.lw-nav { display: none; }
}

/* ═══════════════════════════════════════════════════════════════
   HERO
   ═══════════════════════════════════════════════════════════════ */

.lw-hero {
	background: var(--lw-canvas-alt);
	padding: 3rem 2rem 2.25rem;
}

.lw-hero__top {
	max-width: var(--lw-max);
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1.15fr 1fr;
	gap: 3rem;
	align-items: center;
}

@media (max-width: 1024px) {
	.lw-hero__top {
		grid-template-columns: minmax(0, 1fr);
	}
}

.lw-eyebrow {
	color: var(--lw-red);
	font-weight: 700;
	font-size: 0.75rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	margin: 0 0 0.75rem;
}

.lw-hero__title {
	font-family: var(--lw-font-head);
	font-weight: 700;
	font-size: clamp(1.9rem, 3.2vw, 2.7rem);
	line-height: 1.15;
	margin: 0 0 1.1rem;
}
.lw-hero__title span { display: block; }
/* Phones read the headline in three short lines (Alice, 2026-10-08). */
.lw-hero__title span.lw-hero__title-mobile { display: none; }
@media (max-width: 640px) {
	.lw-hero__title span.lw-hero__title-desk { display: none; }
	.lw-hero__title span.lw-hero__title-mobile { display: block; }
}

.lw-hero__subhead {
	font-family: var(--lw-font-head);
	font-weight: 700;
	font-size: 1.2rem;
	color: var(--lw-navy);
	margin: 0 0 0.9rem;
	line-height: 1.35;
}

.lw-hero__body {
	color: var(--lw-muted);
	font-size: var(--lw-text);
	line-height: 1.7;
	margin: 0 0 1.6rem;
	max-width: 46rem;
}

/* ---- The four value points ---- */

.lw-hero__points {
	max-width: var(--lw-max);
	margin: 2.75rem auto 0;
	padding: 0;
	list-style: none;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.5rem;
}

@media (max-width: 900px) {
	.lw-hero__points { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
	.lw-hero__points { grid-template-columns: minmax(0, 1fr); }
}

.lw-hero__points li {
	background: #fff;
	border-radius: var(--lw-radius);
	padding: 1.1rem 1.2rem;
	box-shadow: var(--lw-shadow-card);
}

.lw-dot {
	display: inline-block;
	flex-shrink: 0;
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: var(--lw-red);
	margin-right: 0.5rem;
	vertical-align: middle;
}

.lw-hero__points strong {
	font-family: var(--lw-font-head);
	font-size: 0.8rem;
	letter-spacing: 0.03em;
	color: var(--lw-navy);
	vertical-align: middle;
}

.lw-hero__points li span:last-child {
	display: block;
	margin-top: 0.5rem;
	font-size: 0.82rem;
	color: var(--lw-muted);
	line-height: 1.5;
}

/* ═══════════════════════════════════════════════════════════════
   THE RADIAL GRAPHIC
   ═══════════════════════════════════════════════════════════════ */

.lw-hero__graphic {
	display: flex;
	justify-content: center;
}

.lw-radial {
	position: relative;
	width: 100%;
	max-width: 460px;
	aspect-ratio: 1 / 1;
}

.lw-radial__lines {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

.lw-radial__ring {
	fill: none;
	stroke: var(--lw-border);
	stroke-width: 1.5;
	stroke-dasharray: 3 6;
}

.lw-radial__spoke {
	stroke-width: 1.5;
}
.lw-radial__spoke--red  { stroke: rgba(157, 22, 36, 0.35); }
.lw-radial__spoke--navy { stroke: rgba(1, 28, 60, 0.3); }

.lw-radial__hub {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 34%;
	aspect-ratio: 1 / 1;
	border-radius: 50%;
	background: var(--lw-navy);
	color: #fff;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	/* Raised off the diagram (Alice, 2026-09-08) — scaled down from the
	   page's --lw-lift because these elements are small. */
	box-shadow:
		0 4px 10px rgba(1, 28, 60, 0.18),
		0 14px 30px rgba(1, 28, 60, 0.22);
	padding: 0.5rem;
}

.lw-radial__hub-name {
	font-family: var(--lw-font-head);
	font-weight: 700;
	font-size: clamp(0.9rem, 2vw, 1.15rem);
	letter-spacing: 0.02em;
}

.lw-radial__hub-sub {
	margin-top: 0.25rem;
	font-size: clamp(0.5rem, 1vw, 0.6rem);
	letter-spacing: 0.08em;
	color: #f0a3ab;
	font-weight: 600;
}

.lw-radial__card {
	position: absolute;
	transform: translate(-50%, -50%);
	width: 34%;
	min-width: 108px;
	background: #fff;
	border-radius: var(--lw-radius-sm);
	box-shadow:
		0 2px 5px rgba(1, 28, 60, 0.10),
		0 9px 20px rgba(1, 28, 60, 0.14);
	padding: 0.55rem 0.7rem;
	border-left: 3px solid var(--lw-red);
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
}
.lw-radial__card--navy { border-left-color: var(--lw-navy); }

.lw-radial__card-title {
	font-family: var(--lw-font-head);
	font-size: 0.7rem;
	letter-spacing: 0.02em;
	color: var(--lw-red);
}
.lw-radial__card--navy .lw-radial__card-title { color: var(--lw-navy); }

.lw-radial__card-desc {
	font-size: 0.66rem;
	color: var(--lw-body);
	line-height: 1.3;
}

.lw-radial__card-note {
	font-size: 0.6rem;
	color: var(--lw-muted);
	line-height: 1.3;
}

@media (max-width: 1024px) {
	.lw-hero__graphic { margin-top: 2.5rem; }
}

@media (max-width: 480px) {
	.lw-radial { max-width: 280px; }
	.lw-radial__card {
		padding: 0.35rem 0.45rem;
		width: 30%;
		min-width: 0;
	}
	.lw-radial__card-title { font-size: 0.6rem; }
	.lw-radial__card-desc { font-size: 0.56rem; }
	.lw-radial__card-note { display: none; }
}

/* ═══════════════════════════════════════════════════════════════
   THE PUBLISH · ENGAGE · CONNECT · PROMOTE · MEASURE STRIP
   ═══════════════════════════════════════════════════════════════ */

.lw-strip {
	background: var(--lw-navy);
	color: #fff;
	text-align: center;
	padding: 1.1rem 1.5rem;
	font-family: var(--lw-font-head);
	font-weight: 700;
	font-size: 0.8rem;
	letter-spacing: 0.18em;
}

.lw-strip__sep {
	color: #fff;
	margin: 0 0.85em;
}

/* ═══════════════════════════════════════════════════════════════
   SHARED SECTION SCAFFOLDING
   ═══════════════════════════════════════════════════════════════ */

.lw-sec {
	/* Tightened 2026-09-08 (Alice) — 4rem left too much dead white at the
	   foot of each section. */
	padding: 2.5rem 2rem;
}
.lw-sec:nth-of-type(even) {
	background: var(--lw-canvas-alt);
}

.lw-sec__inner {
	max-width: var(--lw-max);
	margin: 0 auto;
}

.lw-sec__title {
	font-family: var(--lw-font-head);
	font-weight: 700;
	font-size: clamp(1.5rem, 2.6vw, 2.1rem);
	color: var(--lw-navy);
	line-height: 1.25;
	margin: 0 0 1rem;
}
/* The red rule under every section h2 (Alice, 2026-09-09) — was a manual
   <span class="lw-solution__rule"> on the Solution section only; now every
   h2 gets it. Every h2 on the page is visually centred, so the rule is too. */
.lw-sec__title::after {
	content: "";
	display: block;
	width: 64px;
	height: 3px;
	margin: 0.9rem auto 0;
	background: var(--lw-red);
	border-radius: 2px;
}
.lw-sec__title--center { text-align: center; max-width: 46rem; margin-left: auto; margin-right: auto; }

.lw-sec__lead {
	color: var(--lw-muted);
	font-size: var(--lw-text);
	line-height: 1.7;
	margin: 0 0 1rem;
}
.lw-sec__lead--center { text-align: center; max-width: 44rem; margin-left: auto; margin-right: auto; }

/* A section sub-head — the summarising line under a section h2 (Alice,
   2026-09-09). ONE size everywhere it is used: the head font, ~two steps
   above body, clearly below the h2. Every sub-head class below
   (.lw-solution__tagline, .lw-how__tagline, .lw-next__lead, .lw-roi__quote,
   .lw-laria-card__main h3) is kept at this same 1.15rem / 700 on purpose —
   change one, change all. */
.lw-sec__subhead {
	font-family: var(--lw-font-head);
	font-weight: 700;
	font-size: var(--lw-subhead);
}

.lw-eyebrow--center { text-align: center; }

.lw-check {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: rgba(1, 28, 60, 0.12);
	color: var(--lw-navy);
	font-size: 0.65rem;
	margin-right: 0.55rem;
	flex-shrink: 0;
}
.lw-x {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: rgba(157, 22, 36, 0.12);
	color: var(--lw-red);
	font-size: 0.75rem;
	margin-right: 0.55rem;
	flex-shrink: 0;
}

/* ═══════════════════════════════════════════════════════════════
   CHALLENGES / PROBLEM
   ═══════════════════════════════════════════════════════════════ */

/* Full-bleed navy ground (Alice, 2026-09-08) — breaks up the white page
   right after the header. .lw-sec.lw-challenges (0,2,0) to beat the
   .lw-sec:nth-of-type(even) grey. */
.lw-sec.lw-challenges { background: var(--lw-navy); }

.lw-challenges .lw-sec__title {
	margin-bottom: 2.25rem;
	max-width: 42rem;
	color: #fff;
}
.lw-challenges .lw-sec__lead { color: rgba(255, 255, 255, 0.82); }

.lw-challenges__grid {
	display: grid;
	grid-template-columns: 1.2fr 1fr;
	gap: 2.5rem;
	align-items: start;
}
@media (max-width: 900px) {
	.lw-challenges__grid { grid-template-columns: minmax(0, 1fr); }
}

.lw-challenges__card {
	position: relative;
	background: linear-gradient(160deg, var(--lw-red) 0%, var(--lw-red-dark) 100%);
	border-left: 4px solid var(--lw-red-dark);
	border-radius: var(--lw-radius);
	padding: 1.75rem 2rem;
	/* box-shadow via the shared raised-card block */
}
/* the stacked-card edge peeking out behind it, matching the reference */
.lw-challenges__card::after {
	content: "";
	position: absolute;
	inset: 10px -10px -10px 10px;
	background: rgba(157, 22, 36, 0.35);
	border-radius: var(--lw-radius);
	z-index: -1;
}
.lw-challenges__card h3 {
	font-family: var(--lw-font-head);
	color: #fff;
	font-size: 1.05rem;
	margin: 0 0 1.1rem;
}
.lw-challenges__card ul { list-style: none; margin: 0; padding: 0; }
.lw-challenges__card li {
	display: flex;
	align-items: center;
	font-size: 0.9rem;
	font-weight: 600;
	color: #fff;
	padding: 0.5rem 0;
}

.lw-dot--white { background: #fff; }

/* ═══════════════════════════════════════════════════════════════
   SOLUTION
   ═══════════════════════════════════════════════════════════════ */

.lw-solution__head { text-align: center; }
.lw-solution__label {
	text-transform: uppercase;
	letter-spacing: 0.02em;
	margin-bottom: 0.75rem;
}
.lw-solution__tagline {
	/* h3 sub-head — see .lw-sec__subhead (one shared size, 1.15rem / 700). */
	font-family: var(--lw-font-head);
	color: var(--lw-red);
	font-weight: 700;
	font-size: var(--lw-subhead);
	max-width: 40rem;
	margin: 0 auto 2.75rem;
	line-height: 1.5;
}

.lw-solution__grid {
	display: grid;
	grid-template-columns: 1.25fr 1fr;
	gap: 2.5rem;
	align-items: start;
	background-image: radial-gradient(var(--lw-border-strong, #C9D2DA) 1px, transparent 1px);
	background-size: 16px 16px;
}
@media (max-width: 900px) {
	.lw-solution__grid { grid-template-columns: minmax(0, 1fr); }
}

.lw-solution__copy p {
	color: var(--lw-muted);
	font-size: var(--lw-text);
	line-height: 1.7;
	margin: 0 0 1.1rem;
}
.lw-emph { color: var(--lw-red); font-weight: 700; }

/* Plain navy box, no red accent (Alice, 2026-09-09) — conforms with the
   other content boxes on the page. */
.lw-solution__box {
	position: relative;
	background: var(--lw-navy);
	border-radius: var(--lw-radius);
	padding: 1.85rem 2rem;
	/* box-shadow via the shared raised-card block */
}
.lw-solution__box h3 {
	font-family: var(--lw-font-head);
	text-transform: uppercase;
	letter-spacing: 0.03em;
	color: #fff;
	font-size: 1.05rem;
	margin: 0 0 1.4rem;
}
.lw-solution__box ul { list-style: none; margin: 0; padding: 0; }
.lw-solution__box li {
	display: flex;
	align-items: flex-start;
	padding: 0.6rem 0;
	color: #fff;
	font-size: 0.88rem;
	font-weight: 500;
	line-height: 1.5;
}
.lw-solution__box li .lw-dot {
	margin-top: 0.55em;
}

/* ═══════════════════════════════════════════════════════════════
   SHARED AUTHORITY EFFECT + LARIA FLOW (shared step styling)
   ═══════════════════════════════════════════════════════════════ */

/* Rebuilt 2026-09-08 (Alice) — a dark navy panel like the PUBLISH·ENGAGE
   strip: white type, red arrows, red number badges. The old white card
   wrapped its 4th step onto a second line and read as broken. */
.lw-authority__box {
	background: linear-gradient(160deg, var(--lw-navy) 0%, var(--lw-navy-ink) 100%);
	border-left: 4px solid var(--lw-red);
	border-radius: 20px;
	padding: 2rem 2.25rem;
	/* box-shadow via the shared raised-card block */
}
.lw-authority__box h3 {
	font-family: var(--lw-font-head);
	text-align: center;
	color: #fff;
	font-size: 1rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	margin: 0 0 1.75rem;
}

.lw-authority__row {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: nowrap;
	gap: 0.4rem;
}

.lw-authority__step {
	display: flex;
	align-items: center;
	gap: 0.65rem;
	flex: 1 1 0;
	min-width: 0;
}
.lw-authority__step strong {
	display: block;
	font-family: var(--lw-font-head);
	font-size: 0.8rem;
	letter-spacing: 0.02em;
	color: #fff;
}
.lw-authority__step > div > span {
	display: block;
	font-size: 0.74rem;
	line-height: 1.4;
	color: rgba(255, 255, 255, 0.6);
}

.lw-authority__num {
	flex-shrink: 0;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--lw-red);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
	font-family: var(--lw-font-head);
	font-weight: 700;
	font-size: 0.85rem;
}

.lw-authority__arrow {
	color: var(--lw-red);
	font-size: 1.1rem;
	font-weight: 700;
}
/* On the dark panel the brand red needs lifting to stay legible. */
.lw-authority__box .lw-authority__arrow {
	flex-shrink: 0;
	color: #e0505d;
	font-size: 1.25rem;
}
@media (max-width: 900px) {
	.lw-authority__row { flex-direction: column; align-items: flex-start; gap: 1rem; }
	.lw-authority__step { flex: none; width: 100%; }
	.lw-authority__box .lw-authority__arrow { transform: rotate(90deg); margin-left: 19px; }
}

/* ═══════════════════════════════════════════════════════════════
   ROI COMPARISON
   ═══════════════════════════════════════════════════════════════ */

.lw-roi__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.5rem;
	margin-top: 2.5rem;
}
@media (max-width: 760px) {
	.lw-roi__grid { grid-template-columns: minmax(0, 1fr); }
}

.lw-roi__card {
	border-radius: var(--lw-radius);
	padding: 1.75rem 2rem;
	color: #fff;
}
.lw-roi__card { border-left: 4px solid var(--lw-red); }
.lw-roi__card--red  { background: linear-gradient(160deg, var(--lw-red) 0%, var(--lw-red-dark) 100%); border-left-color: var(--lw-red-dark); }
.lw-roi__card--navy { background: linear-gradient(160deg, var(--lw-navy) 0%, var(--lw-navy-ink) 100%); }

.lw-roi__card h3 {
	font-family: var(--lw-font-head);
	font-size: 1.05rem;
	margin: 0 0 1.1rem;
}
.lw-roi__card ul { list-style: none; margin: 0; padding: 0; }
.lw-roi__card li {
	display: flex;
	align-items: flex-start;
	font-size: 0.85rem;
	line-height: 1.6;
	padding: 0.55rem 0;
}
.lw-roi__card li .lw-dot { margin-top: 0.55em; }

.lw-roi__quote {
	/* Same sub-head treatment as .lw-sec__subhead (1.15rem / 700, head font). */
	font-family: var(--lw-font-head);
	text-align: center;
	max-width: 44rem;
	margin: 2.5rem auto 0;
	font-size: var(--lw-subhead);
	font-weight: 700;
	color: var(--lw-navy);
	line-height: 1.5;
}
.lw-roi__quote em { color: var(--lw-red); font-style: normal; }
.lw-roi__quote-line { display: inline-block; }
@media (min-width: 640px) {
	.lw-roi__quote-line { white-space: nowrap; }
}

/* ═══════════════════════════════════════════════════════════════
   HOW LAWRYSE WORKS FOR YOUR FIRM
   ═══════════════════════════════════════════════════════════════ */

.lw-how__tagline {
	/* h3 sub-head — see .lw-sec__subhead (one shared size, 1.15rem / 700). */
	font-family: var(--lw-font-head);
	text-align: center;
	color: var(--lw-red);
	font-weight: 700;
	font-size: var(--lw-subhead);
	margin: 0 0 0.5rem;
}
.lw-how .lw-sec__lead--center { margin-bottom: 0; }

.lw-how__row {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 1.1rem;
	margin-top: 2.5rem;
	align-items: stretch;
}
@media (max-width: 1024px) {
	.lw-how__row { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
	.lw-how__row { grid-template-columns: minmax(0, 1fr); }
}

.lw-how__card {
	background: #fff;
	border-radius: var(--lw-radius);
	overflow: hidden;
	box-shadow: var(--lw-shadow-card);
	display: flex;
	flex-direction: column;
}

.lw-how__head {
	background: var(--lw-red);
	color: #fff;
	padding: 0.9rem 1.1rem;
	display: flex;
	align-items: center;
	gap: 0.6rem;
}
.lw-how__card--navy .lw-how__head { background: var(--lw-navy); }

.lw-how__num {
	flex-shrink: 0;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.25);
	display: flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
	font-family: var(--lw-font-head);
	font-weight: 700;
	font-size: 0.65rem;
}

.lw-how__step {
	font-family: var(--lw-font-head);
	font-weight: 700;
	font-size: 0.9rem;
	letter-spacing: 0.02em;
}

.lw-how__body {
	padding: 1.1rem;
	display: flex;
	flex-direction: column;
	flex: 1;
}

.lw-how__label {
	font-size: 0.62rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--lw-red);
	font-weight: 700;
	margin-top: 0;
}
.lw-how__text {
	font-size: 0.8rem;
	color: var(--lw-navy);
	line-height: 1.45;
	margin: 0.3rem 0 0;
	min-height: calc(0.8rem * 1.45 * 4);
}
.lw-how__divider {
	display: block;
	height: 1px;
	background: var(--lw-border);
	margin: 0.9rem 0;
}
.lw-how__builds {
	font-size: 0.8rem;
	color: var(--lw-navy);
	font-weight: 600;
	line-height: 1.45;
	margin: 0.3rem 0 0.9rem;
}
.lw-how__tagline-small {
	font-size: 0.72rem;
	font-style: italic;
	color: var(--lw-muted);
	margin: auto 0 0.8rem;
}
.lw-how__underline {
	display: block;
	width: 40px;
	height: 3px;
	background: var(--lw-red);
	border-radius: 2px;
}
.lw-how__card--navy .lw-how__underline { background: var(--lw-navy); }

/* ---- The PUBLISH·ENGAGE banner — closes the Solution section
   (Alice, 2026-09-08). ONE seamless pill, not two stacked halves ---- */
.lw-pill {
	max-width: var(--lw-max);
	margin: 2.75rem auto 0;
	padding: 0 1.5rem;
}
.lw-pill__inner {
	background: linear-gradient(180deg, var(--lw-navy) 0%, var(--lw-navy-ink) 100%);
	border-radius: 999px;
	padding: 0.85rem 1.5rem;
	text-align: center;
}
.lw-pill__lead {
	margin: 0 0 0.3rem;
	color: rgba(255, 255, 255, 0.65);
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}
.lw-pill__strip {
	margin: 0;
	color: #fff;
	font-family: var(--lw-font-head);
	font-weight: 700;
	font-size: 0.85rem;
	letter-spacing: 0.1em;
}
.lw-pill__strip .lw-strip__sep {
	color: #fff;
	margin: 0 0.7em;
}
/* Mobile review (2026-10-06): the five words are one unbreakable run of
   inline spans, about 400px wide, which pushed the whole page wider than a
   375px phone (sideways scroll, and the fixed bottom CTA stretched with it).
   Let the words wrap, and tighten the type on small screens. */
.lw-pill__strip {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	row-gap: 0.2rem;
}
@media (max-width: 480px) {
	.lw-pill__strip { font-size: 0.72rem; letter-spacing: 0.05em; }
	.lw-pill__strip .lw-strip__sep { margin: 0 0.4em; }
}

/* ═══════════════════════════════════════════════════════════════
   EXPLORE THE PLATFORM — LARIA feature card
   ═══════════════════════════════════════════════════════════════ */

/* Pulled up under the Solution banner (Alice, 2026-09-08) — the banner
   already closes Solution, so Explore hugs it a little tighter than the
   standard section top. */
.lw-sec.lw-explore { padding-top: 1.25rem; }

.lw-laria-card {
	margin-top: 2.5rem;
	background: #fff;
	border-radius: var(--lw-radius);
	overflow: hidden;
	box-shadow: 0 14px 32px rgba(1, 28, 60, 0.2);
}

.lw-laria-card__topbar {
	background: var(--lw-navy);
	padding: 1rem 1.75rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 0.75rem;
}
.lw-laria-card__brand strong {
	font-family: var(--lw-font-head);
	color: #fff;
	font-size: 1.05rem;
	margin-right: 0.75rem;
}
.lw-laria-card__brand span {
	color: rgba(255, 255, 255, 0.55);
	font-size: 0.78rem;
}

.lw-laria-card__body {
	padding: 2rem;
	display: grid;
	grid-template-columns: 220px 1fr 280px;
	gap: 2.25rem;
	align-items: start;
}
@media (max-width: 1024px) {
	.lw-laria-card__body { grid-template-columns: minmax(0, 1fr); }
	.lw-laria-card__phone { max-width: 260px; margin: 0 auto; }
}

.lw-phone {
	background: var(--lw-navy);
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 22px;
	padding: 1.25rem 1rem;
	max-width: 220px;
	margin: 0 auto;
	box-shadow: var(--lw-shadow-card);
}
.lw-phone__brand {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin-bottom: 1rem;
}
.lw-phone__mark {
	font-family: var(--lw-font-head);
	font-weight: 700;
	color: var(--lw-red);
	font-size: 1.1rem;
}
.lw-phone__brand strong {
	display: block;
	color: #fff;
	font-family: var(--lw-font-head);
	font-size: 0.85rem;
}
.lw-phone__brand small {
	display: block;
	color: rgba(255, 255, 255, 0.5);
	font-size: 0.55rem;
	letter-spacing: 0.06em;
}
.lw-phone__bubble {
	background: rgba(255, 255, 255, 0.08);
	border-radius: 10px;
	padding: 0.7rem 0.8rem;
	color: #fff;
	font-size: 0.75rem;
	margin-bottom: 0.6rem;
}
.lw-phone__option {
	display: flex;
	justify-content: space-between;
	align-items: center;
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 10px;
	padding: 0.6rem 0.8rem;
	color: rgba(255, 255, 255, 0.85);
	font-size: 0.7rem;
	margin-bottom: 0.5rem;
}
.lw-phone__option span { color: var(--lw-red); }

.lw-laria-card__main h3 {
	/* Same sub-head treatment as .lw-sec__subhead (1.15rem / 700, head font). */
	font-family: var(--lw-font-head);
	color: var(--lw-navy);
	font-weight: 700;
	font-size: var(--lw-subhead);
	margin: 0 0 0.75rem;
}
.lw-laria-card__main > p {
	color: var(--lw-muted);
	font-size: 0.88rem;
	line-height: 1.6;
	margin: 0 0 1.5rem;
}

.lw-laria-flow {
	display: flex;
	align-items: flex-start;
	flex-wrap: nowrap;
	gap: 0.4rem;
}
.lw-laria-flow__step {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 0.35rem;
	flex: 1 1 0;
	min-width: 0;
}
.lw-laria-flow__step strong { display: block; color: var(--lw-navy); font-family: var(--lw-font-head); font-size: 0.66rem; }
.lw-laria-flow__step span:not(.lw-authority__num) { display: block; color: var(--lw-muted); font-size: 0.62rem; line-height: 1.35; }

.lw-laria-flow .lw-authority__arrow {
	flex-shrink: 0;
	margin-top: 16px;
}

.lw-laria-why {
	margin-top: 1.75rem;
	background: var(--lw-canvas-alt);
	border-radius: var(--lw-radius-sm);
	padding: 1rem 1.25rem;
}
.lw-laria-why__label {
	display: block;
	color: var(--lw-red);
	font-size: 0.65rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	margin-bottom: 0.4rem;
}
.lw-laria-why p {
	margin: 0;
	color: var(--lw-body);
	font-size: 0.82rem;
	line-height: 1.55;
}

.lw-laria-card__proof {
	background: linear-gradient(160deg, var(--lw-red) 0%, var(--lw-red-dark) 100%);
	border-radius: var(--lw-radius);
	padding: 1.5rem 1.6rem;
	color: #fff;
	box-shadow: 0 10px 24px rgba(157, 22, 36, 0.25);
}
.lw-laria-card__proof h4 {
	font-family: var(--lw-font-head);
	text-transform: uppercase;
	letter-spacing: 0.02em;
	font-size: 0.9rem;
	margin: 0 0 0.6rem;
}
.lw-laria-card__proof-rule {
	display: block;
	width: 36px;
	height: 3px;
	background: rgba(255, 255, 255, 0.7);
	border-radius: 2px;
	margin-bottom: 1.1rem;
}
.lw-laria-card__proof ul { list-style: none; margin: 0; padding: 0; }
.lw-laria-card__proof li {
	display: flex;
	align-items: flex-start;
	font-size: 0.78rem;
	line-height: 1.55;
	padding: 0.5rem 0;
}
.lw-laria-card__proof li .lw-dot { margin-top: 0.5em; }

/* ═══════════════════════════════════════════════════════════════
   MORE WAYS TO BUILD YOUR PRESENCE
   ═══════════════════════════════════════════════════════════════ */

/* Navy ground (Alice, 2026-09-08). The product cards stay white — the
   card is the buffer, so the navy header strips never actually touch
   the navy section. */
.lw-sec.lw-more { background: var(--lw-navy); }
.lw-more .lw-sec__title { color: #fff; }
.lw-more .lw-sec__lead { color: rgba(255, 255, 255, 0.82); }

/* Raised on the dark ground (see the shared lift block near the top).
   The lit top border hints at the bevel catching light. */
.lw-more .lw-more__card {
	border: 1px solid rgba(255, 255, 255, 0.10);
	border-top-color: rgba(255, 255, 255, 0.30);
	box-shadow: var(--lw-lift-dark);
	transition: box-shadow 0.22s ease, transform 0.22s ease;
}
.lw-more .lw-more__card:hover {
	transform: translateY(-4px);
	box-shadow: var(--lw-lift-dark-hover);
}

.lw-more__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
	margin-top: 2.5rem;
}
@media (max-width: 900px) { .lw-more__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .lw-more__grid { grid-template-columns: minmax(0, 1fr); } }

.lw-more__card {
	background: #fff;
	border-radius: var(--lw-radius);
	overflow: hidden;
	box-shadow: var(--lw-shadow-card);
	display: flex;
	flex-direction: column;
	height: 100%;
}
.lw-more__head {
	padding: 0.85rem 1.1rem;
	font-family: var(--lw-font-head);
	font-weight: 700;
	font-size: 0.85rem;
	color: #fff;
	/* Matches the site's other all-caps labels (tier names, the pricing
	   band header row) — Alice, 2026-09-16. */
	text-transform: uppercase;
	letter-spacing: 0.03em;
}
.lw-more__head--red  { background: var(--lw-red); }
.lw-more__head--navy { background: var(--lw-navy); }

/* Everything between the header and the caption — variable in length
   per card, so it's the part that flexes; the caption always ends up
   in the same place across a row because of it (align-items: stretch
   on the grid, the default, already equalises the CARDS themselves). */
.lw-more__content {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
}

.lw-more__body {
	margin: 0;
	padding: 0.9rem 1.1rem 0;
	font-size: 0.8rem;
	color: var(--lw-muted);
	line-height: 1.55;
}

.lw-more__preview {
	background: var(--lw-canvas-alt);
	margin: 1rem 1.1rem 0;
	border-radius: var(--lw-radius-sm);
	padding: 1.1rem;
	min-height: 100px;
	display: flex;
	align-items: center;
	justify-content: center;
}

/* -- Lawryse Shorts: phone beside the copy, not stacked under it -- */
.lw-more__twocol {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
	padding: 0 1.1rem;
	margin-top: 0.9rem;
}
.lw-more__twocol .lw-more__preview {
	margin: 0;
	padding: 0;
	background: none;
	flex-shrink: 0;
	min-height: 0;
}
.lw-more__twocol .lw-more__body { padding: 0; flex: 1; }

.lw-more__caption {
	margin: 0;
	padding: 0.8rem 1.1rem 1.25rem;
	font-size: 0.76rem;
	font-style: italic;
	font-weight: 700;
	color: var(--lw-navy);
	line-height: 1.5;
}

.lw-more__preview img {
	width: 100%;
	height: auto;
	display: block;
	border-radius: 6px;
}

/* Shorts is a tall phone screenshot, not a wide card graphic like the
   other five — cap its height so it doesn't dwarf the card. */
.lw-more__preview--phone {
	background: none;
	padding: 0;
}
.lw-more__preview--phone img {
	max-height: 235px;
	width: auto;
	max-width: 100%;
	margin: 0 auto;
	border-radius: 14px;
	box-shadow:
		0 4px 12px rgba(1, 28, 60, 0.16),
		0 14px 30px rgba(1, 28, 60, 0.20);
}

/* ═══════════════════════════════════════════════════════════════
   RAISED-CARD TREATMENT — every box + banner (Alice, 2026-09-08)
   Layered shadow so each box reads as slightly raised, plus a small
   lift on hover. Placed after the section rules so it wins on source
   order (equal specificity). Tokens: --lw-lift* in style.css.
   ═══════════════════════════════════════════════════════════════ */

/* boxes sitting on a LIGHT ground */
.lw-hero__points li,
.lw-solution__box,
.lw-pill__inner,
.lw-laria-card,
.lw-how__card,
.lw-authority__box,
.lw-roi__card {
	box-shadow: var(--lw-lift);
	transition: box-shadow 0.22s ease, transform 0.22s ease;
}
.lw-hero__points li:hover,
.lw-solution__box:hover,
.lw-pill__inner:hover,
.lw-laria-card:hover,
.lw-how__card:hover,
.lw-authority__box:hover,
.lw-roi__card:hover {
	transform: translateY(-4px);
	box-shadow: var(--lw-lift-hover);
}

/* boxes sitting on a DARK (navy) ground */
.lw-challenges__card {
	box-shadow: var(--lw-lift-dark);
	transition: box-shadow 0.22s ease, transform 0.22s ease;
}
.lw-challenges__card:hover {
	transform: translateY(-4px);
	box-shadow: var(--lw-lift-dark-hover);
}

/* NB the comparison table (.lw-compare__scroll) gets the raised look in
   its own rule below, but NOT the hover lift — a horizontally-scrolling
   box that jumps on cursor-enter fights the scroll. */

@media (prefers-reduced-motion: reduce) {
	.lw-hero__points li,
	.lw-solution__box,
	.lw-pill__inner,
	.lw-laria-card,
	.lw-how__card,
	.lw-authority__box,
	.lw-roi__card,
	.lw-challenges__card,
	.lw-more .lw-more__card {
		transition: box-shadow 0.22s ease;
	}
	.lw-hero__points li:hover,
	.lw-solution__box:hover,
	.lw-pill__inner:hover,
	.lw-laria-card:hover,
	.lw-how__card:hover,
	.lw-authority__box:hover,
	.lw-roi__card:hover,
	.lw-challenges__card:hover,
	.lw-more .lw-more__card:hover {
		transform: none;
	}
}

/* ═══════════════════════════════════════════════════════════════
   CAPABILITY COMPARISON TABLE
   ═══════════════════════════════════════════════════════════════ */

/* Full-bleed navy ground (Alice, 2026-09-09) — same treatment as Problem
   / More Ways. The white table is the buffer card sitting on the navy, so
   the navy header row never touches the navy ground. .lw-sec.lw-compare
   (0,2,0), later in source than .lw-sec:nth-of-type(even). */
.lw-sec.lw-compare { background: var(--lw-navy); }
.lw-compare .lw-sec__title { color: #fff; }

.lw-compare__scroll {
	overflow-x: auto;
	margin-top: 2.5rem;
	border-radius: var(--lw-radius);
	box-shadow: var(--lw-lift-dark);
}
.lw-compare__table {
	width: 100%;
	border-collapse: collapse;
	background: #fff;
	font-size: 0.82rem;
	min-width: 720px;
}
.lw-compare__table th,
.lw-compare__table td {
	padding: 0.75rem 1rem;
	text-align: center;
	border-bottom: 1px solid var(--lw-border);
}
.lw-compare__table thead th {
	background: var(--lw-navy);
	color: #fff;
	font-family: var(--lw-font-head);
	font-size: 0.78rem;
	/* white outline (Alice, 2026-09-09) so the navy header cells read as a
	   table and don't dissolve into the navy section ground behind them */
	border: 1px solid rgba(255, 255, 255, 0.65);
}
.lw-compare__table thead th.is-lawryse { background: var(--lw-red); }
.lw-compare__label {
	text-align: left !important;
	font-weight: 600;
	color: var(--lw-navy);
}
td.is-lawryse { background: rgba(157, 22, 36, 0.05); }

.lw-tick { color: #1a8a4a; font-weight: 700; }
.lw-cross { color: var(--lw-red); font-weight: 700; }
.lw-compare__value { font-size: 0.72rem; color: var(--lw-body); }

/* ═══════════════════════════════════════════════════════════════
   MEMBERSHIP TIERS
   ═══════════════════════════════════════════════════════════════ */

/* Full-bleed navy ground (Alice, 2026-09-09) — matches Problem / More
   Ways / Capability Comparison. Both supplied PNGs are mounted on a white
   buffer panel so their own light backgrounds and dark table text stay
   legible on the navy regardless of the image's own alpha. */
.lw-sec.lw-membership { background: var(--lw-navy); }
.lw-membership .lw-sec__title { color: #fff; }
.lw-membership .lw-sec__lead { color: rgba(255, 255, 255, 0.82); }

.lw-membership__footnote {
	text-align: center;
	font-size: 0.75rem;
	color: rgba(255, 255, 255, 0.7);
	max-width: 46rem;
	margin: 1.5rem auto 0;
}

/* ── Attorney pricing band table (replaces Attorney Pricing Band.png,
   2026-09-16 — same reason as the tier cards: on-brand, editable, no
   image round-trip for a text/price change). ────────────────────────── */

.lw-bands {
	max-width: 920px;
	margin: 1.5rem auto 0;
	background: #fff;
	border-radius: var(--lw-radius);
	box-shadow: var(--lw-lift-dark);
	overflow: hidden;
}
.lw-bands__table { width: 100%; border-collapse: collapse; }

.lw-bands__head {
	padding: 0.85rem 1rem;
	color: #fff;
	font-family: var(--lw-font-head);
	font-weight: 700;
	font-size: 0.8rem;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	text-align: left;
}
.lw-bands__head--attorneys { background: var(--lw-canvas-alt); color: var(--lw-navy); font-size: 0.7rem; line-height: 1.3; }
.lw-bands__head--standard { background: var(--lw-navy); }
.lw-bands__head--premium  { background: var(--lw-red); }
.lw-bands__head--gold     { background: var(--lw-gold); color: var(--lw-navy); }

.lw-bands__table td {
	padding: 0.75rem 1rem;
	border-top: 1px solid var(--lw-border);
	vertical-align: top;
}
.lw-bands__table tbody tr:nth-child(even) td { background: var(--lw-canvas-alt); }
.lw-bands__range {
	font-family: var(--lw-font-head);
	font-weight: 700;
	font-size: 0.85rem;
	color: var(--lw-navy);
	white-space: nowrap;
}
.lw-bands__promo {
	display: inline-block;
	background: var(--lw-red);
	color: #fff;
	font-size: 0.62rem;
	font-weight: 700;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	border-radius: 999px;
	padding: 0.15rem 0.55rem;
	margin-bottom: 0.3rem;
}
.lw-bands__price {
	display: block;
	font-family: var(--lw-font-head);
	font-weight: 700;
	font-size: 0.95rem;
	color: var(--lw-navy);
}
.lw-bands__billed { display: block; font-size: 0.72rem; color: var(--lw-muted); }
.lw-bands__was { display: block; margin-top: 0.15rem; font-size: 0.68rem; color: var(--lw-red); }

@media (max-width: 640px) {
	.lw-bands__head, .lw-bands__table td { padding: 0.55rem 0.5rem; }
	.lw-bands__head { font-size: 0.65rem; }
	.lw-bands__price { font-size: 0.82rem; }
}

/* ── Tier cards (replaces the old Membership Tiers.png, 2026-09-16) ───── */

.lw-tiers {
	margin-top: 2.5rem;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
	/* stretch (default, kept explicit) — Alice, 2026-09-16: all three cards
	   must end at the same bottom edge, not size to their own content. */
	align-items: stretch;
}
@media (max-width: 900px) {
	.lw-tiers { grid-template-columns: minmax(0, 1fr); max-width: 420px; margin-left: auto; margin-right: auto; }
}

.lw-tier {
	background: #fff;
	border-radius: var(--lw-radius);
	box-shadow: var(--lw-lift-dark);
	overflow: hidden;
	display: flex;
	flex-direction: column;
}

.lw-tier__head {
	flex: none;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.4rem;
	padding: 1.5rem 1rem 1.75rem;
	color: #fff;
	clip-path: polygon(0 0, 100% 0, 100% 82%, 50% 100%, 0 82%);
}
/* Standard's navy head sits on the section's own navy background — a
   thin white inset line (Alice, 2026-09-16) keeps its edge visible where
   Premium's red and Gold's gold already have natural contrast. */
.lw-tier--standard .lw-tier__head {
	background: linear-gradient(160deg, var(--lw-navy) 0%, var(--lw-navy-ink) 100%);
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.55);
}
.lw-tier--premium  .lw-tier__head { background: linear-gradient(160deg, var(--lw-red) 0%, var(--lw-red-dark) 100%); }
.lw-tier--gold     .lw-tier__head { background: linear-gradient(160deg, var(--lw-gold-light) 0%, var(--lw-gold) 100%); }

.lw-tier__icon { width: 34px; height: 34px; }
.lw-tier__icon svg { width: 100%; height: 100%; }
.lw-tier__name {
	font-family: var(--lw-font-head);
	font-weight: 700;
	font-size: 1.1rem;
	letter-spacing: 0.04em;
}

.lw-tier__body {
	flex: 1;
	display: flex;
	flex-direction: column;
	padding: 1.5rem 1.5rem 2rem;
	text-align: center;
}

.lw-tier__status {
	display: inline-block;
	border-radius: 999px;
	padding: 0.3rem 0.9rem;
	font-size: 0.7rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}
.lw-tier__status--active { background: var(--lw-red); color: #fff; }
.lw-tier__status--soon   { background: var(--lw-canvas-alt); color: var(--lw-muted); }

.lw-tier__price {
	margin: 0.85rem 0 0;
	font-family: var(--lw-font-head);
	font-weight: 700;
	font-size: 2rem;
	color: var(--lw-navy);
}
.lw-tier__price span { font-size: 0.9rem; font-weight: 500; color: var(--lw-muted); }

.lw-tier__billed { margin: 0.15rem 0 0; font-size: 0.8rem; color: var(--lw-muted); }

.lw-tier__banner {
	margin: 0.85rem 0 0;
	display: inline-block;
	border: 1px solid var(--lw-red);
	border-radius: 999px;
	padding: 0.35rem 0.9rem;
	font-size: 0.72rem;
	font-weight: 700;
	color: var(--lw-red);
}
/* Reserves the same space as a real banner without showing one — keeps
   the price/ticks aligned across all three cards (see membership.php). */
.lw-tier__banner--placeholder { visibility: hidden; border-color: transparent; }

.lw-tier__list { list-style: none; margin: 1.5rem 0 0; padding: 0; text-align: left; }
.lw-tier__list li {
	display: flex;
	align-items: flex-start;
	gap: 0.6rem;
	padding: 0.45rem 0;
	font-size: 0.85rem;
	color: var(--lw-body);
	border-top: 1px solid var(--lw-border);
}
.lw-tier__list li:first-child { border-top: none; }
.lw-tier__check { width: 17px; height: 17px; flex: none; margin-top: 0.1em; color: var(--lw-red); }

/* ═══════════════════════════════════════════════════════════════
   PILOT LAUNCH (was "What Happens Next" — redesigned 2026-09-16,
   Alice's two-column reference mockup + her own supplied graphic)
   ═══════════════════════════════════════════════════════════════ */

.lw-sec.lw-pilot { background: var(--lw-canvas); }

.lw-pilot__inner {
	max-width: var(--lw-max);
	margin: 0 auto;
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 0.85fr);
	gap: 3rem;
	align-items: center;
}
@media (max-width: 900px) {
	.lw-pilot__inner { grid-template-columns: minmax(0, 1fr); gap: 2rem; }
	.lw-pilot__visual { order: -1; max-width: 360px; margin: 0 auto; }
}

.lw-pilot__content .lw-sec__lead {
	text-align: left;
	max-width: none;
	margin-left: 0;
	margin-right: 0;
}

.lw-pilot__badge {
	display: inline-block;
	background: var(--lw-orange);
	color: var(--lw-navy);
	font-family: var(--lw-font-head);
	font-weight: 700;
	font-size: 1.6rem;
	padding: 0.4rem 1.1rem;
	border-radius: var(--lw-radius-sm);
}
.lw-pilot__live {
	margin: 0.9rem 0 1.25rem;
	color: var(--lw-red);
	font-family: var(--lw-font-head);
	font-weight: 700;
	font-size: 1rem;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	position: relative;
	padding-bottom: 0.75rem;
}
.lw-pilot__live::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 48px;
	height: 3px;
	background: var(--lw-red);
	border-radius: 2px;
}

.lw-pilot__sub {
	font-family: var(--lw-font-head);
	font-weight: 700;
	font-size: var(--lw-subhead);
	color: var(--lw-navy);
	margin: 1.5rem 0 0.75rem;
	line-height: 1.5;
}

.lw-pilot__content .lw-btn { margin-top: 1.5rem; }

.lw-pilot__visual img {
	display: block;
	width: 100%;
	height: auto;
}

/* ═══════════════════════════════════════════════════════════════
   FAQS
   ═══════════════════════════════════════════════════════════════ */

.lw-faqs__inner { max-width: 46rem; }

.lw-faqs__list { margin-top: 2.5rem; }

.lw-faq {
	border-bottom: 1px solid var(--lw-border);
}
.lw-faq__q {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	background: none;
	border: none;
	cursor: pointer;
	padding: 1.1rem 0;
	text-align: left;
	font-family: var(--lw-font);
	font-weight: 700;
	font-size: 0.92rem;
	color: var(--lw-navy);
}
.lw-faq__icon {
	flex-shrink: 0;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: var(--lw-canvas-alt);
	color: var(--lw-red);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1rem;
	line-height: 1;
	transition: transform 0.2s ease, background-color 0.2s ease;
}
.lw-faq.is-open .lw-faq__icon {
	background: var(--lw-red);
	color: #fff;
	transform: rotate(45deg);
}

.lw-faq__a {
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.3s ease;
}
.lw-faq__a > p {
	margin: 0;
	padding-right: 2.5rem;
	padding-bottom: 1.1rem;
	font-size: 0.85rem;
	color: var(--lw-muted);
	line-height: 1.65;
}
/* 2026-09-16 — bumped from 400px: the new FAQ copy runs several
   paragraphs per answer (up to five on the longest), and 400px was
   clipping them once open. High enough to clear any answer at any
   viewport width without needing to measure real content height. */
.lw-faq.is-open .lw-faq__a { max-height: 1400px; }

.lw-faqs__still {
	text-align: center;
	margin: 2rem 0 0;
	font-weight: 700;
	color: var(--lw-navy);
	font-size: 0.95rem;
}
.lw-faqs__still a { color: inherit; text-decoration: none; }
.lw-faqs__still a:hover { color: var(--lw-red); text-decoration: underline; }

/* ═══════════════════════════════════════════════════════════════
   FOOTER
   ═══════════════════════════════════════════════════════════════ */

.lw-footer {
	background: var(--lw-navy);
	padding: 2.5rem 1.5rem 1.75rem;
}
.lw-footer__inner {
	max-width: var(--lw-max);
	margin: 0 auto;
	text-align: center;
}
.lw-footer__logo {
	display: block;
	height: 34px;
	width: auto;
	margin: 0 auto;
}

.lw-footer__cols {
	margin-top: 2.25rem;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 2rem;
	text-align: left;
}
@media (max-width: 640px) {
	.lw-footer__cols { grid-template-columns: minmax(0, 1fr); text-align: center; }
}
.lw-footer__col-title {
	margin: 0 0 0.75rem;
	color: rgba(255, 255, 255, 0.55);
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}
.lw-footer__col ul { list-style: none; margin: 0; padding: 0; }
.lw-footer__col li + li { margin-top: 0.5rem; }
.lw-footer__col a { color: #fff; font-size: 0.82rem; text-decoration: none; }
.lw-footer__col a:hover { color: var(--lw-red); }
.lw-footer__col--disclaimer p {
	margin: 0;
	color: rgba(255, 255, 255, 0.55);
	font-size: 0.78rem;
	line-height: 1.5;
}

.lw-footer__bottom {
	margin-top: 1.75rem;
	padding-top: 1.25rem;
	border-top: 1px solid rgba(255, 255, 255, 0.12);
	text-align: center;
	font-size: 0.75rem;
	color: rgba(255, 255, 255, 0.45);
}

/* ═══════════════════════════════════════════════════════════════
   THE WAITLIST POPUP + QUESTIONNAIRE MODAL
   ═══════════════════════════════════════════════════════════════ */

.lw-modal-overlay {
	position: fixed;
	inset: 0;
	background: rgba(1, 28, 60, 0.72);
	display: none;
	align-items: center;
	justify-content: center;
	padding: 1.5rem;
	z-index: 1000;
}
.lw-modal-overlay.is-visible { display: flex; }

.lw-modal {
	position: relative;
	background: #fff;
	border-radius: var(--lw-radius);
	max-width: 480px;
	width: 100%;
	max-height: 90vh;
	overflow-y: auto;
	padding: 2rem 1.75rem 1.75rem;
	box-shadow: 0 24px 60px rgba(0, 0, 0, 0.35);
}

.lw-modal__close {
	position: absolute;
	top: 0.85rem;
	right: 0.85rem;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	border: none;
	background: var(--lw-canvas-alt);
	color: var(--lw-navy);
	font-size: 1.1rem;
	line-height: 1;
	cursor: pointer;
}
.lw-modal__close:hover { background: var(--lw-border); }

.lw-quiz-progress {
	height: 4px;
	background: var(--lw-canvas-alt);
	border-radius: 2px;
	margin-bottom: 1.5rem;
	overflow: hidden;
}
.lw-quiz-progress__bar {
	height: 100%;
	width: 9%;
	background: var(--lw-red);
	border-radius: 2px;
	transition: width 0.25s ease;
}

.lw-quiz-step { display: none; text-align: center; }
.lw-quiz-step.is-active { display: block; }

.lw-quiz__title, .lw-quiz__q {
	font-family: var(--lw-font-head);
	font-weight: 700;
	font-size: var(--lw-subhead);
	color: var(--lw-navy);
	margin: 0 0 1.25rem;
	line-height: 1.4;
}

.lw-quiz-form {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	text-align: left;
}
.lw-quiz-form input,
.lw-quiz-form select {
	width: 100%;
	padding: 0.75rem 0.9rem;
	font-size: 0.88rem;
	font-family: var(--lw-font);
	border: 1px solid var(--lw-border);
	border-radius: var(--lw-radius-sm);
	background: #fff;
	color: var(--lw-body);
}
.lw-quiz-form input:focus,
.lw-quiz-form select:focus {
	outline: none;
	border-color: var(--lw-navy);
}
.lw-hp {
	position: absolute !important;
	left: -9999px !important;
	width: 1px; height: 1px;
	opacity: 0;
}

.lw-modal__privacy {
	margin: 1rem 0 0;
	font-size: 0.72rem;
	color: var(--lw-muted);
	line-height: 1.5;
}

.lw-quiz-slider {
	width: 100%;
	margin: 0.5rem 0;
	accent-color: var(--lw-red);
}
.lw-quiz-slider__value {
	font-family: var(--lw-font-head);
	font-weight: 700;
	color: var(--lw-red);
	font-size: 1.2rem;
	margin: 0 0 1.25rem;
}

.lw-quiz-checklist {
	text-align: left;
	display: flex;
	flex-direction: column;
	gap: 0.6rem;
	margin-bottom: 1.5rem;
}
.lw-quiz-checklist label {
	display: flex;
	align-items: flex-start;
	gap: 0.6rem;
	font-size: 0.85rem;
	color: var(--lw-body);
}
.lw-quiz-checklist input { margin-top: 3px; accent-color: var(--lw-red); }

.lw-quiz-textarea {
	width: 100%;
	padding: 0.75rem 0.9rem;
	font-family: var(--lw-font);
	font-size: 0.85rem;
	color: var(--lw-body);
	border: 1px solid var(--lw-border);
	border-radius: var(--lw-radius-sm);
	resize: vertical;
	margin-bottom: 1.25rem;
}
.lw-quiz-textarea:focus { outline: none; border-color: var(--lw-navy); }

.lw-quiz-choices {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6rem;
	justify-content: center;
	margin-bottom: 0.5rem;
}

.lw-btn--ghost-red {
	background: #fff;
	color: var(--lw-red);
	border: 1.5px solid var(--lw-red);
	padding: 0.65rem 1.3rem;
	font-size: 0.85rem;
}
.lw-btn--ghost-red:hover { background: var(--lw-red); color: #fff; }

.lw-quiz-next { width: 100%; padding: 0.8rem; }

@media (max-width: 480px) {
	.lw-modal { padding: 1.5rem 1.25rem 1.25rem; }
}

/* ═══════════════════════════════════════════════════════════════
   ABOUT PAGE (added 2026-09-16)
   ═══════════════════════════════════════════════════════════════ */

.lw-about { padding-top: 4rem; } /* header isn't fixed, but this page has no hero to lead into it */
.lw-about__inner { max-width: 42rem; text-align: left; }
.lw-about__eyebrow { margin-bottom: 0.5rem; }
.lw-about .lw-sec__title { text-align: left; margin-left: 0; }
.lw-about .lw-sec__title::after { margin-left: 0; }
.lw-about .lw-sec__lead { text-align: left; max-width: none; margin-left: 0; margin-right: 0; }

.lw-about__statement {
	margin: 1.75rem 0;
	padding: 1.25rem 1.5rem;
	border-left: 4px solid var(--lw-red);
	background: var(--lw-canvas-alt);
	font-family: var(--lw-font-head);
	font-weight: 700;
	font-size: 1.05rem;
	color: var(--lw-navy);
	line-height: 1.5;
}

.lw-about__tagline {
	margin: 2rem 0 0.75rem;
	font-family: var(--lw-font-head);
	font-weight: 700;
	font-size: 0.95rem;
	letter-spacing: 0.03em;
	color: var(--lw-red);
	text-align: center;
}

.lw-about__linkedin {
	display: block;
	text-align: center;
	font-weight: 600;
	color: var(--lw-navy);
}
.lw-about__linkedin:hover { color: var(--lw-red); }

.lw-about__actions {
	margin-top: 2.5rem;
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
}
@media (max-width: 480px) {
	.lw-about__actions { flex-direction: column; }
	.lw-about__actions .lw-btn { text-align: center; }
}

.lw-btn--ghost-navy {
	background: #fff;
	color: var(--lw-navy);
	border: 1.5px solid var(--lw-navy);
}
.lw-btn--ghost-navy:hover { background: var(--lw-navy); color: #fff; }

/* ═══════════════════════════════════════════════════════════════
   PHONES (Alice, 2026-10-08): use the whole screen, never clip.
   Cards were clipped on a real handset because (a) every grid column was
   `1fr`, which cannot shrink below its widest content, (b) the LARIA flow
   was a nowrap row of four steps, and (c) 2rem of padding on the section AND
   2rem inside each card left only ~230px for content on a 360px screen.
   ═══════════════════════════════════════════════════════════════ */
@media (max-width: 640px) {
	.lw-sec { padding-left: 1rem; padding-right: 1rem; }

	.lw-laria-card__body { padding: 1.25rem 1rem; gap: 1.5rem; }
	.lw-laria-card__topbar { padding: 0.9rem 1rem; }
	.lw-laria-card__body > *,
	.lw-laria-card__main > * { min-width: 0; }
	.lw-laria-card__main > p { font-size: 0.95rem; }

	/* 01 02 / 03 04 instead of one cramped row of four */
	.lw-laria-flow {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 1.25rem 0.75rem;
	}
	.lw-laria-flow .lw-authority__arrow { display: none; }
	.lw-laria-flow__step strong { font-size: 0.78rem; }
	.lw-laria-flow__step span:not(.lw-authority__num) { font-size: 0.78rem; }

	.lw-laria-why { padding: 0.9rem 1rem; }
	.lw-laria-why p { font-size: 0.9rem; }
	.lw-laria-card__proof { padding: 1.25rem 1.1rem; }
	.lw-laria-card__proof li { font-size: 0.88rem; }

	/* long words and links never push a box wider than the screen */
	.lw-sec p, .lw-sec li, .lw-sec h2, .lw-sec h3, .lw-sec h4 { overflow-wrap: anywhere; }
}

/* ── PHONES, round 2 (Alice, 2026-10-08) ─────────────────────────── */

/* A "swipe" cue above the two wide tables. Phones only. */
.lw-swipe-hint { display: none; }

@media (max-width: 640px) {
	.lw-swipe-hint {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 0.4rem;
		margin: 1.25rem 0 0;
		color: #fff;
		font-size: 0.8rem;
		font-weight: 600;
		letter-spacing: 0.02em;
	}
	.lw-swipe-hint span { font-size: 1.1rem; line-height: 1; }
	.lw-swipe-hint + .lw-compare__scroll,
	.lw-swipe-hint + .lw-bands { margin-top: 0.75rem; }

	/* The pricing band was clipped (overflow hidden), so its Gold column
	   could not be reached. Let it scroll, like the comparison table. */
	.lw-bands { overflow-x: auto; -webkit-overflow-scrolling: touch; }
	.lw-bands__table { min-width: 32rem; }

	/* Lawryse Shorts: the phone sits top-left and the copy wraps around it,
	   then runs full width underneath, like text in an article. Copy is 1px
	   smaller than before. */
	.lw-more__twocol { display: flow-root; }
	.lw-more__twocol .lw-more__preview {
		float: left;
		width: 42%;
		max-width: 11rem;
		margin: 0 1rem 0.5rem 0;
	}
	.lw-more__twocol .lw-more__body {
		font-size: 0.7375rem;
		line-height: 1.55;
	}

	/* The big call-to-action button: centred, wraps instead of clipping, and
	   a touch smaller. */
	.lw-btn--lg.lw-cta-trigger {
		white-space: normal;
		text-align: center;
		font-size: 0.88rem;
		padding: 0.9rem 1rem;
	}
	.lw-pilot__content .lw-btn {
		display: block;
		width: 100%;
		max-width: 22rem;
		margin-left: auto;
		margin-right: auto;
		box-sizing: border-box;
	}
}

/* ═══════════════════════════════════════════════════════════════
   "SEE MORE COMPARISONS" LINK + POPUP (Alice, 2026-10-08)
   ═══════════════════════════════════════════════════════════════ */

.lw-compare__more { text-align: center; margin: 1.25rem 0 0; }
.lw-compare__more-link {
	background: none;
	border: 0;
	padding: 0.25rem 0.5rem;
	color: #fff;
	font: inherit;
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 3px;
	cursor: pointer;
}
.lw-compare__more-link:hover,
.lw-compare__more-link:focus-visible { text-decoration: none; }

body.lw-no-scroll { overflow: hidden; }
.lw-modal-overlay[hidden] { display: none !important; }

/* The comparison image is wide, so this box is too. On a phone the image keeps
   a readable minimum width and the box scrolls sideways (with a hint). */
.lw-modal.lw-modal--wide {
	max-width: min(1400px, 100%);
	padding: 3rem 1rem 1rem;
}
.lw-modal__title {
	margin: 0 0 0.75rem;
	padding-right: 2.5rem;
	font-family: var(--lw-font-head);
	font-size: 1.15rem;
	color: var(--lw-navy);
}
.lw-modal__scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.lw-compare__image { display: block; width: 100%; height: auto; min-width: 760px; border-radius: 6px; }
.lw-modal .lw-swipe-hint--dark { color: var(--lw-red); margin: 0 0 0.5rem; }
@media (min-width: 900px) {
	.lw-modal .lw-swipe-hint { display: none; }
}

/* Consent tick box on the waitlist form (the signup API refuses a registration without it). */
.lw-quiz-consent {
	display: flex;
	align-items: flex-start;
	gap: 0.5rem;
	font-size: 0.88rem;
	font-family: var(--lw-font);
	color: var(--lw-body);
	line-height: 1.4;
	text-align: left;
}
.lw-quiz-consent input {
	margin-top: 0.2rem;
	flex-shrink: 0;
	width: 1rem;
	height: 1rem;
}
.lw-modal__privacy a { color: inherit; text-decoration: underline; }
.lw-quiz-consent a { color: var(--lw-red); text-decoration: underline; }

/* Discreet country flag in the footer (Alice, 2026-10-16): every landing page, not the header. */
.lw-footer__bottom { position: relative; }
.lw-footer__country { display: inline-flex; align-items: center; gap: 0.4rem; position: absolute; left: 0; top: 50%; margin-top: 0.6rem; transform: translateY(-50%); }
@media (max-width: 720px) { .lw-footer__country { position: static; transform: none; margin: 0.6rem 0 0; display: flex; justify-content: center; } }
.lw-footer__flag { display: inline-block; border-radius: 2px; box-shadow: 0 0 0 1px rgba(255,255,255,0.25); }

/* ── Feature section (Alice, 2026-10-16): replaces Explore the Platform + More Ways ── */
.lw-sec.lw-feat { background: var(--lw-canvas-alt, #f4f6fa); padding-top: 3rem; padding-bottom: 3rem; }
.lw-feat__rule { display: block; width: 4.5rem; height: 2px; margin: 0 auto 1.1rem; background: var(--lw-red); }
.lw-feat__rule--end { margin-top: 2.5rem; }
.lw-feat__intro { max-width: 46rem; margin-left: auto; margin-right: auto; }
.lw-feat__list { display: grid; gap: 1.25rem; margin-top: 2rem; max-width: 62rem; margin-left: auto; margin-right: auto; }
.lw-feat__row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1.75rem; align-items: center; background: #fff; border-radius: 14px; padding: 0.9rem; box-shadow: 0 2px 14px rgba(1, 28, 60, 0.07); }
.lw-feat__media { margin: 0; }
.lw-feat__media img { display: block; width: 100%; height: auto; border-radius: 10px; }
.lw-feat__text { padding: 0.4rem 0.9rem 0.4rem 0; }
.lw-feat__kicker { display: block; margin-bottom: 0.35rem; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--lw-red); }
.lw-feat__title { margin: 0 0 0.6rem; font-family: var(--lw-font-head); font-size: clamp(1.25rem, 2vw, 1.55rem); line-height: 1.2; color: var(--lw-navy); }
.lw-feat__text p { margin: 0 0 0.6rem; font-size: 0.92rem; line-height: 1.6; color: var(--lw-body); }
.lw-feat__icons { display: flex; flex-wrap: wrap; gap: 1.1rem 1.6rem; margin: 0.9rem 0 0; padding: 0; list-style: none; }
.lw-feat__icons li { display: flex; flex-direction: column; align-items: flex-start; gap: 0.3rem; font-size: 0.78rem; font-weight: 700; color: var(--lw-navy); }
.lw-feat__icons svg { width: 1.7rem; height: 1.7rem; fill: none; stroke: var(--lw-red); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.lw-feat__closing { margin: 0; text-align: center; font-family: var(--lw-font-head); font-size: clamp(1.15rem, 2vw, 1.4rem); font-weight: 700; color: var(--lw-navy); }
@media (max-width: 760px) {
	.lw-feat__row { grid-template-columns: minmax(0, 1fr); gap: 0.9rem; }
	.lw-feat__text { padding: 0 0.4rem 0.5rem; }
}

/* Take Control section on the dark navy (Alice, 2026-10-16); the white blocks stay as they are. */
.lw-sec.lw-feat { background: var(--lw-navy); }
.lw-feat .lw-sec__title { color: #fff; }
.lw-feat .lw-sec__lead { color: rgba(255, 255, 255, 0.82); }
.lw-feat__closing { color: #fff; }

/* What Happens Next, centred (Alice, 2026-10-16): the waitlist version's styles, restored (the US theme was copied from join, which has a different layout). */
.lw-next { padding-top: 0; }

/* White ground (Alice, 2026-09-09) — was a full navy banner; reverted so
   the navy Membership section above it doesn't run straight into more
   navy. Title + eyebrow flip to dark accents. */
.lw-sec.lw-next { background: var(--lw-canvas); }
.lw-next__banner {
	background: none;
	padding: 2.5rem 1.5rem 0;
	text-align: center;
}
.lw-next__title {
	color: var(--lw-navy);
	margin: 0 0 0.75rem;
}
.lw-next__highlight {
	margin: 0;
	color: var(--lw-red);
	font-family: var(--lw-font-head);
	font-weight: 700;
	font-size: 1rem;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.lw-next .lw-sec__inner { padding-top: 2.5rem; text-align: center; }

.lw-next__lead {
	/* h3 sub-head — see .lw-sec__subhead (one shared size, 1.15rem / 700). */
	font-family: var(--lw-font-head);
	font-weight: 700;
	font-size: var(--lw-subhead);
	color: var(--lw-navy);
	max-width: 44rem;
	margin: 0 auto 1.5rem;
	line-height: 1.5;
}

.lw-next .lw-sec__lead--center { margin-bottom: 1.5rem; }

.lw-next__cta { margin-top: 1.5rem; }


/* Quiz popup, a little smaller (Alice, 2026-10-16): tighter width, padding, fields and text. */
.lw-modal { max-width: 410px; max-height: 86vh; padding: 1.4rem 1.4rem 1.2rem; }
.lw-modal__close { top: 0.65rem; right: 0.65rem; width: 26px; height: 26px; font-size: 1rem; }
.lw-quiz-progress { margin-bottom: 1rem; }
.lw-quiz__title, .lw-quiz__q { font-size: 1.05rem; margin: 0 0 0.85rem; line-height: 1.35; }
.lw-quiz-form { gap: 0.5rem; }
.lw-quiz-form input, .lw-quiz-form select { padding: 0.55rem 0.8rem; font-size: 0.84rem; }
.lw-quiz-consent { font-size: 0.8rem; line-height: 1.35; }
.lw-quiz-next { padding: 0.65rem; }
.lw-modal__privacy { margin-top: 0.7rem; font-size: 0.68rem; line-height: 1.4; }
.lw-quiz-choices { gap: 0.45rem; }
.lw-quiz-choices .lw-btn, .lw-btn--ghost-red { padding: 0.5rem 1rem; font-size: 0.8rem; }
@media (max-width: 480px) { .lw-modal { padding: 1.2rem 1rem 1rem; } }

/* Quiz: back arrow, 'select up to three' list with descriptions, Other box (Alice, 2026-10-16) */
.lw-quiz-top { display: flex; align-items: center; gap: 0.6rem; margin: 0 2rem 1rem 0; }
.lw-quiz-top .lw-quiz-progress { flex: 1; margin-bottom: 0; }
.lw-quiz-back { flex: none; width: 26px; height: 26px; padding: 0; border: 0; border-radius: 50%; background: var(--lw-canvas-alt); color: var(--lw-navy); font-size: 1rem; line-height: 1; cursor: pointer; }
.lw-quiz-back:hover { background: var(--lw-border); }
.lw-quiz-back[hidden] { display: none; }
.lw-quiz-hint { margin: -0.4rem 0 0.7rem; font-size: 0.85rem; color: var(--lw-muted); }
.lw-quiz-checklist label { display: flex; align-items: flex-start; gap: 0.55rem; text-align: left; font-size: 0.86rem; line-height: 1.35; cursor: pointer; }
.lw-quiz-checklist label strong { color: var(--lw-navy); }
.lw-quiz-checklist input[type="checkbox"]:disabled + span { opacity: 0.5; }
.lw-quiz-other { display: block; width: calc(100% - 1.6rem); margin: 0.3rem 0 0 1.6rem; padding: 0.5rem 0.7rem; font-size: 0.85rem; border: 1px solid var(--lw-border); border-radius: var(--lw-radius-sm); }