/* ==========================================================================
   نوا — «دوخت به اندازه»
   برگه استایل یکپارچه قالب. طرح و دلیل هر تصمیم در DESIGN.md.

   رنگ‌ها و اندازه‌های پایه از سفارشی‌ساز می‌آیند (inc/dynamic-css.php) و به
   صورت متغیر روی :root چاپ می‌شوند؛ این برگه فقط از آن متغیرها و مشتقاتشان
   استفاده می‌کند. همه ویژگی‌های جهتی منطقی‌اند (inline-start = راست).

   ۱. متغیرهای مشتق        ۹.  رویکرد ما           ۱۷. بخش‌های اختیاری
   ۲. پایه                  ۱۰. حوزه‌های تمرکز      ۱۸. برگه‌های داخلی
   ۳. چیدمان                ۱۱. دفتر طرح‌ها         ۱۹. محتوای بلند
   ۴. دکمه‌ها و پیوندها     ۱۲. فرم‌ها              ۲۰. مشارکت مالی
   ۵. سربرگ                 ۱۳. فرم هم‌افزایی       ۲۱. محصولات
   ۶. قهرمان                ۱۴. مسیر مشارکت         ۲۲. پابرگ
   ۷. متر                   ۱۵. نقشه سراسری         ۲۳. واکنش‌گرایی
   ۸. نوار طرح منتخب        ۱۶. پاسخ‌گویی           ۲۴. حرکت و چاپ
   ========================================================================== */

/* ---------- ۱. متغیرهای مشتق ---------- */

