/* ============================================================
   Kuvars Chem KZ — tasarım belirteçleri (design tokens)
   Kapsam: www.kuvarschem.kz sitesi, ürün kataloğu, şirket profili
   (üçü aynı sistemi paylaşır; katalog/profil HTML → PDF).
   Kaynak: notlar/tasarim-sistemi.md · Brand Positioning §14 ·
   Marketing Context §9. Değerler sözlük v2 ile bağlayıcı.
   Sürüm: v2 — 15 Eylül 2026 (Manrope/Caveat, tema değişkenleri)
   ============================================================ */

/* ---------- 1. Yazı tipi: kendi sunucuda ----------
   Manrope (site gövdesi, değişken ağırlık 500–800), Caveat 700 (el yazısı
   açıklamalar) ve Inter (yedek; katalog/profil) — hepsi site/fonts/,
   Latin + Kiril + Kiril-ext alt kümeleri. Dış kaynak (Google Fonts) yok.
   Manrope + Caveat 15 Eylül 2026'da indirildi (v20 / v23). */
@font-face {
  font-family: "Manrope";
  font-style: normal;
  font-weight: 500 800;
  font-display: swap;
  src: url("fonts/manrope-cyrillic-ext.woff2") format("woff2");
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: "Manrope";
  font-style: normal;
  font-weight: 500 800;
  font-display: swap;
  src: url("fonts/manrope-cyrillic.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Manrope";
  font-style: normal;
  font-weight: 500 800;
  font-display: swap;
  src: url("fonts/manrope-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Caveat";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/caveat-cyrillic-ext.woff2") format("woff2");
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: "Caveat";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/caveat-cyrillic.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Caveat";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/caveat-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("fonts/inter-cyrillic-ext.woff2") format("woff2");
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("fonts/inter-cyrillic.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("fonts/inter-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  /* ---------- 2. Renk: marka (bağlayıcı) ---------- */
  --kc-navy:        #1B3A6B;   /* Kuvars Navy — ana renk */
  --kc-orange:      #E8751A;   /* Kuvars Orange — vurgu */
  --kc-ink:         #333333;   /* gövde metni (TDS/katalog ile aynı) */
  --kc-mist:        #F2F2F2;   /* açık gri zemin */

  /* ---------- 2b. Renk: türetilmiş ---------- */
  --kc-navy-900:    #10264A;   /* hero, alt bilgi, koyu yüzeyler */
  --kc-navy-700:    #16305A;   /* navy düğme hover */
  --kc-navy-100:    #DCE3EF;   /* koyu zemin üzerinde ikincil metin (9,9:1) */
  --kc-navy-50:     #F1F4F9;   /* tonlu kart / vurgulu satır zemini */
  --kc-orange-700:  #C7600F;   /* turuncu hover (yalnızca çizgi/ikon) */
  --kc-orange-800:  #AD520C;   /* küçük turuncu metin: beyazda 5,3:1, siste 4,9:1 (15 Eylül 2026) */
  --kc-orange-100:  #FBE7D6;   /* turuncu tonlu zemin (etiket, sezon şeridi) */
  --kc-steel:       #5B6474;   /* ikincil metin — beyazda 6,0:1, siste 5,3:1 */
  --kc-white:       #FFFFFF;
  --kc-error:       #B3261E;   /* form hatası — beyazda 6,6:1 */
  --kc-success:     #1E6B3A;   /* form başarı */

  /* Kenarlıklar: gri değil, navy'nin saydamı */
  --kc-line:        rgba(27, 58, 107, 0.16);
  --kc-line-strong: rgba(27, 58, 107, 0.40);
  --kc-line-on-dark: rgba(255, 255, 255, 0.18);

  /* ---------- 2d. Tema «Чертёж» (varyant 6, 15 Eylül 2026) ----------
     Koyu hero/üst bilgi/alt bilgi zemini, açık gövde. */
  --d0:    #0B1B36;                 /* en koyu zemin: üst bilgi, hero, alt bilgi */
  --d1:    #10264A;                 /* koyu bölüm zemini (= navy-900) */
  --d2:    #16305A;                 /* koyu düğme hover (= navy-700) */
  --line:  rgba(255, 255, 255, 0.14); /* koyu zeminde çizgi */
  --ink:   #14213D;                 /* başlık rengi (açık gövde) */
  --paper: #F4F6FA;                 /* tonlu bölüm zemini */

  /* ---------- 2c. Anlamsal roller ---------- */
  --color-bg:              var(--kc-white);
  --color-bg-alt:          var(--kc-mist);
  --color-bg-tint:         var(--kc-navy-50);
  --color-bg-dark:         var(--kc-navy-900);
  --color-text:            var(--kc-ink);
  --color-text-muted:      var(--kc-steel);
  --color-heading:         var(--kc-navy);
  --color-text-on-dark:    var(--kc-white);
  --color-text-on-dark-muted: var(--kc-navy-100);
  --color-primary:         var(--kc-navy);
  --color-primary-hover:   var(--kc-navy-700);
  --color-on-primary:      var(--kc-white);
  --color-accent:          var(--kc-orange);
  --color-accent-hover:    var(--kc-orange-700);
  --color-link:            var(--kc-navy);
  --color-border:          var(--kc-line);
  --color-border-strong:   var(--kc-line-strong);
  --color-focus:           var(--kc-orange);

  /* ---------- 3. Tipografi ----------
     Sitede Manrope (Inter yedek); el yazısı açıklamalar Caveat.
     Ölçek 1,25 (majör üçlü), taban 16 px. */
  --font-sans: "Manrope", "Inter", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-hand: "Caveat", "Segoe Print", cursive;

  --text-xs:   0.8125rem;  /* 13 — alt bilgi, tablo notu */
  --text-sm:   0.875rem;   /* 14 — etiket, kırıntı */
  --text-base: 1rem;       /* 16 — gövde */
  --text-md:   1.125rem;   /* 18 — giriş paragrafı (lead) */
  --text-lg:   1.25rem;    /* 20 — h4, kart başlığı */
  --text-xl:   1.5625rem;  /* 25 — h3 */
  --text-2xl:  1.953rem;   /* 31 — h2 */
  --text-3xl:  2.441rem;   /* 39 — h1 iç sayfa */
  --text-4xl:  3.052rem;   /* 49 — h1 ana sayfa hero (masaüstü) */
  --text-num:  2.441rem;   /* sayı şeridi rakamları */

  --leading-tight:  1.15;  /* h1–h2 */
  --leading-snug:   1.3;   /* h3–h4 */
  --leading-body:   1.6;   /* gövde; Rusça sözcükler uzun, 1,5 yerine 1,6 */
  --leading-loose:  1.7;   /* uzun teknik paragraf */

  --tracking-display: -0.02em;  /* ≥31 px başlıklar */
  --tracking-heading: -0.01em;  /* 20–25 px başlıklar */
  --tracking-body:     0;

  --weight-regular: 400;
  --weight-medium:  500;
  --weight-semibold: 600;
  --weight-bold:    700;   /* yalnızca sayı şeridi ve hero h1 */

  --measure: 68ch;         /* satır uzunluğu üst sınırı */

  /* ---------- 4. Boşluk (4 px tabanlı) ---------- */
  --space-1:  0.25rem;   /* 4 */
  --space-2:  0.5rem;    /* 8 */
  --space-3:  0.75rem;   /* 12 */
  --space-4:  1rem;      /* 16 */
  --space-5:  1.5rem;    /* 24 */
  --space-6:  2rem;      /* 32 */
  --space-7:  3rem;      /* 48 */
  --space-8:  4rem;      /* 64 */
  --space-9:  6rem;      /* 96 */
  --space-10: 8rem;      /* 128 */

  --section-y: var(--space-8);        /* mobil bölüm dikey boşluğu */
  --gutter:    var(--space-5);        /* mobil kenar boşluğu 24 */
  --container: 75rem;                 /* 1200 px içerik genişliği */
  --container-narrow: 48rem;          /* 768 px — uzun metin sütunu */
  --header-h:  5rem;                  /* 80 px */

  /* ---------- 5. Biçim ---------- */
  --radius:     0.25rem;   /* tek yarıçap: düğme, kart, görsel, alan */
  --radius-none: 0;
  --border-w:   1px;
  --rule-w:     3px;       /* turuncu işaret çizgisi (bölüm başı, aktif menü) */

  /* Gölge: yalnızca sabit üst bilgi ve açılır menü; kartlarda yok */
  --shadow-header: 0 1px 0 var(--kc-line);
  --shadow-float:  0 1px 2px rgba(27, 58, 107, 0.06), 0 12px 32px rgba(27, 58, 107, 0.10);

  /* ---------- 6. Hareket ---------- */
  --ease-out:   cubic-bezier(0.2, 0, 0, 1);     /* varış: hover, açılma */
  --ease-in:    cubic-bezier(0.4, 0, 1, 1);     /* ayrılış: kapanma */
  --dur-fast:   150ms;   /* renk, kenarlık */
  --dur-base:   220ms;   /* menü açılma, alt çizgi */
  --dur-slow:   320ms;   /* mobil menü */

  /* ---------- 7. Katman ---------- */
  --z-base:    0;
  --z-raised:  10;   /* kart hover, yapışkan tablo başlığı */
  --z-header:  100;
  --z-menu:    200;  /* mobil menü katmanı */
  --z-modal:   300;

  /* ---------- 8. İkon ---------- */
  --icon-sm: 1rem;      /* 16 — satır içi */
  --icon-md: 1.5rem;    /* 24 — kart, liste */
  --icon-lg: 2rem;      /* 32 — sütun başlığı */
  --icon-stroke: 1.5;   /* tek kalınlık, tek set */
}

/* ---------- 9. Kesme noktaları ----------
   Mobil öncelikli. 48em = 768 · 64em = 1024 · 80em = 1280
   (medya sorguları değişken alamaz; değerler burada belgelenir,
   base.css'te yazılır.) */
@media (min-width: 48em) {
  :root {
    --section-y: var(--space-9);   /* 96 */
    --gutter:    var(--space-6);   /* 32 */
  }
}
@media (min-width: 64em) {
  :root {
    --gutter: var(--space-7);      /* 48 */
  }
}

/* ---------- 10. Azaltılmış hareket ---------- */
@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-fast: 0ms;
    --dur-base: 0ms;
    --dur-slow: 0ms;
  }
}