/**
 * توکن‌های طراحی — نمایشگاه «ایرانیان بدون مرز، اقتصاد بدون مرز»
 * سیستم طراحی تازه — نه کپی از جای دیگر
 *
 * نکته‌ی فونت: کل سایت فقط از Vazirmatn (متغیر، وزن ۱۰۰ تا ۹۰۰) استفاده
 * می‌کند. دلیل: وقتی یک فونت لاتین (مثل سریف انگلیسی) را برای تیترهای
 * فارسی می‌گذاریم، مرورگر برای حروف فارسی مجبور به fallback می‌شود و
 * فاصله‌ی خط، ارتفاع حروف و ضخامت‌ها با بقیه‌ی متن هم‌خوان نمی‌شوند —
 * دقیقاً همان حسِ «یه‌جوریِ» فونت. با یک خانواده‌ی فونت واحد و وزن‌های
 * مختلف، هم یکدستی حفظ می‌شود و هم می‌شود سلسله‌مراتب بصری ساخت.
 */

:root {
    /* ── پس‌زمینه‌ها: لایه‌های عمق، نه یک مشکیِ تخت ── */
    --bg-void:        #050506;
    --bg-base:        #09090b;
    --bg-raised:      #0f0f12;
    --bg-card:        #141419;
    --bg-card-hover:  #191922;
    --bg-overlay:     rgba(5, 5, 6, 0.86);

    /* ── طلایی برند (از لوگوی نمایشگاه) ── */
    --gold-900:  #7a5f24;
    --gold-700:  #a9843a;
    --gold-500:  #c8a951;
    --gold-400:  #d9bd6f;
    --gold-300:  #e9cd82;
    --gold-100:  #f6e9c4;
    --gold-glow: rgba(200, 169, 81, 0.16);

    /* ── لهجه‌های ثانویه (از پرچم ایران) — کم‌مصرف، فقط برای تاکید ── */
    --accent-emerald: #2f8f5b;
    --accent-emerald-soft: rgba(47, 143, 91, 0.14);
    --accent-ruby:    #c1453a;
    --accent-ruby-soft: rgba(193, 69, 58, 0.14);

    /* ── متن ── */
    --ink-100: #faf7ee;
    --ink-300: #ddd6c4;
    --ink-500: #a39c8a;
    --ink-700: #6e6858;
    --ink-900: #48453b;
    --ink-on-gold: #1a1408;

    /* ── خطوط و مرزها ── */
    --line-1: rgba(233, 205, 130, 0.08);
    --line-2: rgba(233, 205, 130, 0.16);
    --line-3: rgba(233, 205, 130, 0.30);

    /* ── وضعیت‌ها ── */
    --state-error: #e0625a;
    --state-error-soft: rgba(224, 98, 90, 0.12);
    --state-success: #4fae7e;
    --state-success-soft: rgba(79, 174, 126, 0.12);

    /* ── فونت ── */
    --font: 'Vazirmatn', 'Tahoma', sans-serif;

    /* ── فاصله‌گذاری (۴px scale) ── */
    --sp-1:  4px;
    --sp-2:  8px;
    --sp-3:  12px;
    --sp-4:  16px;
    --sp-5:  20px;
    --sp-6:  24px;
    --sp-8:  32px;
    --sp-10: 40px;
    --sp-12: 48px;
    --sp-16: 64px;
    --sp-20: 80px;
    --sp-24: 96px;
    --sp-32: 128px;

    /* ── شعاع گوشه‌ها ── */
    --r-sm:  8px;
    --r-md:  14px;
    --r-lg:  22px;
    --r-xl:  32px;
    --r-pill: 999px;

    /* ── سایه‌ها ── */
    --shadow-sm: 0 4px 16px rgba(0,0,0,0.28);
    --shadow-md: 0 12px 40px rgba(0,0,0,0.38);
    --shadow-lg: 0 24px 70px rgba(0,0,0,0.5);
    --shadow-gold: 0 16px 44px rgba(200,169,81,0.18);

    /* ── انتقال‌ها ── */
    --ease-out:    cubic-bezier(.16,1,.3,1);
    --ease-inout:  cubic-bezier(.65,0,.35,1);
    --ease-spring: cubic-bezier(.34,1.56,.64,1);
    --dur-fast: 220ms;
    --dur-base: 420ms;
    --dur-slow: 720ms;

    /* ── ابعاد چیدمان ── */
    --container: 1280px;
    --container-narrow: 860px;
    --container-pad: clamp(20px, 5vw, 56px);
    --header-h: 84px;
    --header-h-scrolled: 68px;

    /* ── z-index scale (برای جلوگیری از روی‌هم‌افتادگی) ──
       نکته: --z-header باید از --z-dropdown (که پنل موبایل هم از آن
       استفاده می‌کند) بالاتر باشد، وگرنه دکمه‌ی همبرگر داخل هدر –با
       اینکه خودش z-index بالاتری دارد– چون هدر یک stacking context
       جدا می‌سازد، زیر پنل تمام‌صفحه گم می‌شود و دیگر قابل کلیک
       نیست (این باگ واقعی در نسخه‌ی اول این پروژه وجود داشت). */
    --z-bg-deco:    1;
    --z-content:    10;
    --z-dropdown:   600;
    --z-header:     650;
    --z-cta-float:  700;
    --z-cursor:     900;
    --z-preloader:  950;
    --z-toast:      980;
}

/* حالت کم‌حرکت: کاربرانی که ترجیح می‌دهند انیمیشن کمتری ببینند */
@media (prefers-reduced-motion: reduce) {
    :root {
        --dur-fast: 1ms;
        --dur-base: 1ms;
        --dur-slow: 1ms;
    }
}