/**
 * MusixBlog — Soft light monochrome + motion
 */

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

	--mx-ink: #3d3d3d;
	--mx-ink-soft: #5c5c5c;
	--mx-ink-muted: #8a8a8a;
	--mx-ink-faint: #b0b0b0;
	--mx-surface: #ffffff;
	--mx-surface-2: #f3f2ef;
	--mx-surface-3: #eae9e5;
	--mx-line: rgba(60, 60, 60, 0.1);
	--mx-line-strong: rgba(60, 60, 60, 0.16);
	--mx-accent: #6e6e6e;
	--mx-accent-hover: #525252;
	--mx-ease: cubic-bezier(0.25, 0.46, 0.45, 0.94);
	--mx-duration: 0.35s;

	--theme-color-1: var(--mx-accent);
	--theme-color-2: #8a8a8a;
	--theme-color-3: var(--mx-ink-muted);
	--theme-color-4: #747474;
	--theme-color-5: var(--mx-ink);

	--black: #3a3a3a;
	--very-dark-grey: #454545;
	--dark-grey: #5c5c5c;
	--medium-grey: #8a8a8a;
	--light-grey: #b5b5b5;
	--white: #ffffff;

	--body-background: #f8f6f3;
	--mx-accent-warm: #8b7355;
	--mx-accent-warm-hover: #6f5a44;
	--footer-background: #fafaf8;
	--footer-font-color: #6e6e6e;
	--footer-link-color: #525252;
	--footer-bottom-background: #f0efec;

	--light-border-color: var(--mx-line);
	--medium-border-color: var(--mx-line-strong);
	--light-background-color: var(--mx-surface-2);
	--very-light-background-color: var(--mx-surface);

	--body-font-color: #4a4a4a;
	--custom-header-background: rgba(250, 250, 248, 0.88);
	--link-color: #525252;
	--link-hover-color: #3a3a3a;
	--primary-nav-link-color: #5c5c5c;
	--primary-nav-link-hover-color: #3a3a3a;
	--primary-nav-submenu-background: #ffffff;
	--primary-nav-submenu-link-color: #5c5c5c;
	--primary-nav-submenu-link-hover-color: #3a3a3a;
	--primary-nav-sidebar-link-color: #4a4a4a;
	--primary-nav-sidebar-submenu-background: #f3f2ef;
	--primary-nav-sidebar-submenu-link-color: #6e6e6e;
	--primary-nav-sidebar-submenu-sub-link-color: #8a8a8a;
	--primary-nav-sidebar-submenu-arrow-color: #b0b0b0;
	--sticky-header-primary-nav-submenu-background: #ffffff;
	--sticky-header-primary-nav-submenu-link-color: #5c5c5c;
	--sticky-header-primary-nav-submenu-link-hover-color: #3a3a3a;
	--sticky-header-primary-nav-link-color: #5c5c5c;
	--sticky-header-primary-nav-link-hover-color: #3a3a3a;

	--post-background: #ffffff;
	--entry-title-link-color: #3d3d3d;
	--entry-meta-color: #9a9a9a;
	--entry-meta-link-color: #6e6e6e;
	--excerpt-color: #737373;
	--continue-reading-color: #525252;

	--single-post-background: #ffffff;
	--single-entry-title-color: #3d3d3d;
	--single-entry-font-color: #4a4a4a;
	--single-excerpt-color: #737373;
	--single-entry-meta-color: #9a9a9a;
	--single-entry-meta-link-color: #6e6e6e;
	--post-tags-background: #f0efec;
	--post-tags-font-color: #5c5c5c;

	--toggle-background-color: rgba(60, 60, 60, 0.05);
	--toggle-hover-background-color: rgba(60, 60, 60, 0.09);
	--toggle-icon-color: #5c5c5c;
	--logo-color: #3d3d3d;
	--sidebar-logo-color: #3d3d3d;
	--sticky-header-background: rgba(250, 250, 248, 0.94);
	--sticky-header-logo-color: #3d3d3d;

	--widget-background: #ffffff;
	--widget-title-color: #3d3d3d;
	--widget-font-color: #5c5c5c;
	--widget-link-color: #454545;
	--widget-child-link-color: #8a8a8a;
	--widget-meta-color: #9a9a9a;
	--widget-meta-link-color: #6e6e6e;
	--widget-line-color: var(--mx-line);
	--widget-count-color: #6e6e6e;
	--widget-first-count-color: #525252;
	--widget-count-background: rgba(60, 60, 60, 0.06);
	--widget-first-count-background: rgba(60, 60, 60, 0.09);

	--button-color: #6e6e6e;
	--button-hover-color: #525252;
	--button-font-color: #ffffff;

	--input-background: #ffffff;
	--input-border-color: rgba(60, 60, 60, 0.14);
	--input-font-color: #3d3d3d;
	--input-focus-border-color: rgba(60, 60, 60, 0.28);

	--hero-overlay-color: rgba(50, 50, 50, 0.4);
	--pagination-numbers-current-background: #6e6e6e;
	--pagination-prev-next-background: #6e6e6e;
	--page-meta-background: #9a9a9a;
	--ruki-menu-pill-background: #eae9e5;
	--ruki-menu-pill-color: #525252;

	--default-box-shadow: 0 2px 16px rgba(40, 40, 40, 0.05);
	--thumbnail-box-shadow: 0 1px 8px rgba(40, 40, 40, 0.04);
	--card-border-radius: 16px;
	--mx-content-max: 1180px;
}

