/**
 * Destination travel guide UI parity (Amman / Egypt Elementor guides).
 * Manifest copy and section order unchanged.
 */

/* —— Hero: photo + rgba(6,24,20,.78) like Amman (post-18149) —— */
.jjc-wrap.jj-syria-spec > .jjc-hero {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	min-height: 430px !important;
	padding: 118px 30px 104px !important;
	background-size: cover !important;
	background-position: center center !important;
}

.jjc-wrap.jj-syria-spec > .jjc-hero::after {
	display: none !important;
	content: none !important;
}

.jjc-wrap.jj-syria-spec > .jjc-hero.jjc-hero--has-image::before {
	background: rgba(6, 24, 20, 0.78) !important;
	opacity: 1 !important;
}

.jjc-wrap.jj-syria-spec > .jjc-hero:not(.jjc-hero--has-image)::before {
	background:
		radial-gradient(circle at 72% 36%, rgba(199, 155, 99, 0.12), transparent 34%),
		rgba(6, 24, 20, 0.92) !important;
	opacity: 1 !important;
}

.jj-syria-spec .jj-dg-hero__eyebrow {
	margin: 0 0 16px;
	font-family: Manrope, system-ui, sans-serif;
	font-size: 12px;
	font-weight: 500;
	line-height: 1.2;
	color: #c88a4b;
}

.jj-syria-spec .jj-dg-hero__eyebrow strong {
	font-weight: 500;
}

.jj-syria-spec .jjc-hero h1 {
	max-width: 920px;
	font-family: "Playfair Display", Georgia, serif;
	font-size: clamp(42px, 5.5vw, 72px);
	font-weight: 600;
	line-height: 1.1;
	letter-spacing: -0.4px;
	color: #fff;
}

.jj-syria-spec .jjc-hero p {
	max-width: 760px;
	margin-top: 22px;
	font-family: Manrope, system-ui, sans-serif;
	font-size: clamp(16px, 2vw, 19px);
	line-height: 1.75;
	color: rgba(255, 255, 255, 0.88);
}

.jj-syria-spec .jjc-hero__inner {
	width: min(1240px, calc(100% - 60px));
}

.jj-syria-spec > .jjc-hero + .jj-dg-section {
	margin-top: 0 !important;
}

/* —— Page shell —— */
.jj-syria-spec {
	background: #f7f1e6;
}

.jj-syria-spec .jj-dg-shell {
	width: min(1240px, calc(100% - 60px));
}

.jj-syria-spec .jj-dg-section {
	padding: 0;
	background: #fff;
}

.jj-syria-spec .jj-dg-section > .jj-dg-shell {
	padding: 92px 0 96px;
}

.jj-syria-spec .jj-dg-section--band {
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	background: #f7f1e6;
}

.jj-syria-spec .jj-dg-section--band > .jj-dg-shell {
	padding: 92px 30px 96px;
}

.jj-syria-spec .jj-dg-section--glance {
	background: #f7f1e6;
}

.jj-syria-spec .jj-dg-glance-panel {
	padding: 0;
	border: 0;
	background: transparent;
	box-shadow: none;
}

/* —— Type (Elementor kit 7) —— */
.jj-syria-spec .jj-dg-kicker {
	margin: 0 0 12px;
	font-family: Manrope, system-ui, sans-serif;
	font-size: 12px;
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: #c88a4b;
}

.jj-syria-spec .jj-dg-kicker::before {
	content: none;
}

.jj-syria-spec .jj-dg-title {
	margin: 0 0 20px;
	max-width: 920px;
	font-family: "Playfair Display", Georgia, serif;
	font-size: clamp(34px, 3.6vw, 50px);
	font-weight: 600;
	line-height: 1.1;
	letter-spacing: -0.4px;
	color: #102d26;
}

.jj-syria-spec .jj-dg-glance-lead {
	margin: 0 0 20px;
	font-family: Manrope, system-ui, sans-serif;
	font-size: 17px;
	line-height: 1.75;
	color: #20332e;
}

