/* مقترح 7 - التنسيقات الرئيسية (RTL)
   القيم المتغيّرة (ألوان/خطوط/أحجام) تأتي من لوحة التخصيص عبر :root */

:root {
	/* قيم افتراضية تُستبدل من لوحة التخصيص */
	--c-primary: #2f5a3d;
	--c-primary-rgb: 47, 90, 61;
	--c-secondary: #bccbac;
	--c-secondary-rgb: 188, 203, 172;
	--c-bg: #faf9f6;
	--c-bg-alt: #eef1e6;
	--c-card: #ffffff;
	--c-text: #2b3a31;
	--c-heading: #1e3a2a;
	--c-muted: #6b7a70;
	--c-border: #e3e7dc;
	--c-btn-bg: #bccbac;
	--c-btn-text: #1e3a2a;
	--c-btn-hover: #a9bb98;
	--c-header-bg: #faf9f6;
	--c-footer-bg: #e5ebd9;
	--font-body: "Tajawal", Tahoma, sans-serif;
	--font-head: "Readex Pro", "Tajawal", Tahoma, sans-serif;
	--fs-base: 16px;
	--lh: 1.8;
	--fs-h1: 56px;
	--fs-h2: 40px;
	--fs-h3: 22px;
	--head-weight: 600;
	--btn-radius: 999px;
	--btn-py: 14px;
	--btn-px: 30px;
	--btn-fs: 15px;
	--btn-shadow: 0 8px 20px rgba(47, 90, 61, .22);
	--container: 1200px;
	--section-py: 100px;
	--radius: 24px;
	--logo-w: 48px;
	--logo-w-m: 40px;
	--title-size: 26px;
	--tagline-size: 11px;
	--header-h: 76px;
	--nav-fs: 14px;
	--blog-cols: 3;

	/* مقاسات مشتقة (تتغير حسب الشاشة) */
	--scale-h: 1;      /* مقياس العناوين */
	--scale-s: 1;      /* مقياس مسافات الأقسام */
	--gutter: clamp(16px, 4vw, 48px);
	--gap: clamp(28px, 5vw, 70px);
	--shadow: 0 10px 30px rgba(var(--c-primary-rgb), .08);
}

/* شاشات متوسطة وصغيرة: تصغير العناوين والمسافات تلقائياً بالنسبة لقيم التخصيص */
@media (max-width: 1279px) { :root { --scale-h: .94; --scale-s: .92; } }
@media (max-width: 1023px) { :root { --scale-h: .84; --scale-s: .8; } }
@media (max-width: 767px)  { :root { --scale-h: .72; --scale-s: .68; } }
@media (max-width: 479px)  { :root { --scale-h: .64; --scale-s: .58; } }

*, *::before, *::after { box-sizing: border-box; }

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
	scroll-padding-top: calc(var(--header-h) + 16px);
}

body {
	margin: 0;
	font-family: var(--font-body);
	font-size: var(--fs-base);
	line-height: var(--lh);
	color: var(--c-text);
	background: var(--c-bg);
	-webkit-font-smoothing: antialiased;
	overflow-x: clip;
	overflow-wrap: break-word;
}
@media (max-width: 479px) { body { font-size: max(14px, calc(var(--fs-base) - 1px)); } }

img, svg, video, iframe { max-width: 100%; }
img { height: auto; display: block; }
a { color: inherit; text-decoration: none; }
p { margin: 0 0 1em; }
ul, ol { margin: 0; padding: 0; }
ul { list-style: none; }

h1, h2, h3, h4 {
	font-family: var(--font-head);
	font-weight: var(--head-weight);
	color: var(--c-heading);
	margin: 0 0 .5em;
	line-height: 1.35;
}
h1 { font-size: max(28px, calc(var(--fs-h1) * var(--scale-h))); }
h2 { font-size: max(22px, calc(var(--fs-h2) * var(--scale-h))); }
h3 { font-size: max(18px, calc(var(--fs-h3) * var(--scale-h))); }
h4 { font-size: 1.05em; }

