/* ================================================================
   Landing / Conversion template — Website.sarl
   All rules prefixed .lpc- (Landing Page Conversion) to avoid
   collisions with the base theme. Uses logical properties so it
   mirrors cleanly under [dir="rtl"] with almost no overrides.
   ================================================================ */

/* Custom-property host.
   Attached to BOTH .lpc (the <main> tag in the template — always present
   when this template renders) AND body.lpc-page (added via body_class
   filter in functions.php). Two redundant scopes: if either matches, the
   whole stylesheet works. No dependency on WordPress's own body classes,
   which vary across versions ('...conversion' vs '...conversion-php'). */
.lpc,
body.lpc-page {
	--lpc-primary:        #10a37f;
	--lpc-primary-strong: #B85A3D;
	--lpc-primary-soft:   #f0fdf4;
	--lpc-ink:            #0d0d0d;
	--lpc-ink-soft:       #44403C;
	--lpc-ink-mute:       #78716C;
	--lpc-paper:          #FFFFFF;
	--lpc-paper-warm:     #FBF7F3;
	--lpc-paper-warm-2:   #F5EDE4;
	--lpc-line:           rgba(28, 25, 23, 0.10);
	--lpc-line-soft:      rgba(28, 25, 23, 0.06);
	--lpc-dark:           #0F0D0C;
	--lpc-dark-2:         #1A1614;
	--lpc-dark-line:      rgba(255, 255, 255, 0.09);
	--lpc-ok:             #10B981;
	--lpc-ok-soft:        rgba(16, 185, 129, 0.16);
	--lpc-warn:           #EF4444;
	--lpc-warn-soft:      rgba(239, 68, 68, 0.16);

	--lpc-r-sm:  0.5rem;
	--lpc-r-md:  0.85rem;
	--lpc-r-lg:  1.25rem;
	--lpc-r-xl:  1.75rem;

	--lpc-sh-sm: 0 1px 2px rgba(28,25,23,.04), 0 2px 6px rgba(28,25,23,.04);
	--lpc-sh-md: 0 2px 4px rgba(28,25,23,.04), 0 8px 24px rgba(28,25,23,.06);
	--lpc-sh-lg: 0 4px 8px rgba(28,25,23,.04), 0 24px 64px rgba(28,25,23,.10);
}

/* Strip the base theme nav down to logo + language + login. */
/* Strip the base theme nav down to logo + language + login.
   Uses :has() so it works whether or not the body class is present. */
body:has(main.lpc) .site-nav,
body:has(main.lpc) .site-header .site-nav__list,
body:has(main.lpc) .site-header .site-nav__cta-group,
body:has(main.lpc) .site-header__nav-toggle,
body:has(main.lpc) .mobile-nav,
body:has(main.lpc) .site-footer__nav,
body:has(main.lpc) .site-footer__cta {
	display: none !important;
}

/* When the sticky bar is up it must never cover content. */
body:has(main.lpc .lpc-stickycta.is-visible) {
	padding-block-end: 4.5rem;
}
html { scroll-padding-block-end: 5rem; }

/* Container. Same rhythm across all sections. */
.lpc-container {
	inline-size: 100%;
	max-inline-size: 72rem;
	margin-inline: auto;
	padding-inline: clamp(1.25rem, 4vw, 2.5rem);
}


/* ================================================================
   1. HERO
   ================================================================ */
.lpc-hero {
	position: relative;
	padding-block: clamp(4rem, 9vw, 7rem) clamp(3.5rem, 7vw, 6rem);
	background:
		radial-gradient(ellipse at 20% 0%, rgba(204,120,92,0.10), transparent 55%),
		radial-gradient(ellipse at 90% 30%, rgba(204,120,92,0.06), transparent 45%),
		linear-gradient(180deg, var(--lpc-paper-warm) 0%, #FFFDFB 100%);
	overflow: hidden;
}
.lpc-hero::before {
	content: '';
	position: absolute;
	inset: 0;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140' viewBox='0 0 140 140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='0.55'/%3E%3C/svg%3E");
	opacity: 0.035;
	pointer-events: none;
	mix-blend-mode: multiply;
}
.lpc-hero__inner { position: relative; text-align: center; }
.lpc-hero__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	background: rgba(255,255,255,0.75);
	backdrop-filter: blur(6px);
	padding-block: 0.4rem;
	padding-inline: 0.9rem;
	border-radius: 999px;
	border: 1px solid var(--lpc-line);
	box-shadow: var(--lpc-sh-sm);
	color: var(--lpc-ink-soft);
	margin-block-end: 1.5rem;
}
.lpc-hero__eyebrow-dot {
	inline-size: 0.5rem; block-size: 0.5rem;
	background: var(--lpc-ok); border-radius: 50%;
	box-shadow: 0 0 0 3px rgba(16,185,129,0.18);
}
.lpc-hero__title {
	font-size: clamp(2.4rem, 5.5vw, 4.25rem);
	line-height: 1.05;
	letter-spacing: -0.02em;
	color: var(--lpc-ink);
	margin: 0 0 1.25rem;
	max-inline-size: 22ch;
	margin-inline: auto;
}
.lpc-hero__title em { font-style: italic; color: var(--lpc-ink); }
.lpc-hero__sub {
	font-size: clamp(1.05rem, 1.6vw, 1.2rem);
	line-height: 1.6;
	color: var(--lpc-ink-soft);
	max-inline-size: 42rem;
	margin: 0 auto 2.5rem;
}
.lpc-hero__prompt {
	max-inline-size: 40rem;
	margin: 0 auto 1.5rem;
	text-align: start;
}
.lpc-hero__chips {
	justify-content: center;
	margin-block-end: 2rem;
}
.lpc-hero__trust {
	display: flex;
	justify-content: center;
	gap: clamp(1rem, 2.5vw, 1.75rem);
	flex-wrap: wrap;
	margin-block-end: 1.5rem;
}
.lpc-hero__jump {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	color: var(--lpc-ink-mute);
	text-decoration: none;
	font-size: 0.925rem;
}
.lpc-hero__jump:hover { color: var(--lpc-primary); }
.lpc-hero__jump .lpc-arrow {
	inline-size: 1rem; block-size: 1rem;
	transition: transform 0.2s ease;
}
.lpc-hero__jump:hover .lpc-arrow { transform: translateX(2px); }
[dir="rtl"] .lpc-arrow { transform: scaleX(-1); }
[dir="rtl"] .lpc-hero__jump:hover .lpc-arrow { transform: scaleX(-1) translateX(2px); }