.jj-syria-spec .jj-dg-prose p {
	font-family: Manrope, system-ui, sans-serif;
	font-size: 17px;
	line-height: 1.75;
	color: #20332e;
}

/* —— Cards (750c3829) —— */
.jj-syria-spec .jj-dg-grid {
	gap: 16px;
}

.jj-syria-spec .jj-dg-grid--4,
.jj-syria-spec .jj-dg-grid--snapshot {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.jj-syria-spec .jj-dg-grid--insights {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.jj-syria-spec .jj-dg-grid--insights .jj-dg-card {
	grid-column: span 2;
}

.jj-syria-spec .jj-dg-card {
	padding: 28px 26px;
	border: 1px solid rgba(16, 45, 38, 0.14);
	border-radius: 20px;
	background: #fff;
	box-shadow: none;
}

.jj-syria-spec .jj-dg-card::before {
	content: none;
}

.jj-syria-spec .jj-dg-card:hover {
	transform: none;
	box-shadow: none;
}

.jj-syria-spec .jj-dg-card__index {
	font-family: Manrope, system-ui, sans-serif;
	font-size: 11px;
	font-weight: 700;
	color: #c88a4b;
}

.jj-syria-spec .jj-dg-card h3 {
	font-family: Manrope, system-ui, sans-serif;
	font-size: 22px;
	font-weight: 700;
	line-height: 1.1;
	letter-spacing: -0.4px;
	color: #102d26;
}

.jj-syria-spec .jj-dg-card p {
	font-size: 16px;
	line-height: 1.65;
	color: #20332e;
}

.jj-syria-spec .jj-dg-route-grid {
	display: grid;
	gap: 16px;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.jj-syria-spec .jj-dg-route-card {
	padding: 28px 26px;
	border: 1px solid rgba(16, 45, 38, 0.14);
	border-radius: 20px;
	background: #fff;
}

.jj-syria-spec .jj-dg-subsection {
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	box-shadow: none;
}

.jj-syria-spec .jj-dg-subtitle {
	font-family: "Playfair Display", Georgia, serif;
	font-size: clamp(26px, 2.5vw, 32px);
	font-weight: 600;
	color: #102d26;
}

.jj-syria-spec .jj-dg-faq {
	border: 1px solid rgba(16, 45, 38, 0.14);
	border-radius: 20px;
	background: #fff;
}

.jj-syria-spec .jj-dg-final {
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	padding: 92px 30px 96px;
	background: #102d26;
}

.jj-syria-spec .jjc-btn--primary {
	background: #c88a4b;
	border-color: #c88a4b;
	color: #fff !important;
	font-weight: 650;
}

.jj-syria-spec .jjc-btn--primary:hover {
	background: #1b4037;
	border-color: #1b4037;
}

@media (max-width: 991px) {
	.jj-syria-spec .jj-dg-grid--4,
	.jj-syria-spec .jj-dg-grid--snapshot,
	.jj-syria-spec .jj-dg-grid--insights {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.jj-syria-spec .jj-dg-grid--insights .jj-dg-card {
		grid-column: span 1;
	}
}

@media (max-width: 680px) {
	.jjc-wrap.jj-syria-spec > .jjc-hero {
		min-height: 380px !important;
		padding: 92px 20px 82px !important;
	}
}

@media (max-width: 767px) {
	.jj-syria-spec .jj-dg-grid--4,
	.jj-syria-spec .jj-dg-grid--snapshot,
	.jj-syria-spec .jj-dg-grid--insights,
	.jj-syria-spec .jj-dg-grid--2,
	.jj-syria-spec .jj-dg-grid--places,
	.jj-syria-spec .jj-dg-grid--labeled {
		grid-template-columns: 1fr;
	}

	.jj-syria-spec .jj-dg-section > .jj-dg-shell,
	.jj-syria-spec .jj-dg-section--band > .jj-dg-shell {
		padding: 68px 22px 72px;
	}
}
