/*
 * Zavia News — main stylesheet.
 * Modern CSS: custom properties, grid, flexbox, fluid type, logical properties (RTL-safe).
 */

/* ---------- Tokens ---------- */
:root {
	--zn-brand: #3A0000;
	--zn-brand-dark: #2A0000;
	--zn-brand-tint: #F7EFEF;
	--zn-accent: #C8A15A;
	--zn-ink: #1A1A1A;
	--zn-muted: #5C5C5C;
	--zn-surface: #FFFFFF;
	--zn-surface-alt: #F5F4F2;
	--zn-border: #E4E1DD;
	--zn-on-brand: #FFFFFF;
	--zn-font-base: 17px;
	--zn-font-body: "Source Sans 3", -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	--zn-font-heading: "Playfair Display", Georgia, serif;
	--zn-font-urdu: "Noto Nastaliq Urdu", "Jameel Noori Nastaleeq", "Source Sans 3", serif;
	--zn-radius: 10px;
	--zn-radius-sm: 6px;
	--zn-shadow: 0 1px 3px rgb(0 0 0 / 0.07), 0 6px 18px rgb(0 0 0 / 0.06);
	--zn-shadow-lg: 0 4px 10px rgb(0 0 0 / 0.1), 0 14px 34px rgb(0 0 0 / 0.12);
	--zn-space-1: 0.25rem;
	--zn-space-2: 0.5rem;
	--zn-space-3: 1rem;
	--zn-space-4: 1.5rem;
	--zn-space-5: 2.25rem;
	--zn-space-6: 3.5rem;
	--zn-container: 1240px;
	--zn-transition: 160ms ease;
}

[data-theme="dark"] {
	--zn-ink: #ECEAE8;
	--zn-muted: #A8A4A0;
	--zn-surface: #141212;
	--zn-surface-alt: #1E1B1B;
	--zn-border: #322D2D;
	--zn-brand-tint: #241414;
	--zn-shadow: 0 1px 3px rgb(0 0 0 / 0.5), 0 6px 18px rgb(0 0 0 / 0.4);
	--zn-shadow-lg: 0 4px 10px rgb(0 0 0 / 0.55), 0 14px 34px rgb(0 0 0 / 0.5);
}

/* ---------- Reset / base ---------- */
*, *::before, *::after { box-sizing: border-box; }

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

body {
	margin: 0;
	font-family: var(--zn-font-body);
	font-size: var(--zn-font-base);
	line-height: 1.65;
	color: var(--zn-ink);
	background: var(--zn-surface);
	-webkit-font-smoothing: antialiased;
	transition: background-color var(--zn-transition), color var(--zn-transition);
}

img { max-width: 100%; height: auto; display: block; }
figure { margin: 0; }

h1, h2, h3, h4, h5, h6 {
	font-family: var(--zn-font-heading);
	line-height: 1.2;
	margin: 0 0 var(--zn-space-3);
	color: var(--zn-ink);
	text-wrap: balance;
}

a { color: var(--zn-brand); text-decoration: none; transition: color var(--zn-transition); }
a:hover, a:focus { color: var(--zn-brand-dark); text-decoration: underline; }
[data-theme="dark"] a { color: #E8B4B4; }
[data-theme="dark"] a:hover { color: #F2CFCF; }

/* Urdu content support */
:lang(ur), .urdu, [lang="ur"] {
	font-family: var(--zn-font-urdu);
	line-height: 2.1;
}

/* Accessibility */
.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	margin: -1px; padding: 0; border: 0;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}
.screen-reader-text:focus {
	position: fixed !important;
	inset-block-start: 8px; inset-inline-start: 8px;
	z-index: 10000;
	width: auto; height: auto;
	padding: 0.75rem 1.25rem;
	clip-path: none;
	background: var(--zn-surface);
	color: var(--zn-brand);
	box-shadow: var(--zn-shadow-lg);
	border-radius: var(--zn-radius-sm);
}
.skip-link:focus { outline: 2px solid var(--zn-accent); }

:focus-visible { outline: 2px solid var(--zn-accent); outline-offset: 2px; }

/* ---------- Layout primitives ---------- */
.zn-container {
	max-width: var(--zn-container);
	margin-inline: auto;
	padding-inline: var(--zn-space-3);
}

.content-with-sidebar {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--zn-space-5);
	padding-block: var(--zn-space-5);
}
@media (min-width: 1024px) {
	body.has-sidebar .content-with-sidebar { grid-template-columns: minmax(0, 1fr) 340px; }
	body.has-sidebar .content-with-sidebar:has(.sidebar-left) { grid-template-columns: 340px minmax(0, 1fr); }
	.sidebar-left { order: -1; }
}

/* Buttons */
.btn {
	display: inline-flex;
	align-items: center;
	gap: 0.5em;
	padding: 0.65em 1.4em;
	border: 2px solid transparent;
	border-radius: var(--zn-radius-sm);
	font-family: var(--zn-font-body);
	font-size: 0.95rem;
	font-weight: 700;
	line-height: 1.2;
	cursor: pointer;
	text-decoration: none !important;
	transition: background-color var(--zn-transition), color var(--zn-transition), border-color var(--zn-transition);
}
.btn-brand { background: var(--zn-brand); color: var(--zn-on-brand) !important; }
.btn-brand:hover { background: var(--zn-brand-dark); }
.btn-accent { background: var(--zn-accent); color: #2A1A00 !important; }
.btn-accent:hover { filter: brightness(1.08); }
.btn-outline { background: transparent; color: var(--zn-brand) !important; border-color: currentColor; }
.btn-outline:hover { background: var(--zn-brand); color: var(--zn-on-brand) !important; }
.btn-on-dark { color: #fff !important; }
.btn-sm { padding: 0.45em 1em; font-size: 0.85rem; }
[data-theme="dark"] .btn-outline { color: #E8B4B4 !important; }

/* ---------- Header: top bar ---------- */
.site-header { background: var(--zn-brand); color: var(--zn-on-brand); }
.site-header.is-sticky { position: sticky; inset-block-start: 0; z-index: 900; box-shadow: var(--zn-shadow); }

.top-bar {
	background: var(--zn-brand-dark);
	font-size: 0.82rem;
	border-block-end: 1px solid rgb(255 255 255 / 0.08);
}
.top-bar-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--zn-space-3);
	min-height: 36px;
	flex-wrap: wrap;
}
.top-bar-left, .top-bar-right { display: flex; align-items: center; gap: var(--zn-space-3); }
.top-date { opacity: 0.85; }
.top-weather { display: inline-flex; align-items: center; gap: 0.35em; opacity: 0.85; }
.top-nav ul { display: flex; gap: var(--zn-space-3); margin: 0; padding: 0; list-style: none; }
.top-nav a, .top-bar a { color: var(--zn-on-brand); }
.top-nav a:hover { color: var(--zn-accent); text-decoration: none; }

.social-links { display: flex; gap: 0.4rem; }
.social-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px; height: 30px;
	border-radius: 50%;
	color: inherit;
	background: rgb(255 255 255 / 0.08);
	transition: background-color var(--zn-transition), color var(--zn-transition);
}
.social-link:hover { background: var(--zn-accent); color: #2A1A00; text-decoration: none; }

/* ---------- Header: main ---------- */
.header-main-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--zn-space-3);
	min-height: 76px;
	padding-block: var(--zn-space-2);
}
.site-branding { flex: 1; display: flex; justify-content: center; }
@media (min-width: 768px) { .site-branding { justify-content: flex-start; } }
.site-logo-img, .custom-logo { max-height: 58px; width: auto; }
.site-title { font-family: var(--zn-font-heading); font-size: 1.8rem; font-weight: 800; color: var(--zn-on-brand); }
.site-title-link { text-decoration: none !important; }

