/*
Theme Name: Modirsa
Theme URI: https://www.modirsa.ir
Author: Modirsa
Description: پوستهٔ اختصاصی مجلهٔ مدیریتی مدیرسا؛ راست‌به‌چپ، ریسپانسیو، بهینه برای سئو، با حالت روشن و تیره.
Version: 1.0.0
Requires at least: 7.1
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: modirsa
Tags: rtl-language-support, blog, news, two-columns, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready
*/

/* ==========================================================================
   Tokens
   ========================================================================== */
:root {
	--font: "Vazirmatn", Tahoma, "Segoe UI", system-ui, -apple-system, sans-serif;
	--c-bg: #f7f8f5;
	--c-surface: #ffffff;
	--c-surface-2: #eef2ea;
	--c-ink: #14202b;
	--c-ink-2: #465564;
	--c-line: #e0e6da;
	--c-blue: #2f5f8f;
	--c-blue-d: #244b72;
	--c-green: #4f9333;
	--c-btn: #3f7a26;
	--c-btn-h: #33661e;
	--c-on-btn: #ffffff;
	--c-orange: #e08a1e;
	--c-orange-ink: #8f4d05;
	--c-chip: #fcebd2;
	--c-yellow: #f2c230;
	--c-focus: #1f5fbf;
	--c-topbar: #14202b;
	--c-topbar-ink: #d3dde6;
	--c-hero-a: #eaf2e3;
	--c-hero-b: #e4edf6;
	--c-footer: #14202b;
	--c-footer-ink: #c5d0da;
	--radius: 10px;
	--shadow: 0 10px 28px rgba(20, 32, 43, .08);
	--wrap: 1240px;
	--side: 340px;
	--ab-h: 32px;
	color-scheme: light;
}

html[data-theme="dark"] {
	--c-bg: #0f1720;
	--c-surface: #17212c;
	--c-surface-2: #1e2a37;
	--c-ink: #e6ecf2;
	--c-ink-2: #a9b7c4;
	--c-line: #2a3846;
	--c-blue: #7db0e0;
	--c-blue-d: #9cc4ea;
	--c-green: #86c45f;
	--c-btn: #86c45f;
	--c-btn-h: #9bd375;
	--c-on-btn: #0b1410;
	--c-orange: #f0a040;
	--c-orange-ink: #f6b866;
	--c-chip: #3a2a14;
	--c-yellow: #f5cb4b;
	--c-focus: #f5cb4b;
	--c-topbar: #0a1118;
	--c-topbar-ink: #a9b7c4;
	--c-hero-a: #14222b;
	--c-hero-b: #131d2a;
	--c-footer: #0a1118;
	--c-footer-ink: #a9b7c4;
	--shadow: 0 10px 28px rgba(0, 0, 0, .35);
	color-scheme: dark;
}

/* ==========================================================================
   Base
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
	margin: 0;
	background: var(--c-bg);
	color: var(--c-ink);
	font-family: var(--font);
	font-size: 1rem;
	line-height: 1.9;
	overflow-x: clip;
	overflow-wrap: break-word;
}
img, svg, video, canvas, iframe, embed, object { max-inline-size: 100%; }
img { block-size: auto; }
h1, h2, h3, h4, h5, h6 { margin: 0 0 .6em; line-height: 1.5; font-weight: 800; color: var(--c-ink); }
p { margin: 0 0 1.1em; }
a { color: var(--c-blue); text-underline-offset: .25em; }
a:hover { color: var(--c-blue-d); }
ul, ol { padding-inline-start: 1.4em; }
:focus-visible { outline: 3px solid var(--c-focus); outline-offset: 2px; }
button { font: inherit; color: inherit; }
table { border-collapse: collapse; }

.screen-reader-text {
	position: absolute !important;
	inline-size: 1px; block-size: 1px;
	margin: -1px; padding: 0; border: 0;
	overflow: hidden; clip-path: inset(50%);
	white-space: nowrap;
}
.screen-reader-text:focus-visible { clip-path: none; }
.skip-link {
	position: absolute; inset-block-start: -100px; inset-inline-start: 12px; z-index: 1000;
	padding: 10px 16px; background: var(--c-btn); color: var(--c-on-btn); border-radius: var(--radius); text-decoration: none;
}
.skip-link:focus { inset-block-start: 12px; }

.wrap { max-inline-size: var(--wrap); margin-inline: auto; padding-inline: 20px; }

/* Ring motif: three overlapping rings (green, blue, orange), CSS only */
.ring-mark {
	position: relative; flex: none;
	inline-size: 16px; block-size: 16px; margin-inline-end: 22px;
	border: 2.5px solid var(--c-green); border-radius: 50%;
}
.ring-mark::before, .ring-mark::after {
	content: ""; position: absolute; inset-block-start: -2.5px;
	inline-size: 16px; block-size: 16px; border-radius: 50%; border: 2.5px solid;
}
.ring-mark::before { inset-inline-start: 6px; border-color: var(--c-blue); }
.ring-mark::after { inset-inline-start: 13px; border-color: var(--c-orange); }

