/* =========================================================================
   Legal Pages — main stylesheet
   1. Fonts & tokens        5. Buttons & shared components
   2. Reset & base          6. Landing sections (in page order)
   3. Accessibility         7. Blog / standard templates
   4. Header & navigation   8. Responsive breakpoints
   ========================================================================= */

/* 1. Fonts & design tokens
   ------------------------------------------------------------------------- */
@font-face {
	font-family: "Fira Sans";
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("../fonts/firasans-600-latin.woff2") format("woff2");
}

@font-face {
	font-family: "Fira Sans";
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url("../fonts/firasans-700-latin.woff2") format("woff2");
}

@font-face {
	font-family: "Fira Sans";
	font-style: normal;
	font-weight: 800;
	font-display: swap;
	src: url("../fonts/firasans-800-latin.woff2") format("woff2");
}

@font-face {
	font-family: "Open Sans";
	font-style: normal;
	font-weight: 300 800;
	font-display: swap;
	src: url("../fonts/opensans-latin.woff2") format("woff2");
}

:root {
	/* Brand */
	--lp-purple: #6c47ff;
	--lp-purple-dark: #5334e0;
	--lp-purple-soft: #8b7cf7;
	--lp-purple-tint: #f6f3ff;
	--lp-purple-tint-2: #f1ebff;

	/* Ink & surfaces */
	--lp-ink: #0f0d1a;
	--lp-ink-soft: #4b4760;
	--lp-ink-mute: #7a7690;
	--lp-surface: #ffffff;
	--lp-surface-2: #f8f7fd;
	--lp-surface-3: #f5f5f9;
	--lp-border: #e7e4f2;

	/* Dark sections */
	--lp-dark: #0f0d1a;
	--lp-dark-2: #16122b;
	--lp-dark-3: #1e1a36;
	--lp-dark-glow: #21174e;
	--lp-dark-glow-2: #37257c;
	--lp-dark-border: rgba(255, 255, 255, 0.1);
	--lp-dark-text: #b8b3cf;

	/* Status */
	--lp-green: #22a06b;
	--lp-green-soft: #4ade80;
	--lp-red: #e5484d;
	--lp-orange: #f59e0b;
	--lp-teal: #14b8a6;

	/* Type */
	--lp-font-display: "Fira Sans", "Segoe UI", -apple-system, sans-serif;
	--lp-font-body: "Open Sans", "Segoe UI", -apple-system, sans-serif;

	/* Layout & effects */
	--lp-container: 75rem;
	--lp-radius-sm: 0.625rem;
	--lp-radius: 1rem;
	--lp-radius-lg: 1.5rem;
	--lp-shadow-sm: 0 1px 2px rgba(15, 13, 26, 0.05), 0 2px 8px rgba(15, 13, 26, 0.04);
	--lp-shadow: 0 4px 12px rgba(15, 13, 26, 0.06), 0 12px 32px rgba(15, 13, 26, 0.08);
	--lp-shadow-lg: 0 16px 40px rgba(15, 13, 26, 0.14), 0 32px 80px rgba(15, 13, 26, 0.14);
	--lp-shadow-purple: 0 8px 24px rgba(108, 71, 255, 0.35);
	--lp-ease: cubic-bezier(0.22, 1, 0.36, 1);
	--lp-header-h: 4rem;
}

/* 2. Reset & base
   ------------------------------------------------------------------------- */
*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
	scroll-padding-top: calc(var(--lp-header-h) + 1rem);
}

body {
	margin: 0;
	font-family: var(--lp-font-body);
	font-size: 1.0625rem;
	line-height: 1.6;
	color: var(--lp-ink);
	background: var(--lp-surface);
	-webkit-font-smoothing: antialiased;
	overflow-x: clip;
}

img,
svg,
video {
	max-width: 100%;
	height: auto;
	vertical-align: middle;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: var(--lp-font-display);
	line-height: 1.15;
	margin: 0 0 0.75em;
	overflow-wrap: break-word;
}

p {
	margin: 0 0 1em;
}

a {
	color: var(--lp-purple);
	text-decoration: none;
	transition: color 0.2s var(--lp-ease);
}

a:hover {
	color: var(--lp-purple-dark);
}

button {
	font: inherit;
	cursor: pointer;
}

ul,
ol {
	margin: 0 0 1em;
	padding-left: 1.25em;
}

table {
	border-collapse: collapse;
	width: 100%;
}

:focus-visible {
	outline: 2px solid var(--lp-purple);
	outline-offset: 2px;
	border-radius: 2px;
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}

/* 3. Accessibility helpers
   ------------------------------------------------------------------------- */
.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

.skip-link {
	position: absolute;
	top: -100%;
	left: 1rem;
	z-index: 1000;
	padding: 0.75rem 1.25rem;
	background: var(--lp-purple);
	color: #fff;
	border-radius: 0 0 var(--lp-radius-sm) var(--lp-radius-sm);
	font-weight: 600;
}

.skip-link:focus {
	top: 0;
	clip-path: none;
	width: auto;
	height: auto;
	color: #fff;
}

/* Layout container */
.lp-container {
	width: min(100% - 3rem, var(--lp-container));
	margin-inline: auto;
}

.lp-container--narrow {
	--lp-container: 62rem;
}

/* Scroll-reveal animation (JS adds .is-revealed; no-JS stays visible) */
@media (prefers-reduced-motion: no-preference) {
	.js [data-reveal] {
		opacity: 0;
		translate: 0 28px;
		transition: opacity 0.7s var(--lp-ease), translate 0.7s var(--lp-ease);
	}

	.js [data-reveal].is-revealed {
		opacity: 1;
		translate: 0 0;
	}
}

/* 4. Header & navigation
   ------------------------------------------------------------------------- */
.lp-header {
	position: sticky;
	top: 0;
	z-index: 100;
	background: rgba(255, 255, 255, 0.85);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	transition: box-shadow 0.3s var(--lp-ease);
}

.lp-header.is-stuck {
	box-shadow: 0 1px 0 var(--lp-border), 0 8px 24px rgba(15, 13, 26, 0.06);
}

.lp-header__inner {
	display: flex;
	align-items: center;
	gap: 1.5rem;
	min-height: var(--lp-header-h);
}

.lp-header__brand {
	flex: 1;
	display: flex;
}

.lp-logo,
.custom-logo-link {
	display: inline-flex;
	align-items: center;
	gap: 0.55rem;
}

.lp-logo__text {
	font-family: var(--lp-font-display);
	font-weight: 800;
	font-size: 1.125rem;
	letter-spacing: -0.02em;
	color: var(--lp-ink);
}

.lp-logo:hover .lp-logo__text {
	color: var(--lp-purple);
}

.lp-nav__list {
	display: flex;
	gap: 0.25rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.lp-nav__list a {
	display: inline-block;
	padding: 0.5rem 0.875rem;
	font-size: 0.9375rem;
	font-weight: 500;
	color: var(--lp-ink-soft);
	border-radius: 0.5rem;
	transition: color 0.2s var(--lp-ease), background 0.2s var(--lp-ease);
}

.lp-nav__list a:hover,
.lp-nav__list .current-menu-item > a {
	color: var(--lp-ink);
	background: var(--lp-surface-2);
}

.lp-header__actions {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 1rem;
}

.lp-header__login {
	font-size: 0.9375rem;
	font-weight: 500;
	color: var(--lp-ink-soft);
}

.lp-header__login:hover {
	color: var(--lp-ink);
}

/* Mobile menu */
.lp-nav-toggle {
	display: none;
	background: none;
	border: 0;
	padding: 0.5rem;
	margin-right: -0.5rem;
}

.lp-nav-toggle__bars {
	display: grid;
	gap: 5px;
	width: 22px;
}

.lp-nav-toggle__bars span {
	height: 2px;
	border-radius: 2px;
	background: var(--lp-ink);
	transition: 0.3s var(--lp-ease);
	transform-origin: center;
}

.lp-nav-toggle[aria-expanded="true"] .lp-nav-toggle__bars span:nth-child(1) {
	translate: 0 7px;
	rotate: 45deg;
}

.lp-nav-toggle[aria-expanded="true"] .lp-nav-toggle__bars span:nth-child(2) {
	opacity: 0;
}

.lp-nav-toggle[aria-expanded="true"] .lp-nav-toggle__bars span:nth-child(3) {
	translate: 0 -7px;
	rotate: -45deg;
}

/* Full-screen slide-in panel, not an inline dropdown. */
.lp-mobile-menu {
	display: none;
	position: fixed;
	inset: 0;
	z-index: 200;
	flex-direction: column;
	background: var(--lp-surface);
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
}

.lp-mobile-menu.is-open {
	display: flex;
}

@media (prefers-reduced-motion: no-preference) {
	.lp-mobile-menu {
		opacity: 0;
		translate: 0 -8px;
		transition: opacity 0.25s var(--lp-ease), translate 0.25s var(--lp-ease);
	}

	.lp-mobile-menu.is-open {
		opacity: 1;
		translate: 0 0;
	}
}

.lp-mobile-menu__top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0.9rem 1.5rem;
	border-bottom: 1px solid var(--lp-border);
}