.header-actions { display: flex; align-items: center; gap: 0.5rem; }
.header-actions button, .mobile-menu-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px; height: 42px;
	border: 0;
	border-radius: var(--zn-radius-sm);
	background: rgb(255 255 255 / 0.1);
	color: var(--zn-on-brand);
	cursor: pointer;
	transition: background-color var(--zn-transition);
}
.header-actions button:hover, .mobile-menu-toggle:hover { background: rgb(255 255 255 / 0.22); }

.dark-toggle .icon-moon { display: none; }
[data-theme="dark"] .dark-toggle .icon-moon { display: block; }
[data-theme="dark"] .dark-toggle .icon-sun { display: none; }

.burger { display: flex; flex-direction: column; gap: 4px; }
.burger span { width: 18px; height: 2px; background: currentColor; border-radius: 2px; }
@media (min-width: 1024px) { .mobile-menu-toggle { display: none; } }

/* ---------- Primary nav + mega menu ---------- */
.primary-nav {
	display: none;
	background: var(--zn-brand);
	border-block-start: 1px solid rgb(255 255 255 / 0.12);
}
@media (min-width: 1024px) { .primary-nav { display: block; } }

.primary-nav ul { display: flex; margin: 0; padding: 0; list-style: none; }
.primary-nav > .zn-container > ul > li { position: relative; }
.primary-nav > .zn-container > ul > li.has-mega { position: static; }
.primary-nav a {
	display: inline-block;
	padding: 0.85rem 1rem;
	color: var(--zn-on-brand);
	font-weight: 600;
	font-size: 0.95rem;
	text-decoration: none !important;
	border-block-end: 3px solid transparent;
	transition: background-color var(--zn-transition), border-color var(--zn-transition);
}
.primary-nav > .zn-container > ul > li > a:hover,
.primary-nav > .zn-container > ul > li:focus-within > a,
.primary-nav li.current-menu-item > a,
.primary-nav li.current-menu-ancestor > a {
	background: rgb(255 255 255 / 0.1);
	border-block-end-color: var(--zn-accent);
}

.submenu-toggle {
	border: 0; background: transparent; color: var(--zn-on-brand);
	padding: 0.4rem; cursor: pointer;
	transition: transform var(--zn-transition);
}
.submenu-toggle[aria-expanded="true"] { transform: rotate(180deg); }

