.vala-landing-hero{background:radial-gradient(circle at 20% 20%,rgba(31,123,255,.22),transparent 36%),radial-gradient(circle at 85% 25%,rgba(5,242,199,.11),transparent 36%),linear-gradient(180deg,#07101f,#091425 72%,#081120);color:#fff;position:relative}.vala-landing-hero__inner{min-height:min(680px,calc(100vh - 140px));display:grid;grid-template-columns:minmax(0,460px) minmax(0,1fr);align-items:center;gap:70px;padding:60px 0 88px}.vala-landing-hero__eyebrow{margin:0 0 12px;font-size:12px;font-weight:900;letter-spacing:.2em;text-transform:uppercase;color:rgba(147,197,253,.82)}.vala-landing-hero__title{margin:0;font-size:clamp(50px,6vw,78px);line-height:.98;letter-spacing:-.06em;font-weight:950}.vala-landing-hero__title span,.vala-landing-hero__title strong{display:block}.vala-landing-hero__title strong{font-style:normal;color:#2887ff;text-shadow:0 18px 60px rgba(40,135,255,.42)}.vala-landing-hero__title--statement{font-size:clamp(30px,4.1vw,46px);line-height:1.14;letter-spacing:-.045em;font-weight:850;color:#fff}.vala-landing-hero__title--statement span{display:block;color:rgba(241,245,249,.96);font-weight:700}.vala-landing-hero__title--statement strong{display:block;margin-top:6px;color:#5eead4;text-shadow:0 14px 44px rgba(45,212,191,.28);font-style:normal}.vala-landing-hero__lead{margin:22px 0 16px;max-width:540px;color:#dbe8ff;font-size:19px;line-height:1.75}.vala-landing-hero__sublead{margin:0 0 28px;max-width:540px;color:rgba(219,232,254,.88);font-size:16px;line-height:1.68;font-weight:600}.vala-landing-hero__actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.vala-landing-play{display:inline-flex;align-items:center;gap:10px;margin-top:26px;color:#fff;text-decoration:none;font-weight:800}.vala-landing-play span{display:grid;place-items:center;width:24px;height:24px;border-radius:999px;border:1px solid rgba(255,255,255,.32);font-size:10px}.vala-security-band{border-radius:18px;background:linear-gradient(135deg,#071225,#0c1b35);color:#fff;padding:38px;display:grid;grid-template-columns:1fr 1.1fr;gap:36px;align-items:center;box-shadow:0 24px 70px rgba(15,23,42,.20)}.vala-security-main{display:flex;gap:24px;align-items:center}.vala-security-main>span{font-size:56px}.vala-security-main h2{margin:0 0 10px}.vala-security-main p{margin:0;color:#cbd5e1;line-height:1.7}.vala-security-band--human .vala-security-main>span{font-size:40px;line-height:1;opacity:.88}.vala-security-items{display:grid;grid-template-columns:repeat(2,1fr);gap:14px 18px}.vala-security-items span{display:block;color:#dbeafe;font-weight:800}.vala-security-items span:before{content:'◎';margin-right:8px;color:#93c5fd}.vala-landing-hero .vala-landing-btn--google-soon:disabled,.vala-landing-hero .vala-landing-btn--google-soon[disabled]{color:rgba(255,255,255,.92);background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.22)}@media (max-width:1100px){.vala-landing-hero__inner{grid-template-columns:1fr;min-height:auto}.vala-hero-preview__shell{transform:none}.vala-fae-grid,.vala-security-band{grid-template-columns:1fr}.vala-fae-cards{grid-template-columns:1fr 1fr}}@media (max-width:720px){.vala-landing-hero__inner{padding:44px 0 56px}.vala-landing-hero__title{font-size:48px}.vala-landing-hero__title--statement{font-size:clamp(26px,7vw,36px)}.vala-landing-hero__lead{font-size:16px}.vala-landing-hero__actions{gap:10px}.vala-hero-preview__shell{min-height:auto;max-width:none;margin:0}.vala-hero-preview__inner{padding:24px 20px}.vala-fae-cards,.vala-hero-preview__cards,.vala-security-items{grid-template-columns:1fr}.vala-security-band{padding:28px}.vala-security-main{align-items:flex-start}} 
/* Phase 12 — OS palette + vertical rhythm (canonical tokens for scene system) */
:root {
	--vala-bg-0: #041025;
	--vala-bg-1: #061a3a;
	--vala-bg-2: #07346a;
	--vala-bg-3: #0b4b91;
	--vala-bg-4: #3159a8;
	--vala-panel: rgba(7, 18, 38, 0.72);
	--vala-panel-border: rgba(93, 211, 255, 0.18);
	--vh-section-pad: clamp(72px, 9vw, 132px);
	--vh-section-pad-sm: clamp(48px, 6vw, 88px);
	--vh-section-gap: clamp(36px, 5vw, 72px);
	/* YNAB-inspired warm foundation (Prompt 1 — brief tokens) */
	--vala-cream: #fff8e8;
	--vala-soft-cream: #fffdf5;
	--vala-pale-blue: #eaf4ff;
	--vala-blue: #2357d6;
	--vala-deep-blue: #113c9b;
	--vala-green: #42d28a;
	--vala-lime: #b7f35a;
	--vala-cyan: #29d6e6;
	--vala-ink: #111a3a;
	--vala-muted: #5d6985;
}

/* Organic blob / wave utilities — disabled on marketing homepage (.vala-homepage) */
.vala-organic-surface {
	position: relative;
}

.vala-organic-blob,
.vala-organic-wave-ribbon {
	display: none;
}

/* Vala landing v2: premium polish (onboarding main only) */
.vala-landing-v2--premium.vala-landing-v2 {
	--vl-hero-preview-max: min(820px, 100%);
}

/* Onboarding shell: warm cream foundation + soft brand blobs (Prompt 1) */
main.vala-onboarding-shell.vala-landing-v2--premium {
	/* Phase 11C — marketing landing surface aliases (use with existing navy/cream tokens) */
	--vala-bg-deep: var(--vala-bg-0, #041025);
	--vala-bg-navy: var(--vala-bg-1, #061a3a);
	--vala-bg-blue: var(--vala-bg-2, #07346a);
	--vala-bg-royal: #123f91;
	--vala-surface-cream: var(--vala-cream, #fff8e8);
	--vala-surface-soft: var(--vala-soft-cream, #fffdf5);
	--vala-surface-cyan: var(--vala-pale-blue, #eaf4ff);
	--vala-transition-opacity-strong: 0.18;
	--vala-transition-opacity-medium: 0.12;
	--vala-transition-opacity-soft: 0.08;
	--vala-section-pad-top: var(--vh-section-pad, clamp(72px, 9vw, 132px));
	--vala-section-pad-bottom: var(--vh-section-pad, clamp(72px, 9vw, 132px));
	--vala-navy-950: #06111f;
	--vala-navy-900: #0b1728;
	--vala-navy-850: #10243a;
	--vala-cyan-400: #38bdf8;
	--vala-cyan-300: #67e8f9;
	--vala-teal-400: #2dd4bf;
	--vala-teal-300: #5eead4;
	--vala-cream-50: #fffaf0;
	--vala-cream-100: #f8f1df;
	--vala-soft-blue-50: #eef8ff;
	--vala-soft-blue-100: #dff3ff;
	--vala-text-dark: #102033;
	--vala-text-soft: #5f6f82;
	--vala-text-light: #f8fbff;
	position: relative;
	overflow-x: clip;
	background: #fff;
}

main.vala-onboarding-shell.vala-landing-v2--premium::before,
main.vala-onboarding-shell.vala-landing-v2--premium::after {
	content: none;
	display: none;
}

.vala-landing-v2--premium.vala-onboarding-shell.vala-landing-v2 {
	background: transparent;
	overflow-x: clip;
}

.vala-landing-v2--premium.vala-onboarding-shell .vala-onboarding-panel--marketing {
	position: relative;
	z-index: 1;
	background: #fff;
}

/* Phase 11B — Layer 1: soft brand wash (accent, not dominant navy slab) */
main.vala-onboarding-shell.vala-landing-v2--premium .vala-onboarding-panel--marketing::before {
	content: none;
	display: none;
	pointer-events: none;
	background: none;
	box-shadow: none;
	/* Phase 11D: end navy field earlier — less mid-scroll “giant blue” */
}

/* Phase 11B — Layer 1: warm cream / pale-blue field lower on the page (global only) */
main.vala-onboarding-shell.vala-landing-v2--premium .vala-onboarding-panel--marketing::after {
	content: none;
	display: none;
}

.vala-landing-v2--premium.vala-onboarding-shell .vala-landing-container {
	width: 100%;
	max-width: 1180px;
	margin-left: auto;
	margin-right: auto;
	padding-left: clamp(20px, 4vw, 48px);
	padding-right: clamp(20px, 4vw, 48px);
	box-sizing: border-box;
}

@media (max-width: 768px) {
	main.vala-onboarding-shell.vala-landing-v2--premium::before {
		left: max(-4vw, -32px);
		right: max(-4vw, -32px);
		top: -8%;
		bottom: -12%;
		filter: blur(clamp(48px, 10vw, 96px));
		/* Phase 11D: mobile safe zone — less dominant blue veil near headings/CTAs */
		opacity: 0.1;
	}

	main.vala-onboarding-shell.vala-landing-v2--premium::after {
		opacity: 0.022;
	}

	main.vala-onboarding-shell.vala-landing-v2--premium .vala-onboarding-panel--marketing::before {
		height: min(120vh, 1800px);
		width: min(185vw, 3000px);
		top: -36vh;
		opacity: 0.08;
		filter: blur(clamp(36px, 8vw, 72px));
	}

	/* Mobile: hide second global mass — one field only (11B) */
	main.vala-onboarding-shell.vala-landing-v2--premium .vala-onboarding-panel--marketing::after {
		display: none;
	}

	main.vala-landing-v2--premium:not(.vala-homepage) .vala-landing-hero__copy::before {
		inset: -12% 4% -20% -28%;
		opacity: 0.36;
		filter: blur(clamp(28px, 8vw, 48px));
	}

	main.vala-landing-v2--premium:not(.vala-homepage) .vala-landing-hero::after {
		width: 125vw;
		height: clamp(240px, 48vw, 340px);
		bottom: clamp(-140px, -12vw, -88px);
		opacity: min(var(--vala-transition-opacity-medium, 0.12), 0.14);
		transform: translateX(-50%) rotate(-3deg);
		filter: none;
		box-shadow: 0 20px 64px rgba(6, 17, 31, 0.28);
		mask-image: linear-gradient(
			180deg,
			transparent 0%,
			#000 38%,
			#000 58%,
			transparent 82%
		);
		-webkit-mask-image: linear-gradient(
			180deg,
			transparent 0%,
			#000 38%,
			#000 58%,
			transparent 82%
		);
	}
}

@media (max-width: 520px) {
	/* Phase 11C — one transition per hero: rely on choice bridge; keep CTAs clear of ellipse */
	main.vala-landing-v2--premium:not(.vala-homepage) .vala-landing-hero::after {
		display: none;
	}
}

@media (min-width: 769px) and (max-width: 1050px) {
	main.vala-onboarding-shell.vala-landing-v2--premium::before {
		opacity: min(0.14, var(--vala-transition-opacity-medium, 0.12));
		filter: blur(clamp(68px, 11vw, 130px));
	}

	main.vala-onboarding-shell.vala-landing-v2--premium .vala-onboarding-panel--marketing::before {
		height: min(calc(150vh * 0.61), calc(2400px * 0.61));
		width: min(calc(200vw * 0.61), calc(3400px * 0.61));
		top: -38vh;
		opacity: min(var(--vala-transition-opacity-medium, 0.12), 0.1);
		filter: blur(clamp(40px, 9vw, 96px));
	}

	main.vala-onboarding-shell.vala-landing-v2--premium .vala-onboarding-panel--marketing::after {
		height: min(calc(95vh * 0.61), calc(1600px * 0.61));
		width: min(calc(190vw * 0.61), calc(3200px * 0.61));
		bottom: -34vh;
		opacity: min(var(--vala-transition-opacity-soft, 0.08), 0.06);
		filter: blur(clamp(32px, 8vw, 80px));
	}
}

@media (prefers-reduced-motion: reduce) {
	main.vala-onboarding-shell.vala-landing-v2--premium::before {
		filter: blur(clamp(56px, 8vw, 96px));
		opacity: 0.14;
	}

	main.vala-onboarding-shell.vala-landing-v2--premium .vala-onboarding-panel--marketing::before {
		opacity: 0.08;
		filter: blur(clamp(44px, 7vw, 88px));
	}

	main.vala-onboarding-shell.vala-landing-v2--premium .vala-onboarding-panel--marketing::after {
		opacity: 0.06;
		filter: blur(clamp(36px, 7vw, 72px));
	}

	.vala-landing-v2--premium .vala-landing-hero__copy::before {
		filter: blur(clamp(28px, 5vw, 44px));
		opacity: 0.32;
	}

	.vala-landing-v2--premium .vala-landing-hero::after {
		opacity: var(--vala-transition-opacity-strong, 0.18);
		height: clamp(260px, 40vw, 400px);
		bottom: clamp(-240px, -20vw, -160px);
	}
}

/* --- Hero --- */
main.vala-landing-v2--premium:not(.vala-homepage) .vala-landing-hero {
	overflow-x: clip;
	overflow-y: visible;
	background:
		radial-gradient(ellipse 96% 88% at 10% 52%, rgba(56, 189, 248, 0.1), transparent 58%),
		radial-gradient(ellipse 82% 62% at 92% 28%, rgba(16, 36, 58, 0.1), transparent 54%),
		transparent;
	border-bottom: none;
}

.vala-landing-v2--premium .vala-landing-hero__inner {
	--vl-hero-stack: clamp(10px, 1.5vw, 16px);
	--vl-top-chrome: clamp(112px, 14vw, 132px);
	min-height: min(560px, calc(100svh - var(--vl-top-chrome)));
	grid-template-columns: minmax(0, min(560px, 100%)) minmax(260px, 1fr);
	align-items: start;
	justify-items: stretch;
	column-gap: clamp(40px, 6vw, 88px);
	row-gap: clamp(28px, 4vw, 40px);
	padding: clamp(28px, 4vw, 48px) 0 clamp(48px, 6vw, 80px);
}

.vala-landing-v2--premium .vala-landing-hero__title--editorial {
	font-size: clamp(34px, 4.25vw, 54px);
	line-height: 1.02;
	letter-spacing: -0.05em;
	font-weight: 800;
	max-width: min(560px, 100%);
	margin: 0;
}

.vala-landing-v2--premium .vala-landing-hero__title-line {
	display: block;
	color: #f8fafc;
	text-shadow: 0 2px 40px rgba(0, 0, 0, 0.22);
	font-weight: 720;
}

.vala-landing-v2--premium .vala-landing-hero__title-line--brand {
	font-weight: 850;
	letter-spacing: -0.04em;
	margin-bottom: 0.02em;
}

.vala-landing-v2--premium .vala-landing-hero__title-line:not(.vala-landing-hero__title-line--brand) {
	margin-top: 0.04em;
	font-weight: 680;
	color: rgba(248, 250, 252, 0.96);
}

.vala-landing-v2--premium .vala-landing-hero__title-accent {
	display: block;
	margin-top: 0.08em;
	background: linear-gradient(120deg, #5eead4 0%, #38bdf8 48%, #a5f3fc 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	text-shadow: none;
	filter: drop-shadow(0 12px 36px rgba(45, 212, 191, 0.35));
	font-weight: 900;
	font-style: normal;
}

.vala-landing-v2--premium .vala-landing-hero__eyebrow {
	margin: 0 0 8px;
	font-size: 10px;
	font-weight: 750;
	letter-spacing: 0.34em;
	text-transform: uppercase;
	color: rgba(103, 232, 249, 0.82);
	opacity: 0.78;
	text-shadow: none;
}

.vala-landing-v2--premium .vala-landing-hero__copy {
	position: relative;
	isolation: isolate;
	max-width: min(560px, 100%);
	display: flex;
	flex-direction: column;
	gap: var(--vl-hero-stack);
	padding-top: 0;
}

main.vala-landing-v2--premium:not(.vala-homepage) .vala-landing-hero__copy::before {
	content: "";
	position: absolute;
	z-index: -1;
	inset: -18% 8% -28% -42%;
	pointer-events: none;
	border-radius: 48px;
	background: radial-gradient(ellipse 85% 75% at 18% 42%, rgba(22, 217, 255, 0.14), transparent 68%);
	filter: blur(clamp(36px, 6vw, 72px));
	opacity: 0.45;
}

.vala-landing-v2--premium .vala-landing-hero__intro {
	display: flex;
	flex-direction: column;
	gap: clamp(6px, 1vw, 10px);
	max-width: min(560px, 100%);
	margin-top: clamp(2px, 0.5vw, 8px);
}

.vala-landing-v2--premium .vala-landing-hero__lead {
	margin: 0;
	font-size: clamp(15px, 1.15vw, 17px);
	line-height: 1.45;
	font-weight: 580;
	color: rgba(226, 232, 240, 0.94);
	max-width: min(560px, 100%);
}

.vala-landing-v2--premium .vala-landing-hero__sublead {
	margin: 0;
	font-size: clamp(13px, 0.95vw, 15px);
	line-height: 1.45;
	font-weight: 600;
	color: rgba(203, 213, 225, 0.88);
	max-width: min(560px, 100%);
}

.vala-landing-v2--premium .vala-landing-hero__actions--grid {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: clamp(8px, 1.2vw, 12px);
	margin-top: clamp(6px, 1vw, 12px);
	max-width: min(560px, 100%);
}

.vala-landing-v2--premium .vala-landing-hero__cta-row {
	display: grid;
	gap: 10px;
	width: 100%;
}

.vala-landing-v2--premium .vala-landing-hero__cta-row--primary {
	grid-template-columns: 1fr 1fr;
}

.vala-landing-v2--premium .vala-landing-hero__cta-row--tertiary {
	display: flex;
	align-items: center;
}

.vala-landing-v2--premium .vala-landing-hero__cta-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 14px;
	font-weight: 750;
	color: rgba(186, 230, 253, 0.95);
	text-decoration: none;
	padding: 4px 0;
	border-bottom: 1px solid transparent;
	transition:
		color 0.15s ease,
		border-color 0.15s ease;
}

.vala-landing-v2--premium .vala-landing-hero__cta-link:hover {
	color: #f0f9ff;
	border-bottom-color: rgba(56, 189, 248, 0.45);
}

.vala-landing-v2--premium .vala-landing-hero__cta-link-arr {
	font-size: 12px;
	opacity: 0.85;
}

.vala-landing-v2--premium .vala-landing-hero__cta-google {
	width: 100%;
	justify-content: center;
	min-height: 48px;
	font-size: 14px;
	font-weight: 700;
	border-radius: 11px;
}

.vala-landing-v2--premium .vala-landing-trust-row--hero {
	margin-top: clamp(14px, 2vw, 22px);
	gap: clamp(12px, 2vw, 22px);
	font-size: 11px;
	font-weight: 620;
	color: rgba(219, 231, 255, 0.82);
}

.vala-landing-v2--premium .vala-landing-trust-row--hero span {
	gap: 7px;
}

.vala-landing-v2--premium .vala-landing-trust-row--hero span::before {
	width: 15px;
	height: 15px;
	font-size: 9px;
	background: linear-gradient(145deg, #2dd4bf, #22d3ee);
	color: #042f2e;
	box-shadow: 0 0 14px rgba(45, 212, 191, 0.35);
}

@media (max-width: 720px) {
	.vala-landing-v2--premium .vala-landing-hero__title--editorial {
		font-size: clamp(30px, 9vw, 42px);
		line-height: 1.04;
		max-width: none;
	}

	.vala-landing-v2--premium .vala-landing-hero__cta-row--primary {
		grid-template-columns: 1fr;
	}

	.vala-landing-v2--premium .vala-landing-hero__actions--grid {
		max-width: none;
	}

	.vala-landing-v2--premium .vala-landing-product {
		padding-top: clamp(8px, 3vw, 24px);
		width: 100%;
	}

}

.vala-landing-v2--premium .vala-landing-hero__visual,
.vala-landing-v2--premium .vala-landing-product {
	justify-self: center;
	width: 100%;
	max-width: min(1000px, 100%);
	margin-inline: auto;
	perspective: 1800px;
	perspective-origin: 56% 42%;
	padding-top: clamp(4px, 1.2vw, 18px);
	align-self: start;
	position: relative;
	z-index: 2;
	isolation: isolate;
}

/* --- Features --- */
.vala-landing-v2--premium .vala-landing-section--light {
	background: transparent;
}

.vala-landing-v2--premium .vala-feature-grid {
	gap: 18px;
}

.vala-landing-v2--premium .vala-feature-card {
	min-height: 240px;
	padding: 30px 20px 28px;
	border-radius: 18px;
	background: linear-gradient(185deg, var(--vala-cream-50, #fffaf0) 0%, var(--vala-cream-100, #f8f1df) 52%, rgba(238, 248, 255, 0.72) 100%);
	border: 1px solid rgba(16, 32, 51, 0.08);
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.55) inset,
		0 20px 50px rgba(16, 32, 51, 0.06);
	transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}

.vala-landing-v2--premium .vala-feature-card:hover {
	transform: translateY(-4px);
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.95) inset,
		0 28px 60px rgba(31, 123, 255, 0.12);
	border-color: rgba(31, 123, 255, 0.2);
}

.vala-landing-v2--premium .vala-feature-icon {
	width: 64px;
	height: 64px;
	font-size: 26px;
	border-radius: 18px;
	background: linear-gradient(145deg, var(--vala-soft-blue-50, #eef8ff), var(--vala-soft-blue-100, #dff3ff));
	border: 1px solid rgba(56, 189, 248, 0.18);
	box-shadow: 0 10px 24px rgba(16, 32, 51, 0.08);
}

.vala-landing-v2--premium .vala-feature-card h3 {
	font-size: 16px;
	font-weight: 900;
	color: var(--vala-text-dark, #102033);
	letter-spacing: -0.02em;
}

.vala-landing-v2--premium .vala-feature-card p {
	font-size: 14px;
	line-height: 1.65;
	color: var(--vala-text-soft, #5f6f82);
}

html:has(main.vala-onboarding-shell.vala-landing-v2--premium) {
	scroll-padding-top: clamp(96px, 12vw, 132px);
}

/* --- Responsive --- */
@media (max-width: 1050px) {
	.vala-landing-v2--premium .vala-landing-hero {
		min-height: auto;
		display: block;
	}

	.vala-landing-v2--premium .vala-landing-hero__inner {
		grid-template-columns: 1fr;
		min-height: auto;
	}

	.vala-landing-v2--premium .vala-hero-preview__shell,
	.vala-landing-v2--premium .vala-hero-preview__shell--app {
		transform: none;
		max-width: 560px;
		margin: 0 auto;
		min-height: auto;
	}

	@media (min-width: 721px) {
		.vala-landing-v2--premium .vala-demo-window.vala-hero-demo.vala-hero-preview__shell--app {
			transform: rotateY(-6deg) rotateX(2.5deg) scale(1.04);
			transform-origin: 60% 50%;
		}
	}
}


.vala-landing-v2--premium .vala-landing-hero {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	overflow-x: clip;
	overflow-y: visible;
	min-height: auto;
}

/* Phase 10C — hero/choice: giant teal-tinted navy oval crossing into choice (explicit shape, not blur-only) */
/* Phase 11C — tri-band mask + shorter ellipse: transition zone only, less empty runway under hero */
main.vala-landing-v2--premium:not(.vala-homepage) .vala-landing-hero::after {
	content: "";
	position: absolute;
	width: 130vw;
	height: clamp(340px, 42vw, 520px);
	left: 50%;
	bottom: clamp(-280px, -22vw, -180px);
	transform: translateX(-50%) rotate(-5deg);
	border-radius: 50%;
	pointer-events: none;
	z-index: 0;
	background: linear-gradient(
		195deg,
		var(--vala-bg-deep, #06111f) 0%,
		var(--vala-bg-navy, #0b1728) 48%,
		var(--vala-bg-blue, #10243a) 100%
	);
	/* Phase 11D: slightly quieter so hero + choice read as one band */
	opacity: 0.16;
	box-shadow:
		0 0 0 1px rgba(45, 212, 191, 0.1),
		0 28px 90px rgba(6, 17, 31, 0.32);
	filter: none;
	mask-image: linear-gradient(
		180deg,
		transparent 0%,
		#000 20%,
		#000 50%,
		transparent 91%
	);
	-webkit-mask-image: linear-gradient(
		180deg,
		transparent 0%,
		#000 20%,
		#000 50%,
		transparent 91%
	);
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
}

@media (min-width: 769px) and (max-width: 1050px) {
	main.vala-landing-v2--premium:not(.vala-homepage) .vala-landing-hero::after {
		opacity: min(var(--vala-transition-opacity-medium, 0.12), 0.14);
		height: calc(clamp(340px, 42vw, 520px) * 0.61);
		bottom: clamp(-260px, -20vw, -170px);
	}
}

.vala-landing-v2--premium .vala-landing-hero__inner {
	flex: 1 1 auto;
	width: 100%;
	position: relative;
	z-index: 2;
	min-height: min(560px, calc(100svh - clamp(112px, 14vw, 132px)));
}

.vala-landing-v2--premium .vala-landing-hero .vala-landing-btn--primary {
	letter-spacing: 0.02em;
	box-shadow:
		0 0 0 1px rgba(255, 255, 255, 0.14) inset,
		0 20px 44px rgba(20, 120, 255, 0.38),
		0 0 72px rgba(56, 189, 248, 0.2);
}

.vala-landing-v2--premium .vala-landing-hero .vala-landing-btn--ghost:not(.vala-landing-btn--google-soon) {
	background: rgba(255, 255, 255, 0.06);
	border: 1px solid rgba(255, 255, 255, 0.18);
	box-shadow: 0 12px 32px rgba(0, 0, 0, 0.2);
}

.vala-landing-v2--premium .vala-landing-hero .vala-landing-btn--google-soon:disabled,
.vala-landing-v2--premium .vala-landing-hero .vala-landing-btn--google-soon[disabled] {
	opacity: 1;
	background: rgba(15, 23, 42, 0.38);
	border: 1px dashed rgba(148, 163, 184, 0.45);
	color: rgba(226, 232, 240, 0.78);
	font-weight: 700;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}






/* Premium landing: larger preview, softer tilt, wider hero product column */
.vala-landing-v2--premium .vala-landing-hero__inner {
	grid-template-columns: minmax(0, 0.88fr) minmax(300px, 1.14fr);
	gap: clamp(32px, 4vw, 56px);
}

@media (min-width: 1051px) {
	.vala-landing-v2--premium .vala-landing-hero__inner {
		grid-template-columns: minmax(0, 0.86fr) minmax(360px, 1.2fr);
		gap: clamp(36px, 4.5vw, 60px);
	}

	.vala-landing-v2--premium .vala-landing-hero__inner {
		gap: clamp(26px, 3.6vw, 44px);
		padding-top: clamp(28px, 3.6vw, 48px);
		/* Phase 11D: reduce blank band above hero→choice overlap */
		padding-bottom: clamp(32px, 4.5vw, 52px);
	}
}

@media (min-width: 1320px) {
	.vala-landing-v2--premium .vala-landing-hero__inner {
		grid-template-columns: minmax(0, 0.82fr) minmax(400px, 1.26fr);
	}
}

/* =============================================================================
 * Phase 12 — Cinematic OS: scene wrappers + tonal continuity (loads before
 * landing/section-*.css in WP; selectors are boosted with #vala-main so these
 * wins cascade over modular section sheets without touching partials).
 * ============================================================================= */

main#vala-main.vala-onboarding-shell.vala-landing-v2--premium .vala-os-scene {
	position: relative;
	isolation: isolate;
	overflow-x: clip;
	overflow-y: visible;
}

main#vala-main.vala-onboarding-shell.vala-landing-v2--premium .vala-os-scene__content {
	position: relative;
	z-index: 2;
}

main#vala-main.vala-onboarding-shell.vala-landing-v2--premium .vala-onboarding-panel--marketing .vala-landing-container {
	width: min(1180px, calc(100% - 48px));
}

@media (max-width: 720px) {
	main#vala-main.vala-onboarding-shell.vala-landing-v2--premium .vala-onboarding-panel--marketing .vala-landing-container {
		width: min(100% - 28px, 1180px);
	}
}

@media (min-width: 721px) and (max-width: 1024px) {
	main#vala-main.vala-onboarding-shell.vala-landing-v2--premium .vala-onboarding-panel--marketing .vala-landing-container {
		width: min(1120px, calc(100% - 40px));
	}

	main#vala-main.vala-onboarding-shell.vala-landing-v2--premium #vala-baslangic.vala-landing-section--scene.vala-os-scene--choice {
		padding-block: clamp(32px, 4vw, 72px) clamp(40px, 5vw, 96px);
	}

	main#vala-main.vala-onboarding-shell.vala-landing-v2--premium .vala-os-scene--why #neden-vala.vala-landing-section--features-scene {
		padding-bottom: clamp(56px, 7vw, 112px);
	}

	main#vala-main.vala-onboarding-shell.vala-landing-v2--premium .vala-os-scene--how #nasil-calisir {
		padding-bottom: clamp(56px, 7vw, 112px);
	}
}

/* --- Narrative bridges: tonal overlap only (no visible “stripe”) --- */
main#vala-main.vala-onboarding-shell.vala-landing-v2--premium .vala-landing-narrative-bridge.vala-os-bridge {
	padding-block: clamp(28px, 4.2vw, var(--vh-section-gap, 72px));
	background: #fff;
	border-top: none;
	border-bottom: none;
}

/* --- Hero scene: slightly less vertical pressure before choice --- */
main#vala-main.vala-onboarding-shell.vala-landing-v2--premium header.vala-landing-hero.vala-os-scene--hero {
	overflow-x: clip;
	overflow-y: visible;
	min-height: auto;
}

main#vala-main.vala-onboarding-shell.vala-landing-v2--premium .vala-landing-hero.vala-os-scene--hero::after {
	z-index: 0;
	pointer-events: none;
}

/* --- Choice: multi-stop bed + soft under-glow (no solid tail band) --- */
main#vala-main.vala-onboarding-shell.vala-landing-v2--premium #vala-baslangic.vala-os-scene--choice.vala-landing-choice-inline {
	background: #fff;
}

main#vala-main.vala-onboarding-shell.vala-landing-v2--premium #vala-baslangic.vala-os-scene--choice.vala-landing-choice-inline::before {
	content: none;
	display: none;
}

/* Bleeds choice tone upward into Why (single large soft field; panel stays z-index 2) */
main#vala-main.vala-onboarding-shell.vala-landing-v2--premium #vala-baslangic.vala-os-scene--choice.vala-landing-choice-inline::after {
	content: none;
	display: none;
}

main#vala-main.vala-onboarding-shell.vala-landing-v2--premium #vala-baslangic.vala-landing-section--scene.vala-os-scene--choice {
	padding-block: var(--vh-section-pad-sm, clamp(48px, 6vw, 88px)) clamp(48px, 7.5vw, 104px);
}

/* --- Why: pull scene slightly closer to choice; stack content above wrapper glows --- */
main#vala-main.vala-onboarding-shell.vala-landing-v2--premium .vala-os-scene--why {
	margin-top: clamp(-16px, -2vw, -6px);
}

