/**
 * Ralify base layer
 *
 * Scope global overrides narrowly so Astra remains a stable parent foundation.
 */
*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	color-scheme: dark;
}

body.ralify-ui,
body {
	margin: 0;
	background: var(--ralify-color-midnight);
	color: var(--ralify-color-text);
	font-family: var(--ralify-font);
}

body .site,
body .ast-container {
	background: transparent;
}

a {
	color: inherit;
}

.ralify-shell {
	width: min(100% - (var(--ralify-page-gutter) * 2), var(--ralify-content-width));
	margin-inline: auto;
}

.ralify-skip-link {
	position: fixed;
	z-index: 10000;
	top: var(--ralify-space-3);
	left: var(--ralify-space-3);
	transform: translateY(-160%);
	padding: var(--ralify-space-3) var(--ralify-space-4);
	border-radius: var(--ralify-radius-sm);
	background: var(--ralify-color-text);
	color: var(--ralify-color-midnight);
}

.ralify-skip-link:focus {
	transform: translateY(0);
}

.ralify-site-header {
	position: relative;
	z-index: 100;
	border-bottom: 1px solid var(--ralify-color-border);
	background: rgba(11, 15, 23, 0.92);
	backdrop-filter: blur(18px);
}

.ralify-site-header__inner {
	display: flex;
	min-height: 72px;
	align-items: center;
	justify-content: space-between;
	gap: var(--ralify-space-5);
}

.ralify-site-header__brand,
.ralify-site-header__brand a {
	color: var(--ralify-color-text);
	font-size: 1.125rem;
	font-weight: 800;
	letter-spacing: -0.04em;
	text-decoration: none;
}

.ralify-site-header__brand .custom-logo {
	display: block;
	width: auto;
	max-height: 34px;
}

.ralify-site-header__menu {
	display: flex;
	align-items: center;
	gap: var(--ralify-space-5);
	margin: 0;
	padding: 0;
	list-style: none;
}

.ralify-site-header__menu a {
	color: var(--ralify-color-text-muted);
	font-size: 0.8125rem;
	font-weight: 600;
	text-decoration: none;
	transition: color var(--ralify-transition);
}

.ralify-site-header__menu a:hover,
.ralify-site-header__menu .current-menu-item > a {
	color: var(--ralify-color-text);
}

.ralify-main {
	min-height: calc(100vh - 144px);
	padding-block: var(--ralify-space-6) var(--ralify-space-8);
}

.ralify-page__header {
	margin-bottom: var(--ralify-space-6);
}

.ralify-page__title {
	margin: 0;
	font-size: clamp(2rem, 1.4rem + 2vw, 3.5rem);
	letter-spacing: -0.05em;
}

.ralify-page__content > :first-child {
	margin-top: 0;
}

.ralify-site-footer {
	border-top: 1px solid var(--ralify-color-border);
	color: var(--ralify-color-text-muted);
}

.ralify-site-footer__inner {
	display: flex;
	min-height: 72px;
	align-items: center;
	font-size: 0.75rem;
}

.ralify-site-footer__inner p {
	margin: 0;
}

.ralify-component-showcase {
	display: grid;
	gap: var(--ralify-space-7);
}

.ralify-component-showcase__header {
	max-width: 760px;
	padding-block: var(--ralify-space-5) var(--ralify-space-2);
}

.ralify-component-showcase__header h1 {
	margin: 0;
	font-size: clamp(2.25rem, 1.4rem + 3vw, 4.5rem);
	letter-spacing: -0.06em;
	line-height: 1;
}

.ralify-component-showcase__header > p:last-child {
	max-width: 620px;
	margin: var(--ralify-space-4) 0 0;
	color: var(--ralify-color-text-muted);
	line-height: 1.6;
}

.ralify-component-showcase__eyebrow {
	margin: 0 0 var(--ralify-space-3);
	color: var(--ralify-color-cyan);
	font-size: 0.6875rem;
	font-weight: 800;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.ralify-component-showcase__stage {
	padding: var(--ralify-space-6);
	border: 1px solid var(--ralify-color-border);
	border-radius: var(--ralify-radius-lg);
	background:
		linear-gradient(135deg, rgba(37, 99, 235, 0.05), transparent 48%),
		rgba(17, 24, 39, 0.48);
}

.ralify-focus-ring:focus-visible,
.ralify-section-header__link:focus-visible,
.ralify-site-header a:focus-visible {
	outline: 2px solid var(--ralify-color-cyan);
	outline-offset: 3px;
}

@media (max-width: 767px) {
	:root {
		--ralify-page-gutter: 16px;
	}

	.ralify-site-header__inner {
		min-height: 64px;
	}

	.ralify-site-header__nav {
		display: none;
	}

	.ralify-main {
		padding-block: var(--ralify-space-5) var(--ralify-space-7);
	}

	.ralify-component-showcase {
		gap: var(--ralify-space-5);
	}

	.ralify-component-showcase__stage {
		padding: var(--ralify-space-4);
	}
}