.container {
	width: min(var(--container), calc(100% - 2 * var(--gutter)));
	margin-inline: auto;
}
.narrow { width: min(860px, calc(100% - 2 * var(--gutter))); }

.screen-reader-text {
	position: absolute !important; width: 1px; height: 1px; overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px); white-space: nowrap;
}
.skip-link:focus {
	clip: auto; width: auto; height: auto; top: 8px; right: 8px; z-index: 100;
	background: var(--c-card); color: var(--c-heading); padding: 10px 16px; border-radius: 8px;
}

/* ---------- أزرار ---------- */
.btn {
	display: inline-flex; align-items: center; justify-content: center; text-align: center;
	padding: var(--btn-py) var(--btn-px);
	border-radius: var(--btn-radius); border: 1px solid transparent;
	font-family: var(--font-head); font-weight: 500; font-size: var(--btn-fs); line-height: 1.4;
	cursor: pointer; transition: transform .2s, box-shadow .2s, background .2s;
}
.btn:hover { transform: translateY(-2px); }
.btn-primary { background: var(--c-btn-bg); color: var(--c-btn-text); box-shadow: var(--btn-shadow); }
.btn-primary:hover { background: var(--c-btn-hover); }
.btn-outline { background: var(--c-card); color: var(--c-heading); border-color: var(--c-border); }
.btn-outline:hover { border-color: var(--c-primary); }
.btn-sm { padding: calc(var(--btn-py) * .65) calc(var(--btn-px) * .75); font-size: calc(var(--btn-fs) - 1px); }
.btn-block { width: 100%; }
.btn-row { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.btn:focus-visible, a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
	outline: 2px solid var(--c-primary); outline-offset: 2px;
}

.eyebrow {
	display: inline-flex; align-items: center; gap: 12px;
	font-family: var(--font-head); font-size: .82em; color: var(--c-primary); margin-bottom: 16px;
}
.eyebrow::after { content: ""; width: 34px; height: 1px; background: var(--c-primary); }

.chip {
	display: inline-block; background: var(--c-bg-alt); color: var(--c-muted);
	border-radius: 999px; padding: 2px 14px; font-size: .78em; line-height: 1.8;
}
a.chip:hover { color: var(--c-primary); }

/* ---------- الهيدر ---------- */
.site-header {
	position: sticky; top: 0; z-index: 50;
	background: var(--c-header-bg);
	border-bottom: 1px solid var(--c-border);
}
.admin-bar .site-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .site-header { top: 46px; } }

.header-inner {
	display: flex; align-items: center; justify-content: space-between; gap: 20px;
	min-height: var(--header-h);
}

.brand { display: inline-flex; align-items: center; gap: 10px; min-width: 0; }
.brand a { display: inline-flex; align-items: center; }
.brand-mark, .custom-logo { width: var(--logo-w); height: auto; max-width: 100%; }
.brand-text { flex-direction: column; align-items: flex-start !important; line-height: 1.25; min-width: 0; }
.brand-name { font-family: var(--font-head); font-size: var(--title-size); font-weight: 500; color: var(--c-primary); line-height: 1.45; }
.brand-tag { font-size: var(--tagline-size); color: var(--c-heading); font-weight: 700; line-height: 1.3; }

.primary-nav { display: flex; align-items: center; gap: clamp(20px, 3vw, 36px); }
.nav-list { display: flex; align-items: center; gap: clamp(16px, 2.4vw, 30px); }
.nav-list a { font-size: var(--nav-fs); font-weight: 500; color: var(--c-heading); transition: color .2s; white-space: nowrap; }
.nav-list a:hover, .nav-list .current-menu-item > a { color: var(--c-primary); }

.nav-toggle { display: none; background: none; border: 0; padding: 12px; margin-inline-end: -12px; cursor: pointer; }
.nav-toggle .bars, .nav-toggle .bars::before, .nav-toggle .bars::after {
	display: block; width: 24px; height: 2px; background: var(--c-heading); position: relative; transition: .25s;
}
.nav-toggle .bars::before, .nav-toggle .bars::after { content: ""; position: absolute; right: 0; }
.nav-toggle .bars::before { top: -7px; }
.nav-toggle .bars::after { top: 7px; }