/* Subtle paper + dot pattern */
body {
	background-color: var(--body-background);
	background-image:
		linear-gradient(135deg, rgba(255, 255, 255, 0.6) 0%, transparent 50%),
		radial-gradient(circle at 20% 80%, rgba(0, 0, 0, 0.018) 0%, transparent 45%),
		radial-gradient(circle at 1px 1px, rgba(0, 0, 0, 0.022) 1px, transparent 0);
	background-size: auto, auto, 22px 22px;
	color: var(--body-font-color);
}

/* Header */
.site-header,
.sticky-nav .site-header {
	background: var(--custom-header-background);
	backdrop-filter: blur(14px);
	border-bottom: 1px solid var(--light-border-color);
	box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8) inset;
	transition: background var(--mx-duration) var(--mx-ease),
		box-shadow var(--mx-duration) var(--mx-ease);
}

.site-title,
.lbn-logo-wrapper a,
.lbn-logo-wrapper .custom-logo-link {
	color: var(--logo-color);
}

/* Softer typography — override Ruki heavy weights */
h1.page-title,
h1.entry-title,
.home.page div[class*="cols"] h1.entry-title,
.flex-grid .entry-title,
.flex-grid h2.entry-title,
.flex-grid h3.entry-title,
.section-header .page-title,
.mx-section-header .page-title {
	font-weight: 500 !important;
	color: var(--entry-title-link-color);
}

.entry-title a {
	transition: color var(--mx-duration) var(--mx-ease);
}

.entry-meta,
.entry-meta a {
	font-weight: 400 !important;
	color: var(--entry-meta-color);
}

.entry-meta.before-title ul li:not(.category-list) {
	font-weight: 400;
	letter-spacing: 0.03em;
	text-transform: none;
}

/* Brand block (logo + tagline) */
.mx-brand {
	position: relative;
	text-align: center;
	padding: 2rem 1.25rem 2.25rem;
	margin-bottom: 0.5rem;
}

.mx-brand::before {
	content: '';
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	width: min(520px, 90%);
	height: 1px;
	background: linear-gradient(90deg, transparent, var(--mx-line-strong), transparent);
}

.mx-brand .tagline {
	margin: 0.85rem auto 0;
	padding: 0 1rem;
}

.mx-brand .site-title,
.mx-brand .logo-wrapper {
	margin: 0;
}

/* Section header */
.section-header,
.mx-section-header {
	position: relative;
	margin-bottom: 2rem;
	padding-bottom: 0;
	text-align: left;
}

.mx-section-header__eyebrow {
	margin: 0 0 0.35rem;
}

.section-header::after,
.mx-section-header::after {
	content: '';
	display: block;
	width: 56px;
	height: 2px;
	margin-top: 0.85rem;
	border-radius: 2px;
	background: linear-gradient(90deg, var(--mx-accent-warm), var(--mx-ink-faint));
	opacity: 0.85;
}

