/*
Theme Name: Adwat
Text Domain: adwat
Requires at least: 6.5
Tested up to: 7.0
Version: 1.4.2
Author: Mohammed Amin
*/

@font-face {
	font-family: Alexandria;
	src: url('assets/fonts/alexandria-variable.woff2') format('woff2');
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}

/* الورشة — قواعد لا يعبّر عنها theme.json */

html {
	direction: rtl;
}

/* الورقة نفسها: لون ثابت خلف اللوحة الحيّة، حتى قبل تحميل أي JS
   وفي الوضع الليلي. */
html,
body {
	background-color: var(--wp--preset--color--paper);
	color: var(--wp--preset--color--ink);
}

:where(pre, code, kbd, samp) {
	direction: ltr;
	text-align: left;
	unicode-bidi: isolate;
}

:lang(en),
[dir="ltr"] {
	letter-spacing: 0.01em;
}

@media (prefers-reduced-motion: reduce) {
	* {
		transition: none !important;
		animation: none !important;
	}
}

:focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 3px;
}

/* بطاقة — حدّ 1px بدل الظل، وخط علوي دقيق بدل الظل النازل:
   لوح مصنّع لا صندوق مسطّح. مقيّد عمداً: بلا توهّج ولا زجاجية. */
.adwat-card {
	background: var(--wp--preset--color--paper);
	border: 1px solid var(--wp--preset--color--rule);
	border-radius: 2px;
	padding: var(--wp--preset--spacing--30);
	transition: border-color 0.15s ease;
}

/* الخط العلوي الدقيق يخص الأرضية الداكنة وحدها — على الورق يقرأ كوسخ. */
.adwat-card {
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

:root[data-theme="light"] .adwat-card {
	box-shadow: none;
}


.adwat-card:hover,
.adwat-card:focus-within {
	border-color: var(--wp--preset--color--accent);
}

/* شارة حالة */
.adwat-status {
	display: inline-block;
	font-size: var(--wp--preset--font-size--small);
	text-transform: uppercase;
	border: 1px solid var(--wp--preset--color--ink-muted);
	color: var(--wp--preset--color--ink-muted);
	padding-inline: 0.5em;
	padding-block: 0.15em;
	border-inline-start: 3px solid var(--wp--preset--color--ink-muted);
	line-height: 1.6;
}

.adwat-status.is-active {
	color: var(--wp--preset--color--accent);
	border-color: var(--wp--preset--color--accent);
	border-inline-start-color: var(--wp--preset--color--accent);
}

.adwat-status.is-in-development,
.adwat-status.is-experiment,
.adwat-status.is-prototype,
.adwat-status.is-archived {
	color: var(--wp--preset--color--ink-muted);
	border-color: var(--wp--preset--color--ink-muted);
}

/* روابط أفقية بفاصل خطي */
.adwat-links {
	display: flex;
	flex-wrap: wrap;
	gap: 0;
	list-style: none;
	margin: 0;
	padding: 0;
}

.adwat-links li {
	padding-inline: var(--wp--preset--spacing--20);
	border-inline-start: 1px solid var(--wp--preset--color--rule);
}

.adwat-links li:first-child {
	padding-inline-start: 0;
	border-inline-start: 0;
}

/* العمود الجانبي — العنصر المميّز */
.adwat-spine {
	margin-block-start: var(--wp--preset--spacing--30);
	padding-block-start: var(--wp--preset--spacing--30);
	border-block-start: 1px solid var(--wp--preset--color--rule);
}

/* رابط الأرشيف بجانب عنوان القسم */
.adwat-archive-link {
	display: inline-flex;
	align-items: center;
	gap: 0.3em;
	margin-inline-start: var(--wp--preset--spacing--20);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	color: var(--wp--preset--color--accent);
	text-decoration: none;
	vertical-align: middle;
}

.adwat-archive-link:hover,
.adwat-archive-link:focus-visible {
	text-decoration: underline;
}

.adwat-arrow {
	flex-shrink: 0;
}

/* شبكة أقسام الرئيسية المبنية عبر WP_Query */
.adwat-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--wp--preset--spacing--30);
}

@media (max-width: 44rem) {
	.adwat-grid {
		grid-template-columns: 1fr;
	}
}

/* قائمة مواضيع البطاقة/الأرشيف */
.adwat-terms,
.adwat-filter-list {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--10);
	list-style: none;
	margin: 0;
	margin-block-start: var(--wp--preset--spacing--10);
	padding: 0;
	font-size: var(--wp--preset--font-size--small);
}

.adwat-terms a,
.adwat-filter-list a {
	color: var(--wp--preset--color--ink-muted);
	border: 1px solid var(--wp--preset--color--rule);
	border-radius: 2px;
	padding-inline: 0.5em;
	padding-block: 0.15em;
	text-decoration: none;
}

.adwat-terms a:hover,
.adwat-filter-list a:hover,
.adwat-terms a:focus-visible,
.adwat-filter-list a:focus-visible {
	color: var(--wp--preset--color--accent);
	border-color: var(--wp--preset--color--accent);
}

.adwat-filter-list {
	margin-block-end: var(--wp--preset--spacing--30);
}

/* حاوية أداة embed — تفكّ التنسيق الموروث عن الودجت (Tailwind قائم بذاته) */
/* ponytail: reset بالخصائص الشائعة فقط، لا "all: revert" الشامل — يكفي حتى تظهر مشكلة توارث فعلية */
.adwat-tool-embed-wrap {
	max-width: none;
}

.adwat-tool-embed-wrap .wp-block-post-content {
	max-width: none;
}

.adwat-tool-embed {
	font-family: initial;
	font-size: initial;
	line-height: initial;
	color: initial;
}

@media (min-width: 60rem) {
	.adwat-layout {
		display: grid;
		grid-template-columns: 1fr 14rem;
		gap: var(--wp--preset--spacing--40);
		align-items: start;
	}

	.adwat-layout .adwat-spine {
		grid-column: 2;
		grid-row: 1;
		margin-block-start: 0;
		padding-block-start: 0;
		padding-inline-start: var(--wp--preset--spacing--30);
		border-block-start: 0;
		border-inline-start: 1px solid var(--wp--preset--color--rule);
		position: sticky;
		inset-block-start: var(--wp--preset--spacing--30);
	}

	.adwat-layout .adwat-content {
		grid-column: 1;
		grid-row: 1;
	}
}

/* ============================================================
   الورشة — الطبقة البصرية: الوضع الداكن، الحبكة المسطّرة،
   الحركة عند التمرير، اللوحة، الحبيبة، الصور
   ============================================================ */

