/* ============================================================
   TASARIM DEĞERLERİ (design tokens)
   Sitenin tüm renk, tipografi ve boşluk değerleri burada.
   Bir şeyi her yerde değiştirmek için sadece bu dosyayı düzenleyin.
   ============================================================ */

:root {
  /* Site yalnızca açık temada çalışır; sistem koyu modda olsa da
     zemin siyaha dönmez, form elemanları da açık kalır. */
  color-scheme: light;

  /* --- Renk: sıcak beyaz zemin, koyu gri metin -------------- */
  --bg:          #FAF8F4;  /* sıcak kırık beyaz */
  --text:        #2A2A28;  /* koyu gri — saf siyah değil */
  --text-muted:  #66645E;  /* künye, kategori — 5.6:1, AA */
  --rule:        #E4E1DA;  /* ince ayraç çizgileri */
  --surface:     #F1EEE8;  /* video / görsel yüklenirken zemin */
  --focus:       #2A2A28;  /* klavye odak halkası */

  /* Vurgu: logonun kendi laciverti (orijinal LOGO.png, #404770).
     Yalnızca kimlik, menü düğmesi, aktif durum ve hover için. */
  --accent:      #404770;  /* zemin üzerinde 8.4:1 */
  --accent-deep: #2F3558;
  /* Üst menü şeridi (logo, İşler, Hakkımda, CV, İletişim) */
  --header-bg:   #FFFFFF;
  --on-accent:   #FFFFFF;

  /* --- Tipografi ------------------------------------------- */
  --font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

  --size-hero:    clamp(1.75rem, 1.3rem + 1.6vw, 2.625rem);   /* 28 → 42px */
  --size-display: clamp(1.375rem, 1.15rem + 1vw, 1.875rem);   /* 22 → 30px */
  --size-lead:    clamp(1.125rem, 1.05rem + 0.4vw, 1.3125rem); /* 18 → 21px */
  --size-title:   clamp(1.0625rem, 1rem + 0.3vw, 1.25rem);    /* 17 → 20px */
  --size-body:    1.0625rem;                                  /* 17px */
  --size-small:   0.9375rem;                                  /* 15px */
  --size-label:   0.8125rem;                                  /* 13px */

  --leading-tight: 1.15;
  --leading-snug:  1.35;
  --leading-body:  1.6;

  --track-tight:  -0.02em;
  --track-label:   0.04em;

  /* --- Boşluk: 8px taban birimi ---------------------------- */
  --s-1:   0.5rem;   /*   8px */
  --s-2:   1rem;     /*  16px */
  --s-3:   1.5rem;   /*  24px */
  --s-4:   2rem;     /*  32px */
  --s-5:   3rem;     /*  48px */
  --s-6:   4rem;     /*  64px */
  --s-7:   6rem;     /*  96px */

  /* Farklı konular arası: mobil 44px → masaüstü 88px */
  --section-gap: clamp(2.75rem, 1.9rem + 3.4vw, 5.5rem);
  /* Aynı konu içinde metin → görsel: 24 → 36px */
  --block-gap:   clamp(1.5rem, 1.2rem + 1vw, 2.25rem);

  /* --- Ölçü ------------------------------------------------ */
  --measure:   66ch;   /* okunabilir metin genişliği */
  --container: 80rem;  /* 1280px */
  --gutter:    clamp(1rem, 0.5rem + 2vw, 1.5rem);

  /* --- Hareket --------------------------------------------- */
  --ease:            cubic-bezier(0.22, 1, 0.36, 1);
  --dur-reveal:      600ms;
  --dur-rise:        550ms;
  --dur-hover:       500ms;
}