/* ==========================================================================
   Header
   ========================================================================== */
.topbar { background: var(--c-topbar); color: var(--c-topbar-ink); font-size: .8125rem; }
.topbar-inner { display: flex; align-items: center; gap: 20px; min-block-size: 38px; }
.topbar-desc { flex: 1; opacity: .85; }
.topbar-links { display: flex; gap: 16px; margin: 0; padding: 0; list-style: none; }
.topbar a { color: var(--c-topbar-ink); text-decoration: none; }
.topbar a:hover { color: var(--c-yellow); }
.topbar :focus-visible { outline-color: var(--c-yellow); }

.site-header { background: var(--c-surface); }
.header-main { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-block: 16px; }
.brand-link { display: inline-flex; align-items: center; gap: 14px; text-decoration: none; color: var(--c-ink); }
.brand-mark { inline-size: 56px; block-size: 56px; flex: none; }
.brand-text { display: flex; flex-direction: column; line-height: 1.4; }
.brand-name { font-size: 1.75rem; font-weight: 900; color: var(--c-green); }
.brand-tag { font-size: .8125rem; color: var(--c-ink-2); }
.custom-logo { block-size: auto; max-block-size: 64px; inline-size: auto; }
.header-banner img { display: block; max-inline-size: 100%; block-size: auto; border-radius: 6px; }

.nav-bar {
	position: sticky; inset-block-start: 0; z-index: 50;
	background: var(--c-surface); border-block: 1px solid var(--c-line);
	transition: box-shadow .2s;
}
.nav-bar.is-stuck { box-shadow: 0 6px 18px rgba(20, 32, 43, .1); }
.admin-bar .nav-bar { inset-block-start: var(--ab-h); }
.nav-inner { display: flex; align-items: center; gap: 12px; min-block-size: 54px; }
.primary-nav { flex: 1; }
.primary-nav .menu { display: flex; flex-wrap: wrap; gap: 4px; margin: 0; padding: 0; list-style: none; }
.primary-nav .menu-item { position: relative; }
.primary-nav a {
	position: relative; display: block; padding: 14px 14px; color: var(--c-ink);
	font-weight: 700; text-decoration: none;
}
.primary-nav a::after {
	content: ""; position: absolute; inset-inline: 14px; inset-block-end: 6px; block-size: 3px; border-radius: 3px;
	background: linear-gradient(90deg, var(--c-green), var(--c-yellow)); transform: scaleX(0); transform-origin: right; transition: transform .2s;
}
.primary-nav a:hover, .primary-nav .current-menu-item > a, .primary-nav .current-menu-ancestor > a, .primary-nav .current_page_item > a { color: var(--c-blue); }
.primary-nav a:hover::after, .primary-nav .current-menu-item > a::after, .primary-nav .current-menu-ancestor > a::after, .primary-nav .current_page_item > a::after { transform: scaleX(1); }
.primary-nav .sub-menu {
	position: absolute; inset-inline-start: 0; inset-block-start: 100%; z-index: 10; min-inline-size: 210px;
	margin: 0; padding: 8px; list-style: none; display: none;
	background: var(--c-surface); border: 1px solid var(--c-line); border-radius: var(--radius); box-shadow: var(--shadow);
}
.primary-nav .menu-item:hover > .sub-menu, .primary-nav .menu-item:focus-within > .sub-menu, .primary-nav .menu-item.is-open > .sub-menu { display: block; }
.primary-nav .sub-menu a { padding: 9px 12px; font-weight: 500; border-radius: 6px; }
.primary-nav .sub-menu a::after { display: none; }
.primary-nav .sub-menu a:hover { background: var(--c-surface-2); }
.sub-toggle { display: none; }

.nav-tools { display: flex; align-items: center; gap: 10px; }
.tool-btn {
	display: inline-grid; place-items: center; inline-size: 40px; block-size: 40px;
	background: transparent; border: 1px solid var(--c-line); border-radius: 50%; color: var(--c-ink); cursor: pointer;
}
.tool-btn:hover { background: var(--c-surface-2); }
.menu-toggle { display: none; inline-size: 42px; block-size: 42px; background: transparent; border: 1px solid var(--c-line); border-radius: var(--radius); cursor: pointer; }
.menu-toggle-bars, .menu-toggle-bars::before, .menu-toggle-bars::after {
	display: block; inline-size: 20px; block-size: 2px; background: var(--c-ink); border-radius: 2px; content: "";
}
.menu-toggle-bars { position: relative; margin: auto; }
.menu-toggle-bars::before { position: absolute; inset-block-start: -6px; }
.menu-toggle-bars::after { position: absolute; inset-block-start: 6px; }