/* الأرضية العاجية هي الهوية (theme.json). الوضع الداكن اختيار صريح من الزائر،
   بنفس عائلة العلامة: كحلي #00246C وأزرق #006CB4 مع لكنة تيراكوتا. */
:root[data-theme="light"] {
	/* الأرضية الداكنة صارت الافتراضية؛ العاجي بقي اختياراً صريحاً من الزائر.
	   نفس ألوان اللوغو، معكوسة. */
	--wp--preset--color--paper: #FBF9F4;
	--wp--preset--color--paper-sunk: #F1EEE6;
	--wp--preset--color--ink: #141412;
	--wp--preset--color--ink-muted: #56564F;
	--wp--preset--color--rule: #D9D4C9;
	--wp--preset--color--accent: #00509B;
	--wp--preset--color--accent-sunk: #00246C;
	--wp--preset--color--mark: #C1552E;
}

/* اللوغو كحلي على شفاف: على الأرضية الداكنة يُرفع سطوعه بدل قلبه إلى أبيض،
   فيبقى بلونيه. */


/* حقل الجزيئات يخص المسرح وحده.
   The canvas is position:fixed, so once the pinned stage released it kept
   hanging over every section below — the closing mark floated across the
   index, the مبيعاتي line and the footer. */
#adwat-atelier {
	transition: opacity 0.45s ease;
}

.adwat-field-off #adwat-atelier {
	opacity: 0;
}

/* الترويسة تمتد بعرض الصفحة كاملاً.
   WordPress's `constrained` layout was pinning the header's contents to the
   theme's content width, so on a wide screen the logo stopped ~600px short of
   the right edge and the whole bar read as a narrow strip floating in the
   middle of an empty page. The header now shares the stage's own gutter. */
.adwat-header-row {
	padding-inline: clamp(var(--wp--preset--spacing--30), 6vw, 7rem);
}

.adwat-visually-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

/* سطر التعريف فوق عنوان الهيرو — اسم صاحب الموقع، واسم الموقع يبقى في الترويسة */
.adwat-byline {
	margin: 0 0 var(--wp--preset--spacing--10);
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--ink-muted);
	display: flex;
	align-items: center;
	gap: 0.6em;
}

.adwat-byline::after {
	content: "";
	flex: 1 1 auto;
	max-inline-size: 4rem;
	block-size: 1px;
	background: var(--wp--preset--color--rule);
}

/* الثلاثية تحت العنوان — إيقاع صوت البراند نفسه من حساباته:
   كل جملة على سطر، يفصلها خط رفيع، بخط أحادي صغير. */
.adwat-scene .adwat-triad {
	max-width: 24rem;
}

.adwat-triad {
	display: flex;
	flex-direction: column;
	gap: 0;
	margin-block-start: var(--wp--preset--spacing--40);
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--medium);
	color: var(--wp--preset--color--ink);
	max-width: 26rem;
}

.adwat-triad span {
	padding-block: 0.55em;
	border-block-start: 1px solid var(--wp--preset--color--rule);
}

.adwat-triad span:last-child {
	border-block-end: 1px solid var(--wp--preset--color--rule);
	color: var(--wp--preset--color--accent);
}

/* اسم الموقع — نص عادي بديل عن site-title block (يبقى h1 واحد فقط لعنوان الصفحة) */
.adwat-site-name {
	margin: 0;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	font-size: var(--wp--preset--font-size--large);
}

.adwat-site-name a {
	color: var(--wp--preset--color--ink);
	text-decoration: none;
}

.adwat-site-name a:hover,
.adwat-site-name a:focus-visible {
	color: var(--wp--preset--color--accent);
}

/* الشعار الفعلي — كحلي على شفافية. على الأرضية الفاتحة يبقى كما هو (مقروء
   على ورق أبيض)، وعلى الداكنة يُحوَّل بالكامل إلى أبيض كي لا يختفي كحلي
   فوق كحلي. brightness(0) invert(1) يفرض أبيض خالصاً بصرف النظر عن لون
   المصدر، محتفظاً بالشفافية. */
.adwat-site-logo {
	display: flex;
	align-items: center;
}

.adwat-site-logo img {
	display: block;
	height: 2.4rem;
	width: auto;
	/* الأرضية عاجية: اللوغو يظهر بألوانه الأصلية بلا أي فلتر.
	   الفلتر يخص الوضع الداكن وحده. */
	filter: none;
}

:root[data-theme="light"] .adwat-site-logo img {
	filter: none;
}


/* التنقّل الرئيسي — details/summary، بلا JS، قابل للتشغيل بلوحة المفاتيح */
.adwat-nav-list {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--20);
	list-style: none;
	margin: 0;
	padding: 0;
}

.adwat-nav-list a {
	color: var(--wp--preset--color--ink);
	text-decoration: none;
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 600;
	padding-block: 0.4em;
}

.adwat-nav-list a:hover,
.adwat-nav-list a:focus-visible {
	color: var(--wp--preset--color--accent);
}

/* زر القائمة يظهر على الشاشات الضيقة فقط، وبوجود JS فقط — بدونه تبقى
   القائمة ظاهرة دائماً بدل أن تصبح غير قابلة للوصول. */
.adwat-nav-toggle {
	display: none;
	align-items: center;
	gap: 0.4em;
	background: transparent;
	border: 1px solid var(--wp--preset--color--rule);
	border-radius: 2px;
	color: var(--wp--preset--color--ink);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	padding: 0.35em 0.6em;
	cursor: pointer;
}

.adwat-nav-toggle:hover,
.adwat-nav-toggle:focus-visible {
	color: var(--wp--preset--color--accent);
	border-color: var(--wp--preset--color--accent);
}

.adwat-nav summary::-webkit-details-marker,
.adwat-nav summary::marker {
	display: none;
	content: "";
}

@media (max-width: 44rem) {
	.adwat-nav {
		position: relative;
	}

	.js .adwat-nav-toggle {
		display: flex;
	}

	.js .adwat-nav-list {
		display: none;
		flex-direction: column;
		gap: var(--wp--preset--spacing--10);
		position: absolute;
		inset-inline: 0;
		margin-block-start: var(--wp--preset--spacing--20);
		background: var(--wp--preset--color--paper);
		border: 1px solid var(--wp--preset--color--rule);
		padding: var(--wp--preset--spacing--20);
		z-index: 20;
	}

	.js .adwat-nav-toggle[aria-expanded="true"] + .adwat-nav-list {
		display: flex;
	}
}

