:root {
    /* ==================================================
       BRAND & ACCENT
    ================================================== */
    --brand-primary: #7FB5FF; /* آبی پاستیلی */
    --brand-primary-hover: #9AC8FF;
    --brand-primary-soft: rgba(127,181,255,0.18);
    --brand-secondary: #A5B4FC; /* بنفش-آبی لطیف */
    --brand-tertiary: #5EEAD4; /* فیروزه‌ای آرام */
    /* ==================================================
       PAGE BACKGROUNDS
    ================================================== */
    --page-bg-main: #0A0F18; /* بک اصلی سایت */
    --page-bg-alt: #0E1522; /* صفحات داخلی */
    --page-bg-soft: #121B2A; /* صفحات خاص */
    /* ==================================================
       SURFACES (SECTIONS & LAYERS)
    ================================================== */
    --surface-header: #0B111A;
    --surface-header-elevated: #121A26;
    --surface-section: #0E1624;
    --surface-section-alt: #131E30;
    --surface-section-soft: #18263D;
    --surface-footer: #0C131E;
    --surface-footer-top: #162033;
    --surface-card: #141E2E;
    --surface-card-alt: #18253A;
    --surface-modal: #0F1726;
    --surface-glass: rgba(18,26,38,0.72);
    /* ==================================================
       TEXT COLORS
    ================================================== */
    --text-primary: #EAF2FF; /* متن اصلی */
    --text-secondary: #9FB0CC; /* متن توضیحی */
    --text-muted: #7C8BA5; /* متن کم‌اهمیت */
    --text-disabled: #5F6C86;
    --text-on-brand: #0A0F18; /* متن روی دکمه */
    --text-on-btn-white: #fff;
    --text-link: #9AC8FF;
    --text-link-hover: #C7DDFF;
    /* ==================================================
       BORDERS & DIVIDERS
    ================================================== */
    --border-strong: #22304A;
    --border-default: #1E2A3F;
    --border-soft: rgba(255,255,255,0.06);
    /* ==================================================
       INTERACTION STATES
    ================================================== */
    --state-hover-bg: rgba(127,181,255,0.10);
    --state-active-bg: rgba(127,181,255,0.18);
    --state-focus-ring: rgba(127,181,255,0.45);
    --state-selected-bg: rgba(127,181,255,0.22);
    --state-disabled-bg: rgba(255,255,255,0.04);
    /* ==================================================
       FORM ELEMENTS
    ================================================== */
    --input-bg: #121C2B;
    --input-border: #22304A;
    --input-border-focus: #7FB5FF;
    --input-placeholder: #6F7F9C;
    /* ==================================================
       STATUS / FEEDBACK
    ================================================== */
    --status-info: #60A5FA;
    --status-success: #4ADE80;
    --status-warning: #FBBF24;
    --status-danger: #F87171;
    --status-info-bg: rgba(96,165,250,0.15);
    --status-success-bg: rgba(74,222,128,0.15);
    --status-warning-bg: rgba(251,191,36,0.15);
    --status-danger-bg: rgba(248,113,113,0.15);
    /* ==================================================
       GRADIENTS (CINEMATIC)
    ================================================== */
    --gradient-page: radial-gradient( circle at top, #18263D 0%, #0A0F18 60%, #070B12 100% );
    --gradient-accent: linear-gradient( 135deg, #7FB5FF 0%, #A5B4FC 100% );
    /* ==================================================
       SHADOWS & DEPTH
    ================================================== */
    --shadow-xs: 0 2px 6px rgba(5,10,20,0.4);
    --shadow-sm: 0 6px 14px rgba(5,10,20,0.5);
    --shadow-md: 0 12px 30px rgba(5,10,20,0.6);
    --shadow-lg: 0 18px 50px rgba(5,10,20,0.75);
    /* ===== رنگ‌های شبکه‌های اجتماعی پاستلی ===== */
    --color-instagram: #f28ba3;
    --color-instagram-hover: #ffa6bc;
    --color-telegram: #66b3ff;
    --color-telegram-hover: #80c1ff;
    --color-youtube: #ff6666;
    --color-youtube-hover: #ff8c8c;
    --color-linkedin: #5d9bd6;
    --color-linkedin-hover: #77afdf;
    --color-social-bg: rgba(255, 126, 95, 0.15);
    --color-social-bg-hover: rgba(255, 154, 139, 0.25);
    /* ==================================================
       End
    ================================================== */
    --btn-red: #E50914;
