:root {
  /* ─ Marka renkleri ─────────────────────────────── */
  --color-navy:        #0A0F2E;
  --color-navy-light:  #131A45;
  --color-navy-dark:   #031027;
  --color-navy-2:      #131A45;

  --color-gold:        #F5C518;
  --color-gold-dark:   #D4A800;

  --color-primary:     #F5C518;
  --color-primary-dark:#D4A800;
  --color-primary-soft:rgba(245, 197, 24, 0.14);

  /* ─ Sayfa arka planı — ılık krem/ivory ─────────── */
  --color-white:       #FFFFFF;
  --color-bg:          #F8F6F1;      /* ılık krem — body bg      */
  --color-bg-card:     #FFFFFF;      /* kart yüzeyi             */
  --color-bg-alt:      #F3F0EA;      /* hafif koyu krem —section */
  --color-border:      rgba(10,15,46,0.10);
  --color-border-soft: rgba(10,15,46,0.06);

  /* ─ Footer ──────────────────────────────────────── */
  --color-footer-bg:   #031027;

  /* ─ Nötr ────────────────────────────────────────── */
  --color-neutral-900: #0A0F2E;      /* navy = metin rengi       */
  --color-neutral-700: #374151;
  --color-neutral-500: #6B7280;
  --color-neutral-400: #9CA3AF;
  --color-neutral-200: #E5E7EB;
  --color-neutral-100: #F9FAFB;

  /* ─ Altın metin (light bg üstünde) ──────────────── */
  --color-gold-text:   #996F00;      /* WCAG AA: #996F00 on white */

  /* ─ Tipografi ───────────────────────────────────── */
  --font-display: "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  --font-body:    "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;

  /* ─ Layout ──────────────────────────────────────── */
  --container:    1180px;
  --header-height:128px;

  /* ─ Radius ──────────────────────────────────────── */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 18px;

  /* ─ Shadows ─────────────────────────────────────── */
  --shadow-card:   0 1px 4px rgba(10,15,46,0.06), 0 4px 12px rgba(10,15,46,0.04);
  --shadow-md:     0 4px 20px rgba(10,15,46,0.08);
  --shadow-lg:     0 12px 40px rgba(10,15,46,0.12);
  --shadow-gold:   0 6px 24px rgba(245,197,24,0.22);
}

@media (max-width: 991.98px) {
  :root { --header-height: 110px; }
}
@media (max-width: 575.98px) {
  :root { --header-height: 96px; }
}
@media (max-width: 374.98px) {
  :root { --header-height: 88px; }
}

/* Expanded heights when categories bar is present */
body.has-cat-bar {
  --header-height: 172px;
}
@media (max-width: 991.98px) {
  body.has-cat-bar { --header-height: 154px; }
}
@media (max-width: 575.98px) {
  body.has-cat-bar { --header-height: 140px; }
}
@media (max-width: 374.98px) {
  body.has-cat-bar { --header-height: 132px; }
}