.adwat-header-tools {
	display: flex;
	align-items: center;
	gap: var(--wp--preset--spacing--10);
}

/* الترويسة صف واحد دائماً: شعار في جهة، وأدوات في الأخرى.
   الانكسار إلى صفّين كان يبتلع ١٦٠px من أول شاشة على الجوال. */
header .wp-block-group {
	flex-wrap: nowrap;
	gap: var(--wp--preset--spacing--20);
}

@media (max-width: 48rem) {
	header .wp-block-group {
		gap: var(--wp--preset--spacing--10);
	}

	.adwat-site-logo img {
		height: 1.9rem;
	}

	.adwat-cmdk-trigger {
		display: none;
	}
}

.adwat-cmdk-trigger,
.adwat-theme-toggle {
	background: transparent;
	border: 1px solid var(--wp--preset--color--rule);
	color: var(--wp--preset--color--ink-muted);
	border-radius: 2px;
	padding: 0.35em 0.6em;
	font-size: var(--wp--preset--font-size--small);
	font-family: var(--wp--preset--font-family--mono);
	cursor: pointer;
	line-height: 1;
}

.adwat-cmdk-trigger:hover,
.adwat-theme-toggle:hover,
.adwat-cmdk-trigger:focus-visible,
.adwat-theme-toggle:focus-visible {
	color: var(--wp--preset--color--accent);
	border-color: var(--wp--preset--color--accent);
}

/* ---- الحبكة المسطّرة: خطوط القياس عند حدود الأقسام ---- */
.wp-site-blocks > .wp-block-group {
	position: relative;
	/* خط علوي دقيق يفصل كل قسم عن سابقه — لوح لا صفحة مسطّحة. */
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
}



.wp-site-blocks > .wp-block-group + .wp-block-group::before {
	content: "";
	display: block;
	height: 10px;
	margin-inline: 0;
	background-image: repeating-linear-gradient(
		90deg,
		var(--wp--preset--color--rule) 0,
		var(--wp--preset--color--rule) 1px,
		transparent 1px,
		transparent 12px
	);
	background-position: bottom;
	background-repeat: repeat-x;
	background-size: auto 6px;
	opacity: 0.5;
}

:root[data-theme="dark"] .wp-site-blocks > .wp-block-group + .wp-block-group::before {
	opacity: 0.15;
}

@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) .wp-site-blocks > .wp-block-group + .wp-block-group::before {
		opacity: 0.15;
	}
}

/* أرقام درافتنغ للأقسام — ٠١ / ٠٢ … */
.wp-site-blocks {
	counter-reset: adwat-section;
}

.wp-site-blocks > .wp-block-group > h2.wp-block-heading {
	counter-increment: adwat-section;
	position: relative;
}

.wp-site-blocks > .wp-block-group > h2.wp-block-heading::before {
	content: counter(adwat-section, arabic-indic) " — ";
	color: var(--wp--preset--color--ink-muted);
	font-family: var(--wp--preset--font-family--mono);
	font-weight: 400;
	font-size: var(--wp--preset--font-size--medium);
	unicode-bidi: isolate;
}

/* ---- الحركة عند التمرير — CSS بحتة ---- */
@supports (animation-timeline: view()) {
	@media (prefers-reduced-motion: no-preference) {
		.wp-site-blocks > .wp-block-group > h2.wp-block-heading,
		.adwat-card,
		.adwat-spine {
			animation: adwat-rise-fade linear both;
			animation-timeline: view();
			animation-range: entry 0% cover 30%;
		}

		.adwat-grid .adwat-card:nth-child(1) { animation-delay: 0ms; }
		.adwat-grid .adwat-card:nth-child(2) { animation-delay: 80ms; }
		.adwat-grid .adwat-card:nth-child(3) { animation-delay: 160ms; }
	}
}

