/* =========================================================
   NEWS WEBSITE
   CATEGORY / ARCHIVE PAGE
   SARKARI RESULT INSPIRED EDITORIAL UI
   Compatible with supplied category.php markup
========================================================= */


/* =========================================================
   DESIGN SYSTEM
========================================================= */

:root {

	--cat-bg: #f3f5f7;
	--cat-surface: #ffffff;
	--cat-surface-soft: #f8f9fa;

	--cat-primary: #d71920;
	--cat-primary-dark: #b51218;
	--cat-primary-light: #fff0f1;

	--cat-heading: #17191c;
	--cat-text: #30343a;
	--cat-muted: #66707a;
	--cat-light-text: #89919a;

	--cat-border: #dfe3e7;
	--cat-border-dark: #cbd0d5;

	--cat-success: #168348;

	--cat-shadow: 0 2px 8px rgba(0, 0, 0, .045);
	--cat-shadow-hover: 0 7px 18px rgba(0, 0, 0, .09);

	--cat-radius: 7px;

	--cat-container: 1240px;
}


/* =========================================================
   MAIN PAGE
   PHP:
   <main class="category-main news-category-page">
========================================================= */

.news-category-page {

	width: 100%;

	padding: 18px 0 50px;

	background: var(--cat-bg);

	color: var(--cat-text);

	box-sizing: border-box;
}

.news-category-page *,
.news-category-page *::before,
.news-category-page *::after {
	box-sizing: border-box;
}


/* =========================================================
   CONTAINER
========================================================= */

.news-category-page .category-container {

	width: min(
		calc(100% - 30px),
		var(--cat-container)
	);

	margin-left: auto;
	margin-right: auto;
}


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

.news-category-page .category-breadcrumb {

	display: flex;

	align-items: center;

	flex-wrap: wrap;

	gap: 6px;

	margin: 0 0 14px;

	padding: 0;

	color: var(--cat-light-text);

	font-size: 12px;

	line-height: 1.5;
}

.news-category-page .category-breadcrumb a {

	color: var(--cat-muted);

	text-decoration: none;

	transition: color .2s ease;
}

.news-category-page .category-breadcrumb a:hover {
	color: var(--cat-primary);
}

.news-category-page .category-breadcrumb .breadcrumb-separator {

	color: #a3a9af;

	font-size: 13px;
}

.news-category-page .category-breadcrumb .breadcrumb-current {

	color: var(--cat-heading);

	font-weight: 700;
}


/* =========================================================
   CATEGORY HEADER
========================================================= */

.news-category-page .category-header {

	position: relative;

	overflow: hidden;

	margin: 0 0 22px;

	background: var(--cat-surface);

	border: 1px solid var(--cat-border);

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

	box-shadow: var(--cat-shadow);
}

.news-category-page .category-header::before {

	content: "";

	position: absolute;

	top: 0;
	left: 0;

	width: 100%;
	height: 4px;

	background: var(--cat-primary);

	z-index: 2;
}

.news-category-page .category-header::after {

	content: "";

	position: absolute;

	right: -100px;
	top: -110px;

	width: 240px;
	height: 240px;

	border-radius: 50%;

	background: rgba(215, 25, 32, .035);

	pointer-events: none;
}


/* =========================================================
   HEADER CONTENT
========================================================= */

.news-category-page .category-header-content {

	position: relative;

	z-index: 3;

	padding: 25px 28px 22px;
}


/* =========================================================
   CATEGORY LABEL
========================================================= */

.news-category-page .category-label {

	display: inline-flex;

	align-items: center;

	gap: 7px;

	margin: 0 0 9px;

	padding: 5px 9px;

	background: var(--cat-primary-light);

	border: 1px solid #ffd5d7;

	border-radius: 4px;

	color: var(--cat-primary-dark);

	font-size: 10px;

	font-weight: 800;

	letter-spacing: .05em;

	line-height: 1.2;

	text-transform: uppercase;
}

.news-category-page .category-label-icon {

	display: inline-flex;

	align-items: center;

	justify-content: center;

	width: 16px;
	height: 16px;

	border-radius: 3px;

	background: var(--cat-primary);

	color: #fff;

	font-size: 8px;

	line-height: 1;
}


/* =========================================================
   CATEGORY TITLE
========================================================= */

