/* =========================================================================
   TOKENS — پایه‌ی سیستم طراحی
   تمام رنگ‌ها، فونت‌ها، مقیاس تایپوگرافی و فاصله‌ها فقط از همین فایل کنترل
   می‌شوند. برای تغییر هویت بصری، فقط مقادیر این فایل را عوض کنید.
   ========================================================================= */

/* ------------------------------------------------------------- فونت‌ها */
@font-face {
  font-family: 'Vazirmatn';
  src: url('../assets/fonts/Vazirmatn-Light.woff2') format('woff2');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Vazirmatn';
  src: url('../assets/fonts/Vazirmatn-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Vazirmatn';
  src: url('../assets/fonts/Vazirmatn-Medium.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Vazirmatn';
  src: url('../assets/fonts/Vazirmatn-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Vazirmatn';
  src: url('../assets/fonts/Vazirmatn-Black.woff2') format('woff2');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
/* فونتِ نمایشی — فقط برای تیترهای درشت.
   Estedad هندسی‌تر و امروزی‌تر از Vazirmatn است و کنارِ آن می‌نشیند:
   Vazirmatn برای متن، Estedad برای تیتر.

   دو وزن بارگذاری می‌شود: Black برای تیترهای درشت و Bold برای h3ها.
   وزنِ ۸۰۰ که h2 می‌خواهد، طبق قواعد تطبیقِ فونت به Black می‌رسد؛ پس
   مرورگر هیچ‌جا مجبور به ضخیم‌کردنِ مصنوعی نیست.
   نسخه‌ی متغیرِ همه‌وزنه ۱۲۱KB بود؛ این دو با هم ۱۱۳KB و دقیقاً همان دو
   وزنی که به کار می‌آیند.
   مجوز: SIL OFL 1.1 — متنش در assets/fonts/Estedad-OFL.txt */
@font-face {
  font-family: 'Estedad';
  src: url('../assets/fonts/Estedad-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Estedad';
  src: url('../assets/fonts/Estedad-Black.woff2') format('woff2');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'IBM Plex Mono';
  src: url('../assets/fonts/IBMPlexMono-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'IBM Plex Mono';
  src: url('../assets/fonts/IBMPlexMono-Medium.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

:root {
  /* ------------------------------------------------------------- رنگ */
  /* سرمه‌ای و طلایی — یک پله تیره‌تر و گرم‌تر:
       • زمینه از #061020 به #050B14 رفت و اشباع آبی‌اش کم شد، پس سردی
         قبلی را ندارد و عکس‌ها روی آن گرم‌تر می‌نشینند.
       • طلایی از لیمویی به کهربایی چرخید (#F5B731 → #F0A32E): قرمزِ
         بیشتر، سبزِ کمتر.
       • خنثی‌ها از فولادیِ سرد به خاکستریِ گرم تغییر کردند.
       • فقط رنگ داده کمی خنکی دارد تا طلایی در برابرش بدرخشد.          */

  /* زمینه‌ها — سرمه‌ای عمیق و گرم */
  --ink-950: #02050A;
  --ink-900: #050B14;
  --ink-850: #071019;
  --ink-800: #0A151F;
  --ink-750: #0C1A26;
  --ink-700: #112230;
  --ink-600: #1A3044;
  --ink-500: #234057;

  /* طلایی کهربایی */
  --accent-700: #A16A16;
  --accent-600: #D18A22;
  --accent-500: #F0A32E;
  --accent-400: #FFB94C;
  --accent-300: #FFD183;

  /* خوانش‌های فنی — فولادیِ ملایم، تنها عنصر خنک */
  --steel-600: #7E8E93;
  --steel-500: #9DAFB6;
  --steel-400: #BECDD2;

  /* خنثی‌ها — خاکستریِ گرم
     دو پله‌ی پایینی روشن‌تر از طرح اولیه‌اند: مقادیر قبلی (#767169 و
     #514C45) روی زمینه‌ی سرمه‌ای به نسبت کنتراست ۴٫۰۷ و ۲٫۳۲ می‌رسیدند و
     حداقل ۴٫۵ استاندارد WCAG AA را برای متن معمولی رد نمی‌کردند —
     پاورقی و برچسب‌های فنی عملاً خوانا نبودند. */
  --fg-100: #F3EFE9;                               /* 17.2 : 1 */
  --fg-200: #D0C9C0;
  --fg-300: #A3A39B;                               /*  7.8 : 1 */
  --fg-400: #918A81;                               /*  5.8 : 1 */
  --fg-500: #7E7870;                               /*  4.5 : 1 — کف مجاز */

  /* نقش‌های معنایی */
  --bg: var(--ink-900);
  --bg-deep: var(--ink-950);
  --bg-alt: var(--ink-850);
  --surface: rgba(16, 32, 46, 0.62);
  --surface-solid: var(--ink-800);
  --surface-raised: var(--ink-750);

  --text: var(--fg-100);
  --text-muted: var(--fg-300);
  --text-subtle: var(--fg-400);
  --accent: var(--accent-500);
  --accent-bright: var(--accent-300);
  --accent-deep: var(--accent-700);
  --data: var(--steel-500);

  --border: rgba(163, 163, 155, 0.16);
  --border-strong: rgba(163, 163, 155, 0.27);
  --border-accent: rgba(240, 163, 46, 0.45);
  --accent-glow: rgba(240, 163, 46, 0.18);
  --accent-wash: rgba(240, 163, 46, 0.08);
  --border-data: rgba(157, 175, 182, 0.3);

  --shadow-card: 0 24px 60px -24px rgba(0, 0, 0, 0.88), 0 4px 16px -8px rgba(0, 0, 0, 0.65);
  --shadow-lift: 0 40px 90px -30px rgba(0, 0, 0, 0.92), 0 8px 24px -10px rgba(0, 0, 0, 0.72);

  /* ------------------------------------------------------ تایپوگرافی */
  --font-fa: 'Vazirmatn', 'Segoe UI', Tahoma, system-ui, sans-serif;
  --font-display: 'Estedad', 'Vazirmatn', 'Segoe UI', Tahoma, sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, 'Cascadia Mono', Consolas, monospace;

  /* مقیاس تایپ — سیال ولی مهار شده */
  --fs-mono: 0.6875rem;                            /* برچسب‌های فنی لاتین */
  --fs-mono-lg: 0.8125rem;
  --fs-xs: 0.8125rem;
  --fs-sm: 0.9375rem;
  --fs-base: 1.0625rem;                            /* متن فارسی کمی درشت‌تر */
  --fs-lg: clamp(1.125rem, 1.4vw, 1.3125rem);
  --fs-xl: clamp(1.375rem, 2vw, 1.75rem);
  --fs-2xl: clamp(1.75rem, 3vw, 2.625rem);
  --fs-3xl: clamp(2.25rem, 4.6vw, 3.75rem);
  --fs-4xl: clamp(2.75rem, 7vw, 6rem);             /* تیتر قهرمان */

  --lh-tight: 1.24;
  --lh-heading: 1.35;
  --lh-body: 1.9;                                  /* فارسی به فاصله‌ی سطر بیشتری نیاز دارد */
  --tracking-mono: 0.16em;                          /* فقط برای لاتین — هرگز روی فارسی */

  /* ------------------------------------------------------------ فضا */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;
  --sp-8: 64px;
  --sp-9: 96px;
  --sp-10: 128px;

  --gutter: clamp(20px, 4.2vw, 68px);
  --section-py: clamp(72px, 10vh, 148px);
  --maxw: 1520px;
  --maxw-text: 62ch;

  --radius-sm: 4px;
  --radius: 8px;
  --radius-lg: 14px;

  /* فضای اشغال‌شده‌ی نوارِ ناوبریِ شناورِ بالا (نوار + فاصله از لبه).
     بخش‌هایی که محتوایشان از بالای کادر شروع می‌شود از این فاصله می‌گیرند. */
  --header-h: 82px;

  /* ------------------------------------------------------- حرکت */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 180ms;
  --dur: 380ms;
  --dur-slow: 720ms;

  --z-header: 1000;
  --z-float: 900;
  --z-overlay: 1100;
}

/* در حالت کاهش حرکت، مدت‌ها عملاً صفر می‌شوند */
@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-fast: 1ms;
    --dur: 1ms;
    --dur-slow: 1ms;
  }
}