:root {
			--bg: #100a05;
			--bg-soft: #20140a;
			--panel: rgba(22, 14, 7, 0.88);
			--panel-border: rgba(228, 184, 92, 0.24);
			--gold: #c6963b;
			--gold-bright: #f0cf8d;
			--gold-deep: #7b4d10;
			--text: #fbf6e8;
			--muted: #d2c19f;
			--accent: #fff1c8;
			--cyan: #ddb96e;
			--cyan-soft: rgba(221, 185, 110, 0.16);
			--shadow: 0 24px 80px rgba(0, 0, 0, 0.38);
			--radius: 22px;
		}

		* {
			box-sizing: border-box;
		}

		html {
			scroll-behavior: smooth;
		}

		body {
			margin: 0;
			font-family: "Segoe UI", "Bahnschrift", "Trebuchet MS", sans-serif;
			color: var(--text);
			background:
				radial-gradient(circle at top left, rgba(240, 207, 141, 0.18), transparent 28%),
				radial-gradient(circle at 85% 12%, rgba(198, 150, 59, 0.2), transparent 20%),
				linear-gradient(135deg, #090603 0%, #140d06 42%, #1b1209 100%);
			min-height: 100vh;
			overflow-x: hidden;
		}

		body::before,
		body::after {
			content: "";
			position: fixed;
			inset: auto;
			width: 42vw;
			height: 42vw;
			border-radius: 38% 62% 53% 47% / 44% 33% 67% 56%;
			filter: blur(60px);
			pointer-events: none;
			z-index: 0;
			opacity: 0.22;
		}

		body::before {
			top: -12vw;
			left: -10vw;
			background: linear-gradient(135deg, rgba(240, 207, 141, 0.7), transparent 65%);
			animation: floatGlow 10s ease-in-out infinite;
		}

		body::after {
			right: -8vw;
			bottom: -10vw;
			background: linear-gradient(135deg, rgba(230, 194, 122, 0.65), transparent 60%);
			animation: floatGlow 14s ease-in-out infinite reverse;
		}

		.page {
			position: relative;
			z-index: 1;
			width: min(1180px, calc(100% - 32px));
			margin: 0 auto;
			padding: 28px 0 72px;
		}

		.hero {
			position: relative;
			padding: 38px;
			border: 1px solid var(--panel-border);
			border-radius: calc(var(--radius) + 10px);
			background:
				linear-gradient(180deg, rgba(24, 15, 7, 0.96), rgba(16, 10, 5, 0.97)),
				linear-gradient(120deg, rgba(240, 207, 141, 0.08), rgba(255, 255, 255, 0));
			box-shadow: var(--shadow);
			overflow: hidden;
			animation: reveal 0.9s ease-out both;
		}

		.hero::before {
			content: "";
			position: absolute;
			inset: 0;
			background:
				linear-gradient(120deg, transparent 0%, rgba(240, 207, 141, 0.09) 28%, transparent 54%),
				linear-gradient(180deg, rgba(255, 255, 255, 0.02), transparent 42%);
			pointer-events: none;
		}

		.nav {
			display: flex;
			align-items: center;
			justify-content: space-between;
			gap: 16px;
			margin-bottom: 42px;
			position: relative;
			z-index: 1;
		}

		.brand {
			display: inline-flex;
			align-items: center;
			gap: 12px;
			font-weight: 700;
			letter-spacing: 0.14em;
			color: var(--accent);
		}

		.brand-mark {
			width: 14px;
			height: 14px;
			background: linear-gradient(135deg, var(--cyan), var(--gold-deep));
			transform: rotate(45deg);
			box-shadow: 0 0 20px rgba(128, 189, 214, 0.32);
		}

		.nav-links {
			display: flex;
			flex-wrap: wrap;
			gap: 14px;
		}

		.nav-links a,
		.cta,
		.secondary {
			color: var(--text);
			text-decoration: none;
			border: 1px solid rgba(228, 184, 92, 0.18);
			padding: 11px 16px;
			border-radius: 999px;
			transition: transform 0.25s ease, border-color 0.25s ease, background 0.25s ease;
			background: rgba(255, 255, 255, 0.025);
		}

		.nav-links a:hover,
		.cta:hover,
		.secondary:hover {
			transform: translateY(-2px);
			border-color: rgba(240, 207, 141, 0.45);
			background: rgba(240, 207, 141, 0.08);
		}

		.hero-grid {
			display: grid;
			grid-template-columns: 1.25fr 0.95fr;
			gap: 28px;
			align-items: center;
			position: relative;
			z-index: 1;
		}

		.eyebrow {
			display: inline-block;
			margin-bottom: 18px;
			padding: 8px 12px;
			border-radius: 999px;
			border: 1px solid rgba(240, 207, 141, 0.24);
			background: rgba(240, 207, 141, 0.1);
			color: var(--gold-bright);
			letter-spacing: 0.08em;
			text-transform: uppercase;
			font-size: 0.8rem;
		}

		h1 {
			margin: 0;
			font-size: clamp(2.6rem, 6vw, 5.4rem);
			line-height: 0.96;
			letter-spacing: -0.04em;
			max-width: 10ch;
			text-shadow: 0 8px 30px rgba(0, 0, 0, 0.32);
		}

		.lead {
			margin: 20px 0 0;
			font-size: 1.08rem;
			line-height: 1.75;
			color: var(--muted);
			max-width: 62ch;
		}

		.lead strong {
			color: var(--accent);
			font-weight: 700;
		}

		.actions {
			display: flex;
			flex-wrap: wrap;
			gap: 14px;
			margin-top: 28px;
		}

		.cta {
			background: linear-gradient(135deg, var(--gold-bright), var(--gold));
			color: #1b1207;
			font-weight: 700;
			border: none;
			box-shadow: 0 12px 30px rgba(242, 193, 78, 0.25);
		}

		.hero-card {
			position: relative;
			min-height: 460px;
			border-radius: calc(var(--radius) + 6px);
			border: 1px solid rgba(240, 207, 141, 0.14);
			background:
				linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.02)),
				radial-gradient(circle at 50% 30%, rgba(240, 207, 141, 0.12), transparent 40%),
				rgba(16, 10, 5, 0.92);
			padding: 28px;
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			gap: 24px;
			box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
			overflow: hidden;
		}

		.hero-card::before {
			content: "";
			position: absolute;
			inset: 22px;
			border: 1px solid rgba(240, 207, 141, 0.1);
			border-radius: 20px;
		}

		.crystal {
			position: relative;
			width: min(88%, 340px);
			aspect-ratio: 1;
			clip-path: polygon(50% 0%, 88% 14%, 100% 50%, 86% 87%, 50% 100%, 14% 86%, 0% 50%, 13% 15%);
			background:
				linear-gradient(145deg, #f0e2bb 0%, #c9a55b 18%, #967636 40%, #4a5861 70%, #ead3a0 100%);
			box-shadow:
				inset -20px -18px 26px rgba(27, 31, 34, 0.45),
				inset 18px 16px 24px rgba(255, 247, 203, 0.22),
				0 26px 60px rgba(0, 0, 0, 0.38),
				0 0 48px rgba(128, 189, 214, 0.18);
			transform: rotate(-12deg);
			animation: crystalPulse 5.6s ease-in-out infinite;
		}

		.crystal::before,
		.crystal::after {
			content: "";
			position: absolute;
			inset: 10%;
			clip-path: inherit;
		}

		.crystal::before {
			background: linear-gradient(125deg, rgba(255, 255, 255, 0.7), transparent 42%, rgba(79, 112, 129, 0.2) 78%);
			mix-blend-mode: screen;
		}

		.crystal::after {
			inset: 20%;
			background: linear-gradient(145deg, rgba(255, 255, 255, 0.25), transparent 60%);
			opacity: 0.8;
		}

		.hero-stats {
			position: relative;
			width: 100%;
			display: grid;
			grid-template-columns: repeat(3, 1fr);
			gap: 12px;
		}

		.stat {
			padding: 14px;
			border-radius: 16px;
			background: rgba(255, 255, 255, 0.035);
			border: 1px solid rgba(240, 207, 141, 0.12);
			backdrop-filter: blur(8px);
		}

		.manifesto-grid {
			display: grid;
			grid-template-columns: 1.1fr 0.9fr;
			gap: 18px;
		}

		.note-list {
			margin: 0;
			padding-left: 20px;
		}

		.note-list li {
			color: var(--muted);
			line-height: 1.7;
			margin-bottom: 10px;
		}

		.stat strong {
			display: block;
			color: var(--gold-bright);
			font-size: 1.2rem;
			margin-bottom: 4px;
		}

		.stat span {
			color: var(--muted);
			font-size: 0.9rem;
		}

		section {
			margin-top: 28px;
			animation: reveal 1s ease-out both;
		}

		.section-card {
			border-radius: var(--radius);
			border: 1px solid var(--panel-border);
			background: var(--panel);
			box-shadow: var(--shadow);
			padding: 30px;
		}

		.section-header {
			display: flex;
			justify-content: space-between;
			align-items: end;
			gap: 18px;
			margin-bottom: 24px;
		}

		h2 {
			margin: 0;
			font-size: clamp(1.8rem, 4vw, 3rem);
			letter-spacing: -0.04em;
		}

		.section-header p,
		.intro-copy,
		.footer-copy {
			color: var(--muted);
			line-height: 1.75;
			margin: 0;
		}

		.features {
			display: grid;
			grid-template-columns: repeat(5, minmax(0, 1fr));
			gap: 16px;
		}

		.feature {
			padding: 22px 18px;
			border-radius: 18px;
			background: linear-gradient(180deg, rgba(128, 189, 214, 0.06), rgba(255, 255, 255, 0.02));
			border: 1px solid rgba(128, 189, 214, 0.14);
			transition: transform 0.25s ease, border-color 0.25s ease;
		}

		.feature:hover {
			transform: translateY(-5px);
			border-color: rgba(128, 189, 214, 0.34);
		}

		.feature-index {
			font-size: 0.8rem;
			color: var(--gold-bright);
			letter-spacing: 0.1em;
			text-transform: uppercase;
		}

		.feature h3 {
			margin: 12px 0 10px;
			font-size: 1.15rem;
		}

		.feature p,
		.feature li,
		.metric-card p,
		.process-step p,
		.research-card p,
		.use-case p,
		.future-list li,
		.symbolic-card p {
			color: var(--muted);
			line-height: 1.7;
		}

		.feature ul {
			margin: 12px 0 0;
			padding-left: 18px;
		}

		.process {
			display: grid;
			grid-template-columns: repeat(4, minmax(0, 1fr));
			gap: 16px;
		}

		.process-step,
		.use-case,
		.symbolic-card {
			padding: 22px;
			border-radius: 18px;
			background: rgba(255, 255, 255, 0.03);
			border: 1px solid rgba(128, 189, 214, 0.12);
		}

		.process-step strong,
		.use-case strong,
		.symbolic-card strong {
			display: inline-flex;
			align-items: center;
			justify-content: center;
			width: 36px;
			height: 36px;
			border-radius: 50%;
			background: rgba(128, 189, 214, 0.12);
			color: var(--cyan);
			margin-bottom: 14px;
		}

		.process-step h3,
		.use-case h3,
		.symbolic-card h3 {
			margin: 0 0 10px;
			font-size: 1.12rem;
		}

		.two-columns {
			display: grid;
			grid-template-columns: 1.1fr 0.9fr;
			gap: 18px;
		}

		.metrics-grid,
		.research-grid,
		.future-grid {
			display: grid;
			grid-template-columns: repeat(4, minmax(0, 1fr));
			gap: 16px;
		}

		.metric-card,
		.research-card,
		.future-panel {
			padding: 22px;
			border-radius: 18px;
			background: rgba(255, 255, 255, 0.03);
			border: 1px solid rgba(128, 189, 214, 0.12);
		}

		.metric-label,
		.research-label,
		.future-label {
			display: inline-block;
			margin-bottom: 10px;
			color: var(--gold-bright);
			font-size: 0.8rem;
			letter-spacing: 0.1em;
			text-transform: uppercase;
		}

		.metric-card h3,
		.research-card h3,
		.future-panel h3 {
			margin: 0 0 10px;
			font-size: 1.1rem;
		}

		.metric-value {
			display: block;
			margin-bottom: 10px;
			font-size: 1.45rem;
			font-weight: 700;
			color: var(--accent);
		}



		.future-list {
			margin: 0;
			padding-left: 20px;
			columns: 3;
			column-gap: 28px;
		}

		.future-list li {
			break-inside: avoid;
			margin-bottom: 12px;
		}

		.use-cases {
			display: grid;
			grid-template-columns: repeat(2, minmax(0, 1fr));
			gap: 16px;
		}

		.quote-panel {
			padding: 28px;
			border-radius: 22px;
			background:
				linear-gradient(180deg, rgba(128, 189, 214, 0.12), rgba(255, 255, 255, 0.03)),
				rgba(0, 0, 0, 0.18);
			border: 1px solid rgba(128, 189, 214, 0.18);
			min-height: 100%;
			display: flex;
			flex-direction: column;
			justify-content: space-between;
		}

		.schema-grid {
			display: grid;
			grid-template-columns: repeat(2, minmax(0, 1fr));
			gap: 16px;
		}

		.schema-card,
		.comparison-card {
			padding: 22px;
			border-radius: 18px;
			background: rgba(255, 255, 255, 0.03);
			border: 1px solid rgba(128, 189, 214, 0.12);
		}

		.schema-card h3,
		.comparison-card h3 {
			margin: 0 0 14px;
			font-size: 1.12rem;
		}

		.schema-card p,
		.table-note,
		.comparison-card li {
			color: var(--muted);
			line-height: 1.7;
		}

		.ecosystem-card {
			padding: 24px;
			border-radius: 24px;
			background:
				linear-gradient(180deg, rgba(240, 207, 141, 0.08), rgba(255, 255, 255, 0.02)),
				rgba(255, 255, 255, 0.02);
			border: 1px solid rgba(240, 207, 141, 0.18);
			box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
		}

		.ecosystem-card p {
			color: var(--muted);
			line-height: 1.75;
		}

		.ecosystem-svg {
			width: 100%;
			height: auto;
			display: block;
			margin: 18px 0;
			border-radius: 20px;
			background:
				radial-gradient(circle at center, rgba(240, 207, 141, 0.08), transparent 55%),
				linear-gradient(180deg, rgba(38, 23, 10, 0.95), rgba(16, 10, 5, 0.98));
			border: 1px solid rgba(240, 207, 141, 0.14);
		}

		.ecosystem-notes {
			display: grid;
			grid-template-columns: repeat(3, minmax(0, 1fr));
			gap: 16px;
			margin-top: 18px;
		}

		.ecosystem-note {
			padding: 18px;
			border-radius: 18px;
			background: rgba(255, 255, 255, 0.03);
			border: 1px solid rgba(240, 207, 141, 0.12);
		}

		.ecosystem-note strong {
			display: block;
			margin-bottom: 8px;
			color: var(--gold-bright);
			letter-spacing: 0.06em;
			text-transform: uppercase;
			font-size: 0.82rem;
		}

		.ecosystem-note p {
			margin: 0;
			color: var(--muted);
			line-height: 1.7;
		}

		.schema-svg {
			width: 100%;
			height: auto;
			display: block;
			margin: 10px 0 16px;
			border-radius: 14px;
			background: linear-gradient(180deg, rgba(128, 189, 214, 0.04), rgba(255, 255, 255, 0.01));
			border: 1px solid rgba(128, 189, 214, 0.1);
		}

		.comparison-table-wrapper {
			overflow-x: auto;
			border-radius: 16px;
			border: 1px solid rgba(128, 189, 214, 0.12);
			background: rgba(255, 255, 255, 0.02);
		}

		.table-compare {
			width: 100%;
			border-collapse: collapse;
			min-width: 980px;
		}

		.table-compare th,
		.table-compare td {
			padding: 14px 16px;
			text-align: left;
			border-bottom: 1px solid rgba(128, 189, 214, 0.1);
			vertical-align: top;
		}

		.table-compare th {
			font-size: 0.82rem;
			letter-spacing: 0.08em;
			text-transform: uppercase;
			color: var(--cyan);
			background: rgba(128, 189, 214, 0.05);
		}

		.table-compare td strong {
			color: var(--accent);
		}

		.table-compare tr:last-child td {
			border-bottom: none;
		}

		.table-note {
			margin-top: 14px;
		}

		.quote-panel blockquote {
			margin: 0;
			font-size: clamp(1.45rem, 3vw, 2.2rem);
			line-height: 1.28;
			letter-spacing: -0.04em;
		}

		.quote-panel p {
			color: var(--muted);
			line-height: 1.75;
			margin-top: 18px;
		}

		.symbolic-grid {
			display: grid;
			grid-template-columns: repeat(3, minmax(0, 1fr));
			gap: 16px;
			margin-top: 20px;
		}

		footer {
			margin-top: 28px;
			padding: 30px;
			border-radius: var(--radius);
			border: 1px solid var(--panel-border);
			background: rgba(20, 12, 6, 0.92);
			box-shadow: var(--shadow);
		}

		.footer-grid {
			display: grid;
			grid-template-columns: 1fr auto;
			gap: 18px;
			align-items: center;
		}

		.footer-tag {
			color: var(--gold-bright);
			letter-spacing: 0.12em;
			text-transform: uppercase;
			font-size: 0.82rem;
		}

		@keyframes reveal {
			from {
				opacity: 0;
				transform: translateY(18px);
			}

			to {
				opacity: 1;
				transform: translateY(0);
			}
		}

		@keyframes floatGlow {
			0%,
			100% {
				transform: translate3d(0, 0, 0) scale(1);
			}

			50% {
				transform: translate3d(20px, 16px, 0) scale(1.06);
			}
		}

		@keyframes crystalPulse {
			0%,
			100% {
				transform: rotate(-12deg) translateY(0);
			}

			50% {
				transform: rotate(-8deg) translateY(-8px);
			}
		}

		@media (max-width: 1040px) {
			.hero-grid,
			.manifesto-grid,
			.two-columns,
			.features,
			.process,
			.metrics-grid,
			.research-grid,
			.future-grid,
			.ecosystem-notes,
			.schema-grid,
			.symbolic-grid {
				grid-template-columns: 1fr 1fr;
			}

			.hero-grid {
				grid-template-columns: 1fr;
			}

			.hero-card {
				min-height: 380px;
			}
		}

		@media (max-width: 760px) {
			.page {
				width: min(100% - 20px, 1180px);
				padding-top: 12px;
			}

			.hero,
			.section-card,
			footer {
				padding: 22px;
			}

			.nav,
			.section-header,
			.footer-grid {
				grid-template-columns: 1fr;
				display: grid;
				justify-content: initial;
			}

			.features,
			.process,
			.manifesto-grid,
			.two-columns,
			.metrics-grid,
			.research-grid,
			.future-grid,
			.ecosystem-notes,
			.schema-grid,
			.use-cases,
			.symbolic-grid,
			.hero-stats {
				grid-template-columns: 1fr;
			}

			.future-list {
				columns: 1;
			}

			.hero-card {
				min-height: 320px;
			}

			h1 {
				max-width: none;
			}
		}