﻿.tkt-why {
	--accent: #6c757d; /* رمادي هادئ بدلاً من الأصفر */
	--ink: #0b1220;
	--muted: #475569;
	--line: rgba(2,6,23,.12);
	--bg-light: #f8f9fa;
	padding: clamp(40px,6vw,90px) 0;
}

.tkt-shell {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 16px;
}

.tkt-title {
	margin: 0 0 12px;
	font-size: clamp(24px,3vw,36px);
	font-weight: 900;
	text-align: center;
}

.tkt-dot {
	color: #ffd84d; /* نقطة ذهبية فقط */
}

.tkt-grid {
	display: grid;
	gap: 32px; /* زيادة المسافة بين الكروت */
}

/* الكارد الأساسي - مع حجم أكبر */
.tkt-card {
	display: flex;
	align-items: center;
	background: #fff;
	border: 1px solid var(--line);
	border-radius: 20px; /* زاوية أكبر */
	overflow: hidden;
	box-shadow: 0 12px 30px rgba(2,6,23,.12); /* ظل أكبر */
	transition: all 0.4s ease;
	padding: 0;
	direction: rtl;
	min-height: 140px; /* ارتفاع أدنى أكبر */
}

.tkt-card:hover {
	transform: translateY(-6px);
	box-shadow: 0 20px 50px rgba(2,6,23,.18);
	border-color: var(--accent);
}

/* منطقة الأيقونة - حجم أكبر */
.tkt-stub {
	width: 140px; /* عرض أكبر */
	height: 140px; /* ارتفاع أكبر */
	background: linear-gradient(135deg, var(--accent), #ffeaa1); /* خلفية ذهبية متدرجة */
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	border-radius: 0;
	position: relative;
}

/* تأثير إضافي للخلفية */
.tkt-stub::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 80%;
	height: 80%;
	background: rgba(255, 255, 255, 0.2);
	border-radius: 50%;
	opacity: 0;
	transition: all 0.3s ease;
}

.tkt-card:hover .tkt-stub::before {
	opacity: 1;
	width: 90%;
	height: 90%;
}

/* الأيقونة - أكبر وأوضح */
.tkt-icon {
	width: 60px; /* حجم أكبر */
	height: 60px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(255, 255, 255, 0.9); /* خلفية بيضاء شبه شفافة */
	color: var(--accent);
	font-size: 32px; /* أيقونة أكبر */
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
	transition: all 0.3s ease;
	position: relative;
	z-index: 2;
}

.tkt-card:hover .tkt-icon {
	background: white;
	transform: scale(1.1);
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
}

/* المحتوى - مساحة أكبر */
.tkt-body {
	flex: 1;
	padding: 32px 28px; /* padding أكبر */
	display: flex;
	flex-direction: column;
	gap: 16px; /* مسافة أكبر بين العناصر */
}

.tkt-card-title {
	margin: 0;
	font-weight: 800;
	font-size: 1.4rem; /* خط أكبر للعنوان */
	color: var(--ink);
	line-height: 1.3;
}

.tkt-card-desc {
	margin: 0;
	color: var(--muted);
	line-height: 1.6;
	font-size: 1.1rem; /* خط أكبر للوصف */
}

/* إخفاء العناصر القديمة تماماً */
.tkt-no,
.tkt-cut,
.tkt-in,
.tkt-out,
.tkt-image {
	display: none !important;
}

/* ريسبونسيف محسن */
@media (min-width: 900px) {
	.tkt-grid {
		grid-template-columns: 1fr 1fr;
		gap: 40px; /* مسافة أكبر على الديسكتوب */
	}
}

@media (max-width: 768px) {
	.tkt-stub {
		width: 120px; /* حجم متوسط للتابلت */
		height: 120px;
	}
	
	.tkt-icon {
		width: 50px;
		height: 50px;
		font-size: 28px;
	}
	
	.tkt-body {
		padding: 28px 24px;
	}
	
	.tkt-card-title {
		font-size: 1.3rem;
	}
	
	.tkt-card-desc {
		font-size: 1rem;
	}

	.tkt-card {
		min-height: 120px;
	}
	}
	
:root {
	--kdn-accent: #FBBF24; /* لون السهم */
	--kdn-bg: rgba(17,24,39,.55);
	--kdn-ring: rgba(251,191,36,.35);
	--kdn-yfix: -52%;
}