main#vala-main.vala-onboarding-shell.vala-landing-v2--premium:not(.vala-homepage) .vala-os-scene--why::before {
	content: "";
	position: absolute;
	top: 2%;
	right: -5%;
	bottom: 30%;
	left: -5%;
	z-index: 0;
	pointer-events: none;
	background: radial-gradient(ellipse 72% 58% at 50% 46%, rgba(54, 240, 230, 0.055), transparent 64%),
		radial-gradient(ellipse 88% 62% at 62% 52%, rgba(22, 119, 255, 0.045), transparent 68%);
	opacity: 1;
}

main#vala-main.vala-onboarding-shell.vala-landing-v2--premium:not(.vala-homepage) .vala-os-scene--why::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	height: clamp(120px, 18vw, 200px);
	z-index: 0;
	pointer-events: none;
	background: linear-gradient(
		180deg,
		rgba(7, 52, 106, 0.22) 0%,
		rgba(238, 248, 255, 0.08) 55%,
		transparent 100%
	);
	opacity: 0.85;
}

main#vala-main.vala-onboarding-shell.vala-landing-v2--premium .vala-os-scene--why #neden-vala.vala-landing-section--features-scene {
	position: relative;
	z-index: 1;
	padding-top: clamp(40px, 5.5vw, var(--vh-section-pad-sm, 88px));
	padding-bottom: var(--vh-section-pad, clamp(72px, 9vw, 132px));
	padding-inline: clamp(12px, 2.2vw, 22px);
	scroll-margin-top: calc(var(--vl-scroll-margin, clamp(96px, 12vw, 132px)) + 12px);
}

