/* =====================================================
   MohammadAli Nari Theme — Design Tokens & Foundations
   ===================================================== */

:root {
	--paper: #FAF6EE;
	--paper-2: #F3EDE0;
	--surface: #FFFFFF;
	--ink: #191524;
	--ink-2: #4B4560;
	--ink-3: #8D87A0;
	--line: rgba(25, 21, 36, .10);
	--line-strong: rgba(25, 21, 36, .16);

	--indigo: #4F46E5;
	--indigo-deep: #3730A3;
	--violet: #8B7CF6;
	--coral: #FF6D4D;
	--peach: #FFC49B;
	--cyan: #4FC3CB;

	--grad-main: linear-gradient(120deg, var(--indigo), var(--violet) 55%, var(--coral));
	--grad-warm: linear-gradient(120deg, var(--coral), var(--peach));
	--grad-cool: linear-gradient(120deg, var(--cyan), var(--violet));

	--shadow-sm: 0 2px 10px rgba(25, 21, 36, .06);
	--shadow-md: 0 14px 40px -12px rgba(25, 21, 36, .14);
	--shadow-lg: 0 30px 80px -20px rgba(55, 48, 163, .22);

	--r-sm: 10px;
	--r-md: 18px;
	--r-lg: 28px;
	--r-xl: 40px;

	--ease: cubic-bezier(.22, .8, .24, 1);
	--ease-out: cubic-bezier(.16, 1, .3, 1);

	--font-fa: 'Vazirmatn', 'Segoe UI', Tahoma, sans-serif;
	--font-lt: 'Space Grotesk', 'Vazirmatn', Tahoma, sans-serif;

	--container: 1200px;
	--container-wide: 1400px;
	--header-h: 76px;
}

@media (min-width: 1600px) {
	:root {
		font-size: 17px;
	}
}

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

* { margin: 0; }

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

body {
	background: var(--paper);
	color: var(--ink);
	font-family: var(--font-fa);
	font-size: 1.0625rem;
	line-height: 1.95;
	font-weight: 400;
	overflow-x: clip;
	min-height: 100dvh;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
}

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

input, button, textarea, select { font: inherit; color: inherit; }

h1, h2, h3, h4 {
	line-height: 1.35;
	font-weight: 800;
	text-wrap: balance;
}

a { color: inherit; text-decoration: none; }

ul[class], ol[class] { list-style: none; padding: 0; }

::selection { background: rgba(79, 70, 229, .18); }

:focus-visible {
	outline: 2px solid var(--indigo);
	outline-offset: 3px;
	border-radius: 4px;
}

[dir="rtl"] .n-icon,
.n-icon { flex: none; }

/* ---------- Layout helpers ---------- */
.n-container {
	width: min(100% - 2 * clamp(20px, 5vw, 64px), var(--container));
	margin-inline: auto;
}

.n-container-wide {
	width: min(100% - 2 * clamp(16px, 3vw, 56px), var(--container-wide));
	margin-inline: auto;
}

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

.skip-link:focus {
	clip-path: none;
	height: auto;
	width: auto;
	top: 12px;
	inset-inline-start: 12px;
	background: var(--ink);
	color: var(--paper);
	padding: 10px 18px;
	border-radius: 999px;
	z-index: 9999;
	font-weight: 600;
}

/* ---------- Type helpers ---------- */
.n-grad-text {
	background: var(--grad-main);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	display: inline-block;
}

.n-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-family: var(--font-lt);
	font-size: .8rem;
	font-weight: 500;
	letter-spacing: .14em;
	color: var(--indigo-deep);
	background: rgba(79, 70, 229, .07);
	border: 1px solid rgba(79, 70, 229, .16);
	padding: 7px 16px;
	border-radius: 999px;
	line-height: 1.4;
}

.n-eyebrow__dot {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--coral);
	box-shadow: 0 0 0 3px rgba(255, 109, 77, .18);
	animation: n-pulse 2.4s infinite;
}

@keyframes n-pulse {
	0%, 100% { transform: scale(1); opacity: 1; }
	50% { transform: scale(.72); opacity: .75; }
}

.n-statement {
	font-size: clamp(1.45rem, 2.6vw, 2.15rem);
	font-weight: 700;
	line-height: 1.85;
	color: var(--ink);
	max-width: 26ch;
}

/* Section head pattern */
.n-shead { margin-bottom: clamp(40px, 6vw, 72px); max-width: 640px; }

.n-shead__meta {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-family: var(--font-lt);
	font-size: .82rem;
	letter-spacing: .12em;
	color: var(--indigo);
	margin-bottom: 18px;
}

.n-shead__num { font-weight: 600; direction: ltr; unicode-bidi: isolate; }
.n-shead__sep { width: 34px; height: 1px; background: linear-gradient(to left, var(--indigo), transparent); display: inline-block; }
.n-shead__label { font-family: var(--font-fa); letter-spacing: 0; color: var(--ink-3); font-weight: 500; }

.n-shead__title {
	font-size: clamp(1.9rem, 4vw, 3rem);
	line-height: 1.4;
	margin-bottom: 16px;
}

.n-shead__sub { color: var(--ink-2); max-width: 52ch; }

.n-pagehero {
	padding-top: calc(var(--header-h) + clamp(48px, 8vw, 96px));
	padding-bottom: clamp(32px, 5vw, 56px);
	position: relative;
	overflow: hidden;
}

.n-pagehero::before {
	content: "";
	position: absolute;
	inset-block-start: -140px;
	inset-inline-end: -120px;
	width: 420px;
	height: 420px;
	background: radial-gradient(closest-side, rgba(139, 124, 246, .16), transparent 70%);
	filter: blur(8px);
	pointer-events: none;
}

.n-pagehero__title { font-size: clamp(2.1rem, 5vw, 3.6rem); line-height: 1.35; }
.n-pagehero__desc { color: var(--ink-2); max-width: 56ch; margin-top: 16px; }
.n-pagehero__form { margin-top: 28px; max-width: 480px; }