.news-category-page .category-title {

	max-width: 900px;

	margin: 0;

	color: var(--cat-heading);

	font-size: clamp(28px, 4vw, 42px);

	font-weight: 850;

	line-height: 1.15;

	letter-spacing: -.035em;
}


/* =========================================================
   CATEGORY DESCRIPTION
========================================================= */

.news-category-page .category-description {

	max-width: 850px;

	margin: 11px 0 0;

	color: var(--cat-muted);

	font-size: 13px;

	line-height: 1.7;
}

.news-category-page .category-description p {
	margin: 0;
}


/* =========================================================
   OLD META
   PHP still contains it but design intentionally hides it
========================================================= */

.news-category-page .category-meta,
.news-category-page .category-meta-divider {

	display: none;
}


/* =========================================================
   CATEGORY SLIDER WRAPPER
========================================================= */

.news-category-page .category-slider-wrap {

	position: relative;

	z-index: 4;

	margin: 0 20px;

	padding: 13px 0 14px;

	border-top: 1px solid var(--cat-border);
}


/* =========================================================
   CATEGORY SLIDER HEADING
========================================================= */

.news-category-page .category-slider-heading {

	display: flex;

	align-items: center;

	gap: 7px;

	margin: 0 0 9px;

	color: var(--cat-heading);

	font-size: 10px;

	font-weight: 800;

	letter-spacing: .03em;
}

.news-category-page .category-slider-heading .category-slider-icon {

	display: inline-flex;

	align-items: center;

	justify-content: center;

	width: 19px;
	height: 19px;

	border-radius: 3px;

	background: var(--cat-primary);

	color: #fff;

	font-size: 9px;
}


/* =========================================================
   SLIDER
========================================================= */

.news-category-page .category-slider {

	position: relative;

	width: 100%;

	overflow: hidden;

	mask-image:
		linear-gradient(
			90deg,
			transparent,
			#000 3%,
			#000 97%,
			transparent
		);

	-webkit-mask-image:
		linear-gradient(
			90deg,
			transparent,
			#000 3%,
			#000 97%,
			transparent
		);
}

.news-category-page .category-slider-track {

	display: flex;

	align-items: center;

	gap: 7px;

	width: max-content;

	animation:
		categoryAutoScroll 70s linear infinite;
}

.news-category-page .category-slider:hover .category-slider-track {

	animation-play-state: paused;
}


/* =========================================================
   CATEGORY SLIDER ITEM
========================================================= */

.news-category-page .category-slider-item {

	display: inline-flex;

	align-items: center;

	gap: 6px;

	flex: 0 0 auto;

	min-height: 34px;

	padding: 6px 9px;

	background: #fff;

	border: 1px solid var(--cat-border);

	border-radius: 4px;

	color: var(--cat-text);

	font-size: 10px;

	font-weight: 700;

	line-height: 1.2;

	text-decoration: none;

	white-space: nowrap;

	box-shadow: 0 1px 4px rgba(0, 0, 0, .025);

	transition:
		background .2s ease,
		border-color .2s ease,
		color .2s ease,
		transform .2s ease;
}

.news-category-page .category-slider-item:hover {

	transform: translateY(-1px);

	background: var(--cat-primary-light);

	border-color: #f1bfc2;

	color: var(--cat-primary-dark);
}


/* =========================================================
   IMPORTANT:
   PHP USES .category-slider-icon
   NOT .category-slider-om
========================================================= */

.news-category-page .category-slider-item .category-slider-icon {

	display: inline-flex;

	align-items: center;

	justify-content: center;

	width: 18px;
	height: 18px;

	flex: 0 0 18px;

	border-radius: 3px;

	background: #f0f2f4;

	color: #69717a;

	font-size: 7px;

	line-height: 1;

	transition:
		background .2s ease,
		color .2s ease;
}

.news-category-page .category-slider-item:hover .category-slider-icon {

	background: var(--cat-primary);

	color: #fff;
}


/* =========================================================
   CURRENT CATEGORY
========================================================= */

.news-category-page .category-slider-item.is-current {

	background: var(--cat-primary);

	border-color: var(--cat-primary);

	color: #fff;

	box-shadow: 0 3px 8px rgba(215, 25, 32, .16);
}

.news-category-page .category-slider-item.is-current .category-slider-icon {

	background: rgba(255,255,255,.18);

	color: #fff;
}


/* =========================================================
   CATEGORY NAME
========================================================= */

.news-category-page .category-slider-name {

	max-width: 170px;

	overflow: hidden;

	text-overflow: ellipsis;

	line-height: 1.3;
}


