@font-face {
	font-family: "SS IRANSans";
	src: url("../fonts/IRANSansX-Regular.woff") format("woff");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "SS IRANSans";
	src: url("../fonts/IRANSansWebFaNum_Medium.woff") format("woff");
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "SS IRANSans";
	src: url("../fonts/IRANSansX-Bold.woff") format("woff");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

:root {
	--ss-blue: #4a6a7a;
	--ss-cream: #e9e2d6;
	--ss-mist: #F5F7F8;
	--ss-charcoal: #20262b;
	--ss-orange: #e08546;

	--ss-container: 1180px;
	--ss-radius: 3px;

	--ss-font-fa: "SS IRANSans", Tahoma, sans-serif;

	--ss-h1: 40px;
	--ss-h2: 36px;
	--ss-h3: 30px;
	--ss-h4: 24px;

	--ss-body: 18px;
	--ss-small: 16px;
	--ss-vsmall: 14px;

	--ss-space-xs: 6px;
	--ss-space-sm: 10px;
	--ss-space-md: 16px;
	--ss-space-lg: 24px;
	--ss-space-xl: 32px;
	--ss-space-2xl: 48px;
	--ss-space-3xl: 64px;
	--ss-space-4xl: 96px;
}


/* =========================================================
   BLOG — GLOBAL
========================================================= */

.ss-blog-single,
.ss-blog-archive {
	background: var(--ss-mist);
	color: var(--ss-charcoal);
}


/* =========================================================
   SINGLE ARTICLE
========================================================= */

.ss-blog-single__container {
	padding-top: var(--ss-space-lg);
	padding-bottom: var(--ss-space-3xl);
}


/* =========================================================
   BREADCRUMB
========================================================= */

.ss-blog-breadcrumb {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;

	margin-bottom: var(--ss-space-lg);

	color: var(--ss-blue);
	font-size: 13px;
}

.ss-blog-breadcrumb a {
	color: inherit;
	text-decoration: none;
}

.ss-blog-breadcrumb a:hover {
	color: var(--ss-orange);
}


/* =========================================================
   ARTICLE HEADER
========================================================= */

.ss-blog-single__header {
	width: 100%;
	max-width: none;

	margin: 0 0 var(--ss-space-xl);

	text-align: right;
}

.ss-blog-single__header .ss-section-label {
	margin: 0 0 var(--ss-space-sm);

	color: var(--ss-orange);

	text-align: right;
}

.ss-blog-single__header h1 {
	width: 100%;
	max-width: 980px;

	margin: 0;

	font-size: clamp(38px, 5vw, 68px);
	font-weight: 500;
	line-height: 1.4;

	text-align: right;
}


/* =========================================================
   ARTICLE HERO
========================================================= */

.ss-blog-single__hero {
	width: 100%;

	margin: 0;

	overflow: hidden;

	border-radius: var(--ss-radius);
}

.ss-blog-single__hero img {
	display: block;

	width: 100%;
	height: auto;

	max-height: 720px;

	object-fit: cover;
}



/* =========================================================
   ARTICLE INFO BOX
========================================================= */

.ss-blog-info {
	width: 100%;

	margin: 0 0 var(--ss-space-xl);

	padding: var(--ss-space-md) var(--ss-space-xl);

	background: var(--ss-cream);

	border-radius:
		0
		0
		var(--ss-radius)
		var(--ss-radius);
}

.ss-blog-info__row {
	display: flex;

	align-items: center;

	flex-wrap: wrap;

	gap: 0;
}


/* =========================================================
   DATE + READING TIME
========================================================= */

.ss-blog-info__meta {
	display: flex;

	align-items: center;

	gap: 18px;

	padding-left: var(--ss-space-lg);

	color: var(--ss-blue);

	font-size: 13px;
}


/* =========================================================
   SOURCE
========================================================= */

.ss-blog-info__sources {
	display: flex;

	align-items: center;

	gap: 8px;

	padding:
		0
		var(--ss-space-lg);

	border-right: 1px solid
		color-mix(
			in srgb,
			var(--ss-charcoal) 18%,
			transparent
		);

	color: var(--ss-blue);

	font-size: 13px;
}

.ss-blog-info__title {
	color: var(--ss-charcoal);

	font-weight: 500;
}

.ss-blog-info__sources a {
	color: var(--ss-blue);

	text-decoration: none;
}

.ss-blog-info__sources a:hover {
	color: var(--ss-orange);
}


/* =========================================================
   SHARE
========================================================= */

.ss-blog-share {
	display: flex;

	align-items: center;

	gap: 10px;

	margin: 0;

	padding-right: var(--ss-space-lg);

	border-right: 1px solid
		color-mix(
			in srgb,
			var(--ss-charcoal) 18%,
			transparent
		);
}

.ss-blog-share a {
	display: inline-flex;

	align-items: center;
	justify-content: center;

	width: 30px;
	height: 30px;

	color: var(--ss-orange);

	text-decoration: none;

	transition:
		color 200ms ease,
		transform 200ms ease;
}

.ss-blog-share a:hover {
	color: var(--ss-blue);

	transform: translateY(-2px);
}

.ss-blog-share .dashicons {
	width: auto;
	height: auto;

	font-size: 18px;
}

/* =========================================================
   ARTICLE BODY
========================================================= */

.ss-blog-single__body {
	display: grid;

	grid-template-columns:
		minmax(0, 1fr)
		300px;

	align-items: start;

	gap: var(--ss-space-2xl);
}

.ss-blog-single__main {
	min-width: 0;
}


/* =========================================================
   TABLE OF CONTENTS
========================================================= */

.ss-blog-toc {
	width: 100%;

	margin: 0 0 var(--ss-space-xl);

	padding: 0;

	background: transparent;
	border: 0;
	border-radius: 0;
}

.ss-blog-toc strong {
	display: block;

	margin-bottom: var(--ss-space-md);

	color: var(--ss-charcoal);

	font-size: var(--ss-small);
	font-weight: 500;
}

.ss-blog-toc ol {
	display: grid;

	gap: var(--ss-space-sm);

	margin: 0;

	padding: 0;

	list-style: none;
}

.ss-blog-toc li {
	margin: 0;
	padding: 0;
}

.ss-blog-toc .level-3 {
	padding-right: var(--ss-space-lg);
}

.ss-blog-toc a {
	display: inline-block;

	color: var(--ss-blue);

	font-size: var(--ss-small);
	line-height: 1.9;

	text-decoration: none;

	transition:
		color 200ms ease,
		transform 200ms ease;
}

.ss-blog-toc a::before {
	display: inline-block;

	width: 5px;
	height: 5px;

	margin-left: var(--ss-space-sm);

	content: "";

	background: var(--ss-orange);

	border-radius: 50%;

	vertical-align: middle;
}

.ss-blog-toc a:hover {
	color: var(--ss-orange);

	transform: translateX(-3px);
}

/* =========================================================
   ARTICLE CONTENT
========================================================= */

.ss-blog-content {
	width: 100%;
	max-width: none;

	font-size: var(--ss-body);
	line-height: 2.2;
}

.ss-blog-content p {
	margin: 0 0 var(--ss-space-lg);

	text-align: justify;
	text-justify: inter-word;
}

.ss-blog-content h2 {
	margin:
		var(--ss-space-2xl)
		0
		var(--ss-space-md);

	font-size: var(--ss-h2);
	font-weight: 500;
	line-height: 1.5;
}

.ss-blog-content h3 {
	margin:
		var(--ss-space-xl)
		0
		var(--ss-space-sm);

	font-size: var(--ss-h3);
	font-weight: 500;
	line-height: 1.5;
}

.ss-blog-content img {
	display: block;

	max-width: 100%;
	height: auto;

	margin: var(--ss-space-xl) auto;

	border-radius: var(--ss-radius);
}

.ss-blog-content a {
	color: var(--ss-orange);
}


/* =========================================================
   NOTE / QUOTE
========================================================= */

.ss-blog-note {
	margin: var(--ss-space-xl) 0;

	padding: var(--ss-space-lg) var(--ss-space-xl);

	background: var(--ss-blue);
	color: var(--ss-mist);

	border: 0;
	border-radius: var(--ss-radius);
}

.ss-blog-note strong {
	color: var(--ss-orange);

	font-weight: 500;
}

.ss-blog-note blockquote {
	margin: var(--ss-space-sm) 0 0;

	color: var(--ss-mist);

	font-size: 1.06em;
	line-height: 2;
}

.ss-blog-note figcaption {
	margin-top: var(--ss-space-sm);

	color:
		color-mix(in srgb, var(--ss-mist) 72%, transparent);

	font-size: 13px;
}

/* =========================================================
   ARTICLE EXCERPT
========================================================= */

.ss-blog-excerpt {
	width: 100%;

	margin: 0 0 var(--ss-space-xl);

	padding: var(--ss-space-lg) var(--ss-space-xl);

	background:
		color-mix(
			in srgb,
			var(--ss-blue) 7%,
			var(--ss-mist)
		);

	border-radius: var(--ss-radius);

	color: var(--ss-charcoal);

	font-size: var(--ss-body);
	line-height: 2.1;
}

.ss-blog-excerpt p {
	margin: 0;
	text-align: justify;
}
/* =========================================================
   SUMMARY
========================================================= */

.ss-blog-summary {
	margin-top: var(--ss-space-2xl);

	padding: var(--ss-space-xl);

	background: var(--ss-cream);
	color: var(--ss-charcoal);

	border-radius: var(--ss-radius);
}

.ss-blog-summary strong {
	display: block;

	color: var(--ss-orange);

	font-size: var(--ss-h4);
	font-weight: 500;
}

.ss-blog-summary p {
	margin: var(--ss-space-sm) 0 0;

	color: var(--ss-blue);

	line-height: 2;
}


/* =========================================================
   LEGACY SOURCES FALLBACK
========================================================= */

.ss-blog-sources {
	margin-top: var(--ss-space-2xl);

	padding-top: var(--ss-space-xl);

	border-top: 1px solid
		color-mix(in srgb, var(--ss-charcoal) 14%, transparent);
}

.ss-blog-sources h2 {
	margin: 0 0 var(--ss-space-md);

	font-size: var(--ss-h3);
	font-weight: 500;
}

.ss-blog-sources a {
	color: var(--ss-blue);
}


/* =========================================================
   RELATED ARTICLES — LEFT SIDEBAR
========================================================= */

.ss-blog-related {
	position: sticky;

	top: 110px;

	margin: 0;
	padding: 0;

	border: 0;
}

.ss-blog-related__head {
	margin-bottom: var(--ss-space-lg);

	text-align: right;
}

.ss-blog-related__head .ss-section-label {
	margin-bottom: var(--ss-space-xs);

	color: var(--ss-orange);
}

.ss-blog-related__head h2 {
	margin: 0;

	font-size: var(--ss-h3);
	font-weight: 500;
	line-height: 1.5;
}

.ss-blog-related__grid {
	display: grid;

	grid-template-columns: 1fr;

	gap: var(--ss-space-lg);

	margin: 0;
}

.ss-blog-related__card {
	display: block;

	overflow: hidden;

	background: var(--ss-cream);
	color: var(--ss-charcoal);

	text-decoration: none;

	border-radius: var(--ss-radius);

	transition:
		transform 220ms ease,
		background 220ms ease;
}

.ss-blog-related__card:hover {
	transform: translateY(-3px);
}

.ss-blog-related__card img {
	display: block;

	width: 100%;

	aspect-ratio: 16 / 9;

	object-fit: cover;
}

.ss-blog-related__card span {
	display: block;

	padding: var(--ss-space-md);

	font-size: 15px;
	font-weight: 500;
	line-height: 1.8;
}


/* =========================================================
   COMMENTS
========================================================= */

.ss-blog-comments {
	width: calc(100% - 348px);
	max-width: none;

	margin-top: var(--ss-space-2xl);
	margin-right: 0;
	margin-left: auto;
}


/* =========================================================
   BLOG ARCHIVE
========================================================= */

.ss-blog-archive__hero {
	padding:
		var(--ss-space-2xl)
		0
		var(--ss-space-xl);

	background: var(--ss-cream);

	text-align: center;
}

.ss-blog-archive__hero .ss-section-label {
	color: var(--ss-orange);
}

.ss-blog-archive__hero h1 {
	margin: 0;

	font-size: clamp(40px, 5vw, 68px);
	font-weight: 500;
	line-height: 1.4;
}

.ss-blog-archive__hero p:last-child {
	width: 100%;
	max-width: 760px;

	margin: var(--ss-space-md) auto 0;

	color: var(--ss-blue);

	line-height: 2;
}


/* =========================================================
   ARTICLE LIST
========================================================= */

.ss-blog-archive__list {
	padding:
		var(--ss-space-xl)
		0
		var(--ss-space-3xl);
}

.ss-blog-list {
	display: grid;
}

.ss-blog-list__item {
	display: grid;

	grid-template-columns:
		260px
		minmax(0, 1fr);

	align-items: center;

	gap: var(--ss-space-xl);

	padding: var(--ss-space-xl) 0;

	border-bottom: 1px solid
		color-mix(in srgb, var(--ss-charcoal) 12%, transparent);
}

.ss-blog-list__image {
	display: block;

	overflow: hidden;

	background: var(--ss-charcoal);

	border-radius: var(--ss-radius);
}

.ss-blog-list__image img {
	display: block;

	width: 100%;
	height: 100%;

	aspect-ratio: 4 / 3;

	object-fit: cover;
}

.ss-blog-list__content {
	align-self: center;
}

.ss-blog-list__meta {
	display: flex;
	flex-wrap: wrap;

	gap: 14px;

	color: var(--ss-blue);

	font-size: 12px;
}

.ss-blog-list h2 {
	margin:
		var(--ss-space-xs)
		0
		var(--ss-space-sm);

	font-size: var(--ss-h3);
	font-weight: 500;
	line-height: 1.5;
}

.ss-blog-list h2 a {
	color: inherit;

	text-decoration: none;
}

.ss-blog-list h2 a:hover {
	color: var(--ss-orange);
}

.ss-blog-list p {
	margin: 0;

	color: var(--ss-blue);

	line-height: 2;
}

.ss-blog-list__more {
	display: inline-flex;

	margin-top: var(--ss-space-sm);

	color: var(--ss-orange);

	text-decoration: none;
}


/* =========================================================
   PAGINATION
========================================================= */

.ss-blog-pagination {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;

	gap: 8px;

	margin-top: var(--ss-space-xl);
}

.ss-blog-pagination .page-numbers {
	padding: 8px 12px;

	background: var(--ss-cream);
	color: var(--ss-charcoal);

	text-decoration: none;
}

.ss-blog-pagination .current {
	background: var(--ss-orange);
	color: var(--ss-mist);
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 760px) {

	/* SINGLE */

	.ss-blog-single__container {
		padding-top: var(--ss-space-md);
		padding-bottom: var(--ss-space-xl);
	}

	.ss-blog-single__header {
		margin-bottom: var(--ss-space-lg);

		text-align: right;
	}

	.ss-blog-single__header .ss-section-label,
	.ss-blog-single__header h1 {
		text-align: right;
	}

	.ss-blog-single__header h1 {
		font-size: var(--ss-h2);
	}


	/* HERO */

	.ss-blog-single__hero img {
		max-height: none;

		aspect-ratio: auto;

		object-fit: contain;
	}


	/* INFO */

	.ss-blog-info {
		padding: var(--ss-space-lg);
	}

.ss-blog-info__meta {
	display: flex;
	align-items: center;
	flex-wrap: nowrap;
	gap: 14px;

	width: 100%;
}

	.ss-blog-info__meta span::after {
		display: none;
	}

	.ss-blog-share {
		align-items: flex-start;
	}


	/* BODY */

	.ss-blog-single__body {
		display: flex;

		flex-direction: column;

		gap: var(--ss-space-xl);
	}

	.ss-blog-single__main {
		order: 1;

		width: 100%;
	}

	.ss-blog-related {
		order: 2;

		position: static;

		width: 100%;

		margin-top: var(--ss-space-xl);
	}

	.ss-blog-toc {
		position: static;

		width: 100%;
	}

	.ss-blog-content > p {
		text-align: right;
	}


	/* RELATED */

	.ss-blog-related__grid {
		grid-template-columns: 1fr;
	}

	.ss-blog-related__card img {
		aspect-ratio: 16 / 9;
	}


	/* ARCHIVE */

	.ss-blog-archive__hero {
		padding:
			var(--ss-space-xl)
			0
			var(--ss-space-lg);
	}

	.ss-blog-archive__list {
		padding:
			var(--ss-space-lg)
			0
			var(--ss-space-xl);
	}

	.ss-blog-list__item {
		grid-template-columns: 1fr;

		gap: var(--ss-space-md);

		padding: var(--ss-space-lg) 0;
	}

	.ss-blog-list__image img {
		aspect-ratio: 16 / 10;
	}
	.ss-blog-info__row {
	flex-direction: column;
	align-items: flex-start;
	gap: var(--ss-space-sm);
}

.ss-blog-info__meta,
.ss-blog-info__sources,
.ss-blog-share {
	width: 100%;

	padding: 0;

	border-right: 0;
}

.ss-blog-info__sources,
.ss-blog-share {
	padding-top: var(--ss-space-sm);

	border-top: 1px solid
		color-mix(
			in srgb,
			var(--ss-charcoal) 14%,
			transparent
		);
}
}