:root {
	--ll-blue: #007aff;
	--ll-blue-deep: #0056b3;
	--ll-bg: #f5f5f7;
	--ll-surface: rgba(255, 255, 255, 0.82);
	--ll-border: rgba(255, 255, 255, 0.65);
	--ll-text: #1d1d1f;
	--ll-muted: #515154;
	--ll-shadow: 0 20px 55px rgba(15, 23, 42, 0.10);
}

body {
	background-color: var(--ll-bg);
	background-image:
		radial-gradient(circle at 15% 20%, rgba(0, 122, 255, 0.10), transparent 28%),
		radial-gradient(circle at 85% 18%, rgba(88, 86, 214, 0.10), transparent 24%),
		linear-gradient(180deg, #fbfbfd 0%, var(--ll-bg) 100%);
	color: var(--ll-text);
}

.site-shell {
	max-width: 1240px;
}

.glass-nav,
.glass-card,
.glass-panel {
	background: var(--ll-surface);
	border: 1px solid var(--ll-border);
	backdrop-filter: blur(18px);
	box-shadow: var(--ll-shadow);
}

.glass-nav {
	border-radius: 1.5rem;
}

.glass-card {
	border-radius: 1.75rem;
}

.glass-panel {
	border-radius: 2rem;
}

.hero-panel {
	position: relative;
	overflow: hidden;
}

.hero-panel::after {
	content: "";
	position: absolute;
	inset: auto -6rem -6rem auto;
	width: 18rem;
	height: 18rem;
	background: radial-gradient(circle, rgba(0, 122, 255, 0.18), transparent 62%);
	pointer-events: none;
}

.eyebrow {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	padding: .55rem 1rem;
	border-radius: 999px;
	background: rgba(0, 122, 255, 0.08);
	color: var(--ll-blue);
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
	font-size: .78rem;
}

.brand-mark {
	width: .9rem;
	height: .9rem;
	border-radius: 999px;
	background: linear-gradient(135deg, var(--ll-blue), #5856d6);
	box-shadow: 0 0 0 .25rem rgba(0, 122, 255, 0.12);
}

.nav-link {
	color: var(--ll-muted);
	font-weight: 500;
}

.nav-link:hover,
.nav-link:focus {
	color: var(--ll-text);
}

.btn-primary {
	background: linear-gradient(135deg, var(--ll-blue), var(--ll-blue-deep));
	border-color: transparent;
	box-shadow: 0 10px 25px rgba(0, 122, 255, 0.24);
}

.btn-primary:hover,
.btn-primary:focus {
	background: linear-gradient(135deg, var(--ll-blue-deep), var(--ll-blue));
	border-color: transparent;
}

.btn-outline-primary {
	border-color: rgba(0, 122, 255, 0.22);
	color: var(--ll-blue);
	background: rgba(255, 255, 255, 0.68);
}

.btn-outline-primary:hover,
.btn-outline-primary:focus {
	background: rgba(0, 122, 255, 0.08);
	color: var(--ll-blue-deep);
	border-color: rgba(0, 122, 255, 0.35);
}

.metric-card {
	background: rgba(255, 255, 255, 0.64);
	border: 1px solid rgba(255, 255, 255, 0.75);
	border-radius: 1.5rem;
}

.metric-card strong {
	display: block;
	font-size: 2rem;
	letter-spacing: -.04em;
}

.media-cover {
	display: block;
	width: 100%;
	height: 100%;
	min-height: 100%;
	object-fit: cover;
	border-radius: 1.75rem;
}

.media-card {
	overflow: hidden;
}

.feature-icon-wrap {
	width: 3.5rem;
	height: 3.5rem;
	border-radius: 1rem;
	background: linear-gradient(135deg, rgba(0, 122, 255, 0.12), rgba(88, 86, 214, 0.14));
	color: var(--ll-blue);
}

.plan-card-highlight {
	background: linear-gradient(180deg, rgba(0, 122, 255, 0.08), rgba(255, 255, 255, 0.90));
	border-color: rgba(0, 122, 255, 0.25);
}

.hero-image-stack .stack-card {
	border-radius: 1.75rem;
	overflow: hidden;
}

.hero-image-stack img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.material-count {
	font-size: clamp(2.8rem, 7vw, 4.5rem);
	letter-spacing: -.06em;
}

.purchase-form .form-control,
.purchase-form .form-control:focus {
	background: rgba(255, 255, 255, 0.9);
	border-color: rgba(0, 0, 0, 0.08);
	box-shadow: none;
}

.footer-link {
	color: var(--ll-muted);
	text-decoration: none;
}

.footer-link:hover {
	color: var(--ll-text);
}

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

.section-anchor {
	scroll-margin-top: 100px;
}