/* ---------- الأقسام ---------- */
.section { padding-block: calc(var(--section-py) * var(--scale-s)); }

.hero {
	position: relative; overflow: hidden;
	padding-block: calc(var(--section-py) * .7 * var(--scale-s)) calc(var(--section-py) * .9 * var(--scale-s));
	background: linear-gradient(180deg, var(--c-bg) 0%, var(--c-bg-alt) 100%);
}
.hero::before {
	content: ""; position: absolute; top: -120px; left: 6%; width: min(380px, 60vw); aspect-ratio: 1; border-radius: 50%;
	background: radial-gradient(circle, rgba(var(--c-secondary-rgb), .45), transparent 70%); pointer-events: none;
}
.hero-grid { position: relative; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: var(--gap); align-items: center; }
.hero h1 { line-height: 1.3; }
.lead { font-size: 1.08em; color: var(--c-muted); max-width: 600px; }

.arch-frame {
	position: relative; overflow: hidden; width: 100%; max-width: 520px;
	aspect-ratio: 1 / 1; background: var(--c-bg-alt);
	border-radius: 999px 999px var(--radius) var(--radius);
	box-shadow: var(--shadow);
}
.hero-media .arch-frame { margin-inline: auto 0; }
.arch-frame::after { content: ""; position: absolute; inset: 10px; border: 1px solid rgba(255, 255, 255, .55); border-radius: inherit; pointer-events: none; }
.arch-frame img { width: 100%; height: 100%; object-fit: cover; }
.arch-tall { aspect-ratio: 4 / 5; max-width: 460px; }

.img-placeholder {
	display: flex; align-items: center; justify-content: center; width: 100%; height: 100%;
	background: linear-gradient(135deg, var(--c-bg-alt), var(--c-secondary)); color: rgba(var(--c-primary-rgb), .45);
}

/* من نحن */
.about-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: var(--gap); align-items: center; }
.about-content p { color: var(--c-muted); }
.about-media .arch-frame { margin-inline: 0 auto; }
.mini-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 28px; }
.mini-card { background: var(--c-card); border: 1px solid var(--c-border); border-radius: calc(var(--radius) * .8); padding: 22px; }
.mini-card p { font-size: .9em; margin: 8px 0 0; }
.mini-num { font-family: var(--font-head); font-size: 1.25em; font-weight: 600; color: var(--c-primary); }

/* الخدمات */
.section-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 40px; margin-bottom: 44px; }
.section-head h2 { margin-bottom: 0; }
.section-head > p { max-width: 340px; color: var(--c-muted); font-size: .9em; margin: 0; }
.cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 26px; }
.card {
	background: var(--c-card); border: 1px solid var(--c-border); border-radius: var(--radius);
	padding: 22px; box-shadow: var(--shadow); transition: transform .25s;
	display: flex; flex-direction: column;
}
.card:hover { transform: translateY(-6px); }
.card-img { aspect-ratio: 16 / 10; border-radius: calc(var(--radius) * .7); overflow: hidden; margin-bottom: 18px; background: var(--c-bg-alt); }
.card-img img { width: 100%; height: 100%; object-fit: cover; }
.card-meta { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.card-icon { color: var(--c-primary); display: inline-flex; }
.card p { color: var(--c-muted); font-size: .92em; flex: 1; }
.card .btn { align-self: flex-start; }

/* لماذا نحن */
.why { background: var(--c-bg-alt); }
.why-grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: var(--gap); align-items: center; }
.why-shape {
	aspect-ratio: 1 / 1; overflow: hidden; background: var(--c-secondary); width: 100%; max-width: 560px;
	border-radius: var(--radius) 999px var(--radius) var(--radius); box-shadow: var(--shadow);
}
.why-shape img { width: 100%; height: 100%; object-fit: cover; }
.features { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 28px; }
.feature {
	display: flex; gap: 12px; align-items: flex-start; background: var(--c-bg);
	border: 1px solid var(--c-border); border-radius: calc(var(--radius) * .75); padding: 18px;
}
.feature h4 { margin: 0 0 4px; }
.feature p { font-size: .85em; color: var(--c-muted); margin: 0; line-height: 1.7; }
.dot { flex: none; width: 14px; height: 14px; margin-top: 7px; border-radius: 50%; background: var(--c-primary); box-shadow: 0 0 0 4px rgba(var(--c-primary-rgb), .18); }