/* Dropdown */
.primary-nav .sub-menu {
	position: absolute;
	inset-block-start: 100%;
	inset-inline-start: 0;
	min-width: 230px;
	flex-direction: column;
	background: var(--zn-surface);
	border-radius: 0 0 var(--zn-radius-sm) var(--zn-radius-sm);
	box-shadow: var(--zn-shadow-lg);
	padding-block: 0.4rem;
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	transition: opacity var(--zn-transition), transform var(--zn-transition), visibility var(--zn-transition);
	z-index: 950;
}
.primary-nav li:hover > .sub-menu,
.primary-nav li:focus-within > .sub-menu,
.primary-nav li.is-open > .sub-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.primary-nav .sub-menu a {
	display: block;
	padding: 0.55rem 1.1rem;
	color: var(--zn-ink);
	border: 0;
	font-weight: 500;
}
.primary-nav .sub-menu a:hover { background: var(--zn-brand-tint); color: var(--zn-brand); }
[data-theme="dark"] .primary-nav .sub-menu a:hover { color: #E8B4B4; }

/* Mega panel */
.mega-panel {
	position: absolute;
	inset-inline: 0;
	inset-block-start: 100%;
	display: grid;
	grid-template-columns: 240px 1fr;
	gap: var(--zn-space-4);
	background: var(--zn-surface);
	box-shadow: var(--zn-shadow-lg);
	border-radius: 0 0 var(--zn-radius) var(--zn-radius);
	padding: var(--zn-space-4);
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	transition: opacity var(--zn-transition), transform var(--zn-transition), visibility var(--zn-transition);
	z-index: 950;
}
.primary-nav li.has-mega:hover > .mega-panel,
.primary-nav li.has-mega:focus-within > .mega-panel,
.primary-nav li.has-mega.is-open > .mega-panel { opacity: 1; visibility: visible; transform: translateY(0); }
.mega-links { display: flex; flex-direction: column; gap: 0.15rem; }
.mega-links a { color: var(--zn-ink); border: 0; padding: 0.45rem 0.6rem; border-radius: var(--zn-radius-sm); font-weight: 500; }
.mega-links a:hover { background: var(--zn-brand-tint); color: var(--zn-brand); }
.mega-posts { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--zn-space-3); }
.mega-post { display: block; color: var(--zn-ink); text-decoration: none !important; }
.mega-post img { border-radius: var(--zn-radius-sm); aspect-ratio: 16 / 9; object-fit: cover; width: 100%; margin-block-end: 0.5rem; }
.mega-post-title { font-weight: 600; font-size: 0.9rem; line-height: 1.35; display: block; }
.mega-post:hover .mega-post-title { color: var(--zn-brand); }
[data-theme="dark"] .mega-post:hover .mega-post-title { color: #E8B4B4; }

/* ---------- Breaking news ticker ---------- */
.breaking-bar {
	background: var(--zn-surface);
	border-block-end: 1px solid var(--zn-border);
	color: var(--zn-ink);
}
.breaking-inner { display: flex; align-items: center; gap: var(--zn-space-3); min-height: 44px; }
.breaking-label {
	display: inline-flex;
	align-items: center;
	gap: 0.45em;
	background: var(--zn-brand);
	color: var(--zn-on-brand);
	font-size: 0.78rem;
	font-weight: 800;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	padding: 0.3em 0.9em;
	border-radius: 999px;
	flex-shrink: 0;
}
.breaking-dot {
	width: 7px; height: 7px;
	background: #FF5A5A;
	border-radius: 50%;
	animation: zn-pulse 1.4s infinite;
}
@keyframes zn-pulse { 50% { opacity: 0.35; } }

.ticker { flex: 1; overflow: hidden; position: relative; min-width: 0; }
.ticker-track { display: flex; margin: 0; padding: 0; list-style: none; transition: transform 400ms ease; }
.ticker-item { flex: 0 0 100%; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: 600; font-size: 0.95rem; }
.ticker-item a { color: var(--zn-ink); }
.ticker-item a:hover { color: var(--zn-brand); text-decoration: none; }
[data-theme="dark"] .ticker-item a:hover { color: #E8B4B4; }
.ticker-controls { display: flex; gap: 0.25rem; flex-shrink: 0; }
.ticker-controls button {
	width: 28px; height: 28px;
	border: 1px solid var(--zn-border);
	background: var(--zn-surface);
	color: var(--zn-ink);
	border-radius: var(--zn-radius-sm);
	cursor: pointer;
	font-size: 1rem;
	line-height: 1;
}
.ticker-controls button:hover { background: var(--zn-brand); color: var(--zn-on-brand); border-color: var(--zn-brand); }

/* ---------- Search overlay ---------- */
.search-overlay {
	position: fixed;
	inset: 0;
	z-index: 1100;
	background: rgb(20 8 8 / 0.92);
	backdrop-filter: blur(4px);
	display: grid;
	place-items: start center;
	padding: min(18vh, 160px) var(--zn-space-3) var(--zn-space-4);
	overflow-y: auto;
}
.search-overlay[hidden] { display: none; }
.search-overlay-inner { width: min(680px, 100%); position: relative; }
.search-close {
	position: absolute;
	inset-block-start: -3.2rem;
	inset-inline-end: 0;
	width: 44px; height: 44px;
	border: 0; border-radius: 50%;
	background: rgb(255 255 255 / 0.14);
	color: #fff;
	font-size: 1.6rem;
	cursor: pointer;
}
.search-form { display: flex; }
.search-field {
	flex: 1;
	min-width: 0;
	padding: 0.9rem 1.1rem;
	font-size: 1.05rem;
	border: 2px solid var(--zn-border);
	border-inline-end: 0;
	border-radius: var(--zn-radius-sm) 0 0 var(--zn-radius-sm);
	background: var(--zn-surface);
	color: var(--zn-ink);
}
[dir="rtl"] .search-field { border-radius: 0 var(--zn-radius-sm) var(--zn-radius-sm) 0; }
.search-field:focus { outline: none; border-color: var(--zn-accent); }
.search-submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding-inline: 1.2rem;
	border: 0;
	background: var(--zn-brand);
	color: var(--zn-on-brand);
	border-radius: 0 var(--zn-radius-sm) var(--zn-radius-sm) 0;
	cursor: pointer;
}
[dir="rtl"] .search-submit { border-radius: var(--zn-radius-sm) 0 0 var(--zn-radius-sm); }
.search-submit:hover { background: var(--zn-brand-dark); }

.live-results {
	margin-block-start: 0.75rem;
	background: var(--zn-surface);
	border-radius: var(--zn-radius-sm);
	box-shadow: var(--zn-shadow-lg);
	overflow: hidden;
}
.live-results:empty { display: none; }
.live-result {
	display: flex;
	align-items: center;
	gap: 0.85rem;
	padding: 0.7rem 0.9rem;
	color: var(--zn-ink);
	text-decoration: none !important;
	border-block-end: 1px solid var(--zn-border);
}
.live-result:last-child { border-block-end: 0; }
.live-result:hover, .live-result.is-active { background: var(--zn-brand-tint); }
.live-result img { width: 52px; height: 52px; object-fit: cover; border-radius: var(--zn-radius-sm); flex-shrink: 0; }
.live-result-title { font-weight: 600; font-size: 0.95rem; line-height: 1.35; }
.live-result-meta { font-size: 0.78rem; color: var(--zn-muted); display: flex; gap: 0.6em; }
.live-result-meta .cat { color: var(--zn-brand); font-weight: 700; }
.live-status { padding: 0.8rem 1rem; color: var(--zn-muted); font-size: 0.9rem; }

/* ---------- Mobile off-canvas menu ---------- */
.mobile-menu {
	position: fixed;
	inset-block: 0;
	inset-inline-start: 0;
	width: min(320px, 86vw);
	z-index: 1200;
	background: var(--zn-surface);
	box-shadow: var(--zn-shadow-lg);
	transform: translateX(-102%);
	transition: transform 240ms ease;
	overflow-y: auto;
	padding: var(--zn-space-3);
	visibility: hidden;
}
[dir="rtl"] .mobile-menu { transform: translateX(102%); }
.mobile-menu.is-open { transform: translateX(0); visibility: visible; }
.mobile-menu[hidden] { display: none; }
.mobile-menu-backdrop {
	position: fixed; inset: 0; z-index: 1150;
	background: rgb(0 0 0 / 0.5);
}
.mobile-menu-backdrop[hidden] { display: none; }
.mobile-menu-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-block-end: var(--zn-space-2);
	border-block-end: 2px solid var(--zn-brand);
	margin-block-end: var(--zn-space-2);
}
.mobile-menu-title { font-family: var(--zn-font-heading); font-weight: 800; font-size: 1.2rem; color: var(--zn-brand); }
[data-theme="dark"] .mobile-menu-title { color: #E8B4B4; }
.mobile-menu-close { border: 0; background: transparent; color: var(--zn-ink); font-size: 1.7rem; cursor: pointer; line-height: 1; }
.mobile-menu ul { list-style: none; margin: 0; padding: 0; }
.mobile-menu li { border-block-end: 1px solid var(--zn-border); position: relative; }
.mobile-menu a { display: block; padding: 0.8rem 0.25rem; color: var(--zn-ink); font-weight: 600; text-decoration: none !important; }
.mobile-menu a:hover { color: var(--zn-brand); }
.mobile-menu .sub-menu { display: none; padding-inline-start: 1rem; }
.mobile-menu li.is-open > .sub-menu { display: block; }
.mobile-menu .submenu-toggle {
	position: absolute;
	inset-block-start: 0.35rem;
	inset-inline-end: 0;
	width: 38px; height: 38px;
	border: 1px solid var(--zn-border);
	border-radius: var(--zn-radius-sm);
	background: transparent;
	color: var(--zn-ink);
	cursor: pointer;
}
.mobile-menu li.is-open > .submenu-toggle { transform: rotate(180deg); }
.mobile-social { margin-block-start: var(--zn-space-3); }
.mobile-social .social-link { background: var(--zn-brand-tint); color: var(--zn-brand); }

/* ---------- Hero ---------- */
.hero { padding-block: var(--zn-space-4); background: var(--zn-surface-alt); }
.hero-grid { display: grid; gap: var(--zn-space-4); }
@media (min-width: 1024px) { .hero-grid { grid-template-columns: 2fr 1fr; } }

.hero-lead { background: var(--zn-surface); border-radius: var(--zn-radius); overflow: hidden; box-shadow: var(--zn-shadow); }
.hero-media { display: block; }
.hero-media img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; transition: transform 300ms ease; }
.hero-lead:hover .hero-media img { transform: scale(1.02); }
.hero-lead-body { padding: var(--zn-space-4); }
.hero-lead-title { font-size: clamp(1.5rem, 1.1rem + 1.8vw, 2.3rem); margin-block: 0.6rem 0.5rem; }
.hero-lead-title a { color: var(--zn-ink); text-decoration: none !important; }
.hero-lead-title a:hover { color: var(--zn-brand); }
[data-theme="dark"] .hero-lead-title a:hover { color: #E8B4B4; }
.hero-lead-excerpt { color: var(--zn-muted); margin-block: 0 0.75rem; }

.hero-secondary { display: grid; gap: var(--zn-space-3); align-content: start; }
.hero-item {
	display: grid;
	grid-template-columns: 110px 1fr;
	gap: var(--zn-space-3);
	background: var(--zn-surface);
	border-radius: var(--zn-radius);
	overflow: hidden;
	box-shadow: var(--zn-shadow);
	padding: var(--zn-space-2);
}
.hero-item-media img, .hero-item-media .thumb-placeholder { width: 110px; height: 78px; object-fit: cover; border-radius: var(--zn-radius-sm); }
.hero-item-title { font-size: 1rem; margin: 0.25rem 0 0.35rem; font-family: var(--zn-font-body); font-weight: 700; }
.hero-item-title a { color: var(--zn-ink); text-decoration: none !important; }
.hero-item-title a:hover { color: var(--zn-brand); }
.hero-item-date { font-size: 0.78rem; color: var(--zn-muted); }

/* ---------- Cards ---------- */
.card-grid { display: grid; gap: var(--zn-space-4); }
@media (min-width: 640px) {
	.card-grid-2, .card-grid-3, .card-grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1024px) {
	.card-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.card-grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

.news-card, .compact-card {
	background: var(--zn-surface);
	border: 1px solid var(--zn-border);
	border-radius: var(--zn-radius);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: box-shadow var(--zn-transition), transform var(--zn-transition);
}
.news-card:hover, .compact-card:hover { box-shadow: var(--zn-shadow-lg); transform: translateY(-2px); }

.card-media { display: block; overflow: hidden; }
.card-media img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; transition: transform 300ms ease; }
.news-card:hover .card-media img, .compact-card:hover .card-media img { transform: scale(1.04); }

.thumb-placeholder {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	background: linear-gradient(135deg, var(--zn-brand-tint), var(--zn-surface-alt));
	position: relative;
}
.thumb-placeholder::after {
	content: "";
	position: absolute; inset: 0;
	margin: auto;
	width: 34px; height: 34px;
	border: 3px solid var(--zn-brand);
	opacity: 0.25;
	border-radius: 50%;
}

.card-body { padding: var(--zn-space-3); display: flex; flex-direction: column; gap: 0.5rem; flex: 1; }
.card-title { font-family: var(--zn-font-body); font-weight: 700; font-size: 1.05rem; line-height: 1.35; margin: 0; }
.card-title-lg { font-family: var(--zn-font-heading); font-size: 1.4rem; }
.card-title-sm { font-size: 0.95rem; }
.card-title a { color: var(--zn-ink); text-decoration: none !important; }
.card-title a:hover { color: var(--zn-brand); }
[data-theme="dark"] .card-title a:hover { color: #E8B4B4; }
.card-excerpt { color: var(--zn-muted); font-size: 0.92rem; margin: 0; }
.card-date { font-size: 0.78rem; color: var(--zn-muted); }

.cat-badge {
	display: inline-block;
	align-self: flex-start;
	background: var(--zn-brand);
	color: var(--zn-on-brand) !important;
	font-size: 0.72rem;
	font-weight: 800;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	padding: 0.25em 0.8em;
	border-radius: 999px;
	text-decoration: none !important;
	transition: background-color var(--zn-transition);
}
.cat-badge:hover { background: var(--zn-brand-dark); }

.post-meta { display: flex; flex-wrap: wrap; gap: 0.35rem 0.9rem; font-size: 0.82rem; color: var(--zn-muted); margin-block-start: auto; }
.post-meta a { color: var(--zn-brand); font-weight: 700; }
.meta-reading::before, .meta-date + .meta-reading::before { content: "•"; margin-inline-end: 0.9rem; opacity: 0.5; }

/* List card */
.list-stack { display: grid; gap: var(--zn-space-3); }
.list-card {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--zn-space-3);
	background: var(--zn-surface);
	border: 1px solid var(--zn-border);
	border-radius: var(--zn-radius);
	padding: var(--zn-space-3);
	transition: box-shadow var(--zn-transition);
}
.list-card:hover { box-shadow: var(--zn-shadow-lg); }
@media (min-width: 640px) { .list-card { grid-template-columns: 220px 1fr; } }
.list-media img, .list-media .thumb-placeholder { border-radius: var(--zn-radius-sm); aspect-ratio: 16 / 9; object-fit: cover; }

/* Mini card (sidebar) */
.mini-list { display: grid; gap: var(--zn-space-3); }
.mini-card { display: grid; grid-template-columns: 64px 1fr; gap: 0.8rem; align-items: start; }
.mini-media img, .mini-media .thumb-placeholder { width: 64px; height: 64px; object-fit: cover; border-radius: var(--zn-radius-sm); aspect-ratio: 1; }
.mini-title { font-family: var(--zn-font-body); font-size: 0.92rem; font-weight: 600; line-height: 1.35; margin: 0 0 0.25rem; }
.mini-title a { color: var(--zn-ink); text-decoration: none !important; }
.mini-title a:hover { color: var(--zn-brand); }
.mini-card time { font-size: 0.75rem; color: var(--zn-muted); }

/* ---------- Homepage sections ---------- */
.home-section { margin-block-end: var(--zn-space-6); }
.home-columns { padding-block-start: var(--zn-space-5); }

.section-heading {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--zn-space-3);
	border-block-end: 3px solid var(--zn-brand);
	margin-block-end: var(--zn-space-4);
}
.section-title {
	font-size: 1.35rem;
	margin: 0;
}
.section-title span {
	display: inline-block;
	background: var(--zn-brand);
	color: var(--zn-on-brand);
	padding: 0.35em 1em;
	border-radius: var(--zn-radius-sm) var(--zn-radius-sm) 0 0;
}
.section-more { font-weight: 700; font-size: 0.88rem; white-space: nowrap; }

