/**
 * MusixBlog — Typography scale & type roles
 */

:root {
	--display-font: 'Fraunces', Georgia, 'Times New Roman', serif;
	--title-font: 'Source Serif 4', Georgia, 'Times New Roman', serif;
	--body-font: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;

	--mx-leading-tight: 1.15;
	--mx-leading-snug: 1.35;
	--mx-leading-normal: 1.6;
	--mx-leading-relaxed: 1.75;

	--text-display: clamp(2.5rem, 5.5vw, 4.25rem);
	--text-h1: clamp(1.875rem, 3.2vw, 2.75rem);
	--text-h2: clamp(1.5rem, 2.4vw, 2rem);
	--text-h3: clamp(1.25rem, 1.8vw, 1.5rem);
	--text-section: clamp(1.35rem, 2vw, 1.75rem);
	--text-lead: clamp(1rem, 1.4vw, 1.125rem);
	--text-body: 1rem;
	--text-small: 0.875rem;
	--text-caption: 0.8125rem;
	--text-eyebrow: 0.6875rem;
}

/* —— Type roles —— */

.mx-type-display,
.site-title a,
.lbn-logo-wrapper .site-title,
.lbn-logo-wrapper .custom-logo-link:not(:has(img)),
.logo-wrapper.site-title a {
	font-family: var(--display-font);
	font-size: var(--text-display);
	font-weight: 500;
	font-variation-settings: 'SOFT' 50, 'WONK' 0.8;
	letter-spacing: -0.02em;
	line-height: var(--mx-leading-tight);
}

.mx-type-section,
h1.page-title,
h1.entry-title,
.section-header .page-title,
.mx-section-header .page-title {
	font-family: var(--title-font);
	font-size: var(--text-section);
	font-weight: 500;
	letter-spacing: -0.015em;
	line-height: var(--mx-leading-snug);
}

.mx-type-lead,
.tagline,
.mx-sidebar__tagline {
	font-family: var(--body-font);
	font-size: var(--text-lead);
	font-weight: 400;
	line-height: var(--mx-leading-relaxed);
	letter-spacing: 0.01em;
	color: var(--mx-ink-muted, #8a8a8a);
	max-width: 42rem;
}

.mx-type-card,
.flex-grid .flex-box:not(.archive-info) .entry-title,
.flex-grid .flex-box:not(.archive-info) .entry-title a {
	font-family: var(--title-font);
	font-size: var(--text-h3);
	font-weight: 500;
	letter-spacing: -0.01em;
	line-height: var(--mx-leading-snug);
}

.mx-type-eyebrow,
.mx-section-header__eyebrow,
.entry-meta.before-title ul li:not(.category-list) a,
.entry-meta.before-title ul li:not(.category-list),
.mx-footer__links-label,
.mx-sidebar__label {
	font-family: var(--body-font);
	font-size: var(--text-eyebrow);
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--mx-ink-faint, #b0b0b0);
}

.mx-type-meta,
.entry-meta.after-title,
.entry-meta.after-title a,
.entry-author-meta,
.flex-box .entry-meta ul li {
	font-family: var(--body-font);
	font-size: var(--text-caption);
	font-weight: 400;
	letter-spacing: 0.02em;
	color: var(--entry-meta-color, #9a9a9a);
}

.mx-type-excerpt,
.entry-content,
.entry-content p,
.excerpt {
	font-family: var(--body-font);
	font-size: var(--text-small);
	font-weight: 400;
	line-height: var(--mx-leading-normal);
	color: var(--excerpt-color, #737373);
}

.mx-type-body {
	font-family: var(--body-font);
	font-size: var(--text-body);
	line-height: var(--mx-leading-normal);
}

/* —— Base overrides —— */

body {
	font-family: var(--body-font);
	font-size: var(--text-body);
	line-height: var(--mx-leading-normal);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--title-font);
	font-weight: 500;
	letter-spacing: -0.015em;
}

h1 {
	font-size: var(--text-h1);
	line-height: var(--mx-leading-tight);
}

h2 {
	font-size: var(--text-h2);
	line-height: var(--mx-leading-snug);
}

h3 {
	font-size: var(--text-h3);
	line-height: var(--mx-leading-snug);
}

h4 { font-size: 1.25rem; }
h5 { font-size: 1.125rem; }
h6 { font-size: 1rem; }

/* Primary navigation */
.primary-nav a,
.primary-nav li a {
	font-family: var(--body-font);
	font-size: 0.9375rem;
	font-weight: 500;
	letter-spacing: 0.01em;
}

/* Widget titles */
.widget-title,
h3.widget-title {
	font-family: var(--title-font);
	font-size: 1.125rem;
	font-weight: 500;
	letter-spacing: -0.01em;
}

/* Single post */
.single-post .entry-title,
.the-post .single-post h1.entry-title {
	font-family: var(--title-font);
	font-size: var(--text-h1);
	font-weight: 500;
}

.the-post .single-post .entry-content {
	font-size: 1.0625rem;
	line-height: var(--mx-leading-relaxed);
}

.the-post .single-post .entry-content h2 {
	font-size: var(--text-h2);
	margin-top: 2.5rem;
}

.the-post .single-post .entry-content h3 {
	font-size: var(--text-h3);
	margin-top: 2rem;
}

/* Category pills in cards */
.entry-meta.before-title .category-list a,
.flex-box .entry-meta-category a {
	font-family: var(--body-font);
	font-size: var(--text-eyebrow);
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

/* Page archive subtitle */
.page-header .page-subtitle {
	font-family: var(--body-font);
	font-size: var(--text-small);
	font-weight: 500;
	letter-spacing: 0.04em;
}