/* eboost.gg — GGirls tipografi ve ikon-buton ölçek sınıfları.

   Bu dosya bizim yazdığımız kaynak: sınıflar, adları ve değerleri burada
   tanımlıdır. Değerler tarayıcıda ölçülerek belirlendi (her kırılımda gerçek
   computed style okundu), yani ekrandaki görünüm birebir korunur.

   Ölçek mantığı:
     label   — arayüz etiketi, orta kalınlık, sıkı satır aralığı
     title   — kart ve bölüm başlığı, yarı kalın
     body    — akıcı metin, normal kalınlık, ferah satır
     headline— sayfa üstü büyük başlık
     num     — rakam yüzü (fiyat, sayaç)

   Kırılımlar: 1024px'te başlık ve headline büyür, 1280px'te en büyük başlık
   bir kademe daha açılır. Mobil değerler taban kabul edilir (mobile-first).

   Kural sırası görünüm sözleşmesidir; sıra değiştirilerek düzenleme yapılmaz. */

:root {
  --eb-font-ui: Parkinsans, system-ui, sans-serif;
  --eb-font-num: "Jetbrains Mono", ui-monospace, monospace;
}

/* ---- label: arayüz etiketleri ------------------------------------------- */
.eb-label-sm { font-family: var(--eb-font-ui); font-weight: 500; font-size: 12px; line-height: 16px; }
.eb-label-md { font-family: var(--eb-font-ui); font-weight: 500; font-size: 14px; line-height: 16px; }
.eb-label-lg { font-family: var(--eb-font-ui); font-weight: 500; font-size: 16px; line-height: 20px; }

/* ---- title: kart ve bölüm başlıkları ------------------------------------ */
.eb-title-sm { font-family: var(--eb-font-ui); font-weight: 600; font-size: 16px; line-height: 20px; }
.eb-title-md { font-family: var(--eb-font-ui); font-weight: 600; font-size: 18px; line-height: 24px; }
.eb-title-lg { font-family: var(--eb-font-ui); font-weight: 600; font-size: 20px; line-height: 28px; }

/* ---- body: akıcı metin --------------------------------------------------- */
.eb-body-sm { font-family: var(--eb-font-ui); font-weight: 400; font-size: 12px; line-height: 20px; }
.eb-body-md { font-family: var(--eb-font-ui); font-weight: 400; font-size: 14px; line-height: 20px; }
.eb-body-lg { font-family: var(--eb-font-ui); font-weight: 400; font-size: 16px; line-height: 24px; }

/* ---- headline: sayfa üstü ------------------------------------------------ */
.eb-headline-md { font-family: var(--eb-font-ui); font-weight: 700; font-size: 24px; line-height: 28px; }
.eb-headline-lg { font-family: var(--eb-font-ui); font-weight: 700; font-size: 48px; line-height: 56px; }

/* ---- num: rakam yüzü ----------------------------------------------------- */
/* xs monospace kalır (sayaçlar hizada dursun); sm arayüz yüzüyle yazılır —
   fiyat satırında rakamlar çevresindeki metinle aynı ailede daha iyi oturuyor. */
.eb-num-xs { font-family: var(--eb-font-num); font-weight: 400; font-size: 12px; line-height: 20px; }
.eb-num-sm { font-family: var(--eb-font-ui); font-weight: 600; font-size: 16px; line-height: 20px; letter-spacing: 0; }

/* ---- ikon buton ölçeği ---------------------------------------------------
   Kutu ölçüsü ile ikon ölçüsü ayrı sınıflar: buton kare, ikon ortada, iç
   boşluk ikisinin farkının yarısı. */
.eb-iconbtn-sm { width: 24px; height: 24px; padding: 6px; }
.eb-iconbtn-md { width: 32px; height: 32px; padding: 8px; }
.eb-iconbtn-lg { width: 48px; height: 48px; padding: 12px; }
.eb-iconbtn-icon-sm { width: 12px; height: 12px; }
.eb-iconbtn-icon-md { width: 16px; height: 16px; }
.eb-iconbtn-icon-lg { width: 24px; height: 24px; }

/* ---- geniş ekranda büyüyen kademeler ------------------------------------- */
@media (min-width: 1024px) {
  .eb-title-md { font-size: 20px; line-height: 24px; }
  .eb-headline-md { font-size: 36px; line-height: 40px; }
}
@media (min-width: 1280px) {
  .eb-title-lg { font-size: 24px; line-height: 28px; }
}