:root {
	--nava-ink: var(--nava-heading, #0F2A22);
	--nava-ink-body: var(--nava-body, #1F332C);
	--nava-ink-muted: var(--nava-muted, #55655E);
	--nava-rule: var(--nava-border, #D3D9D2);

	--nava-space-section: clamp(56px, 8.5vw, var(--nava-section-y, 104px));
	--nava-gutter: clamp(16px, 4vw, 40px);

	--nava-h1: clamp(2.6rem, 1.1rem + 5.4vw, var(--nava-fs-h1, 5.5rem));
	--nava-h2: clamp(1.85rem, 1.05rem + 2.9vw, var(--nava-fs-h2, 3.25rem));
	--nava-h3: clamp(1.22rem, 1rem + 0.9vw, var(--nava-fs-h3, 1.75rem));
	--nava-lead: clamp(1.06rem, 1rem + 0.35vw, 1.25rem);

	--nava-ease: cubic-bezier(.2, .75, .15, 1);
	--nava-header-h: 112px;
}

/* ---------- ۲. پایه ---------- */

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

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

body {
	margin: 0;
	background: var(--nava-bg, #F4F5F1);
	color: var(--nava-ink-body);
	font-family: var(--nava-font-body, 'IBM Plex Sans Arabic', Tahoma, sans-serif);
	font-size: var(--nava-fs-base, 17px);
	line-height: var(--nava-lh-body, 1.95);
	letter-spacing: var(--nava-ls, 0);
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	overflow-x: clip;
}

body.nav-open { overflow: hidden; }

h1, h2, h3, h4, h5, h6 {
	margin: 0 0 .5em;
	color: var(--nava-ink);
	font-family: var(--nava-font-heading, 'Noto Kufi Arabic', sans-serif);
	font-weight: var(--nava-fw-head, 800);
	line-height: var(--nava-lh-head, 1.3);
	text-wrap: balance;
}

h1 { font-size: var(--nava-h1); line-height: 1.2; }
h2 { font-size: calc(var(--nava-h2) * var(--nava-local-heading-scale, 1)); }
h3 { font-size: var(--nava-h3); font-weight: 700; line-height: 1.5; }
h4 { font-size: 1.12rem; font-weight: 700; }

p { margin: 0 0 1em; }

a {
	color: var(--nava-primary, #1F5C4A);
	text-decoration-thickness: 1px;
	text-underline-offset: .28em;
}

a:hover { color: var(--nava-primary-dk, #174838); }

img, svg, video { max-width: 100%; height: auto; }
img { display: block; }

ul, ol { padding-inline-start: 1.25em; }

hr {
	border: 0;
	border-top: 1px solid var(--nava-rule);
	margin: 2.5em 0;
}

strong, b { font-weight: 600; }

::selection { background: var(--nava-accent, #F4C21B); color: var(--nava-ink); }

:focus-visible {
	outline: 2px solid var(--nava-primary, #1F5C4A);
	outline-offset: 3px;
}

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

.skip-link:focus {
	position: fixed !important;
	inset-block-start: 12px;
	inset-inline-start: 12px;
	z-index: 1000;
	width: auto;
	height: auto;
	padding: 12px 18px;
	clip-path: none;
	background: var(--nava-ink);
	color: var(--nava-bg);
	font-weight: 600;
	text-decoration: none;
}

table {
	width: 100%;
	border-collapse: collapse;
	font-size: .95rem;
}

th, td {
	padding: 12px 14px;
	border-bottom: 1px solid var(--nava-rule);
	text-align: start;
	vertical-align: top;
}

th { color: var(--nava-ink); font-weight: 600; }

/* ---------- ۳. چیدمان ---------- */

.nava-container {
	width: 100%;
	max-width: calc(var(--nava-container, 1240px) + var(--nava-gutter) * 2);
	margin-inline: auto;
	padding-inline: var(--nava-gutter);
}

.nava-main { display: block; }

.nava-section { padding-block: var(--nava-space-section); }
.nava-section--alt { background: var(--nava-bg-alt); }
.nava-section--tight { padding-block: calc(var(--nava-space-section) * .6); }

/*
 * سرتیتر بخش — راست‌چین، بدون خط رنگی تزئینی زیر عنوان.
 * ‎.nava-section-head‎ نام قدیمی همین الگوست که برگه‌های داخلی هنوز استفاده می‌کنند.
 */
.nava-head,
.nava-section-head {
	max-width: 760px;
	margin-bottom: clamp(32px, 4.5vw, 56px);
}

.nava-head h2,
.nava-section-head h2 { margin-bottom: .35em; }

.nava-head p,
.nava-section-head p {
	margin: 0;
	max-width: 58ch;
	color: var(--nava-ink-muted);
	font-size: var(--nava-lead);
	line-height: 1.9;
}

.nava-head--split,
.nava-section-head--split {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 16px 40px;
	max-width: none;
}

.nava-head--split > div,
.nava-section-head--split > div { max-width: 760px; }

.nava-grid {
	display: grid;
	gap: clamp(28px, 3.5vw, 44px) clamp(20px, 3vw, 36px);
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.nava-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.nava-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.nava-scroll-x { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* ---------- ۴. دکمه‌ها و پیوندها ---------- */

.nava-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 50px;
	padding: 8px 22px;
	border: 1.5px solid transparent;
	border-radius: var(--nava-radius-btn, 6px);
	font-family: var(--nava-font-body);
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.4;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}

.nava-btn svg { flex: none; }

/* زرد متر با خط تیره دور — برچسبی که روی متر دوخته شده. */
.nava-btn--primary {
	background: var(--nava-accent, #F4C21B);
	border-color: #0F2A22;
	color: #0F2A22;
}

.nava-btn--primary:hover {
	background: #0F2A22;
	color: var(--nava-accent, #F4C21B);
}

.nava-btn--dark {
	background: var(--nava-primary);
	border-color: var(--nava-primary);
	color: var(--nava-on-primary, #fff);
}

.nava-btn--dark:hover {
	background: var(--nava-primary-dk);
	border-color: var(--nava-primary-dk);
	color: var(--nava-on-primary, #fff);
}

.nava-btn--outline {
	background: transparent;
	border-color: var(--nava-ink);
	color: var(--nava-ink);
}

.nava-btn--outline:hover {
	background: var(--nava-ink);
	color: var(--nava-bg);
}

/* دکمه دوم قهرمان: فقط متن با خط زیرین زرد — تا دکمه اصلی تنها بماند. */
.nava-btn--quiet {
	background: transparent;
	color: var(--nava-ink);
	padding-inline: 4px;
	text-decoration: underline;
	text-decoration-color: var(--nava-accent);
	text-decoration-thickness: 3px;
	text-underline-offset: .45em;
}

.nava-btn--quiet:hover {
	color: var(--nava-primary);
	text-decoration-color: var(--nava-primary);
}

.nava-btn--lg { min-height: 58px; padding-inline: 28px; font-size: 1.06rem; }
.nava-btn--sm { min-height: 44px; padding-inline: 16px; font-size: .94rem; }

.nava-btn[disabled],
.nava-btn:disabled { opacity: .55; cursor: not-allowed; }

/* پیوند متنی مستقل (مثل «همه طرح‌ها») — هدف لمسی ۴۴ پیکسلی. */
.nava-link,
.nava-link-arrow {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	color: var(--nava-ink);
	font-weight: 600;
	text-decoration: underline;
	text-decoration-color: var(--nava-accent);
	text-decoration-thickness: 3px;
	text-underline-offset: .45em;
}

.nava-link:hover,
.nava-link-arrow:hover { color: var(--nava-primary); text-decoration-color: var(--nava-primary); }

/* پیوند کارش را با متن می‌گوید؛ فلشِ چسبیده به متن از نشانه‌های قالب آماده است. */
.nava-link-arrow svg { display: none; }

.nava-flip { transform: scaleX(-1); }

/* ---------- ۵. سربرگ ---------- */

.nava-topbar {
	background: var(--nava-ink);
	color: var(--nava-bg);
	font-size: .88rem;
	padding-block: 8px;
}

.nava-header {
	position: sticky;
	inset-block-start: 0;
	z-index: 100;
	background: var(--nava-bg);
	border-bottom: 1px solid var(--nava-rule);
}

.nava-header__inner {
	display: flex;
	align-items: center;
	gap: 28px;
	min-height: var(--nava-header-h);
}

.nava-logo {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	min-height: 48px;
	color: var(--nava-ink);
	text-decoration: none;
	flex: none;
	position: relative;
	z-index: 2;
}

.nava-logo:hover { color: var(--nava-ink); }

.nava-tracking { max-width: 680px; margin-inline: auto; }
.nava-tracking__form { padding: 28px; background: var(--nava-surface, #FCFCFA); border: 1px solid var(--nava-rule, #D3D9D2); }
.nava-tracking__form input { width: 100%; min-height: 48px; padding: 10px 12px; border: 1px solid var(--nava-muted, #55655E); border-radius: 6px; background: #fff; font: inherit; }
.nava-tracking__result { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--nava-rule, #D3D9D2); }
.nava-tracking__result h2 { font-size: 1.25rem; }
.nava-tracking__result p { white-space: pre-line; overflow-wrap: anywhere; }
.nava-tracking__privacy { font-size: .9rem; color: var(--nava-ink-muted); margin-top: 24px; }
.nava-tracking__message { margin-block: 16px 0; }
.nava-tracking button:disabled { opacity: .65; cursor: wait; }
@media (max-width: 480px) { .nava-tracking__form { padding: 20px 16px; } }

.nava-logo__mark { display: grid; color: var(--nava-primary); }
.nava-logo__mark svg { width: 42px; height: 42px; display: block; }
.nava-logo--package .nava-logo__mark img { display: block; width: 108px; height: auto; }
.nava-logo--package .nava-logo__tagline { max-width: 220px; }
.nava-logo--footer { display: grid; justify-items: start; gap: 18px; }
.nava-logo--footer .nava-logo__mark img { width: 144px; }

.nava-logo__text { display: grid; line-height: 1.2; }

.nava-logo__name {
	font-family: var(--nava-font-heading);
	font-size: 1.7rem;
	font-weight: 800;
	line-height: 1.1;
}

.nava-logo__tagline {
	font-size: .76rem;
	font-weight: 500;
	color: var(--nava-ink-muted);
	max-width: 25rem;
	line-height: 1.45;
}
.nava-logo--custom { gap: 10px; }
.nava-logo--custom .custom-logo-link { display: block; line-height: 0; }
.nava-logo--custom .custom-logo { width: auto; max-width: 130px; max-height: 54px; object-fit: contain; }

.nava-hero__caption {
	margin-top: 10px;
	color: var(--nava-ink-muted);
	font-size: .84rem;
	line-height: 1.6;
}

.custom-logo-link img { max-height: 52px; width: auto; }

.nava-nav { margin-inline-start: auto; }

.nava-nav ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.nava-nav > div > ul {
	display: flex;
	align-items: center;
	gap: clamp(14px, 1.8vw, 28px);
}

.nava-nav li { position: relative; }

.nava-nav a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	color: var(--nava-ink);
	font-size: .98rem;
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
	background-image: linear-gradient(var(--nava-accent), var(--nava-accent));
	background-repeat: no-repeat;
	background-position: 100% 78%;
	background-size: 0 3px;
	transition: background-size .2s var(--nava-ease);
}

.nava-nav a:hover,
.nava-nav .current-menu-item > a,
.nava-nav .current_page_item > a { background-size: 100% 3px; color: var(--nava-ink); }

.nava-nav .sub-menu {
	position: absolute;
	inset-block-start: 100%;
	inset-inline-start: -16px;
	min-width: 220px;
	padding: 8px 0;
	background: var(--nava-surface);
	border: 1px solid var(--nava-ink);
	opacity: 0;
	visibility: hidden;
	transition: opacity .15s ease, visibility .15s;
}

.nava-nav li:hover > .sub-menu,
.nava-nav li:focus-within > .sub-menu { opacity: 1; visibility: visible; }

.nava-nav .sub-menu a { display: flex; padding: 6px 16px; background-image: none; }
.nava-nav .sub-menu a:hover { background: var(--nava-bg-alt); }

.nava-submenu-toggle { display: none; }

.nava-header__actions {
	display: flex;
	align-items: center;
	gap: 12px;
	position: relative;
	z-index: 2;
}

.nava-header__cta { min-height: 46px; padding-inline: 18px; }

.nava-burger {
	display: none;
	width: 48px;
	height: 48px;
	padding: 0;
	border: 1.5px solid var(--nava-ink);
	border-radius: var(--nava-radius-btn, 6px);
	background: transparent;
	color: var(--nava-ink);
	cursor: pointer;
	place-items: center;
}

.nava-burger span,
.nava-burger span::before,
.nava-burger span::after {
	display: block;
	width: 20px;
	height: 2px;
	background: currentColor;
	transition: transform .2s ease, background-color .2s ease;
}

.nava-burger span { position: relative; }
.nava-burger span::before,
.nava-burger span::after { content: ''; position: absolute; inset-inline-start: 0; }
.nava-burger span::before { top: -6px; }
.nava-burger span::after { top: 6px; width: 13px; }
.nava-burger[aria-expanded="true"] span { background: transparent; }
.nava-burger[aria-expanded="true"] span::before { transform: translateY(6px) rotate(45deg); }
.nava-burger[aria-expanded="true"] span::after { transform: translateY(-6px) rotate(-45deg); width: 20px; }

/* ---------- ۶. قهرمان ---------- */

/*
 * ارتفاع قهرمان طوری تنظیم شده که متر در نمایشگر ۹۰۰ پیکسلی دیده شود: متر
 * عنصر اصلی صفحه است و نباید زیر خط اسکرول بماند.
 */
.nava-hero {
	padding-block: clamp(24px, 3.5vw, 44px) clamp(48px, 7vw, 88px);
	overflow: hidden;
}

.nava-hero__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr);
	gap: clamp(28px, 5vw, 80px);
	align-items: center;
}

.nava-hero__kicker {
	margin-bottom: 1em;
	color: var(--nava-ink-muted);
	font-weight: 600;
}

/*
 * تیتر، شخصیت صفحه را حمل می‌کند: کوفی درشت و فشرده. \n در متن سفارشی‌ساز
 * سطرها را می‌سازد، پس شکست خط عمداً دست مدیر است.
 */
.nava-hero__title {
	margin: 0 0 .42em;
	font-size: var(--nava-h1);
	font-weight: 800;
	line-height: 1.18;
	white-space: pre-line;
	text-wrap: initial;
}

.nava-hero__lead {
	max-width: 44ch;
	margin-bottom: 1.8em;
	color: var(--nava-ink-body);
	font-size: var(--nava-lead);
	line-height: 1.95;
}

.nava-hero__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 24px;
}

.nava-hero__proof {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 22px;
	margin: 28px 0 0;
	padding: 0;
	list-style: none;
	color: var(--nava-ink-muted);
	font-size: .95rem;
}

.nava-hero__figure {
	position: relative;
	margin: 0;
	isolation: isolate;
}

/*
 * کاغذ الگو: صلیب‌های ریز خیاطی پشت عکس، کمی بیرون‌زده از لبه پایین و چپ.
 * رنگ از ماسک و متغیر خط می‌آید تا با پالت سفارشی‌ساز هم‌رنگ بماند.
 */
.nava-hero__figure.has-pattern::before {
	content: '';
	position: absolute;
	inset-block: 36px -36px;
	inset-inline: 40px -40px;
	z-index: -1;
	background-color: var(--nava-ink);
	opacity: .22;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28'%3E%3Cpath d='M10 14h8M14 10v8' stroke='%23000' stroke-width='1.2'/%3E%3C/svg%3E") 0 0 / 28px 28px repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28'%3E%3Cpath d='M10 14h8M14 10v8' stroke='%23000' stroke-width='1.2'/%3E%3C/svg%3E") 0 0 / 28px 28px repeat;
}

.nava-hero__photo {
	overflow: hidden;
	border-radius: var(--nava-radius-img, 3px);
	background: var(--nava-bg-alt);
	aspect-ratio: 1 / 1;
	max-height: 500px;
}

.nava-hero__photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* حالت نقشه در قهرمان — همان قرارداد لایه‌ای بخش نقشه سراسری. */
.nava-hero__stage,
.nava-coverage__stage {
	position: relative;
	width: 100%;
	max-width: 720px;
	aspect-ratio: 1 / .88;
	margin-inline: auto;
	isolation: isolate;
}

.nava-hero__map,
.nava-hero__3d {
	position: absolute;
	inset: 0;
}

.nava-hero__3d {
	z-index: 2;
	opacity: 0;
	transition: opacity .9s var(--nava-ease);
}

.nava-hero__3d.is-ready { opacity: 1; }
.nava-hero__3d canvas { display: block; width: 100% !important; height: 100% !important; }

.nava-hero__map { z-index: 1; transition: opacity .7s ease; }
.nava-3d-on .nava-hero__map { opacity: 0; pointer-events: none; }

/*
 * لایه SVG تمام صحنه را پر می‌کند. جای‌گیری مطلق است، نه height: 100% — در
 * چینش وسط‌چین، درصد ارتفاع حل نمی‌شد و نقشه از قاب بیرون می‌زد.
 */
.nava-hero__stage .nava-map,
.nava-coverage__stage .nava-map { position: absolute; inset: 0; }

.nava-hero__stage .nava-map svg,
.nava-coverage__stage .nava-map svg { width: 100%; height: 100%; }

/* ---------- ۷. متر ---------- */

/*
 * نوار با خط تیره دور، پُرشدگی زرد از راست، و سه لایه درجه مثل متر خیاطی
 * واقعی. متر مرحله اجرای طرح را نشان می‌دهد (هیچ مبلغی روی سایت نیست): درجه
 * بلند هر ۲۵٪ مرز یکی از چهار مرحله است، میانه هر ۵٪ و کوتاه هر ۱٪. درجه‌ها با
 * گرادیان رسم می‌شوند، پس نوار با عرض ظرف، بی‌جاوااسکریپت، درست می‌ماند.
 */
.nava-tape { --tape-h: 14px; --tape-line: 1.5px; width: 100%; }
.nava-tape--lg { --tape-h: 58px; --tape-line: 2px; }

.nava-tape__band {
	position: relative;
	height: var(--tape-h);
	overflow: hidden;
	background: var(--nava-surface, #FCFCFA);
	border: var(--tape-line) solid var(--nava-ink);
	border-radius: 2px;
}

.nava-tape__fill {
	position: absolute;
	inset-block: 0;
	inset-inline-start: 0;
	width: calc(var(--p, 0) * 100%);
	background: var(--nava-accent, #F4C21B);
	box-shadow: inset calc(var(--tape-line) * -1) 0 0 var(--nava-ink);
}

.nava-tape__ticks {
	position: absolute;
	inset: 0;
	pointer-events: none;
	background-image:
		linear-gradient(to left, var(--nava-ink) 0 var(--tape-line), transparent var(--tape-line)),
		linear-gradient(to left, var(--nava-ink) 0 1px, transparent 1px),
		linear-gradient(to left, var(--nava-ink) 0 1px, transparent 1px);
	background-repeat: repeat-x;
	background-position: 100% 0, 100% 0, 100% 0;
	background-size: 25% 62%, 5% 36%, 1% 20%;
}

.nava-tape--sm .nava-tape__ticks {
	background-image: linear-gradient(to left, var(--nava-ink) 0 1px, transparent 1px);
	background-size: 25% 100%;
	opacity: .5;
}

.nava-tape__scale {
	display: flex;
	margin: 10px 0 0;
	padding: 0;
	list-style: none;
	color: var(--nava-ink-muted);
	font-size: .86rem;
	font-weight: 600;
	line-height: 1.5;
}

/* هر نام مرحله زیر بخش خودش از نوار وسط‌چین می‌شود؛ مرحله فعلی پررنگ. */
.nava-tape__scale li { flex: 1 1 0; min-width: 0; padding-inline: 6px; text-align: center; text-wrap: balance; }
.nava-tape__scale .is-past { color: var(--nava-ink-body); }
.nava-tape__scale .is-current { color: var(--nava-ink); font-family: var(--nava-font-heading); font-weight: 700; }

/* ---------- ۸. نوار طرح منتخب ---------- */

.nava-measure { margin-top: clamp(32px, 4vw, 48px); }

.nava-measure__row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto auto;
	align-items: center;
	gap: 16px clamp(24px, 4vw, 56px);
	margin-top: 22px;
}

.nava-measure__label {
	margin: 0 0 2px;
	color: var(--nava-ink-muted);
	font-size: .92rem;
	font-weight: 600;
}

.nava-measure__label span { font-weight: 400; }

.nava-measure__title {
	margin: 0;
	font-size: clamp(1.15rem, 1rem + .6vw, 1.5rem);
	font-weight: 700;
	line-height: 1.5;
}

.nava-measure__title a { color: var(--nava-ink); text-decoration: none; }
.nava-measure__title a:hover { text-decoration: underline; text-decoration-color: var(--nava-accent); text-decoration-thickness: 3px; }

.nava-measure__stage {
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin: 0;
	color: var(--nava-ink-muted);
	font-size: .9rem;
}

.nava-measure__stage strong {
	color: var(--nava-ink);
	font-family: var(--nava-font-heading);
	font-size: 1.25rem;
	font-weight: 800;
	line-height: 1.4;
}

/* ---------- ۹. رویکرد ما ---------- */

/* تنها نوار تمام‌رنگ میانه صفحه: سبز تخته برش، متن کاغذی. */
.nava-philosophy {
	--nava-ink: var(--nava-on-primary, #fff);
	--nava-ink-body: var(--nava-on-primary, #fff);
	--nava-ink-muted: rgb(255 255 255 / .8);
	background: var(--nava-primary);
	color: var(--nava-on-primary, #fff);
}

.nava-philosophy :focus-visible { outline-color: var(--nava-accent); }

.nava-philosophy__head {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 24px clamp(32px, 6vw, 96px);
	align-items: start;
	padding-bottom: clamp(36px, 5vw, 64px);
	margin-bottom: clamp(36px, 5vw, 64px);
	border-bottom: 1px solid rgb(255 255 255 / .22);
}

.nava-philosophy__head h2 {
	margin: 0;
	font-size: calc(clamp(2rem, 1rem + 3vw, 3.4rem) * var(--nava-local-heading-scale, 1));
	line-height: 1.3;
}

.nava-philosophy__head p {
	margin: 0;
	max-width: 60ch;
	color: var(--nava-ink-muted);
	font-size: var(--nava-lead);
	line-height: 2;
}

.nava-philosophy__principles {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(28px, 3.5vw, 48px);
	margin: 0;
	padding: 0;
	list-style: none;
}

.nava-principle__photo {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	margin-bottom: 20px;
	border-radius: var(--nava-radius-img, 3px);
}

.nava-principle h3 {
	margin-bottom: .35em;
	font-size: clamp(1.2rem, 1rem + .7vw, 1.45rem);
}

.nava-principle p { margin: 0; color: var(--nava-ink-muted); line-height: 1.9; }

.nava-philosophy__cta { margin: clamp(32px, 4vw, 48px) 0 0; }

/* ---------- ۱۰. حوزه‌های تمرکز ---------- */

.nava-areas__list {
	margin: 0;
	padding: 0;
	list-style: none;
	border-bottom: 1px solid var(--nava-ink);
}

.nava-area {
	display: grid;
	grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr);
	gap: 20px clamp(32px, 6vw, 96px);
	padding-block: clamp(32px, 4vw, 48px);
	border-top: 1px solid var(--nava-ink);
	transition: background-color .25s ease;
}

.nava-area:hover { background-color: var(--nava-bg-alt); }

.nava-area__name {
	margin: 0 0 6px;
	color: var(--nava-primary);
	font-size: .95rem;
	font-weight: 600;
}

.nava-area__name a { color: inherit; text-decoration: none; }
.nava-area__name a:hover { text-decoration: underline; }

.nava-area h3 {
	margin: 0 0 .5em;
	font-size: clamp(1.45rem, 1rem + 1.5vw, 2.15rem);
	font-weight: 800;
	line-height: 1.4;
}

.nava-area__text {
	max-width: 54ch;
	margin: 0;
	color: var(--nava-ink-muted);
	font-size: 1.04rem;
	line-height: 2;
}

.nava-area__side { padding-top: 6px; }

/* هر خدمت با یک درجه کوتاه متر، به‌جای گلوله فهرست. */
.nava-area__services {
	display: grid;
	gap: 10px;
	margin: 0 0 24px;
	padding: 0;
	list-style: none;
}

.nava-area__services li {
	position: relative;
	padding-inline-start: 26px;
	color: var(--nava-ink-body);
	line-height: 1.7;
}

.nava-area__services li::before {
	content: '';
	position: absolute;
	inset-inline-start: 0;
	inset-block-start: .85em;
	width: 14px;
	height: 2px;
	background: var(--nava-ink);
}

.nava-area__pending { color: var(--nava-ink-muted); }

/* ---------- ۱۱. دفتر طرح‌ها ---------- */

.nava-ledger { border-bottom: 1px solid var(--nava-ink); }

.nava-programme {
	display: grid;
	grid-template-columns: 132px minmax(0, 1fr) minmax(200px, 280px) auto;
	gap: 16px clamp(20px, 3vw, 40px);
	align-items: center;
	padding-block: 24px;
	border-top: 1px solid var(--nava-rule);
}

.nava-programme:first-child { border-top-color: var(--nava-ink); }

.nava-programme__media {
	position: relative;
	display: block;
	overflow: hidden;
	border-radius: var(--nava-radius-img, 3px);
	background: var(--nava-bg-alt);
	aspect-ratio: 4 / 3;
}
.nava-programme__media a { display: block; width: 100%; height: 100%; }

.nava-programme__media img,
.nava-programme__media .nava-pattern-art { width: 100%; height: 100%; object-fit: cover; transition: transform .35s var(--nava-ease); }
.nava-programme:hover .nava-programme__media img,
.nava-programme:hover .nava-programme__media .nava-pattern-art { transform: scale(1.04); }

.nava-programme__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 14px;
	margin: 0 0 2px;
	color: var(--nava-primary);
	font-size: .88rem;
	font-weight: 600;
}

.nava-programme__state {
	color: var(--nava-ink);
	padding-inline: 8px;
	background: var(--nava-bg-alt);
	border-radius: 2px;
}

.nava-programme h3 { margin: 0 0 .2em; font-size: 1.2rem; line-height: 1.55; }
.nava-programme h3 a { color: var(--nava-ink); text-decoration: none; }
.nava-programme h3 a:hover { text-decoration: underline; text-decoration-color: var(--nava-accent); text-decoration-thickness: 3px; }

.nava-programme__excerpt {
	margin: 0;
	color: var(--nava-ink-muted);
	font-size: .95rem;
	line-height: 1.85;
}

.nava-programme__stage {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 2px 8px;
	margin: 10px 0 0;
	color: var(--nava-ink-muted);
	font-size: .88rem;
}

.nava-programme__stage strong { color: var(--nava-ink); font-family: var(--nava-font-heading); font-size: 1rem; font-weight: 700; }

/* ---------- ۱۲. فرم‌ها ---------- */

label { color: var(--nava-ink); }

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="url"],
input[type="number"],
input[type="search"],
input[type="password"],
input[type="date"],
select,
textarea {
	width: 100%;
	min-height: 50px;
	padding: 10px 14px;
	background: var(--nava-surface, #FCFCFA);
	border: 1.5px solid #B9C3BB;
	border-radius: var(--nava-radius-btn, 6px);
	color: var(--nava-ink-body);
	font-family: var(--nava-font-body);
	font-size: 1rem;
	line-height: 1.6;
	transition: border-color .15s ease;
}

textarea { min-height: 120px; resize: vertical; }

input::placeholder,
textarea::placeholder { color: #6B7A73; opacity: 1; }

input:hover,
select:hover,
textarea:hover { border-color: var(--nava-ink-muted); }

input:focus,
select:focus,
textarea:focus { border-color: var(--nava-ink); outline: 2px solid var(--nava-primary); outline-offset: 1px; }

select {
	appearance: none;
	padding-inline-end: 42px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%230F2A22' stroke-width='1.8'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: left 16px center;
}

input[type="checkbox"],
input[type="radio"] { width: 20px; height: 20px; accent-color: var(--nava-primary); }

.required { color: var(--nava-danger, #B3362A); }

.nava-form-row { margin-bottom: 20px; }
.nava-form-row > label { display: block; margin-bottom: 6px; font-size: .95rem; font-weight: 600; }
.nava-form-row small { display: block; margin-top: 6px; color: var(--nava-ink-muted); font-size: .84rem; line-height: 1.7; }

.nava-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 20px; }

/* وقتی ستون دوم پنهان است (نام سازمان برای «فرد»)، فیلد اول تمام عرض را می‌گیرد. */
.nava-form-grid:has(> [hidden]) { grid-template-columns: minmax(0, 1fr); }

.nava-inquiry-form,
.nava-donate,
.nava-product-order {
	max-width: 760px;
	padding: clamp(22px, 3.5vw, 40px);
	background: var(--nava-surface, #FCFCFA);
	border: 1px solid var(--nava-ink);
	border-radius: var(--nava-radius-card, 0);
}

.nava-form-intro {
	margin-bottom: 24px;
	padding-bottom: 20px;
	border-bottom: 1px solid var(--nava-rule);
}

.nava-form-intro__icon { display: none; }
.nava-form-intro h3 { margin: 0 0 4px; font-size: 1.3rem; }
.nava-form-intro p { margin: 0; color: var(--nava-ink-muted); font-size: .94rem; }

fieldset { min-width: 0; margin: 0 0 22px; padding: 0; border: 0; }
legend { margin-bottom: 10px; padding: 0; color: var(--nava-ink); font-weight: 600; }

.nava-form-consent,
.nava-newsletter__consent {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	min-height: 44px;
	margin: 18px 0;
	color: var(--nava-ink-muted);
	font-size: .88rem;
	line-height: 1.8;
	cursor: pointer;
}

.nava-form-consent input,
.nava-newsletter__consent input { flex: none; margin-top: 4px; }

.nava-honeypot {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

.nava-inquiry-form__message,
.nava-donate__msg,
.nava-product-order__message,
.nava-newsletter__msg { margin: 14px 0 0; font-size: .94rem; }

.nava-inquiry-form__message:empty,
.nava-donate__msg:empty,
.nava-product-order__message:empty,
.nava-newsletter__msg:empty { display: none; }

.is-err { color: var(--nava-danger, #B3362A); font-weight: 600; }
.is-ok { color: var(--nava-success, #2E7D4F); font-weight: 600; }

.nava-inquiry-form__result,
.nava-donate__result,
.nava-product-order__result {
	margin-top: 18px;
	padding: 20px 22px;
	background: var(--nava-bg);
	border-inline-start: 4px solid var(--nava-accent);
}

.nava-inquiry-form__result h3,
.nava-donate__result h3 { font-size: 1.2rem; }

/* پس از ثبت موفق، فرم به تأییدیه خودش جمع می‌شود: کد پیگیری تنها چیزی است که کاربر لازم دارد. */
.nava-inquiry-form.is-done > :not(.nava-inquiry-form__result),
.nava-donate.is-done > :not(.nava-donate__result),
.nava-product-order.is-done > :not(.nava-product-order__result) { display: none; }
.is-done > .nava-inquiry-form__result,
.is-done > .nava-donate__result,
.is-done > .nava-product-order__result { margin-top: 0; }

.nava-tracking-code {
	display: inline-block;
	margin: 4px 0 10px;
	padding: 6px 14px;
	background: var(--nava-ink);
	color: var(--nava-accent);
	font-family: var(--nava-font-heading);
	font-size: 1.15rem;
	letter-spacing: .04em;
}

/* فرد / سازمان — دو حالت، مثل دو دکمه چسبیده. */
.nava-segmented { display: flex; flex-wrap: wrap; }
.nava-segmented legend { width: 100%; }
.nava-segmented > label { display: inline-flex; }

.nava-segmented input,
.nava-choice-card input {
	position: absolute;
	width: 1px;
	height: 1px;
	opacity: 0;
}

.nava-segmented > label > span {
	display: inline-flex;
	align-items: center;
	min-height: 46px;
	padding-inline: 22px;
	border: 1.5px solid var(--nava-ink);
	background: transparent;
	color: var(--nava-ink);
	font-weight: 600;
	cursor: pointer;
}

.nava-segmented > label:first-of-type > span { border-start-start-radius: var(--nava-radius-btn, 6px); border-end-start-radius: var(--nava-radius-btn, 6px); }
.nava-segmented > label:last-of-type > span { margin-inline-start: -1.5px; border-start-end-radius: var(--nava-radius-btn, 6px); border-end-end-radius: var(--nava-radius-btn, 6px); }
.nava-segmented input:checked + span { background: var(--nava-ink); color: var(--nava-bg); }
.nava-segmented input:focus-visible + span { outline: 2px solid var(--nava-primary); outline-offset: 2px; }

/* نوع مشارکت — گزینه‌های بزرگ، هر کدام یک عنوان و یک توضیح. */
.nava-choice-cards__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.nava-choice-card { position: relative; display: block; cursor: pointer; }

.nava-choice-card__body {
	position: relative;
	display: grid;
	gap: 2px;
	height: 100%;
	padding: 14px 16px;
	padding-inline-start: 48px;
	border: 1.5px solid #B9C3BB;
	border-radius: var(--nava-radius-btn, 6px);
	background: var(--nava-surface, #FCFCFA);
	transition: border-color .15s ease, background-color .15s ease;
}

/* نشانگر انتخاب — دایره‌ای که با زرد متر پر می‌شود، به‌جای آیکون تزئینی. */
.nava-choice-card__body::before {
	content: '';
	position: absolute;
	inset-inline-start: 16px;
	inset-block-start: 18px;
	width: 18px;
	height: 18px;
	border: 1.5px solid var(--nava-ink);
	border-radius: 50%;
	background: var(--nava-surface, #FCFCFA);
}

.nava-choice-card__icon { display: none; }
.nava-choice-card strong { color: var(--nava-ink); font-size: 1rem; line-height: 1.5; }
.nava-choice-card small { color: var(--nava-ink-muted); font-size: .85rem; line-height: 1.65; }
.nava-choice-card:hover .nava-choice-card__body { border-color: var(--nava-ink); }
.nava-choice-card input:checked + .nava-choice-card__body { border-color: var(--nava-ink); background: var(--nava-bg); }
.nava-choice-card input:checked + .nava-choice-card__body::before { background: var(--nava-accent); box-shadow: inset 0 0 0 3px var(--nava-surface, #FCFCFA); }
.nava-choice-card input:focus-visible + .nava-choice-card__body { outline: 2px solid var(--nava-primary); outline-offset: 2px; }

/* ---------- ۱۳. فرم هم‌افزایی ---------- */

.nava-contribute { background: var(--nava-bg-alt); }
#section-contribute { scroll-margin-top: calc(var(--nava-header-h) + 16px); }

.nava-contribute__layout {
	display: grid;
	grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
	gap: clamp(32px, 6vw, 96px);
	align-items: start;
}

.nava-contribute__intro { position: sticky; inset-block-start: calc(var(--nava-header-h) + 32px); }
.nava-contribute__intro h2 { margin-bottom: .45em; font-size: calc(clamp(1.85rem, 1rem + 2.4vw, 2.75rem) * var(--nava-local-heading-scale, 1)); }
.nava-contribute__intro > p { max-width: 46ch; color: var(--nava-ink-body); font-size: var(--nava-lead); line-height: 2; }

.nava-contribute__points {
	margin: 28px 0 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--nava-ink);
}

.nava-contribute__points li {
	display: flex;
	align-items: center;
	gap: 12px;
	min-height: 52px;
	border-bottom: 1px solid var(--nava-rule);
	color: var(--nava-ink);
	font-weight: 600;
}

.nava-contribute__points svg { flex: none; color: var(--nava-primary); }

.nava-contribute__form .nava-inquiry-form { max-width: none; }

/* ---------- ۱۴. مسیر مشارکت ---------- */

/*
 * تنها فهرست ترتیبی صفحه، روی یک خط‌کش: خط بالایی با درجه‌های ریز، و هر
 * ایستگاه یک درجه بلند با شماره‌اش.
 */
.nava-journey__steps {
	position: relative;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 24px clamp(20px, 3vw, 40px);
	margin: 0;
	padding: 40px 0 0;
	list-style: none;
}

.nava-journey__steps::before {
	content: '';
	position: absolute;
	inset-inline: 0;
	inset-block-start: 0;
	height: 12px;
	border-top: 2px solid var(--nava-ink);
	background-image: linear-gradient(to left, var(--nava-ink) 0 1px, transparent 1px);
	background-size: 2.5% 100%;
	background-repeat: repeat-x;
	background-position: 100% 0;
}

.nava-step { position: relative; }

.nava-step::before {
	content: '';
	position: absolute;
	inset-inline-start: 0;
	inset-block-start: -40px;
	width: 3px;
	height: 28px;
	background: var(--nava-ink);
}

.nava-step__num {
	display: block;
	margin-bottom: 8px;
	color: var(--nava-primary);
	font-family: var(--nava-font-heading);
	font-size: 2.4rem;
	font-weight: 800;
	line-height: 1;
}

.nava-step h3 { margin: 0 0 .3em; font-size: 1.2rem; }
.nava-step p { margin: 0; color: var(--nava-ink-muted); line-height: 1.85; }

/* ---------- ۱۵. نقشه سراسری ---------- */

.nava-coverage__inner {
	display: grid;
	grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
	gap: clamp(28px, 5vw, 72px);
	align-items: center;
}

.nava-coverage__copy > p { max-width: 50ch; color: var(--nava-ink-body); font-size: 1.04rem; line-height: 2; }

.nava-coverage__facts {
	margin: 24px 0 28px;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--nava-ink);
}

.nava-coverage__facts li {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	padding-block: 12px;
	border-bottom: 1px solid var(--nava-rule);
	line-height: 1.75;
}

.nava-coverage__facts svg { flex: none; margin-top: .3em; color: var(--nava-primary); }

.nava-map svg { display: block; width: 100%; height: auto; }

/* ---------- ۱۶. پاسخ‌گویی ---------- */

.nava-accountability__layout {
	display: grid;
	grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
	gap: clamp(28px, 6vw, 96px);
	align-items: start;
}

.nava-accountability__intro p { max-width: 48ch; color: var(--nava-ink-body); line-height: 2; }

.nava-accountability__ledger {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--nava-ink);
}

.nava-accountability__ledger li {
	padding: 22px 0 24px;
	padding-inline-end: 28px;
	border-bottom: 1px solid var(--nava-rule);
}

.nava-accountability__ledger li:nth-child(even) {
	padding-inline: 28px 0;
	border-inline-start: 1px solid var(--nava-rule);
}

.nava-accountability__ledger h3 { margin: 0 0 .3em; font-size: 1.12rem; }
.nava-accountability__ledger p { margin: 0; color: var(--nava-ink-muted); line-height: 1.85; }

/* ---------- ۱۷. بخش‌های اختیاری (پیش‌فرض خاموش) ---------- */

.nava-stats__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	border-top: 1px solid var(--nava-ink);
}

.nava-stat { padding: 24px 0; padding-inline-end: 20px; border-bottom: 1px solid var(--nava-rule); }
.nava-stat__num { display: block; direction: ltr; text-align: end; color: var(--nava-ink); font-family: var(--nava-font-heading); font-size: 2.6rem; font-weight: 800; line-height: 1.1; }
.nava-stat__label { color: var(--nava-ink-muted); font-size: .95rem; }

.nava-pillars__grid,
.nava-network__grid,
.nava-trust__layout {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 32px;
}

.nava-pillar__icon,
.nava-trust__icon,
.nava-panel__icon { display: inline-grid; margin-bottom: 8px; color: var(--nava-primary); }

.nava-panel { padding-top: 20px; border-top: 1px solid var(--nava-ink); }
.nava-panel__figure img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border-radius: var(--nava-radius-img, 3px); }

.nava-trust { padding-block: var(--nava-space-section); }
.nava-trust__ledger { display: grid; border-top: 1px solid var(--nava-ink); }
.nava-trust__item { display: flex; align-items: center; gap: 12px; min-height: 56px; border-bottom: 1px solid var(--nava-rule); }

.nava-cta { padding-block: var(--nava-space-section); background: var(--nava-bg-alt); }
.nava-cta__inner { max-width: 760px; }
.nava-finale__canvas,
.nava-finale__veil { display: none; }

.nava-story { padding-top: 20px; border-top: 1px solid var(--nava-ink); }
.nava-story__quote { font-size: 1.1rem; line-height: 2; }
.nava-story__avatar { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; }
.nava-story__person { display: flex; align-items: center; gap: 12px; }
.nava-story__name { color: var(--nava-ink); font-weight: 600; }
.nava-story__role { color: var(--nava-ink-muted); font-size: .9rem; }

.nava-partner img { width: auto; max-height: 64px; filter: grayscale(1); opacity: .8; }
.nava-partner:hover img { filter: none; opacity: 1; }

/* ---------- ۱۸. برگه‌های داخلی ---------- */

.nava-page-hero {
	padding-block: clamp(28px, 4vw, 60px) clamp(28px, 4vw, 48px);
	border-bottom: 1px solid var(--nava-ink);
}

.nava-page-hero h1 {
	max-width: 22ch;
	margin: 0 0 .3em;
	font-size: clamp(2.1rem, 1.2rem + 3vw, 3.6rem);
}

.nava-page-hero p { max-width: 60ch; margin: 0; color: var(--nava-ink-muted); font-size: var(--nava-lead); line-height: 1.9; }

.nava-breadcrumb {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0 10px;
	margin-bottom: 8px;
	color: var(--nava-ink-muted);
	font-size: .9rem;
}

.nava-breadcrumb a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	color: var(--nava-ink-muted);
	text-decoration: none;
}

.nava-breadcrumb a:hover { color: var(--nava-ink); text-decoration: underline; }
.nava-breadcrumb .sep { color: #9AA59F; }

.nava-content-area {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 300px;
	gap: clamp(32px, 5vw, 72px);
	align-items: start;
}

.nava-content-area--full { grid-template-columns: minmax(0, 1fr); }
.nava-content-area--full > .nava-single { width: 100%; max-width: 820px; }

.nava-single__media { margin: 0 0 36px; }
.nava-single__media img { width: 100%; border-radius: var(--nava-radius-img, 3px); }

.nava-card__media { position: relative; overflow: hidden; margin-bottom: 16px; border-radius: var(--nava-radius-img, 3px); background: var(--nava-bg-alt); aspect-ratio: 16 / 10; }
.nava-card__media a,
.nava-card__media img,
.nava-generated-art { display: block; width: 100%; height: 100%; object-fit: cover; }

/*
 * نقش الگو — جانشین برداری عکس. رنگ‌ها از همان توکن‌های سفارشی‌ساز می‌آیند، پس
 * با هر پالتی هماهنگ می‌ماند؛ currentColor برای خطوط کاغذ الگوست.
 */
.nava-pattern-art {
	display: block;
	width: 100%;
	height: 100%;
	color: var(--nava-primary);
	object-fit: cover;
}

.nava-pattern-art__paper { fill: var(--nava-surface, #FCFCFA); }
.nava-pattern-art__piece { stroke: var(--nava-ink); stroke-width: 7; }
.nava-pattern-art__piece.is-mat { fill: var(--nava-primary); }
.nava-pattern-art__piece.is-tape { fill: var(--nava-accent, #F4C21B); }
.nava-pattern-art__piece.is-paper { fill: var(--nava-bg-alt, #E9ECE6); }
.nava-pattern-art__seam { fill: none; stroke: var(--nava-surface, #FCFCFA); stroke-width: 4; stroke-dasharray: 26 18; opacity: .85; }
.nava-pattern-art__notch { stroke: var(--nava-ink); stroke-width: 7; }
.nava-pattern-art__tape { fill: var(--nava-accent, #F4C21B); }
.nava-pattern-art__ticks { stroke: var(--nava-ink); stroke-width: 3; opacity: .6; }

.nava-card__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px 16px;
	margin-bottom: 6px;
	color: var(--nava-ink-muted);
	font-size: .88rem;
}

.nava-card__meta span { display: inline-flex; align-items: center; gap: 6px; }
.nava-card__body h3 { margin: 0 0 .3em; font-size: 1.22rem; }
.nava-card__body h3 a { color: var(--nava-ink); text-decoration: none; }
.nava-card__body h3 a:hover { text-decoration: underline; text-decoration-color: var(--nava-accent); text-decoration-thickness: 3px; }
.nava-card__body p { color: var(--nava-ink-muted); font-size: .96rem; line-height: 1.9; }

.nava-report-card {
	display: flex;
	gap: 18px;
	padding: 22px 0;
	border-top: 1px solid var(--nava-ink);
}

.nava-report-card__icon { flex: none; color: var(--nava-primary); }
.nava-report-card h3 { margin-bottom: .3em; font-size: 1.2rem; }
.nava-report-card h3 a { color: var(--nava-ink); text-decoration: none; }
.nava-report-card__actions { display: flex; flex-wrap: wrap; gap: 4px 24px; }

.nava-filters {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 36px;
}

.nava-filter {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding-inline: 16px;
	border: 1.5px solid var(--nava-ink);
	border-radius: 999px;
	color: var(--nava-ink);
	font-size: .94rem;
	font-weight: 600;
	text-decoration: none;
}

.nava-filter:hover { background: var(--nava-bg-alt); color: var(--nava-ink); }
.nava-filter.is-active { background: var(--nava-ink); color: var(--nava-bg); }
.nava-catalog__status { min-height: 1.6em; margin: -16px 0 24px; color: var(--nava-ink-muted); font-size: .88rem; }
#nava-catalog-results { transition: opacity .2s ease; }
#nava-catalog-results.is-loading { opacity: .55; }
@media (prefers-reduced-motion: reduce) { #nava-catalog-results { transition: none; } }

.nava-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 36px; padding-top: 20px; border-top: 1px solid var(--nava-rule); }
.nava-tags__label { color: var(--nava-ink-muted); font-size: .9rem; }
.nava-tag { display: inline-flex; align-items: center; min-height: 44px; padding-inline: 14px; background: var(--nava-bg-alt); border-radius: 999px; color: var(--nava-ink); font-size: .9rem; text-decoration: none; }
.nava-tag:hover { background: var(--nava-ink); color: var(--nava-bg); }

.nava-facts {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 16px 32px;
	margin-bottom: 36px;
	padding-block: 18px;
	border-block: 1px solid var(--nava-ink);
}

.nava-facts__list { display: flex; flex-wrap: wrap; gap: 12px 36px; margin: 0; }
.nava-facts__item dt { color: var(--nava-ink-muted); font-size: .85rem; }
.nava-facts__item dd { margin: 0; color: var(--nava-ink); font-weight: 600; }

.nava-post-nav { margin-top: 40px; }
.nava-post-nav .nav-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.nava-post-nav a { display: grid; gap: 2px; padding: 16px 0; border-top: 1px solid var(--nava-ink); color: var(--nava-ink); text-decoration: none; }
.nava-post-nav .nav-next { text-align: end; }
.nava-navlink__label { color: var(--nava-ink-muted); font-size: .85rem; }
.nava-navlink__title { font-weight: 600; line-height: 1.6; }

.nava-pagination { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 48px; }

.nava-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	min-width: 44px;
	min-height: 44px;
	padding-inline: 12px;
	border: 1.5px solid var(--nava-rule);
	border-radius: var(--nava-radius-btn, 6px);
	color: var(--nava-ink);
	text-decoration: none;
}

.nava-pagination a.page-numbers:hover { border-color: var(--nava-ink); }
.nava-pagination .current { background: var(--nava-ink); border-color: var(--nava-ink); color: var(--nava-bg); }

.nava-empty { max-width: 560px; padding-block: 32px; }
.nava-empty__icon { margin-bottom: 12px; color: var(--nava-primary); }

.nava-sidebar .widget { margin-bottom: 36px; padding-top: 16px; border-top: 1px solid var(--nava-ink); }
.nava-sidebar .widget-title,
.nava-sidebar .wp-block-heading { margin-bottom: .6em; font-size: 1.05rem; }
.nava-sidebar ul { margin: 0; padding: 0; list-style: none; }
.nava-sidebar li { padding-block: 6px; border-bottom: 1px solid var(--nava-rule); }
.nava-sidebar li a { color: var(--nava-ink); text-decoration: none; }

.search-form,
.wp-block-search__inside-wrapper { display: flex; gap: 8px; }
.search-form label { flex: 1; }

.search-form .search-submit,
.wp-block-search__button {
	min-height: 50px;
	padding-inline: 20px;
	border: 1.5px solid var(--nava-ink);
	border-radius: var(--nava-radius-btn, 6px);
	background: var(--nava-ink);
	color: var(--nava-bg);
	font-family: var(--nava-font-body);
	font-weight: 600;
	cursor: pointer;
}

.nava-404__inner { max-width: 640px; padding-block: clamp(48px, 8vw, 120px); }
.nava-404__art { display: none; }
.nava-404__inner h1 { font-size: clamp(2.2rem, 1.2rem + 3.4vw, 3.8rem); }
.nava-404__inner > p { color: var(--nava-ink-muted); font-size: var(--nava-lead); }
.nava-404__actions { display: flex; flex-wrap: wrap; gap: 12px 20px; margin: 28px 0 36px; }
.nava-404__search { max-width: 460px; }

.nava-comments { margin-top: 56px; padding-top: 28px; border-top: 1px solid var(--nava-ink); }
.nava-comments__title { font-size: 1.4rem; }
.comment-list { margin: 0 0 32px; padding: 0; list-style: none; }
.comment-list .children { padding-inline-start: 28px; list-style: none; }
.comment-body { padding-block: 18px; border-bottom: 1px solid var(--nava-rule); }
.comment-meta { color: var(--nava-ink-muted); font-size: .88rem; }
.comment-author .fn { color: var(--nava-ink); font-style: normal; font-weight: 600; }
.comment-form p { margin-bottom: 16px; }
.comment-form label { display: block; margin-bottom: 6px; font-weight: 600; }

.comment-form .form-submit input {
	min-height: 50px;
	padding-inline: 24px;
	border: 1.5px solid var(--nava-ink);
	border-radius: var(--nava-radius-btn, 6px);
	background: var(--nava-accent);
	color: var(--nava-ink);
	font-family: var(--nava-font-body);
	font-weight: 600;
	cursor: pointer;
}

/* ---------- ۱۹. محتوای بلند ---------- */

.nava-entry-content {
	max-width: 68ch;
	color: var(--nava-ink-body);
	font-size: 1.06rem;
	line-height: 2.05;
}

.nava-entry-content p { margin-bottom: 1.2em; }
.nava-entry-content h2 { margin: 1.9em 0 .55em; font-size: clamp(1.45rem, 1.1rem + 1vw, 1.9rem); }
.nava-entry-content h3 { margin: 1.6em 0 .45em; font-size: 1.25rem; }
.nava-entry-content > h2:first-child,
.nava-entry-content > h3:first-child { margin-top: 0; }
.nava-entry-content ul,
.nava-entry-content ol { margin: 0 0 1.3em; }
.nava-entry-content li { margin-bottom: .35em; }
.nava-entry-content img { border-radius: var(--nava-radius-img, 3px); }
.nava-entry-content figure { margin: 2em 0; }
.nava-entry-content figcaption { margin-top: 8px; color: var(--nava-ink-muted); font-size: .88rem; }

.nava-entry-content blockquote {
	margin: 1.8em 0;
	padding-inline-start: 22px;
	border-inline-start: 4px solid var(--nava-accent);
	color: var(--nava-ink);
	font-size: 1.12rem;
}

/* فرم‌ها درون متن برگه عرض کامل ستون را می‌گیرند، نه ۶۸ نویسه. */
.nava-entry-content:has(.nava-inquiry-form),
.nava-entry-content:has(.nava-donate) { max-width: 820px; }
.nava-entry-content .nava-inquiry-form,
.nava-entry-content .nava-donate { margin-block: 1.6em; }

.nava-page-links { margin-top: 2em; font-weight: 600; }

/* ---------- ۲۰. مشارکت مالی ---------- */

.nava-form-steps {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	margin: 0 0 28px;
	padding: 0;
	list-style: none;
	border-top: 2px solid var(--nava-rule);
	color: var(--nava-ink-muted);
	font-size: .88rem;
}

.nava-form-steps li { display: flex; align-items: center; gap: 8px; margin-top: -2px; padding-top: 12px; border-top: 2px solid transparent; }
.nava-form-steps span { font-family: var(--nava-font-heading); font-weight: 700; }
.nava-form-steps .is-current { border-top-color: var(--nava-ink); color: var(--nava-ink); font-weight: 600; }

.nava-donate__target { margin-bottom: 20px; color: var(--nava-ink-muted); }
.nava-donate__target strong { color: var(--nava-ink); }

.nava-donate__note { margin: 14px 0 0; color: var(--nava-ink-muted); font-size: .88rem; }

.nava-bank { margin-top: 12px; }
.nava-bank dl { display: grid; gap: 8px; margin: 0; }
.nava-bank dt { color: var(--nava-ink-muted); font-size: .85rem; }
.nava-bank dd { margin: 0; direction: ltr; text-align: end; color: var(--nava-ink); font-weight: 600; }

/* ---------- ۲۱. محصولات ---------- */

.nava-product-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(28px, 3.5vw, 44px) clamp(20px, 3vw, 36px);
}

.nava-product-card { display: grid; align-content: start; }

.nava-product-card__media {
	position: relative;
	display: block;
	overflow: hidden;
	margin-bottom: 16px;
	border-radius: var(--nava-radius-img, 3px);
	background: var(--nava-bg-alt);
	aspect-ratio: 4 / 3;
}

.nava-product-card__media img { width: 100%; height: 100%; object-fit: cover; }
.nava-product-card__media img[src*="real-workwear-upright"] { object-fit: contain; }

.nava-product-status {
	position: absolute;
	inset-block-start: 12px;
	inset-inline-start: 12px;
	padding: 2px 10px;
	background: var(--nava-surface, #FCFCFA);
	border: 1px solid var(--nava-ink);
	border-radius: 2px;
	color: var(--nava-ink);
	font-size: .8rem;
	font-weight: 600;
}

.nava-product-view__summary .nava-product-status { position: static; display: inline-block; margin-bottom: 12px; }

.nava-product-card__category,
.nava-product-view__category { margin: 0 0 2px; color: var(--nava-primary); font-size: .88rem; font-weight: 600; }
.nava-product-card h2 { margin: 0 0 .3em; font-size: 1.22rem; font-weight: 700; line-height: 1.5; }
.nava-product-card h2 a { color: var(--nava-ink); text-decoration: none; }
.nava-product-card h2 a:hover { text-decoration: underline; text-decoration-color: var(--nava-accent); text-decoration-thickness: 3px; }
.nava-product-card__excerpt { color: var(--nava-ink-muted); font-size: .95rem; line-height: 1.9; }
.nava-product-card__producer { display: flex; align-items: center; gap: 8px; color: var(--nava-ink-muted); font-size: .9rem; }

.nava-product-card__footer {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 4px 16px;
	padding-top: 10px;
	border-top: 1px solid var(--nava-rule);
}

.nava-product-card__pricing { color: var(--nava-ink-muted); font-size: .85rem; }

.nava-product-view__media figcaption { margin-top: 10px; color: var(--nava-ink-muted); font-size: .85rem; }
.nava-product-gallery { grid-column: 1 / -1; margin-block: 32px 48px; }
.nava-product-gallery h2 { margin-bottom: 20px; font-size: clamp(1.4rem, 1rem + 1.3vw, 2rem); }
.nava-product-gallery__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(12px, 2vw, 24px); }
.nava-product-gallery__grid figure { margin: 0; }
.nava-product-gallery__grid img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--nava-radius-img, 3px); }
.nava-product-gallery__grid figcaption { margin-top: 8px; color: var(--nava-ink-muted); font-size: .9rem; }
@media (max-width: 720px) { .nava-product-gallery__grid { grid-template-columns: minmax(0, 1fr); } }

.nava-catalog-hero { padding-block: clamp(36px, 5vw, 72px); border-bottom: 1px solid var(--nava-ink); }
.nava-catalog-hero__inner { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(28px, 5vw, 72px); align-items: center; }
.nava-catalog-hero__copy h1 { font-size: clamp(2.1rem, 1.2rem + 3vw, 3.4rem); }
.nava-catalog-hero__copy > p { max-width: 54ch; color: var(--nava-ink-muted); font-size: var(--nava-lead); }
.nava-catalog-hero__facts { display: flex; flex-wrap: wrap; gap: 8px 28px; margin: 20px 0 0; padding: 0; list-style: none; }
.nava-catalog-hero__visual { display: grid; grid-template-columns: 1.4fr 1fr; gap: 12px; align-items: end; }
.nava-catalog-hero__shot img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: var(--nava-radius-img, 3px); }
.nava-catalog-hero__shot--small img { aspect-ratio: 1 / 1; }
.nava-catalog-hero__sample { color: var(--nava-ink-muted); font-size: .85rem; }

.nava-order-path { padding-block: clamp(40px, 6vw, 72px) 0; }
.nava-order-path h2 { margin-bottom: 28px; font-size: clamp(1.5rem, 1rem + 1.6vw, 2.2rem); }

/* سه گام سفارش یک ترتیب واقعی‌اند، پس روی همان خط‌کش مسیر مشارکت می‌نشینند. */
.nava-order-path ol {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px clamp(20px, 3vw, 40px);
	margin: 0;
	padding: 20px 0 0;
	list-style: none;
	border-top: 2px solid var(--nava-ink);
}

.nava-order-path li { display: flex; align-items: flex-start; gap: 14px; }
.nava-order-path li > span { flex: none; color: var(--nava-primary); font-family: var(--nava-font-heading); font-size: 2rem; font-weight: 800; line-height: 1; }
.nava-order-path strong { display: block; color: var(--nava-ink); }
.nava-order-path p { margin: 2px 0 0; color: var(--nava-ink-muted); font-size: .94rem; line-height: 1.8; }
.nava-catalog-empty { color: var(--nava-ink-muted); }

.nava-product-view__hero { padding-block: clamp(32px, 5vw, 64px); border-bottom: 1px solid var(--nava-ink); }
.nava-product-view__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 72px); align-items: start; }
.nava-product-view__media img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; border-radius: var(--nava-radius-img, 3px); background: var(--nava-bg-alt); }
.nava-product-view__media img[src*="real-workwear-upright"] { object-fit: contain; }
.nava-product-view__summary h1 { font-size: clamp(2rem, 1.2rem + 2.6vw, 3.2rem); }
.nava-product-view__lead { color: var(--nava-ink-body); font-size: var(--nava-lead); line-height: 1.95; }
.nava-product-view__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.nava-product-view__notice,
.nava-product-view__availability { color: var(--nava-ink-muted); font-size: .92rem; }
.nava-product-view__content { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, 420px); gap: clamp(28px, 5vw, 72px); padding-block: var(--nava-space-section); align-items: start; }

.nava-product-specs { margin: 0 0 28px; border-top: 1px solid var(--nava-ink); }
.nava-product-specs > div,
.nava-product-specs li { display: flex; justify-content: space-between; gap: 16px; padding-block: 10px; border-bottom: 1px solid var(--nava-rule); }
.nava-product-specs dt { color: var(--nava-ink-muted); }
.nava-product-specs dd { margin: 0; color: var(--nava-ink); font-weight: 600; }

.nava-product-impact { padding: 20px 22px; background: var(--nava-bg-alt); border-inline-start: 4px solid var(--nava-accent); }
.nava-product-impact h2 { margin-bottom: .3em; font-size: 1.15rem; }
.nava-product-order-wrap { position: sticky; inset-block-start: calc(var(--nava-header-h) + 24px); }
.nava-product-order { max-width: none; }
.nava-order__intro h2 { font-size: 1.3rem; }
.nava-order__options,
.nava-order__checks { display: grid; gap: 10px; margin-bottom: 18px; }
.nava-order__no-price { color: var(--nava-ink-muted); font-size: .88rem; }

/* ---------- ۲۲. پابرگ ---------- */

.nava-footer {
	--nava-ink: var(--nava-on-dark, #F4F5F1);
	--nava-ink-body: var(--nava-on-dark, #F4F5F1);
	--nava-ink-muted: #B7CCC3;
	--nava-rule: rgb(255 255 255 / .16);
	padding-block: clamp(48px, 7vw, 88px) 24px;
	background: var(--nava-dark, #12382D);
	color: var(--nava-ink-body);
}

.nava-footer :focus-visible { outline-color: var(--nava-accent); }

.nava-footer__promise {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px 48px;
	margin-bottom: clamp(36px, 5vw, 56px);
	padding-bottom: clamp(36px, 5vw, 56px);
	border-bottom: 1px solid var(--nava-rule);
}

.nava-footer__slogan {
	max-width: 16ch;
	margin: 0 0 .3em;
	color: var(--nava-ink);
	font-family: var(--nava-font-heading);
	font-size: clamp(2rem, 1rem + 3.6vw, 3.6rem);
	font-weight: 800;
	line-height: 1.25;
	text-wrap: balance;
}

.nava-footer__promise-text { max-width: 52ch; margin: 0; color: var(--nava-ink-muted); font-size: 1.04rem; }

.nava-footer__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.4fr) repeat(3, minmax(0, 1fr));
	gap: 36px clamp(24px, 4vw, 56px);
	padding-bottom: 40px;
}

.nava-footer .nava-logo,
.nava-footer .nava-logo:hover,
.nava-footer .nava-logo__mark { color: var(--nava-ink); }
.nava-footer .nava-logo__tagline { color: var(--nava-ink-muted); }
.nava-footer .nava-btn--primary,
.nava-footer .nava-btn--primary:visited {
	color: #0F2A22;
	background: var(--nava-accent, #F4C21B);
	border-color: #0F2A22;
}
.nava-footer .nava-btn--primary:hover,
.nava-footer .nava-btn--primary:focus-visible {
	color: #F4C21B;
	background: #0F2A22;
	border-color: #F4C21B;
}
.nava-footer__about-text { max-width: 44ch; margin: 18px 0 0; color: var(--nava-ink-muted); font-size: .95rem; line-height: 1.95; }

.nava-footer h3 {
	margin: 0 0 12px;
	color: var(--nava-ink);
	font-family: var(--nava-font-body);
	font-size: .98rem;
	font-weight: 600;
}

.nava-footer ul { margin: 0; padding: 0; list-style: none; }

.nava-footer .menu a,
.nava-footer__bottom a,
.nava-footer__contact a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	color: var(--nava-ink-muted);
	text-decoration: none;
}

.nava-footer .menu a:hover,
.nava-footer__bottom a:hover,
.nava-footer__contact a:hover { color: var(--nava-ink); text-decoration: underline; text-decoration-color: var(--nava-accent); }

.nava-footer__contact li { display: flex; align-items: center; gap: 10px; min-height: 44px; color: var(--nava-ink-muted); }
.nava-footer__contact svg { flex: none; color: var(--nava-accent); }

.nava-socials { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; }
.nava-social { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid var(--nava-rule); border-radius: 50%; color: var(--nava-ink); }
.nava-social:hover { background: var(--nava-accent); border-color: var(--nava-accent); color: var(--nava-dark); }

.nava-newsletter__form { display: flex; gap: 8px; }
.nava-newsletter__form input { background: rgb(255 255 255 / .06); border-color: rgb(255 255 255 / .34); color: var(--nava-ink); }
.nava-newsletter__form input::placeholder { color: #A9C0B6; }
.nava-newsletter__form .nava-btn { flex: none; border-color: var(--nava-accent); }
.nava-newsletter__consent { font-size: .82rem; }
.nava-newsletter__consent a { color: var(--nava-ink); }
.nava-footer .is-err { color: #FFB4A8; }
.nava-footer .is-ok { color: var(--nava-accent); }

.nava-footer__bottom {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 8px 24px;
	padding-top: 16px;
	border-top: 1px solid var(--nava-rule);
	color: var(--nava-ink-muted);
	font-size: .88rem;
}

.nava-footer__bottom ul { display: flex; flex-wrap: wrap; gap: 0 20px; }

.nava-to-top {
	position: fixed;
	inset-block-end: 20px;
	inset-inline-end: 20px;
	z-index: 90;
	display: grid;
	place-items: center;
	width: 48px;
	height: 48px;
	border: 1.5px solid var(--nava-ink);
	border-radius: var(--nava-radius-btn, 6px);
	background: var(--nava-bg);
	color: var(--nava-ink);
	cursor: pointer;
	opacity: 0;
	visibility: hidden;
	transition: opacity .2s ease, visibility .2s;
}

.nava-to-top.is-visible { opacity: 1; visibility: visible; }
.nava-to-top:hover { background: var(--nava-accent); }

.nava-placeholder { display: grid; place-items: center; width: 100%; height: 100%; background: var(--nava-bg-alt); color: var(--nava-ink-muted); }

/* ---------- ۲۲.۵ صفحه طرح و صفحه حوزه ---------- */

/*
 * همان زبان صفحه اصلی: تیتر و تصویر در ردیف اول، متر تمام‌عرض زیرش. صفحه طرح
 * و حوزه یک قالب مشترک دارند تا حامی بین «حوزه» و «طرح» جابه‌جا شود و جا نخورد.
 */
.nava-plan-hero {
	padding-block: clamp(20px, 3vw, 40px) clamp(32px, 4vw, 56px);
	border-bottom: 1px solid var(--nava-ink);
}

.nava-plan-hero__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
	align-items: center;
	gap: 32px clamp(32px, 5vw, 72px);
}

.nava-plan-hero__area {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 14px;
	margin: 0 0 8px;
	color: var(--nava-primary);
	font-weight: 600;
}

.nava-plan-hero__area a { color: inherit; text-decoration-color: var(--nava-accent); text-decoration-thickness: 2px; text-underline-offset: 5px; }

.nava-plan-hero h1 {
	max-width: 20ch;
	margin: 0 0 .35em;
	font-size: clamp(2rem, 1.2rem + 2.6vw, 3.3rem);
	text-wrap: balance;
}

.nava-plan-hero__headline {
	margin: 0 0 .5em;
	color: var(--nava-ink);
	font-family: var(--nava-font-heading);
	font-size: clamp(1.2rem, 1rem + .8vw, 1.6rem);
	font-weight: 700;
	line-height: 1.6;
}

.nava-plan-hero__lead {
	max-width: 58ch;
	margin: 0;
	color: var(--nava-ink-muted);
	font-size: var(--nava-lead);
	line-height: 1.95;
}

.nava-plan-hero__actions { display: flex; flex-wrap: wrap; gap: 12px 20px; margin-top: 26px; }

.nava-plan-hero__media {
	position: relative;
	overflow: hidden;
	margin: 0;
	aspect-ratio: 4 / 3;
	border-radius: var(--nava-radius-img, 3px);
	background: var(--nava-bg-alt);
}

.nava-plan-hero__media img,
.nava-plan-hero__media .nava-pattern-art { display: block; width: 100%; height: 100%; object-fit: cover; }
.nava-media-caption {
	position: absolute;
	inset-inline-end: 12px;
	inset-block-end: 12px;
	max-width: calc(100% - 24px);
	padding: 5px 10px;
	background: rgba(13, 43, 35, .88);
	color: #fff;
	font-size: .78rem;
	line-height: 1.6;
}
.nava-media-caption--card { inset-inline-end: 8px; inset-block-end: 8px; font-size: .7rem; pointer-events: none; }

.nava-plan-facts { display: flex; flex-wrap: wrap; gap: 8px 36px; margin: 0; }
.nava-plan-facts dt { color: var(--nava-ink-muted); font-size: .85rem; }
.nava-plan-facts dd { margin: 0; color: var(--nava-ink); font-weight: 600; }
.nava-plan-facts--hero { margin-top: 22px; padding-block: 14px; border-block: 1px solid var(--nava-rule); }

.nava-plan-body {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
	align-items: start;
	gap: clamp(32px, 5vw, 72px);
}

.nava-plan-body .nava-single { max-width: 70ch; }

.nava-plan-ways {
	position: sticky;
	inset-block-start: calc(var(--nava-header-h) + 24px);
	padding: 24px;
	background: var(--nava-surface);
	border: 1px solid var(--nava-ink);
}

.nava-plan-ways h2 { margin: 0 0 14px; font-size: 1.25rem; }
.nava-plan-ways p { margin: 0; color: var(--nava-ink-muted); font-size: .92rem; line-height: 1.85; }

.nava-plan-ways ul { margin: 0; padding: 0; list-style: none; }
.nava-plan-ways li + li { border-top: 1px solid var(--nava-rule); }

.nava-plan-ways a {
	display: grid;
	grid-template-columns: 40px minmax(0, 1fr);
	align-items: center;
	gap: 12px;
	min-height: 64px;
	padding-block: 10px;
	color: var(--nava-ink);
	text-decoration: none;
}

.nava-plan-ways a strong { display: block; font-weight: 700; }
.nava-plan-ways a small { display: block; color: var(--nava-ink-muted); font-size: .84rem; line-height: 1.6; }
.nava-plan-ways a:hover strong { text-decoration: underline; text-decoration-color: var(--nava-accent); text-decoration-thickness: 3px; }

.nava-plan-ways__icon {
	display: grid;
	place-items: center;
	width: 40px;
	height: 40px;
	background: var(--nava-bg-alt);
	border-radius: 50%;
	color: var(--nava-primary);
	transition: background-color .2s ease, color .2s ease;
}

.nava-plan-ways a:hover .nava-plan-ways__icon { background: var(--nava-accent); color: var(--nava-ink); }
.nava-plan-ways__note { margin-top: 14px !important; padding-top: 14px; border-top: 1px solid var(--nava-rule); font-size: .84rem !important; }

.nava-plan-related { border-top: 1px solid var(--nava-ink); }

.nava-area-single .nava-entry-content { max-width: 70ch; }

.nava-area-others { background: var(--nava-bg-alt); }
.nava-area-others h2 { margin: 0 0 18px; font-size: 1.4rem; }
.nava-area-others ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 32px; margin: 0; padding: 0; list-style: none; }
.nava-area-others a { display: grid; gap: 4px; min-height: 44px; padding-block: 16px; border-top: 2px solid var(--nava-ink); color: var(--nava-ink); text-decoration: none; }
.nava-area-others a strong { font-family: var(--nava-font-heading); font-size: 1.1rem; }
.nava-area-others a span { color: var(--nava-ink-muted); font-size: .92rem; }
.nava-area-others a:hover strong { text-decoration: underline; text-decoration-color: var(--nava-accent); text-decoration-thickness: 3px; }

.nava-area-switcher { border-block: 1px solid var(--nava-rule); background: var(--nava-bg); }
.nava-area-switcher .nava-container { padding-block: 20px; }
.nava-area-switcher p { margin: 0 0 10px; color: var(--nava-ink-muted); font-size: .85rem; font-weight: 700; }
.nava-area-switcher ul { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.nava-area-switcher a { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 16px; border: 1px solid var(--nava-rule); border-radius: 999px; color: var(--nava-ink); font-size: .9rem; font-weight: 650; text-decoration: none; transition: background .2s ease, border-color .2s ease; }
.nava-area-switcher a:hover, .nava-area-switcher a:focus-visible { border-color: var(--nava-primary); background: var(--nava-bg-alt); }
.nava-area-switcher a.is-active { border-color: var(--nava-primary); background: var(--nava-primary); color: #fff; }

/* زیرحوزه‌ها: کارت‌های خوانا، با رابطهٔ آشکار با حوزهٔ مادر. */
.nava-area__details { display: inline-flex; align-items: center; min-height: 44px; margin-block-start: 10px; }
.nava-area__services a { color: inherit; text-decoration-color: var(--nava-primary); text-underline-offset: 4px; }
.nava-area__services a:hover { color: var(--nava-primary); }
.nava-subareas { background: var(--nava-bg-alt); border-block: 1px solid var(--nava-rule); }
.nava-subareas__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.nava-subarea-card {
	display: flex;
	flex-direction: column;
	gap: 10px;
	min-width: 0;
	padding: clamp(20px, 3vw, 32px);
	background: var(--nava-surface);
	border: 1px solid var(--nava-rule);
	color: var(--nava-ink);
	text-decoration: none;
	transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.nava-subarea-card:hover,
.nava-subarea-card:focus-visible { border-color: var(--nava-primary); box-shadow: 0 10px 28px rgba(15, 42, 34, .08); }
.nava-subarea-card:hover { transform: translateY(-2px); }
.nava-subarea-card__index { color: var(--nava-primary); font: 700 .9rem var(--nava-font-heading); }
.nava-subarea-card h3 { margin: 0; font: 700 clamp(1.15rem, 1rem + .5vw, 1.45rem)/1.6 var(--nava-font-heading); }
.nava-subarea-card p { margin: 0; color: var(--nava-ink-muted); line-height: 1.9; }
.nava-subarea-card__more { margin-block-start: auto; padding-block-start: 12px; color: var(--nava-primary); font-weight: 700; }
.nava-area-source { padding-block: 22px; }
.nava-area-source p { max-width: 82ch; margin: 0; color: var(--nava-ink-muted); font-size: .9rem; line-height: 1.9; }
.nava-area-source a { color: var(--nava-primary); text-underline-offset: 3px; }
.nava-service-hero__parent { margin: 16px 0 8px !important; font-weight: 700; }
.nava-service-hero__parent a { color: var(--nava-primary); text-underline-offset: 4px; }
.nava-service-hero__grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); align-items: center; gap: clamp(24px, 5vw, 64px); }
.nava-service-hero__copy { min-width: 0; }
.nava-service-hero__copy h1 { max-width: 17ch; }
.nava-service-hero__media { position: relative; overflow: hidden; margin: 0; aspect-ratio: 4 / 3; background: var(--nava-bg-alt); }
.nava-service-hero__media img,
.nava-service-hero__media .nava-pattern-art { display: block; width: 100%; height: 100%; object-fit: cover; }
.nava-service-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(250px, 320px); align-items: start; gap: clamp(32px, 6vw, 80px); }
.nava-service-body { max-width: 72ch; }
.nava-service-body ol { padding-inline-start: 1.5em; }
.nava-service-body li { padding-inline-start: .35em; }
.nava-service-aside { padding: 24px; border: 1px solid var(--nava-rule); background: var(--nava-bg-alt); }
.nava-service-aside__eyebrow { margin: 0 0 8px; color: var(--nava-primary); font-size: .9rem; font-weight: 700; }
.nava-service-aside h2 { margin: 0 0 10px; font-size: 1.3rem; }
.nava-service-aside p { line-height: 1.85; }
.nava-service-aside .nava-btn { margin-block: 8px 12px; }
.nava-service-aside__back { display: block; padding-block: 12px; color: var(--nava-primary); text-underline-offset: 4px; }
@media (max-width: 760px) {
	.nava-subareas__grid,
	.nava-service-layout,
	.nava-service-hero__grid { grid-template-columns: minmax(0, 1fr); }
	.nava-service-hero__media { aspect-ratio: 16 / 10; }
}

/* ---------- ۲۳. واکنش‌گرایی ---------- */

/* منو با نشان و توصیف سازمان، هفت پیوند و دکمه، زیر ۱۲۰۰ پیکسل جا نمی‌شود. */
@media (max-width: 1200px) {
	.nava-burger { display: inline-grid; }

	.nava-nav {
		position: absolute;
		inset-block-start: calc(100% + 12px);
		inset-inline: var(--nava-gutter);
		z-index: 5;
		margin: 0;
		padding: 16px 22px 24px;
		max-height: calc(100dvh - var(--nava-header-h) - 28px);
		overflow-y: auto;
		background: var(--nava-surface);
		border: 1px solid var(--nava-rule);
		border-radius: 14px;
		box-shadow: 0 20px 60px rgb(15 42 34 / .18);
		visibility: hidden;
		opacity: 0;
		transform: translateY(-8px);
		transition: opacity .2s ease, transform .2s ease, visibility .2s;
	}

	.nava-nav.is-open { visibility: visible; opacity: 1; transform: translateY(0); }

	.nava-nav > div > ul { display: block; }
	.nava-nav > div > ul > li { border-bottom: 1px solid var(--nava-rule); }

	.nava-nav a {
		display: flex;
		min-height: 60px;
		background-image: none;
		font-family: var(--nava-font-heading);
		font-size: 1.3rem;
		font-weight: 700;
	}

	.nava-nav .current-menu-item > a { color: var(--nava-primary); }

	.nava-nav .sub-menu {
		position: static;
		display: none;
		min-width: 0;
		padding: 0 0 12px;
		border: 0;
		background: transparent;
		opacity: 1;
		visibility: visible;
	}

	.nava-nav li.is-expanded > .sub-menu { display: block; }
	.nava-nav .sub-menu a { min-height: 48px; font-family: var(--nava-font-body); font-size: 1.05rem; font-weight: 500; }

	.nava-submenu-toggle {
		position: absolute;
		inset-block-start: 8px;
		inset-inline-end: 0;
		display: grid;
		place-items: center;
		width: 44px;
		height: 44px;
		border: 0;
		background: transparent;
		color: var(--nava-ink);
	}

	.nava-header__actions { margin-inline-start: auto; }
}

@media (max-width: 1024px) {
	.nava-hero__grid { grid-template-columns: minmax(0, 1fr) minmax(0, .75fr); }
	.nava-programme { grid-template-columns: 112px minmax(0, 1fr) minmax(180px, 240px); }
	.nava-programme__action { grid-column: 2 / -1; }
	.nava-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.nava-product-grid,
	.nava-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.nava-stats__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 860px) {
	:root { --nava-header-h: 84px; }
	.nava-logo--header .nava-logo__mark img { width: 76px; }

	.nava-logo__tagline { display: none; }
	.nava-logo--footer .nava-logo__tagline { display: block; }

	.nava-hero__grid,
	.nava-philosophy__head,
	.nava-area,
	.nava-contribute__layout,
	.nava-coverage__inner,
	.nava-accountability__layout,
	.nava-content-area,
	.nava-catalog-hero__inner,
	.nava-product-view__grid,
	.nava-product-view__content { grid-template-columns: minmax(0, 1fr); }

	/* روی موبایل عکس زیر تیتر می‌آید، به‌صورت نوار افقی، تا متر زود برسد. */
	.nava-hero__photo { aspect-ratio: 16 / 10; max-height: none; }
	.nava-hero__figure.has-pattern::before { inset-block: 20px -20px; inset-inline: 20px -12px; }

	.nava-measure__row { grid-template-columns: minmax(0, 1fr); gap: 14px; }
	.nava-measure__action .nava-btn { width: 100%; }

	.nava-philosophy__principles { grid-template-columns: minmax(0, 1fr); gap: 36px; }
	.nava-principle { display: grid; grid-template-columns: 132px minmax(0, 1fr); gap: 0 18px; align-items: start; }
	.nava-principle__photo { grid-row: span 2; margin: 0; aspect-ratio: 1 / 1; }

	.nava-contribute__intro,
	.nava-product-order-wrap { position: static; }

	.nava-journey__steps { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 48px; padding-top: 0; }
	.nava-journey__steps::before,
	.nava-journey__steps::after { display: none; }
	.nava-step { padding-top: 20px; border-top: 2px solid var(--nava-ink); }
	.nava-step::before { inset-block-start: -2px; height: 18px; }

	.nava-coverage__stage { order: -1; }

	.nava-plan-hero__grid,
	.nava-plan-body,
	.nava-area-others ul { grid-template-columns: minmax(0, 1fr); }
	.nava-plan-hero__media { aspect-ratio: 16 / 10; }
	.nava-plan-ways { position: static; }

	.nava-programme { grid-template-columns: 96px minmax(0, 1fr); align-items: start; }
	.nava-programme__measure,
	.nava-programme__action { grid-column: 1 / -1; }
	.nava-programme__action .nava-btn { width: 100%; }

	.nava-post-nav .nav-links { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 600px) {
	.nava-form-grid,
	.nava-choice-cards__grid,
	.nava-accountability__ledger,
	.nava-product-grid,
	.nava-grid,
	.nava-grid--2,
	.nava-grid--3,
	.nava-footer__grid { grid-template-columns: minmax(0, 1fr); }

	.nava-accountability__ledger li,
	.nava-accountability__ledger li:nth-child(even) { padding-inline: 0; border-inline-start: 0; }

	.nava-journey__steps,
	.nava-order-path ol { grid-template-columns: minmax(0, 1fr); }

	.nava-hero__actions { flex-direction: column; align-items: stretch; }
	.nava-hero__actions .nava-btn { width: 100%; }

	.nava-tape--lg { --tape-h: 44px; }
	.nava-tape__scale { font-size: .78rem; }
	.nava-tape__scale li { padding-inline: 2px; }

	.nava-principle { grid-template-columns: 96px minmax(0, 1fr); }

	.nava-segmented > label { flex: 1; }
	.nava-segmented > label > span { justify-content: center; width: 100%; padding-inline: 10px; }

	.nava-newsletter__form { flex-direction: column; }
	.nava-footer__promise .nava-btn { width: 100%; }

	.nava-facts { display: grid; }
}

/* ---------- ۲۴. حرکت و چاپ ---------- */

/*
 * حرکت اینجا سه کار می‌کند و بس: اندازه‌گیری را نشان می‌دهد (متر قهرمان و خط‌کش
 * مسیر)، به عمل کاربر پاسخ می‌دهد (اشاره، فشردن، باز شدن منو)، و سربرگ را هنگام
 * اسکرول از محتوا جدا می‌کند. هیچ بخشی با اسکرول ظاهر نمی‌شود: صفحه در حالت
 * سکون کامل خوانده می‌شود.
 */

/* یک لحظه هماهنگ در بار اول: متر باز می‌شود، بعد نام مرحله می‌آید. */
@media (prefers-reduced-motion: no-preference) {
	.nava-tape--measure .nava-tape__fill {
		transform-origin: 100% 50%;
		animation: nava-measure 1.6s var(--nava-ease) .3s both;
	}

	.nava-measure__stage { animation: nava-fade-in .5s ease .9s both; }
}

@keyframes nava-measure {
	from { transform: scaleX(0); }
}

@keyframes nava-fade-in {
	from { opacity: 0; }
}

/* فشردن دکمه: یک پله کوتاه، همان‌قدر که انگشت انتظار دارد. */
.nava-btn { transition: background-color .15s ease, color .15s ease, border-color .15s ease, transform .1s ease; }
.nava-btn:active { transform: translateY(1px); }

/*
 * خط‌کش «مسیر مشارکت» با اسکرول پر می‌شود — همان استعاره اندازه‌گیری، این‌بار
 * روی پیشرفت خواندن. با تایم‌لاین اسکرول انجام می‌شود، پس جاوااسکریپتی در کار
 * نیست؛ مرورگرهای بدون پشتیبانی خط را کامل می‌بینند.
 */
.nava-journey__steps::after {
	content: '';
	position: absolute;
	inset-inline: 0;
	inset-block-start: 0;
	height: 4px;
	background: var(--nava-accent);
	transform-origin: 100% 50%;
}

@supports (animation-timeline: view()) {
	@media (prefers-reduced-motion: no-preference) {
		.nava-journey__steps::after {
			animation: nava-rule-fill linear both;
			animation-timeline: view();
			animation-range: entry 25% cover 55%;
		}
	}
}

@keyframes nava-rule-fill {
	from { transform: scaleX(0); }
}

/* سربرگ چسبان: وقتی صفحه راه می‌افتد، یک سایه نازک زیرش می‌نشیند. */
@supports (animation-timeline: scroll()) {
	@media (prefers-reduced-motion: no-preference) {
		.nava-header {
			animation: nava-header-lift linear both;
			animation-timeline: scroll();
			animation-range: 0 140px;
		}
	}
}

@keyframes nava-header-lift {
	to {
		background-color: var(--nava-surface);
		box-shadow: 0 10px 24px rgba(15, 42, 34, .09);
	}
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		transition-duration: .01ms !important;
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		scroll-behavior: auto !important;
	}
}

/*
 * کلید «فعال بودن انیمیشن‌ها» در سفارشی‌ساز (نوا ← پیشرفته). کلاس nava-anim را
 * setup.php روی body می‌گذارد؛ بدون آن، سایت همان صفحه است بدون هیچ حرکتی.
 */
body:not(.nava-anim),
body:not(.nava-anim) *,
body:not(.nava-anim) *::before,
body:not(.nava-anim) *::after {
	transition-duration: .01ms !important;
	animation-duration: .01ms !important;
	animation-iteration-count: 1 !important;
	scroll-behavior: auto !important;
}

@media print {
	.nava-header,
	.nava-footer,
	.nava-to-top,
	.nava-hero__figure,
	.nava-contribute,
	.nava-coverage__stage { display: none !important; }

	body { background: #fff; color: #000; }
	a { color: #000; }
	.nava-tape__fill { print-color-adjust: exact; -webkit-print-color-adjust: exact; }
}