/* ================================================================
   2. PILLARS
   ================================================================ */
.lpc-pillars {
	padding-block: clamp(4rem, 8vw, 6.5rem);
	background: var(--lpc-paper);
	border-block-start: 1px solid var(--lpc-line-soft);
}
.lpc-pillars .v2eyebrow,
.lpc-pillars__sub { text-align: center; }
.lpc-pillars .v2eyebrow {
	display: inline-block; margin: 0 auto 1rem;
	inline-size: fit-content;
}
.lpc-pillars__title {
	font-size: clamp(2rem, 4.5vw, 3.25rem);
	line-height: 1.1;
	text-align: center;
	color: var(--lpc-ink);
	max-inline-size: 20ch;
	margin: 0 auto 1rem;
	letter-spacing: -0.015em;
}
.lpc-pillars__sub {
	max-inline-size: 40rem;
	margin: 0 auto 3rem;
	color: var(--lpc-ink-soft);
	line-height: 1.65;
	font-size: 1.05rem;
}
.lpc-pillars__grid {
	list-style: none;
	padding: 0; margin: 0;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.25rem;
}
@media (max-width: 900px) {
	.lpc-pillars__grid { grid-template-columns: 1fr; }
}
.lpc-pillar {
	background: var(--lpc-paper-warm);
	border: 1px solid var(--lpc-line);
	border-radius: var(--lpc-r-lg);
	padding: 2rem 1.75rem;
	position: relative;
}
.lpc-pillar__num {
	display: block;
	font-family: 'DM Serif Display', serif;
	font-size: 1.05rem;
	color: var(--lpc-primary);
	letter-spacing: 0.02em;
	margin-block-end: 1.5rem;
}
.lpc-pillar__icon {
	display: inline-flex;
	align-items: center; justify-content: center;
	inline-size: 2.5rem; block-size: 2.5rem;
	border-radius: 50%;
	background: rgba(204,120,92,0.12);
	color: var(--lpc-primary);
	margin-block-end: 1rem;
}
.lpc-pillar__icon svg { inline-size: 1.25rem; block-size: 1.25rem; }
.lpc-pillar__name {
	font-size: 1.15rem;
	font-weight: 600;
	color: var(--lpc-ink);
	margin: 0 0 0.75rem;
	padding-block-end: 0.75rem;
	border-block-end: 1px dashed var(--lpc-line);
}
.lpc-pillar__sample {
	color: var(--lpc-ink-soft);
	line-height: 1.6;
	margin: 0 0 1.25rem;
	font-size: 1rem;
}
.lpc-pillar__sample em { font-style: italic; }
.lpc-pillar__cap {
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--lpc-ink-mute);
}
.lpc-pillars__plus {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	margin: 2.5rem auto 0;
	padding: 0.75rem 1.25rem;
	background: rgba(204,120,92,0.08);
	border-radius: 999px;
	color: var(--lpc-primary-strong);
	font-size: 0.95rem;
	font-weight: 500;
	inset-inline-start: 50%;
	transform: translateX(-50%);
	position: relative;
}
[dir="rtl"] .lpc-pillars__plus { transform: translateX(50%); }
.lpc-pillars__plus-icon { inline-size: 1rem; block-size: 1rem; }


/* ================================================================
   3. PREVIEW  (interactive sample panel)
   ================================================================ */