@keyframes adwat-rise-fade {
	from {
		opacity: 0;
		transform: translateY(0.75rem);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@media (prefers-reduced-motion: reduce) {
	.wp-site-blocks > .wp-block-group > h2.wp-block-heading,
	.adwat-card,
	.adwat-spine {
		animation: none !important;
	}
}

/* ---- الحبيبة الورقية ---- */
.adwat-grain {
	position: fixed;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	opacity: 0.035;
	mix-blend-mode: multiply;
}

:root[data-theme="dark"] .adwat-grain {
	opacity: 0.06;
	mix-blend-mode: overlay;
}


.adwat-grain svg {
	width: 100%;
	height: 100%;
}

/* ---- الصورة الرئيسية ----
   الصورة معكوسة أفقياً: الأدوات في اليسار والورق الفارغ في اليمين،
   أي في جهة بداية القراءة بالعربية. لذلك يجلس النص فوق الفراغ نفسه
   بدل أن يُزاحم الأدوات. على الشاشات الضيقة يصبح شريطاً مستقلاً. */
/* يفيض الهيرو إلى حافتي الشاشة رغم حشو الجذر. */
.adwat-hero {
	position: relative;
	margin-inline: calc(50% - 50vw);
	width: 100vw;
	max-width: 100vw;
	padding-inline: 0;
}

.adwat-hero-split {
	display: grid;
	gap: var(--wp--preset--spacing--30);
}


.adwat-hero-media-wrap {
	order: 2;
	aspect-ratio: 16 / 10;
	overflow: hidden;
}

.adwat-hero-media-wrap picture,
.adwat-hero-media-wrap img {
	display: block;
	width: 100%;
	height: 100%;
}

.adwat-hero-media-wrap img {
	object-fit: cover;
	object-position: 30% center;
}

@media (min-width: 64rem) {
	/* الصورة تملأ الخلفية كاملة، والنص يقف في الثلث الأيمن فوق الورق الفارغ. */
	.adwat-hero-split {
		position: relative;
		min-block-size: 33rem;
		align-items: center;
	}

	.adwat-hero-media-wrap {
		position: absolute;
		inset: 0;
		order: 0;
		aspect-ratio: auto;
		z-index: 0;
	}

	.adwat-hero-media-wrap img {
		object-position: 0% center;
	}

	.adwat-hero-text {
		position: relative;
		z-index: 1;
		max-width: 33rem;
		margin-inline: 0 auto;
		padding-inline: var(--wp--preset--spacing--40);
		padding-block: var(--wp--preset--spacing--40);
	}

	/* تدرّج من الورق عند حافة النص إلى الشفافية فوق الأدوات — يضمن التباين
	   دون أن يغسل الصورة. */
	.adwat-hero.has-image .adwat-hero-split::before {
		content: "";
		position: absolute;
		inset: 0;
		z-index: 0;
		background: linear-gradient(
			to left,
			var(--wp--preset--color--paper) 0%,
			var(--wp--preset--color--paper) 34%,
			color-mix(in srgb, var(--wp--preset--color--paper) 85%, transparent) 48%,
			color-mix(in srgb, var(--wp--preset--color--paper) 25%, transparent) 64%,
			transparent 78%
		);
	}
}

@media (min-width: 64rem) and (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) .adwat-hero-media-wrap img {
		opacity: 0.55;
	}
}

:root[data-theme="dark"] .adwat-hero-media-wrap img {
	opacity: 0.55;
}

/* ---- إيقاع رأسي — تباين واضح بين الأقسام بدل تساوٍ مملّ ---- */
.wp-site-blocks > .wp-block-group {
	padding-block: var(--wp--preset--spacing--40);
}

.wp-site-blocks > .wp-block-group.adwat-hero {
	padding-block: var(--wp--preset--spacing--60) var(--wp--preset--spacing--50);
}

.wp-site-blocks > .wp-block-group.is-adwat-tool-index {
	padding-block: var(--wp--preset--spacing--20);
}

/* ---- فهرس الأدوات المضغوط — قائمة مسطّرة، لا بطاقات ---- */
/* أهدأ بصرياً من بقية الأقسام: عنوان أصغر، مساحة أقل، بلا صور كبيرة */
.wp-block-group.is-adwat-tool-index > h2.wp-block-heading {
	font-size: var(--wp--preset--font-size--medium);
	margin-block-end: var(--wp--preset--spacing--10);
}

.adwat-grid.adwat-tool-index {
	display: block;
	gap: 0;
}

.adwat-tool-row {
	display: flex;
	align-items: baseline;
	gap: var(--wp--preset--spacing--20);
	padding-block: 0.55em;
	border-block-end: 1px solid var(--wp--preset--color--rule);
	font-size: var(--wp--preset--font-size--small);
}

.adwat-tool-row:first-child {
	border-block-start: 1px solid var(--wp--preset--color--rule);
}

.adwat-tool-row-title {
	flex: 0 0 auto;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 600;
	font-size: var(--wp--preset--font-size--medium);
	color: var(--wp--preset--color--ink);
}

.adwat-tool-row-desc {
	flex: 1 1 auto;
	min-width: 0;
	color: var(--wp--preset--color--ink-muted);
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	line-clamp: 1;
}

.adwat-tool-row .adwat-status {
	flex: 0 0 auto;
}

/* ---- الروابط: خط سفلي اتجاهي عند المرور ---- */
.wp-block-post-content a:not(.wp-element-button),
.adwat-card h3 a {
	background-image: linear-gradient(var(--wp--preset--color--accent), var(--wp--preset--color--accent));
	background-repeat: no-repeat;
	background-position: 100% 100%;
	background-size: 0% 1px;
	transition: background-size 0.2s ease;
	text-decoration: none !important;
}

.wp-block-post-content a:not(.wp-element-button):hover,
.wp-block-post-content a:not(.wp-element-button):focus-visible,
.adwat-card h3 a:hover,
.adwat-card h3 a:focus-visible {
	background-size: 100% 1px;
}

@media (prefers-reduced-motion: reduce) {
	.wp-block-post-content a:not(.wp-element-button),
	.adwat-card h3 a {
		transition: none;
	}
}

/* بطاقة الحوافّ فقط عند المرور — بلا ظل */
.adwat-card {
	transform: translateY(0);
	transition: border-color 0.15s ease, transform 0.15s ease;
}

.adwat-card:hover,
.adwat-card:focus-within {
	transform: translateY(-1px);
}

@media (prefers-reduced-motion: reduce) {
	.adwat-card {
		transition: border-color 0.15s ease;
	}

	.adwat-card:hover,
	.adwat-card:focus-within {
		transform: none;
	}
}

/* ---- لوحة الأوامر ---- */
.adwat-cmdk {
	position: fixed;
	inset: 0;
	z-index: 100;
	background: color-mix(in srgb, var(--wp--preset--color--ink) 45%, transparent);
	display: flex;
	align-items: flex-start;
	justify-content: center;
	padding-block-start: 12vh;
}

/* An explicit `display` beats the `hidden` attribute, so restate it. */
.adwat-cmdk[hidden] {
	display: none;
}

.adwat-cmdk-panel {
	width: min(34rem, 92vw);
	background: var(--wp--preset--color--paper);
	border: 1px solid var(--wp--preset--color--rule);
	border-radius: 2px;
}

.adwat-cmdk-field {
	border-bottom: 1px solid var(--wp--preset--color--rule);
}

#adwat-cmdk-input {
	width: 100%;
	border: 0;
	background: transparent;
	color: var(--wp--preset--color--ink);
	font: inherit;
	padding: var(--wp--preset--spacing--20);
}

#adwat-cmdk-input:focus {
	outline: none;
}

.adwat-cmdk-list {
	list-style: none;
	margin: 0;
	padding: 0.4em 0;
	max-height: 50vh;
	overflow-y: auto;
}

.adwat-cmdk-list li {
	padding: 0.55em var(--wp--preset--spacing--20);
	cursor: pointer;
	font-size: var(--wp--preset--font-size--medium);
}

.adwat-cmdk-list li a {
	color: inherit;
	text-decoration: none;
	display: block;
}

.adwat-cmdk-list li[aria-selected="true"] {
	background: var(--wp--preset--color--paper-sunk);
	border-inline-start: 3px solid var(--wp--preset--color--accent);
}

.adwat-cmdk-empty {
	padding: var(--wp--preset--spacing--20);
	color: var(--wp--preset--color--ink-muted);
	margin: 0;
}


/* ============================================================
   الرئيسية — إيقاع رأسي واحد، حاوية واحدة، هرم بصري واحد
   ============================================================

   ponytail: this section replaces both the pinned "cinematic stage" and the
   alternating scene layout that came after it. Measured cause, not taste:
   the stage was 3328px of a 4570px document (73% of the page) for one screen
   of content, and it stacked four text blocks in one grid cell, relying on
   GSAP to hide three of them — so the headline rendered four times over in
   any full-page capture and whenever the script was slow or blocked.

   Rules here: one container width, one spacing scale between sections, and
   every element fully visible and correctly placed before JavaScript runs.
   ============================================================ */

