/**
 * 05-typography.css
 * GÖREV 9: Tipografi tutarlılık standartları
 * Tüm sayfalara uygulanır.
 */

/* ── Genel body tipografi ─────────────────────────── */
body {
  font-size: var(--body-font-size, 15.5px);
  line-height: var(--body-line-height, 1.7);
  font-family: 'Barlow', -apple-system, sans-serif;
}

/* ── Bebas Neue: Yalnızca başlık ve display elementler */
h1, h2, h3,
.page-title,
.section-title,
.display-text,
.hero-title,
.card-title-lg,
.stat-value,
.logo-title,
.auth-title,
.score-big {
  font-family: 'Bebas Neue', 'Impact', sans-serif;
  letter-spacing: var(--heading-letter-spacing, 0.03em);
  line-height: 1.1;
}

/* ── Barlow Condensed: UI elementler ──────────────── */
h4, h5, h6,
.nav-link,
.btn,
.badge,
.label,
.tab,
.tag,
.fn-tab-label,
.ddrop-item,
.auth-tab,
.top-btn,
.breadcrumb-inner,
.card-label,
.meta-label {
  font-family: 'Barlow Condensed', sans-serif;
}

/* ── Body paragraflar: Barlow Regular ─────────────── */
p,
.body-text,
.card-desc,
.article-body,
.page-content p,
.static-content p {
  font-family: 'Barlow', sans-serif;
  font-size: var(--body-font-size, 15.5px);
  line-height: var(--body-line-height, 1.7);
}

/* ── Statik sayfa içeriği ─────────────────────────── */
.static-content {
  font-size: var(--body-font-size, 15.5px);
  line-height: var(--body-line-height, 1.7);
}

.static-content h1 {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(28px, 5vw, 42px);
  letter-spacing: var(--heading-letter-spacing, 0.03em);
  margin-bottom: 16px;
}

.static-content h2 {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(22px, 3.5vw, 32px);
  letter-spacing: var(--heading-letter-spacing, 0.03em);
  margin-bottom: 12px;
  margin-top: 32px;
}

.static-content h3 {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(18px, 2.5vw, 24px);
  letter-spacing: var(--heading-letter-spacing, 0.03em);
  margin-bottom: 8px;
  margin-top: 24px;
}

.static-content p {
  margin-bottom: 14px;
}

.static-content ul,
.static-content ol {
  padding-left: 22px;
  margin-bottom: 14px;
}

.static-content li {
  margin-bottom: 6px;
  line-height: var(--body-line-height, 1.7);
}

/* ── Responsive font ünlü ─────────────────────────── */
@media (max-width: 768px) {
  body {
    font-size: 15px; /* Küçük ekranda hafif küçültme */
  }
  :root {
    --body-font-size: 15px;
  }
}

@media (max-width: 480px) {
  body {
    font-size: 14.5px;
  }
  :root {
    --body-font-size: 14.5px;
  }
}