.kdn-hero {
	position: relative;
	min-height: 75vh;
	color: #fff;
	overflow: hidden;
}

.kdn-hero-slider {
	position: relative;
	height: 75vh;
}

.kdn-slide {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	opacity: 0;
	transition: opacity 0.7s ease;
}

	.kdn-slide.is-active {
		opacity: 1;
		pointer-events: auto;
	}

/* طبقة التظليل */
.kdn-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(0deg, rgba(0,0,0,0.7), rgba(0,0,0,0.7));
	mix-blend-mode: multiply;
}

.kdn-container {
	position: relative;
	height: 100%;
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 24px;
}

.kdn-hero-content {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	padding: 20vh 0;
}

	.kdn-hero-content > * {
		max-width: 950px;
		margin: 0 auto;
	}

.kdn-eyebrow {
	display: inline-block;
	font-weight: 700;
	letter-spacing: 0.06em;
	opacity: 0.9;
	margin-bottom: 18px;
	font-size: 16px;
	color: gold;
}

.kdn-title {
	font-weight: 600;
	line-height: 1.15;
	font-size: clamp(11px, 4vw, 55px);
	margin: 0 0 18px;
	text-wrap: balance;
}

.kdn-text {
	font-size: clamp(16px, 2.2vw, 20px);
	line-height: 1.8;
	opacity: 0.95;
	margin: 0 0 15px 0;
	text-wrap: pretty;
}

/* أزرار الـ CTA */
.kdn-cta-buttons {
	display: flex;
	gap: 16px;
	justify-content: center;
	margin-top: 24px;
}

.kdn-btn {
	padding: 5px 20px;
	border: none;
	border-radius: 7px;
	font-weight: 700;
	font-size: 16px;
	cursor: pointer;
	transition: all 0.3s ease;
	text-decoration: none;
	display: inline-block;
	font-family: 'Cairo', sans-serif;
}