.lpc-preview {
	padding-block: clamp(4.5rem, 8vw, 7rem);
	background: var(--lpc-paper-warm-2);
	position: relative;
	overflow: hidden;
}
.lpc-preview::before {
	content: '';
	position: absolute; inset: 0;
	background:
		radial-gradient(ellipse at 15% 20%, rgba(204,120,92,0.08), transparent 40%),
		radial-gradient(ellipse at 85% 80%, rgba(204,120,92,0.06), transparent 45%);
	pointer-events: none;
}
.lpc-preview > .lpc-container { position: relative; text-align: center; }
.lpc-preview .v2eyebrow {
	display: inline-block; margin: 0 auto 1rem;
}
.lpc-preview__title {
	font-size: clamp(2rem, 4.5vw, 3.25rem);
	line-height: 1.1;
	color: var(--lpc-ink);
	max-inline-size: 22ch;
	margin: 0 auto 1rem;
	letter-spacing: -0.015em;
}
.lpc-preview__sub {
	max-inline-size: 40rem;
	margin: 0 auto 2.5rem;
	color: var(--lpc-ink-soft);
	line-height: 1.65;
	font-size: 1.05rem;
}
.lpc-preview__chips {
	display: inline-flex;
	gap: 0.4rem;
	background: rgba(255,255,255,0.65);
	backdrop-filter: blur(6px);
	padding: 0.35rem;
	border-radius: 999px;
	border: 1px solid var(--lpc-line);
	box-shadow: var(--lpc-sh-sm);
	margin-block-end: 2rem;
	flex-wrap: wrap;
	justify-content: center;
}
.lpc-preview__chip {
	appearance: none;
	background: transparent;
	border: 0;
	padding: 0.55rem 1rem;
	border-radius: 999px;
	font-size: 0.9rem;
	font-weight: 500;
	color: var(--lpc-ink-soft);
	cursor: pointer;
	transition: background 0.18s ease, color 0.18s ease;
	font-family: inherit;
}
.lpc-preview__chip:hover { color: var(--lpc-ink); }
.lpc-preview__chip.is-active {
	background: var(--lpc-ink);
	color: #fff;
	box-shadow: var(--lpc-sh-sm);
}
.lpc-preview__panel {
	background: var(--lpc-paper);
	border: 1px solid var(--lpc-line);
	border-radius: var(--lpc-r-xl);
	box-shadow: var(--lpc-sh-lg);
	overflow: hidden;
	text-align: start;
	max-inline-size: 56rem;
	margin: 0 auto;
}
.lpc-preview__chrome {
	display: flex;
	align-items: center;
	gap: 0.4rem;
	padding: 0.85rem 1rem;
	background: var(--lpc-paper-warm);
	border-block-end: 1px solid var(--lpc-line-soft);
}
.lpc-preview__tl {
	inline-size: 0.65rem; block-size: 0.65rem;
	border-radius: 50%;
	background: var(--lpc-line);
}
.lpc-preview__tl:nth-child(1) { background: rgba(239, 68, 68, 0.6); }
.lpc-preview__tl:nth-child(2) { background: rgba(245, 158, 11, 0.6); }
.lpc-preview__tl:nth-child(3) { background: rgba(16, 185, 129, 0.6); }
.lpc-preview__url {
	margin-inline-start: 0.75rem;
	padding: 0.35rem 0.85rem;
	background: var(--lpc-paper);
	border: 1px solid var(--lpc-line);
	border-radius: 999px;
	font-size: 0.8rem;
	color: var(--lpc-ink-mute);
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	flex: 1;
	min-inline-size: 0;
	max-inline-size: 32rem;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.lpc-preview__url-icon {
	inline-size: 0.9rem; block-size: 0.9rem;
	color: var(--lpc-primary);
	flex-shrink: 0;
}
.lpc-preview__url span {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.lpc-preview__body {
	display: grid;
	grid-template-columns: 1.1fr 1fr;
	gap: 0;
}
@media (max-width: 780px) {
	.lpc-preview__body { grid-template-columns: 1fr; }
}
.lpc-preview__dna {
	padding: 1.75rem 1.75rem 1.5rem;
	border-inline-end: 1px solid var(--lpc-line-soft);
}
@media (max-width: 780px) {
	.lpc-preview__dna { border-inline-end: 0; border-block-end: 1px solid var(--lpc-line-soft); }
}
.lpc-preview__dna-block { margin-block-end: 1.25rem; }
.lpc-preview__dna-block:last-child { margin-block-end: 0; }
.lpc-preview__dna-label {
	font-size: 0.7rem;
	text-transform: uppercase;
	letter-spacing: 0.09em;
	color: var(--lpc-primary);
	font-weight: 600;
	margin: 0 0 0.4rem;
}
.lpc-preview__dna-text {
	font-family: 'DM Serif Display', serif;
	font-size: 1.02rem;
	line-height: 1.5;
	color: var(--lpc-ink);
	margin: 0;
}
.lpc-preview__dna-text em { font-style: italic; }
.lpc-preview__names { padding: 1.75rem; }
.lpc-preview__names-label {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	font-size: 0.7rem;
	text-transform: uppercase;
	letter-spacing: 0.09em;
	color: var(--lpc-primary);
	font-weight: 600;
	margin: 0 0 1rem;
}
.lpc-preview__names-icon { inline-size: 0.85rem; block-size: 0.85rem; }
.lpc-preview__names-list {
	list-style: none;
	padding: 0; margin: 0;
	display: flex;
	flex-direction: column;
	gap: 0.6rem;
}
.lpc-preview__name {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	padding: 0.7rem 0.9rem;
	background: var(--lpc-paper-warm);
	border: 1px solid var(--lpc-line-soft);
	border-radius: var(--lpc-r-md);
}
.lpc-preview__name-text {
	font-family: 'DM Serif Display', serif;
	font-size: 1.05rem;
	color: var(--lpc-ink);
}
.lpc-preview__name-doms {
	display: flex;
	gap: 0.3rem;
	flex-wrap: wrap;
	justify-content: flex-end;
}
.lpc-dom {
	display: inline-flex;
	align-items: center;
	gap: 0.25rem;
	padding: 0.2rem 0.55rem;
	border-radius: 999px;
	font-size: 0.72rem;
	font-weight: 600;
	line-height: 1;
	font-variant-numeric: tabular-nums;
}
.lpc-dom__tld { font-weight: 500; }
.lpc-dom--ok {
	background: var(--lpc-ok-soft);
	color: var(--lpc-ok);
}
.lpc-dom--taken {
	background: var(--lpc-warn-soft);
	color: var(--lpc-warn);
	text-decoration: line-through;
	text-decoration-thickness: 1px;
	opacity: 0.85;
}
.lpc-preview__foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 1rem 1.75rem;
	background: var(--lpc-paper-warm);
	border-block-start: 1px solid var(--lpc-line-soft);
	flex-wrap: wrap;
}
.lpc-preview__badge {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	font-size: 0.9rem;
	color: var(--lpc-ink-soft);
	font-weight: 500;
}
.lpc-preview__badge-icon {
	inline-size: 1rem; block-size: 1rem;
	color: var(--lpc-primary);
}


/* ================================================================
   4. DREAM  (paid features, visualised)
   ================================================================ */
.lpc-dream {
	padding-block: clamp(4.5rem, 9vw, 7.5rem);
	background: linear-gradient(180deg, var(--lpc-dark-2) 0%, var(--lpc-dark) 100%);
	color: rgba(255,255,255,0.9);
	position: relative;
	overflow: hidden;
}
.lpc-dream::before,
.lpc-dream::after {
	content: '';
	position: absolute;
	inline-size: 40rem; block-size: 40rem;
	border-radius: 50%;
	filter: blur(80px);
	opacity: 0.25;
	pointer-events: none;
}
.lpc-dream::before {
	top: -10rem; inset-inline-start: -12rem;
	background: radial-gradient(circle, rgba(204,120,92,0.5), transparent 65%);
}
.lpc-dream::after {
	bottom: -12rem; inset-inline-end: -12rem;
	background: radial-gradient(circle, rgba(120, 80, 200, 0.35), transparent 65%);
}
.lpc-dream > .lpc-container { position: relative; text-align: center; }
.v2eyebrow--dark {
	background: rgba(255,255,255,0.08);
	color: rgba(255,255,255,0.85);
	border: 1px solid rgba(255,255,255,0.12);
	backdrop-filter: blur(4px);
	display: inline-block;
	padding: 0.35rem 0.9rem;
	border-radius: 999px;
	font-size: 0.85rem;
	font-weight: 500;
	margin-block-end: 1rem;
}
.lpc-dream__title {
	font-size: clamp(2rem, 4.75vw, 3.5rem);
	line-height: 1.1;
	color: #fff;
	max-inline-size: 20ch;
	margin: 0 auto 1rem;
	letter-spacing: -0.02em;
}
.lpc-dream__title em {
	font-style: italic;
	background: linear-gradient(135deg, #F5B896, #10a37f);
	background-clip: text; -webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}
.lpc-dream__sub {
	max-inline-size: 44rem;
	margin: 0 auto 3.5rem;
	color: rgba(255,255,255,0.65);
	line-height: 1.65;
	font-size: 1.05rem;
}
.lpc-dream__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1rem;
}
@media (max-width: 1100px) { .lpc-dream__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px)  { .lpc-dream__grid { grid-template-columns: 1fr; } }
.lpc-dream__card {
	background: rgba(255,255,255,0.03);
	border: 1px solid rgba(255,255,255,0.08);
	border-radius: var(--lpc-r-lg);
	padding: 1.5rem 1.35rem 1.5rem;
	text-align: start;
	transition: transform 0.25s ease, border-color 0.25s ease, background 0.25s ease;
	backdrop-filter: blur(4px);
}
.lpc-dream__card:hover {
	transform: translateY(-3px);
	border-color: rgba(204,120,92,0.35);
	background: rgba(255,255,255,0.05);
}
.lpc-dream__mockup {
	block-size: 8.5rem;
	margin-block-end: 1.25rem;
	border-radius: var(--lpc-r-md);
	background: linear-gradient(135deg, rgba(255,255,255,0.05), rgba(255,255,255,0.02));
	border: 1px solid rgba(255,255,255,0.05);
	overflow: hidden;
	position: relative;
	color: #F5B896;
}
.lpc-dream__name {
	font-size: 1.05rem;
	font-weight: 600;
	color: #fff;
	margin: 0 0 0.5rem;
	letter-spacing: -0.005em;
}
.lpc-dream__desc {
	font-size: 0.9rem;
	line-height: 1.55;
	color: rgba(255,255,255,0.6);
	margin: 0;
}
.lpc-dream__note {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	margin-block-start: 3rem;
	padding: 0.75rem 1.25rem;
	background: rgba(204,120,92,0.14);
	border: 1px solid rgba(204,120,92,0.25);
	border-radius: 999px;
	color: #F5B896;
	font-size: 0.95rem;
	font-weight: 500;
}
.lpc-dream__note-icon { inline-size: 1rem; block-size: 1rem; }


/* ---- Mockup: browser (website builder) ---- */
.lpc-mock--browser { padding: 0.6rem 0.6rem 0; display: flex; flex-direction: column; }
.lpc-mock__chrome {
	display: flex; gap: 0.25rem;
	padding-block-end: 0.4rem;
}
.lpc-mock__chrome span {
	inline-size: 0.35rem; block-size: 0.35rem;
	border-radius: 50%;
	background: rgba(255,255,255,0.25);
}
.lpc-mock__screen {
	flex: 1;
	background: linear-gradient(135deg, #F5EDE4 0%, #FBF7F3 100%);
	border-radius: 0.35rem 0.35rem 0 0;
	padding: 0.6rem 0.75rem;
	position: relative;
	overflow: hidden;
}
.lpc-mock__hero { display: flex; flex-direction: column; gap: 0.25rem; }
.lpc-mock__logo-mark {
	color: var(--lpc-ink);
	font-size: 0.9rem;
	margin-block-end: 0.2rem;
	line-height: 1;
}
.lpc-mock__hero-line {
	display: block;
	block-size: 0.28rem;
	background: var(--lpc-ink);
	opacity: 0.75;
	border-radius: 2px;
}
.lpc-mock__hero-line--big { inline-size: 85%; block-size: 0.4rem; }
.lpc-mock__hero-line--med { inline-size: 55%; opacity: 0.4; }
.lpc-mock__hero-btn {
	inline-size: 2.5rem; block-size: 0.6rem;
	background: var(--lpc-primary);
	border-radius: 0.2rem;
	margin-block-start: 0.4rem;
}
.lpc-mock__live {
	position: absolute;
	top: 0.5rem; inset-inline-end: 0.5rem;
	background: var(--lpc-ok);
	color: #fff;
	font-size: 0.55rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	padding: 0.15rem 0.4rem;
	border-radius: 0.2rem;
}

/* ---- Mockup: logos ---- */
.lpc-mock--logos {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 0.75rem;
	gap: 0.6rem;
}
.lpc-mock__logo-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 0.4rem;
	inline-size: 100%;
	max-inline-size: 8rem;
}
.lpc-mock__lg {
	aspect-ratio: 1;
	background: rgba(255,255,255,0.9);
	border-radius: 0.35rem;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--lpc-ink);
	font-size: 1.2rem;
	line-height: 1;
}
.lpc-mock__lg--dark {
	background: var(--lpc-ink);
	color: #F5B896;
}
.lpc-mock__logo-cap {
	font-size: 0.6rem;
	color: rgba(255,255,255,0.4);
	letter-spacing: 0.15em;
	font-weight: 600;
}

