/*
 * Sahaf News - main stylesheet.
 *
 * Everything visual is driven by custom properties emitted inline by
 * Sahaf_Dynamic_CSS, so this file contains no colours of its own beyond the
 * fallbacks in :root. Logical properties (inline/block, start/end) are used
 * throughout so the same rules serve LTR and RTL; the handful of places that
 * truly need direction are in rtl.css.
 *
 * Sections:
 *   1.  Tokens and reset
 *   2.  Typography and prose
 *   3.  Accessibility helpers
 *   4.  Buttons, chips, badges, forms
 *   5.  Layout shell (container, main grid, sidebar)
 *   6.  Header: topbar, masthead, navigation
 *   7.  Header dialogs: mobile menu, search overlay, live search
 *   8.  Breaking news bar
 *   9.  Cards and thumbnails
 *   10. Card styles and layouts
 *   11. Sections and view headers
 *   12. Single article
 *   13. Comments
 *   14. Pagination and empty states
 *   15. Widgets
 *   16. Footer
 *   17. Floating UI (share, lightbox, video, to-top, progress, theme toggle)
 *   18. Ads
 *   19. Responsive
 *   20. Motion and print (print.css is separate)
 */

/* -------------------------------------------------------------------------
 * 1. Tokens and reset
 * ---------------------------------------------------------------------- */

:root {
	--sahaf-color-primary: #c62828;
	--sahaf-color-primary-rgb: 198, 40, 40;
	--sahaf-color-accent: #0f62fe;
	--sahaf-color-bg: #ffffff;
	--sahaf-color-surface: #ffffff;
	--sahaf-color-surface-2: #f6f7f9;
	--sahaf-color-text: #14171c;
	--sahaf-color-muted: #5c6470;
	--sahaf-color-border: #e4e7ec;
	--sahaf-color-link: #c62828;
	--sahaf-color-link-hover: #0f62fe;
	--sahaf-color-focus: #0f62fe;
	--sahaf-color-selection: #c62828;
	--sahaf-color-overlay: rgba(8, 10, 14, .72);
	--sahaf-font-body: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--sahaf-font-heading: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--sahaf-font-size: 17px;
	--sahaf-line-height: 1.75;
	--sahaf-heading-line: 1.25;
	--sahaf-font-size-meta: 13px;
	--sahaf-container: 1320px;
	--sahaf-container-narrow: 860px;
	--sahaf-content-width: 760px;
	--sahaf-sidebar-width: 330px;
	--sahaf-gap-xs: 6px;
	--sahaf-gap-sm: 12px;
	--sahaf-gap-md: 20px;
	--sahaf-gap-lg: 30px;
	--sahaf-gap-xl: 48px;
	--sahaf-section-gap: 52px;
	--sahaf-radius-sm: 7px;
	--sahaf-radius: 14px;
	--sahaf-radius-lg: 22px;
	--sahaf-radius-pill: 999px;
	--sahaf-shadow: 0 1px 2px rgba(9, 12, 18, .04), 0 6px 20px -8px rgba(9, 12, 18, .14);
	--sahaf-shadow-hover: 0 2px 4px rgba(9, 12, 18, .05), 0 14px 34px -10px rgba(9, 12, 18, .2);
	--sahaf-border-width: 1px;
	--sahaf-header-height: 88px;
	--sahaf-header-height-mobile: 62px;
}

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

html {
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
	scroll-behavior: smooth;
	scroll-padding-block-start: calc(var(--sahaf-header-height) + var(--sahaf-gap-md));
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
}

body.sahaf-page-body {
	margin: 0;
	background: var(--sahaf-color-bg);
	color: var(--sahaf-color-text);
	font-family: var(--sahaf-font-body);
	font-size: var(--sahaf-font-size);
	font-weight: var(--sahaf-font-weight-body, 400);
	line-height: var(--sahaf-line-height);
	letter-spacing: var(--sahaf-letter-spacing, 0);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
	overflow-wrap: break-word;
}

img,
svg,
video,
iframe {
	max-width: 100%;
}

img {
	height: auto;
}

svg {
	vertical-align: middle;
}

figure {
	margin: 0;
}

::selection {
	background: var(--sahaf-color-selection);
	color: #fff;
}

:focus-visible {
	outline: 2px solid var(--sahaf-color-focus);
	outline-offset: 2px;
}

a {
	color: var(--sahaf-color-link);
	text-decoration: none;
}

a:hover,
a:focus {
	color: var(--sahaf-color-link-hover);
}

hr {
	border: 0;
	border-block-start: var(--sahaf-border-width) solid var(--sahaf-color-border);
	margin-block: var(--sahaf-gap-lg);
}

/* -------------------------------------------------------------------------
 * 2. Typography and prose
 * ---------------------------------------------------------------------- */

h1,
h2,
h3,
h4,
h5,
h6 {
	margin: 0 0 .5em;
	font-family: var(--sahaf-font-heading);
	font-weight: var(--sahaf-font-weight-heading, 700);
	line-height: var(--sahaf-heading-line);
	color: var(--sahaf-color-text);
	text-wrap: balance;
}

h1 {
	font-size: var(--sahaf-scale-h1, 2.2em);
}

h2 {
	font-size: var(--sahaf-scale-h2, 1.7em);
}

h3 {
	font-size: var(--sahaf-scale-h3, 1.3em);
}

h4 {
	font-size: var(--sahaf-scale-h4, 1.1em);
}

h5,
h6 {
	font-size: var(--sahaf-scale-h5, 1em);
}

p {
	margin: 0 0 1.1em;
}

.sahaf-prose {
	font-size: 1em;
	line-height: var(--sahaf-line-height);
}

.sahaf-prose > * + * {
	margin-block-start: 1.1em;
}

.sahaf-prose h2,
.sahaf-prose h3,
.sahaf-prose h4 {
	margin-block-start: 1.6em;
}

.sahaf-prose img,
.sahaf-prose .wp-block-image img {
	border-radius: var(--sahaf-radius-sm);
}

.sahaf-prose a {
	text-decoration: underline;
	text-underline-offset: .15em;
	text-decoration-thickness: 1px;
}

.sahaf-prose blockquote,
.sahaf-prose .wp-block-quote {
	margin: 0;
	padding-inline-start: var(--sahaf-gap-md);
	border-inline-start: 3px solid var(--sahaf-color-primary);
	font-size: 1.08em;
	font-style: italic;
	color: var(--sahaf-color-muted);
}

/* Blockquote style variants (post.quote_style) */
.sahaf-article--quote-background .sahaf-prose blockquote,
.sahaf-article--quote-background .sahaf-prose .wp-block-quote {
	padding: var(--sahaf-gap-md);
	border-inline-start: 0;
	border-radius: var(--sahaf-radius);
	background: var(--sahaf-color-surface-2);
	color: var(--sahaf-color-text);
}

.sahaf-article--quote-large .sahaf-prose blockquote,
.sahaf-article--quote-large .sahaf-prose .wp-block-quote {
	padding: 0;
	border-inline-start: 0;
	font-size: 1.5em;
	font-weight: 600;
	font-style: normal;
	line-height: 1.3;
	text-align: center;
	color: var(--sahaf-color-text);
}

.sahaf-prose code {
	padding: .15em .4em;
	border-radius: var(--sahaf-radius-sm);
	background: var(--sahaf-color-surface-2);
	font-size: .9em;
}

.sahaf-prose pre {
	overflow: auto;
	padding: var(--sahaf-gap-md);
	border-radius: var(--sahaf-radius);
	background: var(--sahaf-color-surface-2);
}

.sahaf-prose table {
	width: 100%;
	border-collapse: collapse;
}

.sahaf-prose th,
.sahaf-prose td {
	padding: var(--sahaf-gap-sm);
	border: var(--sahaf-border-width) solid var(--sahaf-color-border);
	text-align: start;
}

.sahaf-prose--sm {
	font-size: .95em;
}

.sahaf-prose--sm > * + * {
	margin-block-start: .75em;
}

.alignwide {
	width: min(100vw - 2 * var(--sahaf-gap-md), var(--sahaf-container-narrow));
	margin-inline: auto;
}

.alignfull {
	width: 100vw;
	max-width: 100vw;
	margin-inline: calc(50% - 50vw);
}

.aligncenter {
	display: block;
	margin-inline: auto;
}

.alignleft {
	float: inline-start;
	margin-inline-end: var(--sahaf-gap-md);
}

.alignright {
	float: inline-end;
	margin-inline-start: var(--sahaf-gap-md);
}

.wp-caption-text,
figcaption {
	color: var(--sahaf-color-muted);
	font-size: var(--sahaf-font-size-meta);
}

/* -------------------------------------------------------------------------
 * 3. Accessibility helpers
 * ---------------------------------------------------------------------- */

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.screen-reader-text:focus {
	position: fixed;
	z-index: 100000;
	inset-block-start: var(--sahaf-gap-sm);
	inset-inline-start: var(--sahaf-gap-sm);
	width: auto;
	height: auto;
	padding: var(--sahaf-gap-sm) var(--sahaf-gap-md);
	clip: auto;
	border-radius: var(--sahaf-radius-sm);
	background: var(--sahaf-color-primary);
	color: var(--sahaf-color-primary-contrast, #fff);
	box-shadow: var(--sahaf-shadow);
	font-weight: 600;
}

.sahaf-skip-link {
	position: absolute;
	z-index: 100000;
	inset-block-start: -100px;
	inset-inline-start: var(--sahaf-gap-sm);
	padding: var(--sahaf-gap-sm) var(--sahaf-gap-md);
	border-radius: 0 0 var(--sahaf-radius-sm) var(--sahaf-radius-sm);
	background: var(--sahaf-color-primary);
	color: var(--sahaf-color-primary-contrast, #fff) !important;
	font-weight: 600;
	transition: inset-block-start .15s ease;
}

.sahaf-skip-link:focus {
	inset-block-start: 0;
}

[hidden] {
	display: none !important;
}

html.sahaf-lock,
html.sahaf-lock body {
	overflow: hidden;
}

.sahaf-no-anim,
.sahaf-no-anim * {
	animation: none !important;
	transition: none !important;
}

/* -------------------------------------------------------------------------
 * 4. Buttons, chips, badges, forms
 * ---------------------------------------------------------------------- */

.sahaf-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--sahaf-gap-xs);
	padding: .62em 1.15em;
	border: var(--sahaf-border-width) solid transparent;
	border-radius: var(--sahaf-radius-pill);
	background: var(--sahaf-color-surface-2);
	color: var(--sahaf-color-text);
	font-family: inherit;
	font-size: .92em;
	font-weight: 600;
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	transition: background-color .18s ease, color .18s ease, border-color .18s ease, transform .18s ease;
}