/* التواصل */
.contact-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--gap); align-items: center; }
.contact-content p { color: var(--c-muted); max-width: 520px; }
.contact-points { display: flex; flex-wrap: wrap; gap: 14px 28px; margin-top: 24px; font-size: .85em; color: var(--c-heading); }
.contact-points li { display: inline-flex; align-items: center; gap: 8px; }
.contact-points .icon { color: var(--c-primary); width: 16px; height: 16px; }
.contact-form-wrap { background: var(--c-card); border: 1px solid var(--c-border); border-radius: var(--radius); padding: clamp(20px, 3vw, 32px); box-shadow: var(--shadow); }
.form-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
.field { margin-bottom: 18px; min-width: 0; }
.form-row .field:only-child { grid-column: 1 / -1; }
.field label { display: block; font-size: .8em; font-weight: 700; color: var(--c-heading); margin-bottom: 6px; }
.field input, .field select, .field textarea {
	width: 100%; padding: 13px 18px; font: inherit; font-size: max(16px, .92em); color: var(--c-text);
	background: var(--c-bg); border: 1px solid var(--c-border); border-radius: calc(var(--radius) * .65);
	transition: border-color .2s, box-shadow .2s;
}
.field input:focus, .field select:focus, .field textarea:focus {
	outline: none; border-color: var(--c-primary); box-shadow: 0 0 0 4px rgba(var(--c-primary-rgb), .15);
}
.field textarea { resize: vertical; min-height: 110px; }
.quote-form { position: relative; }
.hp-field { position: absolute; top: 0; right: 0; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); opacity: 0; pointer-events: none; }
.notice { border-radius: 14px; padding: 12px 18px; margin-bottom: 18px; font-size: .92em; }
.notice-success { background: #e4f1e4; color: #24602f; }
.notice-error { background: #fbe9e7; color: #9a2f22; }

/* الفوتر */
.site-footer { background: var(--c-footer-bg); padding: calc(var(--section-py) * .6 * var(--scale-s)) 0 24px; }
.footer-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, .8fr) minmax(0, 1fr); gap: clamp(28px, 4vw, 50px); padding-bottom: 36px; border-bottom: 1px solid rgba(var(--c-primary-rgb), .18); }
.footer-col h3 { font-size: 1em; margin-bottom: 14px; }
.footer-col p, .footer-list li { font-size: .88em; color: var(--c-muted); }
.footer-list li { margin-bottom: 8px; }
.footer-list a:hover { color: var(--c-primary); }
.footer-about p { margin-top: 14px; max-width: 380px; }
.footer-bottom { display: flex; justify-content: space-between; gap: 16px; padding-top: 20px; font-size: .8em; color: var(--c-muted); }
.footer-bottom p { margin: 0; }

