/**
 * Homepage hero — full bleed, navbar bridge, refined palette.
 */

.etqan-hero {
	--etqan-hero-bg: #f6f6f6;
	--etqan-hero-surface: #ffffff;
	--etqan-hero-ink: #1f1f1f;
	--etqan-hero-muted: #5c5c5c;
	--etqan-hero-accent: var(--etqan-color-accent, #c8a96e);
	--etqan-hero-sage: var(--etqan-color-sage, #3f5b2d);
	--etqan-hero-sage-soft: var(--etqan-color-primary, #81956b);
	--etqan-hero-bg-image: none;

	position: relative;
	width: 100vw;
	max-width: 100vw;
	margin-inline: calc(50% - 50vw);
	overflow: hidden;
	background-color: var(--etqan-hero-bg);
	color: var(--etqan-hero-ink);
	margin-top: -1px;
	min-height: clamp(520px, 58vw, 720px);
}

body.etqan-has-custom-hero .main-contain {
	padding-inline: 0;
	max-width: none;
}

/* Soft gradient bridge from fixed navbar into cream hero */
.etqan-hero__bridge {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: clamp(2.5rem, 6vw, 4.5rem);
	background: linear-gradient(180deg,
			#ffffff 0%,
			rgba(255, 255, 255, 0.88) 28%,
			rgba(246, 246, 246, 0.72) 62%,
			transparent 100%);
	pointer-events: none;
	z-index: 2;
}

.etqan-hero__backdrop {
	position: absolute;
	inset: 0;
	pointer-events: none;
}

.etqan-hero__bg-image {
	position: absolute;
	inset: 0;
	background-color: var(--etqan-hero-bg);
	background-image: var(--etqan-hero-bg-image);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}

.etqan-hero__overlay {
	position: absolute;
	inset: 0;
	background-color: #f2f3f2;
	opacity: 0.27;
}

.etqan-hero__grid-pattern {
	position: absolute;
	inset: 0;
	opacity: 0.22;
	background-image:
		linear-gradient(rgba(63, 85, 68, 0.05) 1px, transparent 1px),
		linear-gradient(90deg, rgba(63, 85, 68, 0.05) 1px, transparent 1px);
	background-size: 48px 48px;
	mask-image: linear-gradient(180deg, #000 0%, transparent 92%);
}

.etqan-hero__inner {
	position: relative;
	z-index: 3;
	width: 100%;
	max-width: min(96vw, 1320px);
	min-height: inherit;
	margin-inline: auto;
	padding: clamp(2.5rem, 5vw, 4.5rem) clamp(1rem, 3vw, 2rem);
	display: flex;
	align-items: center;
	box-sizing: border-box;
}

.etqan-hero__layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: clamp(1.25rem, 3vw, 2.5rem);
	align-items: center;
	width: 100%;
}

/* Physical columns: cards left, copy right — text stays RTL inside cells */
.etqan-hero__content {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: clamp(0.55rem, 1.2vh, 0.85rem);
	text-align: start;
}

.etqan-hero__badge {
	display: inline-block;
	align-self: flex-start;
	margin: 0;
	padding: 0.45rem 0.75rem;
	border-radius: 10px;
	background: #e2e2e2;
	color: var(--etqan-hero-muted);
	font-size: clamp(0.75rem, 1vw, 0.88rem);
	line-height: 1.45;
}

.etqan-hero__title {
	margin: 0;
	font-family: var(--etqan-font-body), "Cairo", sans-serif;
	font-size: clamp(1.75rem, 3.2vw, 2.75rem);
	font-weight: 800;
	line-height: 1.22;
	color: #3b5142;
}

.etqan-hero__tagline {
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
	margin: 0;
	font-size: clamp(1.35rem, 2.6vw, 2.15rem);
	font-weight: 700;
	line-height: 1.25;
	color: #3b5142;
}

.etqan-hero__tagline-part--accent {
	color: #c9a227;
}

.etqan-hero__description {
	margin: 0;
	font-size: clamp(0.9rem, 1.2vw, 1.05rem);
	line-height: 1.7;
	color: #666362;
}

.etqan-hero__actions {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 0.65rem;
	width: min(100%, 22rem);
	margin-top: 0.35rem;
}

.etqan-hero__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	min-height: clamp(42px, 5.5vh, 50px);
	padding: 0.6rem 1.15rem;
	border-radius: 8px;
	font-family: var(--etqan-font-body);
	font-size: clamp(0.85rem, 1.1vw, 0.95rem);
	font-weight: 600;
	text-decoration: none;
	transition:
		transform var(--etqan-duration-fast, 0.28s) var(--etqan-ease-smooth),
		box-shadow var(--etqan-duration-fast, 0.28s) var(--etqan-ease-smooth),
		background-color var(--etqan-duration-fast, 0.28s) ease,
		border-color var(--etqan-duration-fast, 0.28s) ease,
		color var(--etqan-duration-fast, 0.28s) ease;
}

.etqan-hero__btn-icon {
	width: 1.15rem;
	height: 1.15rem;
	flex-shrink: 0;
}

.etqan-hero__btn--primary {
	background: var(--etqan-color-sage, #3f5b2d);
	color: #fff;
	border: 1px solid var(--etqan-color-sage, #3f5b2d);
	box-shadow: 0 6px 20px rgba(63, 85, 68, 0.22);
}

.etqan-hero__btn--primary:hover,
.etqan-hero__btn--primary:focus-visible {
	transform: translateY(-2px);
	box-shadow: 0 10px 26px rgba(63, 85, 68, 0.28);
	background: var(--etqan-color-sage-dark, #354d26);
	border-color: var(--etqan-color-sage-dark, #354d26);
	color: #fff;
}

.etqan-hero__btn--secondary {
	background: rgba(255, 255, 255, 0.75);
	color: #404f01;
	border: 2px solid #485707;
}

.etqan-hero__btn--secondary:hover,
.etqan-hero__btn--secondary:focus-visible {
	transform: translateY(-2px);
	background: #fff;
	border-color: var(--etqan-hero-sage-soft);
	color: var(--etqan-hero-sage);
}

/* Aside — stat + highlight cards */
.etqan-hero__aside {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 0.85rem;
	max-width: 34rem;
}

.etqan-hero__stat-card {
	position: relative;
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 1rem 1.15rem;
	padding: 1.15rem 1.35rem 1.15rem calc(1.35rem + 6px);
	background: #fff;
	border-radius: 10px;
	box-shadow:
		0 10px 32px rgba(31, 31, 31, 0.08),
		0 1px 0 rgba(255, 255, 255, 0.9) inset;
	overflow: hidden;
}

.etqan-hero__stat-card::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	inset-inline-start: 0;
	width: 6px;
	background: linear-gradient(180deg, #d4b45a 0%, #c9a227 100%);
}

.etqan-hero__stat-value {
	display: flex;
	align-items: baseline;
	flex: 0 0 auto;
	gap: 0.15rem;
	margin: 0;
	font-family: "Times New Roman", Georgia, serif;
	font-size: clamp(2.1rem, 3.6vw, 3rem);
	font-weight: 700;
	line-height: 1;
	color: #2b2b2b;
	direction: ltr;
	white-space: nowrap;
}

.etqan-hero__stat-prefix {
	font-size: 0.88em;
	color: #2b2b2b;
}

.etqan-hero__stat-label {
	flex: 1;
	margin: 0;
	font-size: clamp(0.84rem, 1.05vw, 0.96rem);
	line-height: 1.55;
	font-weight: 500;
	color: #2b2b2b;
	text-align: start;
}

.etqan-hero__highlights {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0.7rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.etqan-hero__highlight {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	gap: 0.65rem;
	min-height: 4.85rem;
	padding: 0.95rem 1rem;
	background: linear-gradient(145deg, var(--etqan-color-sage-muted, #4a6638) 0%, var(--etqan-color-sage, #3f5b2d) 48%, var(--etqan-color-sage-dark, #354d26) 100%);
	border: 1px solid rgba(255, 255, 255, 0.07);
	border-radius: 10px;
	color: #fff;
	box-shadow: 0 8px 22px rgba(63, 85, 68, 0.22);
	transition:
		transform var(--etqan-duration-fast, 0.28s) var(--etqan-ease-smooth),
		box-shadow var(--etqan-duration-fast, 0.28s) var(--etqan-ease-smooth),
		background var(--etqan-duration-fast, 0.28s) ease;
}

.etqan-hero__highlight:hover {
	transform: translateY(-3px);
	box-shadow: 0 12px 28px rgba(63, 85, 68, 0.3);
	background: linear-gradient(145deg, #527042 0%, var(--etqan-color-sage, #3f5b2d) 50%, var(--etqan-color-sage-dark, #2f4220) 100%);
}

.etqan-hero__highlight-text {
	flex: 1;
	min-width: 0;
	font-size: clamp(0.8rem, 0.95vw, 0.92rem);
	line-height: 1.45;
	font-weight: 600;
	text-align: start;
}

.etqan-hero__highlight-icon-wrap {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 2.35rem;
	height: 2.35rem;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.12);
}

.etqan-hero__highlight-icon {
	width: 1.25rem;
	height: 1.25rem;
	background: currentColor;
	color: #fff;
	mask-size: contain;
	mask-repeat: no-repeat;
	mask-position: center;
	-webkit-mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center;
}

.etqan-hero__highlight-icon--experts {
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 512'%3E%3Cpath d='M96 224c35.3 0 64-28.7 64-64s-28.7-64-64-64-64 28.7-64 64 28.7 64 64 64zm448 0c35.3 0 64-28.7 64-64s-28.7-64-64-64-64 28.7-64 64 28.7 64 64 64zm32 32h-64c-17.6 0-33.5 7.1-45.1 18.6 40.3 22.1 68.9 62 75.1 109.4h66c17.7 0 32-14.3 32-32v-32c0-35.3-28.7-64-64-64zm-256 0c61.9 0 112-50.1 112-112S381.9 32 320 32 208 82.1 208 144s50.1 112 112 112zm76.8 32h-8.3c-20.8 10-43.9 16-68.5 16s-47.6-6-68.5-16h-8.3C179.6 288 128 339.6 128 403.2V432c0 26.5 21.5 48 48 48h288c26.5 0 48-21.5 48-48v-28.8c0-63.6-51.6-115.2-115.2-115.2z'/%3E%3C/svg%3E");
}

.etqan-hero__highlight-icon--bar {
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M466.5 83.7l-192-80a48.15 48.15 0 0 0-36.9 0l-192 80C27.7 91.1 16 108.6 16 128c0 198.5 114.5 335.7 221.5 380.3 11.8 4.9 25.1 4.9 36.9 0C360.1 472.6 496 349.3 496 128c0-19.4-11.7-36.9-29.5-44.3zM256.1 446.3l-.1-381 175.9 73.3c-3.3 151.4-82.1 261.1-175.8 307.7z'/%3E%3C/svg%3E");
}

.etqan-hero__highlight-icon--ip {
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3Cpath d='M97.12 362.63c-8.69-8.69-4.16-6.24-25.12-11.85-9.51-2.55-17.87-7.45-25.43-13.32L1.2 448.7c-4.39 10.77 3.81 22.47 15.43 22.03l52.69-2.01L105.56 507c8 8.44 22.04 5.81 26.43-4.96l52.05-127.62c-10.84 6.04-22.87 9.58-35.31 9.58-19.5 0-37.82-7.59-51.61-21.37zM382.8 448.7l-45.37-111.24c-7.56 5.88-15.92 10.77-25.43 13.32-21.07 5.64-16.45 3.18-25.12 11.85-13.79 13.78-32.12 21.37-51.62 21.37-12.44 0-24.47-3.55-35.31-9.58L252 502.04c4.39 10.77 18.44 13.4 26.43 4.96l36.25-38.28 52.69 2.01c11.62.44 19.82-11.27 15.43-22.03zM263 340c15.28-15.55 17.03-14.21 38.79-20.14 13.89-3.79 24.75-14.84 28.47-28.98 7.48-28.4 5.54-24.97 25.95-45.75 10.17-10.35 14.14-25.44 10.42-39.58-7.47-28.38-7.48-24.42 0-52.83 3.72-14.14-.25-29.23-10.42-39.58-20.41-20.78-18.47-17.36-25.95-45.75-3.72-14.14-14.58-25.19-28.47-28.98-27.88-7.61-24.52-5.62-44.95-26.41-10.17-10.35-25-14.4-38.89-10.61-27.87 7.6-23.98 7.61-51.9 0-13.89-3.79-28.72.25-38.89 10.61-20.41 20.78-17.05 18.8-44.94 26.41-13.89 3.79-24.75 14.84-28.47 28.98-7.47 28.39-5.54 24.97-25.95 45.75-10.17 10.35-14.15 25.44-10.42 39.58 7.47 28.36 7.48 24.4 0 52.82-3.72 14.14.25 29.23 10.42 39.59 20.41 20.78 18.47 17.35 25.95 45.75 3.72 14.14 14.58 25.19 28.47 28.98C104.6 325.96 106.27 325 121 340c13.23 13.47 33.84 15.88 49.74 5.82a39.676 39.676 0 0 1 42.53 0c15.89 10.06 36.5 7.65 49.73-5.82zM97.66 175.96c0-53.03 42.24-96.02 94.34-96.02s94.34 42.99 94.34 96.02-42.24 96.02-94.34 96.02-94.34-42.99-94.34-96.02z'/%3E%3C/svg%3E");
}

.etqan-hero__highlight-icon--cities {
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3Cpath d='M172.268 501.67C26.97 291.031 0 269.413 0 192 0 85.961 85.961 0 192 0s192 85.961 192 192c0 77.413-26.97 99.031-172.268 309.67-9.535 13.774-29.93 13.773-39.464 0zM192 272c44.183 0 80-35.817 80-80s-35.817-80-80-80-80 35.817-80 80 35.817 80 80 80z'/%3E%3C/svg%3E");
}

/* Scroll reveal */
.etqan-hero__reveal {
	opacity: 0;
	transform: translateY(18px);
	transition:
		opacity var(--etqan-duration-slow, 0.72s) var(--etqan-ease-smooth),
		transform var(--etqan-duration-slow, 0.72s) var(--etqan-ease-smooth);
}

.etqan-hero__reveal--from-start {
	transform: translateX(-24px) translateY(10px);
}

.etqan-hero__reveal--from-end {
	transform: translateX(24px) translateY(10px);
}

[dir="rtl"] .etqan-hero__reveal--from-start {
	transform: translateX(24px) translateY(10px);
}

[dir="rtl"] .etqan-hero__reveal--from-end {
	transform: translateX(-24px) translateY(10px);
}

.etqan-hero__reveal.etqan-is-visible {
	opacity: 1;
	transform: translate(0, 0);
}

.etqan-hero__reveal--delay {
	transition-delay: 0.08s;
}

.etqan-hero__reveal--delay-1 {
	transition-delay: 0.1s;
}

.etqan-hero__reveal--delay-2 {
	transition-delay: 0.18s;
}

.etqan-hero__reveal--delay-3 {
	transition-delay: 0.26s;
}

.etqan-hero__reveal--delay-4 {
	transition-delay: 0.34s;
}

.etqan-hero__reveal--delay-5 {
	transition-delay: 0.42s;
}

/* Home content below hero */
.etqan-home-content {
	width: 100%;
	max-width: 100%;
	overflow-x: clip;
}

/* -------------------------------------------------------------------------
   Responsive
   ------------------------------------------------------------------------- */
@media (max-width: 991px) {
	.etqan-hero {
		min-height: auto;
	}

	.etqan-hero__inner {
		padding: clamp(1.5rem, 5vw, 2.5rem) clamp(1rem, 4vw, 1.5rem);
	}

	.etqan-hero__layout {
		grid-template-columns: 1fr;
		gap: 1.25rem;
	}

	.etqan-hero__content {
		order: 1;
	}

	.etqan-hero__aside {
		order: 2;
		max-width: none;
	}

	.etqan-hero__actions {
		width: 100%;
	}

	.etqan-hero__stat-card {
		flex-direction: column;
		align-items: flex-start;
		padding: 1.1rem 1.15rem 1.1rem calc(1.15rem + 6px);
		border-radius: 10px;
	}

	.etqan-hero__stat-value {
		font-size: clamp(1.85rem, 6vw, 2.35rem);
	}

	.etqan-hero__highlight {
		min-height: 4.25rem;
	}
}

@media (max-width: 575px) {
	.etqan-hero__actions {
		flex-direction: column;
	}

	.etqan-hero__btn {
		width: 100%;
	}
}

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

	.etqan-hero__reveal,
	.etqan-hero__highlight,
	.etqan-hero__btn {
		opacity: 1;
		transform: none;
		transition: none;
	}
}