/* ───────────────────────────────────────────────────────────────
   BenMeal Landing — Design Tokens (CSS Custom Properties)
   Sistem adı: "Slate Blue"  ·  Kök elemana (:root) ekleyin.
   Production tema sisteminize aktarın.
   ─────────────────────────────────────────────────────────────── */
:root {
  /* ── Yüzeyler (Surfaces) — açık tema ── */
  --bg:            #F2F4F7;   /* sayfa zemini */
  --surface:       #FFFFFF;   /* kart, nav, panel */
  --surface-alt:   #F6F8FB;   /* feature kart zemini */
  --primary-tint:  #EBF0F6;   /* açık mavi zemin (eyebrow, ikon kutusu, hafta çubukları) */

  /* ── Kenarlıklar ── */
  --border:        #DDE3EC;
  --divider:       #E8EDF4;

  /* ── Marka (Slate Blue) ── */
  --primary:       #4A6880;   /* birincil mavi — link hover, vurgu, ikon */
  --primary-deep:  #2E4A60;   /* koyu mavi — buton/gradient ucu, başlık vurgusu */

  /* ── Aksan (logo kalbinden) ── */
  --accent:        #E53935;   /* kırmızı — nokta, pulse, uyarı vurgusu (çok kısıtlı kullan) */
  --brand-sage:    #A7B98C;   /* logo "meal" yeşili — ikincil marka rengi (logo dışında nadiren) */

  /* ── Metin ── */
  --ink:           #18202A;   /* birincil metin */
  --ink-sub:       #4E6070;   /* ikincil metin, gövde */
  --ink-muted:     #8FA0B0;   /* üçüncül / yardımcı, küçük etiket */

  /* ── Koyu tema (Yön B hero + footer) ── */
  --dark-ink:        #18202A; /* footer zemini (= --ink) */
  --on-dark:         #FFFFFF;
  --on-dark-sub:     rgba(255,255,255,0.74);  /* hero lead */
  --on-dark-muted:   rgba(255,255,255,0.55);  /* footer açıklama, stat label */
  --on-dark-hl:      #9FC2DC;  /* koyu zeminde başlık vurgusu + istatistik değeri */
  --on-dark-eyebrow: #BFD6E6;  /* koyu zeminde eyebrow metni */
  /* hero (Yön B) zemin gradyanı: */
  --hero-dark-grad: radial-gradient(120% 120% at 80% 0%, #2E4A60 0%, #1B2A38 55%, #131C26 100%);

  /* ── Tipografi ── */
  --font-sans: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;

  /* ── Köşe yarıçapı (radius) ── */
  --radius:    18px;  /* feature kart (alias) */
  --r-button:  14px;  /* .btn, store-badge */
  --r-card:    18px;  /* feature kart */
  --r-ic:      15px;  /* feature ikon kutusu */
  --r-cta:     32px;  /* CTA bandı */
  --r-pill:    999px; /* eyebrow, sec-tag, pulse */

  /* ── Gölge ── */
  --shadow-sm: 0 1px 3px rgba(24,32,42,0.05), 0 1px 2px rgba(24,32,42,0.04);
  --shadow-md: 0 8px 30px rgba(46,74,96,0.10), 0 2px 8px rgba(46,74,96,0.06);
  --shadow-lg: 0 30px 70px rgba(24,32,42,0.16), 0 10px 24px rgba(24,32,42,0.08);
  --shadow-primary: 0 6px 20px rgba(46,74,96,0.28);  /* primary buton */

  /* ── Layout ── */
  --maxw:      1180px;  /* içerik konteyner genişliği (.wrap) */
  --pad-x:     28px;    /* konteyner yan boşluk (≤560px: 18px) */
  --nav-h:     70px;
  --ease:      cubic-bezier(.22,.61,.36,1);
}