/* Dark / light toggle: a pill with two orbit rings and a sun that becomes a moon */
.theme-toggle {
	position: relative; inline-size: 62px; block-size: 34px; padding: 0; cursor: pointer;
	background: var(--c-surface-2); border: 1px solid var(--c-line); border-radius: 99px;
}
.theme-toggle::before, .theme-toggle::after {
	content: ""; position: absolute; inset-block-start: 6px; inline-size: 20px; block-size: 20px;
	border: 2px solid; border-radius: 50%; opacity: .55;
}
.theme-toggle::before { inset-inline-start: 14px; border-color: var(--c-blue); }
.theme-toggle::after { inset-inline-start: 27px; border-color: var(--c-orange); }
.theme-toggle-knob {
	position: absolute; z-index: 1; inset-block-start: 4px; inset-inline-start: 4px;
	inline-size: 24px; block-size: 24px; border-radius: 50%; background: var(--c-yellow);
	box-shadow: 0 0 0 3px rgba(242, 194, 48, .25);
	transition: inset-inline-start .28s ease, background .28s, box-shadow .28s;
}
html[data-theme="dark"] .theme-toggle-knob {
	inset-inline-start: 32px; background: #dce6f0; box-shadow: inset 7px -2px 0 0 var(--c-surface-2);
}

.search-panel { border-block-start: 1px solid var(--c-line); background: var(--c-surface-2); padding-block: 14px; }

/* ==========================================================================
   Forms
   ========================================================================== */
.search-form { display: flex; gap: 8px; }
.search-field, .comment-form input[type="text"], .comment-form input[type="email"], .comment-form textarea, .widget select {
	inline-size: 100%; padding: 11px 14px; font: inherit; color: var(--c-ink);
	background: var(--c-surface); border: 1px solid var(--c-line); border-radius: var(--radius);
}
.search-field { flex: 1; min-inline-size: 0; }
.search-submit, .btn, .comment-form .submit {
	padding: 11px 22px; font: inherit; font-weight: 700; cursor: pointer;
	background: var(--c-btn); color: var(--c-on-btn); border: 0; border-radius: 99px;
}
.search-submit:hover, .btn:hover, .comment-form .submit:hover { background: var(--c-btn-h); }

/* ==========================================================================
   Hero
   ========================================================================== */
.hero {
	position: relative; overflow: hidden; isolation: isolate;
	background: linear-gradient(135deg, var(--c-hero-a), var(--c-hero-b));
	border-block-end: 1px solid var(--c-line);
}
.hero::before {
	content: ""; position: absolute; z-index: -1; inset-block: -60% -60%; inset-inline-end: -8%; inline-size: 62%;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 600'%3E%3Cg fill='none' stroke-width='14'%3E%3Ccircle cx='300' cy='300' r='280' stroke='%232F5F8F'/%3E%3Cellipse cx='300' cy='300' rx='285' ry='105' stroke='%23E08A1E' transform='rotate(-28 300 300)'/%3E%3Cellipse cx='300' cy='300' rx='285' ry='120' stroke='%238FB35A' transform='rotate(32 300 300)'/%3E%3Cellipse cx='300' cy='300' rx='110' ry='285' stroke='%232F5F8F' transform='rotate(12 300 300)'/%3E%3C/g%3E%3C/svg%3E") center / contain no-repeat;
	opacity: .22;
}
html[data-theme="dark"] .hero::before { opacity: .16; }
.hero-inner { padding-block: 56px 48px; }
.hero-inner > * { max-inline-size: 720px; }
.hero-kicker { margin: 0 0 8px; font-weight: 700; color: var(--c-orange-ink); }
.hero-title { margin: 0 0 8px; font-size: clamp(1.9rem, 4vw, 3rem); line-height: 1.4; font-weight: 900; color: var(--c-ink); }
.hero-sub { margin: 0 0 24px; color: var(--c-ink-2); font-size: 1.0625rem; }
.hero-search .search-form { background: var(--c-surface); padding: 8px; border: 1px solid var(--c-line); border-radius: 99px; box-shadow: var(--shadow); }
.hero-search .search-field { border: 0; background: transparent; padding-inline: 18px; }
.hero-search .search-field:focus-visible { outline-offset: 0; border-radius: 99px; }
.hero-chips { display: flex; flex-wrap: wrap; gap: 10px; margin: 20px 0 0; padding: 0; list-style: none; }
.hero-chips a {
	display: inline-block; padding: 6px 16px; text-decoration: none; font-weight: 700; font-size: .9375rem;
	color: var(--c-blue); background: var(--c-surface); border: 1px solid var(--c-line); border-radius: 99px;
}
.hero-chips a:hover { border-color: var(--c-orange); color: var(--c-orange-ink); }

