/* Moving Masharef issues carousel, reused from the legacy homepage. */
#masharef.masharef-showcase {
	overflow: hidden;
	padding: 112px 0 100px;
	background: #eef1f1;
}

#masharef .masharef-showcase__head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 36px;
	margin-bottom: 58px;
}

#masharef .masharef-showcase__head > div {
	max-width: 760px;
}

#masharef .masharef-showcase__head h2 {
	margin: 8px 0 0;
	color: var(--primary-dark);
	font-size: clamp(38px, 4vw, 62px);
	font-weight: 500;
	line-height: 1.3;
	letter-spacing: -1.2px;
}

#masharef .masharef-showcase__head p {
	max-width: 680px;
	margin: 14px 0 0;
	color: var(--muted);
	font-size: 16px;
	line-height: 1.9;
}

#masharef .masharef-showcase__head .btn {
	flex: 0 0 auto;
	border-color: rgba(18, 43, 89, 0.18);
	background: #fff;
}

.masharef-carousel {
	position: relative;
}

.masharef-carousel__viewport {
	position: relative;
	width: 100%;
	overflow: hidden;
	direction: ltr;
	cursor: grab;
	touch-action: pan-y;
	user-select: none;
	-webkit-user-select: none;
}

.masharef-carousel__viewport.is-dragging {
	cursor: grabbing;
}

.masharef-carousel__viewport::before,
.masharef-carousel__viewport::after {
	position: absolute;
	z-index: 3;
	top: 0;
	bottom: 0;
	width: clamp(24px, 5vw, 96px);
	content: "";
	pointer-events: none;
}

.masharef-carousel__viewport::before {
	left: 0;
	background: linear-gradient(90deg, #eef1f1, transparent);
}

.masharef-carousel__viewport::after {
	right: 0;
	background: linear-gradient(270deg, #eef1f1, transparent);
}

.masharef-carousel__track {
	display: flex;
	width: max-content;
	align-items: stretch;
	gap: 28px;
	padding: 0 16px;
	direction: ltr;
	will-change: transform;
}

.masharef-carousel__track.is-ready {
	visibility: visible;
}

.masharef-issue-card {
	display: flex;
	width: clamp(310px, 23vw, 430px);
	flex: 0 0 clamp(310px, 23vw, 430px);
	flex-direction: column;
	overflow: hidden;
	border: 1px solid rgba(18, 43, 89, 0.08);
	border-radius: 14px;
	background: var(--primary-dark);
	color: #fff;
	direction: rtl;
	text-decoration: none;
	transition: border-color 0.35s ease, transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}

.masharef-issue-card:hover,
.masharef-issue-card:focus-visible {
	border-color: rgba(181, 168, 155, 0.56);
	color: #fff;
	outline: 0;
	transform: translateY(-7px);
}

.masharef-issue-card__image {
	display: block;
	overflow: hidden;
	aspect-ratio: 1.08 / 1;
	background: #dce1e1;
}

.masharef-issue-card__image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: saturate(0.82) contrast(0.96);
	transform: scale(1.015);
	transition: filter 0.6s ease, transform 0.9s cubic-bezier(0.22, 1, 0.36, 1);
}

.masharef-issue-card:hover .masharef-issue-card__image img,
.masharef-issue-card:focus-visible .masharef-issue-card__image img {
	filter: saturate(1) contrast(1);
	transform: scale(1.06);
}

.masharef-issue-card__body {
	display: flex;
	min-height: 154px;
	flex-direction: column;
	align-items: flex-start;
	justify-content: space-between;
	gap: 20px;
	padding: 24px 28px 27px;
}

.masharef-issue-card__meta {
	display: flex;
	align-items: center;
	gap: 10px;
	color: var(--logo-soft);
	font-size: 13px;
}

.masharef-issue-card__meta small {
	padding-inline-start: 10px;
	border-inline-start: 1px solid rgba(255, 255, 255, 0.18);
	color: rgba(255, 255, 255, 0.52);
	font-size: 11px;
}

.masharef-issue-card__body strong {
	color: #fff;
	font-size: clamp(22px, 1.65vw, 29px);
	font-weight: 600;
	line-height: 1.42;
}

.masharef-carousel__progress {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin-top: 42px;
}

.masharef-carousel__progress span {
	display: block;
	width: 10px;
	height: 8px;
	border-radius: 999px;
	background: rgba(18, 43, 89, 0.12);
}

.masharef-carousel__progress span.is-active {
	position: relative;
	width: 68px;
	overflow: hidden;
	background: rgba(18, 43, 89, 0.14);
}

.masharef-carousel__progress span.is-active::after {
	position: absolute;
	inset: 0;
	border-radius: inherit;
	background: var(--logo);
	content: "";
	transform-origin: right;
	animation: mershad-masharef-progress 5s ease-in-out infinite alternate;
}

@keyframes mershad-masharef-progress {
	from {
		transform: scaleX(0.18);
	}
	to {
		transform: scaleX(1);
	}
}

@media (max-width: 900px) {
	#masharef.masharef-showcase {
		padding: 82px 0 74px;
	}

	#masharef .masharef-showcase__head {
		display: block;
		margin-bottom: 42px;
	}

	#masharef .masharef-showcase__head .btn {
		margin-top: 22px;
	}

	.masharef-carousel__track {
		gap: 18px;
		padding-inline: 14px;
	}

	.masharef-issue-card {
		width: min(82vw, 360px);
		flex-basis: min(82vw, 360px);
	}
}

@media (max-width: 520px) {
	#masharef .masharef-showcase__head h2 {
		font-size: 36px;
	}

	.masharef-issue-card__body {
		min-height: 142px;
		padding: 21px 22px 24px;
	}

	.masharef-issue-card__body strong {
		font-size: 23px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.masharef-issue-card,
	.masharef-issue-card__image img,
	.masharef-carousel__progress span.is-active::after {
		transition: none;
		animation: none;
	}
}