:root {
	/* المسافة بين الأقسام — 80px على الجوال، 140px على سطح المكتب. */
	--adwat-rhythm: clamp(5rem, 7vw, 8.75rem);
	--adwat-measure: 1180px;
	--adwat-gutter: clamp(1.25rem, 4vw, 3.5rem);
}

.adwat-atelier-content {
	display: flex;
	flex-direction: column;
	gap: var(--adwat-rhythm);
	padding-block-end: var(--adwat-rhythm);
	/* The wrapper itself inherits the theme's contentSize (704px) from
	   `is-layout-constrained`. Capping the page at 704px is what squeezed the
	   hero into a 277px column and broke the headline one word per line. */
	inline-size: 100%;
	max-width: none;
}

.adwat-atelier-content > * {
	inline-size: min(var(--adwat-measure), 100%);
	/* WordPress's `is-layout-constrained` caps every child at the theme's
	   contentSize; without this the hero collapsed to ~270px and the headline
	   broke one word per line. */
	max-width: none;
	margin-inline: auto;
	padding-inline: var(--adwat-gutter);
	box-sizing: border-box;
}

/* ---------- الواجهة ---------- */

.adwat-hero {
	padding-block-start: clamp(2.5rem, 5vw, 4.5rem);
}

.adwat-hero-inner {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
	gap: clamp(2rem, 4vw, 4rem);
	align-items: center;
}

.adwat-eyebrow {
	margin: 0 0 var(--wp--preset--spacing--20);
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--small);
	letter-spacing: 0.1em;
	color: var(--wp--preset--color--ink-muted);
	display: flex;
	align-items: center;
	gap: 0.75em;
}

.adwat-eyebrow::after {
	content: "";
	inline-size: clamp(2rem, 5vw, 4rem);
	block-size: 1px;
	background: var(--wp--preset--color--accent);
}

.adwat-hero-title {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	font-size: clamp(2.25rem, 4.4vw, 4rem);
	line-height: 1.38;
	letter-spacing: -0.015em;
	margin: 0 0 var(--wp--preset--spacing--30);
	text-wrap: balance;
}

.adwat-hero-lead {
	font-size: clamp(1.0625rem, 1.15vw, 1.1875rem);
	line-height: 1.9;
	color: var(--wp--preset--color--ink-muted);
	max-inline-size: 46ch;
	margin: 0 0 var(--wp--preset--spacing--40);
}

.adwat-hero-actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--20);
	margin: 0;
}

/* اللوحة الحيّة في عمودها الخاص — لا تشارك النص مساحته أبداً. */
.adwat-hero-visual {
	position: relative;
	aspect-ratio: 1 / 1;
	min-block-size: 20rem;
}

/* ---------- الأزرار: ثلاثة أشكال فقط ---------- */

.adwat-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-block-size: 3rem;
	padding-inline: 1.75rem;
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--paper);
	border: 1px solid var(--wp--preset--color--ink);
	border-radius: 2px;
	font-family: var(--wp--preset--font-family--body);
	font-size: 1rem;
	font-weight: 600;
	text-decoration: none;
	transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.adwat-btn:hover,
.adwat-btn:focus-visible {
	background: var(--wp--preset--color--accent);
	border-color: var(--wp--preset--color--accent);
	color: #fff;
}

.adwat-btn.is-quiet {
	background: transparent;
	color: var(--wp--preset--color--ink);
	border-color: var(--wp--preset--color--rule);
}

.adwat-btn.is-quiet:hover,
.adwat-btn.is-quiet:focus-visible {
	background: transparent;
	color: var(--wp--preset--color--accent);
	border-color: var(--wp--preset--color--accent);
}

.adwat-link {
	color: var(--wp--preset--color--accent);
	text-decoration: none;
	border-block-end: 1px solid currentColor;
	padding-block-end: 1px;
}

.adwat-link:hover,
.adwat-link:focus-visible {
	color: var(--wp--preset--color--accent-sunk);
}

/* ---------- ترويسة القسم ---------- */

.adwat-section-head {
	margin-block-end: clamp(1.75rem, 3vw, 2.75rem);
	padding-block-start: var(--wp--preset--spacing--20);
	border-block-start: 1px solid var(--wp--preset--color--rule);
}

.adwat-section-num {
	margin: 0 0 var(--wp--preset--spacing--10);
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--ink-muted);
}

.adwat-section-title {
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(1.75rem, 2.6vw, 2.5rem);
	line-height: 1.45;
	margin: 0 0 var(--wp--preset--spacing--10);
}

.adwat-section-note {
	margin: 0;
	font-size: 1.0625rem;
	line-height: 1.8;
	color: var(--wp--preset--color--ink-muted);
	max-inline-size: 52ch;
}

/* ---------- كيف أعمل ---------- */

.adwat-steps {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(1.5rem, 3vw, 3rem);
}

.adwat-steps li {
	padding-block-start: var(--wp--preset--spacing--20);
	border-block-start: 2px solid var(--wp--preset--color--ink);
}

.adwat-step-num {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--ink-muted);
}

.adwat-steps h3 {
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(1.375rem, 1.9vw, 1.75rem);
	line-height: 1.5;
	margin: var(--wp--preset--spacing--10) 0 var(--wp--preset--spacing--20);
}

.adwat-steps p {
	margin: 0;
	font-size: 1rem;
	line-height: 1.9;
	color: var(--wp--preset--color--ink-muted);
}

/* ---------- ما أبنيه ---------- */

.adwat-project {
	border: 1px solid var(--wp--preset--color--rule);
	border-radius: 2px;
	padding: clamp(1.5rem, 3vw, 2.75rem);
	background: var(--wp--preset--color--paper);
}

.adwat-project-name {
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(1.5rem, 2.2vw, 2rem);
	line-height: 1.5;
	margin: 0 0 var(--wp--preset--spacing--20);
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.75em;
}

.adwat-project p {
	margin: 0 0 var(--wp--preset--spacing--20);
	font-size: 1.0625rem;
	line-height: 1.9;
	color: var(--wp--preset--color--ink-muted);
	max-inline-size: 62ch;
}

.adwat-project-links {
	margin: 0;
}

/* الشارة شارة حالة، لا زر: لا تُنقر، ولا تشبه ما يُنقر. */
.adwat-project-name .adwat-status {
	font-size: 0.8125rem;
	padding-inline: 0.75em;
	padding-block: 0.3em;
	line-height: 1.5;
}

/* ---------- اعمل معي ---------- */

.adwat-lede {
	font-size: clamp(1.125rem, 1.5vw, 1.375rem);
	line-height: 1.85;
	max-inline-size: 58ch;
	margin: 0 0 var(--wp--preset--spacing--30);
}