/* =========================================================
   CATEGORY COUNT
========================================================= */

.news-category-page .category-slider-count {

	display: inline-flex;

	align-items: center;

	justify-content: center;

	min-width: 19px;
	height: 17px;

	padding: 0 5px;

	border-radius: 3px;

	background: #f0f2f4;

	color: #69727c;

	font-size: 8px;

	font-weight: 800;
}

.news-category-page .category-slider-item.is-current .category-slider-count {

	background: rgba(255,255,255,.18);

	color: #fff;
}


/* =========================================================
   AUTO SCROLL
========================================================= */

@keyframes categoryAutoScroll {

	0% {
		transform: translateX(0);
	}

	100% {
		transform: translateX(-50%);
	}
}


/* =========================================================
   MAIN LAYOUT
========================================================= */

.news-category-page .category-layout {

	display: grid;

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

	gap: 24px;

	align-items: start;
}

.news-category-page .category-main-content {
	min-width: 0;
}


/* =========================================================
   SECTION HEADING
========================================================= */

.news-category-page .category-section-heading {

	display: flex;

	align-items: flex-end;

	justify-content: space-between;

	gap: 15px;

	margin: 0 0 14px;

	padding: 0 0 10px;

	border-bottom: 2px solid var(--cat-heading);
}

.news-category-page .category-section-kicker {

	display: block;

	margin: 0 0 3px;

	color: var(--cat-primary);

	font-size: 9px;

	font-weight: 850;

	letter-spacing: .11em;

	line-height: 1.2;

	text-transform: uppercase;
}

.news-category-page .category-section-heading h2 {

	margin: 0;

	color: var(--cat-heading);

	font-size: 21px;

	font-weight: 850;

	line-height: 1.3;

	letter-spacing: -.025em;
}

.news-category-page .category-post-count {

	flex: 0 0 auto;

	color: var(--cat-muted);

	font-size: 10px;

	font-weight: 700;
}


/* =========================================================
   POSTS GRID
========================================================= */

.news-category-page .category-posts {

	display: grid;

	grid-template-columns:
		repeat(2, minmax(0, 1fr));

	gap: 15px;
}


/* =========================================================
   NEWS CARD
========================================================= */

.news-category-page .category-card {

	min-width: 0;

	overflow: hidden;

	background: var(--cat-surface);

	border: 1px solid var(--cat-border);

	border-radius: 7px;

	box-shadow: var(--cat-shadow);

	transition:
		transform .2s ease,
		box-shadow .2s ease,
		border-color .2s ease;
}

.news-category-page .category-card:hover {

	transform: translateY(-2px);

	border-color: var(--cat-border-dark);

	box-shadow: var(--cat-shadow-hover);
}


/* =========================================================
   CARD IMAGE
========================================================= */

.news-category-page .category-card-image {

	position: relative;

	display: block;

	overflow: hidden;

	aspect-ratio: 16 / 9;

	background: #e9ecef;

	text-decoration: none;
}

.news-category-page .category-card-image img {

	display: block;

	width: 100% !important;
	height: 100% !important;

	max-width: none !important;

	object-fit: cover;

	transition:
		transform .35s ease,
		filter .25s ease;
}

.news-category-page .category-card:hover .category-card-image img {

	transform: scale(1.035);

	filter: brightness(.95);
}


/* =========================================================
   IMAGE OVERLAY
========================================================= */

.news-category-page .category-image-overlay {

	position: absolute;

	right: 9px;
	bottom: 9px;

	padding: 5px 7px;

	border-radius: 3px;

	background: rgba(15, 17, 20, .88);

	color: #fff;

	font-size: 8px;

	font-weight: 800;

	opacity: 0;

	transform: translateY(4px);

	transition:
		opacity .2s ease,
		transform .2s ease;
}

.news-category-page .category-card:hover .category-image-overlay {

	opacity: 1;

	transform: translateY(0);
}


/* =========================================================
   NO IMAGE
========================================================= */

.news-category-page .category-no-image {

	display: flex;

	align-items: center;

	justify-content: center;

	width: 100%;
	height: 100%;

	background:
		linear-gradient(
			135deg,
			#eef0f2,
			#dfe3e7
		);

	color: #7d858e;

	font-size: 25px;

	font-weight: 800;
}

.news-category-page .category-no-image span {
	font-size: 25px;
}