main#vala-main.vala-onboarding-shell.vala-landing-v2--premium:not(.vala-homepage) .vala-os-scene--why #neden-vala.vala-landing-section--light.vala-landing-section--features-scene {
	background:
		radial-gradient(ellipse 125% 80% at 50% 0%, rgba(11, 75, 145, 0.22), transparent 56%),
		radial-gradient(ellipse 95% 70% at 50% 52%, rgba(255, 250, 240, 0.11), transparent 62%),
		radial-gradient(ellipse 70% 55% at 50% 88%, rgba(6, 26, 58, 0.06), transparent 58%),
		linear-gradient(
			185deg,
			rgba(7, 52, 106, 0.34) 0%,
			rgba(255, 250, 240, 0.13) 14%,
			rgba(255, 250, 240, 0.15) 48%,
			rgba(238, 248, 255, 0.2) 72%,
			rgba(223, 243, 255, 0.22) 100%
		);
}

main#vala-main.vala-onboarding-shell.vala-landing-v2--premium:not(.vala-homepage) .vala-os-scene--why #neden-vala.vala-landing-section--features-scene::before {
	height: clamp(340px, 42vw, 560px);
	top: clamp(-460px, -38vw, -260px);
	opacity: 0.04;
	background: linear-gradient(
		185deg,
		rgba(255, 250, 240, 0.42) 0%,
		rgba(238, 248, 255, 0.32) 46%,
		rgba(223, 243, 255, 0.22) 100%
	);
	filter: blur(0.5px);
	mask-image: linear-gradient(to bottom, transparent 0%, #000 5%, #000 18%, transparent 55%);
	-webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 5%, #000 18%, transparent 55%);
}