.lp-mobile-menu__close {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.5rem;
	height: 2.5rem;
	margin-right: -0.5rem;
	border: 0;
	border-radius: 999px;
	background: var(--lp-surface-2);
	color: var(--lp-ink-soft);
	transition: background 0.2s var(--lp-ease), color 0.2s var(--lp-ease);
}

.lp-mobile-menu__close:hover {
	background: var(--lp-surface-3);
	color: var(--lp-ink);
}

.lp-mobile-menu__nav {
	flex: 1;
	padding: 0.5rem 1.5rem 1.5rem;
}

.lp-mobile-menu__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.lp-mobile-menu__list a {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	padding: 1.1rem 0.25rem;
	font-family: var(--lp-font-display);
	font-size: 1.25rem;
	font-weight: 700;
	letter-spacing: -0.01em;
	color: var(--lp-ink);
	border-bottom: 1px solid var(--lp-surface-3);
	transition: color 0.2s var(--lp-ease);
}

.lp-mobile-menu__list a:hover,
.lp-mobile-menu__list a:active {
	color: var(--lp-purple);
}

.lp-mobile-menu__actions {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 1rem;
	padding: 1.25rem 1.5rem calc(1.5rem + env(safe-area-inset-bottom, 0px));
	border-top: 1px solid var(--lp-border);
}

.lp-mobile-menu__actions .lp-btn {
	width: 100%;
}

.lp-mobile-menu__login {
	text-align: center;
	font-size: 0.9375rem;
	font-weight: 600;
	color: var(--lp-ink-soft);
	padding: 0.5rem;
}

.lp-mobile-menu__login:hover {
	color: var(--lp-ink);
}

/* Lock the page underneath while the panel is open. */
.lp-menu-open {
	overflow: hidden;
}

/* 5. Buttons & shared components
   ------------------------------------------------------------------------- */
.lp-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 0.75rem 1.7rem;
	border: 1px solid transparent;
	border-radius: var(--lp-radius-sm);
	font-family: var(--lp-font-body);
	font-size: 0.9375rem;
	font-weight: 700;
	line-height: 1.2;
	white-space: nowrap;
	transition: background 0.25s var(--lp-ease), color 0.25s var(--lp-ease),
		border-color 0.25s var(--lp-ease), box-shadow 0.25s var(--lp-ease),
		translate 0.25s var(--lp-ease);
}

.lp-btn:hover {
	translate: 0 -2px;
}

.lp-btn:active {
	translate: 0 0;
}

.lp-btn .lp-icon {
	transition: translate 0.25s var(--lp-ease);
}

.lp-btn:hover .lp-icon--arrow-up-right {
	translate: 2px -2px;
}

.lp-btn:hover .lp-icon--arrow-right {
	translate: 3px 0;
}

.lp-btn--primary {
	background: var(--lp-purple);
	color: #fff;
	box-shadow: var(--lp-shadow-purple);
}

.lp-btn--primary:hover {
	background: var(--lp-purple-dark);
	color: #fff;
	box-shadow: 0 12px 32px rgba(108, 71, 255, 0.45);
}

.lp-btn--ghost {
	background: var(--lp-surface);
	color: var(--lp-purple);
	border-color: var(--lp-border);
	box-shadow: var(--lp-shadow-sm);
}

.lp-btn--ghost:hover {
	color: var(--lp-purple-dark);
	border-color: var(--lp-purple-soft);
	box-shadow: var(--lp-shadow);
}

.lp-btn--light {
	background: #fff;
	color: var(--lp-ink);
}

.lp-btn--light:hover {
	background: var(--lp-purple-tint);
	color: var(--lp-ink);
	box-shadow: 0 12px 32px rgba(0, 0, 0, 0.25);
}

.lp-btn--soft {
	background: var(--lp-purple-tint-2);
	color: var(--lp-purple);
}

.lp-btn--soft:hover {
	background: #e5dcff;
	color: var(--lp-purple-dark);
}

.lp-btn--sm {
	padding: 0.625rem 1.25rem;
	font-size: 0.875rem;
}

.lp-cta-pair {
	display: flex;
	justify-content: center;
	gap: 0.8rem;
	flex-wrap: wrap;
}

/* Section headings */
.lp-section-head {
	max-width: 46rem;
	margin: 0 auto 3.5rem;
	text-align: center;
}

.lp-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	margin: 0 0 1.25rem;
	padding: 0.4rem 1rem;
	border-radius: 999px;
	background: var(--lp-purple-tint);
	color: var(--lp-purple);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.lp-eyebrow--dot::before {
	content: "";
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: currentColor;
}

.lp-eyebrow--solid {
	background: #fff;
	color: var(--lp-ink);
}

.lp-section-title {
	margin: 0 0 1rem;
	font-size: clamp(2rem, 4.5vw, 3rem);
	font-weight: 800;
	letter-spacing: -0.025em;
	line-height: 1.08;
}

.lp-section-sub {
	margin: 0 auto;
	max-width: 38rem;
	font-size: 1.0625rem;
	color: var(--lp-ink-mute);
}

.lp-section-head--dark .lp-section-title {
	color: #fff;
}

.lp-section-head--dark .lp-section-sub {
	color: var(--lp-dark-text);
}

.lp-section-head--dark .lp-eyebrow:not(.lp-eyebrow--solid) {
	background: rgba(255, 255, 255, 0.07);
	border: 1px solid var(--lp-dark-border);
	color: #d6d0ee;
}

/* Badges (NEW / PRO / FAST) */
.lp-badge {
	display: inline-flex;
	align-items: center;
	padding: 0.25rem 0.65rem;
	border-radius: 999px;
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #fff;
}

.lp-badge--new {
	background: var(--lp-purple);
}