/* =========================================================
   CARD BODY
========================================================= */

.news-category-page .category-card-body {

	padding: 13px 14px 13px;
}


/* =========================================================
   CARD META
========================================================= */

.news-category-page .category-card-meta {

	display: flex;

	align-items: center;

	flex-wrap: wrap;

	gap: 5px;

	margin: 0 0 7px;

	color: var(--cat-light-text);

	font-size: 8.5px;

	line-height: 1.4;
}

.news-category-page .category-card-meta > span[aria-hidden="true"] {

	color: #b9bec3;
}


/* =========================================================
   CARD CATEGORY
========================================================= */

.news-category-page .category-card-category {

	display: inline-flex;

	align-items: center;

	margin: 0 0 6px;

	padding: 3px 6px;

	background: var(--cat-primary-light);

	border-radius: 3px;

	color: var(--cat-primary-dark);

	font-size: 8px;

	font-weight: 800;

	line-height: 1.2;

	text-decoration: none;

	text-transform: uppercase;

	transition:
		background .2s ease,
		color .2s ease;
}

.news-category-page .category-card-category:hover {

	background: var(--cat-primary);

	color: #fff;
}


/* =========================================================
   CARD TITLE
========================================================= */

.news-category-page .category-card-title {

	margin: 0;

	font-size: 16px;

	font-weight: 800;

	line-height: 1.42;

	letter-spacing: -.015em;
}

.news-category-page .category-card-title a {

	display: -webkit-box;

	-webkit-box-orient: vertical;

	-webkit-line-clamp: 3;

	overflow: hidden;

	color: var(--cat-heading);

	text-decoration: none;

	transition: color .2s ease;
}

.news-category-page .category-card-title a:hover {

	color: var(--cat-primary);
}


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

.news-category-page .category-card-excerpt {

	display: -webkit-box;

	-webkit-box-orient: vertical;

	-webkit-line-clamp: 2;

	overflow: hidden;

	margin-top: 7px;

	color: var(--cat-muted);

	font-size: 10.5px;

	line-height: 1.6;
}

.news-category-page .category-card-excerpt p {
	margin: 0;
}


/* =========================================================
   CARD FOOTER
========================================================= */

.news-category-page .category-card-footer {

	display: flex;

	align-items: center;

	justify-content: space-between;

	margin-top: 11px;

	padding-top: 9px;

	border-top: 1px solid var(--cat-border);
}

.news-category-page .category-read-more {

	display: inline-flex;

	align-items: center;

	gap: 6px;

	min-height: 28px;

	color: var(--cat-primary);

	font-size: 9px;

	font-weight: 800;

	text-decoration: none;
}

.news-category-page .category-read-arrow {

	display: inline-flex;

	align-items: center;

	justify-content: center;

	width: 18px;
	height: 18px;

	border-radius: 50%;

	background: var(--cat-primary-light);

	transition:
		transform .2s ease,
		background .2s ease;
}

.news-category-page .category-read-more:hover {

	color: var(--cat-primary-dark);
}

.news-category-page .category-read-more:hover .category-read-arrow {

	transform: translateX(3px);

	background: #ffd9db;
}


/* =========================================================
   SIDEBAR
========================================================= */

.news-category-page .category-sidebar {

	position: sticky;

	top: 20px;

	min-width: 0;
}


/* =========================================================
   SIDEBAR WIDGET
========================================================= */

.news-category-page .category-widget {

	margin: 0 0 14px;

	padding: 15px;

	background: var(--cat-surface);

	border: 1px solid var(--cat-border);

	border-radius: 7px;

	box-shadow: var(--cat-shadow);
}

.news-category-page .category-widget:last-child {
	margin-bottom: 0;
}


/* =========================================================
   WIDGET HEADING
========================================================= */

.news-category-page .category-widget-heading {

	display: flex;

	align-items: center;

	gap: 7px;

	margin: 0 0 12px;

	padding: 0 0 9px;

	border-bottom: 1px solid var(--cat-border);
}

.news-category-page .category-widget-heading h2 {

	margin: 0;

	color: var(--cat-heading);

	font-size: 15px;

	font-weight: 850;

	line-height: 1.3;

	letter-spacing: -.01em;
}

.news-category-page .category-widget-icon {

	display: inline-flex;

	align-items: center;

	justify-content: center;

	width: 24px;
	height: 24px;

	flex: 0 0 24px;

	border-radius: 4px;

	background: var(--cat-primary);

	color: #fff;

	font-size: 10px;
}