.section-header .page-title::before,
.mx-section-header .page-title::before {
	content: none;
}

/* Home content width */
.home .mx-home-wrap,
.home .wrap.mx-home-wrap {
	max-width: var(--mx-content-max);
	margin-left: auto;
	margin-right: auto;
}

/* Card layout — see musixblog-cards.css */

@media (prefers-reduced-motion: no-preference) {
	.home .masonry-container .flex-box:not(.archive-info),
	.home .grid-container .flex-box:not(.archive-info) {
		animation: mxFadeUp 0.45s var(--mx-ease) both;
	}

	.home .flex-box:nth-child(1)  { animation-delay: 0.03s; }
	.home .flex-box:nth-child(2)  { animation-delay: 0.06s; }
	.home .flex-box:nth-child(3)  { animation-delay: 0.09s; }
	.home .flex-box:nth-child(4)  { animation-delay: 0.12s; }
	.home .flex-box:nth-child(5)  { animation-delay: 0.15s; }
	.home .flex-box:nth-child(6)  { animation-delay: 0.18s; }
}

@keyframes mxFadeUp {
	from {
		opacity: 0;
		transform: translateY(10px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* Loop cards — musixblog-cards.css */

/* Search / archive page subtitle pill — softer */
.page-header .page-subtitle:not(.after-title) {
	font-weight: 400 !important;
	background: var(--page-meta-background);
	font-family: var(--body-font);
	font-size: 0.875rem;
	letter-spacing: 0.01em;
}

/* Hero/featured category slugs — keep Ruki pill style, soft color via --theme-color-2 */
.hero .entry-meta-category a,
.home-featured .entry-meta-category a,
.category-featured .entry-meta-category a {
	font-weight: 500 !important;
}

/* Post nav pills */
.post-navigation .prev-next-pill span {
	background: var(--mx-surface-2) !important;
	color: var(--mx-ink-soft) !important;
	border: 1px solid var(--mx-line) !important;
	font-weight: 500 !important;
}

/* Goto top */
.goto-top {
	background: var(--mx-accent);
	color: #fff;
	box-shadow: 0 3px 12px rgba(40, 40, 40, 0.12);
	transition:
		background var(--mx-duration) var(--mx-ease),
		transform var(--mx-duration) var(--mx-ease),
		opacity var(--mx-duration) var(--mx-ease);
}

.goto-top:hover {
	background: var(--mx-accent-hover);
	color: #fff;
	transform: translateY(-2px);
}

/* Forms */
input[type="text"],
input[type="email"],
input[type="search"],
textarea,
select {
	background: var(--input-background);
	border-color: var(--input-border-color);
	color: var(--input-font-color);
	transition: border-color var(--mx-duration) var(--mx-ease),
		box-shadow var(--mx-duration) var(--mx-ease);
}

input:focus,
textarea:focus,
select:focus {
	border-color: var(--input-focus-border-color);
	box-shadow: 0 0 0 3px rgba(60, 60, 60, 0.06);
	outline: none;
}

.mx-sidebar .primary-nav-sidebar-wrapper {
	display: block !important;
	visibility: visible !important;
}

.site-search {
	background: rgba(250, 250, 248, 0.97);
}

.body-fade {
	background: rgba(50, 50, 50, 0.25) !important;
	backdrop-filter: blur(3px);
	transition: opacity var(--mx-duration) var(--mx-ease);
}

/* Footer */
.site-footer.mx-footer .footer-bottom-data,
.site-footer.mx-footer .footer-widget-area {
	display: none !important;
}

.site-footer.mx-footer {
	position: relative;
	margin-top: 3rem;
	padding: 0;
	background: transparent;
	border: none;
	overflow: hidden;
}

.mx-footer__curve {
	display: block;
	width: 100%;
	height: 48px;
	margin-bottom: -1px;
	color: #f0efec;
	line-height: 0;
}

.mx-footer__curve svg {
	display: block;
	width: 100%;
	height: 48px;
}

.mx-footer__main {
	padding: 2.5rem 0 2rem;
	background: linear-gradient(165deg, #f0efec 0%, #eae8e4 100%);
}

.mx-footer__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
	gap: 2.5rem 3rem;
	align-items: center;
}

.mx-footer__brand {
	padding-right: 1rem;
}

.mx-footer__logo {
	display: inline-flex;
	align-items: center;
	gap: 0.55rem;
	text-decoration: none;
	margin-bottom: 0.75rem;
	transition: opacity var(--mx-duration) var(--mx-ease);
}

.mx-footer__logo:hover {
	opacity: 0.75;
}

.mx-footer__logo-mark {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	font-size: 0.95rem;
	color: var(--mx-ink-muted);
	background: rgba(255, 255, 255, 0.65);
	border: 1px solid rgba(60, 60, 60, 0.08);
	border-radius: 50%;
	box-shadow: 0 2px 8px rgba(40, 40, 40, 0.04);
}

.mx-footer__logo-text {
	font-family: var(--title-font);
	font-size: 1.25rem;
	font-weight: 400;
	color: var(--mx-ink);
	letter-spacing: 0.02em;
}

.mx-footer__desc {
	margin: 0;
	max-width: 380px;
	font-size: 0.875rem;
	line-height: 1.75;
	color: var(--mx-ink-muted);
	font-weight: 400;
}

.mx-footer__links {
	padding: 1.25rem 1.35rem;
	background: rgba(255, 255, 255, 0.55);
	border: 1px solid rgba(60, 60, 60, 0.07);
	border-radius: 20px;
	box-shadow: 0 4px 20px rgba(40, 40, 40, 0.04);
	backdrop-filter: blur(6px);
}

.mx-footer__links-label {
	margin: 0 0 0.75rem;
	font-family: var(--body-font);
	font-size: 0.68rem;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--mx-ink-faint);
}

.mx-footer__menu {
	display: flex;
	flex-wrap: wrap;
	gap: 0.45rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.mx-footer__menu li {
	margin: 0;
	padding: 0;
}

.mx-footer__menu a {
	display: inline-block;
	padding: 0.38rem 0.85rem;
	font-size: 0.8125rem;
	font-weight: 400;
	color: var(--mx-ink-soft);
	text-decoration: none;
	background: rgba(255, 255, 255, 0.7);
	border: 1px solid rgba(60, 60, 60, 0.08);
	border-radius: 100px;
	transition:
		background var(--mx-duration) var(--mx-ease),
		color var(--mx-duration) var(--mx-ease),
		border-color var(--mx-duration) var(--mx-ease),
		transform var(--mx-duration) var(--mx-ease);
}

.mx-footer__menu a:hover {
	background: #fff;
	color: var(--mx-ink);
	border-color: rgba(60, 60, 60, 0.14);
	transform: translateY(-1px);
}

.mx-footer__bar {
	background: #e8e6e2;
	border: none;
}

.mx-footer__bar-inner {
	padding: 1rem 0 1.15rem;
}

.mx-footer__copy {
	margin: 0;
	font-size: 0.78rem;
	color: var(--mx-ink-muted);
	text-align: center;
	font-weight: 400;
}

.mx-footer__copy a {
	color: var(--mx-ink-soft);
	text-decoration: none;
	transition: color var(--mx-duration) var(--mx-ease);
}

.mx-footer__copy a:hover {
	color: var(--mx-ink);
}

.mx-footer__sep {
	margin: 0 0.35rem;
	opacity: 0.45;
}

@media (max-width: 768px) {
	.site-footer.mx-footer {
		margin-top: 2rem;
	}

	.mx-footer__grid {
		grid-template-columns: 1fr;
		gap: 1.5rem;
	}

	.mx-footer__brand {
		padding-right: 0;
		text-align: center;
	}

	.mx-footer__logo {
		justify-content: center;
	}

	.mx-footer__desc {
		max-width: none;
		margin: 0 auto;
	}

	.mx-footer__links {
		padding: 1.1rem 1.15rem;
		border-radius: 16px;
	}

	.mx-footer__links-label {
		text-align: center;
	}

	.mx-footer__menu {
		justify-content: center;
	}
}

/* Primary nav hover (padding in musixblog-header.css grid) */
.primary-nav > li > a:hover,
.primary-nav > li.current-menu-item > a {
	color: var(--mx-accent-warm);
	transition: color var(--mx-duration) var(--mx-ease);
}

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