/* ---- Mockup: social ---- */
.lpc-mock--social {
	padding: 0.7rem;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}
.lpc-mock__chat { display: flex; flex-direction: column; gap: 0.3rem; }
.lpc-mock__bubble {
	padding: 0.4rem 0.6rem;
	border-radius: 0.6rem;
	font-size: 0.65rem;
	max-inline-size: 75%;
	line-height: 1.3;
}
.lpc-mock__bubble--you {
	align-self: flex-end;
	background: var(--lpc-primary);
	color: #fff;
	border-end-end-radius: 0.15rem;
}
.lpc-mock__bubble--ai {
	align-self: flex-start;
	background: rgba(255,255,255,0.12);
	border-end-start-radius: 0.15rem;
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
	padding: 0.55rem 0.7rem;
}
.lpc-mock__bubble-line {
	display: block;
	block-size: 0.2rem;
	inline-size: 4rem;
	background: rgba(255,255,255,0.35);
	border-radius: 1px;
}
.lpc-mock__bubble-line--short { inline-size: 2.5rem; }
.lpc-mock__cal {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 0.2rem;
	margin-block-start: 0.15rem;
}
.lpc-mock__cal-cell {
	aspect-ratio: 1;
	background: rgba(255,255,255,0.08);
	border-radius: 0.15rem;
}
.lpc-mock__cal-cell.is-on {
	background: var(--lpc-primary);
	opacity: 0.85;
}