.sahaf-btn:hover {
	transform: translateY(-1px);
}

.sahaf-btn--primary {
	background: var(--sahaf-color-primary);
	color: var(--sahaf-color-primary-contrast, #fff);
}

.sahaf-btn--primary:hover {
	background: var(--sahaf-color-accent);
	color: var(--sahaf-color-accent-contrast, #fff);
}

.sahaf-btn--outline {
	border-color: var(--sahaf-color-border);
	background: transparent;
}

.sahaf-btn--outline:hover {
	border-color: var(--sahaf-color-primary);
	color: var(--sahaf-color-primary);
}

.sahaf-btn--ghost {
	background: transparent;
}

.sahaf-btn--ghost:hover {
	background: var(--sahaf-color-surface-2);
}

.sahaf-btn--sm {
	padding: .4em .8em;
	font-size: .82em;
}

.sahaf-btn[disabled],
.sahaf-btn[aria-disabled="true"] {
	opacity: .55;
	cursor: not-allowed;
	transform: none;
}

.sahaf-iconbtn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	padding: 0;
	border: var(--sahaf-border-width) solid transparent;
	border-radius: var(--sahaf-radius-pill);
	background: transparent;
	color: var(--sahaf-color-text);
	cursor: pointer;
	transition: background-color .18s ease, color .18s ease;
}

.sahaf-iconbtn:hover {
	background: var(--sahaf-color-surface-2);
	color: var(--sahaf-color-primary);
}

.sahaf-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: none;
}

.sahaf-chip {
	display: inline-flex;
	align-items: center;
	gap: var(--sahaf-gap-xs);
	padding: .3em .8em;
	border-radius: var(--sahaf-radius-pill);
	background: var(--sahaf-color-surface-2);
	color: var(--sahaf-color-text);
	font-size: .82em;
	font-weight: 600;
}

.sahaf-chip:hover {
	background: var(--sahaf-color-primary);
	color: var(--sahaf-color-primary-contrast, #fff);
}

.sahaf-chip__count {
	color: var(--sahaf-color-muted);
	font-weight: 400;
}

.sahaf-badge {
	display: inline-flex;
	align-items: center;
	padding: .15em .55em;
	border-radius: var(--sahaf-radius-sm);
	background: var(--sahaf-color-accent);
	color: var(--sahaf-color-accent-contrast, #fff);
	font-size: .7em;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .04em;
}

.sahaf-badge--sticky {
	background: var(--sahaf-color-primary);
	color: var(--sahaf-color-primary-contrast, #fff);
}

.sahaf-input,
input[type="text"],
input[type="search"],
input[type="email"],
input[type="url"],
input[type="number"],
input[type="tel"],
input[type="password"],
textarea,
select {
	width: 100%;
	padding: .65em .85em;
	border: var(--sahaf-border-width) solid var(--sahaf-color-border);
	border-radius: var(--sahaf-radius-sm);
	background: var(--sahaf-color-surface);
	color: var(--sahaf-color-text);
	font: inherit;
	font-size: .95em;
	transition: border-color .18s ease, box-shadow .18s ease;
}

input:focus,
textarea:focus,
select:focus {
	border-color: var(--sahaf-color-primary);
	box-shadow: 0 0 0 3px rgba(var(--sahaf-color-primary-rgb), .18);
	outline: none;
}

textarea {
	min-height: 8em;
	resize: vertical;
}

label {
	color: var(--sahaf-color-text);
	font-weight: 600;
}

.sahaf-form__error {
	color: var(--sahaf-color-primary);
	font-size: .85em;
}

.sahaf-spinner {
	display: inline-block;
	width: 16px;
	height: 16px;
	border: 2px solid rgba(var(--sahaf-color-primary-rgb), .25);
	border-block-start-color: var(--sahaf-color-primary);
	border-radius: 50%;
	animation: sahaf-spin .7s linear infinite;
}

@keyframes sahaf-spin {
	to {
		transform: rotate(360deg);
	}
}

.sahaf-skeleton {
	border-radius: var(--sahaf-radius-sm);
	background: var(--sahaf-color-skeleton, rgba(128, 128, 128, .18));
	animation: sahaf-pulse 1.4s ease-in-out infinite;
}

.sahaf-skeleton--media {
	aspect-ratio: 16 / 9;
	border-radius: 0;
}

.sahaf-skeleton--line {
	height: 12px;
	margin-block-start: var(--sahaf-gap-sm);
}

@keyframes sahaf-pulse {
	0%,
	100% {
		opacity: 1;
	}
	50% {
		opacity: .55;
	}
}

/* -------------------------------------------------------------------------
 * 5. Layout shell
 * ---------------------------------------------------------------------- */

.sahaf-container {
	width: 100%;
	max-width: var(--sahaf-container);
	margin-inline: auto;
	padding-inline: var(--sahaf-gap-md);
}

.sahaf-page {
	min-height: 100vh;
	display: flex;
	flex-direction: column;
}

body.admin-bar .sahaf-page {
	min-height: calc(100vh - 32px);
}

.sahaf-main {
	width: 100%;
	max-width: var(--sahaf-container);
	margin-inline: auto;
	padding-inline: var(--sahaf-gap-md);
	padding-block: var(--sahaf-gap-xl) var(--sahaf-section-gap);
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--sahaf-gap-xl);
	align-items: start;
}

.sahaf-main--with-sidebar {
	grid-template-columns: minmax(0, 1fr) var(--sahaf-sidebar-width);
}

.sahaf-main--builder {
	display: block;
	max-width: none;
	padding-inline: 0;
	padding-block: 0;
}

.sahaf-content {
	min-width: 0;
}

.sahaf-sidebar {
	min-width: 0;
	display: grid;
	gap: var(--sahaf-gap-lg);
	align-content: start;
}

/* Left-sidebar preference reverses the visual columns without touching DOM order. */
.sahaf-has-sidebar.sahaf-sidebar-left .sahaf-main--with-sidebar {
	grid-template-columns: var(--sahaf-sidebar-width) minmax(0, 1fr);
}

.sahaf-has-sidebar.sahaf-sidebar-left .sahaf-sidebar {
	grid-column: 1;
	grid-row: 1;
}

.sahaf-has-sidebar.sahaf-sidebar-left .sahaf-content {
	grid-column: 2;
	grid-row: 1;
}

.sahaf-sidebar--sticky {
	position: sticky;
	inset-block-start: calc(var(--sahaf-header-height) + var(--sahaf-gap-md));
}

/* -------------------------------------------------------------------------
 * 6. Header
 * ---------------------------------------------------------------------- */

.sahaf-header {
	position: relative;
	z-index: 400;
	background: var(--sahaf-color-surface);
	border-block-end: var(--sahaf-border-width) solid var(--sahaf-color-border);
}

.sahaf-header--sticky {
	position: sticky;
	inset-block-start: 0;
	box-shadow: 0 1px 0 var(--sahaf-color-border);
}

body.admin-bar .sahaf-header--sticky {
	inset-block-start: 32px;
}

.sahaf-header--is-scrolled {
	box-shadow: var(--sahaf-shadow);
}

/* Topbar */
.sahaf-topbar {
	background: var(--sahaf-color-surface-2);
	border-block-end: var(--sahaf-border-width) solid var(--sahaf-color-border);
	font-size: var(--sahaf-font-size-meta);
	color: var(--sahaf-color-muted);
}

.sahaf-topbar__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--sahaf-gap-md);
	min-height: 40px;
	padding-block: var(--sahaf-gap-xs);
}

.sahaf-topbar__start,
.sahaf-topbar__end {
	display: flex;
	align-items: center;
	gap: var(--sahaf-gap-md);
	min-width: 0;
}

.sahaf-topbar__date,
.sahaf-topbar__weather {
	display: inline-flex;
	align-items: center;
	gap: var(--sahaf-gap-xs);
	white-space: nowrap;
}

.sahaf-topbar__headline {
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	color: var(--sahaf-color-text);
	font-weight: 600;
}

.sahaf-topbar__menu {
	display: flex;
	gap: var(--sahaf-gap-md);
	list-style: none;
	margin: 0;
	padding: 0;
}

.sahaf-topbar .sahaf-social__list {
	display: flex;
	gap: var(--sahaf-gap-sm);
	margin: 0;
	padding: 0;
	list-style: none;
}

/* Masthead */
.sahaf-masthead {
	background: var(--sahaf-color-surface);
	padding-block: var(--sahaf-header-gap, var(--sahaf-gap-md));
}

.sahaf-masthead__inner {
	display: flex;
	align-items: center;
	gap: var(--sahaf-gap-md);
	min-height: calc(var(--sahaf-header-height) - 2 * var(--sahaf-gap-md));
}

.sahaf-masthead__brand {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: var(--sahaf-gap-xs);
}

.sahaf-logo {
	display: inline-flex;
	align-items: center;
	gap: var(--sahaf-gap-sm);
	text-decoration: none;
	color: var(--sahaf-color-text);
}

.sahaf-logo__img {
	display: block;
	max-height: 64px;
	width: auto;
}

.sahaf-logo__title {
	font-family: var(--sahaf-font-heading);
	font-size: 1.9em;
	font-weight: 800;
	letter-spacing: -.02em;
	line-height: 1.1;
}

.sahaf-masthead__title {
	margin: 0;
	font-size: var(--sahaf-scale-h2, 1.7em);
}

.sahaf-masthead__title a {
	color: inherit;
}

.sahaf-masthead__subtitle {
	color: var(--sahaf-color-muted);
	font-size: var(--sahaf-font-size-meta);
}

.sahaf-masthead__actions {
	display: flex;
	align-items: center;
	gap: var(--sahaf-gap-sm);
	flex: none;
}

.sahaf-burger {
	display: none;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	padding: 0;
	border: var(--sahaf-border-width) solid var(--sahaf-color-border);
	border-radius: var(--sahaf-radius-sm);
	background: transparent;
	color: var(--sahaf-color-text);
	cursor: pointer;
	flex: none;
}

.sahaf-burger:hover {
	color: var(--sahaf-color-primary);
}

.sahaf-header-search,
.sahaf-header-newsletter {
	border-block-start: var(--sahaf-border-width) solid var(--sahaf-color-border);
	margin-block-start: var(--sahaf-gap-md);
	padding-block-start: var(--sahaf-gap-md);
}