/* =========================================================
   SEARCH FORM
========================================================= */

.news-category-page .category-search-widget form {

	display: flex;

	align-items: stretch;

	gap: 6px;

	margin: 0;
}

.news-category-page .category-search-widget input[type="search"],
.news-category-page .category-search-widget input[type="text"] {

	min-width: 0;
	flex: 1;

	height: 36px;

	padding: 0 10px;

	background: #fff;

	border: 1px solid var(--cat-border);

	border-radius: 4px;

	color: var(--cat-text);

	font-size: 11px;

	outline: none;
}

.news-category-page .category-search-widget input:focus {

	border-color: var(--cat-primary);

	box-shadow: 0 0 0 2px rgba(215,25,32,.08);
}

.news-category-page .category-search-widget button,
.news-category-page .category-search-widget input[type="submit"] {

	min-width: 70px;

	height: 36px;

	padding: 0 10px;

	background: var(--cat-primary);

	border: 1px solid var(--cat-primary);

	border-radius: 4px;

	color: #fff;

	font-size: 10px;

	font-weight: 800;

	cursor: pointer;

	transition: background .2s ease;
}

.news-category-page .category-search-widget button:hover,
.news-category-page .category-search-widget input[type="submit"]:hover {

	background: var(--cat-primary-dark);

	border-color: var(--cat-primary-dark);
}


/* =========================================================
   SIDEBAR LATEST POSTS
========================================================= */

.news-category-page .category-sidebar-post {

	display: flex;

	align-items: center;

	gap: 9px;

	min-width: 0;
}

.news-category-page .category-sidebar-post + .category-sidebar-post {

	margin-top: 10px;

	padding-top: 10px;

	border-top: 1px solid var(--cat-border);
}


/* =========================================================
   SIDEBAR THUMB
========================================================= */

.news-category-page .category-sidebar-thumb {

	display: flex;

	align-items: center;

	justify-content: center;

	width: 72px;
	height: 48px;

	flex: 0 0 72px;

	overflow: hidden;

	background: #e9ecef;

	border: 1px solid var(--cat-border);

	border-radius: 4px;

	text-decoration: none;
}

.news-category-page .category-sidebar-thumb img {

	display: block;

	width: 100% !important;
	height: 100% !important;

	max-width: none !important;

	object-fit: cover;

	transition: transform .3s ease;
}

.news-category-page .category-sidebar-thumb:hover img {
	transform: scale(1.05);
}

.news-category-page .category-sidebar-thumb > span {

	color: #7e8790;

	font-size: 16px;
}


/* =========================================================
   SIDEBAR POST INFO
========================================================= */

.news-category-page .category-sidebar-post-info {

	min-width: 0;

	flex: 1;
}

.news-category-page .category-sidebar-post-title {

	display: -webkit-box;

	-webkit-box-orient: vertical;

	-webkit-line-clamp: 2;

	overflow: hidden;

	color: var(--cat-text);

	font-size: 10px;

	font-weight: 750;

	line-height: 1.45;

	text-decoration: none;
}

.news-category-page .category-sidebar-post-title:hover {
	color: var(--cat-primary);
}

.news-category-page .category-sidebar-post-info time {

	display: block;

	margin-top: 3px;

	color: var(--cat-light-text);

	font-size: 8px;
}


/* =========================================================
   TRENDING
========================================================= */

.news-category-page .category-trending-list {

	display: flex;

	flex-direction: column;

	gap: 5px;
}

.news-category-page .category-trending-item {

	display: flex;

	align-items: flex-start;

	gap: 8px;

	padding: 8px;

	background: #f7f8f9;

	border: 1px solid transparent;

	border-radius: 4px;

	text-decoration: none;

	transition:
		background .2s ease,
		border-color .2s ease,
		transform .2s ease;
}

.news-category-page .category-trending-item:hover {

	background: #fff2f2;

	border-color: #ffd5d7;

	transform: translateX(2px);
}

.news-category-page .category-trending-number {

	display: flex;

	align-items: center;

	justify-content: center;

	width: 21px;
	height: 21px;

	flex: 0 0 21px;

	border-radius: 3px;

	background: var(--cat-primary);

	color: #fff;

	font-size: 8px;

	font-weight: 850;
}

.news-category-page .category-trending-content {

	min-width: 0;
}