main#vala-main.vala-onboarding-shell.vala-landing-v2--premium .vala-os-scene--why .vala-landing-features-scene__layout {
	position: relative;
	z-index: 1;
	padding-top: clamp(10px, 1.8vw, 20px);
}

/* --- How: layered light bed + bottom navy haze (depth, not a slab) --- */
main#vala-main.vala-onboarding-shell.vala-landing-v2--premium:not(.vala-homepage) .vala-os-scene--how::before {
	content: "";
	position: absolute;
	inset: 18% 10% 12%;
	z-index: 0;
	pointer-events: none;
	background: radial-gradient(ellipse 80% 60% at 50% 44%, rgba(223, 243, 255, 0.14), transparent 68%);
	opacity: 0.55;
}

main#vala-main.vala-onboarding-shell.vala-landing-v2--premium:not(.vala-homepage) .vala-os-scene--how::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: -16%;
	width: min(190vw, 3000px);
	height: min(90vh, 900px);
	transform: translateX(-50%);
	border-radius: 50%;
	z-index: 0;
	pointer-events: none;
	background: radial-gradient(ellipse 50% 42% at 50% 0%, rgba(4, 16, 37, 0.14), transparent 70%);
	opacity: 0.65;
	filter: blur(22px);
	mask-image: linear-gradient(0deg, transparent 0%, #000 18%, #000 42%, transparent 78%);
	-webkit-mask-image: linear-gradient(0deg, transparent 0%, #000 18%, #000 42%, transparent 78%);
}

main#vala-main.vala-onboarding-shell.vala-landing-v2--premium .vala-os-scene--how #nasil-calisir {
	position: relative;
	z-index: 1;
	padding-top: clamp(44px, 6vw, var(--vh-section-pad-sm, 88px));
	padding-bottom: var(--vh-section-pad, clamp(72px, 9vw, 132px));
	scroll-margin-top: calc(var(--vl-scroll-margin, clamp(96px, 12vw, 132px)) + 10px);
}

main#vala-main.vala-onboarding-shell.vala-landing-v2--premium:not(.vala-homepage) .vala-os-scene--how #nasil-calisir {
	background:
		radial-gradient(ellipse 110% 75% at 50% 8%, rgba(7, 52, 106, 0.12), transparent 52%),
		radial-gradient(ellipse 95% 65% at 50% 48%, rgba(255, 250, 240, 0.08), transparent 58%),
		radial-gradient(ellipse 85% 55% at 50% 100%, rgba(4, 16, 37, 0.08), transparent 55%),
		linear-gradient(
			185deg,
			rgba(238, 248, 255, 0.24) 0%,
			rgba(223, 243, 255, 0.2) 42%,
			rgba(238, 248, 255, 0.18) 72%,
			rgba(6, 26, 58, 0.1) 100%
		);
}

main#vala-main.vala-onboarding-shell.vala-landing-v2--premium:not(.vala-homepage) .vala-os-scene--how #nasil-calisir::before {
	opacity: 0.055;
	height: clamp(280px, 34vw, 440px);
	top: clamp(-360px, -30vw, -210px);
	mask-image: linear-gradient(to bottom, transparent 0%, #000 8%, #000 24%, transparent 62%);
	-webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 8%, #000 24%, transparent 62%);
}