/* Navigation */
.sahaf-nav {
	background: var(--sahaf-color-surface);
	border-block-start: var(--sahaf-border-width) solid var(--sahaf-color-border);
	box-shadow: 0 1px 0 rgba(9, 12, 18, .03);
}

.sahaf-nav__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--sahaf-gap-md);
	min-height: 56px;
}

.sahaf-nav__menu {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--sahaf-gap-sm) var(--sahaf-gap-xs);
	margin: 0;
	padding: 0;
	list-style: none;
}

.sahaf-nav__menu > li {
	position: relative;
	display: flex;
	align-items: center;
}

.sahaf-nav__link {
	display: inline-flex;
	align-items: center;
	gap: var(--sahaf-gap-xs);
	padding: .6em 1em;
	border-radius: var(--sahaf-radius-sm);
	color: var(--sahaf-color-text);
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: .01em;
	transition: background-color .18s ease, color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.sahaf-nav__menu > li:hover > .sahaf-nav__link,
.sahaf-nav__menu > .current-menu-item > .sahaf-nav__link,
.sahaf-nav__menu > .current-menu-ancestor > .sahaf-nav__link {
	background: var(--sahaf-color-primary);
	color: var(--sahaf-color-primary-contrast, #fff);
	box-shadow: 0 10px 20px -12px rgba(var(--sahaf-color-primary-rgb), .85);
}

.sahaf-submenu-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	margin-inline-start: -.35em;
	padding: 0;
	border: 0;
	background: transparent;
	color: inherit;
	cursor: pointer;
	transition: transform .18s ease;
}

.sahaf-submenu-toggle[aria-expanded="true"] {
	transform: rotate(180deg);
}

.sahaf-submenu {
	position: absolute;
	z-index: 50;
	inset-block-start: 100%;
	inset-inline-start: 0;
	min-width: 240px;
	margin: 0;
	padding: var(--sahaf-gap-xs);
	list-style: none;
	background: var(--sahaf-color-surface);
	border: var(--sahaf-border-width) solid var(--sahaf-color-border);
	border-radius: var(--sahaf-radius-sm);
	box-shadow: var(--sahaf-shadow-hover);
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	transition: opacity .16s ease, transform .16s ease, visibility .16s;
}

.sahaf-nav__menu > li:hover > .sahaf-submenu,
.sahaf-nav__menu > li:focus-within > .sahaf-submenu,
.sahaf-submenu--open {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

/* Nested (third level) drop-downs fly out to the side of their parent. */
.sahaf-submenu li {
	position: relative;
}

.sahaf-submenu li:hover > .sahaf-submenu,
.sahaf-submenu li:focus-within > .sahaf-submenu {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.sahaf-submenu .sahaf-submenu {
	inset-block-start: calc(-1 * var(--sahaf-gap-xs) - var(--sahaf-border-width));
	inset-inline-start: 100%;
}

.sahaf-submenu li + li {
	border-block-start: var(--sahaf-border-width) solid var(--sahaf-color-border);
}

.sahaf-submenu .sahaf-nav__link {
	display: block;
	width: 100%;
	border-radius: var(--sahaf-radius-sm);
}

.sahaf-submenu .sahaf-nav__link:hover,
.sahaf-submenu .sahaf-nav__link:focus-visible {
	background: var(--sahaf-color-primary);
	color: var(--sahaf-color-primary-contrast, #fff);
}

.sahaf-nav__tools {
	display: flex;
	align-items: center;
	gap: var(--sahaf-gap-xs);
	flex: none;
}

.sahaf-nav__trending {
	display: inline-flex;
	align-items: center;
	gap: var(--sahaf-gap-xs);
	padding: .45em .8em;
	border-radius: var(--sahaf-radius-pill);
	background: rgba(var(--sahaf-color-primary-rgb), .1);
	color: var(--sahaf-color-primary);
	font-size: .84em;
	font-weight: 600;
}

/* -------------------------------------------------------------------------
 * 7. Header dialogs
 * ---------------------------------------------------------------------- */

.sahaf-mobile-menu,
.sahaf-search-overlay,
.sahaf-lightbox {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: flex;
}

.sahaf-mobile-menu {
	justify-content: flex-start;
}

.sahaf-mobile-menu__backdrop,
.sahaf-search-overlay__backdrop,
.sahaf-lightbox__backdrop {
	position: absolute;
	inset: 0;
	background: var(--sahaf-color-overlay);
	backdrop-filter: blur(2px);
}

.sahaf-mobile-menu__panel {
	position: relative;
	width: min(340px, 88vw);
	height: 100%;
	overflow-y: auto;
	background: var(--sahaf-color-surface);
	box-shadow: var(--sahaf-shadow-hover);
	padding: var(--sahaf-gap-md);
	display: flex;
	flex-direction: column;
	gap: var(--sahaf-gap-md);
	animation: sahaf-slide-in .22s ease;
}

.sahaf-mobile-menu__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--sahaf-gap-md);
}

.sahaf-mobile-menu__close,
.sahaf-search-overlay__close,
.sahaf-lightbox__close {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	padding: 0;
	border: var(--sahaf-border-width) solid var(--sahaf-color-border);
	border-radius: var(--sahaf-radius-pill);
	background: var(--sahaf-color-surface);
	color: var(--sahaf-color-text);
	cursor: pointer;
}

.sahaf-mobile-menu__nav {
	flex: 1 1 auto;
}

.sahaf-mobile-menu__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.sahaf-mobile-menu__list li {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}

.sahaf-mobile-menu__list > li + li {
	border-block-start: var(--sahaf-border-width) solid var(--sahaf-color-border);
}

.sahaf-mobile-menu__list .sahaf-nav__link {
	display: flex;
	flex: 1 1 auto;
	justify-content: space-between;
	padding: .7em .5em;
}

.sahaf-mobile-menu__list .sahaf-submenu-toggle {
	margin-inline-start: 0;
}

.sahaf-mobile-menu__list .sahaf-submenu {
	position: static;
	opacity: 1;
	visibility: visible;
	transform: none;
	box-shadow: none;
	border: 0;
	flex-basis: 100%;
	padding-inline-start: var(--sahaf-gap-md);
	display: none;
}

.sahaf-mobile-menu__list .sahaf-submenu--open {
	display: block;
}

.sahaf-mobile-menu__foot {
	margin-block-start: auto;
	padding-block-start: var(--sahaf-gap-md);
	border-block-start: var(--sahaf-border-width) solid var(--sahaf-color-border);
}

.sahaf-search-overlay {
	align-items: flex-start;
	justify-content: center;
	padding-block-start: 12vh;
}

.sahaf-search-overlay__panel {
	position: relative;
	width: min(720px, 92vw);
	padding: var(--sahaf-gap-lg);
	border-radius: var(--sahaf-radius-lg);
	background: var(--sahaf-color-surface);
	box-shadow: var(--sahaf-shadow-hover);
	display: grid;
	gap: var(--sahaf-gap-md);
	animation: sahaf-fade-up .2s ease;
}

/* Search form */
.sahaf-searchform {
	position: relative;
	width: 100%;
}

.sahaf-searchform__row {
	display: flex;
	align-items: center;
	gap: var(--sahaf-gap-xs);
	padding: .25em .35em .25em .65em;
	border: var(--sahaf-border-width) solid var(--sahaf-color-border);
	border-radius: var(--sahaf-radius-pill);
	background: var(--sahaf-color-surface);
	transition: border-color .18s ease, box-shadow .18s ease;
}

.sahaf-searchform__row:focus-within {
	border-color: var(--sahaf-color-primary);
	box-shadow: 0 0 0 3px rgba(var(--sahaf-color-primary-rgb), .15);
}

.sahaf-searchform__icon {
	display: inline-flex;
	color: var(--sahaf-color-muted);
}

.sahaf-searchform__field {
	flex: 1 1 auto;
	min-width: 0;
	padding: .5em .25em;
	border: 0;
	background: transparent;
	box-shadow: none;
}

.sahaf-searchform__field:focus {
	box-shadow: none;
}

.sahaf-searchform__submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	padding: 0;
	border: 0;
	border-radius: var(--sahaf-radius-pill);
	background: var(--sahaf-color-primary);
	color: var(--sahaf-color-primary-contrast, #fff);
	cursor: pointer;
	flex: none;
}

.sahaf-searchform__spinner {
	display: none;
}

.sahaf-searchform--loading .sahaf-searchform__spinner {
	display: inline-block;
}

.sahaf-searchform__results {
	position: absolute;
	z-index: 60;
	inset-inline: 0;
	inset-block-start: calc(100% + var(--sahaf-gap-xs));
	max-height: min(70vh, 560px);
	overflow-y: auto;
	padding: var(--sahaf-gap-sm);
	border: var(--sahaf-border-width) solid var(--sahaf-color-border);
	border-radius: var(--sahaf-radius);
	background: var(--sahaf-color-surface);
	box-shadow: var(--sahaf-shadow-hover);
}

.sahaf-searchform--block .sahaf-searchform__results {
	position: static;
	margin-block-start: var(--sahaf-gap-sm);
	max-height: none;
	box-shadow: none;
}

.sahaf-searchform__empty {
	padding: var(--sahaf-gap-md);
	color: var(--sahaf-color-muted);
	text-align: center;
}

.sahaf-searchform__all {
	display: block;
	padding: var(--sahaf-gap-sm);
	text-align: center;
	font-weight: 600;
}

.sahaf-searchform--lg .sahaf-searchform__field {
	font-size: 1.15em;
}

.sahaf-search-results {
	display: grid;
	gap: var(--sahaf-gap-sm);
	margin: 0;
	padding: 0;
	list-style: none;
}

.sahaf-search-results__item .sahaf-card {
	display: flex;
	gap: var(--sahaf-gap-sm);
	align-items: center;
	box-shadow: none;
	background: transparent;
	padding: 0;
}

.sahaf-search-results__item .sahaf-card__media {
	width: 96px;
	flex: none;
	border-radius: var(--sahaf-radius-sm);
	overflow: hidden;
}

/* -------------------------------------------------------------------------
 * 8. Breaking news
 * ---------------------------------------------------------------------- */

.sahaf-breaking {
	display: flex;
	align-items: stretch;
	gap: var(--sahaf-gap-md);
	background: var(--sahaf-breaking-bg, var(--sahaf-color-primary));
	color: var(--sahaf-breaking-fg, var(--sahaf-color-primary-contrast, #fff));
}

.sahaf-breaking__label {
	display: inline-flex;
	align-items: center;
	gap: var(--sahaf-gap-xs);
	padding: var(--sahaf-gap-sm) var(--sahaf-gap-md);
	background: rgba(0, 0, 0, .16);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .05em;
	font-size: .8em;
	white-space: nowrap;
}

.sahaf-breaking__pulse {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: currentColor;
	animation: sahaf-pulse 1.2s ease-in-out infinite;
}

.sahaf-breaking__viewport {
	position: relative;
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	display: flex;
	align-items: center;
}

.sahaf-breaking__track {
	display: inline-flex;
	gap: var(--sahaf-gap-xl);
	white-space: nowrap;
	padding-inline: var(--sahaf-gap-md);
	animation: sahaf-ticker var(--sahaf-ticker-duration, 30s) linear infinite;
}

.sahaf-breaking__viewport[data-pause-hover]:hover .sahaf-breaking__track {
	animation-play-state: paused;
}

.sahaf-breaking__item {
	color: inherit;
	font-weight: 600;
}

.sahaf-breaking__item:hover {
	text-decoration: underline;
}

.sahaf-breaking__list {
	display: flex;
	flex-wrap: wrap;
	gap: var(--sahaf-gap-md);
	margin: 0;
	padding: var(--sahaf-gap-sm) var(--sahaf-gap-md);
	list-style: none;
}

.sahaf-breaking__cta {
	display: inline-flex;
	align-items: center;
	padding-inline: var(--sahaf-gap-md);
}

.sahaf-breaking--full {
	display: block;
	text-align: center;
}

@keyframes sahaf-ticker {
	from {
		transform: translateX(0);
	}
	to {
		transform: translateX(-50%);
	}
}

/* -------------------------------------------------------------------------
 * 9. Cards and thumbnails
 * ---------------------------------------------------------------------- */

.sahaf-thumb {
	display: block;
	position: relative;
	width: 100%;
	aspect-ratio: var(--sahaf-ratio, 16 / 9);
	overflow: hidden;
	background: var(--sahaf-color-surface-2);
}

.sahaf-thumb .sahaf-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform .35s ease;
}

.sahaf-thumb--placeholder {
	background: var(--sahaf-color-surface-2);
}

.sahaf-card:hover .sahaf-thumb .sahaf-img {
	transform: scale(1.04);
}

.sahaf-ratio {
	position: relative;
	overflow: hidden;
}

.sahaf-ratio--16-9 {
	aspect-ratio: 16 / 9;
}

.sahaf-ratio--16-10 {
	aspect-ratio: 16 / 10;
}

.sahaf-ratio--3-2 {
	aspect-ratio: 3 / 2;
}

.sahaf-ratio--4-3 {
	aspect-ratio: 4 / 3;
}

.sahaf-ratio--1-1 {
	aspect-ratio: 1 / 1;
}

.sahaf-ratio--4-5 {
	aspect-ratio: 4 / 5;
}

.sahaf-ratio--21-9 {
	aspect-ratio: 21 / 9;
}

.sahaf-img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.sahaf-img--placeholder {
	background: var(--sahaf-color-surface-2);
}

.sahaf-card {
	position: relative;
	display: flex;
	flex-direction: column;
	min-width: 0;
	background: var(--sahaf-color-surface);
	border-radius: var(--sahaf-radius);
	overflow: hidden;
	transition: transform .2s ease, box-shadow .2s ease;
}

.sahaf-card--card {
	border: var(--sahaf-border-width) solid var(--sahaf-color-border);
	box-shadow: var(--sahaf-shadow);
}

.sahaf-card--card:hover {
	transform: translateY(-3px);
	box-shadow: var(--sahaf-shadow-hover);
}

.sahaf-card__media {
	position: relative;
	display: block;
	overflow: hidden;
}

.sahaf-card--plain .sahaf-card__media,
.sahaf-card--compact .sahaf-card__media {
	border-radius: var(--sahaf-radius-sm);
	overflow: hidden;
}

.sahaf-card__body {
	display: flex;
	flex-direction: column;
	gap: var(--sahaf-gap-sm);
	padding-block-start: var(--sahaf-gap-md);
}

.sahaf-card--card .sahaf-card__body {
	padding: var(--sahaf-gap-md);
}

.sahaf-card__cat {
	align-self: flex-start;
	padding: .22em .7em;
	border-radius: var(--sahaf-radius-pill);
	background: rgba(var(--sahaf-color-primary-rgb), .1);
	color: var(--sahaf-color-category, var(--sahaf-color-primary));
	font-size: .72em;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .04em;
}

.sahaf-card__cat:hover {
	background: var(--sahaf-color-primary);
	color: var(--sahaf-color-primary-contrast, #fff);
}

.sahaf-card__title {
	margin: 0;
	font-size: 1.12em;
	line-height: 1.3;
}

.sahaf-card__title a {
	color: var(--sahaf-color-text);
}

.sahaf-card__title a:hover {
	color: var(--sahaf-color-primary);
}

.sahaf-card__excerpt {
	margin: 0;
	color: var(--sahaf-color-muted);
	font-size: .92em;
	line-height: 1.6;
}

.sahaf-card__number {
	position: absolute;
	z-index: 2;
	inset-block-start: var(--sahaf-gap-sm);
	inset-inline-start: var(--sahaf-gap-sm);
	width: 34px;
	height: 34px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: var(--sahaf-radius-pill);
	background: var(--sahaf-color-primary);
	color: var(--sahaf-color-primary-contrast, #fff);
	font-weight: 700;
	font-size: .9em;
}

.sahaf-card__number--bare {
	position: static;
	background: transparent;
	color: var(--sahaf-color-primary);
	font-size: 1.6em;
	width: auto;
	height: auto;
}

.sahaf-card__badge {
	position: absolute;
	z-index: 2;
	inset-block-start: var(--sahaf-gap-sm);
	inset-inline-end: var(--sahaf-gap-sm);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	border-radius: var(--sahaf-radius-pill);
	background: var(--sahaf-color-overlay);
	color: #fff;
}

.sahaf-card--horizontal {
	flex-direction: row;
	align-items: stretch;
	gap: var(--sahaf-gap-md);
}

.sahaf-card--horizontal .sahaf-card__media {
	width: 40%;
	flex: none;
	border-radius: var(--sahaf-radius-sm);
	overflow: hidden;
}

.sahaf-card--horizontal .sahaf-card__body {
	padding-block-start: 0;
}

.sahaf-card--overlay {
	position: relative;
	border-radius: var(--sahaf-radius);
	overflow: hidden;
}

.sahaf-card--overlay .sahaf-card__media {
	aspect-ratio: 4 / 5;
}

.sahaf-card--overlay .sahaf-thumb {
	aspect-ratio: 4 / 5;
}

.sahaf-card--overlay .sahaf-card__body {
	position: absolute;
	inset-inline: 0;
	inset-block-end: 0;
	padding: var(--sahaf-gap-lg) var(--sahaf-gap-md) var(--sahaf-gap-md);
	background: linear-gradient(to top, rgba(8, 10, 14, .88), rgba(8, 10, 14, 0));
	color: #fff;
}

.sahaf-card--overlay .sahaf-card__title a,
.sahaf-card--overlay .sahaf-card__excerpt,
.sahaf-card--overlay .sahaf-meta {
	color: #fff;
}

/* Meta row */
.sahaf-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--sahaf-gap-xs);
	color: var(--sahaf-color-muted);
	font-size: var(--sahaf-font-size-meta);
}

.sahaf-meta__wrap {
	display: inline-flex;
	align-items: center;
	gap: var(--sahaf-gap-xs);
}

.sahaf-meta__item {
	display: inline-flex;
	align-items: center;
	gap: 4px;
}

/*
 * display:inline-flex above outranks the UA rule for [hidden], so a cold view
 * counter has to be hidden explicitly until views.js reveals it.
 */
.sahaf-meta__item[hidden] {
	display: none;
}

.sahaf-meta__sep {
	width: 3px;
	height: 3px;
	border-radius: 50%;
	background: currentColor;
	opacity: .6;
}

.sahaf-meta--author a {
	color: inherit;
	font-weight: 600;
}

.sahaf-meta--plain {
	gap: var(--sahaf-gap-sm);
}

.sahaf-views,
.sahaf-original {
	display: inline-flex;
	align-items: center;
	gap: 4px;
}

/* -------------------------------------------------------------------------
 * 10. Layouts
 * ---------------------------------------------------------------------- */

.sahaf-layout__list {
	display: grid;
	gap: var(--sahaf-gap-lg);
	margin: 0;
	padding: 0;
	list-style: none;
	grid-template-columns: minmax(0, 1fr);
}

.sahaf-layout__item {
	min-width: 0;
}

.sahaf-layout--cols-2 .sahaf-layout__list {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.sahaf-layout--cols-3 .sahaf-layout__list {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.sahaf-layout--cols-4 .sahaf-layout__list {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.sahaf-layout--compact .sahaf-layout__list {
	gap: var(--sahaf-gap-md);
}

.sahaf-layout--compact .sahaf-card {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: var(--sahaf-gap-md);
}

.sahaf-layout--compact .sahaf-card__media {
	width: 104px;
	flex: none;
	border-radius: var(--sahaf-radius-sm);
}

.sahaf-layout--compact .sahaf-card__body {
	padding-block-start: 0;
}

.sahaf-layout--ranked .sahaf-layout__item {
	display: flex;
	gap: var(--sahaf-gap-md);
}

.sahaf-ranked {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: var(--sahaf-gap-md);
	counter-reset: sahaf-rank;
}

.sahaf-ranked__item {
	display: flex;
	gap: var(--sahaf-gap-md);
	align-items: flex-start;
}

/* Featured large */
.sahaf-layout--featured-large .sahaf-layout__list {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.sahaf-layout--featured-large .sahaf-layout__item:first-child {
	grid-column: span 2;
	grid-row: span 2;
}

.sahaf-layout--featured-large .sahaf-layout__item:first-child .sahaf-card__title {
	font-size: 1.5em;
}

/* Table top */
.sahaf-layout--table-top .sahaf-layout__list {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

/* Magazine */
.sahaf-layout--magazine .sahaf-layout__list {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.sahaf-layout--magazine .sahaf-layout__item:first-child {
	grid-column: span 2;
	grid-row: span 2;
}

.sahaf-layout--magazine .sahaf-layout__item:first-child .sahaf-card__title {
	font-size: 1.45em;
}

/* Masonry: CSS columns, no JavaScript. */
.sahaf-masonry {
	columns: 3;
	column-gap: var(--sahaf-gap-lg);
}

.sahaf-masonry > .sahaf-card {
	break-inside: avoid;
	margin-block-end: var(--sahaf-gap-lg);
}

/* Carousel: scroll-snap track that works without JavaScript. */
.sahaf-carousel {
	position: relative;
}

.sahaf-carousel__track {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: minmax(240px, 1fr);
	gap: var(--sahaf-gap-md);
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	padding-block-end: var(--sahaf-gap-sm);
	scrollbar-width: thin;
}

.sahaf-carousel__track > .sahaf-card {
	scroll-snap-align: start;
}

.sahaf-carousel__nav {
	display: flex;
	justify-content: flex-end;
	gap: var(--sahaf-gap-xs);
	margin-block-start: var(--sahaf-gap-sm);
}

.sahaf-carousel__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	padding: 0;
	border: var(--sahaf-border-width) solid var(--sahaf-color-border);
	border-radius: var(--sahaf-radius-pill);
	background: var(--sahaf-color-surface);
	color: var(--sahaf-color-text);
	cursor: pointer;
}

.sahaf-carousel__btn:hover {
	border-color: var(--sahaf-color-primary);
	color: var(--sahaf-color-primary);
}

/* -------------------------------------------------------------------------
 * 11. Sections and view headers
 * ---------------------------------------------------------------------- */

.sahaf-section {
	margin-block-end: var(--sahaf-section-gap);
}

.sahaf-section:last-child {
	margin-block-end: 0;
}

.sahaf-section__head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: var(--sahaf-gap-md);
	margin-block-end: var(--sahaf-gap-lg);
	padding-block-end: var(--sahaf-gap-sm);
	border-block-end: 2px solid var(--sahaf-color-border);
}

.sahaf-section__head--border {
	border-block-end-color: var(--sahaf-color-primary);
}

.sahaf-section__head--center {
	flex-direction: column;
	align-items: center;
	text-align: center;
}

.sahaf-section__head--dark {
	padding: var(--sahaf-gap-md);
	border: 0;
	border-radius: var(--sahaf-radius);
	background: var(--sahaf-color-text);
	color: var(--sahaf-color-bg);
}

.sahaf-section__head--dark .sahaf-section__title,
.sahaf-section__head--dark .sahaf-section__subtitle {
	color: inherit;
}

.sahaf-section__title-wrap {
	display: flex;
	align-items: center;
	gap: var(--sahaf-gap-sm);
	min-width: 0;
}

.sahaf-section__icon {
	display: inline-flex;
	color: var(--sahaf-color-primary);
}

.sahaf-section__title {
	position: relative;
	margin: 0;
	font-size: var(--sahaf-scale-h3, 1.3em);
}

.sahaf-section__subtitle {
	margin: 2px 0 0;
	color: var(--sahaf-color-muted);
	font-size: var(--sahaf-font-size-meta);
}

.sahaf-section__more {
	display: inline-flex;
	align-items: center;
	gap: var(--sahaf-gap-xs);
	color: var(--sahaf-color-primary);
	font-size: .88em;
	font-weight: 600;
	white-space: nowrap;
}

.sahaf-section__more:hover {
	color: var(--sahaf-color-accent);
}

.sahaf-section__more-button {
	margin-block-start: var(--sahaf-gap-lg);
	margin-inline: auto;
	display: flex;
}

.sahaf-section--full {
	width: 100vw;
	max-width: 100vw;
	margin-inline: calc(50% - 50vw);
	padding-inline: var(--sahaf-gap-md);
}

/* Archive/search/category header */
.sahaf-view-head {
	margin-block-end: var(--sahaf-gap-xl);
	padding-block-end: var(--sahaf-gap-lg);
	border-block-end: var(--sahaf-border-width) solid var(--sahaf-color-border);
}

.sahaf-view-head__main {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: var(--sahaf-gap-md);
	flex-wrap: wrap;
}

.sahaf-view-head__title {
	margin: 0;
	font-size: var(--sahaf-scale-h1, 2.2em);
}

.sahaf-view-head__desc {
	max-width: 70ch;
	margin-block-start: var(--sahaf-gap-sm);
	color: var(--sahaf-color-muted);
}

.sahaf-view-head__search {
	flex: 1 1 260px;
	max-width: 360px;
}

.sahaf-view-head__image {
	position: relative;
	margin: 0 0 var(--sahaf-gap-md);
	overflow: hidden;
	border-radius: var(--sahaf-radius);
	aspect-ratio: 21 / 9;
	background: var(--sahaf-color-surface);
}

.sahaf-view-head__image .sahaf-view-head__img,
.sahaf-view-head__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.sahaf-view-head__breadcrumb {
	margin-block-end: var(--sahaf-gap-sm);
	font-size: var(--sahaf-font-size-meta);
}

.sahaf-breadcrumb__list {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--sahaf-gap-xs);
	margin: 0;
	padding: 0;
	list-style: none;
	color: var(--sahaf-color-muted);
}

.sahaf-breadcrumb__sep {
	opacity: .55;
}

.sahaf-suggestions {
	margin-block-start: var(--sahaf-gap-lg);
}

.sahaf-suggestions__title {
	font-size: 1em;
}

.sahaf-suggestions__list {
	display: flex;
	flex-wrap: wrap;
	gap: var(--sahaf-gap-xs);
	margin: 0;
	padding: 0;
	list-style: none;
}

/* -------------------------------------------------------------------------
 * 12. Single article
 * ---------------------------------------------------------------------- */

.sahaf-article {
	max-width: var(--sahaf-content-width);
}

.sahaf-article__breadcrumb {
	margin-block-end: var(--sahaf-gap-md);
	font-size: var(--sahaf-font-size-meta);
}

.sahaf-article__head {
	margin-block-end: var(--sahaf-gap-lg);
}

.sahaf-entry-title {
	margin-block: var(--sahaf-gap-sm) var(--sahaf-gap-md);
	font-size: var(--sahaf-scale-h1, 2.2em);
}

.sahaf-article__hero {
	margin-block: var(--sahaf-gap-lg);
	border-radius: var(--sahaf-radius);
	overflow: hidden;
}

/* Parallax featured image (post.parallax_cover) */
.sahaf-article__hero--parallax img {
	transform: scale(1.12);
	transform-origin: center;
	will-change: transform;
}

@supports (animation-timeline: view()) {
	.sahaf-article__hero--parallax img {
		animation: sahaf-hero-parallax linear both;
		animation-timeline: view();
		animation-range: entry 0% cover 100%;
	}
}

@keyframes sahaf-hero-parallax {
	from {
		transform: translateY(-4%) scale(1.12);
	}
	to {
		transform: translateY(4%) scale(1.12);
	}
}

.sahaf-article__caption {
	padding-block-start: var(--sahaf-gap-xs);
}

.sahaf-article__body {
	margin-block-end: var(--sahaf-gap-lg);
}

.sahaf-article__tags {
	margin-block: var(--sahaf-gap-lg);
	padding-block-start: var(--sahaf-gap-lg);
	border-block-start: var(--sahaf-border-width) solid var(--sahaf-color-border);
}

.sahaf-article__tags-title {
	font-size: var(--sahaf-font-size-meta);
	text-transform: uppercase;
	letter-spacing: .05em;
	color: var(--sahaf-color-muted);
}

.sahaf-taglist {
	display: flex;
	flex-wrap: wrap;
	gap: var(--sahaf-gap-xs);
	margin: 0;
	padding: 0;
	list-style: none;
}

.sahaf-page-links {
	display: flex;
	flex-wrap: wrap;
	gap: var(--sahaf-gap-xs);
	margin-block-start: var(--sahaf-gap-lg);
	font-weight: 600;
}

.sahaf-page-links__item {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 34px;
	height: 34px;
	padding-inline: var(--sahaf-gap-sm);
	border: var(--sahaf-border-width) solid var(--sahaf-color-border);
	border-radius: var(--sahaf-radius-sm);
}

.sahaf-postnav {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--sahaf-gap-md);
	margin-block: var(--sahaf-gap-xl);
}

.sahaf-postnav__item {
	display: flex;
	flex-direction: column;
	gap: var(--sahaf-gap-xs);
	padding: var(--sahaf-gap-md);
	border: var(--sahaf-border-width) solid var(--sahaf-color-border);
	border-radius: var(--sahaf-radius);
	background: var(--sahaf-color-surface);
}

.sahaf-postnav__item--next {
	text-align: end;
	align-items: flex-end;
}

.sahaf-postnav__label {
	display: inline-flex;
	align-items: center;
	gap: var(--sahaf-gap-xs);
	color: var(--sahaf-color-muted);
	font-size: var(--sahaf-font-size-meta);
	text-transform: uppercase;
	letter-spacing: .04em;
}

.sahaf-postnav__title {
	color: var(--sahaf-color-text);
	font-weight: 600;
}

/* Plain-link navigation (post.post_nav_style = plain) */
.sahaf-postnav--plain {
	gap: var(--sahaf-gap-lg);
}

.sahaf-postnav--plain .sahaf-postnav__item {
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none;
}

.sahaf-postnav--plain .sahaf-postnav__item--prev {
	padding-inline-end: var(--sahaf-gap-lg);
	border-inline-end: var(--sahaf-border-width) solid var(--sahaf-color-border);
}

/* Author card */
.sahaf-authorcard {
	display: flex;
	gap: var(--sahaf-gap-md);
	margin-block: var(--sahaf-gap-xl);
	padding: var(--sahaf-gap-lg);
	border: var(--sahaf-border-width) solid var(--sahaf-color-border);
	border-radius: var(--sahaf-radius);
	background: var(--sahaf-color-surface);
}

.sahaf-authorcard__avatar {
	flex: none;
}

.sahaf-authorcard__img {
	width: 72px;
	height: 72px;
	border-radius: 50%;
}

.sahaf-authorcard__title {
	margin: 0 0 var(--sahaf-gap-xs);
	font-size: 1.1em;
}

.sahaf-authorcard__bio {
	margin: 0 0 var(--sahaf-gap-sm);
	color: var(--sahaf-color-muted);
}

.sahaf-authorcard__meta {
	display: flex;
	flex-wrap: wrap;
	gap: var(--sahaf-gap-md);
	font-size: var(--sahaf-font-size-meta);
}

.sahaf-edit-link {
	display: inline-flex;
	margin-block-start: var(--sahaf-gap-sm);
	font-size: var(--sahaf-font-size-meta);
}

/* Table of contents */
.sahaf-toc {
	margin-block: var(--sahaf-gap-lg);
	padding: var(--sahaf-gap-md);
	border: var(--sahaf-border-width) solid var(--sahaf-color-border);
	border-radius: var(--sahaf-radius);
	background: var(--sahaf-color-surface-2);
}

.sahaf-toc__title {
	margin: 0 0 var(--sahaf-gap-sm);
	font-size: 1em;
}

.sahaf-toc__list {
	margin: 0;
	padding-inline-start: 1.1em;
	display: grid;
	gap: var(--sahaf-gap-xs);
}

.sahaf-toc__item--h3 {
	margin-inline-start: var(--sahaf-gap-md);
}

.sahaf-toc__item--h4 {
	margin-inline-start: calc(2 * var(--sahaf-gap-md));
}

/* Related */
.sahaf-related {
	margin-block: var(--sahaf-gap-xl);
}

.sahaf-related__title {
	margin-block-end: var(--sahaf-gap-md);
	font-size: 1.2em;
}

.sahaf-related__more {
	display: inline-flex;
	margin-block-start: var(--sahaf-gap-md);
}

/* -------------------------------------------------------------------------
 * 13. Comments
 * ---------------------------------------------------------------------- */

.sahaf-comments {
	margin-block-start: var(--sahaf-gap-xl);
}

.sahaf-comments__title {
	margin-block-end: var(--sahaf-gap-lg);
}

.sahaf-comments__closed {
	color: var(--sahaf-color-muted);
}

.sahaf-comments .comment-list,
.sahaf-comments .sahaf-comment__list {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: var(--sahaf-gap-lg);
}

.sahaf-comments .children {
	margin: var(--sahaf-gap-md) 0 0;
	padding-inline-start: var(--sahaf-gap-lg);
	list-style: none;
	display: grid;
	gap: var(--sahaf-gap-md);
}

.sahaf-comment__inner {
	display: flex;
	gap: var(--sahaf-gap-md);
	padding: var(--sahaf-gap-md);
	border: var(--sahaf-border-width) solid var(--sahaf-color-border);
	border-radius: var(--sahaf-radius);
	background: var(--sahaf-color-surface);
}

.sahaf-comment__avatar {
	flex: none;
}

.sahaf-comment__img {
	width: 48px;
	height: 48px;
	border-radius: 50%;
}

.sahaf-comment__body {
	flex: 1 1 auto;
	min-width: 0;
}

.sahaf-comment__head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--sahaf-gap-sm);
	margin-block-end: var(--sahaf-gap-xs);
}

.sahaf-comment__author {
	font-weight: 700;
}

.sahaf-comment__badge {
	padding: .1em .5em;
	border-radius: var(--sahaf-radius-sm);
	background: var(--sahaf-color-primary);
	color: var(--sahaf-color-primary-contrast, #fff);
	font-size: .7em;
	font-weight: 700;
	text-transform: uppercase;
}

.sahaf-comment__date {
	color: var(--sahaf-color-muted);
	font-size: var(--sahaf-font-size-meta);
}

.sahaf-comment__awaiting {
	color: var(--sahaf-color-muted);
	font-style: italic;
}

.sahaf-comment__actions {
	margin-block-start: var(--sahaf-gap-sm);
	display: flex;
	gap: var(--sahaf-gap-md);
	font-size: var(--sahaf-font-size-meta);
}

.sahaf-comment__reply {
	font-weight: 600;
}

.sahaf-commentform .comment-form {
	display: grid;
	gap: var(--sahaf-gap-md);
}

.sahaf-commentform .comment-form-author,
.sahaf-commentform .comment-form-email,
.sahaf-commentform .comment-form-url {
	display: grid;
	gap: var(--sahaf-gap-xs);
}

/* -------------------------------------------------------------------------
 * 14. Pagination and empty states
 * ---------------------------------------------------------------------- */

.sahaf-pagination {
	margin-block-start: var(--sahaf-gap-xl);
}

.sahaf-pager {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--sahaf-gap-xs);
	margin: 0;
	padding: 0;
	list-style: none;
}

.sahaf-pager__li {
	margin: 0;
}

.sahaf-pager__item,
.sahaf-pager a,
.sahaf-pager span.current {
	display: inline-flex;
	align-items: center;
	gap: var(--sahaf-gap-xs);
	min-width: 40px;
	height: 40px;
	padding-inline: var(--sahaf-gap-sm);
	justify-content: center;
	border: var(--sahaf-border-width) solid var(--sahaf-color-border);
	border-radius: var(--sahaf-radius-sm);
	color: var(--sahaf-color-text);
	font-weight: 600;
}

.sahaf-pager a:hover {
	border-color: var(--sahaf-color-primary);
	color: var(--sahaf-color-primary);
}

.sahaf-pager span.current {
	background: var(--sahaf-color-primary);
	border-color: var(--sahaf-color-primary);
	color: var(--sahaf-color-primary-contrast, #fff);
}

.sahaf-empty {
	padding: var(--sahaf-gap-xl) var(--sahaf-gap-md);
	text-align: center;
	border: var(--sahaf-border-width) dashed var(--sahaf-color-border);
	border-radius: var(--sahaf-radius);
}

.sahaf-empty__icon {
	display: inline-flex;
	margin-block-end: var(--sahaf-gap-md);
	color: var(--sahaf-color-muted);
}

.sahaf-empty__title {
	font-size: var(--sahaf-scale-h3, 1.3em);
}

.sahaf-empty__text {
	color: var(--sahaf-color-muted);
}

.sahaf-empty__action {
	margin-block-start: var(--sahaf-gap-md);
}

/* 404 */
.sahaf-404 {
	display: grid;
	gap: var(--sahaf-gap-md);
	max-width: var(--sahaf-container-narrow);
	margin-inline: auto;
	padding-block: var(--sahaf-gap-xl);
	text-align: center;
}

.sahaf-404__code {
	font-size: clamp(4rem, 18vw, 9rem);
	font-weight: 800;
	line-height: 1;
	color: var(--sahaf-color-primary);
}

.sahaf-404__search {
	max-width: 520px;
	margin-inline: auto;
}

.sahaf-404__recent-title {
	margin-block-start: var(--sahaf-gap-lg);
}

/* -------------------------------------------------------------------------
 * 15. Widgets
 * ---------------------------------------------------------------------- */

.sahaf-widget {
	padding: var(--sahaf-gap-md);
	border: var(--sahaf-border-width) solid var(--sahaf-color-border);
	border-radius: var(--sahaf-radius);
	background: var(--sahaf-color-surface);
}

.sahaf-widget__title {
	margin: 0 0 var(--sahaf-gap-md);
	padding-block-end: var(--sahaf-gap-sm);
	border-block-end: 2px solid var(--sahaf-color-border);
	font-size: 1.05em;
}

.sahaf-widget__title::after {
	content: "";
	display: block;
	width: 40px;
	height: 2px;
	margin-block-end: -2px;
	background: var(--sahaf-color-primary);
}

.sahaf-widget__more {
	display: inline-flex;
	margin-block-start: var(--sahaf-gap-sm);
	font-weight: 600;
}

.sahaf-widget .sahaf-card {
	box-shadow: none;
	border: 0;
}

.sahaf-widget .sahaf-layout--cols-2 .sahaf-layout__list,
.sahaf-widget .sahaf-layout--cols-3 .sahaf-layout__list {
	grid-template-columns: minmax(0, 1fr);
}

.sahaf-media-list {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: var(--sahaf-gap-md);
}

.sahaf-media-list__item {
	display: grid;
	grid-template-columns: 112px minmax(0, 1fr);
	gap: var(--sahaf-gap-sm);
	align-items: start;
}

.sahaf-media-list__media {
	position: relative;
	border-radius: var(--sahaf-radius-sm);
	overflow: hidden;
}

.sahaf-media-list__play {
	position: absolute;
	inset: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 0;
	background: rgba(8, 10, 14, .45);
	color: #fff;
	cursor: pointer;
}

.sahaf-media-list__badge {
	position: absolute;
	inset-block-start: 6px;
	inset-inline-end: 6px;
	padding: .1em .45em;
	border-radius: var(--sahaf-radius-sm);
	background: var(--sahaf-color-overlay);
	color: #fff;
	font-size: .7em;
}

.sahaf-media-list__title {
	margin: 0;
	font-size: .98em;
}

.sahaf-media-list__date {
	color: var(--sahaf-color-muted);
	font-size: var(--sahaf-font-size-meta);
}

.sahaf-authors {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: var(--sahaf-gap-md);
}

.sahaf-authors--grid {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.sahaf-authors__link {
	display: flex;
	align-items: center;
	gap: var(--sahaf-gap-sm);
	color: var(--sahaf-color-text);
}

.sahaf-authors__avatar {
	flex: none;
}

.sahaf-authors__img {
	width: 56px;
	height: 56px;
	border-radius: 50%;
}

.sahaf-authors__info {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.sahaf-authors__name {
	font-weight: 600;
}

.sahaf-authors__role,
.sahaf-authors__count {
	color: var(--sahaf-color-muted);
	font-size: var(--sahaf-font-size-meta);
}

.sahaf-catlist {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: var(--sahaf-gap-xs);
}

/* Testimonials (shortcode + post type) */
.sahaf-testimonials {
	display: grid;
	gap: var(--sahaf-gap-md);
	margin-block: var(--sahaf-gap-lg);
}

.sahaf-testimonials--cols-1 {
	grid-template-columns: minmax(0, 1fr);
}

.sahaf-testimonials--cols-2 {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.sahaf-testimonials--cols-3 {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.sahaf-testimonials--cols-4 {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.sahaf-testimonial {
	margin: 0;
	padding: var(--sahaf-gap-md);
	border: var(--sahaf-border-width) solid var(--sahaf-color-border);
	border-radius: var(--sahaf-radius);
	background: var(--sahaf-color-surface-2);
	display: flex;
	flex-direction: column;
	gap: var(--sahaf-gap-sm);
}

.sahaf-testimonial__rating {
	display: inline-flex;
	gap: 2px;
	color: var(--sahaf-color-muted);
}

.sahaf-testimonial__star {
	display: inline-flex;
}

.sahaf-testimonial__star.is-on {
	color: #f5a623;
}

.sahaf-testimonial__quote {
	margin: 0;
	font-size: 1.05em;
}

.sahaf-testimonial__quote p {
	margin: 0;
}

.sahaf-testimonial__meta {
	display: flex;
	align-items: center;
	gap: var(--sahaf-gap-sm);
	margin-block-start: auto;
}

.sahaf-testimonial__avatar {
	width: 48px;
	height: 48px;
	border-radius: 50%;
	flex: none;
}

.sahaf-testimonial__who {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.sahaf-testimonial__name {
	font-weight: 600;
}

.sahaf-testimonial__role {
	color: var(--sahaf-color-muted);
	font-size: var(--sahaf-font-size-meta);
}

.sahaf-testimonial__source {
	font-size: var(--sahaf-font-size-meta);
}

@media (max-width: 782px) {

	.sahaf-testimonials--cols-2,
	.sahaf-testimonials--cols-3,
	.sahaf-testimonials--cols-4 {
		grid-template-columns: minmax(0, 1fr);
	}
}

.sahaf-catlist__item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: .5em 0;
	border-block-end: var(--sahaf-border-width) solid var(--sahaf-color-border);
}

.sahaf-catlist__count {
	color: var(--sahaf-color-muted);
	font-size: var(--sahaf-font-size-meta);
}

.sahaf-catcloud {
	display: flex;
	flex-wrap: wrap;
	gap: var(--sahaf-gap-xs);
	margin: 0;
	padding: 0;
	list-style: none;
}

.sahaf-social__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.sahaf-social--grid .sahaf-social__list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(40px, 1fr));
	gap: var(--sahaf-gap-xs);
}

.sahaf-social--row .sahaf-social__list {
	display: flex;
	flex-wrap: wrap;
	gap: var(--sahaf-gap-xs);
}

.sahaf-social__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: var(--sahaf-radius-pill);
	background: var(--sahaf-color-surface-2);
	color: var(--sahaf-color-text);
}

.sahaf-social__link:hover {
	background: var(--sahaf-color-primary);
	color: var(--sahaf-color-primary-contrast, #fff);
}

.sahaf-social__label {
	grid-column: 1 / -1;
	margin-block-end: var(--sahaf-gap-xs);
	font-weight: 600;
}

/* Newsletter */
.sahaf-newsletter {
	border-radius: var(--sahaf-radius);
	background: var(--sahaf-color-surface-2);
	overflow: hidden;
}

.sahaf-newsletter__inner {
	padding: var(--sahaf-gap-lg);
	display: grid;
	gap: var(--sahaf-gap-md);
}

.sahaf-newsletter--bar .sahaf-newsletter__inner {
	grid-template-columns: 1fr minmax(280px, 1fr);
	align-items: center;
}

.sahaf-newsletter__title {
	margin: 0;
	font-size: var(--sahaf-scale-h4, 1.1em);
}

.sahaf-newsletter__text {
	margin: 0;
	color: var(--sahaf-color-muted);
}

.sahaf-newsletter__form {
	display: grid;
	gap: var(--sahaf-gap-sm);
}

.sahaf-newsletter__fields {
	display: flex;
	gap: var(--sahaf-gap-xs);
	flex-wrap: wrap;
}

.sahaf-newsletter__fields .sahaf-input {
	flex: 1 1 200px;
}

.sahaf-newsletter__privacy {
	margin: 0;
	color: var(--sahaf-color-muted);
	font-size: var(--sahaf-font-size-meta);
}

.sahaf-newsletter__setup-note {
	margin: 0;
	padding: var(--sahaf-gap-sm);
	border-radius: var(--sahaf-radius-sm);
	background: rgba(var(--sahaf-color-primary-rgb), .08);
	color: var(--sahaf-color-muted);
	font-size: var(--sahaf-font-size-meta);
}

.sahaf-notice {
	padding: var(--sahaf-gap-sm);
	border-radius: var(--sahaf-radius-sm);
	background: rgba(var(--sahaf-color-accent-rgb), .1);
	font-size: var(--sahaf-font-size-meta);
}

/* -------------------------------------------------------------------------
 * 16. Footer
 * ---------------------------------------------------------------------- */

.sahaf-footer {
	margin-block-start: auto;
	background: var(--sahaf-color-surface-2);
	border-block-start: var(--sahaf-border-width) solid var(--sahaf-color-border);
	color: var(--sahaf-color-text);
}

.sahaf-footer__top-inner {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: var(--sahaf-gap-lg);
	align-items: center;
	padding-block: var(--sahaf-gap-xl);
}

.sahaf-footer__social-title {
	margin: 0 0 var(--sahaf-gap-sm);
	font-size: var(--sahaf-font-size-meta);
	text-transform: uppercase;
	letter-spacing: .05em;
	color: var(--sahaf-color-muted);
}

.sahaf-footer__widgets {
	padding-block: var(--sahaf-gap-xl);
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: var(--sahaf-gap-lg);
}

.sahaf-footer__widgets .sahaf-widget {
	background: transparent;
	border: 0;
	padding: 0;
}

.sahaf-footer__bottom {
	border-block-start: var(--sahaf-border-width) solid var(--sahaf-color-border);
}

.sahaf-footer__bottom-inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--sahaf-gap-md);
	padding-block: var(--sahaf-gap-md);
	font-size: var(--sahaf-font-size-meta);
	color: var(--sahaf-color-muted);
}

.sahaf-footer__menu {
	display: flex;
	flex-wrap: wrap;
	gap: var(--sahaf-gap-md);
	margin: 0;
	padding: 0;
	list-style: none;
}

.sahaf-footer__nav {
	display: flex;
	flex-wrap: wrap;
	gap: var(--sahaf-gap-md);
}

/* -------------------------------------------------------------------------
 * 17. Floating UI
 * ---------------------------------------------------------------------- */

/* Share */
.sahaf-share {
	display: flex;
	align-items: center;
	gap: var(--sahaf-gap-sm);
}

.sahaf-share__label {
	font-size: var(--sahaf-font-size-meta);
	font-weight: 600;
	color: var(--sahaf-color-muted);
}

.sahaf-share__list {
	display: flex;
	gap: var(--sahaf-gap-xs);
	margin: 0;
	padding: 0;
	list-style: none;
}

.sahaf-share__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--sahaf-gap-xs);
	min-width: 38px;
	height: 38px;
	padding-inline: var(--sahaf-gap-sm);
	border: var(--sahaf-border-width) solid var(--sahaf-color-border);
	border-radius: var(--sahaf-radius-pill);
	background: var(--sahaf-color-surface);
	color: var(--sahaf-color-text);
	cursor: pointer;
}

.sahaf-share__btn:hover {
	background: var(--sahaf-color-primary);
	border-color: var(--sahaf-color-primary);
	color: var(--sahaf-color-primary-contrast, #fff);
}

.sahaf-share--floating {
	position: sticky;
	inset-block-start: calc(var(--sahaf-header-height) + var(--sahaf-gap-md));
	flex-direction: column;
	float: inline-start;
	margin-inline-end: var(--sahaf-gap-md);
}

.sahaf-share--floating .sahaf-share__list {
	flex-direction: column;
}

/* Lightbox */
.sahaf-lightbox {
	align-items: center;
	justify-content: center;
	padding: var(--sahaf-gap-md);
}

.sahaf-lightbox__frame {
	position: relative;
	max-width: min(1100px, 92vw);
	max-height: 90vh;
	display: grid;
	gap: var(--sahaf-gap-sm);
	justify-items: center;
}

.sahaf-lightbox__stage {
	display: flex;
	align-items: center;
	justify-content: center;
}

.sahaf-lightbox__stage img,
.sahaf-lightbox__stage iframe {
	max-width: 100%;
	max-height: 80vh;
	border-radius: var(--sahaf-radius-sm);
}

.sahaf-lightbox__caption {
	color: #fff;
	text-align: center;
}

.sahaf-lightbox__close {
	position: absolute;
	inset-block-start: calc(-1 * var(--sahaf-gap-xl));
	inset-inline-end: 0;
	background: rgba(255, 255, 255, .12);
	color: #fff;
	border-color: rgba(255, 255, 255, .25);
}

.sahaf-lightbox__nav {
	position: absolute;
	inset-block-start: 50%;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	border: 0;
	border-radius: var(--sahaf-radius-pill);
	background: rgba(255, 255, 255, .14);
	color: #fff;
	cursor: pointer;
}

.sahaf-lightbox__nav--prev {
	inset-inline-start: calc(-1 * var(--sahaf-gap-xl));
}

.sahaf-lightbox__nav--next {
	inset-inline-end: calc(-1 * var(--sahaf-gap-xl));
}

/* Video */
.sahaf-video {
	position: relative;
	border-radius: var(--sahaf-radius);
	overflow: hidden;
}

.sahaf-video__poster {
	position: absolute;
	inset: 0;
}

.sahaf-video__play {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: var(--sahaf-gap-xs);
	border: 0;
	background: rgba(8, 10, 14, .32);
	color: #fff;
	cursor: pointer;
	transition: background-color .18s ease;
}

.sahaf-video__play:hover {
	background: rgba(8, 10, 14, .5);
}

.sahaf-video__play-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 58px;
	height: 58px;
	border-radius: var(--sahaf-radius-pill);
	background: var(--sahaf-color-primary);
	color: var(--sahaf-color-primary-contrast, #fff);
}

.sahaf-video__play-label {
	font-weight: 600;
}

.sahaf-video iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

/* Back to top */
.sahaf-to-top {
	position: fixed;
	z-index: 900;
	inset-block-end: var(--sahaf-gap-md);
	inset-inline-end: var(--sahaf-gap-md);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	border: 0;
	border-radius: var(--sahaf-radius-pill);
	background: var(--sahaf-color-primary);
	color: var(--sahaf-color-primary-contrast, #fff);
	box-shadow: var(--sahaf-shadow);
	cursor: pointer;
}

.sahaf-to-top:hover {
	background: var(--sahaf-color-accent);
}

/* Dark-mode toggle */
.sahaf-theme-toggle {
	position: fixed;
	z-index: 900;
	inset-block-end: calc(var(--sahaf-gap-md) + 54px);
	inset-inline-end: var(--sahaf-gap-md);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	border: var(--sahaf-border-width) solid var(--sahaf-color-border);
	border-radius: var(--sahaf-radius-pill);
	background: var(--sahaf-color-surface);
	color: var(--sahaf-color-text);
	box-shadow: var(--sahaf-shadow);
	cursor: pointer;
}

.sahaf-theme-toggle__icon {
	display: none;
}

:root[data-theme="dark"] .sahaf-theme-toggle__icon--sun,
:root:not([data-theme="dark"]) .sahaf-theme-toggle__icon--moon {
	display: inline-flex;
}

/* Reading progress */
.sahaf-progress {
	position: relative;
	height: 6px;
	margin-block-end: var(--sahaf-gap-lg);
	border-radius: var(--sahaf-radius-pill);
	background: var(--sahaf-color-surface-2);
	overflow: hidden;
}

.sahaf-progress__bar {
	display: block;
	height: 100%;
	width: 0;
	background: var(--sahaf-color-primary);
	transition: width .1s linear;
}

.sahaf-progress__value {
	position: absolute;
	inset-block-start: -1.7em;
	inset-inline-end: 0;
	font-size: var(--sahaf-font-size-meta);
	color: var(--sahaf-color-muted);
}

/* Sticky header scroll rail */
.sahaf-sticky-rail {
	position: fixed;
	z-index: 401;
	inset-block-start: 0;
	inset-inline: 0;
	height: 3px;
	pointer-events: none;
}

body.admin-bar .sahaf-sticky-rail {
	inset-block-start: 32px;
}

.sahaf-sticky-rail__bar {
	display: block;
	height: 100%;
	width: 0;
	background: var(--sahaf-color-primary);
	transition: width .1s linear;
}

.sahaf-stickybar {
	position: fixed;
	z-index: 500;
	inset-block-end: 0;
	inset-inline: 0;
	background: var(--sahaf-color-surface);
	border-block-start: var(--sahaf-border-width) solid var(--sahaf-color-border);
	box-shadow: var(--sahaf-shadow);
}

/* -------------------------------------------------------------------------
 * 18. Ads
 * ---------------------------------------------------------------------- */

.sahaf-ad {
	display: block;
	text-align: center;
	margin-block: var(--sahaf-gap-lg);
}

.sahaf-ad--header {
	margin-block: 0 var(--sahaf-gap-md);
}

.sahaf-ad--flow {
	margin-block: var(--sahaf-gap-lg);
}

.sahaf-ad img,
.sahaf-ad iframe,
.sahaf-ad ins {
	max-width: 100%;
	margin-inline: auto;
}

.sahaf-ad::before {
	content: attr(data-label);
	display: block;
	margin-block-end: var(--sahaf-gap-xs);
	color: var(--sahaf-color-muted);
	font-size: .7em;
	text-transform: uppercase;
	letter-spacing: .06em;
}

/* -------------------------------------------------------------------------
 * 19. Responsive
 * ---------------------------------------------------------------------- */

@media (max-width: 1200px) {
	.sahaf-layout--featured-large .sahaf-layout__list,
	.sahaf-layout--magazine .sahaf-layout__list {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 1024px) {
	.sahaf-main--with-sidebar,
	.sahaf-main {
		grid-template-columns: minmax(0, 1fr);
	}

	.sahaf-sidebar,
	.sahaf-sidebar--sticky {
		position: static;
		inset-block-start: auto;
		grid-column: auto;
		grid-row: auto;
	}

	.sahaf-has-sidebar.sahaf-sidebar-left .sahaf-main--with-sidebar {
		grid-template-columns: minmax(0, 1fr);
	}

	.sahaf-has-sidebar.sahaf-sidebar-left .sahaf-content,
	.sahaf-has-sidebar.sahaf-sidebar-left .sahaf-sidebar {
		grid-column: auto;
		grid-row: auto;
	}

	.sahaf-layout--cols-4 .sahaf-layout__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.sahaf-footer__top-inner {
		grid-template-columns: 1fr;
	}

	.sahaf-newsletter--bar .sahaf-newsletter__inner {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 860px) {
	.sahaf-burger {
		display: inline-flex;
	}

	.sahaf-nav__menu {
		display: none;
	}

	.sahaf-masthead__brand {
		align-items: center;
	}

	.sahaf-layout--cols-3 .sahaf-layout__list,
	.sahaf-layout--cols-4 .sahaf-layout__list,
	.sahaf-layout--cards .sahaf-layout__list,
	.sahaf-layout--table-top .sahaf-layout__list,
	.sahaf-layout--magazine .sahaf-layout__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.sahaf-layout--featured-large .sahaf-layout__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.sahaf-layout--featured-large .sahaf-layout__item:first-child,
	.sahaf-layout--magazine .sahaf-layout__item:first-child {
		grid-column: span 2;
		grid-row: auto;
	}

	.sahaf-masonry {
		columns: 2;
	}

	.sahaf-authorcard,
	.sahaf-comment__inner {
		flex-direction: column;
	}

	.sahaf-postnav {
		grid-template-columns: minmax(0, 1fr);
	}

	.sahaf-postnav__item--next {
		text-align: start;
		align-items: flex-start;
	}
}

@media (max-width: 600px) {
	.sahaf-layout--cols-2 .sahaf-layout__list,
	.sahaf-layout--cols-3 .sahaf-layout__list,
	.sahaf-layout--cols-4 .sahaf-layout__list,
	.sahaf-layout--cards .sahaf-layout__list,
	.sahaf-layout--table-top .sahaf-layout__list,
	.sahaf-layout--magazine .sahaf-layout__list,
	.sahaf-layout--featured-large .sahaf-layout__list {
		grid-template-columns: minmax(0, 1fr);
	}

	.sahaf-layout--featured-large .sahaf-layout__item:first-child,
	.sahaf-layout--magazine .sahaf-layout__item:first-child {
		grid-column: auto;
	}

	.sahaf-masonry {
		columns: 1;
	}

	.sahaf-authors--grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.sahaf-media-list__item {
		grid-template-columns: 92px minmax(0, 1fr);
	}

	.sahaf-card--horizontal {
		flex-direction: column;
	}

	.sahaf-card--horizontal .sahaf-card__media {
		width: 100%;
	}
}

/* -------------------------------------------------------------------------
 * 20. Motion preferences
 * ---------------------------------------------------------------------- */

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

	.sahaf-breaking__track {
		animation: none;
	}
}

/* -------------------------------------------------------------------------
 * 21. Setting-driven layout variants
 *
 * The matching classes are printed on <body> by sahaf_body_classes(). They
 * exist so the General/Card/Header selects in the admin have a visible
 * effect without touching the base component rules above.
 * ---------------------------------------------------------------------- */

/* Spacing scale */
body.sahaf-spacing-compact {
	--sahaf-gap-md: 12px;
	--sahaf-gap-lg: 20px;
	--sahaf-gap-xl: 32px;
	--sahaf-section-gap: 34px;
}

body.sahaf-spacing-roomy {
	--sahaf-gap-md: 28px;
	--sahaf-gap-lg: 40px;
	--sahaf-gap-xl: 60px;
	--sahaf-section-gap: 68px;
}

/* Corner treatment */
body.sahaf-border-sharp {
	--sahaf-radius-sm: 2px;
	--sahaf-radius: 4px;
	--sahaf-radius-lg: 6px;
}

body.sahaf-border-soft {
	--sahaf-radius-sm: 12px;
	--sahaf-radius: 22px;
	--sahaf-radius-lg: 30px;
}

/* Text alignment */
body.sahaf-text-center {
	text-align: center;
}

/* Card presentation */
body.sahaf-layout-classic .sahaf-card--card {
	box-shadow: none;
}

body.sahaf-layout-minimal .sahaf-card--card {
	box-shadow: none;
	border-color: transparent;
}

/* Image hover */
body.sahaf-hover-zoom .sahaf-card__media img,
body.sahaf-hover-slide .sahaf-card__media img {
	transition: transform .5s ease;
}

body.sahaf-hover-zoom .sahaf-card:hover .sahaf-card__media img {
	transform: scale(1.06);
}

body.sahaf-hover-slide .sahaf-card:hover .sahaf-card__media img {
	transform: translateY(-6px) scale(1.04);
}

body.sahaf-hover-fade .sahaf-card__media img {
	transition: opacity .4s ease;
}

body.sahaf-hover-fade .sahaf-card:hover .sahaf-card__media img {
	opacity: .82;
}

body.sahaf-hover-none .sahaf-card:hover .sahaf-card__media img {
	transform: none;
}

/* Header layout variants */
body.sahaf-header-classic .sahaf-masthead__brand {
	align-items: flex-start;
	text-align: start;
}

body.sahaf-header-centered .sahaf-masthead__inner {
	flex-direction: column;
	align-items: center;
}

body.sahaf-header-modern .sahaf-masthead {
	padding-block: var(--sahaf-gap-lg);
}

body.sahaf-header-minimal .sahaf-masthead__subtitle,
body.sahaf-header-minimal .sahaf-masthead__cta {
	display: none;
}

body.sahaf-header-minimal .sahaf-nav {
	border-block-start: 0;
	box-shadow: none;
}

@media (max-width: 1024px) {
	body.sahaf-header-mobile-modern .sahaf-masthead {
		padding-block: var(--sahaf-gap-sm);
	}

	body.sahaf-header-mobile-minimal .sahaf-masthead__subtitle,
	body.sahaf-header-mobile-minimal .sahaf-masthead__cta {
		display: none;
	}
}

/* Solid header button reuses the primary palette. */
.sahaf-btn--solid {
	background: var(--sahaf-color-primary);
	border-color: var(--sahaf-color-primary);
	color: var(--sahaf-color-primary-contrast, #fff);
}

.sahaf-btn--solid:hover {
	background: var(--sahaf-color-link-hover);
	border-color: var(--sahaf-color-link-hover);
	color: #fff;
}

/* Footer bands driven by the Footer options panel. */
.sahaf-footer__top-inner {
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	align-items: start;
}

.sahaf-footer__block-title {
	margin: 0 0 var(--sahaf-gap-sm);
	font-size: var(--sahaf-font-size-meta);
	text-transform: uppercase;
	letter-spacing: .05em;
	color: var(--sahaf-color-muted);
}

.sahaf-footer__about p {
	margin: 0;
	color: var(--sahaf-color-muted);
	font-size: .95em;
}

.sahaf-footer__links {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: var(--sahaf-gap-xs);
}

.sahaf-footer__widgets-inner {
	display: grid;
	grid-template-columns: repeat(var(--sahaf-footer-cols, 4), minmax(0, 1fr));
	gap: var(--sahaf-gap-lg);
	align-items: start;
}

@media (max-width: 780px) {
	.sahaf-footer__widgets-inner {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}
