/* =============================================================================
   VisionaryFlux — Editorial Foundation
   Design direction: Premium analytical publication. Clean, intellectual, modern.
   No external fonts. No remote assets. Local stack only.
   ============================================================================= */

/* --- Custom properties ---------------------------------------------------- */
:root {
	--vf-bg:            #f8f7f4;
	--vf-surface:       #ffffff;
	--vf-text:          #1a1a1a;
	--vf-text-muted:    #6b6b6b;
	--vf-accent:        #1a3a5c;
	--vf-accent-hover:  #0f2640;
	--vf-border:        #e2e0db;
	--vf-reading-width: 740px;
	--vf-font-serif:    Georgia, "Times New Roman", Times, serif;
	--vf-font-sans:     "Segoe UI", system-ui, -apple-system, sans-serif;
	--vf-font-mono:     "Consolas", "Courier New", monospace;
}

/* --- Base ------------------------------------------------------------------ */
body {
	background-color: var(--vf-bg);
	color: var(--vf-text);
	font-family: var(--vf-font-sans);
	font-size: 17px;
	line-height: 1.7;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* --- Reading container ---------------------------------------------------- */
.entry-content,
.site-content .ast-container,
.vf-content-wrap {
	max-width: var(--vf-reading-width);
	margin-left: auto;
	margin-right: auto;
}

/* --- Typography — headings ------------------------------------------------ */
h1, h2, h3, h4, h5, h6 {
	font-family: var(--vf-font-serif);
	font-weight: 700;
	line-height: 1.25;
	color: var(--vf-text);
	margin-top: 2em;
	margin-bottom: 0.5em;
}

h1 { font-size: 2.2rem; margin-top: 0; }
h2 { font-size: 1.65rem; }
h3 { font-size: 1.3rem; }
h4 { font-size: 1.1rem; }
h5 { font-size: 1rem; font-style: italic; }
h6 { font-size: 0.9rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--vf-text-muted); }

/* --- Body copy ------------------------------------------------------------ */
p {
	margin-top: 0;
	margin-bottom: 1.4em;
}

.entry-content p,
.page-content p {
	font-family: var(--vf-font-serif);
	font-size: 1.05rem;
	line-height: 1.8;
}

/* --- Links ---------------------------------------------------------------- */
a {
	color: var(--vf-accent);
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
	transition: color 0.15s ease;
}

a:hover,
a:focus {
	color: var(--vf-accent-hover);
	text-decoration-thickness: 2px;
}

/* --- Horizontal rule ------------------------------------------------------ */
hr {
	border: none;
	border-top: 1px solid var(--vf-border);
	margin: 2.5em 0;
}

/* --- Blockquote ----------------------------------------------------------- */
blockquote {
	border-left: 3px solid var(--vf-accent);
	margin: 2em 0;
	padding: 0.75em 1.5em;
	color: var(--vf-text-muted);
	font-style: italic;
	font-family: var(--vf-font-serif);
}

blockquote cite {
	display: block;
	margin-top: 0.5em;
	font-size: 0.85rem;
	font-style: normal;
	color: var(--vf-text-muted);
}

/* --- Code ----------------------------------------------------------------- */
code,
kbd,
samp {
	font-family: var(--vf-font-mono);
	font-size: 0.875em;
	background: var(--vf-border);
	padding: 0.15em 0.4em;
	border-radius: 3px;
}

pre {
	background: #f0ede7;
	border: 1px solid var(--vf-border);
	border-radius: 4px;
	padding: 1.25em 1.5em;
	overflow-x: auto;
	font-family: var(--vf-font-mono);
	font-size: 0.875rem;
	line-height: 1.6;
}

pre code {
	background: none;
	padding: 0;
}

/* --- Lists ---------------------------------------------------------------- */
ul, ol {
	padding-left: 1.5em;
	margin-bottom: 1.4em;
}

li {
	margin-bottom: 0.4em;
}

/* --- Images --------------------------------------------------------------- */
img {
	max-width: 100%;
	height: auto;
	display: block;
}

/* --- Tables --------------------------------------------------------------- */
table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.9rem;
	margin-bottom: 1.4em;
}

th, td {
	text-align: left;
	padding: 0.6em 0.8em;
	border-bottom: 1px solid var(--vf-border);
}

th {
	font-weight: 600;
	border-bottom-width: 2px;
}

/* --- Site header ---------------------------------------------------------- */
.site-header,
#masthead {
	background-color: var(--vf-surface);
	border-bottom: 1px solid var(--vf-border);
}

/* --- Site footer ---------------------------------------------------------- */
.site-footer,
#colophon {
	background-color: var(--vf-surface);
	border-top: 1px solid var(--vf-border);
	color: var(--vf-text-muted);
	font-size: 0.875rem;
}

/* --- Responsive ----------------------------------------------------------- */
@media ( max-width: 780px ) {
	:root {
		--vf-reading-width: 100%;
	}

	body {
		font-size: 16px;
	}

	h1 { font-size: 1.75rem; }
	h2 { font-size: 1.4rem; }
	h3 { font-size: 1.15rem; }
}
