/* ============================================================================
   DIJIIK — DESIGN TOKENS
   Kaynak: ui-ux-pro-max --design-system (Variance 5 / Motion 6 / Density 4)
   Marka override: Primary #1472E4 · Secondary #12314E
   Tüm renk çiftleri WCAG 2.1 AA (≥4.5:1 gövde metni) için doğrulanmıştır.
   ========================================================================== */

:root {
  /* ---------- Marka: Birincil mavi ---------- */
  --brand-50:  #eff6fe;
  --brand-100: #dfecfd;
  --brand-200: #bed8fb;
  --brand-300: #8dbcf5;
  --brand-400: #4a93ec;
  --brand-500: #1472e4;   /* ANA RENK */
  --brand-600: #1063c9;
  --brand-700: #0f5cbd;   /* Küçük metin/link — beyaz üzerinde 6.0:1 */
  --brand-800: #10488f;
  --brand-900: #123f77;

  /* ---------- Marka: İkincil lacivert ---------- */
  --navy-500: #33648f;
  --navy-600: #22507a;
  --navy-700: #1a4066;
  --navy-800: #12314e;    /* İKİNCİL RENK — beyaz üzerinde 13.3:1 */
  --navy-900: #0b2138;
  --navy-950: #071626;

  /* ---------- Semantik roller ---------- */
  --color-primary:        var(--brand-500);
  --color-primary-hover:  var(--brand-600);
  --color-on-primary:     #ffffff;
  --color-secondary:      var(--navy-800);
  --color-on-secondary:   #ffffff;
  --color-accent:         var(--brand-700);

  --color-bg:             #f5f7fb;   /* sayfa zemini — soğuk kırık beyaz */
  --color-bg-alt:         #ffffff;
  --color-surface:        #ffffff;
  --color-surface-sunken: #f8fafd;
  --color-surface-dark:   var(--navy-900);

  --color-ink:            #12314e;   /* başlık / güçlü metin  13.3:1 */
  --color-ink-soft:       #3d5670;   /* ikincil metin          8.0:1 */
  --color-muted:          #5a6e85;   /* yardımcı metin         5.2:1 */
  --color-on-dark:        #eef3f9;
  --color-on-dark-muted:  #9db1c7;   /* lacivert üzerinde      6.4:1 */

  --color-line:           #e3eaf3;
  --color-line-soft:      #edf1f7;
  --color-line-dark:      rgba(255,255,255,.10);

  --color-success:        #0b7a55;
  --color-success-bg:     #e6f6ef;
  --color-warning:        #a55a00;
  --color-warning-bg:     #fdf3e3;
  --color-danger:         #c62525;
  --color-danger-bg:      #fdecec;
  --color-ring:           var(--brand-500);

  /* ---------- Tipografi ---------- */
  --font-sans: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI',
               Roboto, 'Helvetica Neue', Arial, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  --fs-display: clamp(2.5rem, 1.35rem + 4.6vw, 4.5rem);
  --fs-h1:      clamp(2.125rem, 1.3rem + 3.3vw, 3.5rem);
  --fs-h2:      clamp(1.75rem, 1.15rem + 2.4vw, 2.75rem);
  --fs-h3:      clamp(1.25rem, 1.05rem + 0.8vw, 1.625rem);
  --fs-h4:      clamp(1.0625rem, 1rem + 0.3vw, 1.1875rem);
  --fs-lead:    clamp(1.0625rem, 1rem + 0.35vw, 1.25rem);
  --fs-body:    1rem;      /* 16px tabanı — asla küçültme */
  --fs-sm:      0.9375rem;
  --fs-xs:      0.8125rem;
  --fs-label:   0.75rem;

  --lh-tight: 1.08;
  --lh-snug:  1.25;
  --lh-body:  1.6;

  --tracking-tight: -0.03em;
  --tracking-label:  0.08em;

  /* ---------- Boşluk (Density 4/10 — Standard) ---------- */
  --space-xs:  4px;
  --space-sm:  8px;
  --space-md:  16px;
  --space-lg:  24px;
  --space-xl:  32px;
  --space-2xl: 48px;
  --space-3xl: 64px;
  --section-y: clamp(64px, 7vw, 112px);
  --container: 1200px;
  --container-narrow: 760px;
  --gutter: clamp(20px, 4vw, 40px);

  /* ---------- Köşe yarıçapı ---------- */
  --r-xs:   8px;
  --r-sm:  12px;
  --r-md:  16px;
  --r-lg:  20px;
  --r-xl:  28px;
  --r-2xl: 36px;
  --r-pill: 999px;

  /* ---------- Gölge ---------- */
  --shadow-xs:  0 1px 2px rgba(18,49,78,.06);
  --shadow-sm:  0 2px 6px rgba(18,49,78,.06), 0 1px 2px rgba(18,49,78,.04);
  --shadow-md:  0 8px 20px -6px rgba(18,49,78,.10), 0 2px 6px rgba(18,49,78,.05);
  --shadow-lg:  0 24px 48px -14px rgba(18,49,78,.16), 0 8px 16px -10px rgba(18,49,78,.08);
  --shadow-xl:  0 44px 84px -24px rgba(18,49,78,.24), 0 14px 28px -14px rgba(18,49,78,.10);
  --shadow-brand: 0 12px 28px -10px rgba(20,114,228,.50);
  --shadow-inset-hair: inset 0 0 0 1px rgba(18,49,78,.07);

  /* ---------- Hareket (Motion 6/10 — Standard) ---------- */
  --dur-fast:   150ms;
  --dur:        220ms;
  --dur-slow:   320ms;
  --dur-reveal: 520ms;
  --ease:      cubic-bezier(.4, 0, .2, 1);
  --ease-out:  cubic-bezier(.16, 1, .3, 1);   /* ≈ GSAP power2.out */
  --ease-back: cubic-bezier(.34, 1.35, .5, 1);/* ≈ GSAP back.out(1.4) */

  --z-base: 1;
  --z-sticky: 100;
  --z-nav: 200;
  --z-overlay: 300;
}