.adwat-work p:last-child {
	margin: 0;
}

/* ---------- الختام ---------- */

.adwat-closing-section {
	padding-block-start: var(--wp--preset--spacing--30);
	border-block-start: 1px solid var(--wp--preset--color--rule);
}

.adwat-closing {
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(1.5rem, 2.4vw, 2.125rem);
	line-height: 1.6;
	max-inline-size: 34ch;
	margin: 0;
}


/* ---------- الاستجابة ---------- */

@media (max-width: 64rem) {
	.adwat-steps {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 52rem) {
	.adwat-hero-inner {
		grid-template-columns: minmax(0, 1fr);
	}

	/* على الجوال اللوحة فوق النص، وبارتفاع محدود: لا واجهة بطول شاشتين. */
	.adwat-hero-visual {
		order: -1;
		aspect-ratio: auto;
		block-size: min(42vh, 17rem);
		min-block-size: 0;
	}

	.adwat-steps {
		grid-template-columns: minmax(0, 1fr);
		gap: var(--wp--preset--spacing--30);
	}

	.adwat-hero-actions .adwat-btn {
		flex: 1 1 14rem;
	}
}

/* ---------- الترويسة والتذييل: حجم ومساحة نقر ---------- */

/* الشعار كان 2.4rem — صغير على شاشة عريضة، وحدّ النقر تحته أصغر. */
.adwat-site-logo img {
	height: clamp(2.4rem, 2.6vw, 3.1rem);
}

.adwat-header-row {
	gap: var(--wp--preset--spacing--30);
	padding-block: var(--wp--preset--spacing--10);
}

.adwat-nav-list {
	gap: clamp(var(--wp--preset--spacing--20), 2vw, var(--wp--preset--spacing--40));
}

/* هدف نقر 44px كاملاً، وهو الحد الأدنى في WCAG 2.5.5 — الحشو السابق
   (0.4em) كان يعطي ~30px. */
.adwat-nav-list a {
	font-size: 1.0625rem;
	display: inline-flex;
	align-items: center;
	min-block-size: 2.75rem;
	padding-inline: 0.25rem;
}

.adwat-header-tools button {
	min-inline-size: 2.75rem;
	min-block-size: 2.75rem;
}

/* التذييل: هرم واضح بدل سطور متراصة. */
footer.wp-block-template-part {
	margin-block-start: 0;
	border-block-start: 1px solid var(--wp--preset--color--rule);
	padding-block: clamp(2.5rem, 4vw, 3.75rem);
}

footer .adwat-links {
	gap: var(--wp--preset--spacing--10);
	row-gap: var(--wp--preset--spacing--10);
}

footer .adwat-links a {
	display: inline-flex;
	align-items: center;
	min-block-size: 2.75rem;
}

/* ---------- إصلاحات الجوال المقيسة ---------- */

/* عناصر الشبكة تأخذ min-width:auto افتراضياً، فتتمدّد بعرض أطول كلمة فيها
   وتدفع الصفحة 4px خارج الشاشة على 390px. */
.adwat-hero-inner > * {
	min-inline-size: 0;
}

.adwat-hero-title,
.adwat-hero-lead,
.adwat-section-title,
.adwat-project-name,
.adwat-closing {
	overflow-wrap: break-word;
}

/* WCAG 2.5.5: هدف النقر 44x44 على الأقل. القياس أظهر أن زر القائمة ورابط
   المشروع ورابط الشعار كانت دون 40px.
   ponytail: الحجم فقط — لا display. إعلان display هنا ألغى قاعدة
   `.adwat-nav-toggle { display: none }` فظهر زر القائمة على سطح المكتب. */
.adwat-nav-toggle,
.adwat-header-tools button,
.custom-logo-link {
	min-inline-size: 2.75rem;
	min-block-size: 2.75rem;
}

.adwat-header-tools button,
.custom-logo-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.adwat-link {
	display: inline-flex;
	align-items: center;
	min-block-size: 2.75rem;
}

/* عند 360px تتزاحم الترويسة: الشعار + القائمة + أداتان بحدّ نقر 44px
   تتجاوز عرض الشاشة بـ 5px. الصف يلتفّ بدل أن يطفح. */
@media (max-width: 24rem) {
	.adwat-header-row {
		flex-wrap: wrap;
		row-gap: var(--wp--preset--spacing--10);
		padding-inline: var(--wp--preset--spacing--20);
	}

	.adwat-header-tools {
		gap: var(--wp--preset--spacing--10);
	}

	/* لوحة الأوامر تُفتح بالاختصار أو من القائمة؛ زرّها ليس ضرورياً هنا. */
	.adwat-cmdk-trigger {
		display: none;
	}
}

/* ============================================================
   الحركة والتباين — الصفحة كلها، لا الواجهة وحدها
   ============================================================ */

/* قناع الكلمة: الكلمة تصعد من سطرها بدل أن تظهر فجأة.
   overflow:clip لا hidden — hidden على سطر نصّي يقصّ النقاط والتشكيل
   في العربية عند بعض الخطوط. */
.adwat-w {
	display: inline-block;
	overflow: clip;
	overflow-clip-margin: 0.28em;
	vertical-align: top;
}

.adwat-w > span {
	display: inline-block;
	will-change: transform;
}

/* خط ترويسة القسم يُرسم من جهة القراءة (يمين في RTL). */
.adwat-section-head {
	--adwat-rule-scale: 1;
	position: relative;
	border-block-start: 0;
}

.adwat-section-head::before {
	content: "";
	position: absolute;
	inset-block-start: 0;
	inset-inline: 0;
	block-size: 1px;
	background: var(--wp--preset--color--rule);
	transform: scaleX(var(--adwat-rule-scale));
	transform-origin: right center;
}

/* ---------- كتلة داكنة: «كيف أعمل» ----------
   الصفحة كانت عاجية من أولها إلى آخرها، فبدت مسطّحة مهما كبر الخط.
   قسم واحد معكوس اللون يعطي الصفحة ثقلاً ويقسم التمرير إلى فصلين. */
.adwat-atelier-content > .adwat-method {
	inline-size: 100%;
	max-width: none;
	padding-inline: 0;
	/* ponytail: this used to be `background: ink` back when ink meant near-black
	   on ivory. The palette is dark-first now, so ink is the TEXT colour — that
	   rule turned the block white and left its headings light-on-light. The
	   block's job is contrast, not a specific colour: it takes the sunken
	   ground and keeps the page's own text colour. */
	background: var(--wp--preset--color--paper-sunk);
	color: var(--wp--preset--color--ink);
	padding-block: clamp(3.5rem, 6vw, 6.5rem);
	border-block: 1px solid var(--wp--preset--color--rule);
}

.adwat-method > * {
	inline-size: min(var(--adwat-measure), 100%);
	margin-inline: auto;
	padding-inline: var(--adwat-gutter);
	box-sizing: border-box;
}

.adwat-method .adwat-section-num,
.adwat-method .adwat-section-note,
.adwat-method .adwat-steps p {
	color: var(--wp--preset--color--ink-muted);
}

.adwat-method .adwat-steps li {
	border-block-start-color: var(--wp--preset--color--accent);
}

/* رقم الخطوة يكبر: هو ما يعطي القسم إيقاعه البصري. */
.adwat-method .adwat-step-num {
	font-size: clamp(1.75rem, 3vw, 2.75rem);
	line-height: 1;
	display: block;
	margin-block-end: var(--wp--preset--spacing--20);
	color: var(--wp--preset--color--accent);
}

/* ---------- ماذا تجد هنا ---------- */

.adwat-offer-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1px;
	background: var(--wp--preset--color--rule);
	border: 1px solid var(--wp--preset--color--rule);
	border-radius: 2px;
	overflow: hidden;
}

