/* tokens.css - TEK kaynak tasarim token'lari (docs/design-principles.md).
   Hardcoded renk/spacing/radius/golge/motion YASAK; her sey buradan gelir. */
:root {
  /* 60% - notr zemin */
  --c-bg:         #FBFAF7;   /* sicak kirik beyaz */
  --c-bg-alt:     #F2EFE9;   /* bolum ayrimi ikincil yuzey */

  /* 30% - metin / yuzey / yapi */
  --c-ink:        #1A1A17;   /* near-black, sicak */
  --c-ink-soft:   #55524B;   /* ikincil metin / label */
  --c-surface:    #FFFFFF;   /* kart yuzeyi */
  --c-border:     #E3DFD6;   /* hairline */

  /* 10% - TEK accent (sadece CTA + kilit vurgu) */
  --c-accent:     #C7522A;   /* terracotta */
  --c-accent-ink: #FFFFFF;   /* accent uzerine metin */
  --c-accent-deep:#9E3F1F;   /* hover / aktif */
  --c-success:    #2E6F4E;   /* durum: temiz / kesintisiz */

  /* tipografi aileleri (self-hosted, bkz css/fonts.css) */
  --ff-display: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --ff-sans:    'IBM Plex Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;

  /* type scale (major third); buyuk basamaklarda akiskan clamp ile mobil tasma yok */
  --fs-xs:      0.8rem;
  --fs-sm:      0.9rem;
  --fs-base:    1rem;
  --fs-md:      1.25rem;
  --fs-lg:      clamp(1.35rem, 1rem + 1.4vw, 1.6rem);
  --fs-xl:      clamp(1.8rem, 1.2rem + 2.6vw, 2.25rem);
  --fs-2xl:     clamp(2.1rem, 1.2rem + 4vw, 3.25rem);
  --fs-display: clamp(2.6rem, 1rem + 7vw, 4.5rem);

  /* agirlik uclari (orta tonlar yok) */
  --fw-light: 300;
  --fw-black: 800;
  --fw-body:  400;
  --fw-medium:500;
  --fw-semi:  600;

  /* spacing - 8px tabanli tek olcek */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px; --sp-6: 24px;
  --sp-8: 32px; --sp-12: 48px; --sp-16: 64px; --sp-24: 96px; --sp-32: 128px;

  /* radius - sistem geneli tek deger */
  --radius: 10px;
  --radius-pill: 999px;

  /* golge - subtle katmanli cift */
  --shadow-sm: 0 1px 2px rgba(26,26,23,.06), 0 1px 1px rgba(26,26,23,.04);
  --shadow-md: 0 4px 12px rgba(26,26,23,.08), 0 2px 4px rgba(26,26,23,.05);

  /* motion */
  --ease:     cubic-bezier(.2,.7,.3,1);
  --dur-fast: 160ms;
  --dur-slow: 420ms;

  /* layout */
  --container: 1180px;
  --gutter: var(--sp-6);
  --section-pad: var(--sp-32);
  --hairline: 1px solid var(--c-border);

  /* odak */
  --focus-ring: 2px solid var(--c-accent);
}

@media (max-width: 768px) {
  :root { --section-pad: var(--sp-16); }
}

/* ek token'lar (dostane-isitma) */
:root {
  --radius-lg: 18px;   /* illustrasyon kutusu / buyuk kart */
  --dur-med: 260ms;
  --page-top: var(--sp-16);   /* tum sayfalarda ilk bolum ust bosluk (tutarli baslangic) */
  /* hero arkasi ince atmosferik dalga */
  --wave-1: var(--c-accent);
  --wave-2: var(--c-ink-soft);
  --wave-opacity: 0.07;
  --dur-wave: 22s;
  --c-band: #1A1A17;       /* koyu kontrast bant (her iki temada koyu kalir) */
  --c-band-ink: #F4F1EA;   /* bant uzerine metin */
}

/* ============ DARK MODE ============ */
/* sicak koyu palet; accent korunur (dark'ta biraz parlatilir, AA icin) */
[data-theme="dark"] {
  --c-bg:         #16140F;
  --c-bg-alt:     #201D16;
  --c-ink:        #F4F1EA;
  --c-ink-soft:   #B3AD9E;
  --c-surface:    #211E17;
  --c-border:     #3A3528;
  --c-accent:     #D55E33;
  --c-accent-ink: #1B1206;
  --c-accent-deep:#E8794F;
  --c-success:    #4CA87B;
  --shadow-sm: 0 1px 2px rgba(0,0,0,.5), 0 1px 1px rgba(0,0,0,.4);
  --shadow-md: 0 6px 16px rgba(0,0,0,.55), 0 2px 6px rgba(0,0,0,.4);
}

/* JS yoksa, sistem koyu ise koyu uygula (data-theme acikca set degilse) */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]):not([data-theme="dark"]) {
    --c-bg:         #16140F;
    --c-bg-alt:     #201D16;
    --c-ink:        #F4F1EA;
    --c-ink-soft:   #B3AD9E;
    --c-surface:    #211E17;
    --c-border:     #3A3528;
    --c-accent:     #D55E33;
    --c-accent-ink: #1B1206;
    --c-accent-deep:#E8794F;
    --c-success:    #4CA87B;
    --shadow-sm: 0 1px 2px rgba(0,0,0,.5), 0 1px 1px rgba(0,0,0,.4);
    --shadow-md: 0 6px 16px rgba(0,0,0,.55), 0 2px 6px rgba(0,0,0,.4);
  }
}