.news-category-page .category-trending-content strong {

	display: -webkit-box;

	-webkit-box-orient: vertical;

	-webkit-line-clamp: 2;

	overflow: hidden;

	color: var(--cat-text);

	font-size: 10.5px;

	font-weight: 750;

	line-height: 1.45;
}

.news-category-page .category-trending-content small {

	display: block;

	margin-top: 3px;

	color: var(--cat-light-text);

	font-size: 8px;
}


/* =========================================================
   POPULAR CATEGORY LIST
========================================================= */

.news-category-page .category-list {

	display: flex;

	flex-direction: column;

	gap: 4px;
}

.news-category-page .category-list-item {

	display: flex;

	align-items: center;

	justify-content: space-between;

	gap: 8px;

	padding: 7px 8px;

	background: #f7f8f9;

	border-radius: 4px;

	color: var(--cat-muted);

	font-size: 10px;

	font-weight: 650;

	text-decoration: none;

	transition:
		background .2s ease,
		color .2s ease,
		padding-left .2s ease;
}

.news-category-page .category-list-item:hover {

	padding-left: 11px;

	background: #fff1f1;

	color: var(--cat-primary);
}

.news-category-page .category-list-item b {

	display: inline-flex;

	align-items: center;

	justify-content: center;

	min-width: 22px;

	height: 18px;

	padding: 0 5px;

	background: #e8ebee;

	border-radius: 3px;

	color: #68717b;

	font-size: 8px;
}


/* =========================================================
   CURRENT CATEGORY
========================================================= */

.news-category-page .current-category-widget {

	background:
		linear-gradient(
			135deg,
			#fff,
			#fff7f7
		);

	border-color: #eadfe0;
}

.news-category-page .category-current-info strong {

	display: block;

	color: var(--cat-primary);

	font-size: 14px;

	font-weight: 850;
}

.news-category-page .category-current-info p {

	margin: 6px 0 0;

	color: var(--cat-muted);

	font-size: 10px;

	line-height: 1.6;
}


/* =========================================================
   CONTACT WIDGET
========================================================= */

.news-category-page .category-contact-widget {

	background:
		linear-gradient(
			135deg,
			#fff,
			#fff5f5
		);
}

.news-category-page .category-contact-widget p {

	margin: 0;

	color: var(--cat-muted);

	font-size: 10px;

	line-height: 1.65;
}

.news-category-page .category-contact-button {

	display: inline-flex;

	align-items: center;

	justify-content: center;

	gap: 6px;

	min-height: 32px;

	margin-top: 11px;

	padding: 7px 11px;

	background: var(--cat-primary);

	border-radius: 4px;

	color: #fff !important;

	font-size: 10px;

	font-weight: 800;

	text-decoration: none;

	box-shadow: 0 4px 10px rgba(215,25,32,.14);

	transition:
		background .2s ease,
		transform .2s ease;
}

.news-category-page .category-contact-button:hover {

	background: var(--cat-primary-dark);

	transform: translateY(-1px);
}


/* =========================================================
   SIDEBAR EMPTY
========================================================= */

.news-category-page .category-sidebar-empty {

	margin: 0;

	color: var(--cat-light-text);

	font-size: 10px;

	line-height: 1.6;
}


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

.news-category-page .category-pagination {

	margin-top: 24px;
}

.news-category-page .category-pagination .nav-links {

	display: flex;

	align-items: center;

	justify-content: center;

	flex-wrap: wrap;

	gap: 4px;
}

.news-category-page .category-pagination .page-numbers {

	display: inline-flex;

	align-items: center;

	justify-content: center;

	min-width: 33px;
	height: 33px;

	padding: 0 8px;

	background: #fff;

	border: 1px solid var(--cat-border);

	border-radius: 4px;

	color: var(--cat-muted);

	font-size: 10px;

	font-weight: 750;

	text-decoration: none;

	transition:
		background .2s ease,
		color .2s ease,
		border-color .2s ease;
}

.news-category-page .category-pagination .page-numbers:hover {

	background: #fff1f1;

	border-color: #efc2c4;

	color: var(--cat-primary);
}

.news-category-page .category-pagination .page-numbers.current {

	background: var(--cat-primary);

	border-color: var(--cat-primary);

	color: #fff;
}


/* =========================================================
   EDITORIAL SECTION
========================================================= */