/* أزرار الاتصال والواتساب العائمة */
:root { --float-size: 54px; --float-text: 14px; --float-bottom: 20px; --float-edge: 20px; --float-radius: 999px; --call-bg: #2f5a3d; --call-color: #fff; --wa-bg: #25d366; --wa-color: #fff; }
.float-actions { position: fixed; bottom: var(--float-bottom); z-index: 60; display: flex; flex-direction: column; gap: 10px; }
.float-actions.pos-left { left: var(--float-edge); align-items: flex-start; }
.float-actions.pos-right { right: var(--float-edge); align-items: flex-end; }
.float-btn {
	display: inline-flex; align-items: center; height: var(--float-size); min-width: var(--float-size);
	border-radius: var(--float-radius); box-shadow: 0 8px 22px rgba(0, 0, 0, .25); overflow: hidden;
	font-family: var(--font-head); font-size: var(--float-text); font-weight: 500; line-height: 1;
	transition: transform .2s, filter .2s;
}
.float-btn:hover { transform: translateY(-3px); filter: brightness(1.06); }
.float-call { background: var(--call-bg); color: var(--call-color); }
.float-wa { background: var(--wa-bg); color: var(--wa-color); }
.float-icon { display: flex; align-items: center; justify-content: center; flex: none; width: var(--float-size); height: var(--float-size); }
.float-icon .icon { width: calc(var(--float-size) * .48); height: calc(var(--float-size) * .48); }
.float-img { width: calc(var(--float-size) * .5); height: calc(var(--float-size) * .5); object-fit: contain; }
.float-text { display: none; padding-inline-end: 20px; white-space: nowrap; }
.float-actions.show-text .float-text { display: inline; }
.float-actions.shape-circle .float-text { display: none !important; }
.float-actions.shape-circle .float-btn { border-radius: 50%; }
@media (min-width: 768px) {
	.float-actions.hide-desktop, .float-btn.only-mobile { display: none; }
}
@media (max-width: 767px) {
	.float-actions.hide-mobile { display: none; }
	.float-actions.show-text .float-text { display: none; }
	.float-actions.show-text.show-text-mobile .float-text { display: inline; }
	.float-actions { bottom: calc(var(--float-bottom) * .8); }
}

/* ---------- المدونة ---------- */
.page-hero {
	text-align: center;
	padding-block: calc(var(--section-py) * .6 * var(--scale-s));
	background: linear-gradient(180deg, var(--c-bg) 0%, var(--c-bg-alt) 100%);
	border-bottom: 1px solid var(--c-border);
}
.page-hero h1 { margin-bottom: .3em; }
.page-hero .lead { margin-inline: auto; margin-bottom: 0; }
.page-hero .eyebrow { justify-content: center; }
.page-hero .btn { margin-top: 20px; }
.single-hero h1 { font-size: max(26px, calc(var(--fs-h1) * .75 * var(--scale-h))); }

.blog-section { padding-top: calc(var(--section-py) * .6 * var(--scale-s)); }
.posts-grid { display: grid; grid-template-columns: repeat(var(--blog-cols), minmax(0, 1fr)); gap: clamp(18px, 2.4vw, 28px); }
.post-card {
	display: flex; flex-direction: column; overflow: hidden;
	background: var(--c-card); border: 1px solid var(--c-border); border-radius: var(--radius);
	box-shadow: var(--shadow); transition: transform .25s;
}
.post-card:hover { transform: translateY(-5px); }
.post-card-img { display: block; aspect-ratio: 16 / 10; overflow: hidden; background: var(--c-bg-alt); }
.post-card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.post-card:hover .post-card-img img { transform: scale(1.04); }
.post-card-body { display: flex; flex-direction: column; flex: 1; padding: 20px 22px 24px; }
.post-card-top { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; margin-bottom: 10px; font-size: .8em; color: var(--c-muted); }
.post-card-top:empty { display: none; }
.post-meta { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; }
.post-meta .sep { opacity: .5; }
.post-card-title { font-size: max(18px, calc(var(--fs-h3) * var(--scale-h))); margin-bottom: .4em; }
.post-card-title a:hover { color: var(--c-primary); }
.post-card-excerpt { color: var(--c-muted); font-size: .92em; flex: 1; }
.read-more { align-self: flex-start; margin-top: 4px; font-family: var(--font-head); font-size: .88em; font-weight: 500; color: var(--c-primary); }
.read-more:hover { text-decoration: underline; }

.navigation.pagination { margin-top: 44px; }
.pagination .nav-links { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.page-numbers {
	display: inline-flex; align-items: center; justify-content: center; min-width: 42px; height: 42px; padding: 0 14px;
	border-radius: var(--btn-radius); background: var(--c-card); border: 1px solid var(--c-border);
	color: var(--c-heading); font-size: .9em; transition: background .2s;
}
a.page-numbers:hover { background: var(--c-bg-alt); }
.page-numbers.current { background: var(--c-btn-bg); color: var(--c-btn-text); border-color: transparent; }
.page-numbers.dots { background: none; border: 0; }

.empty-state { text-align: center; max-width: 520px; margin-inline: auto; }
.search-form { display: flex; gap: 8px; margin-top: 20px; }
.search-form label { flex: 1; min-width: 0; }
.search-form .search-field {
	width: 100%; padding: 12px 18px; font: inherit; font-size: 16px; background: var(--c-card);
	border: 1px solid var(--c-border); border-radius: var(--btn-radius);
}
.search-form .search-submit {
	padding: 0 22px; border: 0; cursor: pointer; font: inherit; border-radius: var(--btn-radius);
	background: var(--c-btn-bg); color: var(--c-btn-text);
}

/* المقال المفرد والصفحات */
.single-section { padding-top: calc(var(--section-py) * .5 * var(--scale-s)); }
.single-thumb { border-radius: var(--radius); overflow: hidden; margin-bottom: 32px; box-shadow: var(--shadow); }
.single-thumb img { width: 100%; }
.entry-content { font-size: 1.04em; line-height: 2; }
.entry-content > *:first-child { margin-top: 0; }
.entry-content h2 { font-size: max(21px, calc(var(--fs-h2) * .72 * var(--scale-h))); margin-top: 1.6em; }
.entry-content h3 { font-size: max(18px, calc(var(--fs-h3) * 1.1 * var(--scale-h))); margin-top: 1.4em; }
.entry-content a { color: var(--c-primary); text-decoration: underline; text-underline-offset: 3px; }
.entry-content ul { list-style: disc; padding-inline-start: 1.4em; margin-bottom: 1em; }
.entry-content ol { padding-inline-start: 1.4em; margin-bottom: 1em; }
.entry-content img { border-radius: calc(var(--radius) * .6); }
.entry-content blockquote {
	margin: 1.6em 0; padding: 12px 22px; border-inline-start: 4px solid var(--c-primary);
	background: var(--c-bg-alt); border-radius: 0 12px 12px 0; color: var(--c-heading);
}
.entry-content table { width: 100%; border-collapse: collapse; display: block; overflow-x: auto; }
.entry-content th, .entry-content td { border: 1px solid var(--c-border); padding: 8px 12px; }
.entry-content pre { overflow-x: auto; background: var(--c-bg-alt); padding: 16px; border-radius: 12px; direction: ltr; text-align: left; }
.alignleft { float: left; margin: 0 1.2em 1em 0; }
.alignright { float: right; margin: 0 0 1em 1.2em; }
.aligncenter { margin-inline: auto; }
.wp-caption { max-width: 100%; }
.wp-caption-text, figcaption { font-size: .85em; color: var(--c-muted); text-align: center; }

.post-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 28px; }
.post-tags a { background: var(--c-bg-alt); border-radius: 999px; padding: 2px 14px; font-size: .85em; color: var(--c-muted); }
.post-tags a:hover { color: var(--c-primary); }
.post-navigation { margin-top: 44px; }
.post-navigation .nav-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.post-navigation a {
	display: block; height: 100%; padding: 16px 20px; background: var(--c-card);
	border: 1px solid var(--c-border); border-radius: calc(var(--radius) * .7);
}
.post-navigation a:hover { border-color: var(--c-primary); }
.post-navigation .nav-next { text-align: left; }
.nav-sub { display: block; font-size: .78em; color: var(--c-muted); }
.nav-title { display: block; font-family: var(--font-head); color: var(--c-heading); }

.comments-area { margin-top: 56px; }
.comments-title { font-size: max(20px, calc(var(--fs-h3) * var(--scale-h))); }
.comment-list { list-style: none; }
.comment-list .comment-body { background: var(--c-card); border: 1px solid var(--c-border); border-radius: calc(var(--radius) * .7); padding: 16px 20px; margin-bottom: 14px; }
.comment-list .children { list-style: none; padding-inline-start: clamp(12px, 4vw, 40px); }
.comment-form input[type="text"], .comment-form input[type="email"], .comment-form input[type="url"], .comment-form textarea {
	width: 100%; padding: 12px 16px; font: inherit; font-size: 16px; background: var(--c-card);
	border: 1px solid var(--c-border); border-radius: calc(var(--radius) * .6);
}
.comment-form .submit {
	padding: var(--btn-py) var(--btn-px); border: 0; cursor: pointer; font: inherit; border-radius: var(--btn-radius);
	background: var(--c-btn-bg); color: var(--c-btn-text);
}

/* ---------- حركة الظهور ---------- */
.js .reveal { opacity: 0; transform: translateY(24px); transition: opacity .7s ease, transform .7s ease; }
.js .reveal.is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	.js .reveal { opacity: 1; transform: none; transition: none; }
	.btn, .card, .post-card, .post-card-img img { transition: none; }
}

