@font-face {
	font-family: "Matrix Code NFI";
	src:
		url("/fonts/ff2a407fe06752facf8828a86955e988.woff2") format("woff2"),
		url("/fonts/ff2a407fe06752facf8828a86955e988.ttf") format("truetype");
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}

body.page-home {
	--matrix-green: rgba(96, 255, 128, 0.92);
	--matrix-green-soft: rgba(96, 255, 128, 0.65);
	--matrix-border: rgba(96, 255, 128, 0.24);
	--chrome-bg: rgba(0, 6, 0, 0.74);
	--chrome-border: rgba(96, 255, 128, 0.24);
	--chrome-link: rgba(176, 255, 192, 0.95);
	--chrome-link-hover: rgba(210, 255, 220, 0.98);
	--chrome-active: rgba(96, 255, 128, 0.9);
	--chrome-text-muted: rgba(148, 216, 160, 0.74);
}

#matrix-bg {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: -1;
	pointer-events: none;
}

body.page-home::before {
	content: "";
	position: fixed;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background: repeating-linear-gradient(
		0deg,
		rgba(0, 0, 0, 0) 0px,
		rgba(0, 0, 0, 0) 2px,
		rgba(0, 0, 0, 0.22) 3px,
		rgba(0, 0, 0, 0.22) 4px
	);
	opacity: 0.28;
}

body.page-home::after {
	content: "";
	position: fixed;
	inset: 0;
	z-index: 2;
	pointer-events: none;
	background:
		radial-gradient(
			circle at var(--matrix-mx, 50%) var(--matrix-my, 50%),
			rgba(96, 255, 128, 0.12),
			transparent 45%
		),
		radial-gradient(ellipse 85% 80% at 50% 50%, transparent 55%, rgba(0, 0, 0, 0.42) 100%);
}

body.page-home main {
	position: relative;
	z-index: 4;
	background: rgba(0, 8, 0, 0.62);
	border: 1px solid var(--matrix-border);
	border-radius: 10px;
	padding: 2rem 2rem 2.2rem;
	margin-top: calc(3em + 56px);
	margin-bottom: 1.4rem;
	box-shadow:
		0 0 18px rgba(96, 255, 128, 0.15),
		inset 0 0 30px rgba(18, 70, 30, 0.26);
	backdrop-filter: blur(2px);
}

body.page-home h1 {
	color: var(--matrix-green);
	letter-spacing: 0.04em;
	text-shadow:
		0 0 14px rgba(96, 255, 128, 0.35),
		0 0 30px rgba(96, 255, 128, 0.12);
	font-size: clamp(2rem, 5vw, 3rem);
}

body.page-home h1::before {
	content: "INITIALIZE";
	display: block;
	margin-bottom: 0.65rem;
	font-size: 0.34em;
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	color: var(--matrix-green-soft);
	letter-spacing: 0.2em;
}

body.page-home p,
body.page-home li {
	color: rgba(220, 255, 228, 0.88);
	text-shadow: 0 0 10px rgba(96, 255, 128, 0.08);
}

body.page-home ul {
	list-style: none;
	padding-left: 0;
	margin-left: 0;
}

body.page-home li {
	position: relative;
	padding-left: 1.1rem;
}

body.page-home li::before {
	content: ">";
	position: absolute;
	left: 0;
	color: var(--matrix-green-soft);
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}

body.page-home a {
	color: var(--matrix-green);
	text-decoration-color: rgba(96, 255, 128, 0.5);
	text-underline-offset: 2px;
}

body.page-home a:hover {
	color: rgba(172, 255, 188, 0.98);
}

body.page-home code {
	background: rgba(16, 54, 24, 0.7);
	color: rgba(182, 255, 195, 0.95);
	border: 1px solid rgba(96, 255, 128, 0.2);
}

.home-hero-copy {
	margin-bottom: 1.1rem;
}

.home-section-title {
	font-size: 0.88rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--matrix-green-soft);
	margin: 1.2rem 0 0.65rem;
}

.home-latest {
	border-top: 1px solid rgba(96, 255, 128, 0.2);
	padding-top: 0.9rem;
}

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

.home-post-list li {
	padding: 0.55rem 0;
	border-bottom: 1px solid rgba(96, 255, 128, 0.12);
}

.home-post-list li:last-child {
	border-bottom: none;
}

.home-post-title {
	font-weight: 700;
}

.home-post-meta {
	font-size: 0.82rem;
	color: rgba(178, 246, 192, 0.8);
}

@media (max-width: 720px) {
	body.page-home main {
		padding: 1.25rem 1rem 1.4rem;
		margin-top: calc(1em + 56px);
		margin-bottom: 1rem;
	}
}