/* ---- Mockup: blog ---- */
.lpc-mock--blog {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0.85rem;
	position: relative;
}
.lpc-mock__posts { position: relative; inline-size: 80%; block-size: 100%; }
.lpc-mock__post {
	position: absolute;
	background: rgba(255,255,255,0.95);
	border-radius: 0.35rem;
	padding: 0.5rem 0.6rem;
	inline-size: 100%;
	color: var(--lpc-ink);
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	box-shadow: 0 2px 8px rgba(0,0,0,0.25);
}
.lpc-mock__post:nth-child(1) { top: 0; inset-inline-start: 0; z-index: 3; transform: rotate(-2deg); }
.lpc-mock__post--stack   { top: 0.5rem; inset-inline-start: 0.5rem; z-index: 2; transform: rotate(1deg); opacity: 0.7; }
.lpc-mock__post--stack2  { top: 1rem;   inset-inline-start: 1rem;   z-index: 1; block-size: 3.5rem; opacity: 0.4; }
.lpc-mock__post-tag {
	background: var(--lpc-primary);
	color: #fff;
	font-size: 0.55rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	padding: 0.1rem 0.3rem;
	border-radius: 0.15rem;
	align-self: flex-start;
}
.lpc-mock__post-line {
	display: block;
	block-size: 0.25rem;
	background: var(--lpc-ink);
	border-radius: 1px;
	opacity: 0.85;
}
.lpc-mock__post-line--big { inline-size: 85%; }
.lpc-mock__post-line--med { inline-size: 60%; opacity: 0.4; }
.lpc-mock__post-line--sm  { inline-size: 40%; opacity: 0.4; }

/* ---- Mockup: SEO ---- */
.lpc-mock--seo {
	padding: 0.7rem;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 0.5rem;
	color: var(--lpc-ok);
}
.lpc-mock__meter { flex: 1; }
.lpc-mock__meter svg { inline-size: 100%; block-size: 100%; }
.lpc-mock__kw { display: flex; flex-wrap: wrap; gap: 0.25rem; }
.lpc-mock__kw-pill {
	background: rgba(16,185,129,0.16);
	color: #4ADE80;
	padding: 0.15rem 0.45rem;
	border-radius: 999px;
	font-size: 0.6rem;
	font-weight: 500;
}
.lpc-mock__kw-pill--dim {
	background: rgba(255,255,255,0.08);
	color: rgba(255,255,255,0.4);
}