main#vala-main.vala-onboarding-shell.vala-landing-v2--premium:not(.vala-homepage) .vala-os-scene--how #nasil-calisir::after {
	opacity: 0.055;
	bottom: clamp(-460px, -40vw, -320px);
	height: clamp(400px, 48vw, 580px);
	filter: blur(1px);
	mask-image: linear-gradient(0deg, transparent 0%, #000 6%, #000 28%, transparent 65%);
	-webkit-mask-image: linear-gradient(0deg, transparent 0%, #000 6%, #000 28%, transparent 65%);
}

/* --- Analysis: smooth handoff (FA tone bridges How → Insights) --- */
main#vala-main.vala-onboarding-shell.vala-landing-v2--premium:not(.vala-homepage) .vala-os-scene--analysis {
	background:
		radial-gradient(ellipse 100% 70% at 50% 0%, rgba(7, 52, 106, 0.12), transparent 52%),
		radial-gradient(ellipse 90% 60% at 80% 40%, rgba(54, 240, 230, 0.04), transparent 55%),
		linear-gradient(
			185deg,
			rgba(4, 16, 37, 0.14) 0%,
			rgba(6, 26, 58, 0.1) 35%,
			rgba(7, 52, 106, 0.11) 65%,
			rgba(4, 16, 37, 0.13) 100%
		);
}

/* --- Insights (relationship flows): atmospheric depth + more title / footer air --- */
main#vala-main.vala-onboarding-shell.vala-landing-v2--premium:not(.vala-homepage) .vala-os-scene--insights::before {
	content: "";
	position: absolute;
	inset: 8% -8% 20%;
	z-index: 0;
	pointer-events: none;
	background: radial-gradient(ellipse 75% 58% at 48% 42%, rgba(54, 240, 230, 0.045), transparent 65%),
		radial-gradient(ellipse 90% 70% at 50% 70%, rgba(4, 16, 37, 0.12), transparent 62%);
	opacity: 0.9;
}

main#vala-main.vala-onboarding-shell.vala-landing-v2--premium .vala-os-scene--insights #vala-insights.vala-landing-section--scenarios-flow {
	position: relative;
	z-index: 1;
	padding: clamp(56px, 7.5vw, 112px) 0 clamp(64px, 8.5vw, 120px);
	scroll-margin-top: calc(var(--vl-scroll-margin, clamp(96px, 12vw, 132px)) + 10px);
}

main#vala-main.vala-onboarding-shell.vala-landing-v2--premium:not(.vala-homepage) .vala-os-scene--insights #vala-insights.vala-landing-section--scenarios-flow {
	background:
		radial-gradient(ellipse 100% 65% at 50% 12%, rgba(11, 75, 145, 0.12), transparent 54%),
		linear-gradient(
			188deg,
			rgba(6, 26, 58, 0.28) 0%,
			rgba(4, 16, 37, 0.18) 38%,
			rgba(4, 16, 37, 0.22) 68%,
			rgba(6, 26, 58, 0.26) 100%
		);
}

main#vala-main.vala-onboarding-shell.vala-landing-v2--premium:not(.vala-homepage) .vala-os-scene--insights #vala-insights.vala-landing-section--scenarios-flow::before {
	opacity: 0.048;
	height: clamp(360px, 40vw, 520px);
	top: clamp(-400px, -32vw, -240px);
	filter: blur(1px);
	background: linear-gradient(
		188deg,
		var(--vala-bg-2, #07346a) 0%,
		var(--vala-bg-1, #061a3a) 52%,
		var(--vala-bg-0, #041025) 100%
	);
	mask-image: linear-gradient(to bottom, transparent 0%, #000 10%, #000 32%, transparent 72%);
	-webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 10%, #000 32%, transparent 72%);
}

/* --- Privacy: wave further back; glass stays dominant --- */
main#vala-main.vala-onboarding-shell.vala-landing-v2--premium:not(.vala-homepage) .vala-os-scene--privacy #guvenlik {
	background: linear-gradient(
		185deg,
		rgba(4, 16, 37, 0.48) 0%,
		rgba(6, 26, 58, 0.32) 40%,
		rgba(4, 16, 37, 0.22) 70%,
		rgba(4, 16, 37, 0.45) 100%
	);
}

main#vala-main.vala-onboarding-shell.vala-landing-v2--premium:not(.vala-homepage) .vala-os-scene--privacy #guvenlik::before {
	opacity: 0.028;
	height: clamp(340px, 42vw, 520px);
	top: clamp(-420px, -34vw, -260px);
	left: 50%;
	width: min(190vw, 3000px);
	border-radius: 50%;
	filter: blur(42px);
	transform: translate(-50%, -8%) rotate(-3deg);
	background: linear-gradient(
		195deg,
		var(--vala-bg-1, #061a3a) 0%,
		var(--vala-bg-0, #041025) 55%,
		var(--vala-bg-1, #061a3a) 100%
	);
	mask-image: linear-gradient(to bottom, transparent 0%, #000 6%, #000 16%, transparent 48%);
	-webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 6%, #000 16%, transparent 48%);
}

main#vala-main.vala-onboarding-shell.vala-landing-v2--premium .vala-os-scene--privacy #guvenlik .vala-security-band {
	position: relative;
	z-index: 3;
}

main#vala-main.vala-onboarding-shell.vala-landing-v2--premium .vala-os-scene--privacy #guvenlik > .vala-landing-container {
	z-index: 2;
}

/* --- Final notes: calm closing reference panel --- */
main#vala-main.vala-onboarding-shell.vala-landing-v2--premium .vala-final-notes-section.vala-os-scene--final-notes {
	padding-top: var(--vh-section-pad, clamp(72px, 9vw, 132px));
	padding-bottom: var(--vh-section-pad, clamp(72px, 9vw, 132px));
}

main#vala-main.vala-onboarding-shell.vala-landing-v2--premium:not(.vala-homepage) .vala-final-notes-section.vala-os-scene--final-notes {
	background:
		radial-gradient(ellipse 110% 70% at 50% 0%, rgba(255, 250, 240, 0.08), transparent 52%),
		linear-gradient(
			185deg,
			rgba(4, 16, 37, 0.32) 0%,
			rgba(6, 26, 58, 0.18) 14%,
			rgba(255, 250, 240, 0.12) 32%,
			rgba(255, 250, 240, 0.11) 58%,
			rgba(238, 248, 255, 0.13) 100%
		);
}

main#vala-main.vala-onboarding-shell.vala-landing-v2--premium:not(.vala-homepage) .vala-final-notes-section.vala-os-scene--final-notes::before {
	opacity: 0.04;
	top: clamp(-360px, -30vw, -240px);
	height: clamp(320px, 36vw, 460px);
	mask-image: linear-gradient(to bottom, transparent 0%, #000 8%, #000 38%, transparent 76%);
	-webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 8%, #000 38%, transparent 76%);
}

@media (max-width: 720px) {
	main#vala-main.vala-onboarding-shell.vala-landing-v2--premium header.vala-landing-hero.vala-os-scene--hero {
		min-height: 0;
	}

	main#vala-main.vala-onboarding-shell.vala-landing-v2--premium .vala-os-scene--why {
		margin-top: 0;
	}

	main#vala-main.vala-onboarding-shell.vala-landing-v2--premium .vala-os-scene--why #neden-vala.vala-landing-section--features-scene {
		padding-top: clamp(36px, 6.5vw, 64px);
		padding-bottom: clamp(44px, 7.5vw, 80px);
	}

	main#vala-main.vala-onboarding-shell.vala-landing-v2--premium #vala-baslangic.vala-landing-section--scene.vala-os-scene--choice {
		padding-block: clamp(20px, 4.5vw, 48px) clamp(40px, 6.5vw, 80px);
	}

	main#vala-main.vala-onboarding-shell.vala-landing-v2--premium .vala-os-scene--how #nasil-calisir {
		padding-top: clamp(36px, 6.5vw, 72px);
		padding-bottom: clamp(44px, 7.5vw, 88px);
	}

	main#vala-main.vala-onboarding-shell.vala-landing-v2--premium .vala-os-scene--insights #vala-insights.vala-landing-section--scenarios-flow {
		padding: clamp(40px, 7vw, 72px) 0 clamp(44px, 7.5vw, 88px);
	}
}

@media (max-width: 768px) {
	main#vala-main.vala-onboarding-shell.vala-landing-v2--premium #vala-baslangic.vala-os-scene--choice.vala-landing-choice-inline::before {
		opacity: 0.04;
	}

	main#vala-main.vala-onboarding-shell.vala-landing-v2--premium #vala-baslangic.vala-os-scene--choice.vala-landing-choice-inline::after {
		opacity: 0.35;
		filter: blur(14px);
	}

	main#vala-main.vala-onboarding-shell.vala-landing-v2--premium:not(.vala-homepage) .vala-os-scene--why::before,
	main#vala-main.vala-onboarding-shell.vala-landing-v2--premium:not(.vala-homepage) .vala-os-scene--why::after {
		opacity: 0.55;
	}

	main#vala-main.vala-onboarding-shell.vala-landing-v2--premium:not(.vala-homepage) .vala-os-scene--why #neden-vala.vala-landing-section--features-scene::before {
		opacity: 0.032;
	}

	main#vala-main.vala-onboarding-shell.vala-landing-v2--premium:not(.vala-homepage) .vala-os-scene--how::before,
	main#vala-main.vala-onboarding-shell.vala-landing-v2--premium:not(.vala-homepage) .vala-os-scene--how::after {
		opacity: 0.35;
	}

	main#vala-main.vala-onboarding-shell.vala-landing-v2--premium:not(.vala-homepage) .vala-os-scene--how #nasil-calisir::before,
	main#vala-main.vala-onboarding-shell.vala-landing-v2--premium:not(.vala-homepage) .vala-os-scene--how #nasil-calisir::after {
		opacity: 0.042;
	}

	main#vala-main.vala-onboarding-shell.vala-landing-v2--premium:not(.vala-homepage) .vala-os-scene--insights::before {
		opacity: 0.45;
	}

	main#vala-main.vala-onboarding-shell.vala-landing-v2--premium:not(.vala-homepage) .vala-os-scene--insights #vala-insights.vala-landing-section--scenarios-flow::before {
		opacity: 0.038;
	}

	main#vala-main.vala-onboarding-shell.vala-landing-v2--premium:not(.vala-homepage) .vala-os-scene--privacy #guvenlik::before {
		opacity: 0.022;
		filter: blur(28px);
	}

	main#vala-main.vala-onboarding-shell.vala-landing-v2--premium:not(.vala-homepage) .vala-final-notes-section.vala-os-scene--final-notes::before {
		opacity: 0.032;
	}
}

