/* Veiled Ages front-end and editor styles. */
:root {
	--va-border: rgba(232, 224, 208, 0.14);
	--va-muted: #a9b0b8;
	--va-surface: #10151d;
	--va-surface-raised: #171e28;
	--va-parchment: #f6f1e8;
	--va-ink: #17130f;
	--va-brass: #b99354;
	--va-shadow: 0 18px 60px rgba(0, 0, 0, 0.24);
}

html { scroll-behavior: smooth; }
body { text-rendering: optimizeLegibility; }

::selection {
	background: var(--va-brass);
	color: #080a0e;
}

a { text-underline-offset: 0.2em; }

.va-site-header {
	position: sticky;
	top: 0;
	z-index: 50;
	backdrop-filter: blur(18px);
	background: rgba(8, 10, 14, 0.86);
	border-bottom: 1px solid var(--va-border);
}

.admin-bar .va-site-header { top: 32px; }

.va-brand-lockup { gap: 0.75rem; }
.va-brand-lockup .wp-block-site-title { letter-spacing: 0.03em; }

.va-hero {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	min-height: min(78vh, 760px);
	border: 1px solid var(--va-border);
	border-radius: 1.5rem;
	box-shadow: var(--va-shadow);
}

.va-hero::before,
.va-hero::after {
	content: "";
	position: absolute;
	inset: auto;
	z-index: -1;
	pointer-events: none;
	border-radius: 999px;
	filter: blur(16px);
}

.va-hero::before {
	inline-size: 34rem;
	block-size: 34rem;
	inset-block-start: -17rem;
	inset-inline-end: -10rem;
	background: rgba(120, 39, 54, 0.26);
}

.va-hero::after {
	inline-size: 26rem;
	block-size: 26rem;
	inset-block-end: -16rem;
	inset-inline-start: 8%;
	background: rgba(82, 102, 132, 0.2);
}

.va-eyebrow {
	letter-spacing: 0.16em;
	text-transform: uppercase;
	font-size: 0.78rem;
	font-weight: 800;
	color: var(--va-brass);
}

.va-section-grid,
.va-story-grid .wp-block-post-template {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(1rem, 2vw, 1.5rem);
}

.va-section-card,
.va-card {
	position: relative;
	overflow: hidden;
	background: linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.012));
	border: 1px solid var(--va-border);
	border-radius: 1rem;
	transition: transform .25s ease, border-color .25s ease, background .25s ease;
}

.va-section-card:hover,
.va-card:hover {
	transform: translateY(-4px);
	border-color: rgba(185, 147, 84, 0.54);
	background: rgba(255,255,255,.05);
}

.va-card .wp-block-post-featured-image img {
	aspect-ratio: 16 / 10;
	object-fit: cover;
	transition: transform .5s ease;
}

.va-card:hover .wp-block-post-featured-image img { transform: scale(1.035); }

.va-card-body { padding: 1.25rem; }
.va-card .taxonomy-va_section { margin: 0; }
.va-card .taxonomy-va_section a,
.va-story-taxonomy a {
	display: inline-flex;
	padding: .24rem .55rem;
	border: 1px solid var(--va-border);
	border-radius: 999px;
	font-size: .72rem;
	font-weight: 800;
	letter-spacing: .06em;
	text-decoration: none;
	text-transform: uppercase;
}

.va-reading-shell { padding-block: clamp(3rem, 8vw, 7rem); }
.va-reading-surface {
	background: var(--va-parchment);
	color: var(--va-ink);
	border-radius: 1.25rem;
	box-shadow: var(--va-shadow);
	padding: clamp(1.25rem, 4vw, 4.5rem);
}

.va-reading-surface a { color: #694f27; }
.va-reading-surface :where(p, li) { font-size: clamp(1.02rem, 1vw, 1.17rem); }
.va-reading-surface :where(h2, h3, h4) { margin-block-start: 2.2em; }
.va-reading-surface img { border-radius: .8rem; }

.va-story-meta {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	margin-block: 1.1rem 1.5rem;
}

.va-badge {
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	min-height: 2rem;
	padding: .35rem .7rem;
	border: 1px solid currentColor;
	border-radius: 999px;
	font-size: .78rem;
	font-weight: 750;
	line-height: 1;
}

.va-badge--neutral { color: #5e5a54; }
.va-badge--warning { color: #8b3d2d; }
.va-badge--verified { color: #326049; }

.va-sources {
	margin-block-start: 3rem;
	padding-block-start: 1.75rem;
	border-top: 1px solid rgba(23, 19, 15, .18);
}

.va-sources ol { padding-inline-start: 1.4rem; }
.va-sources li + li { margin-block-start: .6rem; }

.va-newsletter {
	border: 1px solid rgba(185,147,84,.45);
	border-radius: 1.25rem;
	background: radial-gradient(circle at top right, rgba(185,147,84,.14), transparent 45%), #10151d;
}

.va-site-footer { border-top: 1px solid var(--va-border); }

.va-skip-link {
	position: fixed;
	inset-inline-start: 1rem;
	inset-block-start: -100px;
	z-index: 1000;
	padding: .7rem 1rem;
	background: #f6f1e8;
	color: #080a0e;
}
.va-skip-link:focus { inset-block-start: 1rem; }

.va-fade-in { animation: va-fade-in .65s ease both; }
@keyframes va-fade-in {
	from { opacity: 0; transform: translateY(10px); }
	to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 900px) {
	.va-section-grid,
	.va-story-grid .wp-block-post-template { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.va-site-header .wp-block-navigation { display: none; }
}

@media (max-width: 600px) {
	.va-section-grid,
	.va-story-grid .wp-block-post-template { grid-template-columns: 1fr; }
	.va-hero { min-height: auto; }
	.admin-bar .va-site-header { top: 46px; }
}

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		scroll-behavior: auto !important;
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
	}
}