/* ---- Mockup: importer ---- */
.lpc-mock--importer {
	padding: 0.7rem;
	display: flex;
	align-items: center;
	gap: 0.4rem;
}
.lpc-mock__import-old,
.lpc-mock__import-new {
	flex: 1;
	block-size: 5.5rem;
	border-radius: 0.3rem;
	padding: 0.5rem;
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	overflow: hidden;
}
.lpc-mock__import-old {
	background: rgba(255,255,255,0.06);
	opacity: 0.5;
}
.lpc-mock__import-old span {
	block-size: 0.3rem;
	background: rgba(255,255,255,0.35);
	border-radius: 1px;
}
.lpc-mock__import-old span:nth-child(1) { inline-size: 70%; }
.lpc-mock__import-old span:nth-child(2) { inline-size: 50%; }
.lpc-mock__import-old span:nth-child(3) { inline-size: 65%; }
.lpc-mock__import-old span:nth-child(4) { inline-size: 40%; }
.lpc-mock__import-arrow {
	color: var(--lpc-primary);
	display: flex;
	align-items: center;
	flex-shrink: 0;
}
.lpc-mock__import-arrow svg { inline-size: 1.1rem; block-size: 1.1rem; }
[dir="rtl"] .lpc-mock__import-arrow svg { transform: scaleX(-1); }
.lpc-mock__import-new {
	background: linear-gradient(135deg, #F5EDE4 0%, #FBF7F3 100%);
	color: var(--lpc-ink);
}
.lpc-mock__import-hero {
	block-size: 1.5rem;
	background: var(--lpc-primary);
	border-radius: 0.2rem;
	opacity: 0.85;
	margin-block-end: 0.15rem;
}
.lpc-mock__import-line {
	block-size: 0.3rem;
	background: var(--lpc-ink);
	border-radius: 1px;
	opacity: 0.7;
	inline-size: 90%;
}
.lpc-mock__import-line--short { inline-size: 55%; opacity: 0.4; }

/* ---- Mockup: merch ---- */
.lpc-mock--merch {
	padding: 0.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.35rem;
	color: #F5B896;
}
.lpc-mock__merch { display: contents; }
.lpc-mock__merch-tee  { inline-size: 3.2rem; block-size: auto; }
.lpc-mock__merch-mug  { inline-size: 2.1rem; block-size: auto; }
.lpc-mock__merch-tote { inline-size: 2.3rem; block-size: auto; }

/* ---- Mockup: workspaces ---- */
.lpc-mock--workspaces {
	padding: 0.7rem;
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
}
.lpc-mock__ws { display: flex; gap: 0.25rem; }
.lpc-mock__ws-tab {
	flex: 1;
	background: rgba(255,255,255,0.08);
	padding: 0.35rem 0.4rem;
	border-radius: 0.25rem 0.25rem 0 0;
	display: flex;
	align-items: center;
	gap: 0.25rem;
	font-size: 0.6rem;
	color: rgba(255,255,255,0.5);
	overflow: hidden;
}
.lpc-mock__ws-tab.is-active {
	background: rgba(204,120,92,0.25);
	color: #F5B896;
	font-weight: 600;
}
.lpc-mock__ws-tab span { font-size: 0.75rem; }
.lpc-mock__ws-tab em { font-style: normal; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lpc-mock__ws-canvas {
	flex: 1;
	background: rgba(204,120,92,0.12);
	border-radius: 0 0.25rem 0.25rem 0.25rem;
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	padding: 0.5rem;
}
.lpc-mock__ws-canvas span {
	block-size: 0.3rem;
	background: rgba(255,255,255,0.35);
	border-radius: 1px;
}
.lpc-mock__ws-canvas span:nth-child(1) { inline-size: 80%; }
.lpc-mock__ws-canvas span:nth-child(2) { inline-size: 50%; }
.lpc-mock__ws-canvas span:nth-child(3) { inline-size: 65%; }


/* ================================================================
   5. MANIFESTO  (dreams, not brands — replaces founder note)
   ================================================================ */
.lpc-manifesto {
	padding-block: clamp(4.5rem, 9vw, 7.5rem);
	background:
		radial-gradient(ellipse at 50% 0%, rgba(204,120,92,0.18), transparent 55%),
		radial-gradient(ellipse at 10% 100%, rgba(120, 80, 200, 0.10), transparent 45%),
		linear-gradient(180deg, #14100E 0%, #0F0D0C 100%);
	color: rgba(255,255,255,0.9);
	text-align: center;
	position: relative;
	overflow: hidden;
}
.lpc-manifesto::before {
	content: '';
	position: absolute; inset: 0;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140' viewBox='0 0 140 140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='0.55'/%3E%3C/svg%3E");
	opacity: 0.04;
	pointer-events: none;
	mix-blend-mode: screen;
}
.lpc-manifesto__inner {
	max-inline-size: 44rem;
	margin: 0 auto;
	position: relative;
}
.lpc-manifesto__stars {
	display: block;
	inline-size: min(18rem, 60%);
	margin: 0 auto 1.75rem;
	color: rgba(245, 184, 150, 0.55);
	opacity: 0.75;
}
.lpc-manifesto__stars svg { inline-size: 100%; block-size: auto; }
.lpc-manifesto .v2eyebrow {
	background: rgba(255,255,255,0.08);
	color: rgba(255,255,255,0.85);
	border: 1px solid rgba(255,255,255,0.12);
	backdrop-filter: blur(4px);
	display: inline-block;
	padding: 0.35rem 0.9rem;
	border-radius: 999px;
	font-size: 0.85rem;
	font-weight: 500;
	margin-block-end: 1.5rem;
}
.lpc-manifesto__title {
	font-size: clamp(2.1rem, 5vw, 3.75rem);
	line-height: 1.1;
	color: #fff;
	margin: 0 0 2rem;
	letter-spacing: -0.02em;
}
.lpc-manifesto__title em {
	font-style: italic;
	background: linear-gradient(135deg, #F5B896, #10a37f);
	background-clip: text; -webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}
.lpc-manifesto__body {
	font-size: 1.1rem;
	line-height: 1.75;
	color: rgba(255,255,255,0.65);
	margin: 0 0 1.25rem;
}
.lpc-manifesto__body:last-of-type { margin-block-end: 2.25rem; }
.lpc-manifesto__punch {
	font-size: clamp(1.35rem, 2.5vw, 1.75rem);
	color: #F5B896;
	margin: 0;
	letter-spacing: -0.01em;
}
.lpc-manifesto__punch em { font-style: italic; }


/* ================================================================
   6. PRICING
   ================================================================ */
.lpc-pricing {
	padding-block: clamp(4rem, 8vw, 6.5rem);
	background: var(--lpc-paper);
	text-align: center;
	border-block-start: 1px solid var(--lpc-line-soft);
}
.lpc-pricing .v2eyebrow {
	display: inline-block; margin: 0 auto 1rem;
}
.lpc-pricing__title {
	font-size: clamp(2rem, 4.5vw, 3.25rem);
	line-height: 1.1;
	color: var(--lpc-ink);
	margin: 0 auto 1rem;
	max-inline-size: 20ch;
	letter-spacing: -0.015em;
}
.lpc-pricing__title em { font-style: italic; }
.lpc-pricing__sub {
	max-inline-size: 42rem;
	margin: 0 auto 3rem;
	color: var(--lpc-ink-soft);
	line-height: 1.65;
	font-size: 1.05rem;
}
.lpc-pricing__grid {
	list-style: none; padding: 0; margin: 0;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.25rem;
	text-align: start;
	align-items: stretch;
}
@media (max-width: 900px) { .lpc-pricing__grid { grid-template-columns: 1fr; } }
.lpc-plan {
	background: var(--lpc-paper);
	border: 1px solid var(--lpc-line);
	border-radius: var(--lpc-r-lg);
	padding: 2rem 1.75rem;
	position: relative;
	display: flex;
	flex-direction: column;
}
.lpc-plan.is-popular {
	border: 2px solid var(--lpc-primary);
	box-shadow: var(--lpc-sh-lg);
	background: linear-gradient(180deg, var(--lpc-paper) 0%, var(--lpc-paper-warm) 100%);
}
.lpc-plan__badge {
	position: absolute;
	top: -0.85rem;
	inset-inline-start: 50%;
	transform: translateX(-50%);
	background: var(--lpc-primary);
	color: #fff;
	padding: 0.3rem 0.8rem;
	border-radius: 999px;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	display: inline-flex;
	align-items: center;
	gap: 0.3rem;
	white-space: nowrap;
}
[dir="rtl"] .lpc-plan__badge { transform: translateX(50%); }
.lpc-plan__badge-icon { inline-size: 0.85rem; block-size: 0.85rem; }
.lpc-plan__name { font-size: 1.5rem; margin: 0 0 0.4rem; color: var(--lpc-ink); }
.lpc-plan__tagline {
	font-size: 0.9rem; color: var(--lpc-ink-mute);
	margin: 0 0 1.5rem; line-height: 1.5;
	min-block-size: 2.7rem;
}
.lpc-plan__price {
	display: flex; align-items: baseline;
	gap: 0.15rem; margin: 0 0 1.5rem;
	padding-block-end: 1.5rem;
	border-block-end: 1px dashed var(--lpc-line);
}
.lpc-plan__curr { font-size: 1.2rem; color: var(--lpc-ink-mute); }
.lpc-plan__amt {
	font-family: 'DM Serif Display', serif;
	font-size: 3.25rem; line-height: 1;
	color: var(--lpc-ink);
	letter-spacing: -0.02em;
}
.lpc-plan__per { font-size: 0.95rem; color: var(--lpc-ink-mute); }
.lpc-plan__meta {
	list-style: none; padding: 0;
	margin: 0 0 1.25rem;
	display: grid; grid-template-columns: 1fr 1fr;
	gap: 0.75rem;
}
.lpc-plan__meta-hero {
	background: var(--lpc-paper-warm);
	border-radius: var(--lpc-r-md);
	padding: 0.85rem 0.9rem;
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
}
.lpc-plan__meta-value {
	font-family: 'DM Serif Display', serif;
	font-size: 1.6rem;
	line-height: 1;
	color: var(--lpc-primary-strong);
	letter-spacing: -0.01em;
}
.lpc-plan__meta-label {
	font-size: 0.72rem;
	color: var(--lpc-ink-mute);
	line-height: 1.3;
}
.lpc-plan__all {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	background: var(--lpc-ok-soft);
	color: #059669;
	padding: 0.5rem 0.85rem;
	border-radius: var(--lpc-r-md);
	font-size: 0.85rem;
	font-weight: 600;
	margin: 0 0 1.5rem;
	align-self: flex-start;
}
.lpc-plan__all-icon { inline-size: 0.95rem; block-size: 0.95rem; }
.lpc-plan__cta {
	margin-block-start: auto;
	inline-size: 100%;
	justify-content: center;
}
.lpc-pricing__foot {
	margin: 2.5rem auto 0;
	max-inline-size: 44rem;
	font-size: 0.9rem;
	color: var(--lpc-ink-mute);
	line-height: 1.55;
}


/* ================================================================
   7. FAQ
   ================================================================ */
.lpc-faq {
	padding-block: clamp(4rem, 8vw, 6.5rem);
	background: var(--lpc-paper-warm);
}
.lpc-faq__inner { max-inline-size: 48rem; margin: 0 auto; }
.lpc-faq .v2eyebrow {
	display: inline-block; margin: 0 auto 1rem;
}
.lpc-faq__title {
	font-size: clamp(1.85rem, 4vw, 2.85rem);
	line-height: 1.15;
	text-align: center;
	color: var(--lpc-ink);
	margin: 0 auto 3rem;
	max-inline-size: 22ch;
	letter-spacing: -0.015em;
}
.lpc-faq__list {
	list-style: none;
	padding: 0; margin: 0;
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}
.lpc-faq__item {
	background: var(--lpc-paper);
	border: 1px solid var(--lpc-line);
	border-radius: var(--lpc-r-md);
	overflow: hidden;
}
.lpc-faq__item details { padding: 0; }
.lpc-faq__item summary {
	list-style: none;
	cursor: pointer;
	padding: 1.15rem 1.35rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	font-weight: 500;
}
.lpc-faq__item summary::-webkit-details-marker { display: none; }
.lpc-faq__q { color: var(--lpc-ink); font-size: 1.02rem; }
.lpc-faq__caret {
	inline-size: 1.75rem; block-size: 1.75rem;
	border-radius: 50%;
	background: var(--lpc-paper-warm);
	color: var(--lpc-ink-soft);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: transform 0.2s ease, background 0.2s ease, color 0.2s ease;
	flex-shrink: 0;
}
.lpc-faq__caret svg { inline-size: 1rem; block-size: 1rem; }
.lpc-faq__item details[open] .lpc-faq__caret {
	transform: rotate(45deg);
	background: var(--lpc-primary);
	color: #fff;
}
.lpc-faq__a {
	padding: 0 1.35rem 1.35rem;
	margin: 0;
	color: var(--lpc-ink-soft);
	line-height: 1.65;
	font-size: 0.98rem;
}


/* ================================================================
   8. FINAL CTA (dark, mirrored hero)
   ================================================================ */
.lpc-final {
	padding-block: clamp(4.5rem, 8vw, 7rem);
	background: linear-gradient(180deg, var(--lpc-dark) 0%, #000 100%);
	color: rgba(255,255,255,0.95);
	position: relative;
	overflow: hidden;
	text-align: center;
}
.lpc-final::before {
	content: '';
	position: absolute; inset: 0;
	background:
		radial-gradient(circle at 20% 20%, rgba(204,120,92,0.14), transparent 40%),
		radial-gradient(circle at 80% 80%, rgba(120, 80, 200, 0.10), transparent 40%);
	pointer-events: none;
}
.lpc-final__inner { position: relative; }
.lpc-final__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	margin-block-end: 1.5rem;
}
.lpc-final__title {
	font-size: clamp(2.25rem, 5vw, 3.75rem);
	line-height: 1.1;
	color: #fff;
	margin: 0 auto 2.5rem;
	max-inline-size: 20ch;
	letter-spacing: -0.02em;
}
.lpc-final__title em { font-style: italic; color: #F5B896; }
.lpc-final__prompt {
	max-inline-size: 40rem;
	margin: 0 auto 2rem;
	text-align: start;
}
.lpc-final__trust {
	justify-content: center;
	color: rgba(255,255,255,0.75);
	gap: clamp(1rem, 2.5vw, 1.75rem);
}
.lpc-final__trust svg { color: #F5B896; }


/* ================================================================
   Sticky CTA bar
   ================================================================ */
.lpc-stickycta {
	position: fixed;
	bottom: 0; inset-inline: 0;
	background: rgba(15,13,12,0.94);
	backdrop-filter: blur(12px);
	border-block-start: 1px solid rgba(255,255,255,0.08);
	padding-block: 0.65rem;
	transform: translateY(100%);
	transition: transform 0.28s ease;
	z-index: 100;
	color: #fff;
}
.lpc-stickycta.is-visible { transform: translateY(0); }
.lpc-stickycta__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
}
.lpc-stickycta__copy {
	display: flex;
	flex-direction: column;
	gap: 0.1rem;
	line-height: 1.3;
	min-inline-size: 0;
}
.lpc-stickycta__copy strong { font-size: 0.95rem; }
.lpc-stickycta__copy span { font-size: 0.8rem; color: rgba(255,255,255,0.6); }
.lpc-stickycta__cta {
	white-space: nowrap;
	background: var(--lpc-primary);
	color: #fff;
	border-radius: 0.6rem;
	box-shadow: 0 4px 12px rgba(204,120,92,0.35);
}
@media (max-width: 480px) {
	.lpc-stickycta__copy span { display: none; }
}


/* ================================================================
   Buttons (shared)
   ================================================================ */
.lpc-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.75rem 1.25rem;
	border-radius: 0.6rem;
	font-weight: 600;
	font-size: 0.95rem;
	text-decoration: none;
	border: 1px solid transparent;
	cursor: pointer;
	transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
	font-family: inherit;
	line-height: 1.2;
}
.lpc-btn:hover { transform: translateY(-1px); }
.lpc-btn--sm { padding: 0.55rem 1rem; font-size: 0.9rem; }
.lpc-btn__icon { inline-size: 1rem; block-size: 1rem; }
.lpc-btn--primary {
	background: var(--lpc-primary);
	color: #fff;
	box-shadow: 0 2px 6px rgba(204,120,92,0.35);
}
.lpc-btn--primary:hover {
	background: var(--lpc-primary-strong);
	box-shadow: 0 4px 12px rgba(204,120,92,0.45);
}
.lpc-btn--primary-dark {
	background: var(--lpc-ink);
	color: #fff;
	box-shadow: 0 2px 6px rgba(28,25,23,0.25);
}
.lpc-btn--primary-dark:hover { background: #000; }
.lpc-btn--ghost {
	background: transparent;
	color: var(--lpc-ink);
	border: 1px solid var(--lpc-line);
}
.lpc-btn--ghost:hover {
	background: var(--lpc-paper-warm);
	border-color: var(--lpc-ink-mute);
}


/* ================================================================
   Reduced motion
   ================================================================ */
@media (prefers-reduced-motion: reduce) {
	*, ::before, ::after {
		animation-duration: 0.01ms !important;
		transition-duration: 0.01ms !important;
	}
	.lpc-stickycta { transition: none; }
	.lpc-btn:hover { transform: none; }
	.lpc-dream__card:hover { transform: none; }
}