/* =========================================================
   التجاوب
   ≥1024  : كمبيوتر ولابتوب
   768-1023: تابلت
   ≤767   : هاتف كبير
   ≤479   : هاتف صغير
   ========================================================= */

/* تابلت وأقل: عمود واحد + قائمة الجوال */
@media (max-width: 1023px) {
	.hero-grid, .about-grid, .why-grid, .contact-grid { grid-template-columns: minmax(0, 1fr); }
	.hero-media .arch-frame, .about-media .arch-frame, .why-shape { margin-inline: auto; }
	.hero-media .arch-frame { max-width: 440px; }
	.arch-tall { max-width: 400px; }
	.why-media { order: 2; }
	.why-shape { max-width: 440px; }
	.lead, .contact-content p { max-width: none; }

	.posts-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.footer-about { grid-column: 1 / -1; }

	.brand-mark, .custom-logo { width: var(--logo-w-m); }

	.nav-toggle { display: block; }
	.primary-nav {
		position: absolute; top: 100%; right: 0; left: 0; flex-direction: column; align-items: stretch;
		gap: 0; padding: 8px var(--gutter) 22px; background: var(--c-header-bg);
		border-bottom: 1px solid var(--c-border); box-shadow: 0 16px 30px rgba(0, 0, 0, .06);
		display: none; max-height: calc(100vh - var(--header-h)); overflow-y: auto;
	}
	.primary-nav.is-open { display: flex; }
	.nav-list { flex-direction: column; align-items: stretch; gap: 0; }
	.nav-list a { display: block; padding: 14px 0; border-bottom: 1px solid var(--c-border); font-size: max(15px, var(--nav-fs)); white-space: normal; }
	.nav-cta { margin-top: 18px; }
	.nav-toggle[aria-expanded="true"] .bars { background: transparent; }
	.nav-toggle[aria-expanded="true"] .bars::before { top: 0; transform: rotate(45deg); }
	.nav-toggle[aria-expanded="true"] .bars::after { top: 0; transform: rotate(-45deg); }
}

/* هاتف كبير */
@media (max-width: 767px) {
	.section-head { flex-direction: column; align-items: flex-start; gap: 14px; margin-bottom: 30px; }
	.section-head > p { max-width: none; }
	.header-inner { min-height: min(var(--header-h), 68px); gap: 12px; }
	.brand-name { font-size: min(var(--title-size), 22px); }
	.post-navigation .nav-links { grid-template-columns: minmax(0, 1fr); }
	.post-navigation .nav-next { text-align: right; }
	.footer-bottom { flex-direction: column; gap: 6px; }
	.btn-row .btn { flex: 1 1 auto; }
}

/* هاتف صغير */
@media (max-width: 599px) {
	.mini-cards, .features, .form-row, .footer-grid, .posts-grid { grid-template-columns: minmax(0, 1fr); }
	.cards { gap: 18px; }
	.card { padding: 18px; }
	.hero-media .arch-frame, .about-media .arch-frame, .why-shape { max-width: 100%; }
	.alignleft, .alignright { float: none; margin: 0 auto 1em; display: block; }
	.search-form { flex-direction: column; }
	.search-form .search-submit { padding: 12px; }
}