.adwat-offer-list li {
	background: var(--wp--preset--color--paper);
	padding: clamp(1.25rem, 2.4vw, 2rem);
	transition: background 0.2s ease;
}

.adwat-offer-list li:hover {
	background: var(--wp--preset--color--paper-sunk);
}

.adwat-offer-list h3 {
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(1.25rem, 1.7vw, 1.5rem);
	line-height: 1.5;
	margin: 0 0 var(--wp--preset--spacing--10);
}

.adwat-offer-list p {
	margin: 0;
	font-size: 1rem;
	line-height: 1.85;
	color: var(--wp--preset--color--ink-muted);
}

/* ---------- الختام: وزن أكبر ---------- */

.adwat-closing-section {
	text-align: center;
}

.adwat-closing {
	margin-inline: auto;
	font-size: clamp(1.75rem, 3vw, 2.75rem);
	max-inline-size: 26ch;
}

@media (max-width: 64rem) {
	.adwat-offer-list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 52rem) {
	.adwat-offer-list {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* theme.json يضبط لون العناوين صراحةً (elements.heading)، وهو إعلان مباشر
   يغلب أي لون موروث — فأي كتلة معكوسة تحتاج تصريحاً مقابلاً. */
.adwat-method :is(h2, h3),
.adwat-method .adwat-section-title,
.adwat-method .adwat-steps h3 {
	color: var(--wp--preset--color--ink);
}

/* ============================================================
   الحقول على طول الصفحة · أيقونات التواصل · الأرضية الداكنة
   ============================================================ */

/* لم تعد اللوحة واحدة مثبّتة على الشاشة: كل حقل يسكن مضيفه ويقيسه،
   ويتوقّف عن الرسم حين يخرج مضيفه من الشاشة. */
canvas.adwat-atelier {
	display: block;
}

/* شريط خلف قسم «كيف أعمل» — نسيج لا موضوع، فيبقى خلف النص بعيداً. */
.adwat-method {
	position: relative;
	overflow: hidden;
}

/* الشريط في الجهة المقابلة لبداية السطر: في RTL يبدأ النص يميناً، فوضعُ
   الحقل عند inline-start يضعه تحت النص مباشرة — وهو العطل نفسه الذي طاردناه
   في المسرح المحذوف. الحقل نسيج، والنص يسبقه دائماً. */
.adwat-field-band {
	position: absolute;
	inset-block: -12%;
	inset-inline-end: -6%;
	inline-size: 40%;
	opacity: 0.42;
	pointer-events: none;
}

/* الحقل بجانب لوحة المشروع، في عمود خاص به لا خلف النص. */
.adwat-project {
	position: relative;
	display: grid;
	grid-template-columns: 14rem minmax(0, 1fr);
	gap: clamp(1.5rem, 3vw, 3rem);
	align-items: center;
}

.adwat-field-panel {
	position: relative;
	aspect-ratio: 1 / 1;
	min-block-size: 11rem;
}

/* ختم الصفحة: العلامة تتشكّل خلف السطر الأخير. */
.adwat-closing-section {
	position: relative;
}

.adwat-field-seal {
	position: absolute;
	inset-block-start: 50%;
	inset-inline-start: 50%;
	inline-size: min(26rem, 76vw);
	aspect-ratio: 1 / 1;
	transform: translate(50%, -50%);
	opacity: 0.4;
	pointer-events: none;
}

.adwat-closing {
	position: relative;
}

/* ---------- أيقونات التواصل ---------- */

.adwat-social {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--10);
	list-style: none;
	margin: 0;
	padding: 0;
}

.adwat-social a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	inline-size: 2.75rem;
	block-size: 2.75rem;
	border: 1px solid var(--wp--preset--color--rule);
	border-radius: 999px;
	color: var(--wp--preset--color--ink-muted);
	text-decoration: none;
	transition: color 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
}

.adwat-social a:hover,
.adwat-social a:focus-visible {
	color: var(--wp--preset--color--accent);
	border-color: var(--wp--preset--color--accent);
	transform: translateY(-2px);
}

.adwat-social-icon {
	display: block;
}

/* ---------- الأرضية الداكنة ----------
   السؤال كان في محلّه: أرضية عاجية لموقع يبني بالذكاء الاصطناعي تجعل الحقل
   الحيّ رمادياً باهتاً، لأن الجزيئات الفاتحة لا تضيء على ورق فاتح. على أرضية
   شبه سوداء يضيء الأزرق ويصير الحقل هو ما يُرى أولاً. الألوان نفسها من اللوغو
   — أزرق العلامة مرفوع السطوع ليعبر تباين WCAG على أرضية داكنة. */

.adwat-method {
	/* الكتلة صارت معكوسة: فاتحة داخل صفحة داكنة، فتبقى القسمة إلى فصلين. */
	background: var(--wp--preset--color--paper-sunk);
	color: var(--wp--preset--color--ink);
}

.adwat-method :is(h2, h3),
.adwat-method .adwat-section-title,
.adwat-method .adwat-steps h3 {
	color: var(--wp--preset--color--ink);
}

.adwat-method .adwat-section-head::before {
	background: var(--wp--preset--color--rule);
}