.category-block.is-alt .section-title span { background: var(--zn-brand-dark); }
.category-block-grid { display: grid; gap: var(--zn-space-4); }
@media (min-width: 768px) { .category-block-grid { grid-template-columns: 1.2fr 1fr; } }
.block-featured .card-media img { border-radius: var(--zn-radius); }
.block-featured .card-body { padding: var(--zn-space-3) 0; }
.block-list { display: grid; align-content: start; }
.block-list-item { padding-block: 0.8rem; border-block-end: 1px solid var(--zn-border); }
.block-list-item:first-child { padding-block-start: 0; }
.block-list-title { font-family: var(--zn-font-body); font-size: 1rem; font-weight: 600; margin: 0 0 0.25rem; line-height: 1.4; }
.block-list-title a { color: var(--zn-ink); text-decoration: none !important; }
.block-list-title a:hover { color: var(--zn-brand); }
[data-theme="dark"] .block-list-title a:hover { color: #E8B4B4; }
.block-list-item time { font-size: 0.78rem; color: var(--zn-muted); }

/* ---------- Sidebar / widgets ---------- */
.sidebar { display: grid; gap: var(--zn-space-4); align-content: start; }
.widget {
	background: var(--zn-surface);
	border: 1px solid var(--zn-border);
	border-radius: var(--zn-radius);
	padding: var(--zn-space-3);
}
.widget-title {
	font-size: 1.05rem;
	margin: 0 0 var(--zn-space-3);
	padding-block-end: 0.5rem;
	border-block-end: 3px solid var(--zn-brand);
}
.widget-title span { color: var(--zn-brand); }
[data-theme="dark"] .widget-title span { color: #E8B4B4; }
.widget ul { margin: 0; padding: 0; list-style: none; }
.widget ul li { padding-block: 0.45rem; border-block-end: 1px solid var(--zn-border); }
.widget ul li:last-child { border-block-end: 0; }

.ranked-list { margin: 0; padding: 0; list-style: none; counter-reset: rank; }
.ranked-list li { counter-increment: rank; display: flex; gap: 0.9rem; padding-block: 0.7rem; border-block-end: 1px solid var(--zn-border); }
.ranked-list li:last-child { border-block-end: 0; }
.ranked-list li::before {
	content: counter(rank, decimal-leading-zero);
	font-family: var(--zn-font-heading);
	font-size: 1.5rem;
	font-weight: 800;
	color: var(--zn-brand);
	opacity: 0.45;
	line-height: 1;
}
.ranked-list a { color: var(--zn-ink); text-decoration: none !important; display: block; }
.ranked-list a:hover .ranked-title { color: var(--zn-brand); }
[data-theme="dark"] .ranked-list a:hover .ranked-title { color: #E8B4B4; }
.ranked-title { display: block; font-weight: 600; font-size: 0.92rem; line-height: 1.4; }
.ranked-list time { font-size: 0.75rem; color: var(--zn-muted); }

/* Ads */
.ad-slot {
	display: grid;
	justify-items: center;
	gap: 0.4rem;
	padding: var(--zn-space-3);
	margin-block: var(--zn-space-3);
	background: var(--zn-surface-alt);
	border: 1px dashed var(--zn-border);
	border-radius: var(--zn-radius);
	text-align: center;
}
.ad-slot-label {
	font-size: 0.68rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--zn-muted);
}

/* Newsletter */
.newsletter-box {
	background: linear-gradient(140deg, var(--zn-brand), var(--zn-brand-dark));
	color: #fff;
	border-radius: var(--zn-radius);
	padding: var(--zn-space-4);
}
.newsletter-title { color: #fff; font-size: 1.25rem; margin-block-end: 0.4rem; }
.newsletter-text { margin: 0 0 var(--zn-space-3); opacity: 0.85; font-size: 0.92rem; }
.newsletter-form { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.newsletter-form input[type="email"] {
	flex: 1;
	min-width: 180px;
	padding: 0.65rem 0.9rem;
	border: 0;
	border-radius: var(--zn-radius-sm);
	font-size: 0.95rem;
}

/* ---------- Single article ---------- */
.single-article { background: var(--zn-surface); }
.article-header { margin-block-end: var(--zn-space-4); }
.article-title { font-size: clamp(1.8rem, 1.3rem + 2.4vw, 2.9rem); margin-block: 0.6rem 0.4rem; }
.article-subtitle { font-size: 1.15rem; color: var(--zn-muted); margin-block: 0 var(--zn-space-3); line-height: 1.55; }

.article-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--zn-space-3);
	padding-block: var(--zn-space-3);
	border-block: 1px solid var(--zn-border);
}
.article-byline { display: flex; align-items: center; gap: 0.8rem; }
.byline-avatar { border-radius: 50%; }
.byline-author { font-weight: 700; color: var(--zn-brand); }
.byline-dates { display: flex; flex-wrap: wrap; gap: 0.3rem 1rem; font-size: 0.82rem; color: var(--zn-muted); }

.article-featured { margin-block-end: var(--zn-space-4); }
.article-featured img { border-radius: var(--zn-radius); width: 100%; }
.article-featured figcaption { font-size: 0.82rem; color: var(--zn-muted); padding-block-start: 0.5rem; }

.article-toc {
	background: var(--zn-surface-alt);
	border-inline-start: 4px solid var(--zn-brand);
	border-radius: var(--zn-radius-sm);
	padding: var(--zn-space-3) var(--zn-space-4);
	margin-block-end: var(--zn-space-4);
}
.toc-title { font-size: 1rem; margin-block-end: 0.5rem; }
.toc-list { margin: 0; padding-inline-start: 1.2rem; }
.toc-list a { font-weight: 600; font-size: 0.92rem; }

.entry-content { font-size: 1.06rem; }
.entry-content > * { margin-block: 0 1.25em; }
.entry-content h2 { font-size: 1.6rem; margin-block-start: 1.6em; }
.entry-content h3 { font-size: 1.3rem; margin-block-start: 1.4em; }
.entry-content img { border-radius: var(--zn-radius-sm); }
.entry-content blockquote {
	margin-inline: 0;
	padding: var(--zn-space-3) var(--zn-space-4);
	background: var(--zn-brand-tint);
	border-inline-start: 4px solid var(--zn-brand);
	border-radius: var(--zn-radius-sm);
	font-family: var(--zn-font-heading);
	font-size: 1.15rem;
}
.entry-content a { text-decoration: underline; text-underline-offset: 2px; }
.entry-content .wp-caption-text, .entry-content figcaption { font-size: 0.82rem; color: var(--zn-muted); }

/* Share */
.share-buttons { display: flex; gap: 0.45rem; }
.share-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px; height: 38px;
	border-radius: 50%;
	border: 1px solid var(--zn-border);
	background: var(--zn-surface);
	color: var(--zn-ink);
	cursor: pointer;
	transition: background-color var(--zn-transition), color var(--zn-transition), border-color var(--zn-transition);
	text-decoration: none !important;
}
.share-btn:hover { background: var(--zn-brand); border-color: var(--zn-brand); color: var(--zn-on-brand); }
.share-icon { width: 16px; height: 16px; display: block; background: currentColor; }
.share-icon-facebook { clip-path: polygon(65% 0, 40% 0, 33% 8%, 33% 35%, 18% 35%, 18% 55%, 33% 55%, 33% 100%, 55% 100%, 55% 55%, 70% 55%, 74% 35%, 55% 35%, 55% 15%, 65% 15%); }
.share-icon-twitter { clip-path: polygon(0 0, 22% 0, 50% 38%, 78% 0, 95% 0, 60% 48%, 100% 100%, 78% 100%, 48% 60%, 20% 100%, 3% 100%, 40% 50%); }
.share-icon-whatsapp { clip-path: circle(48%); background: transparent; border: 2px solid currentColor; border-radius: 50%; position: relative; }
.share-icon-email { clip-path: polygon(0 15%, 100% 15%, 100% 85%, 0 85%, 0 25%, 50% 60%, 100% 25%, 100% 15%, 0 15%); }
.share-icon-link { clip-path: polygon(38% 20%, 62% 20%, 62% 34%, 38% 34%, 38% 66%, 62% 66%, 62% 80%, 38% 80%, 30% 70%, 30% 30%); background: transparent; border: 2px solid currentColor; border-radius: 6px; transform: rotate(-45deg); width: 12px; height: 18px; }
.share-btn.is-copied { background: #1d7a3d; border-color: #1d7a3d; color: #fff; }

.article-share-bottom {
	display: flex;
	align-items: center;
	gap: var(--zn-space-3);
	padding-block: var(--zn-space-3);
	border-block-start: 1px solid var(--zn-border);
	margin-block-start: var(--zn-space-4);
}
.share-label { font-weight: 700; }

.sticky-share {
	position: fixed;
	inset-block-start: 40%;
	inset-inline-start: max(0.5rem, calc((100vw - var(--zn-container)) / 2 - 64px));
	z-index: 800;
	opacity: 0;
	visibility: hidden;
	transition: opacity var(--zn-transition), visibility var(--zn-transition);
}
.sticky-share.is-visible { opacity: 1; visibility: visible; }
.share-vertical { flex-direction: column; }
@media (max-width: 1420px) { .sticky-share { display: none; } }

/* Tags */
.article-tags {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem;
	margin-block-start: var(--zn-space-4);
}
.tags-label { font-weight: 700; }
.tag-link {
	background: var(--zn-surface-alt);
	border: 1px solid var(--zn-border);
	color: var(--zn-ink);
	padding: 0.25em 0.9em;
	border-radius: 999px;
	font-size: 0.85rem;
	text-decoration: none !important;
}
.tag-link:hover { background: var(--zn-brand); border-color: var(--zn-brand); color: var(--zn-on-brand); }

/* Post nav */
.post-nav {
	display: grid;
	gap: var(--zn-space-3);
	margin-block: var(--zn-space-5);
}
@media (min-width: 640px) { .post-nav { grid-template-columns: 1fr 1fr; } }
.post-nav-item {
	display: block;
	background: var(--zn-surface-alt);
	border: 1px solid var(--zn-border);
	border-radius: var(--zn-radius);
	padding: var(--zn-space-3);
	text-decoration: none !important;
	transition: border-color var(--zn-transition), box-shadow var(--zn-transition);
}
.post-nav-item:hover { border-color: var(--zn-brand); box-shadow: var(--zn-shadow); }
.post-nav-next { text-align: end; }
.post-nav-label { display: block; font-size: 0.78rem; font-weight: 800; text-transform: uppercase; letter-spacing: 0.06em; color: var(--zn-brand); margin-block-end: 0.4rem; }
[data-theme="dark"] .post-nav-label { color: #E8B4B4; }
.post-nav-title { color: var(--zn-ink); font-weight: 600; line-height: 1.4; }

/* Author box */
.author-box {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: var(--zn-space-4);
	background: var(--zn-surface-alt);
	border-radius: var(--zn-radius);
	padding: var(--zn-space-4);
	margin-block: var(--zn-space-5);
}
.author-box-avatar { border-radius: 50%; }
.author-box-label { font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--zn-muted); }
.author-box-name { margin-block: 0.2rem 0.5rem; font-size: 1.3rem; }
.author-box-bio { color: var(--zn-muted); margin-block: 0 0.8rem; }
.author-box-links { display: flex; gap: 0.5rem; flex-wrap: wrap; }
@media (max-width: 480px) { .author-box { grid-template-columns: 1fr; justify-items: start; } }

.related-posts { margin-block: var(--zn-space-5); }
.article-newsletter { margin-block: var(--zn-space-5); }

/* ---------- Comments ---------- */
.comments-area { margin-block-start: var(--zn-space-5); }
.comments-title { font-size: 1.4rem; border-block-end: 3px solid var(--zn-brand); padding-block-end: 0.5rem; }
.comment-list { list-style: none; margin: 0; padding: 0; }
.comment-list .comment { padding-block: var(--zn-space-3); border-block-end: 1px solid var(--zn-border); }
.comment-list .children { list-style: none; padding-inline-start: var(--zn-space-4); }
.comment-author { display: flex; align-items: center; gap: 0.6rem; font-weight: 700; }
.comment-author .avatar { border-radius: 50%; }
.comment-metadata { font-size: 0.78rem; }
.comment-metadata a { color: var(--zn-muted); }
.comment-content { font-size: 0.97rem; }
.reply a {
	font-size: 0.82rem;
	font-weight: 700;
	background: var(--zn-brand-tint);
	padding: 0.2em 0.9em;
	border-radius: 999px;
	text-decoration: none !important;
}
.comment-form label { display: block; font-weight: 600; margin-block-end: 0.3rem; }
.comment-form input:not([type="checkbox"]):not([type="submit"]),
.comment-form textarea {
	width: 100%;
	padding: 0.65rem 0.85rem;
	border: 1px solid var(--zn-border);
	border-radius: var(--zn-radius-sm);
	background: var(--zn-surface);
	color: var(--zn-ink);
	font-family: inherit;
	font-size: 0.97rem;
}
.comment-form input:focus, .comment-form textarea:focus { outline: none; border-color: var(--zn-brand); }

/* ---------- Archive / category / author / search ---------- */
.page-header { margin-block: var(--zn-space-4); }
.page-title { font-size: clamp(1.6rem, 1.2rem + 1.8vw, 2.4rem); }
.archive-description { color: var(--zn-muted); }

.category-banner {
	background: linear-gradient(140deg, var(--zn-brand), var(--zn-brand-dark));
	color: #fff;
	padding-block: var(--zn-space-5);
}
.category-banner .breadcrumbs, .category-banner .breadcrumbs a { color: rgb(255 255 255 / 0.75); }
.category-banner-title { color: #fff; font-size: clamp(1.8rem, 1.3rem + 2.2vw, 2.8rem); margin-block: 0.4rem 0.3rem; }
.category-banner-desc { opacity: 0.85; max-width: 640px; }
.category-banner-count {
	display: inline-block;
	background: rgb(255 255 255 / 0.14);
	padding: 0.25em 1em;
	border-radius: 999px;
	font-size: 0.82rem;
	font-weight: 700;
}
.category-featured { grid-column: 1 / -1; }
@media (min-width: 768px) {
	.category-featured { display: grid; grid-template-columns: 1.4fr 1fr; }
	.category-featured .card-media img { height: 100%; aspect-ratio: auto; }
}

.author-hero { background: linear-gradient(140deg, var(--zn-brand), var(--zn-brand-dark)); color: #fff; padding-block: var(--zn-space-5); }
.author-hero-inner { display: flex; gap: var(--zn-space-4); align-items: center; flex-wrap: wrap; }
.author-hero-avatar { border-radius: 50%; border: 4px solid rgb(255 255 255 / 0.25); }
.author-hero-label { text-transform: uppercase; letter-spacing: 0.1em; font-size: 0.78rem; opacity: 0.8; }
.author-hero-name { color: #fff; margin-block: 0.2rem 0.5rem; }
.author-hero-bio { max-width: 640px; opacity: 0.9; margin-block: 0 0.8rem; }
.author-hero-links { display: flex; align-items: center; gap: var(--zn-space-3); }
.author-hero-count { font-size: 0.88rem; opacity: 0.85; }

.search-header .search-query { color: var(--zn-brand); }
[data-theme="dark"] .search-header .search-query { color: #E8B4B4; }
.search-count { color: var(--zn-muted); }
.search-filters {
	display: flex;
	flex-wrap: wrap;
	align-items: end;
	gap: var(--zn-space-3);
	background: var(--zn-surface-alt);
	border: 1px solid var(--zn-border);
	border-radius: var(--zn-radius);
	padding: var(--zn-space-3);
}
.search-filters label { display: grid; gap: 0.3rem; }
.filter-label { font-size: 0.8rem; font-weight: 700; }
.search-filters select {
	padding: 0.5rem 0.7rem;
	border: 1px solid var(--zn-border);
	border-radius: var(--zn-radius-sm);
	background: var(--zn-surface);
	color: var(--zn-ink);
	font-family: inherit;
}

.archive-browse { margin-block-start: var(--zn-space-5); }
.archive-browse-cols { display: grid; gap: var(--zn-space-4); }
@media (min-width: 640px) { .archive-browse-cols { grid-template-columns: 1fr 1fr; } }
.archive-browse ul { list-style: none; margin: 0; padding: 0; }
.archive-browse li { padding-block: 0.35rem; border-block-end: 1px solid var(--zn-border); }

/* Breadcrumbs */
.breadcrumbs { font-size: 0.82rem; margin-block: var(--zn-space-3) 0; }
.breadcrumbs ol { display: flex; flex-wrap: wrap; gap: 0.5rem; list-style: none; margin: 0; padding: 0; }
.breadcrumbs li:not(:last-child)::after { content: "›"; margin-inline-start: 0.5rem; color: var(--zn-muted); }
[dir="rtl"] .breadcrumbs li:not(:last-child)::after { content: "‹"; }
.breadcrumbs [aria-current] span { color: var(--zn-muted); }

/* Pagination */
.zn-pagination, .pagination { margin-block: var(--zn-space-5); }
.zn-pagination .nav-links, .pagination .nav-links { display: flex; flex-wrap: wrap; gap: 0.4rem; justify-content: center; }
.page-numbers {
	display: inline-flex;
	align-items: center;
	min-width: 40px; min-height: 40px;
	justify-content: center;
	padding-inline: 0.7rem;
	border: 1px solid var(--zn-border);
	border-radius: var(--zn-radius-sm);
	color: var(--zn-ink);
	font-weight: 700;
	text-decoration: none !important;
	transition: background-color var(--zn-transition), color var(--zn-transition);
}
.page-numbers.current { background: var(--zn-brand); border-color: var(--zn-brand); color: var(--zn-on-brand); }
a.page-numbers:hover { background: var(--zn-brand-tint); color: var(--zn-brand); }

/* ---------- About page ---------- */
.about-hero { background: linear-gradient(140deg, var(--zn-brand), var(--zn-brand-dark)); color: #fff; padding-block: var(--zn-space-5); }
.about-hero .breadcrumbs, .about-hero .breadcrumbs a { color: rgb(255 255 255 / 0.75); }
.about-title { color: #fff; font-size: clamp(2rem, 1.4rem + 2.6vw, 3rem); margin-block: 0.3rem; }
.about-tagline { font-size: 1.1rem; opacity: 0.85; }
.about-intro { padding-block: var(--zn-space-5); max-width: 760px; }
.about-pillars { display: grid; gap: var(--zn-space-4); padding-block: var(--zn-space-4); }
@media (min-width: 768px) { .about-pillars { grid-template-columns: 1fr 1fr; } }
.about-pillar {
	background: var(--zn-surface-alt);
	border-block-start: 4px solid var(--zn-brand);
	border-radius: var(--zn-radius);
	padding: var(--zn-space-4);
}
.pillar-icon { color: var(--zn-brand); display: inline-block; margin-block-end: 0.6rem; }
[data-theme="dark"] .pillar-icon { color: #E8B4B4; }
.about-team { padding-block: var(--zn-space-5); }
.team-grid { display: grid; gap: var(--zn-space-4); grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }
.team-card {
	text-align: center;
	background: var(--zn-surface);
	border: 1px solid var(--zn-border);
	border-radius: var(--zn-radius);
	padding: var(--zn-space-4);
}
.team-avatar { border-radius: 50%; margin-inline: auto; margin-block-end: 0.8rem; }
.team-name { font-size: 1.05rem; margin-block-end: 0.3rem; }
.team-name a { color: var(--zn-ink); text-decoration: none !important; }
.team-name a:hover { color: var(--zn-brand); }
.team-bio { font-size: 0.85rem; color: var(--zn-muted); margin: 0; }

/* ---------- Contact page ---------- */
.contact-columns { display: grid; gap: var(--zn-space-5); padding-block: var(--zn-space-4) var(--zn-space-6); }
@media (min-width: 900px) { .contact-columns { grid-template-columns: 1.4fr 1fr; } }
.contact-form p { margin-block: 0 var(--zn-space-3); }
.form-row { display: grid; gap: 0 var(--zn-space-3); }
@media (min-width: 640px) { .form-row { grid-template-columns: 1fr 1fr; } }
.contact-form label { display: block; font-weight: 700; margin-block-end: 0.3rem; }
.contact-form .req { color: #C0392B; }
.contact-form input, .contact-form textarea {
	width: 100%;
	padding: 0.7rem 0.9rem;
	border: 1px solid var(--zn-border);
	border-radius: var(--zn-radius-sm);
	background: var(--zn-surface);
	color: var(--zn-ink);
	font-family: inherit;
	font-size: 0.97rem;
}
.contact-form input:focus, .contact-form textarea:focus { outline: none; border-color: var(--zn-brand); }
.zn-honeypot { position: absolute !important; inset-inline-start: -9999px; }
.form-notice { padding: var(--zn-space-3); border-radius: var(--zn-radius-sm); margin-block-end: var(--zn-space-3); font-weight: 600; }
.form-success { background: #E4F4E8; color: #1d6b35; border: 1px solid #b7dfc3; }
.form-error { background: #FBE9E7; color: #a02c1d; border: 1px solid #eec3bd; }
[data-theme="dark"] .form-success { background: #14301c; color: #8fd8a5; border-color: #245c34; }
[data-theme="dark"] .form-error { background: #391512; color: #f0a89e; border-color: #6b2620; }

.contact-info-title { font-size: 1.2rem; border-block-end: 3px solid var(--zn-brand); padding-block-end: 0.4rem; }
.contact-info-list { list-style: none; margin: 0 0 var(--zn-space-3); padding: 0; display: grid; gap: var(--zn-space-3); }
.contact-info-label { display: block; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--zn-muted); }
.contact-social .social-link { background: var(--zn-brand-tint); color: var(--zn-brand); }
.map-placeholder {
	position: relative;
	margin-block-start: var(--zn-space-4);
	color: var(--zn-brand);
	border-radius: var(--zn-radius);
	overflow: hidden;
}
.map-placeholder-text {
	position: absolute;
	inset-block-end: 0.6rem;
	inset-inline: 0;
	text-align: center;
	font-size: 0.78rem;
	color: var(--zn-muted);
}

/* ---------- 404 ---------- */
.error-404-page { padding-block: var(--zn-space-6); }
.error-hero { text-align: center; max-width: 620px; margin-inline: auto; margin-block-end: var(--zn-space-6); }
.error-illustration { color: var(--zn-brand); max-width: 100%; height: auto; margin-inline: auto; }
[data-theme="dark"] .error-illustration { color: #E8B4B4; }
.error-title { font-size: clamp(1.8rem, 1.4rem + 2vw, 2.6rem); margin-block: var(--zn-space-3) 0.5rem; }
.error-text { color: var(--zn-muted); }
.error-search { max-width: 420px; margin-inline: auto; margin-block: var(--zn-space-4); }

/* ---------- No results ---------- */
.no-results { text-align: center; padding-block: var(--zn-space-6); max-width: 480px; margin-inline: auto; }
.no-results .search-form { margin-block-start: var(--zn-space-3); }

/* ---------- Footer ---------- */
.site-footer {
	background: var(--zn-brand-dark);
	color: rgb(255 255 255 / 0.85);
	padding-block: var(--zn-space-6) var(--zn-space-4);
	margin-block-start: var(--zn-space-6);
}
.site-footer a { color: rgb(255 255 255 / 0.85); }
.site-footer a:hover { color: var(--zn-accent); text-decoration: none; }
.footer-grid {
	display: grid;
	gap: var(--zn-space-5);
	grid-template-columns: 1fr;
	padding-block-end: var(--zn-space-5);
	border-block-end: 1px solid rgb(255 255 255 / 0.12);
}
@media (min-width: 640px) { .footer-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .footer-grid { grid-template-columns: 2fr 1fr 1fr 1.4fr; } }
.footer-logo, .footer-about .custom-logo { max-height: 52px; width: auto; margin-block-end: var(--zn-space-3); }
.footer-site-title { font-family: var(--zn-font-heading); font-size: 1.5rem; font-weight: 800; color: #fff; display: block; margin-block-end: var(--zn-space-3); }
.footer-about-text { font-size: 0.92rem; opacity: 0.8; }
.footer-social .social-link { background: rgb(255 255 255 / 0.1); color: #fff; }
.site-footer .widget { background: transparent; border: 0; padding: 0; }
.site-footer .widget-title { color: #fff; border-color: var(--zn-accent); }
.site-footer .widget-title span { color: #fff; }
.site-footer .widget ul li { border-color: rgb(255 255 255 / 0.08); }
.footer-cat-list { list-style: none; margin: 0; padding: 0; }
.footer-cat-list li { padding-block: 0.35rem; border-block-end: 1px solid rgb(255 255 255 / 0.08); }
.footer-newsletter .newsletter-box { background: rgb(255 255 255 / 0.06); }

.footer-nav ul { display: flex; flex-wrap: wrap; gap: var(--zn-space-3); list-style: none; margin: 0; padding: var(--zn-space-3) 0 0; justify-content: center; }
.footer-bottom {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--zn-space-3);
	padding-block-start: var(--zn-space-3);
	font-size: 0.85rem;
}
.copyright { margin: 0; opacity: 0.75; }
.legal-nav ul { display: flex; gap: var(--zn-space-3); list-style: none; margin: 0; padding: 0; }

/* ---------- Back to top ---------- */
.back-to-top {
	position: fixed;
	inset-block-end: 1.2rem;
	inset-inline-end: 1.2rem;
	z-index: 850;
	width: 46px; height: 46px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 0;
	border-radius: 50%;
	background: var(--zn-brand);
	color: var(--zn-on-brand);
	cursor: pointer;
	box-shadow: var(--zn-shadow-lg);
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	transition: opacity var(--zn-transition), transform var(--zn-transition), visibility var(--zn-transition);
}
.back-to-top.is-visible { opacity: 1; visibility: visible; transform: translateY(0); }
.back-to-top:hover { background: var(--zn-brand-dark); }
.back-to-top[hidden] { display: none; }

/* ---------- Language switcher ---------- */
.lang-switch {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 42px;
	padding-inline: 0.9rem;
	border-radius: var(--zn-radius-sm);
	background: rgb(255 255 255 / 0.1);
	color: var(--zn-on-brand) !important;
	font-weight: 700;
	font-size: 0.95rem;
	text-decoration: none !important;
	transition: background-color var(--zn-transition), color var(--zn-transition);
}
.lang-switch:hover, .lang-switch:focus { background: var(--zn-accent); color: #2A1A00 !important; }
.lang-switch[lang="ur"] { font-family: var(--zn-font-urdu); line-height: 1; padding-block-end: 0.5rem; }
.mobile-menu-lang { margin-block-start: var(--zn-space-3); }
.mobile-menu-lang .lang-switch { background: var(--zn-brand); width: 100%; }

/* ---------- Urdu mode: Jang-style news typography ----------
 * Active when the visitor switches to اردو (body.zn-urdu + html[dir=rtl]).
 * Nastaliq script needs larger sizes and much taller line boxes; all
 * mirroring is already handled by CSS logical properties.
 */
body.zn-urdu {
	font-family: var(--zn-font-urdu);
	font-size: calc(var(--zn-font-base) + 1px);
	line-height: 2.1;
}
body.zn-urdu h1, body.zn-urdu h2, body.zn-urdu h3,
body.zn-urdu h4, body.zn-urdu h5, body.zn-urdu h6 {
	font-family: var(--zn-font-urdu);
	font-weight: 700;
	line-height: 1.9;
	text-wrap: balance;
}
body.zn-urdu .card-title,
body.zn-urdu .mini-title,
body.zn-urdu .block-list-title,
body.zn-urdu .hero-item-title,
body.zn-urdu .ranked-title,
body.zn-urdu .post-nav-title,
body.zn-urdu .live-result-title {
	font-family: var(--zn-font-urdu);
	line-height: 1.95;
}
body.zn-urdu .hero-lead-title { font-size: clamp(1.45rem, 1.05rem + 1.7vw, 2.1rem); line-height: 1.9; }
body.zn-urdu .article-title { font-size: clamp(1.6rem, 1.2rem + 2vw, 2.5rem); line-height: 1.95; }
body.zn-urdu .article-subtitle { line-height: 2.1; }
body.zn-urdu .card-title { font-size: 1.08rem; }
body.zn-urdu .card-title-lg { font-size: 1.35rem; }
body.zn-urdu .card-excerpt, body.zn-urdu .hero-lead-excerpt { line-height: 2.05; font-size: 0.98rem; }
body.zn-urdu .entry-content { font-size: 1.18rem; line-height: 2.35; }
body.zn-urdu .entry-content blockquote { font-family: var(--zn-font-urdu); line-height: 2.2; }
body.zn-urdu .primary-nav a { font-size: 1.02rem; padding-block: 0.55rem 0.9rem; }
body.zn-urdu .mobile-menu a { font-size: 1.05rem; line-height: 1.9; }
body.zn-urdu .ticker-item { font-size: 1.02rem; line-height: 1.9; }
body.zn-urdu .breaking-inner { min-height: 52px; }
body.zn-urdu .section-title { font-size: 1.3rem; }
body.zn-urdu .section-title span { padding-block: 0.25em 0.5em; }
body.zn-urdu .widget-title { font-size: 1.08rem; line-height: 1.8; }
body.zn-urdu .newsletter-title, body.zn-urdu .footer-site-title { font-family: var(--zn-font-urdu); }
body.zn-urdu .btn { font-family: var(--zn-font-urdu); line-height: 1.6; padding-block: 0.35em 0.75em; }
body.zn-urdu .cat-badge { font-family: var(--zn-font-urdu); font-size: 0.8rem; padding-block: 0.1em 0.45em; letter-spacing: 0; text-transform: none; }
body.zn-urdu .breaking-label { font-family: var(--zn-font-urdu); font-size: 0.88rem; letter-spacing: 0; text-transform: none; padding-block: 0.15em 0.5em; }
body.zn-urdu .post-meta, body.zn-urdu .byline-dates, body.zn-urdu .card-date { line-height: 1.9; }
body.zn-urdu .search-field { font-family: var(--zn-font-urdu); }
body.zn-urdu .contact-form label, body.zn-urdu .filter-label { line-height: 1.8; }

/* ---------- WordPress core classes ---------- */
.alignleft { float: left; margin-inline-end: var(--zn-space-3); }
.alignright { float: right; margin-inline-start: var(--zn-space-3); }
.aligncenter { display: block; margin-inline: auto; }
.alignwide { margin-inline: calc(-1 * var(--zn-space-4)); max-width: none; }
.alignfull { margin-inline: calc(50% - 50vw); max-width: 100vw; }
.wp-caption { max-width: 100%; }
.sticky { position: relative; }
.bypostauthor { position: relative; }
.gallery { display: grid; gap: var(--zn-space-2); grid-template-columns: repeat(3, 1fr); }

/* ---------- Print ---------- */
@media print {
	.site-header, .site-footer, .sidebar, .sticky-share, .back-to-top,
	.breaking-bar, .ad-slot, .share-buttons, .comments-area, .newsletter-box { display: none !important; }
	body { font-size: 12pt; color: #000; background: #fff; }
	a { color: #000; text-decoration: underline; }
}