/* ══════════════════════════════════════════════════════════════════
   Corbit Design System — tokens
   Ported from _ds/corbit-design-system-c464e23b.../tokens/*.css
   ══════════════════════════════════════════════════════════════════ */

/* ── Webfonts: Yekan Bakh (Latin + Persian, Farsi numerals) ──────── */
@font-face {
  font-family: 'Yekan Bakh';
  font-weight: 300;
  font-style: normal;
  font-display: swap;
  src: url('../fonts/YekanBakh-Light.woff') format('woff');
}
@font-face {
  font-family: 'Yekan Bakh';
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src: url('../fonts/YekanBakh-Regular.woff') format('woff');
}
@font-face {
  font-family: 'Yekan Bakh';
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  src: url('../fonts/YekanBakh-Medium.woff') format('woff');
}
@font-face {
  font-family: 'Yekan Bakh';
  font-weight: 700;
  font-style: normal;
  font-display: swap;
  src: url('../fonts/YekanBakh-Bold.woff') format('woff');
}
@font-face {
  font-family: 'Yekan Bakh';
  font-weight: 800;
  font-style: normal;
  font-display: swap;
  src: url('../fonts/YekanBakh-Heavy.woff') format('woff');
}

:root {
  /* ── Brand: Darkblue / Navy (primary) ─────────────────────────── */
  --blue-1:  #A6BCFF;
  --blue-2:  #95ACF2;
  --blue-3:  #859DE5;
  --blue-4:  #748DD8;
  --blue-5:  #647DCB;
  --blue-6:  #425EB1;
  --blue-7:  #213E97;   /* primary hover */
  --blue-8:  #001F7D;   /* PRIMARY — Corbit navy */
  --blue-9:  #001964;
  --blue-10: #00134B;   /* dark surface / background */
  --blue-11: #000C32;
  --blue-12: #000926;
  --blue-13: #000619;
  --blue-14: #00030D;

  /* ── Brand: Mint / Cyan (accent) ──────────────────────────────── */
  --mint-1:  #E6FDF9;
  --mint-2:  #CCFBF3;
  --mint-3:  #B3F8EE;
  --mint-4:  #99F6E8;
  --mint-5:  #67F2DC;
  --mint-6:  #34EDD1;
  --mint-7:  #01E9C5;   /* ACCENT — Corbit cyan */
  --mint-8:  #01BA9E;
  --mint-9:  #018C76;
  --mint-10: #005D4F;
  --mint-11: #00463B;
  --mint-12: #002F27;
  --mint-13: #001714;

  /* ── Neutrals / Gray ──────────────────────────────────────────── */
  --white:     #FFFFFF;
  --gray-0:    #FBFBFB;
  --gray-50:   #FAFAFB;
  --gray-100:  #F6F6F6;
  --gray-200:  #EEEEEE;
  --gray-300:  #E5E5E5;
  --gray-400:  #D9D9D9;
  --gray-500:  #CCCCCC;
  --gray-600:  #B2B2B2;
  --gray-700:  #999999;
  --gray-800:  #7F7F7F;
  --gray-900:  #666666;
  --gray-1000: #4C4C4C;
  --gray-1100: #323232;
  --gray-1200: #191919;
  --black:     #141414;   /* content-primary */
  --true-black:#000000;

  /* ── Status ───────────────────────────────────────────────────── */
  --green-400: #16A163;
  --green-500: #077D55;
  --green-600: #075E45;
  --green-50:  #EBF7ED;
  --red-600:   #CF1322;
  --red-300:   #FF7875;
  --red-200:   #FFA39E;
  --red-50:    #FCE8E8;
  --yellow-500:#FADB14;
  --yellow-50: #FEFFE6;

  /* ── Semantic aliases ─────────────────────────────────────────── */
  --color-primary:         var(--blue-8);
  --color-primary-hover:   var(--blue-7);
  --color-primary-active:  var(--blue-9);
  --color-primary-soft:    var(--blue-1);
  --color-secondary:       #53B79F;
  --color-secondary-hover: #46A08B;
  --color-secondary-active:#3A8875;
  --color-secondary-soft:  #E3F4EF;

  /* Content / text */
  --content-primary:    var(--black);
  --content-secondary:  var(--gray-1000);
  --content-tertiary:   var(--gray-900);
  --content-disable:    var(--gray-600);
  --content-accent:     var(--blue-8);
  --content-oncontrast: var(--white);
  --content-positive:   var(--green-500);
  --content-negative:   var(--red-600);

  /* Surfaces */
  --surface-main:            var(--gray-0);
  --surface-secondary:       var(--gray-100);
  --surface-tertiary:        var(--gray-200);
  --surface-card:            var(--white);
  --surface-background:      var(--blue-10);
  --surface-background-2:    var(--blue-12);
  --surface-accent:          var(--blue-8);
  --surface-accent-soft:     var(--blue-1);
  --surface-secondary-brand: var(--mint-7);
  --surface-disable:         var(--gray-50);
  --surface-positive:        var(--green-400);
  --surface-positive-soft:   var(--green-50);
  --surface-negative:        var(--red-600);
  --surface-negative-soft:   var(--red-50);
  --surface-warning:         var(--yellow-500);
  --surface-warning-soft:    var(--yellow-50);

  /* Borders */
  --border-main:      var(--gray-200);
  --border-secondary: var(--gray-100);
  --border-strong:    var(--gray-400);
  --border-accent:    var(--blue-8);
  --border-primary:   var(--mint-7);
  --border-negative:  var(--red-600);
  --border-positive:  var(--green-500);
  --border-on-dark:   rgba(255, 255, 255, 0.14);

  /* Overlays */
  --overlay-dark-10:  rgba(0, 0, 0, 0.10);
  --overlay-dark-20:  rgba(0, 0, 0, 0.20);
  --overlay-light-30: rgba(255, 255, 255, 0.30);
  --overlay-light-50: rgba(255, 255, 255, 0.50);
  --overlay-light-90: rgba(255, 255, 255, 0.90);

  /* Signature brand gradients */
  --gradient-brand:      linear-gradient(103deg, #001F7D 0%, #0958D9 46%, #01E9C5 100%);
  --gradient-brand-soft: linear-gradient(103deg, #001964 0%, #01BA9E 100%);
  --gradient-hero:       radial-gradient(120% 120% at 80% -10%, #0958D9 0%, #001964 42%, #00134B 100%);

  /* ── Typography ───────────────────────────────────────────────── */
  --font-latin:   'Yekan Bakh', 'Vazirmatn', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-fa:      'Yekan Bakh', 'Vazirmatn', -apple-system, sans-serif;
  --font-display: 'Yekan Bakh', 'Vazirmatn', -apple-system, sans-serif;
  --font-mono:    ui-monospace, 'SF Mono', 'IBM Plex Mono', Menlo, Consolas, monospace;
  --font-sans:    var(--font-latin);

  --fw-regular:  400;
  --fw-medium:   500;
  --fw-semibold: 600;
  --fw-bold:     700;
  --fw-black:    800;

  --fs-10: 10px;  --fs-12: 12px;  --fs-14: 14px;  --fs-16: 16px;
  --fs-18: 18px;  --fs-20: 20px;  --fs-22: 22px;  --fs-28: 28px;
  --fs-32: 32px;  --fs-36: 36px;  --fs-40: 40px;  --fs-44: 44px;
  --fs-48: 48px;  --fs-64: 64px;

  --headline-3xlarge: 48px;
  --headline-2xlarge: 40px;
  --headline-xlarge:  32px;
  --headline-large:   28px;
  --headline-medium:  22px;
  --headline-small:   20px;
  --headline-xsmall:  16px;

  --body-large:   18px;
  --body-medium:  16px;
  --body-small:   14px;
  --body-xsmall:  12px;
  --body-2xsmall: 10px;

  --lh-headline-3xlarge: 64px;
  --lh-headline-2xlarge: 56px;
  --lh-headline-xlarge:  48px;
  --lh-headline-large:   42px;
  --lh-headline-medium:  36px;
  --lh-headline-small:   30px;
  --lh-body-large:  32px;
  --lh-body-medium: 28px;
  --lh-body-small:  24px;
  --lh-body-xsmall: 20px;

  --tracking-tight:  -0.02em;
  --tracking-snug:   -0.01em;
  --tracking-normal: 0;
  --tracking-wide:   0.04em;
  --tracking-caps:   0.08em;

  /* ── Spacing ──────────────────────────────────────────────────── */
  --space-4:  4px;   --space-6:  6px;   --space-8:  8px;   --space-12: 12px;
  --space-16: 16px;  --space-20: 20px;  --space-24: 24px;  --space-32: 32px;
  --space-40: 40px;  --space-48: 48px;  --space-56: 56px;  --space-64: 64px;
  --space-80: 80px;

  --control-h-sm: 32px;
  --control-h-md: 48px;
  --control-h-lg: 56px;
  --control-pad-sm: 8px;
  --control-pad-md: 10px;
  --control-pad-lg: 12px;

  --container-max:  1200px;
  --container-wide: 1360px;
  /* the Home design lays out on a 1320px shell with 40px gutters */
  --container-site: 1320px;
  --gutter: 40px;
  --gutter-narrow: 32px;
  --section-y: clamp(64px, 9vw, 128px);

  /* ── Borders, radii, shadows ──────────────────────────────────── */
  --border-1: 1px;
  --border-2: 2px;
  --border-3: 3px;
  --border-4: 4px;

  --radius-2:  2px;   --radius-4:  4px;   --radius-6:  6px;
  --radius-8:  8px;   --radius-12: 12px;  --radius-16: 16px;
  --radius-24: 24px;  --radius-pill: 999px;

  --focus-ring: 0 0 0 2px var(--surface-main), 0 0 0 4px var(--mint-7);

  --shadow-hairline: inset 0 0 0 1px var(--border-main);
  --shadow-xs:   0 1px 2px rgba(0, 25, 100, 0.06);
  --shadow-sm:   0 2px 8px rgba(0, 25, 100, 0.08);
  --shadow-md:   0 8px 24px rgba(0, 25, 100, 0.10);
  --shadow-lg:   0 20px 48px rgba(0, 19, 75, 0.16);
  --shadow-glow: 0 0 0 1px rgba(1, 233, 197, 0.4), 0 8px 32px rgba(1, 233, 197, 0.18);
}