:root {
			--bg: #07080d;
			--bg-soft: #0d1018;
			--surface: rgba(255, 255, 255, 0.075);
			--surface-strong: rgba(255, 255, 255, 0.12);
			--paper: #f5f7fb;
			--ink: #f8fafc;
			--ink-dark: #0b0d12;
			--muted: #a8b0c2;
			--muted-dark: #647084;
			--line: rgba(255, 255, 255, 0.13);
			--line-dark: rgba(15, 23, 42, 0.1);
			--accent: #7c3aed;
			--accent-2: #06b6d4;
			--accent-3: #d7ff45;
			--radius: 24px;
			--radius-lg: 34px;
			--shadow: 0 28px 90px rgba(0, 0, 0, 0.28);
		}

		* {
			box-sizing: border-box;
		}

		html {
			background: var(--bg);
			scroll-behavior: smooth;
		}

		body {
			margin: 0;
			font-family: "Inter", Arial, sans-serif;
			background: #07080d;
			color: var(--ink);
			text-rendering: geometricPrecision;
		}

		body::selection {
			background: var(--accent-3);
			color: var(--ink-dark);
		}

		main {
			overflow: hidden;
		}

		a {
			color: inherit;
		}

		img {
			max-width: 100%;
		}

		.section {
			padding: 7rem 0;
		}

		.section.light {
			background: var(--paper);
			color: var(--ink-dark);
		}

		.container,
		.page-shell {
			width: min(1180px, calc(100% - 32px));
			margin: 0 auto;
		}

		.page-shell {
			padding: 9rem 0 6rem;
		}

		.eyebrow {
			margin: 0 0 1rem;
			color: var(--accent-3);
			font-size: 0.76rem;
			font-weight: 900;
			letter-spacing: 0.12em;
			text-transform: uppercase;
		}

		.light .eyebrow,
		.page-shell .eyebrow {
			color: var(--accent);
		}

		h1,
		h2,
		h3 {
			margin: 0;
			font-family: "Space Grotesk", "Inter", Arial, sans-serif;
			font-weight: 700;
			line-height: 0.94;
			letter-spacing: -0.055em;
		}

		h1 {
			font-size: clamp(3.5rem, 10vw, 9.8rem);
		}

		h2 {
			font-size: clamp(2.4rem, 5.6vw, 6rem);
		}

		h3 {
			font-size: clamp(1.35rem, 2.3vw, 2.4rem);
		}

		p {
			line-height: 1.65;
		}

		.lead {
			color: var(--muted);
			font-size: clamp(1.05rem, 1.5vw, 1.3rem);
			max-width: 45rem;
		}

		.light .lead,
		.page-shell .lead {
			color: var(--muted-dark);
		}

		.button,
		.text-link {
			display: inline-flex;
			align-items: center;
			justify-content: center;
			min-height: 3.25rem;
			text-decoration: none;
			font-weight: 900;
		}

		.button {
			gap: 0.6rem;
			padding: 0.95rem 1.3rem;
			border: 1px solid rgba(255, 255, 255, 0.18);
			border-radius: 999px;
			background: var(--ink);
			color: var(--ink-dark);
			box-shadow: 0 18px 46px rgba(255, 255, 255, 0.12);
			transition: transform 180ms ease, border-color 180ms ease, background 180ms ease;
		}

		.button::after {
			content: "↗";
			font-size: 0.95rem;
		}

		.button:hover {
			transform: translateY(-2px);
			border-color: rgba(215, 255, 69, 0.75);
			background: var(--accent-3);
		}

		.button.dark {
			background: var(--ink-dark);
			color: white;
			box-shadow: 0 20px 52px rgba(15, 23, 42, 0.18);
		}

		.button.dark:hover {
			background: var(--accent);
		}

		.text-link {
			gap: 0.6rem;
			color: inherit;
		}

		.text-link::after {
			content: "";
			width: 2.4rem;
			height: 2px;
			background: currentColor;
			transition: width 180ms ease;
		}

		.text-link:hover::after {
			width: 3.8rem;
		}

		@media (max-width: 760px) {
			.section {
				padding: 4.5rem 0;
			}

			.page-shell {
				padding: 7.5rem 0 4.5rem;
			}
		}