.adwat-method .adwat-section-num,
.adwat-method .adwat-section-note,
.adwat-method .adwat-steps p {
	color: var(--wp--preset--color--ink-muted);
}

/* الأزرار على أرضية داكنة: الأساسي يصير مضيئاً بلون العلامة. */
.adwat-btn {
	background: var(--wp--preset--color--accent);
	border-color: var(--wp--preset--color--accent);
	color: #04070D;
}

.adwat-btn:hover,
.adwat-btn:focus-visible {
	background: #6FBEFF;
	border-color: #6FBEFF;
	color: #04070D;
}

.adwat-btn.is-quiet {
	background: transparent;
	color: var(--wp--preset--color--ink);
	border-color: var(--wp--preset--color--rule);
}

.adwat-btn.is-quiet:hover,
.adwat-btn.is-quiet:focus-visible {
	background: transparent;
	color: var(--wp--preset--color--accent);
	border-color: var(--wp--preset--color--accent);
}

/* اللوغو كحلي على شفاف — على أرضية داكنة يُرفع سطوعه بدل قلبه إلى أبيض. */
.adwat-site-logo img,
.custom-logo {
	filter: brightness(2.6) saturate(1.15);
}

:root[data-theme="light"] .adwat-site-logo img,
:root[data-theme="light"] .custom-logo {
	filter: none;
}

.adwat-project,
.adwat-offer-list li {
	background: var(--wp--preset--color--paper-sunk);
}

.adwat-offer-list li:hover {
	background: #141A26;
}

@media (max-width: 52rem) {
	.adwat-project {
		grid-template-columns: minmax(0, 1fr);
	}

	.adwat-field-panel {
		block-size: 9rem;
		min-block-size: 0;
		aspect-ratio: auto;
	}

	.adwat-field-band {
		inline-size: 70%;
		opacity: 0.32;
	}
}

/* The inner pages share the homepage's restrained editorial rhythm. */
body:not(.home) .wp-site-blocks > header {
	position: sticky;
	top: 0;
	z-index: 50;
	background: #091216;
}

body:not(.home) .wp-site-blocks > main {
	padding-block: clamp(3rem, 7vw, 7rem);
}

body:not(.home) .wp-site-blocks > main > h1,
body:not(.home) .wp-site-blocks > main .adwat-content > h1 {
	font-family: Alexandria, 'IBM Plex Sans Arabic', sans-serif;
	font-weight: 500;
	font-size: clamp(2.7rem, 5vw, 5rem);
	line-height: 1.55;
	margin-block: 0 1.4rem;
}

body:not(.home) .wp-site-blocks > main > p:first-of-type {
	max-width: 47rem;
	color: #adc2ca;
	font-size: clamp(1rem, 1.6vw, 1.3rem);
}

body:not(.home) .wp-site-blocks > main .wp-block-post-content {
	line-height: 2;
}

body:not(.home) .wp-site-blocks > main .wp-block-post-content > h2 {
	font-family: Alexandria, 'IBM Plex Sans Arabic', sans-serif;
	font-weight: 500;
	margin-block-start: 3.5rem;
}

.adwat-page-kicker {
	color: #9ad9ec;
	font-size: .8rem;
	letter-spacing: .04em;
}

.adwat-project-action a {
	display: inline-flex;
	min-height: 2.8rem;
	align-items: center;
	padding: .45rem 1.1rem;
	background: #9ad9ec;
	color: #10232a;
	font-weight: 600;
}

.single-adwat_project .adwat-project-intro {
	font-size: clamp(1.18rem, 2vw, 1.55rem);
	line-height: 1.9;
	color: #e4eef1;
	max-width: 49rem;
}

.single-adwat_project .adwat-project-facts {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1px;
	background: #4a6870;
	border: 1px solid #4a6870;
	margin-block: 2.5rem;
}

.single-adwat_project .adwat-project-facts > p {
	background: #10232a;
	padding: 1.25rem;
	margin: 0;
	line-height: 1.9;
}

.single-adwat_project .adwat-project-facts strong {
	display: block;
	color: #9ad9ec;
	margin-block-end: .35rem;
}

@media (max-width: 750px) {
	.single-adwat_project .adwat-project-facts { grid-template-columns: 1fr; }
}

.single-adwat_project .adwat-mabi3ati-screen {
	margin: 1.6rem 0 2.6rem;
}

.single-adwat_project .adwat-mabi3ati-screen a {
	display: block;
	border: 1px solid #4a6870;
	background: #101b2a;
	overflow: hidden;
}

.single-adwat_project .adwat-mabi3ati-screen a:focus-visible {
	outline: 3px solid #9ad9ec;
	outline-offset: 4px;
}

.single-adwat_project .adwat-mabi3ati-screen img {
	display: block;
	width: 100%;
	height: auto;
}

.single-adwat_project .adwat-mabi3ati-screen figcaption {
	margin-block-start: .7rem;
	color: #adc2ca;
	font-size: .95rem;
	line-height: 1.8;
}

/* The existing Spectra contact form started below the first viewport. */
body.page .uagb-block-aa447400 {
	padding-block-start: 2rem !important;
}

body.page .uagb-block-d924e245 {
	padding-block-start: 1.2rem !important;
}

.adwat-affiliate-disclosure {
	border-inline-start: 3px solid #9ad9ec;
	background: #12232a;
	padding: 1rem 1.3rem;
	margin-block: 0 2rem;
	color: #d6e5e9;
}

.adwat-knowledge-hub > h2 {
	font-family: Alexandria, 'IBM Plex Sans Arabic', sans-serif;
	font-size: clamp(1.9rem, 3vw, 3rem);
	font-weight: 500;
}

.adwat-knowledge-videos {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.5rem;
	margin-block: 3rem;
}

.adwat-knowledge-videos article {
	min-width: 0;
	border-bottom: 1px solid #33444c;
	padding-bottom: 1rem;
}

.adwat-knowledge-videos img {
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}

.adwat-knowledge-videos h3 {
	font-family: Alexandria, 'IBM Plex Sans Arabic', sans-serif;
	font-weight: 500;
	font-size: 1.25rem;
	margin-block: 1rem .5rem;
}

.adwat-knowledge-videos span {
	color: #9ad9ec;
}

.adwat-knowledge-notes {
	list-style: none;
	padding: 0;
}

.adwat-knowledge-notes li {
	border-bottom: 1px solid #33444c;
	padding-block: .8rem;
}

@media (max-width: 44rem) {
	.adwat-knowledge-videos { grid-template-columns: 1fr; }
}