.kdn-btn-primary {
	background: gold;
	color: black;
	font-weight: bold;
}

	.kdn-btn-primary:hover {
		background: linear-gradient(45deg, #f59e0b, #d97706);
		color: white;
		transform: translateY(-2px);
		box-shadow: 0 10px 20px rgba(251, 191, 36, 0.4);
	}

.kdn-btn-secondary {
	/* background: rgba(255, 255, 255, 0.15); */
	color: white;
	border: 2px solid rgba(255, 255, 255, 0.3);
	backdrop-filter: blur(10px);
}

	.kdn-btn-secondary:hover {
		background: rgba(255, 255, 255, 0.25);
		border-color: rgba(255, 255, 255, 0.5);
		transform: translateY(-2px);
		color: white;
	}

/* أسهم */

.kdn-slidernav {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 54px;
	height: 54px;
	border-radius: 50%;
	display: grid;
	place-items: center;
	background: var(--kdn-bg);
	border: 1px solid rgba(255,255,255,.15);
	box-shadow: 0 10px 24px rgba(0,0,0,.35), inset 0 0 0 0 rgba(255,255,255,.08);
	color: transparent; /* نخفي رمز ‹ › الموجود داخل الزر */
	font-size: 0;
	line-height: 0; /* نضمن إخفاءه */
	cursor: pointer;
	user-select: none;
	backdrop-filter: saturate(120%) blur(6px);
	transition: box-shadow .25s, transform .25s, background .25s, border-color .25s;
}

	/* نرسم الشيفرون بالسوديو-إليمنت بدل الحرف */
	.kdn-slidernav::after {
		margin-bottom: 13px;
		content: "";
		width: 14px;
		height: 14px;
		border-inline-start: 3px solid var(--kdn-accent);
		border-block-end: 3px solid var(--kdn-accent);
		transform-origin: center;
		transition: margin .25s ease, filter .25s ease;
	}

/* تموضع واتجاه */
.kdn-prev {
	left: 24px;
}

	.kdn-prev::after {
		transform: rotate(135deg);
	}
/* سهم لليسار (‹) */

.kdn-next {
	right: 24px;
}

	.kdn-next::after {
		transform: rotate(-45deg);
	}
/* سهم لليمين (›) */

/* تفاعلات */
.kdn-slidernav:hover {
	background: rgba(17,24,39,.72);
	border-color: rgba(255,255,255,.28);
	box-shadow: 0 14px 32px rgba(0,0,0,.45), inset 0 0 0 1px rgba(255,255,255,.06);
}

.kdn-prev:hover::after {
	margin-right: 2px;
}
/* دفشة بسيطة باتجاه الحركة */
.kdn-next:hover::after {
	margin-left: 2px;
}

.kdn-slidernav:active {
	transform: translateY(-50%) scale(.96);
}

.kdn-slidernav:focus-visible {
	outline: 0;
	box-shadow: 0 0 0 3px var(--kdn-ring), 0 12px 28px rgba(0,0,0,.4);
}

/* حالة التعطيل (لو بتوقف التنقّل أثناء الأنيميشن) */
.kdn-slidernav[disabled] {
	opacity: .45;
	pointer-events: none;
}

/* لمس الموبايل */
@media (max-width:768px) {
	.kdn-slidernav {
		width: 58px;
		height: 58px;
	}

	.kdn-prev {
		left: 14px;
	}

	.kdn-next {
		right: 14px;
	}
}

.kdn-prev {
	left: 16px;
}

.kdn-next {
	right: 16px;
}

/* نقاط */
.kdn-dots {
	position: absolute;
	bottom: 18px;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	justify-content: center;
	gap: 10px;
	z-index: 5;
}

	.kdn-dots button {
		width: 12px;
		height: 12px;
		border-radius: 50%;
		border: 0;
		background: rgba(255,255,255,0.45);
		cursor: pointer;
		transition: all 0.3s ease;
	}

		.kdn-dots button.is-active {
			background: #fff;
			width: 28px;
			border-radius: 14px;
		}

/* وصوليّة وتقليل الحركة */
@media (prefers-reduced-motion: reduce) {
	.kdn-slide {
		transition: none;
	}
}

/* موبايل */
@media (max-width: 640px) {
	.kdn-nav {
		display: none;
	}

	.kdn-hero {
		min-height: 82vh;
	}

	.kdn-hero-content {
		padding: 15vh 0;
	}
}





/* ====== متغيرات احتياط لو مش معرّفة ====== */
.methodology-timeline {
	--gold: #FFD84D;
	--gold-light: #FFEFA6;
}

/* ================== تابلِت خفيف (≤ 1240px) ================== */
@media (max-width:1240px) {
	.methodology-timeline .timeline-step:nth-child(odd)::after {
		right: 180px;
	}

	.methodology-timeline .timeline-step:nth-child(even)::after {
		left: 180px;
	}

	.methodology-timeline .step-icon {
		width: clamp(240px, 34vw, 480px);
		height: auto;
		padding: 10px 14px;
		font-size: 1.6rem !important;
	}

	.methodology-timeline .step-icon-left {
		right: 14vw;
		bottom: 6vh;
	}

	.methodology-timeline .step-icon-right {
		right: -2vw;
		bottom: 6vh;
	}
}

/* ================== نقطة التحول للموبايل/تابلت عمودي (≤ 1024px) ================== */
@media (max-width:1024px) {
	/* الخط العمودي يمين ويصير ارتفاعه كامل */
	.methodology-timeline .timeline-container::before {
		left: auto !important;
		right: 16px !important;
		transform: none !important;
		top: 0 !important;
		bottom: 0 !important;
		height: auto !important;
		width: 3px !important;
		border-radius: 2px !important;
		background-image: repeating-linear-gradient( to bottom, #bb8c00 0 12px, transparent 12px 24px ) !important;
	}
	/* عمود واحد مرتب */
	.methodology-timeline .timeline-step {
		display: block !important;
		padding: 18px 0 28px !important;
		justify-content: flex-start !important;
		align-items: stretch !important;
	}

		.methodology-timeline .timeline-step:nth-child(odd),
		.methodology-timeline .timeline-step:nth-child(even) {
			justify-content: flex-start !important;
		}
		/* ألغِ الخطوط الأفقية المتقطعة */
		.methodology-timeline .timeline-step::after {
			display: none !important;
			content: none !important;
		}
	/* رجّع الأيقونات للوضع الطبيعي (بدون clip-path وتموضع نسبي) */
	.methodology-timeline .step-icon {
		width: auto !important;
		max-width: 560px !important;
		height: auto !important;
		padding: 12px 16px !important;
		background: linear-gradient(135deg, var(--gold), var(--gold-light)) !important;
		clip-path: none !important;
		border-radius: 12px !important;
		position: relative !important;
		right: auto !important;
		bottom: auto !important;
		margin-right: 48px !important; /* تباعد عن الخط العمودي (RTL) */
		font-size: 1.25rem !important;
		z-index: 1;
	}

	.methodology-timeline .step-icon-left,
	.methodology-timeline .step-icon-right {
		right: auto !important;
		bottom: auto !important;
	}
	/* نص كل خطوة */
	.methodology-timeline .step-content {
		max-width: none !important;
		margin-right: 48px !important; /* نفس محاذاة العنوان */
		text-align: right !important;
	}

	.methodology-timeline .step-description {
		font-size: 1rem !important;
		line-height: 1.8 !important;
	}
	/* أخفِ عناصر الدوائر الكبيرة ونصوصها لأنها السبب الأساسي بالتداخل */
	.methodology-timeline .main-circle {
		display: none !important;
	}

		.methodology-timeline .main-circle::after {
			content: none !important;
			display: none !important;
		}
}

/* ================== موبايل (≤ 768px) ================== */
@media (max-width:768px) {
	.methodology-timeline .timeline-container {
		padding: 24px 8px !important;
	}

		.methodology-timeline .timeline-container::before {
			right: 12px !important;
		}

	.methodology-timeline .step-icon {
		margin-right: 28px !important;
		font-size: 1.05rem !important;
	}

	.methodology-timeline .step-content {
		margin-right: 28px !important;
	}
}

/* ================== شاشات صغيرة جداً (≤ 480px) ================== */
@media (max-width:480px) {
	.methodology-timeline .timeline-container::before {
		right: 10px !important;
	}

	.methodology-timeline .step-icon {
		margin-right: 22px !important;
		padding: 10px 12px !important;
	}

	.methodology-timeline .step-content {
		margin-right: 22px !important;
	}
}







.zwy-why {
	--accent: #ffd84d;
	--ink: #0b1220;
	--muted: #475569;
	--line: rgba(2,6,23,.12);
	background: transparent;
	color: var(--ink);
	padding: clamp(40px,6vw,90px) 0;
}

.zwy-shell {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 16px
}

.zwy-title {
	margin: 0 0 14px;
	font-size: clamp(24px,3vw,36px);
	font-weight: 900
}

.zwy-dot {
	color: var(--accent)
}

/* الشرائط */
.zwy-ribbons {
	display: grid;
	gap: 18px
}

.zwy-ribbon {
	position: relative;
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 14px 18px;
	background: linear-gradient(180deg,#fffef6,#ffffff);
	border: 1px solid var(--line);
	border-radius: 14px;
	overflow: hidden;
}
	/* طرف شريطي أصفر بشكل زاوية (بدون ما تكون بطاقة) */
	.zwy-ribbon::before {
		content: "";
		position: absolute;
		inset: 0 auto 0 0;
		width: 96px;
		background: linear-gradient(135deg, var(--accent), #ffeaa1);
		clip-path: polygon(0 0, 100% 0, 76% 100%, 0% 100%);
		opacity: .95;
	}

	.zwy-ribbon.zwy-left::before {
		inset: 0 0 0 auto;
		transform: scaleX(-1);
	}

/* أيقونة صغيرة */
.zwy-icon {
	position: relative;
	z-index: 1;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	display: grid;
	place-items: center;
	color: #111;
	background: #fff;
	border: 1px solid var(--line);
	box-shadow: 0 6px 14px rgba(2,6,23,.08);
}

.zwy-texts {
	position: relative;
	z-index: 1
}

.zwy-head {
	margin: 0 0 4px;
	font-weight: 800;
	font-size: 1.08rem
}

.zwy-desc {
	margin: 0;
	color: var(--muted);
	line-height: 1.7;
	font-size: .96rem
}

/* حركة بسيطة عند الهوفر (بدون ظلال ثقيلة) */
.zwy-ribbon:hover {
	transform: translateY(-2px);
}

/* شبكة من عمودين على الديسكتوب، سطرين بدون بطاقات */
@media (min-width: 940px) {
	.zwy-ribbons {
		grid-template-columns: 1fr 1fr;
		gap: 20px;
	}
	/* تناوب يمين/يسار */
	.zwy-ribbon:nth-child(odd) {
		justify-content: flex-end;
		text-align: right
	}

	.zwy-ribbon:nth-child(even) {
		justify-content: flex-start;
		text-align: right
	}

	.zwy-ribbon.zwy-right {
		padding-right: 110px
	}
	/* مساحة طرف الشريط */
	.zwy-ribbon.zwy-left {
		padding-left: 110px
	}
}
/* Center the section title */
.zwy-why .zwy-title {
	text-align: center;
}

/* موبايل/تابلت: شرائط كاملة العرض، الطرف الأصفر يتحوّل شريط جانبي بسيط */
@media (max-width: 939px) {
	.zwy-ribbon {
		padding-inline: 16px 16px
	}

		.zwy-ribbon::before {
			width: 64px;
		}
}



/*  قسم  لمذا  تختارنا
*/





.mixw-why {
	--accent: #ffd84d;
	--ink: #0b1220;
	--muted: #475569;
	--line: rgba(2,6,23,.12);
	--shadow: 0 16px 40px rgba(2,6,23,.12);
	background: transparent;
	color: var(--ink);
	padding: clamp(48px,7vw,100px) 0;
}

.mixw-shell {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 16px
}

.mixw-title {
	margin: 0 0 16px;
	font-weight: 900;
	font-size: clamp(24px,3vw,36px)
}

.mixw-dot {
	color: var(--accent)
}

/* = Collage = */
.mixw-collage {
	position: relative;
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	grid-auto-rows: 48px;
	gap: 16px;
	min-height: 560px;
}

.mixw-photo {
	position: relative;
	overflow: hidden;
	border-radius: 18px;
	border: 1px solid var(--line);
	background: #fff;
	box-shadow: var(--shadow);
	isolation: isolate;
}

	.mixw-photo img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		display: block;
	}

	/* تدرّج خفيف لحماية النص + حافة بيضاء أنيقة */
	.mixw-photo::before {
		content: "";
		position: absolute;
		inset: 0;
		background: linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.35));
		opacity: .55;
		z-index: 0;
	}

.mixw-photo {
	outline: 4px solid #fff;
	outline-offset: -2px;
}

/* الكابشن */
.mixw-cap {
	position: absolute;
	inset: auto 12px 12px 12px;
	z-index: 1;
	color: #fff;
	text-shadow: 0 2px 10px rgba(0,0,0,.35);
}

	.mixw-cap strong {
		display: block;
		font-size: 1.05rem;
		margin-bottom: 2px
	}

	.mixw-cap small {
		opacity: .9
	}

.mixw-icon {
	display: inline-grid;
	place-items: center;
	width: 34px;
	height: 34px;
	border-radius: 10px;
	margin-inline-start: 8px;
	color: #111;
	background: linear-gradient(135deg, var(--accent), #ffeaa1);
	box-shadow: 0 6px 14px rgba(255,216,77,.45);
}

/* = مواضع وتداخل = */
.mixw-p1 {
	grid-column: 1 / span 6;
	grid-row: 1 / span 8;
	transform: rotate(-2deg);
}

.mixw-p2 {
	grid-column: 5 / span 8;
	grid-row: 3 / span 9;
	transform: rotate(2deg);
}

.mixw-p3 {
	grid-column: 2 / span 5;
	grid-row: 9 / span 8;
	transform: rotate(1.2deg);
}

.mixw-p4 {
	grid-column: 8 / span 5;
	grid-row: 10 / span 7;
	transform: rotate(-1.4deg);
}

/* حافة صفراء رقيقة في زاوية كل صورة */
.mixw-photo::after {
	content: "";
	position: absolute;
	inset: auto auto 0 0;
	width: 92px;
	height: 92px;
	background: conic-gradient(from 225deg at 100% 0, var(--accent) 0 26%, transparent 0 100%);
	opacity: .95;
	pointer-events: none;
	mask: radial-gradient(92px 92px at 100% 0, #000 52%, transparent 53%);
	-webkit-mask: radial-gradient(92px 92px at 100% 0, #000 52%, transparent 53%);
}

/* استجابة */
@media (max-width: 1100px) {
	.mixw-collage {
		grid-auto-rows: 44px;
		min-height: 520px;
	}

	.mixw-p1 {
		grid-column: 1 / span 7;
	}

	.mixw-p2 {
		grid-column: 4 / span 9;
	}
}

@media (max-width: 900px) {
	.mixw-collage {
		grid-template-columns: 1fr 1fr;
		grid-auto-rows: auto;
		gap: 14px;
		min-height: auto;
	}

	.mixw-photo {
		transform: none;
	}

	.mixw-p1 {
		grid-column: 1;
	}

	.mixw-p2 {
		grid-column: 2;
	}

	.mixw-p3 {
		grid-column: 1;
	}

	.mixw-p4 {
		grid-column: 2;
	}
}

@media (max-width: 560px) {
	.mixw-collage {
		grid-template-columns: 1fr;
	}

	.mixw-p1, .mixw-p2, .mixw-p3, .mixw-p4 {
		grid-column: 1;
	}
}

.mixw-why .mixw-cap {
	/* كان: inset:auto 12px 12px 12px */
	inset: 14px 14px auto 14px; /* Top-Right */
	text-align: right;
	max-width: 78%;
	display: grid;
	gap: 4px;
	padding: 10px 12px;
	/* لوح زجاجي خفيف لقراءة ممتازة */
	background: rgba(10,12,16,.48);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	border: 1px solid rgba(255,255,255,.22);
	border-radius: 12px;
	box-shadow: 0 8px 24px rgba(2,6,23,.25);
}

/* 2) اصنع “سِكْرِم” (تغميقة) أعلى الصورة فقط */
.mixw-why .mixw-photo::before {
	/* كان تدرّج عام؛ نخليه أقوى في الأعلى وأخف تحت */
	background: linear-gradient(180deg, rgba(0,0,0,.60) 0%, rgba(0,0,0,.30) 35%, rgba(0,0,0,0) 58%);
	opacity: 1;
}

/* 3) تحسينات تيبوغرافيا */
.mixw-why .mixw-cap strong {
	font-size: 1.08rem;
	font-weight: 800;
	color: #fff;
	letter-spacing: .2px;
	text-shadow: 0 1px 0 rgba(0,0,0,.35);
	line-height: 1.25;
}

.mixw-why .mixw-cap small {
	font-size: .95rem;
	color: #eef2ff;
	opacity: .95;
}

/* 4) أيقونة صفراء مرتبة مع مسافة مناسبة */
.mixw-why .mixw-icon {
	width: 36px;
	height: 36px;
	border-radius: 10px;
	display: inline-grid;
	place-items: center;
	margin-inline-start: 8px;
	color: #111;
	background: linear-gradient(135deg, #ffd84d, #ffeaa1);
	box-shadow: 0 6px 14px rgba(255,216,77,.45);
	border: 1px solid rgba(255,255,255,.35);
}

/* 5) موبايل: عرض أعرض شوي للكابشن */
@media (max-width: 900px) {
	.mixw-why .mixw-cap {
		max-width: 90%;
		padding: 10px 12px;
	}
}

@media (min-width: 1100px) {
	.mixw-why .mixw-cap strong {
		font-size: 1.6rem;
	}

	.mixw-why .mixw-cap small {
		font-size: 1.15rem;
	}
}
/* مركز عنوان لماذا تختارنا */
.mixw-why .mixw-title {
	text-align: center;
	margin-inline: auto; /* احتياط لو فيه عرض مخصص */
}








.tkt-why {
	--accent: #ffd84d;
	--ink: #0b1220;
	--muted: #475569;
	--line: rgba(2,6,23,.12);
	padding: clamp(40px,6vw,90px) 0
}

.tkt-shell {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 16px
}

.tkt-title {
	margin: 0 0 12px;
	font-size: clamp(24px,3vw,36px);
	font-weight: 900
}

.tkt-dot {
	color: var(--accent)
}

.tkt-grid {
	display: grid;
	gap: 14px
}

.tkt-card {
	display: grid;
	grid-template-columns: 120px 1fr;
	align-items: stretch;
	background: #fff;
	border: 1px solid var(--line);
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0 10px 26px rgba(2,6,23,.08)
}

.tkt-right {
	direction: rtl
}

.tkt-left {
	direction: rtl
}

.tkt-stub {
	height: 100%;
	width: auto;
}

	.tkt-icon {
		width: 60px;
		height: 60px;
		font-size: 30px;
}

.tkt-cut {
	position: absolute;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: #fff;
	border: 1px solid var(--line)
}

.tkt-in {
	inset: auto -10px 12px auto
}

.tkt-out {
	inset: 12px -10px auto auto
}

.tkt-body {
		padding: 24px 20px;
		width: 100%;
}

.tkt-card-title {
	font-size: 1.9rem;
	color: black;
}
.tkt-card-desc {
	margin: 0;
	color: var(--muted);
	line-height: 1.7
}

@media (min-width:900px) {
	.tkt-grid {
		grid-template-columns: 1fr 1fr
	}
}






.mz-testimonials {
	--acc: #ffd84d;
	--ink: #0b1220;
	--mut: #475569;
	--line: rgba(2,6,23,.12);
	background: transparent;
	color: var(--ink);
	padding: clamp(36px,6vw,84px) 0;
}

.mz-shell {
	max-width: 1100px;
	margin: 0 auto;
	padding: 0 16px
}

.mz-head {
	text-align: center;
	margin-bottom: 14px
}

.mz-title {
	margin: 0 0 6px;
	font-weight: 900;
	letter-spacing: .2px;
	font-size: clamp(22px,2.6vw,32px)
}

.mz-dot {
	color: var(--acc)
}

.mz-sub {
	margin: 0;
	color: var(--mut);
	font-size: clamp(13px,1.8vw,15px)
}

/* شبكة مرتبة + ارتفاع موحّد لكل كرت */
.mz-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 14px;
	align-items: stretch;
}

.mz-card {
	display: grid;
	grid-template-rows: 1fr auto; /* الاقتباس يملأ، التعريف بأسفل */
	height: var(--mz-card-h, 260px); /* غيّرها لو حاب توحّد أكثر/أقل */
	background: #fff;
	border: 1px solid var(--line);
	border-radius: 18px;
	box-shadow: 0 12px 30px rgba(2,6,23,.08);
	padding: 16px 16px 14px;
	position: relative;
	overflow: visible; /* مهم ليظهر الكارد اللي تحت */
	transition: transform .28s cubic-bezier(.2,.8,.2,1), box-shadow .28s, border-color .28s, background .28s, filter .28s;
	filter: saturate(.98);
}

	/* الكارد “اللي تحت” (طبقة ثانية) */
	.mz-card::before {
		content: "";
		position: absolute;
		inset: 6px -6px -8px 6px; /* حجم الطبقة */
		background: #fff;
		border: 1px solid rgba(2,6,23,.10);
		border-radius: 16px;
		transform: translate(10px, 12px) rotate(-0.2deg);
		z-index: -1;
		box-shadow: 0 16px 34px rgba(2,6,23,.12);
		transition: transform .28s ease, box-shadow .28s ease, opacity .28s ease;
		opacity: .96;
	}

	/* شريط أصفر داخلي (نقلناه لـ ::after عشان نخلي ::before للكارد السفلي) */
	.mz-card::after {
		content: "";
		position: absolute;
		right: 0;
		bottom: 0;
		width: 6px;
		height: 38%;
		background: linear-gradient(180deg,var(--acc),#ffeaa1);
		border-top-left-radius: 8px;
		opacity: .95;
		transition: height .28s ease, opacity .28s ease;
	}

	.mz-card:hover {
		transform: translateY(-5px) scale(1.005);
		border-color: rgba(255,216,77,.55);
		box-shadow: 0 16px 40px rgba(2,6,23,.14);
		background: linear-gradient(180deg,rgba(255,255,255,.99),rgba(255,255,255,.96));
		filter: none;
	}

		.mz-card:hover::before {
			transform: translate(12px, 16px) rotate(-0.2deg);
			box-shadow: 0 22px 46px rgba(2,6,23,.16);
		}

		.mz-card:hover::after {
			height: 46%
		}

/* اقتباس: أصغر + قصّ 4 أسطر مع (…) */
.mz-quote {
	margin: 28px 0 12px;
	font-size: clamp(16px, 2.1vw, 20px);
	line-height: 1.8;
	letter-spacing: .1px;
	position: relative;
	padding-inline-start: 32px;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 4;
	line-clamp: 4;
	overflow: hidden;
	text-overflow: ellipsis;
}

	.mz-quote::before {
		content: "“";
		position: absolute;
		right: 0;
		top: -2px;
		font-size: 34px;
		line-height: 1;
		color: var(--acc);
		opacity: .9;
		transition: transform .28s ease, opacity .28s ease;
	}

.mz-card:hover .mz-quote::before {
	transform: translateY(-2px) rotate(-2deg);
	opacity: 1
}

.mz-meta {
	display: flex;
	align-items: center;
	gap: 12px;
}

.mz-avatar {
	width: 52px;
	height: 52px;
	border-radius: 50%;
	border: 2px solid #fff;
	box-shadow: 0 8px 22px rgba(2,6,23,.14);
	transition: transform .28s ease, box-shadow .28s ease;
}

.mz-card:hover .mz-avatar {
	transform: scale(1.02);
	box-shadow: 0 10px 26px rgba(2,6,23,.18), 0 0 0 3px rgba(255,216,77,.18);
}

.mz-id b {
	display: block;
	font-weight: 900;
	letter-spacing: .15px
}

.mz-id small {
	color: var(--mut);
	font-size: .95rem
}

/* ريسبونسيف صغير */
/*@media (max-width: 360px) {
	.mz-card {
		height: 240px
	}
}*/
/* شبّكته أوسع شوي وما نقصّ الحواف */
.mz-grid {
	gap: 18px;
	overflow: visible;
}

/* الكرت الأساسي */
.mz-card {
	position: relative;
	isolation: isolate; /* مهم للـ ::before بز-index سلبي */
	overflow: visible;
	/* زوّدنا الحشو يمين لأن RTL وفيه شريط أصفر */
	padding: 18px 24px 16px 16px; /* top right bottom left */
}

	/* الكرت السفلي (الطبقة) */
	.mz-card::before {
		inset: 8px -8px -12px 10px;
		transform: translate(12px,16px) rotate(-0.25deg);
		box-shadow: 0 18px 36px rgba(2,6,23,.14);
	}

	/* الشريط الأصفر خليه بعيد نص ملم */
	.mz-card::after {
		right: 3px;
		height: 36%;
	}

/* الاقتباس: صغّرنا الخط وخليّنا الحشو على الـ END (يمين في RTL) */
.mz-quote {
	font-size: clamp(15.5px, 2vw, 19px);
	line-height: 1.85;
	/* كان padding-inline-start؛ بدّلناه ليميني */
	padding-inline-end: 40px;
	padding-inline-start: 0;
	/* القصّ 4 أسطر يبقى كما هو */
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 4;
	line-clamp: 4;
	overflow: hidden;
	text-overflow: ellipsis;
}

	/* حركنا علامة الاقتباس شوي ليمين وفوق وخففناها */
	.mz-quote::before {
		right: 10px;
		top: -6px;
		font-size: 30px; /* كان 34 */
		opacity: .75;
	}

/* تعريف الشخص: مساحة أريح وما يلزق مع الشريط */
.mz-meta {
	margin-top: auto;
	padding-inline-end: 6px;
}

.mz-avatar {
	box-shadow: 0 8px 22px rgba(2,6,23,.14);
}

/* هوفر أنعم */
.mz-card:hover {
	transform: translateY(-5px) scale(1.005);
	box-shadow: 0 16px 40px rgba(2,6,23,.14);
}

	.mz-card:hover::before {
		transform: translate(14px,18px) rotate(-0.25deg);
		box-shadow: 0 22px 46px rgba(2,6,23,.18);
	}

/* اختياري: ارتفاع موحد مريح على الشاشات الواسعة */
@media (min-width: 1100px) {
	.mz-card {
		height: var(--mz-card-h, 270px);
	}
}

	/* === اجعل البطاقة الكبيرة A بنفس ارتفاع باقي البطاقات على الريسبونسيف === */
	@media (max-width: 1040px) {
		.mgx-a {
			min-height: unset; /* ألغِ الارتفاع الإجباري */
			aspect-ratio: 16/9; /* مثل باقي الكروت */
		}
	}

	/* لو بدك تتأكد أكثر على الموبايل الصغير جدًا */
	@media (max-width: 640px) {
		.mgx-a {
			min-height: unset !important;
			aspect-ratio: 16/9; /* أو 16/10 حسب ما تحب */
		}
		.mz-card {
			width: 290px;
			height: auto;
			max-width: 100%;
			margin: 11px 62px;
		}

	}