/* Final notes card + two-column lists */
.vala-final-notes__card {
	display: flex;
	flex-direction: column;
	gap: clamp(24px, 4vw, 36px);
	background: rgba(255, 255, 255, 0.92);
	border: 1px solid rgba(15, 35, 65, 0.1);
	border-radius: 28px;
	box-shadow: 0 24px 70px rgba(15, 35, 65, 0.08);
	padding: clamp(32px, 5vw, 72px);
}

.vala-final-notes__title {
	margin: 0 0 14px;
	font-size: clamp(28px, 3.2vw, 40px);
	line-height: 1.12;
	letter-spacing: -0.04em;
	color: var(--vala-ink, #111a3a);
}

.vala-final-notes__lead {
	margin: 0 0 22px;
	max-width: 52ch;
	font-size: clamp(15px, 1.1vw, 18px);
	line-height: 1.65;
	color: #5d6985;
}

.vala-final-notes__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 20px;
}

.vala-final-notes__chip {
	display: inline-flex;
	align-items: center;
	min-height: 34px;
	padding: 6px 12px;
	border-radius: 999px;
	font-size: 13px;
	font-weight: 650;
	line-height: 1.35;
	color: var(--vala-ink, #111a3a);
	background: rgba(244, 248, 252, 0.95);
	border: 1px solid rgba(17, 26, 58, 0.1);
}

.vala-final-notes__footnote {
	margin: 8px 0 0;
	font-size: 14px;
	line-height: 1.55;
	color: #5d6985;
}

.vala-final-notes__footnote a {
	color: #113c9b;
	font-weight: 650;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.vala-final-notes__footnote a:hover {
	color: #0891b2;
}

.vala-final-notes__panel {
	background:
		radial-gradient(circle at 20% 10%, rgba(0, 210, 255, 0.1), transparent 36%),
		linear-gradient(180deg, #f8fcff 0%, #ffffff 100%);
	border: 1px solid rgba(20, 180, 190, 0.18);
	border-radius: 24px;
	padding: 28px;
}

.vala-final-notes__panel-head {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 18px;
}

.vala-final-notes__panel-mark {
	width: 36px;
	height: 36px;
	object-fit: contain;
	flex-shrink: 0;
}

.vala-final-notes__panel-title {
	margin: 0;
	font-size: 17px;
	font-weight: 800;
	letter-spacing: -0.02em;
	color: var(--vala-ink, #111a3a);
}

.vala-final-notes__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.vala-final-notes__item {
	display: grid;
	grid-template-columns: 28px 1fr;
	gap: 12px;
	padding-block: 14px;
	border-bottom: 1px solid rgba(15, 35, 65, 0.08);
}

.vala-final-notes__item:last-child {
	border-bottom: 0;
	padding-bottom: 0;
}

.vala-final-notes__item-index {
	display: grid;
	place-items: center;
	width: 28px;
	height: 28px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 800;
	color: #0891b2;
	background: rgba(8, 145, 178, 0.1);
	border: 1px solid rgba(8, 145, 178, 0.2);
}

.vala-final-notes__item-title {
	margin: 0 0 4px;
	font-size: 15px;
	font-weight: 800;
	line-height: 1.35;
	color: var(--vala-ink, #111a3a);
}

.vala-final-notes__item-text {
	margin: 0;
	font-size: 14px;
	line-height: 1.55;
	color: #5d6985;
}

main#vala-main.vala-homepage .vala-final-notes-section .vala-final-notes__card {
	background: rgba(255, 253, 247, 0.88);
	border: 1px solid rgba(17, 60, 155, 0.1);
	box-shadow: 0 10px 32px rgba(15, 35, 65, 0.05);
	padding: clamp(24px, 4vw, 40px);
}

main#vala-main.vala-homepage .vala-final-notes-section .vala-final-notes__title {
	font-size: clamp(22px, 2.4vw, 30px);
	font-weight: 750;
	letter-spacing: -0.03em;
	color: var(--vala-ink, #111a3a);
}

main#vala-main.vala-homepage .vala-final-notes__cta.vala-landing-btn--primary {
	display: inline-flex;
	align-self: flex-start;
	margin-top: 18px;
	padding: 0;
	min-height: 0;
	font-size: 14px;
	font-weight: 650;
	line-height: 1.45;
	color: var(--vala-deep-blue, #113c9b);
	background: transparent;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-color: rgba(17, 60, 155, 0.35);
}

main#vala-main.vala-homepage .vala-final-notes__cta.vala-landing-btn--primary:hover {
	color: #0891b2;
	text-decoration-color: rgba(8, 145, 178, 0.55);
}

@media (max-width: 1100px) {
	.vala-final-notes__card {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 720px) {
	.vala-final-notes__card {
		padding: clamp(24px, 6vw, 32px);
		border-radius: 22px;
	}

	.vala-final-notes__panel {
		padding: 22px;
	}
}

/* =============================================================================
 * Homepage — flush top (no Blocksy chrome gap) + announcement bar
 * ============================================================================= */
html:has(#vala-main.vala-onboarding-shell.vala-landing-v2--premium):not(:has(#vala-main.vala-homepage)),
body:has(#vala-main.vala-onboarding-shell.vala-landing-v2--premium):not(:has(#vala-main.vala-homepage)) {
	margin: 0;
	background: #fff;
}

/* Homepage canvas + top stack: vala-homepage-background.css (preserve WP admin-bar html margin-top). */

body:has(#vala-main.vala-onboarding-shell.vala-landing-v2--premium) #header,
body:has(#vala-main.vala-onboarding-shell.vala-landing-v2--premium) header#header,
body:has(#vala-main.vala-onboarding-shell.vala-landing-v2--premium) .ct-header,
body:has(#vala-main.vala-onboarding-shell.vala-landing-v2--premium) #footer,
body:has(#vala-main.vala-onboarding-shell.vala-landing-v2--premium) footer.ct-footer,
body:has(#vala-main.vala-onboarding-shell.vala-landing-v2--premium) .site-footer {
	display: none !important;
}

body:has(#vala-main.vala-onboarding-shell.vala-landing-v2--premium) #main-container,
body:has(#vala-main.vala-onboarding-shell.vala-landing-v2--premium) .site-main,
body:has(#vala-main.vala-onboarding-shell.vala-landing-v2--premium) .site-content,
body:has(#vala-main.vala-onboarding-shell.vala-landing-v2--premium) article,
body:has(#vala-main.vala-onboarding-shell.vala-landing-v2--premium) .entry-content,
body:has(#vala-main.vala-onboarding-shell.vala-landing-v2--premium) .ct-container,
body:has(#vala-main.vala-onboarding-shell.vala-landing-v2--premium) .ct-container-full,
body:has(#vala-main.vala-onboarding-shell.vala-landing-v2--premium) #content,
body:has(#vala-main.vala-onboarding-shell.vala-landing-v2--premium) .page-title,
body:has(#vala-main.vala-onboarding-shell.vala-landing-v2--premium) .entry-header,
body:has(#vala-main.vala-onboarding-shell.vala-landing-v2--premium) .hero-section {
	margin: 0 !important;
	padding: 0 !important;
	max-width: none !important;
}

body:has(#vala-main.vala-onboarding-shell.vala-landing-v2--premium) #vala-main {
	margin: 0;
	padding: 0;
}

body:has(#vala-main.vala-onboarding-shell.vala-landing-v2--premium) .vala-onboarding-panel--marketing {
	margin-top: 0;
	padding-top: 0;
}

main#vala-main.vala-onboarding-shell.vala-landing-v2--premium::before {
	content: none;
	display: none;
}

.vala-announcement {
	position: relative;
	z-index: 40;
	display: block;
	width: 100%;
	max-width: none;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	background:
		radial-gradient(circle at 12% 20%, rgba(32, 214, 232, 0.22), transparent 32%),
		radial-gradient(circle at 88% 18%, rgba(122, 247, 196, 0.16), transparent 30%),
		linear-gradient(135deg, #071b2f 0%, #0a243b 48%, #0e3e52 100%);
	border-bottom: 1px solid rgba(111, 231, 255, 0.2);
	box-shadow: 0 18px 44px rgba(7, 27, 47, 0.22);
	color: #f7fbff;
	font-size: 14px;
	line-height: 1.4;
}

.vala-announcement.is-hidden {
	display: none;
}

.vala-announcement__inner {
	width: 100%;
	max-width: none;
	margin: 0;
	min-height: 48px;
	padding: 10px clamp(16px, 3vw, 32px);
	display: flex;
	align-items: center;
	gap: clamp(10px, 2vw, 18px);
	box-sizing: border-box;
}

.vala-announcement__content {
	display: flex;
	align-items: center;
	gap: 12px;
	flex: 1 1 auto;
	min-width: 0;
}

.vala-announcement__badge {
	flex-shrink: 0;
	font-size: 11px;
	font-weight: 900;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	border-radius: 999px;
	padding: 5px 11px;
	background: linear-gradient(135deg, #18c8e8, #4fe5b7);
	color: #062033;
	box-shadow: 0 6px 18px rgba(24, 200, 232, 0.22);
}

.vala-announcement__text {
	min-width: 0;
	font-weight: 600;
	color: #f7fbff;
}

.vala-announcement__actions {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-left: auto;
	flex-shrink: 0;
}

.vala-announcement__cta {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 0;
	border: 0;
	border-radius: 0;
	font-size: 13px;
	font-weight: 650;
	line-height: 1.3;
	text-decoration: none;
	white-space: nowrap;
	background: transparent;
	color: #f7fbff;
	box-shadow: none;
	transition: opacity 0.18s ease;
}

.vala-announcement__cta:hover,
.vala-announcement__cta:focus-visible {
	opacity: 1;
	color: #fff;
	text-decoration: underline;
}

.vala-announcement__cta-chevron {
	font-size: 1.05em;
	opacity: 0.9;
}

.vala-announcement__link {
	margin-left: 0;
	flex-shrink: 0;
	opacity: 1;
}

.vala-announcement__close {
	flex-shrink: 0;
	display: grid;
	place-items: center;
	width: 34px;
	height: 34px;
	margin: 0;
	padding: 0;
	border: 1px solid rgba(255, 255, 255, 0.14);
	border-radius: 10px;
	background: rgba(255, 255, 255, 0.08);
	color: #ddf8ff;
	font-size: 20px;
	line-height: 1;
	cursor: pointer;
	transition: background 0.18s ease, border-color 0.18s ease;
}

.vala-announcement__close:hover,
.vala-announcement__close:focus-visible {
	background: rgba(255, 255, 255, 0.14);
	border-color: rgba(255, 255, 255, 0.22);
	color: #fff;
}

.vala-announcement + .vala-landing-nav {
	margin-top: 0;
}

/* Announcement mobile/tablet: see landing/vala-homepage-header-layout.css (max-width: 768px) */

/* =============================================================================
 * SECTION 04 — Product promise (hero → onboarding transition)
 * ============================================================================= */
html:has(main.vala-onboarding-shell.vala-landing-v2--premium):not(:has(#vala-main.vala-homepage)),
body:has(main.vala-onboarding-shell.vala-landing-v2--premium):not(:has(#vala-main.vala-homepage)) {
	margin-top: 0;
	padding-top: 0;
}

main#vala-main.vala-onboarding-shell.vala-landing-v2--premium {
	margin-top: 0;
	padding-top: 0;
}

.vala-product-promise.vala-hero-bridge {
	position: relative;
	min-height: 0;
	margin: 0;
	padding-block: var(--vala-section-bridge-pad, clamp(24px, 4vw, 56px));
	background: #fff;
	border-top: 0;
	border-bottom: 1px solid rgba(15, 35, 65, 0.06);
}

.vala-product-promise__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 12px;
	max-width: 40rem;
}

.vala-product-promise__line {
	margin: 0;
	font-size: clamp(17px, 1.35vw, 21px);
	font-weight: 700;
	line-height: 1.35;
	color: var(--vala-ink, #111a3a);
	letter-spacing: -0.02em;
}

.vala-product-promise__line--sub {
	font-size: clamp(15px, 1.1vw, 18px);
	font-weight: 550;
	color: #5d6985;
}

.vala-product-promise__chips {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px 10px;
	margin-top: 4px;
}

.vala-product-promise__chip {
	display: inline-flex;
	align-items: center;
	min-height: 32px;
	padding: 6px 12px;
	border-radius: 999px;
	font-size: 13px;
	font-weight: 650;
	color: #24304d;
	background: rgba(244, 248, 252, 0.95);
	border: 1px solid rgba(15, 35, 65, 0.1);
}

.vala-hero-bridge + #vala-baslangic.vala-landing-choice-inline,
.vala-hero-bridge + #vala-baslangic.vala-os-scene--choice {
	margin-top: 0;
}

.vala-final-notes__columns {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(24px, 4vw, 48px);
	align-items: start;
}

.vala-final-notes__simple-list {
	margin: 0;
	padding: 0 0 0 1.1em;
	list-style: disc;
}

.vala-final-notes__simple-list li {
	margin: 0 0 10px;
	font-size: 15px;
	line-height: 1.55;
	color: #5d6985;
}

.vala-final-notes__simple-list li:last-child {
	margin-bottom: 0;
}

.vala-final-notes__cta {
	align-self: flex-start;
	margin-top: 20px;
}

/* =============================================================================
 * Homepage — Senaryolar product cards (#vala-scenarios)
 * ============================================================================= */

.vala-os-scene--scenarios {
	position: relative;
}

.vala-landing-hash-anchor {
	position: absolute;
	top: 0;
	left: 0;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	scroll-margin-top: var(--vl-scroll-margin, clamp(96px, 12vw, 132px));
	pointer-events: none;
}

main#vala-main.vala-onboarding-shell.vala-landing-v2--premium #vala-scenarios.vala-section-scenarios {
	position: relative;
	z-index: 1;
	scroll-margin-top: calc(var(--vl-scroll-margin, clamp(96px, 12vw, 132px)) + 6px);
	background: rgba(255, 253, 247, 0.92);
}

main#vala-main.vala-onboarding-shell.vala-landing-v2--premium:not(.vala-homepage) #vala-scenarios.vala-section-scenarios {
	background:
		linear-gradient(
			180deg,
			rgba(255, 253, 247, 0.97) 0%,
			rgba(248, 252, 255, 0.94) 45%,
			rgba(255, 253, 247, 0.98) 100%
		);
}

.vala-scenarios-inner {
	display: flex;
	flex-direction: column;
	gap: clamp(24px, 3.5vw, 36px);
	max-width: 100%;
}

.vala-scenarios-header {
	text-align: center;
	max-width: 44rem;
	margin-inline: auto;
	padding-inline: clamp(4px, 1.5vw, 12px);
}

.vala-scenarios-header__kicker {
	margin: 0 0 8px;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.14em;
	color: rgba(58, 91, 255, 0.85);
}

.vala-scenarios-header__sublead {
	margin: 12px 0 0;
	color: var(--vala-text-soft, #5f6f82);
	line-height: 1.65;
}

.vala-scenarios-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(16px, 2.5vw, 22px);
}

.vala-scenario-card {
	position: relative;
	padding: clamp(20px, 2.5vw, 26px) clamp(18px, 2.2vw, 24px);
	border-radius: 18px;
	background: #fff;
	border: 1px solid rgba(16, 32, 51, 0.08);
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.65) inset,
		0 14px 36px rgba(16, 32, 51, 0.06);
	transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.vala-scenario-card:hover {
	transform: translateY(-3px);
	border-color: rgba(58, 91, 255, 0.18);
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.85) inset,
		0 20px 44px rgba(31, 123, 255, 0.1);
}

.vala-scenario-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	margin-bottom: 12px;
	border-radius: 12px;
	font-size: 18px;
	line-height: 1;
	background: rgba(238, 248, 255, 0.95);
	border: 1px solid rgba(56, 189, 248, 0.2);
	color: var(--vala-deep-blue, #113c9b);
}

.vala-scenario-card--mint .vala-scenario-icon {
	background: rgba(236, 253, 245, 0.95);
	border-color: rgba(52, 211, 153, 0.22);
	color: rgba(5, 122, 85, 0.95);
}

.vala-scenario-card--cyan .vala-scenario-icon {
	background: rgba(236, 254, 255, 0.95);
	border-color: rgba(34, 211, 238, 0.22);
	color: rgba(8, 105, 120, 0.95);
}

.vala-scenario-card--green .vala-scenario-icon {
	background: rgba(240, 253, 250, 0.95);
	border-color: rgba(45, 212, 191, 0.22);
	color: rgba(6, 95, 70, 0.95);
}

.vala-scenario-title {
	margin: 0 0 8px;
	font-size: 16px;
	font-weight: 800;
	letter-spacing: -0.02em;
	color: var(--vala-text-dark, #102033);
	line-height: 1.3;
}

.vala-scenario-text {
	margin: 0;
	font-size: 14px;
	line-height: 1.6;
	color: var(--vala-text-soft, #5f6f82);
}

/* Scenario “intelligence” cards — label / signal / tone accent */
.vala-scenario-card--intel {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	border-left: 3px solid rgba(56, 189, 248, 0.65);
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(248, 252, 255, 0.94) 100%);
}

.vala-scenario-card--intel .vala-scenario-card__top {
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	gap: 14px;
	margin-bottom: 0;
}

.vala-scenario-card--intel .vala-scenario-icon {
	margin-bottom: 0;
	flex-shrink: 0;
}

.vala-scenario-label {
	margin: 0 0 6px;
	font-size: 10px;
	font-weight: 850;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: rgba(58, 91, 255, 0.75);
}

.vala-scenario-card--pressure .vala-scenario-label {
	color: rgba(8, 145, 178, 0.88);
}

.vala-scenario-card--income_delay .vala-scenario-label {
	color: rgba(180, 83, 9, 0.88);
}

.vala-scenario-card--subscription .vala-scenario-label {
	color: rgba(109, 40, 217, 0.88);
}

.vala-scenario-card--cashflow .vala-scenario-label {
	color: rgba(5, 122, 85, 0.88);
}

.vala-scenario-signal {
	margin: 14px 0 0;
	padding-top: 12px;
	border-top: 1px solid rgba(17, 26, 58, 0.08);
	font-size: 12px;
	font-weight: 750;
	letter-spacing: 0.02em;
	color: rgba(36, 48, 77, 0.72);
}

.vala-scenario-card--pressure {
	border-left-color: rgba(34, 211, 238, 0.85);
}

.vala-scenario-card--income_delay {
	border-left-color: rgba(245, 158, 11, 0.85);
}

.vala-scenario-card--subscription {
	border-left-color: rgba(139, 92, 246, 0.82);
}

.vala-scenario-card--cashflow {
	border-left-color: rgba(52, 211, 153, 0.88);
}

.vala-scenarios-note {
	margin: clamp(8px, 1.5vw, 12px) auto 0;
	max-width: 44rem;
	text-align: center;
	font-size: 13px;
	line-height: 1.55;
	color: rgba(95, 111, 130, 0.92);
}

/* Senaryolar — finansal baskı hikâye akışı (4 kart) */
.vala-sc-pressure {
	margin-top: clamp(28px, 4vw, 40px);
	padding: clamp(22px, 3vw, 32px) clamp(18px, 2.5vw, 28px);
	border-radius: 22px;
	background:
		radial-gradient(ellipse 80% 60% at 12% 0%, rgba(34, 211, 238, 0.08), transparent 55%),
		radial-gradient(ellipse 70% 55% at 88% 100%, rgba(52, 211, 153, 0.06), transparent 52%),
		linear-gradient(165deg, #0b1220 0%, #0f172a 48%, #0a101c 100%);
	border: 1px solid rgba(148, 163, 184, 0.14);
	box-shadow: 0 24px 60px rgba(15, 23, 42, 0.22);
}

.vala-sc-pressure__header {
	text-align: center;
	max-width: 40rem;
	margin: 0 auto clamp(20px, 2.8vw, 28px);
}

.vala-sc-pressure__title {
	margin: 0;
	font-size: clamp(22px, 2.4vw, 30px);
	font-weight: 900;
	letter-spacing: -0.03em;
	line-height: 1.15;
	color: #f8fafc;
}

.vala-sc-pressure__subtitle {
	margin: 10px 0 0;
	font-size: clamp(14px, 1.2vw, 16px);
	line-height: 1.5;
	color: rgba(203, 213, 225, 0.88);
}

.vala-sc-pressure__track {
	display: flex;
	align-items: stretch;
	gap: clamp(8px, 1.2vw, 12px);
}

.vala-sc-pressure__arrow {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	align-self: center;
	width: 20px;
	color: rgba(56, 189, 248, 0.75);
}

.vala-sc-pressure__arrow svg {
	width: 18px;
	height: 18px;
}

.vala-sc-pressure-card {
	flex: 1 1 0;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: clamp(16px, 1.8vw, 20px);
	border-radius: 16px;
	background: rgba(15, 23, 42, 0.72);
	border: 1px solid rgba(148, 163, 184, 0.12);
	box-shadow: 0 10px 28px rgba(0, 0, 0, 0.22);
}

.vala-sc-pressure-card__head {
	display: flex;
	align-items: flex-start;
	gap: 12px;
}

.vala-sc-pressure-card__num {
	flex-shrink: 0;
	display: grid;
	place-items: center;
	width: 28px;
	height: 28px;
	border-radius: 999px;
	font-size: 13px;
	font-weight: 900;
	color: #0f172a;
	background: #94a3b8;
	box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.06);
}

.vala-sc-pressure-card--problem .vala-sc-pressure-card__num {
	background: #fca5a5;
}

.vala-sc-pressure-card--early .vala-sc-pressure-card__num {
	background: #fdba74;
}

.vala-sc-pressure-card--visibility .vala-sc-pressure-card__num {
	background: #67e8f9;
}

.vala-sc-pressure-card--decision .vala-sc-pressure-card__num {
	background: #6ee7b7;
}

.vala-sc-pressure-card__title {
	margin: 0;
	font-size: 15px;
	font-weight: 850;
	letter-spacing: -0.02em;
	line-height: 1.2;
}

.vala-sc-pressure-card--problem .vala-sc-pressure-card__title {
	color: #fca5a5;
}

.vala-sc-pressure-card--early .vala-sc-pressure-card__title {
	color: #fdba74;
}

.vala-sc-pressure-card--visibility .vala-sc-pressure-card__title {
	color: #67e8f9;
}

.vala-sc-pressure-card--decision .vala-sc-pressure-card__title {
	color: #6ee7b7;
}

.vala-sc-pressure-card__lead {
	margin: 6px 0 0;
	font-size: 12px;
	line-height: 1.45;
	color: rgba(226, 232, 240, 0.82);
}

.vala-sc-pressure-payments {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.vala-sc-pressure-payments__row {
	display: grid;
	grid-template-columns: 28px minmax(0, 1fr) auto;
	gap: 8px 10px;
	align-items: center;
	font-size: 12px;
	color: rgba(241, 245, 249, 0.92);
}

.vala-sc-pressure-payments__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 8px;
	background: rgba(30, 41, 59, 0.9);
	border: 1px solid rgba(148, 163, 184, 0.14);
	color: rgba(148, 163, 184, 0.95);
}

.vala-sc-pressure-payments__icon svg {
	width: 16px;
	height: 16px;
}

.vala-sc-pressure-payments__date {
	font-size: 11px;
	color: rgba(148, 163, 184, 0.9);
	white-space: nowrap;
}

.vala-sc-pressure-risk__row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	font-size: 12px;
}

.vala-sc-pressure-risk__label {
	color: rgba(203, 213, 225, 0.85);
}

.vala-sc-pressure-risk__badge {
	padding: 4px 10px;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 800;
	color: #fecaca;
	background: rgba(239, 68, 68, 0.18);
	border: 1px solid rgba(248, 113, 113, 0.35);
}

.vala-sc-pressure-risk__chart {
	margin-top: 10px;
	height: 56px;
	border-radius: 10px;
	background: rgba(2, 6, 23, 0.45);
	border: 1px solid rgba(148, 163, 184, 0.1);
	padding: 8px 10px 6px;
}

.vala-sc-pressure-risk__spark {
	width: 100%;
	height: 100%;
}

.vala-sc-pressure-risk__line {
	fill: none;
	stroke: rgba(251, 146, 60, 0.55);
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.vala-sc-pressure-risk__dot {
	fill: #fb923c;
	stroke: rgba(255, 237, 213, 0.9);
	stroke-width: 2;
	filter: drop-shadow(0 0 6px rgba(251, 146, 60, 0.65));
}

.vala-sc-pressure-risk__note {
	margin: 10px 0 0;
	font-size: 11px;
	color: rgba(148, 163, 184, 0.88);
}

.vala-sc-pressure-metric__box {
	padding: 12px 14px;
	border-radius: 12px;
	background: rgba(2, 6, 23, 0.55);
	border: 1px solid rgba(56, 189, 248, 0.16);
}

.vala-sc-pressure-metric__label {
	display: block;
	font-size: 11px;
	color: rgba(148, 163, 184, 0.9);
	margin-bottom: 6px;
}

.vala-sc-pressure-metric__value {
	display: block;
	font-size: clamp(18px, 2vw, 22px);
	font-weight: 900;
	letter-spacing: -0.02em;
	color: #38bdf8;
}

.vala-sc-pressure-metric__range {
	margin: 12px 0 0;
	font-size: 11px;
	line-height: 1.45;
	color: rgba(203, 213, 225, 0.82);
}

.vala-sc-pressure-metric__range-label {
	display: block;
	color: rgba(148, 163, 184, 0.88);
}

.vala-sc-pressure-metric__range-value {
	display: block;
	margin-top: 2px;
	font-weight: 700;
	color: rgba(241, 245, 249, 0.92);
}

.vala-sc-pressure-actions {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.vala-sc-pressure-actions__item {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	font-size: 12px;
	line-height: 1.4;
	color: rgba(226, 232, 240, 0.9);
}

.vala-sc-pressure-actions__check {
	flex-shrink: 0;
	display: inline-flex;
	width: 18px;
	height: 18px;
	margin-top: 1px;
	color: #4ade80;
}

.vala-sc-pressure-actions__check svg {
	width: 18px;
	height: 18px;
}

.vala-sc-pressure-card__cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	margin-top: auto;
	padding: 10px 14px;
	border-radius: 12px;
	font-size: 12px;
	font-weight: 800;
	text-decoration: none;
	color: #f8fafc;
	background: linear-gradient(135deg, #0ea5e9 0%, #0284c7 100%);
	box-shadow: 0 10px 24px rgba(14, 165, 233, 0.28);
	transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.vala-sc-pressure-card__cta:hover {
	transform: translateY(-1px);
	box-shadow: 0 14px 28px rgba(14, 165, 233, 0.34);
	color: #fff;
}

@media (max-width: 1080px) {
	.vala-sc-pressure__track {
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		-webkit-overflow-scrolling: touch;
		padding-bottom: 6px;
	}

	.vala-sc-pressure-card {
		flex: 0 0 min(280px, 78vw);
		scroll-snap-align: start;
	}

	.vala-sc-pressure__arrow {
		flex: 0 0 14px;
	}
}

@media (max-width: 720px) {
	.vala-scenarios-grid {
		grid-template-columns: 1fr;
	}

	.vala-sc-pressure__track {
		flex-direction: column;
		overflow: visible;
		scroll-snap-type: none;
	}

	.vala-sc-pressure__arrow {
		display: none;
	}

	.vala-sc-pressure-card {
		flex: 1 1 auto;
		width: 100%;
	}
}

@media (max-width: 760px) {
	.vala-final-notes__columns {
		grid-template-columns: 1fr;
	}
}