.lp-badge--pro {
	background: linear-gradient(120deg, #f59e0b, #d97706);
}

.lp-badge--fast {
	background: linear-gradient(120deg, #2dd4bf, #0d9488);
}

/* Check lists */
.lp-checklist {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 0.65rem;
}

.lp-checklist li {
	display: flex;
	align-items: flex-start;
	gap: 0.6rem;
	font-size: 0.9375rem;
}

.lp-checklist .lp-icon--check {
	flex-shrink: 0;
	margin-top: 0.15em;
	color: var(--lp-green-soft);
}

.lp-checklist--dark li {
	color: var(--lp-dark-text);
}

/* 6. Landing sections
   ------------------------------------------------------------------------- */

/* 6.1 Hero */
.lp-hero {
	position: relative;
	padding: 3.5rem 0 0;
	overflow: clip;
}

.lp-hero__bg {
	position: absolute;
	inset: 0;
	z-index: -1;
	background:
		radial-gradient(42rem 30rem at 88% 18%, rgba(255, 190, 120, 0.4), transparent 60%),
		radial-gradient(38rem 28rem at 8% 22%, rgba(216, 180, 255, 0.55), transparent 60%),
		radial-gradient(34rem 26rem at 6% 95%, rgba(255, 244, 165, 0.55), transparent 60%),
		radial-gradient(40rem 30rem at 96% 92%, rgba(255, 205, 160, 0.45), transparent 60%),
		linear-gradient(#fefeff, #fdfcff);
}

/* Faint rounded-tile watermark grid behind the headline (as in the
   mockup). Desktop-only: on narrow screens the same tiles cover
   proportionally more of the hero and read as an obvious grid of
   squares instead of a subtle backdrop, so it's hidden below the
   nav breakpoint to match how the desktop version actually looks. */
@media (min-width: 64em) {
	.lp-hero__bg::after {
		content: "";
		position: absolute;
		inset: 0;
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96'%3E%3Crect x='10' y='10' width='76' height='76' rx='18' fill='%23ffffff' fill-opacity='0.55'/%3E%3C/svg%3E");
		background-size: 96px 96px;
		background-position: center top;
		-webkit-mask-image: radial-gradient(56rem 32rem at 50% 26%, #000 30%, transparent 72%);
		mask-image: radial-gradient(56rem 32rem at 50% 26%, #000 30%, transparent 72%);
		opacity: 0.75;
	}
}

.lp-hero__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}

.lp-hero__badge {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	margin: 0 0 0.9rem;
	padding: 0.5rem 1.3rem;
	border-radius: 999px;
	background: rgba(243, 239, 255, 0.92);
	color: #7c66f0;
	font-size: 0.9375rem;
	font-weight: 500;
}

.lp-hero__avatars {
	margin-bottom: 2.75rem;
	filter: drop-shadow(0 4px 12px rgba(15, 13, 26, 0.12));
}

.lp-hero__avatars img {
	display: block;
	width: 232px;
	height: auto;
}

.lp-hero__title {
	margin: 0 0 1.9rem;
	max-width: 23ch;
	font-size: clamp(2.25rem, 4.75vw, 3.5rem);
	font-weight: 800;
	letter-spacing: -0.02em;
	line-height: 1.14;
}

.lp-hero__title-accent {
	display: block;
	color: var(--lp-purple);
}

.lp-hero__lead {
	margin: 0 0 2rem;
	max-width: 31rem;
	font-size: 1rem;
	line-height: 1.75;
	color: #676279;
}

.lp-hero__proof {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 0.75rem 1.1rem;
	margin-top: 2.6rem;
	font-size: 0.875rem;
	font-weight: 600;
	color: #3f3b52;
}

.lp-hero__stars {
	display: block;
	width: 59px;
	height: auto;
}

.lp-hero__proof-sep {
	width: 1px;
	height: 1rem;
	background: #d9d5e8;
}

.lp-hero__dashboard {
	margin: 3rem auto 0;
	max-width: 63rem;
	width: 100%;
}

.lp-hero__dashboard img {
	display: block;
	width: 100%;
	border-radius: var(--lp-radius-lg) var(--lp-radius-lg) 0 0;
	box-shadow: var(--lp-shadow-lg);
}

/* 6.2 Ticker */
.lp-ticker {
	background: var(--lp-dark);
	padding: 1.4rem 0;
	overflow: clip;
}

.lp-ticker__track {
	display: flex;
	width: max-content;
	animation: lp-marquee 36s linear infinite;
}

.lp-ticker:hover .lp-ticker__track {
	animation-play-state: paused;
}

.lp-ticker__group {
	display: flex;
	align-items: center;
	list-style: none;
	margin: 0;
	padding: 0;
}

.lp-ticker__item {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	padding: 0 2.5rem;
	font-size: 0.9375rem;
	color: #fff;
	white-space: nowrap;
	position: relative;
}

.lp-ticker__item::after {
	content: "";
	position: absolute;
	right: 0;
	width: 1px;
	height: 1.1rem;
	background: rgba(255, 255, 255, 0.18);
}

.lp-ticker__muted {
	color: var(--lp-dark-text);
}

@keyframes lp-marquee {
	to {
		translate: -50% 0;
	}
}

@media (prefers-reduced-motion: reduce) {
	.lp-ticker__track {
		animation: none;
		flex-wrap: wrap;
		width: auto;
		justify-content: center;
	}
}

/* 6.3 Risk section */
.lp-risk {
	padding: 6.5rem 0 5rem;
	background: var(--lp-surface);
}

.lp-risk__panel {
	display: grid;
	grid-template-columns: 1fr 1fr;
	border-radius: var(--lp-radius-lg);
	overflow: clip;
	box-shadow: var(--lp-shadow-lg);
}

.lp-risk__side {
	position: relative;
	display: grid;
	gap: 1.25rem;
	align-content: center;
	padding: 3.5rem 3rem;
	overflow: clip;
	isolation: isolate;
}

.lp-risk__side--danger {
	background:
		radial-gradient(30rem 24rem at 15% 85%, rgba(190, 30, 20, 0.55), transparent 65%),
		#230702;
}

.lp-risk__side--safe {
	background:
		radial-gradient(30rem 24rem at 85% 15%, rgba(60, 200, 120, 0.4), transparent 65%),
		#082a24;
}

.lp-risk__art {
	position: absolute;
	z-index: -1;
	width: min(22rem, 60%);
	opacity: 0.95;
	filter: saturate(1.15) contrast(1.05) drop-shadow(0 18px 40px rgba(0, 0, 0, 0.45));
	pointer-events: none;
}

.lp-risk__art--x {
	left: -4.5rem;
	bottom: -4.5rem;
	rotate: -12deg;
}

.lp-risk__art--check {
	right: -5rem;
	top: -4rem;
	rotate: 10deg;
}

.lp-risk__card {
	position: relative;
	border-radius: var(--lp-radius);
	padding: 1.5rem 1.75rem;
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	border: 1px solid transparent;
	border-left-width: 3px;
	transition: translate 0.3s var(--lp-ease), box-shadow 0.3s var(--lp-ease);
}

.lp-risk__card:hover {
	translate: 0 -4px;
	box-shadow: 0 16px 40px rgba(0, 0, 0, 0.35);
}

.lp-risk__side--danger .lp-risk__card {
	background: rgba(60, 8, 4, 0.5);
	border-color: rgba(229, 72, 77, 0.28);
	border-left-color: #ef4444;
}

.lp-risk__side--safe .lp-risk__card {
	background: rgba(8, 46, 38, 0.5);
	border-color: rgba(74, 222, 128, 0.25);
	border-left-color: #34d399;
}

.lp-risk__label {
	display: inline-flex;
	margin: 0 0 0.5rem;
	padding: 0.3rem 0.8rem;
	border-radius: 999px;
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	width: fit-content;
}

.lp-risk__label--danger {
	border: 1px solid rgba(229, 72, 77, 0.6);
	color: #ffb3b5;
}

.lp-risk__label--safe {
	border: 1px solid rgba(74, 222, 128, 0.5);
	color: #86efac;
}

.lp-risk__value {
	margin: 0 0 0.4rem;
	font-family: var(--lp-font-display);
	font-size: clamp(1.9rem, 3vw, 2.5rem);
	font-weight: 800;
	letter-spacing: -0.02em;
	color: #fff;
	line-height: 1;
}

.lp-risk__desc {
	margin: 0;
	font-size: 0.875rem;
	line-height: 1.5;
	color: rgba(255, 255, 255, 0.75);
}

/* Fix band */
.lp-risk__fix {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 2rem;
	margin-top: 1.5rem;
	padding: 3rem 3.25rem;
	border-radius: var(--lp-radius-lg);
	background: #100f1c;
	overflow: clip;
	isolation: isolate;
}

.lp-risk__fix-copy {
	max-width: 34rem;
}

.lp-risk__fix-title {
	margin: 0 0 0.6rem;
	font-family: var(--lp-font-body);
	font-size: 1.375rem;
	font-weight: 800;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--lp-purple-soft);
}

.lp-risk__fix-text {
	margin: 0;
	font-size: 0.9375rem;
	color: var(--lp-ink-mute);
}

.lp-risk__fix-text strong {
	color: #e8e5f5;
	font-weight: 600;
}

.lp-risk__fix-shape {
	position: absolute;
	z-index: 0;
	right: 9rem;
	bottom: 0;
	width: 15rem;
	height: auto;
	pointer-events: none;
}

/* Frosted-glass CTA button matching the design's fix band */
.lp-risk__fix-btn {
	position: relative;
	z-index: 1;
	flex-shrink: 0;
	color: #fff;
	font-size: 0.8125rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	background: rgba(255, 255, 255, 0.1);
	border: 1px solid rgba(255, 255, 255, 0.14);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
}

.lp-risk__fix-btn:hover {
	color: #fff;
	background: rgba(255, 255, 255, 0.18);
	border-color: rgba(255, 255, 255, 0.28);
}

/* 6.4 How it works */
.lp-how {
	position: relative;
	padding: 6.5rem 0 5.5rem;
	background:
		radial-gradient(50rem 34rem at 50% 12%, rgba(76, 45, 160, 0.55), transparent 70%),
		linear-gradient(180deg, #0d0a1e 0%, #171132 55%, #100c26 100%);
}

.lp-how__steps {
	list-style: none;
	margin: 0 0 3.5rem;
	padding: 0;
	display: grid;
	gap: 4.5rem;
}

.lp-how__step {
	display: grid;
	grid-template-columns: 1fr 1.15fr;
	gap: 4rem;
	align-items: center;
	padding-top: 4.5rem;
	border-top: 1px solid rgba(255, 255, 255, 0.07);
}

.lp-how__step:first-child {
	border-top: 0;
	padding-top: 0;
}

.lp-how__step--flip .lp-how__copy {
	order: 2;
}

.lp-how__step--flip .lp-how__media {
	order: 1;
}

.lp-how__step-title {
	display: flex;
	align-items: center;
	gap: 0.9rem;
	margin: 0 0 1rem;
	font-size: clamp(1.5rem, 2.6vw, 1.9rem);
	font-weight: 800;
	letter-spacing: -0.02em;
	color: #fff;
}

.lp-how__step-title::after {
	content: "";
	flex: 1;
	height: 1px;
	background: linear-gradient(90deg, rgba(139, 124, 247, 0.6), transparent);
}

.lp-how__num {
	flex-shrink: 0;
	display: inline-grid;
	place-items: center;
	width: 2.1rem;
	height: 2.1rem;
	border-radius: 50%;
	background: var(--lp-purple);
	color: #fff;
	font-family: var(--lp-font-body);
	font-size: 0.9375rem;
	font-weight: 700;
	box-shadow: 0 0 0 6px rgba(108, 71, 255, 0.18);
}

.lp-how__text {
	margin: 0 0 1.4rem;
	color: var(--lp-dark-text);
	font-size: 1rem;
}

.lp-how__media {
	/* Lets the mockup size itself off its OWN rendered width (cqi)
	   instead of the viewport, so it stays correctly proportioned
	   whether it's in a 2-column desktop layout or full-width on
	   mobile. */
	container-type: inline-size;
}

.lp-how__media img {
	display: block;
	width: 100%;
	border-radius: var(--lp-radius);
	box-shadow: 0 24px 64px rgba(0, 0, 0, 0.45);
	transition: translate 0.4s var(--lp-ease), box-shadow 0.4s var(--lp-ease);
}

.lp-how__media:hover img {
	translate: 0 -6px;
	box-shadow: 0 32px 80px rgba(0, 0, 0, 0.55);
}

/* Pure-CSS "Choose a Template" picker mockup (step 1) */
.lp-mock {
	position: relative;
	border-radius: var(--lp-radius);
}

.lp-mock--picker {
	/* Fluid padding keeps proportions right from phones to desktop.
	   cqi = 1% of the card's own inline size (falls back to the vw
	   value in browsers without container query units). */
	padding: clamp(1.1rem, 4.5cqi, 1.9rem) clamp(1.1rem, 4.5cqi, 1.9rem) clamp(1.4rem, 5cqi, 2.2rem);
	background:
		radial-gradient(28rem 20rem at 80% -5%, rgba(108, 71, 255, 0.2), transparent 60%),
		linear-gradient(180deg, #1e1838, #15111f);
	border: 1px solid rgba(255, 255, 255, 0.06);
	/* Allow the selected row to bleed past the card edges, as in the design. */
	overflow: visible;
}

.lp-mock__head {
	display: flex;
	align-items: center;
	gap: 0.7rem;
	margin-bottom: clamp(1.2rem, 4cqi, 1.9rem);
}

.lp-mock__title {
	font-family: var(--lp-font-display);
	font-size: clamp(1.05rem, 3.6cqi, 1.2rem);
	font-weight: 800;
	letter-spacing: -0.01em;
	color: #fff;
}

.lp-mock__group-label {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	margin: 0 0 clamp(0.7rem, 3cqi, 1rem);
	padding-left: 0.15rem;
	font-size: clamp(0.65rem, 2.6cqi, 0.72rem);
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: #6f6a87;
}

.lp-mock__group-label--pro {
	margin-top: clamp(1.2rem, 5cqi, 1.8rem);
}

.lp-mock__pro-badge {
	display: inline-flex;
	align-items: center;
	gap: 0.25rem;
	padding: 0.25rem 0.7rem;
	border-radius: 999px;
	background: linear-gradient(120deg, #7c5cff, #a855f7);
	color: #fff;
	font-size: 0.6875rem;
	font-weight: 800;
	letter-spacing: 0.06em;
}

.lp-mock__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: clamp(0.35rem, 1.6cqi, 0.5rem);
}

.lp-mock__row {
	display: flex;
	align-items: center;
	gap: clamp(0.55rem, 2.5cqi, 0.8rem);
	padding: 0.5rem 0.35rem;
	border-radius: 0.8rem;
	color: #efedf7;
	font-size: clamp(0.85rem, 3.1cqi, 0.95rem);
	font-weight: 700;
}

.lp-mock__emoji {
	font-size: clamp(0.95rem, 3.3cqi, 1.05rem);
	line-height: 1;
	filter: saturate(1.05);
}

.lp-mock__name {
	flex: 1;
	min-width: 0;
	line-height: 1.3;
}

.lp-mock__plus {
	flex-shrink: 0;
	width: 1.4rem;
	text-align: center;
	font-size: clamp(1.1rem, 4cqi, 1.35rem);
	font-weight: 300;
	line-height: 1;
	color: #6f6a88;
}

/* Selected row bleeds out past the LEFT card edge only and glows,
   matching the design. Bleed scales down on small screens. */
.lp-mock__row--selected {
	margin: 0.35rem clamp(-1.4rem, -4.5cqi, -2.1rem);
	padding: clamp(0.75rem, 3cqi, 1rem) clamp(1.4rem, 4.5cqi, 2.1rem);
	border-radius: 0.9rem;
	background: linear-gradient(105deg, #7c3bed 0%, #472287 55%, #11002f 100%);
	color: #fff;
	font-size: clamp(1rem, 3.9cqi, 1.2rem);
	box-shadow: 0 16px 34px rgba(108, 71, 255, 0.38);
}

.lp-mock__row--selected .lp-mock__emoji {
	font-size: clamp(1.1rem, 4.1cqi, 1.25rem);
}

.lp-mock__row--dim {
	color: #817d97;
	opacity: 0.9;
}

.lp-mock__row--dim .lp-mock__plus {
	color: #545067;
}

.lp-mock__tick {
	flex-shrink: 0;
	display: inline-flex;
}

/* Pure-CSS "Insert into your site" confirmation mockup (step 2) */
.lp-mock--insert {
	position: relative;
	padding: clamp(1.6rem, 6cqi, 2.4rem) clamp(1.3rem, 5cqi, 1.9rem) clamp(1.4rem, 5cqi, 2rem);
	background: linear-gradient(180deg, #1e1838, #15111f);
	border: 1px solid rgba(255, 255, 255, 0.06);
	overflow: visible;
	container-type: inline-size;
}

.lp-mock__eyebrow {
	margin: 0 0 clamp(0.9rem, 3.5cqi, 1.3rem);
	font-size: clamp(0.68rem, 2.6cqi, 0.75rem);
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: #726d8c;
}

.lp-mock__template-card {
	position: relative;
	padding: clamp(1.1rem, 4.2cqi, 1.5rem) clamp(1.1rem, 4.2cqi, 1.5rem) clamp(1.6rem, 6cqi, 2.1rem);
	border-radius: 0.9rem;
	background: #241d40;
	overflow: hidden;
}

.lp-mock__template-bar {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	background: linear-gradient(90deg, #7c3bed, #472287);
}

.lp-mock__template-title {
	margin: 0 0 0.8rem;
	font-family: var(--lp-font-display);
	font-size: clamp(1rem, 3.8cqi, 1.15rem);
	font-weight: 800;
	color: #fff;
}

.lp-mock__tags {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
	max-width: 100%;
}

.lp-mock__tag {
	padding: clamp(0.2rem, 1.2cqi, 0.3rem) clamp(0.4rem, 2.8cqi, 0.75rem);
	border-radius: 999px;
	background: rgba(124, 92, 255, 0.22);
	color: #c9bcff;
	font-size: clamp(0.46rem, 2.6cqi, 0.78rem);
	font-weight: 700;
	white-space: nowrap;
}

.lp-mock__tag--accent {
	background: rgba(74, 222, 128, 0.18);
	color: #86efac;
}

.lp-mock__ellipsis-line {
	position: absolute;
	left: 1.5rem;
	right: 1.5rem;
	bottom: 0.9rem;
	height: 3px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.12);
}

/* Confirmation banner overlaps the template card and bleeds past the
   left edge, echoing the design's floating callout. */
.lp-mock__confirm {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	gap: clamp(1rem, 6cqi, 2.1rem);
	/* Bleed left generously (design) but define width explicitly so
	   the right edge always lands inside the card, never past it. */
	margin-top: clamp(-1.6rem, -6cqi, -2.2rem);
	margin-bottom: clamp(1rem, 4cqi, 1.5rem);
	margin-left: clamp(-1.6rem, -10cqi, -3.6rem);
	width: calc(100% - clamp(1.1rem, 4.2cqi, 1.5rem));
	padding: clamp(1rem, 5.5cqi, 1.9rem) clamp(1.1rem, 6cqi, 2.3rem);
	border-radius: 1.1rem;
	background: #17132a;
	box-shadow: 0 24px 50px rgba(0, 0, 0, 0.55);
	box-sizing: border-box;
}

.lp-mock__confirm-check {
	flex-shrink: 0;
	width: clamp(1.5rem, 7cqi, 2.2rem);
	height: clamp(1.5rem, 7cqi, 2.2rem);
	filter: drop-shadow(0 0 10px rgba(74, 222, 128, 0.35));
}

.lp-mock__confirm-text {
	min-width: 0;
	margin: 0;
	font-size: clamp(0.85rem, 4.1cqi, 1.25rem);
	font-weight: 800;
	line-height: 1.35;
	color: #fff;
	overflow-wrap: break-word;
}

.lp-mock__confirm-text span {
	display: block;
	margin-top: 0.25rem;
	font-size: clamp(0.7rem, 3.4cqi, 1rem);
	font-weight: 500;
	color: #a39dc0;
}

.lp-mock__field {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.2rem;
	padding: clamp(0.75rem, 3.5cqi, 1.15rem) clamp(1rem, 4.2cqi, 1.4rem);
	border-radius: 0.75rem;
	background: #1c1734;
	margin-top: clamp(0.6rem, 2.5cqi, 0.85rem);
}

.lp-mock__field-label {
	min-width: 0;
	font-size: clamp(0.72rem, 3cqi, 0.85rem);
	color: #8d88a6;
	overflow-wrap: break-word;
}

.lp-mock__field-value {
	min-width: 0;
	font-size: clamp(0.78rem, 3.4cqi, 0.9375rem);
	font-weight: 700;
	color: #efedf7;
	overflow-wrap: anywhere;
}

/* From the tablet size upward there's room to sit label and value on
   one line again, matching the design's single-row fields. */
@container (min-width: 420px) {
	.lp-mock__field {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		gap: 0.75rem;
	}

	.lp-mock__field-value {
		text-align: right;
	}
}

/* Bottom row: the WP page path and the Insert Once button sit as two
   separate rounded boxes side by side, matching the design. They wrap
   to stacked full-width boxes on narrow containers. */
.lp-mock__action-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem;
	margin-top: clamp(0.6rem, 2.5cqi, 0.85rem);
}

.lp-mock__field--path {
	flex: 1 1 12rem;
	min-width: 0;
	padding: clamp(0.75rem, 3.5cqi, 1.15rem) clamp(1rem, 4.2cqi, 1.4rem);
	border-radius: 0.75rem;
	background: #1c1734;
	color: #efedf7;
	font-size: clamp(0.78rem, 3.2cqi, 0.9375rem);
	font-weight: 600;
	overflow-wrap: break-word;
}

.lp-mock__insert-btn {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: clamp(0.7rem, 3.5cqi, 0.95rem) clamp(1.1rem, 4.5cqi, 1.5rem);
	border: 0;
	border-radius: 0.75rem;
	background: linear-gradient(105deg, #7c3bed, #5a34d8);
	color: #fff;
	font-family: inherit;
	font-size: clamp(0.78rem, 3.2cqi, 0.9375rem);
	font-weight: 700;
	white-space: nowrap;
	cursor: default;
}

/* 6.5 Features */
.lp-features {
	padding: 6.5rem 0;
	background: var(--lp-surface-2);
}

.lp-features__layout {
	display: grid;
	grid-template-columns: 0.92fr 1.08fr;
	gap: 1.75rem;
	align-items: start;
	margin-bottom: 3.5rem;
}

.lp-features__list {
	display: grid;
	gap: 0.9rem;
}

.lp-features__item {
	position: relative;
	display: flex;
	align-items: center;
	gap: 0.9rem;
	width: 100%;
	padding: 1.1rem 1.25rem;
	border: 1px solid var(--lp-border);
	border-radius: var(--lp-radius-sm);
	background: var(--lp-surface);
	box-shadow: var(--lp-shadow-sm);
	text-align: left;
	transition: translate 0.25s var(--lp-ease), box-shadow 0.25s var(--lp-ease),
		border-color 0.25s var(--lp-ease);
}

.lp-features__item:hover {
	translate: 0 -2px;
	box-shadow: var(--lp-shadow);
}

.lp-features__item.is-active {
	border-color: rgba(108, 71, 255, 0.35);
	box-shadow: var(--lp-shadow);
}

.lp-features__item.is-active::before {
	content: "";
	position: absolute;
	left: -1px;
	top: 18%;
	bottom: 18%;
	width: 3px;
	border-radius: 3px;
	background: var(--lp-purple);
}

.lp-features__index {
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--lp-ink-mute);
}

.lp-features__icon {
	display: grid;
	place-items: center;
	width: 2.5rem;
	height: 2.5rem;
	border-radius: 0.65rem;
	background: var(--lp-purple-tint);
	color: var(--lp-purple);
	flex-shrink: 0;
}

.lp-features__name {
	flex: 1;
	font-family: var(--lp-font-display);
	font-weight: 700;
	font-size: 1rem;
	letter-spacing: -0.01em;
}

.lp-features__panel {
	position: sticky;
	top: calc(var(--lp-header-h) + 1.5rem);
	border-radius: var(--lp-radius);
	background: var(--lp-surface);
	border: 1px solid var(--lp-border);
	box-shadow: var(--lp-shadow);
	overflow: clip;
}

.lp-features__preview {
	position: relative;
	aspect-ratio: 1080 / 504;
	background:
		radial-gradient(24rem 16rem at 80% 10%, rgba(216, 180, 255, 0.5), transparent 65%),
		radial-gradient(20rem 14rem at 15% 80%, rgba(190, 242, 200, 0.45), transparent 65%),
		linear-gradient(135deg, #f3fbf4, #f6f0ff);
}

.lp-features__preview img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: opacity 0.35s var(--lp-ease);
}

.lp-features__preview img.is-hidden {
	opacity: 0;
}

.lp-features__preview-icon {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	color: var(--lp-purple);
	opacity: 0.85;
}

.lp-features__panel-body {
	padding: 1.75rem 2rem 2rem;
}

.lp-features__panel-meta {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	margin: 0 0 0.75rem;
}

.lp-features__panel-label {
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--lp-purple);
}

.lp-features__panel-title {
	margin: 0 0 0.6rem;
	font-size: 1.5rem;
	font-weight: 800;
	letter-spacing: -0.02em;
}

.lp-features__panel-text {
	margin: 0;
	color: var(--lp-ink-mute);
	font-size: 0.9375rem;
}

/* 6.6 Pricing */
.lp-pricing {
	padding: 6.5rem 0;
	background: var(--lp-surface-3);
}

.lp-pricing__toggle-wrap {
	display: flex;
	justify-content: center;
	margin-bottom: 3rem;
}

.lp-pricing__toggle {
	display: inline-flex;
	padding: 0.3rem;
	border-radius: 999px;
	background: #fff;
	border: 1px solid var(--lp-border);
	box-shadow: var(--lp-shadow-sm);
}

.lp-pricing__toggle-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.55rem 1.4rem;
	border: 0;
	border-radius: 999px;
	background: transparent;
	font-size: 0.9375rem;
	font-weight: 600;
	color: var(--lp-ink-mute);
	transition: background 0.25s var(--lp-ease), color 0.25s var(--lp-ease),
		box-shadow 0.25s var(--lp-ease);
}

.lp-pricing__toggle-btn.is-active {
	background: var(--lp-ink);
	color: #fff;
	box-shadow: var(--lp-shadow-sm);
}

.lp-pricing__save {
	padding: 0.15rem 0.5rem;
	border-radius: 999px;
	background: #fff2df;
	color: #d97706;
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

.lp-pricing__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.25rem;
	align-items: stretch;
}

.lp-plan {
	position: relative;
	display: flex;
	flex-direction: column;
	padding: 2rem 1.75rem;
	border-radius: var(--lp-radius);
	background: var(--lp-surface);
	border: 1px solid var(--lp-border);
	box-shadow: var(--lp-shadow-sm);
	transition: translate 0.3s var(--lp-ease), box-shadow 0.3s var(--lp-ease);
}

.lp-plan:hover {
	translate: 0 -6px;
	box-shadow: var(--lp-shadow);
}

.lp-plan--featured {
	background: var(--lp-dark);
	border-color: var(--lp-dark);
	color: #fff;
	box-shadow: var(--lp-shadow-lg);
	scale: 1.03;
}

.lp-plan__flag {
	position: absolute;
	top: 0;
	left: 50%;
	translate: -50% -50%;
	margin: 0;
	padding: 0.35rem 1rem;
	border-radius: 999px;
	background: var(--lp-purple);
	color: #fff;
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	white-space: nowrap;
	box-shadow: var(--lp-shadow-purple);
}

.lp-plan__label {
	margin: 0 0 1.1rem;
	font-family: var(--lp-font-body);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--lp-ink-mute);
}

.lp-plan--featured .lp-plan__label {
	color: var(--lp-dark-text);
}

.lp-plan__price {
	display: flex;
	align-items: baseline;
	gap: 0.3rem;
	margin: 0 0 0.75rem;
}

.lp-plan__currency {
	font-family: var(--lp-font-display);
	font-size: 1.125rem;
	font-weight: 700;
}

.lp-plan__amount {
	font-family: var(--lp-font-display);
	font-size: 2.75rem;
	font-weight: 800;
	letter-spacing: -0.03em;
	line-height: 1;
}

.lp-plan__period {
	font-size: 0.875rem;
	color: var(--lp-ink-mute);
}

.lp-plan--featured .lp-plan__period {
	color: var(--lp-dark-text);
}

.lp-plan__desc {
	margin: 0 0 1.4rem;
	font-size: 0.875rem;
	color: var(--lp-ink-mute);
	min-height: 3.4em;
}

.lp-plan--featured .lp-plan__desc {
	color: var(--lp-dark-text);
}

.lp-plan__features {
	list-style: none;
	margin: 0 0 1.75rem;
	padding: 1.25rem 0 0;
	border-top: 1px solid var(--lp-border);
	display: grid;
	gap: 0.7rem;
	flex: 1;
}

.lp-plan--featured .lp-plan__features {
	border-top-color: var(--lp-dark-border);
}

.lp-plan__features li {
	display: flex;
	align-items: flex-start;
	gap: 0.55rem;
	font-size: 0.875rem;
}

.lp-plan__features .lp-icon {
	flex-shrink: 0;
	margin-top: 0.2em;
}

.lp-plan__features .is-included .lp-icon {
	color: var(--lp-green);
}

.lp-plan--featured .lp-plan__features .is-included .lp-icon {
	color: var(--lp-green-soft);
}

.lp-plan__features .is-excluded {
	color: var(--lp-ink-mute);
	opacity: 0.65;
}

.lp-plan__features .is-excluded .lp-icon {
	color: var(--lp-ink-mute);
}

.lp-plan__cta {
	width: 100%;
}

.lp-pricing__guarantee {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	margin: 2.25rem 0 0;
	font-size: 0.875rem;
	color: var(--lp-ink-mute);
}

.lp-pricing__guarantee .lp-icon {
	color: var(--lp-green);
}

/* 6.7 Comparison table */
.lp-compare {
	padding: 6.5rem 0;
	background: var(--lp-surface);
}

.lp-compare__card {
	border: 1px solid var(--lp-border);
	border-radius: var(--lp-radius);
	box-shadow: var(--lp-shadow);
	overflow: clip;
}

.lp-compare__scroll {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.lp-compare__table {
	min-width: 640px;
}

.lp-compare__table thead th {
	padding: 1.4rem 1.5rem;
	font-family: var(--lp-font-display);
	font-size: 1.25rem;
	font-weight: 800;
	letter-spacing: -0.01em;
	text-align: left;
	border-bottom: 1px solid var(--lp-border);
}

.lp-compare__free-col,
.lp-compare__pro-col {
	width: 22%;
	text-align: center !important;
}

.lp-compare__table thead .lp-compare__pro-col {
	color: var(--lp-purple);
	background: var(--lp-purple-tint-2);
	box-shadow: inset 0 3px 0 var(--lp-purple);
}

.lp-compare__group th {
	padding: 0.8rem 1.5rem;
	background: var(--lp-purple-tint);
	color: var(--lp-purple);
	font-family: var(--lp-font-body);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	text-align: left;
}

.lp-compare__table tbody th,
.lp-compare__table tbody td {
	padding: 1rem 1.5rem;
	border-top: 1px solid var(--lp-surface-3);
	text-align: left;
	vertical-align: middle;
}

.lp-compare__table tbody td {
	text-align: center;
}

.lp-compare__pro-cell {
	background: rgba(241, 235, 255, 0.35);
}

.lp-compare__name {
	display: block;
	font-weight: 600;
	font-size: 0.9375rem;
}

.lp-compare__hint {
	display: block;
	margin-top: 0.15rem;
	font-size: 0.8125rem;
	font-weight: 400;
	color: var(--lp-ink-mute);
}

.lp-compare__check {
	display: inline-grid;
	place-items: center;
	width: 1.6rem;
	height: 1.6rem;
	border-radius: 50%;
	border: 1.5px solid var(--lp-green);
	color: var(--lp-green);
}

.lp-compare__check--pro {
	border: 0;
	background: var(--lp-purple);
	color: #fff;
}

.lp-compare__dash {
	color: var(--lp-ink-mute);
	opacity: 0.5;
}

.lp-compare__text {
	display: block;
	font-weight: 700;
}

.lp-compare__text--pro {
	color: var(--lp-purple);
}

.lp-compare__subtext {
	display: block;
	font-size: 0.8125rem;
	color: var(--lp-ink-mute);
}

.lp-compare__table tfoot th,
.lp-compare__table tfoot td {
	padding: 1.75rem 1.5rem;
	border-top: 1px solid var(--lp-border);
	background: var(--lp-surface-2);
	vertical-align: top;
	text-align: center;
}

.lp-compare__foot-note {
	max-width: 20rem;
	font-size: 0.875rem;
	font-weight: 400;
	color: var(--lp-ink-mute);
	text-align: left !important;
}

.lp-compare__foot-price {
	display: block;
	margin-top: 0.6rem;
	font-size: 0.8125rem;
	color: var(--lp-ink-mute);
}

/* 6.8 Templates marquee */
.lp-templates {
	padding: 6.5rem 0;
	background: var(--lp-surface-3);
	overflow: clip;
}

.lp-templates__marquee {
	display: grid;
	gap: 1rem;
	margin-bottom: 2.5rem;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}

.lp-templates__row {
	overflow: clip;
}

.lp-templates__track {
	display: flex;
	width: max-content;
	animation: lp-marquee 48s linear infinite;
}

.lp-templates__row--reverse .lp-templates__track {
	animation-direction: reverse;
}

.lp-templates__row:hover .lp-templates__track {
	animation-play-state: paused;
}

.lp-templates__group {
	display: flex;
	gap: 1rem;
	list-style: none;
	margin: 0;
	padding: 0 0.5rem;
}

.lp-chip {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	padding: 0.85rem 1.4rem;
	border-radius: 0.75rem;
	background: #fff;
	border: 1px solid var(--lp-border);
	box-shadow: var(--lp-shadow-sm);
	font-size: 0.9375rem;
	font-weight: 600;
	white-space: nowrap;
	transition: translate 0.25s var(--lp-ease), box-shadow 0.25s var(--lp-ease);
}

.lp-chip:hover {
	translate: 0 -3px;
	box-shadow: var(--lp-shadow);
}

.lp-chip__free {
	position: absolute;
	top: -0.5rem;
	right: 0.75rem;
	padding: 0.1rem 0.5rem;
	border-radius: 999px;
	background: #dcfce7;
	color: #15803d;
	font-size: 0.625rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

@media (prefers-reduced-motion: reduce) {
	.lp-templates__track {
		animation: none;
		flex-wrap: wrap;
		width: auto;
	}

	.lp-templates__group[aria-hidden="true"],
	.lp-ticker__group[aria-hidden="true"] {
		display: none;
	}
}

.lp-templates__count {
	margin: 0;
	text-align: center;
	font-size: 0.9375rem;
	color: var(--lp-ink-mute);
}

.lp-templates__count-free {
	color: var(--lp-green);
}

.lp-templates__count-pro {
	color: var(--lp-purple);
}

/* 6.9 Zero-risk band */
.lp-zero-risk {
	padding: 6rem 0;
	background:
		radial-gradient(46rem 30rem at 50% 0%, rgba(76, 45, 160, 0.6), transparent 70%),
		linear-gradient(180deg, #14102b, #0f0b26);
	text-align: center;
}

.lp-zero-risk .lp-section-head {
	margin-bottom: 2rem;
}

.lp-zero-risk__cta {
	margin: 0;
}

/* 6.10 Why cards */
.lp-why {
	padding: 6.5rem 0;
	background: var(--lp-surface-3);
}

.lp-why__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
}

.lp-why__card {
	border-radius: var(--lp-radius);
	background: #fff;
	border: 1px solid var(--lp-border);
	box-shadow: var(--lp-shadow-sm);
	overflow: clip;
	transition: translate 0.3s var(--lp-ease), box-shadow 0.3s var(--lp-ease);
}

.lp-why__card:hover {
	translate: 0 -6px;
	box-shadow: var(--lp-shadow);
}

.lp-why__media {
	margin: 0;
	aspect-ratio: 376 / 240;
	overflow: clip;
}

.lp-why__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: scale 0.5s var(--lp-ease);
}

.lp-why__card:hover .lp-why__media img {
	scale: 1.04;
}

.lp-why__body {
	padding: 1.5rem 1.75rem 1.75rem;
}

.lp-why__title {
	margin: 0 0 0.6rem;
	font-size: 1.25rem;
	font-weight: 800;
	letter-spacing: -0.015em;
}

.lp-why__text {
	margin: 0;
	font-size: 0.9375rem;
	color: var(--lp-ink-mute);
}

/* 6.11 Site types */
.lp-site-types {
	padding: 6.5rem 0;
	background:
		radial-gradient(40rem 26rem at 0% 0%, rgba(216, 180, 255, 0.25), transparent 60%),
		radial-gradient(40rem 26rem at 100% 100%, rgba(180, 242, 200, 0.25), transparent 60%),
		var(--lp-surface-2);
}

.lp-site-types__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
	margin-bottom: 3.5rem;
}

.lp-type-card {
	position: relative;
	padding: 1.9rem 1.9rem 2.1rem;
	border-radius: var(--lp-radius);
	background: #fff;
	border: 1px solid var(--lp-border);
	box-shadow: var(--lp-shadow-sm);
	overflow: clip;
	isolation: isolate;
	transition: translate 0.3s var(--lp-ease), box-shadow 0.3s var(--lp-ease),
		border-color 0.3s var(--lp-ease);
}

.lp-type-card:hover {
	translate: 0 -6px;
	box-shadow: var(--lp-shadow);
}

.lp-type-card--featured {
	border-color: rgba(34, 160, 107, 0.45);
}

.lp-type-card__icon {
	display: grid;
	place-items: center;
	width: 2.75rem;
	height: 2.75rem;
	margin-bottom: 1.4rem;
	border-radius: 0.75rem;
	transition: scale 0.3s var(--lp-ease);
}

.lp-type-card:hover .lp-type-card__icon {
	scale: 1.08;
}

.lp-type-card__category {
	margin: 0 0 0.35rem;
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.lp-type-card__title {
	margin: 0 0 0.6rem;
	font-size: 1.25rem;
	font-weight: 800;
	letter-spacing: -0.015em;
}

.lp-type-card__text {
	margin: 0;
	font-size: 0.9375rem;
	color: var(--lp-ink-mute);
	max-width: 30ch;
}

.lp-type-card__watermark {
	position: absolute;
	right: -2.5rem;
	bottom: -2.5rem;
	z-index: -1;
	opacity: 0.07;
	rotate: -8deg;
	transition: opacity 0.3s var(--lp-ease), rotate 0.3s var(--lp-ease);
}

.lp-type-card:hover .lp-type-card__watermark {
	opacity: 0.12;
	rotate: -2deg;
}

/* Card tones */
.lp-type-card--green .lp-type-card__icon {
	background: #dcfce7;
	color: #15803d;
}

.lp-type-card--green .lp-type-card__category,
.lp-type-card--green .lp-type-card__watermark {
	color: #15803d;
}

.lp-type-card--orange .lp-type-card__icon {
	background: #ffedd5;
	color: #c2410c;
}

.lp-type-card--orange .lp-type-card__category,
.lp-type-card--orange .lp-type-card__watermark {
	color: #ea580c;
}

.lp-type-card--purple .lp-type-card__icon {
	background: var(--lp-purple-tint-2);
	color: var(--lp-purple);
}

.lp-type-card--purple .lp-type-card__category,
.lp-type-card--purple .lp-type-card__watermark {
	color: var(--lp-purple);
}

.lp-type-card--pink .lp-type-card__icon {
	background: #fce7f3;
	color: #be185d;
}

.lp-type-card--pink .lp-type-card__category,
.lp-type-card--pink .lp-type-card__watermark {
	color: #db2777;
}

.lp-type-card--blue .lp-type-card__icon {
	background: #dbeafe;
	color: #1d4ed8;
}

.lp-type-card--blue .lp-type-card__category,
.lp-type-card--blue .lp-type-card__watermark {
	color: #2563eb;
}

.lp-type-card--teal .lp-type-card__icon {
	background: #ccfbf1;
	color: #0f766e;
}

.lp-type-card--teal .lp-type-card__category,
.lp-type-card--teal .lp-type-card__watermark {
	color: #0d9488;
}

/* 6.12 FAQ */
.lp-faq {
	padding: 6.5rem 0;
	background: var(--lp-surface);
}

.lp-faq__list {
	border: 1px solid var(--lp-border);
	border-radius: var(--lp-radius-sm);
	background: #fff;
	box-shadow: var(--lp-shadow-sm);
	overflow: clip;
}

.lp-faq__item + .lp-faq__item {
	border-top: 1px solid var(--lp-surface-3);
}

.lp-faq__q {
	margin: 0;
}

.lp-faq__toggle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	width: 100%;
	padding: 1.25rem 1.5rem;
	border: 0;
	background: none;
	text-align: left;
	font-family: var(--lp-font-body);
	font-size: 1rem;
	font-weight: 600;
	color: var(--lp-ink);
	transition: color 0.2s var(--lp-ease);
}

.lp-faq__toggle:hover {
	color: var(--lp-purple);
}

.lp-faq__toggle .lp-icon {
	flex-shrink: 0;
	color: var(--lp-ink-mute);
	transition: rotate 0.3s var(--lp-ease);
}

.lp-faq__item.is-open .lp-faq__toggle {
	color: var(--lp-purple);
}

.lp-faq__item.is-open .lp-faq__toggle .lp-icon {
	rotate: 180deg;
	color: var(--lp-purple);
}

.lp-faq__a {
	overflow: clip;
}

.lp-faq__a p {
	margin: 0;
	padding: 0 1.5rem 1.4rem;
	font-size: 0.9375rem;
	line-height: 1.7;
	color: var(--lp-ink-soft);
	border-bottom: 1px solid transparent;
}

/* 6.13 Final CTA */
.lp-final-cta {
	padding: 7rem 0;
	background:
		radial-gradient(50rem 32rem at 50% 20%, rgba(85, 55, 180, 0.65), transparent 70%),
		linear-gradient(180deg, #0c0919, #16112e 60%, var(--lp-dark));
	text-align: center;
}

.lp-final-cta .lp-section-head {
	margin-bottom: 2.25rem;
}

.lp-final-cta__title {
	max-width: 21ch;
	margin-inline: auto;
}

.lp-final-cta__accent {
	color: var(--lp-purple-soft);
}

/* 7. Footer
   ------------------------------------------------------------------------- */
.lp-footer {
	background: var(--lp-dark);
	color: var(--lp-dark-text);
	padding: 4.5rem 0 2rem;
}

.lp-footer__widgets {
	margin-bottom: 3rem;
}

.lp-footer__grid {
	display: grid;
	grid-template-columns: 1.6fr 1fr 1fr 1fr;
	gap: 3rem;
	padding-bottom: 3rem;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.lp-logo--footer .lp-logo__text {
	color: #fff;
}

.lp-footer__tagline {
	margin: 1.25rem 0 0;
	max-width: 17rem;
	font-size: 0.875rem;
	line-height: 1.7;
}

.lp-footer__heading {
	margin: 0 0 1.25rem;
	font-family: var(--lp-font-body);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: #8d88a6;
}

.lp-footer__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 0.7rem;
}

.lp-footer__list a {
	color: var(--lp-dark-text);
	font-size: 0.9375rem;
}

.lp-footer__list a:hover {
	color: #fff;
}

.lp-footer__bottom {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	flex-wrap: wrap;
	padding-top: 2rem;
}

.lp-footer__copyright {
	margin: 0;
	font-size: 0.8125rem;
}

.lp-footer__legal .lp-footer__list {
	display: flex;
	gap: 1.5rem;
}

.lp-footer__legal a {
	font-size: 0.8125rem;
}

/* 8. Blog & standard templates
   ------------------------------------------------------------------------- */
.lp-page {
	padding: 4rem 0 5rem;
}

.lp-page__layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 3rem;
}

.lp-page__layout--sidebar {
	grid-template-columns: minmax(0, 2.2fr) minmax(0, 1fr);
}

.lp-archive-header {
	margin-bottom: 2.5rem;
}

.lp-archive-header .archive-title,
.lp-page-title {
	font-size: clamp(1.9rem, 4vw, 2.6rem);
	font-weight: 800;
	letter-spacing: -0.02em;
	margin-bottom: 0.4em;
}

.lp-archive-header .archive-description {
	color: var(--lp-ink-mute);
}

.lp-post-card {
	padding: 0 0 2.5rem;
	margin-bottom: 2.5rem;
	border-bottom: 1px solid var(--lp-border);
}

.lp-post-card:last-child {
	border-bottom: 0;
}

.lp-post-card__thumb {
	display: block;
	margin-bottom: 1.25rem;
	border-radius: var(--lp-radius);
	overflow: clip;
}

.lp-post-card__thumb img {
	width: 100%;
	transition: scale 0.5s var(--lp-ease);
}

.lp-post-card__thumb:hover img {
	scale: 1.03;
}

.lp-post-card__title {
	font-size: 1.5rem;
	margin-bottom: 0.35em;
}

.lp-post-card__title a {
	color: var(--lp-ink);
}

.lp-post-card__title a:hover {
	color: var(--lp-purple);
}

.lp-post-card__meta,
.entry-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem 1rem;
	font-size: 0.8125rem;
	color: var(--lp-ink-mute);
	margin-bottom: 0.75rem;
}

.entry-content a {
	text-decoration: underline;
	text-underline-offset: 2px;
}

.entry-content img {
	border-radius: var(--lp-radius-sm);
}

.entry-content > * {
	max-width: 100%;
}

.page-links,
.lp-pagination {
	margin-top: 2rem;
}

.lp-pagination .nav-links {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
}

.lp-pagination .page-numbers {
	display: inline-grid;
	place-items: center;
	min-width: 2.4rem;
	height: 2.4rem;
	padding: 0 0.6rem;
	border-radius: 0.6rem;
	border: 1px solid var(--lp-border);
	color: var(--lp-ink-soft);
	font-size: 0.9375rem;
	font-weight: 600;
}

.lp-pagination .page-numbers.current {
	background: var(--lp-purple);
	border-color: var(--lp-purple);
	color: #fff;
}

.lp-pagination a.page-numbers:hover {
	border-color: var(--lp-purple);
	color: var(--lp-purple);
}

/* Sidebar widgets */
.lp-sidebar .widget {
	padding: 1.5rem;
	border: 1px solid var(--lp-border);
	border-radius: var(--lp-radius);
	background: var(--lp-surface-2);
	margin-bottom: 1.5rem;
}

.lp-sidebar .widget-title {
	font-size: 1rem;
	margin-bottom: 1rem;
}

.lp-sidebar .widget ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 0.5rem;
}

/* Search form */
.search-form {
	display: flex;
	gap: 0.5rem;
}

.search-form .search-field {
	flex: 1;
	min-width: 0;
	padding: 0.7rem 1rem;
	border: 1px solid var(--lp-border);
	border-radius: var(--lp-radius-sm);
	font: inherit;
	font-size: 0.9375rem;
}

.search-form .search-field:focus {
	outline: 2px solid var(--lp-purple);
	outline-offset: 0;
	border-color: transparent;
}

.search-form .search-submit {
	padding: 0.7rem 1.3rem;
	border: 0;
	border-radius: var(--lp-radius-sm);
	background: var(--lp-purple);
	color: #fff;
	font-weight: 700;
}

.search-form .search-submit:hover {
	background: var(--lp-purple-dark);
}

/* 404 */
.lp-404 {
	padding: 6rem 0;
	text-align: center;
}

.lp-404__code {
	font-family: var(--lp-font-display);
	font-size: clamp(5rem, 14vw, 9rem);
	font-weight: 800;
	line-height: 1;
	letter-spacing: -0.04em;
	color: var(--lp-purple);
	margin: 0 0 0.5rem;
}

.lp-404 .search-form {
	max-width: 26rem;
	margin: 2rem auto 0;
}

/* Comments */
.comments-area {
	margin-top: 3.5rem;
	padding-top: 2.5rem;
	border-top: 1px solid var(--lp-border);
}

.comment-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.comment-list .comment {
	padding: 1.25rem 0;
	border-bottom: 1px solid var(--lp-surface-3);
}

.comment-form label {
	display: block;
	font-size: 0.875rem;
	font-weight: 600;
	margin-bottom: 0.3rem;
}

.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
	width: 100%;
	padding: 0.7rem 1rem;
	border: 1px solid var(--lp-border);
	border-radius: var(--lp-radius-sm);
	font: inherit;
	font-size: 0.9375rem;
}