/* ==========================================================================
   Layout
   ========================================================================== */
.layout { display: grid; grid-template-columns: minmax(0, 1fr) var(--side); gap: 32px; padding-block: 36px 48px; align-items: start; }
.main-col, .sidebar { min-inline-size: 0; }
.featured { padding-block: 36px 0; }
.section-title { display: flex; align-items: center; margin: 0 0 20px; font-size: 1.375rem; font-weight: 900; }
.page-head { margin-block-end: 24px; padding-block-end: 16px; border-block-end: 1px solid var(--c-line); }
.page-title { margin: 0 0 8px; font-size: clamp(1.5rem, 3vw, 2rem); font-weight: 900; }
.page-desc { margin: 0; color: var(--c-ink-2); }
.page-search { margin-block-start: 16px; max-inline-size: 520px; }
.empty-note { padding: 28px; text-align: center; color: var(--c-ink-2); background: var(--c-surface); border: 1px dashed var(--c-line); border-radius: var(--radius); }

.breadcrumb { margin-block-end: 18px; font-size: .875rem; color: var(--c-ink-2); }
.breadcrumb ol { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.breadcrumb li + li::before { content: "‹"; margin-inline-end: 6px; color: var(--c-orange); }
.breadcrumb a { color: var(--c-ink-2); text-decoration: none; }
.breadcrumb a:hover { color: var(--c-blue); text-decoration: underline; }
.breadcrumb .breadcrumb_last, .breadcrumb [aria-current] { color: var(--c-ink); }

/* ==========================================================================
   Cards
   ========================================================================== */
.card-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 24px; }
.card-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.card-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.article-card {
	position: relative; display: flex; flex-direction: column; min-inline-size: 0;
	background: var(--c-surface); border: 1px solid var(--c-line); border-radius: var(--radius); overflow: hidden;
	transition: box-shadow .2s, border-color .2s;
}
.article-card:hover, .article-card:focus-within { box-shadow: var(--shadow); border-color: var(--c-blue); }
.card-thumb, .list-thumb, .feature-media { display: block; position: relative; overflow: hidden; background: var(--c-surface-2); }
.card-thumb { aspect-ratio: 3 / 2; }
.card-thumb img, .list-thumb img, .feature-media img { display: block; inline-size: 100%; block-size: 100%; object-fit: cover; }
.is-empty::after {
	content: ""; position: absolute; inset: 0; margin: auto; inline-size: 44px; block-size: 28px; opacity: .6;
	background: radial-gradient(circle at 14px 14px, transparent 9px, var(--c-green) 9px 11.5px, transparent 12px), radial-gradient(circle at 30px 14px, transparent 9px, var(--c-orange) 9px 11.5px, transparent 12px);
}
.cat-chip {
	position: absolute; inset-block-start: 12px; inset-inline-start: 12px; z-index: 2;
	padding: 2px 12px; font-size: .8125rem; font-weight: 700; line-height: 1.8; text-decoration: none;
	color: var(--c-orange-ink); background: var(--c-chip); border-radius: 99px;
}
.cat-chip:hover { color: var(--c-orange-ink); filter: brightness(.96); }
.cat-chip--inline { position: static; display: inline-block; margin-block-end: 12px; }
.card-body { display: flex; flex-direction: column; flex: 1; padding: 16px 18px 18px; }
.card-title { margin: 0 0 8px; font-size: 1.0625rem; line-height: 1.7; font-weight: 800; }
.card-title a { color: var(--c-ink); text-decoration: none; }
.card-title a:hover { color: var(--c-blue); }
.card-excerpt { margin: 0 0 12px; font-size: .9375rem; line-height: 1.8; color: var(--c-ink-2); display: -webkit-box; -webkit-line-clamp: 3; line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.card-meta { display: flex; justify-content: space-between; gap: 10px; margin-block-start: auto; padding-block-start: 10px; border-block-start: 1px solid var(--c-line); font-size: .8125rem; color: var(--c-ink-2); }

.feature-grid { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: 24px; }
.feature-main { position: relative; display: grid; min-inline-size: 0; border-radius: var(--radius); overflow: hidden; background: #14202b; }
.feature-media { grid-area: 1 / 1; aspect-ratio: 16 / 11; }
.feature-body {
	grid-area: 1 / 1; align-self: end; padding: 70px 24px 22px; color: #fff;
	background: linear-gradient(to top, rgba(10, 18, 27, .94), rgba(10, 18, 27, .6) 55%, transparent);
}
.feature-title { margin: 0 0 6px; font-size: clamp(1.25rem, 2.4vw, 1.75rem); line-height: 1.6; font-weight: 900; }
.feature-title a { color: #fff; text-decoration: none; }
.feature-title a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.feature-title a:focus-visible { outline: 0; }
.feature-main:focus-within { outline: 3px solid var(--c-focus); outline-offset: 2px; }
.feature-body time { font-size: .875rem; color: #d3dde6; }
.feature-side { display: flex; flex-direction: column; gap: 14px; min-inline-size: 0; }
.list-card { display: flex; gap: 14px; align-items: center; flex: 1; padding: 10px; background: var(--c-surface); border: 1px solid var(--c-line); border-radius: var(--radius); min-inline-size: 0; }
.list-card:hover, .list-card:focus-within { border-color: var(--c-blue); }
.list-thumb { flex: none; inline-size: 104px; aspect-ratio: 4 / 3; border-radius: 8px; }
.list-body { min-inline-size: 0; }
.list-title { margin: 0 0 4px; font-size: .9375rem; line-height: 1.7; font-weight: 800; }
.list-title a { color: var(--c-ink); text-decoration: none; }
.list-title a:hover { color: var(--c-blue); }
.list-body time { font-size: .8125rem; color: var(--c-ink-2); }

.cat-band { padding-block: 0 48px; }
.band-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-block-end: 20px; padding-block-end: 12px; border-block-end: 1px solid var(--c-line); }
.band-head .section-title { margin: 0; }
.band-more { font-weight: 700; text-decoration: none; }

/* ==========================================================================
   Pagination
   ========================================================================== */
.pagination { margin-block-start: 32px; }
.pagination .page-numbers { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 0; padding: 0; list-style: none; }
.pagination a.page-numbers, .pagination span.page-numbers { display: inline-block; }
.pagination li > .page-numbers { display: inline-block; min-inline-size: 42px; padding: 6px 14px; text-align: center; text-decoration: none; color: var(--c-ink); background: var(--c-surface); border: 1px solid var(--c-line); border-radius: var(--radius); }
.pagination li > a.page-numbers:hover { border-color: var(--c-blue); color: var(--c-blue); }
.pagination li > .current { background: var(--c-btn); color: var(--c-on-btn); border-color: var(--c-btn); font-weight: 700; }
.pagination li > .dots { border-color: transparent; background: transparent; }

/* ==========================================================================
   Single / page content
   ========================================================================== */
.entry { background: var(--c-surface); border: 1px solid var(--c-line); border-radius: var(--radius); padding: clamp(18px, 3vw, 36px); margin-block-end: 28px; }
.entry-title { font-size: clamp(1.5rem, 3.2vw, 2.25rem); line-height: 1.6; font-weight: 900; margin-block-end: 14px; }
.entry-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px; margin-block-end: 22px; font-size: .875rem; color: var(--c-ink-2); }
.entry-meta a { color: var(--c-ink-2); }
.meta-author { display: inline-flex; align-items: center; gap: 8px; }
.meta-author .avatar { border-radius: 50%; }
.entry-figure { margin: 0 0 26px; }
.entry-img { display: block; inline-size: 100%; block-size: auto; border-radius: var(--radius); }
.entry-figure figcaption { margin-block-start: 8px; font-size: .875rem; color: var(--c-ink-2); }

.entry-content { font-size: 1.0625rem; line-height: 2.05; overflow-wrap: anywhere; }
.entry-content > * { max-inline-size: 100%; }
.entry-content h2 { margin-block: 1.8em .6em; padding-inline-start: 14px; font-size: 1.5rem; border-inline-start: 4px solid var(--c-orange); }
.entry-content h3 { margin-block: 1.6em .5em; font-size: 1.25rem; color: var(--c-blue); }
.entry-content h4 { margin-block: 1.4em .5em; font-size: 1.0625rem; }
.entry-content img { display: block; margin-inline: auto; border-radius: 8px; }
.entry-content figure { margin: 1.4em 0; }
.entry-content figcaption, .wp-caption-text { font-size: .875rem; color: var(--c-ink-2); text-align: center; }
.entry-content blockquote {
	position: relative; margin: 1.6em 0; padding: 18px 24px; color: var(--c-ink);
	background: var(--c-surface-2); border-inline-start: 5px solid var(--c-green); border-radius: var(--radius);
}
.entry-content blockquote p:last-child { margin-block-end: 0; }
.entry-content table { display: block; max-inline-size: 100%; overflow-x: auto; margin-block: 1.4em; }
.entry-content th, .entry-content td { padding: 10px 14px; border: 1px solid var(--c-line); text-align: start; }
.entry-content th { background: var(--c-surface-2); font-weight: 800; }
.entry-content pre, .entry-content code { direction: ltr; text-align: left; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .9em; }
.entry-content code { padding: 2px 6px; background: var(--c-surface-2); border-radius: 4px; }
.entry-content pre { overflow: auto; padding: 16px; background: #0f1720; color: #e6ecf2; border-radius: var(--radius); }
.entry-content pre code { padding: 0; background: transparent; }
.entry-content iframe, .entry-content video, .entry-content embed { max-inline-size: 100%; }
.entry-content hr { margin-block: 2em; border: 0; border-block-start: 1px solid var(--c-line); }
.entry-content .alignleft { float: left; margin: .3em 1.4em 1em 0; }
.entry-content .alignright { float: right; margin: .3em 0 1em 1.4em; }
.entry-content .aligncenter { display: block; margin-inline: auto; }
.entry-content::after { content: ""; display: table; clear: both; }
.page-links { margin-block: 1.4em; font-weight: 700; }

.entry-footer { margin-block-start: 30px; padding-block-start: 20px; border-block-start: 1px solid var(--c-line); display: grid; gap: 18px; }
.entry-label { display: block; margin-block-end: 8px; font-size: .875rem; font-weight: 800; color: var(--c-ink-2); }
.tag-list, .share-list { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.tag-list a, .share-list a, .share-copy {
	display: inline-block; padding: 4px 14px; font-size: .875rem; text-decoration: none; cursor: pointer;
	color: var(--c-ink); background: var(--c-surface-2); border: 1px solid var(--c-line); border-radius: 99px;
}
.tag-list a:hover, .share-list a:hover, .share-copy:hover { border-color: var(--c-blue); color: var(--c-blue); }
.copy-status { display: block; min-block-size: 1.6em; margin-block-start: 6px; font-size: .875rem; color: var(--c-btn); }

.author-box { display: flex; gap: 18px; align-items: flex-start; margin-block-end: 28px; padding: 22px; background: var(--c-surface); border: 1px solid var(--c-line); border-radius: var(--radius); }
.author-box .avatar { border-radius: 50%; flex: none; }
.author-name { margin: 0 0 4px; font-weight: 800; }
.author-bio { margin: 0; color: var(--c-ink-2); font-size: .9375rem; }

.post-navigation { margin-block-end: 36px; }
.post-navigation .nav-links { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.post-navigation a { display: flex; flex-direction: column; gap: 4px; block-size: 100%; padding: 16px 18px; text-decoration: none; color: var(--c-ink); background: var(--c-surface); border: 1px solid var(--c-line); border-radius: var(--radius); }
.post-navigation a:hover { border-color: var(--c-blue); }
.post-navigation .nav-next { grid-column: 2; text-align: end; }
.post-navigation .nav-sub { font-size: .8125rem; color: var(--c-orange-ink); font-weight: 700; }
.post-navigation .nav-title { font-weight: 800; line-height: 1.7; }
.related { margin-block-end: 36px; }

/* Comments */
.comments-area { margin-block-end: 28px; padding: clamp(18px, 3vw, 32px); background: var(--c-surface); border: 1px solid var(--c-line); border-radius: var(--radius); }
.comments-title, .comment-reply-title { display: flex; align-items: center; margin: 0 0 20px; font-size: 1.25rem; font-weight: 900; }
.comment-list, .comment-list ol { margin: 0; padding: 0; list-style: none; }
.comment-list ol { margin-inline-start: 28px; padding-inline-start: 18px; border-inline-start: 2px solid var(--c-line); }
.comment-list li { margin-block-end: 20px; }
.comment-body { padding: 16px 18px; background: var(--c-surface-2); border-radius: var(--radius); }
.comment-meta { display: flex; gap: 12px; align-items: center; margin-block-end: 8px; }
.comment-meta .avatar { border-radius: 50%; }
.comment-meta-text { display: flex; flex-direction: column; line-height: 1.6; }
.comment-author { font-weight: 800; }
.comment-date { font-size: .8125rem; color: var(--c-ink-2); text-decoration: none; }
.comment-text { overflow-wrap: anywhere; }
.comment-text p:last-child { margin-block-end: 0; }
.comment-actions { display: flex; gap: 16px; font-size: .875rem; margin-block-start: 6px; }
.comment-pending, .form-note, .comments-closed { font-size: .875rem; color: var(--c-ink-2); }
.comment-form p { margin-block-end: 14px; }
.comment-form label { display: block; margin-block-end: 4px; font-weight: 700; font-size: .9375rem; }
.comment-form .req { color: var(--c-orange-ink); }
.comment-form .comment-form-cookies-consent { display: flex; gap: 8px; align-items: center; }
.comment-form .comment-form-cookies-consent label { margin: 0; font-weight: 400; }
.comment-form input[type="email"] { direction: ltr; text-align: left; }
.comment-navigation { margin-block: 12px 20px; }
.comment-navigation .nav-links { display: flex; justify-content: space-between; gap: 12px; }

.archive-lists { display: grid; gap: 28px; }
.plain-list { margin: 0; padding: 0; list-style: none; }
.plain-list li { padding-block: 6px; border-block-end: 1px solid var(--c-line); }
.plain-list a { text-decoration: none; }

/* ==========================================================================
   Sidebar / widgets
   ========================================================================== */
.widget { margin-block-end: 24px; padding: 20px; background: var(--c-surface); border: 1px solid var(--c-line); border-radius: var(--radius); }
.widget-title { display: flex; align-items: center; margin: 0 0 14px; padding-block-end: 12px; font-size: 1.0625rem; font-weight: 900; border-block-end: 1px solid var(--c-line); }
.widget ul { margin: 0; padding: 0; list-style: none; }
.widget li { padding-block: 7px; border-block-end: 1px solid var(--c-line); }
.widget li:last-child { border-block-end: 0; }
.widget li ul { margin-inline-start: 16px; margin-block-start: 6px; }
.widget a { text-decoration: none; color: var(--c-ink); }
.widget a:hover { color: var(--c-blue); text-decoration: underline; }
.widget .post-date, .widget .rss-date { display: block; font-size: .8125rem; color: var(--c-ink-2); }
.widget .search-form { flex-wrap: wrap; }
.widget .search-submit { padding-block: 9px; }
.widget-more { display: block; margin-block-start: 12px; padding-block-start: 10px; border-block-start: 1px dashed var(--c-line); font-weight: 700; font-size: .9375rem; text-align: center; }
.widget_calendar table { inline-size: 100%; text-align: center; }
.widget_calendar th, .widget_calendar td { padding: 4px; }
.widget_calendar caption { margin-block-end: 8px; font-weight: 800; }
.tagcloud { display: flex; flex-wrap: wrap; gap: 8px; }
.tagcloud a { padding: 2px 12px; background: var(--c-surface-2); border: 1px solid var(--c-line); border-radius: 99px; text-decoration: none; }
.widget img { max-inline-size: 100%; block-size: auto; }

/* Friends links (CMS Friends Links plugin). Works in any placement; colors only from theme variables. */
.cms-friends-links { margin: 0; padding: 0; list-style: none; }
.cms-friends-links li { margin: 0; padding: 0; border-block-end: 1px solid var(--c-line); }
.cms-friends-links li:last-child { border-block-end: 0; }
.cms-friends-links a {
	display: flex; align-items: center; gap: 10px; min-block-size: 38px; padding-block: 6px;
	font-size: .9375rem; line-height: 1.6; color: var(--c-ink-2); text-decoration: none;
	overflow-wrap: anywhere; word-break: break-word;
}
.cms-friends-links a::before {
	content: ""; flex: none; inline-size: 8px; block-size: 8px; border: 2px solid var(--c-orange); border-radius: 50%;
	transition: background-color .15s;
}
.cms-friends-links a:hover { color: var(--c-blue); text-decoration: none; }
.cms-friends-links a:hover::before, .cms-friends-links a:focus-visible::before { background: var(--c-orange); }
@media (pointer: coarse) { .cms-friends-links a { min-block-size: 46px; } }

/* ==========================================================================
   Footer
   ========================================================================== */
.site-footer { margin-block-start: 24px; background: var(--c-footer); color: var(--c-footer-ink); }
.footer-grid { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 48px; padding-block: 48px 32px; }
.footer-title { display: flex; align-items: center; margin: 0 0 16px; font-size: 1.125rem; font-weight: 900; color: #fff; }
.footer-about-text p { margin-block-end: .8em; }
.site-footer a { color: var(--c-footer-ink); text-decoration: none; }
.site-footer a:hover { color: var(--c-yellow); text-decoration: underline; }
.site-footer :focus-visible { outline-color: var(--c-yellow); }
.footer-social, .footer-posts { display: flex; margin: 0; padding: 0; list-style: none; }
.footer-social { flex-wrap: wrap; gap: 10px; margin-block-start: 14px; }
.footer-social a { display: inline-block; padding: 3px 14px; border: 1px solid rgba(255, 255, 255, .22); border-radius: 99px; font-size: .875rem; }
.footer-posts { flex-direction: column; }
.footer-posts li { padding-block: 9px; border-block-end: 1px solid rgba(255, 255, 255, .12); }
.footer-posts li:last-child { border-block-end: 0; }
.footer-posts time { display: block; font-size: .8125rem; opacity: .7; }
.footer-bar { border-block-start: 1px solid rgba(255, 255, 255, .12); font-size: .875rem; }
.footer-bar-inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; padding-block: 16px; }
.footer-nav .menu { display: flex; flex-wrap: wrap; gap: 6px 20px; margin: 0; padding: 0; list-style: none; }
.copyright { margin: 0; opacity: .8; }

.to-top {
	position: fixed; inset-block-end: 20px; inset-inline-start: 20px; z-index: 60;
	display: grid; place-items: center; inline-size: 44px; block-size: 44px; cursor: pointer;
	color: var(--c-on-btn); background: var(--c-btn); border: 0; border-radius: 50%; box-shadow: var(--shadow);
}
.to-top[hidden] { display: none; }

/* Read Meter plugin leftovers (until the plugin is removed) */
.bsf-rt-reading-time, #bsf_rt_progress_bar_container { display: none; }

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 1100px) {
	.card-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	:root { --side: 300px; }
}
@media (max-width: 899px) {
	.layout { grid-template-columns: minmax(0, 1fr); }
	.feature-grid { grid-template-columns: minmax(0, 1fr); }
	.footer-grid { grid-template-columns: minmax(0, 1fr); gap: 32px; }
	.topbar-desc { display: none; }
	.topbar-inner { justify-content: space-between; }
	.menu-toggle { display: inline-grid; place-items: center; }
	.primary-nav {
		position: absolute; inset-inline: 0; inset-block-start: 100%; display: none;
		background: var(--c-surface); border-block-end: 1px solid var(--c-line); box-shadow: var(--shadow);
	}
	.primary-nav.is-open { display: block; }
	.primary-nav .menu { flex-direction: column; gap: 0; padding: 8px 20px 14px; }
	.primary-nav a { padding: 12px 4px; }
	.primary-nav a::after { display: none; }
	.primary-nav .menu-item { display: flex; flex-wrap: wrap; align-items: center; }
	.primary-nav .menu-item > a { flex: 1; }
	.sub-toggle { display: block; inline-size: 40px; block-size: 40px; background: transparent; border: 0; cursor: pointer; }
	.sub-toggle::before { content: ""; display: block; inline-size: 8px; block-size: 8px; margin: auto; border: solid var(--c-ink-2); border-width: 0 2px 2px 0; transform: rotate(45deg); }
	.primary-nav .sub-menu { position: static; display: none; inline-size: 100%; border: 0; box-shadow: none; padding: 0 14px; }
	.primary-nav .menu-item:hover > .sub-menu { display: none; }
	.primary-nav .menu-item.is-open > .sub-menu { display: block; }
	.nav-tools { margin-inline-start: auto; }
	.nav-inner { justify-content: space-between; }
	.primary-nav { order: 3; }
}
@media (max-width: 782px) { :root { --ab-h: 46px; } }
@media (max-width: 600px) {
	.admin-bar .nav-bar { inset-block-start: 0; }
	.wrap { padding-inline: 14px; }
	.card-grid, .card-grid--3, .card-grid--4 { grid-template-columns: minmax(0, 1fr); }
	.post-navigation .nav-links { grid-template-columns: minmax(0, 1fr); }
	.post-navigation .nav-next { grid-column: auto; }
	.hero-inner { padding-block: 36px 32px; }
	.brand-name { font-size: 1.4rem; }
	.brand-mark { inline-size: 46px; block-size: 46px; }
	.header-main { flex-wrap: wrap; }
	.author-box { flex-direction: column; }
	.hero-search .search-form { border-radius: var(--radius); flex-wrap: wrap; }
	.hero-search .search-submit { inline-size: 100%; }
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { transition: none !important; animation: none !important; }
}

/* ==========================================================================
   Print
   ========================================================================== */
@media print {
	.topbar, .nav-bar, .sidebar, .site-footer, .share, .comments-area, .related, .post-navigation, .to-top, .hero, .skip-link { display: none !important; }
	body { background: #fff; color: #000; }
	.layout { display: block; padding: 0; }
	.entry { border: 0; padding: 0; }
	a { color: #000; text-decoration: underline; }
	.entry-content a[href^="http"]::after { content: " (" attr(href) ")"; font-size: .8em; }
}