.news-category-page .category-editorial {

	display: grid;

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

	gap: 13px;

	align-items: start;

	margin-top: 30px;

	padding: 18px;

	background: #fff;

	border: 1px solid var(--cat-border);

	border-radius: 7px;

	box-shadow: var(--cat-shadow);
}

.news-category-page .category-editorial-icon {

	display: flex;

	align-items: center;

	justify-content: center;

	width: 42px;
	height: 42px;

	border-radius: 5px;

	background: var(--cat-primary-light);

	color: var(--cat-primary);

	font-size: 15px;
}

.news-category-page .category-editorial h2 {

	margin: 0;

	color: var(--cat-heading);

	font-size: 16px;

	font-weight: 800;

	line-height: 1.4;
}

.news-category-page .category-editorial p {

	margin: 6px 0 0;

	color: var(--cat-muted);

	font-size: 10.5px;

	line-height: 1.7;
}


/* =========================================================
   EMPTY STATE
========================================================= */

.news-category-page .category-empty {

	padding: 50px 25px;

	text-align: center;

	background: #fff;

	border: 1px solid var(--cat-border);

	border-radius: 7px;

	box-shadow: var(--cat-shadow);
}

.news-category-page .category-empty-icon {

	display: flex;

	align-items: center;

	justify-content: center;

	width: 56px;
	height: 56px;

	margin: 0 auto 13px;

	background: var(--cat-primary-light);

	border-radius: 50%;

	color: var(--cat-primary);

	font-size: 21px;

	font-weight: 800;
}

.news-category-page .category-empty h2 {

	margin: 0;

	color: var(--cat-heading);

	font-size: 18px;

	font-weight: 800;
}

.news-category-page .category-empty p {

	max-width: 450px;

	margin: 7px auto 0;

	color: var(--cat-muted);

	font-size: 10.5px;

	line-height: 1.7;
}

.news-category-page .category-home-button {

	display: inline-flex;

	align-items: center;

	gap: 6px;

	margin-top: 16px;

	padding: 8px 12px;

	background: var(--cat-primary);

	border-radius: 4px;

	color: #fff !important;

	font-size: 10px;

	font-weight: 800;

	text-decoration: none;

	transition:
		background .2s ease,
		transform .2s ease;
}

.news-category-page .category-home-button:hover {

	background: var(--cat-primary-dark);

	transform: translateY(-1px);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1050px) {

	.news-category-page .category-layout {

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

		gap: 20px;
	}

	.news-category-page .category-posts {
		gap: 13px;
	}

	.news-category-page .category-card-title {
		font-size: 15px;
	}
}


/* =========================================================
   SMALL TABLET
========================================================= */

@media (max-width: 850px) {

	.news-category-page .category-layout {

		grid-template-columns: 1fr;
	}

	.news-category-page .category-sidebar {

		position: static;

		display: grid;

		grid-template-columns:
			repeat(2, minmax(0, 1fr));

		gap: 13px;
	}

	.news-category-page .category-widget {
		margin-bottom: 0;
	}
}


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

