/* nord — soft cool blue-gray. Easy on the eyes. Accent: frost blue. */

:root {
  --bg: #eceff4;
  --fg: #2e3440;
  --muted: #4c566a;
  --accent: #5e81ac;
  --border: #d8dee9;
  --code-bg: #d8dee9;
  --pre-bg: #2e3440;
  --pre-fg: #d8dee9;
  --quote-border: #88c0d0;
}

body { background: var(--bg); color: var(--fg); font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
header, footer { border-color: var(--border) !important; background: var(--bg); }
article > h1 { color: var(--fg); letter-spacing: -0.015em; }

.page-content { line-height: 1.75; font-size: 1.05rem; }
.page-content h2 { font-size: 1.5rem; font-weight: 600; margin: 2rem 0 0.75rem; color: var(--fg); }
.page-content h3 { font-size: 1.2rem; font-weight: 600; margin: 1.5rem 0 0.5rem; color: var(--fg); }
.page-content h4 { font-size: 1.05rem; font-weight: 600; margin: 1.25rem 0 0.5rem; }
.page-content p { margin-bottom: 1rem; }
.page-content a { color: var(--accent); text-decoration: underline; text-underline-offset: 2px; }
.page-content a:hover { color: #81a1c1; }
.page-content ul { list-style: disc; padding-left: 1.5rem; margin-bottom: 1rem; }
.page-content ol { list-style: decimal; padding-left: 1.5rem; margin-bottom: 1rem; }
.page-content li { margin-bottom: 0.25rem; }
.page-content code { background: var(--code-bg); padding: 0.1rem 0.35rem; border-radius: 0.25rem; font-size: 0.9em; color: #5e81ac; }
.page-content pre { background: var(--pre-bg); color: var(--pre-fg); padding: 1rem; border-radius: 0.5rem; overflow-x: auto; margin-bottom: 1rem; font-size: 0.9rem; }
.page-content pre code { background: transparent; padding: 0; color: inherit; }
.page-content blockquote { border-left: 4px solid var(--quote-border); padding-left: 1rem; color: var(--muted); font-style: italic; margin: 1rem 0; }
.page-content hr { border: 0; border-top: 1px solid var(--border); margin: 2rem 0; }
.page-content table { border-collapse: collapse; margin: 1rem 0; width: 100%; font-size: 0.95rem; }
.page-content th, .page-content td { border: 1px solid var(--border); padding: 0.5rem 0.75rem; text-align: left; }
.page-content th { background: var(--code-bg); font-weight: 600; }

.page-content h2, .page-content h3, .page-content h4 { scroll-margin-top: 1rem; }
.page-content h2 a.anchor, .page-content h3 a.anchor, .page-content h4 a.anchor { color: inherit; text-decoration: none; }
.page-content h2 a.anchor:hover, .page-content h3 a.anchor:hover, .page-content h4 a.anchor:hover { color: var(--accent); }

.site-nav ul { display: flex; gap: 1rem; list-style: none; padding: 0; margin: 0; }
.site-nav a { color: var(--muted); }
.site-nav a:hover { color: var(--accent); }

.site-footer { color: var(--muted); }
.site-footer p { margin: 0.25rem 0; }
.site-footer a { color: var(--accent); }

/* component classes used by built-in plugins (tags, related-posts, seo-meta) */
.tag-chip { background: var(--code-bg); color: var(--fg); }
.tag-chip:hover { background: var(--border); }
.related { border-top: 1px solid var(--border); }
.related h2 { color: var(--fg); }
.related a, .post-link { color: var(--accent); text-decoration: underline; text-underline-offset: 2px; }
.related a:hover, .post-link:hover { opacity: 0.85; }
.meta-date { color: var(--muted); }