.comment-form .submit {
	padding: 0.8rem 1.6rem;
	border: 0;
	border-radius: var(--lp-radius-sm);
	background: var(--lp-purple);
	color: #fff;
	font-weight: 700;
	cursor: pointer;
}

.comment-form .submit:hover {
	background: var(--lp-purple-dark);
}

/* 9. Responsive
   ------------------------------------------------------------------------- */
@media (max-width: 74.99em) {
	.lp-pricing__grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 1.5rem;
		max-width: 46rem;
		margin-inline: auto;
	}

	.lp-plan--featured {
		scale: 1;
	}
}

@media (max-width: 63.99em) {
	.lp-nav {
		display: none;
	}

	.lp-header__login,
	.lp-header__actions .lp-btn {
		display: none;
	}

	.lp-nav-toggle {
		display: inline-flex;
	}

	.lp-risk__panel {
		grid-template-columns: 1fr;
	}

	.lp-how__step,
	.lp-how__step--flip {
		grid-template-columns: 1fr;
		gap: 2.25rem;
		padding-top: 3.5rem;
	}

	.lp-how__step--flip .lp-how__copy {
		order: 1;
	}

	.lp-how__step--flip .lp-how__media {
		order: 2;
	}

	.lp-how__steps {
		gap: 3.5rem;
	}

	.lp-features__layout {
		grid-template-columns: 1fr;
	}

	.lp-features__panel {
		position: static;
	}

	.lp-why__grid,
	.lp-site-types__grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.lp-footer__grid {
		grid-template-columns: 1fr 1fr;
		gap: 2.5rem;
	}

	.lp-page__layout--sidebar {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 47.99em) {
	body {
		font-size: 1rem;
	}

	.lp-section-head {
		margin-bottom: 2.5rem;
	}

	.lp-hero {
		padding-top: 2.5rem;
	}

	.lp-hero__dashboard {
		margin-top: 2.5rem;
	}

	.lp-risk,
	.lp-how,
	.lp-features,
	.lp-pricing,
	.lp-compare,
	.lp-templates,
	.lp-why,
	.lp-site-types,
	.lp-faq {
		padding-top: 4.5rem;
		padding-bottom: 4.5rem;
	}

	.lp-zero-risk,
	.lp-final-cta {
		padding-top: 5rem;
		padding-bottom: 5rem;
	}

	.lp-risk__side {
		padding: 2.5rem 1.5rem;
	}

	.lp-risk__fix {
		flex-direction: column;
		align-items: flex-start;
		padding: 2.25rem 1.75rem;
	}

	.lp-risk__fix-shape {
		right: -3rem;
		top: auto;
		bottom: -4rem;
		translate: 0 0;
		opacity: 0.4;
	}

	.lp-pricing__grid {
		grid-template-columns: 1fr;
		max-width: 26rem;
	}

	.lp-why__grid,
	.lp-site-types__grid {
		grid-template-columns: 1fr;
		max-width: 26rem;
		margin-inline: auto;
	}

	.lp-site-types__grid {
		margin-bottom: 3rem;
	}

	.lp-features__item {
		padding: 0.9rem 1rem;
	}

	.lp-features__index {
		display: none;
	}

	.lp-features__panel-body {
		padding: 1.4rem 1.5rem 1.6rem;
	}

	.lp-compare__table thead th {
		font-size: 1.05rem;
		padding: 1.1rem 1rem;
	}

	.lp-compare__table tbody th,
	.lp-compare__table tbody td,
	.lp-compare__group th,
	.lp-compare__table tfoot th,
	.lp-compare__table tfoot td {
		padding-left: 1rem;
		padding-right: 1rem;
	}

	.lp-footer__grid {
		grid-template-columns: 1fr;
		gap: 2rem;
	}

	.lp-footer__bottom {
		flex-direction: column;
		align-items: flex-start;
	}

	.lp-cta-pair .lp-btn {
		width: 100%;
	}

	.lp-cta-pair {
		flex-direction: column;
		max-width: 22rem;
		margin-inline: auto;
	}
}

@media (max-width: 22.49em) {
	.lp-container {
		width: calc(100% - 2rem);
	}

	.lp-hero__proof-sep {
		display: none;
	}

	.lp-hero__proof {
		flex-direction: column;
		gap: 0.4rem;
	}
}

/* Print */
@media print {
	.lp-header,
	.lp-footer,
	.lp-ticker,
	.skip-link {
		display: none;
	}
}