@media (max-width: 650px) {

	.news-category-page {

		padding-top: 14px;

		padding-bottom: 35px;
	}

	.news-category-page .category-container {

		width: min(
			calc(100% - 20px),
			var(--cat-container)
		);
	}

	.news-category-page .category-breadcrumb {

		margin-bottom: 10px;

		font-size: 10px;
	}

	.news-category-page .category-header {

		margin-bottom: 17px;

		border-radius: 6px;
	}

	.news-category-page .category-header-content {

		padding: 22px 15px 18px;
	}

	.news-category-page .category-label {

		font-size: 8.5px;

		margin-bottom: 8px;
	}

	.news-category-page .category-title {

		font-size: 27px;

		line-height: 1.17;
	}

	.news-category-page .category-description {

		margin-top: 9px;

		font-size: 11px;

		line-height: 1.65;
	}

	.news-category-page .category-slider-wrap {

		margin: 0 14px;

		padding: 12px 0 13px;
	}

	.news-category-page .category-slider-heading {

		font-size: 9px;
	}

	.news-category-page .category-slider-track {

		gap: 5px;

		animation-duration: 65s;
	}

	.news-category-page .category-slider-item {

		min-height: 31px;

		padding: 5px 7px;

		font-size: 8.5px;
	}

	.news-category-page .category-slider-item .category-slider-icon {

		width: 18px;
		height: 18px;

		flex-basis: 18px;
	}

	.news-category-page .category-slider-name {

		max-width: 120px;
	}

	.news-category-page .category-slider-count {

		min-width: 18px;

		height: 16px;

		font-size: 7px;
	}

	.news-category-page .category-section-heading {

		align-items: flex-start;

		flex-direction: column;

		gap: 4px;

		margin-bottom: 12px;

		padding-bottom: 9px;
	}

	.news-category-page .category-section-heading h2 {

		font-size: 18px;
	}

	.news-category-page .category-post-count {

		font-size: 9px;
	}

	.news-category-page .category-posts {

		grid-template-columns: 1fr;

		gap: 12px;
	}

	.news-category-page .category-card {

		border-radius: 6px;
	}

	.news-category-page .category-card-body {

		padding: 12px;
	}

	.news-category-page .category-card-title {

		font-size: 15.5px;

		line-height: 1.42;
	}

	.news-category-page .category-card-excerpt {

		font-size: 10px;
	}

	.news-category-page .category-sidebar {

		grid-template-columns: 1fr;

		gap: 12px;

		margin-top: 2px;
	}

	.news-category-page .category-widget {

		padding: 13px;

		border-radius: 6px;
	}

	.news-category-page .category-widget-heading h2 {

		font-size: 14px;
	}

	.news-category-page .category-editorial {

		grid-template-columns: 1fr;

		gap: 10px;

		margin-top: 24px;

		padding: 15px;
	}

	.news-category-page .category-editorial-icon {

		width: 36px;
		height: 36px;

		font-size: 13px;
	}

	.news-category-page .category-editorial h2 {

		font-size: 15px;
	}

	.news-category-page .category-editorial p {

		font-size: 10px;
	}
}


/* =========================================================
   VERY SMALL MOBILE
========================================================= */

@media (max-width: 380px) {

	.news-category-page .category-container {

		width: calc(100% - 16px);
	}

	.news-category-page .category-header-content {

		padding: 20px 13px 17px;
	}

	.news-category-page .category-title {

		font-size: 24px;
	}

	.news-category-page .category-description {

		font-size: 10.5px;
	}

	.news-category-page .category-slider-wrap {

		margin-left: 11px;
		margin-right: 11px;
	}

	.news-category-page .category-slider-item {

		min-height: 30px;

		font-size: 8px;
	}

	.news-category-page .category-slider-name {

		max-width: 100px;
	}

	.news-category-page .category-card-title {

		font-size: 14.5px;
	}

	.news-category-page .category-widget-heading h2 {

		font-size: 13.5px;
	}
}


/* =========================================================
   GLOBAL TYPOGRAPHY PROTECTION
========================================================= */

.news-category-page h1,
.news-category-page h2,
.news-category-page h3,
.news-category-page p {

	word-wrap: break-word;

	overflow-wrap: break-word;
}


/* =========================================================
   IMAGE PROTECTION
========================================================= */

.news-category-page img {

	image-rendering: auto;
}


/* =========================================================
   LONG CONTENT PROTECTION
========================================================= */

.news-category-page .category-card,
.news-category-page .category-sidebar-post,
.news-category-page .category-trending-item,
.news-category-page .category-list-item {

	overflow-wrap: anywhere;
}


/* =========================================================
   ACCESSIBILITY
========================================================= */

.news-category-page a:focus-visible {

	outline: 2px solid var(--cat-primary);

	outline-offset: 3px;

	border-radius: 3px;
}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

	.news-category-page *,
	.news-category-page *::before,
	.news-category-page *::after {

		transition: none !important;

		animation: none !important;

		scroll-behavior: auto !important;
	}

	.news-category-page .category-slider-track {

		transform: none !important;

		animation: none !important;
	}
}


/* =========================================================
   PRINT
========================================================= */

@media print {

	.news-category-page {

		background: #fff;
	}

	.news-category-page .category-sidebar {

		display: none;
	}

	.news-category-page .category-layout {

		display: block;
	}

	.news-category-page .category-card {

		box-shadow: none;

		break-inside: avoid;
	}

	.news-category-page .category-header {

		box-shadow: none;
	}

	.news-category-page .category-slider-wrap {

		display: none;
	}
}


/* =========================================================
   TOUCH TARGETS
========================================================= */

@media (max-width: 650px) {

	.news-category-page .category-read-more,
	.news-category-page .category-contact-button,
	.news-category-page .category-home-button {

		min-height: 32px;
	}
}