/* ==========================================================================
   NOVA BALO & DAVET — Tasarım Belirteçleri (Design Tokens)
   Tema: "Boğaz Modern Lüks" — derin gece mavisi + antik altın + sıcak krem
   Tüm renk/ölçü kararları tek kaynaktan yönetilir.
   ========================================================================== */

:root {
  /* ---------- Renk: temel palet ---------- */
  --c-night:      #0B1A24;   /* en derin gece — hero örtüsü, koyu bölümler */
  --c-deep:       #10262F;   /* birincil koyu yüzey */
  --c-sea:        #1B3D4B;   /* orta deniz mavisi — vurgu, hover */
  --c-sea-soft:   #2A5566;   /* açık deniz — kenarlık, ayraç */

  --c-gold:       #C9A961;   /* antik altın — koyu zeminde vurgu (7.8:1) */
  --c-gold-soft:  #E0C88E;   /* açık altın — koyu zeminde metin (9.4:1) */
  --c-gold-deep:  #7D6226;   /* derin altın — açık zeminde metin (5.3:1) */

  --c-cream:      #F8F5EF;   /* sıcak krem — açık yüzey */
  --c-ivory:      #FDFCF8;   /* kart yüzeyi */
  --c-mist:       #E6EDF0;   /* soluk mavi-gri şerit */

  --c-ink:        #14232B;   /* açık zeminde gövde metni (13.9:1) */
  --c-ink-soft:   #4C5D66;   /* açık zeminde ikincil metin (6.3:1) */

  --c-danger:     #A8322A;   /* hata — krem üzerinde 5.9:1 */
  --c-success:    #2F6B4F;   /* başarı — krem üzerinde 5.4:1 */

  /* ---------- Renk: anlamsal eşlemeler ---------- */
  --bg-page:      var(--c-cream);
  --bg-surface:   var(--c-ivory);
  --bg-dark:      var(--c-deep);
  --bg-band:      var(--c-mist);

  --fg-body:      var(--c-ink);
  --fg-muted:     var(--c-ink-soft);
  --fg-on-dark:   var(--c-cream);
  --fg-on-dark-muted: rgba(248, 245, 239, 0.72);

  --accent:       var(--c-gold);
  --accent-text:  var(--c-gold-deep);

  --line:         rgba(20, 35, 43, 0.14);
  --line-strong:  rgba(20, 35, 43, 0.26);
  --line-on-dark: rgba(224, 200, 142, 0.28);

  /* Kenar boşluğunda kullanılan ince çizgi dokusu (referanstaki çizgili zemin) */
  --texture-stripe: repeating-linear-gradient(
      90deg,
      rgba(27, 61, 75, 0.075) 0px,
      rgba(27, 61, 75, 0.075) 1px,
      transparent 1px,
      transparent 6px);

  /* ---------- Tipografi ---------- */
  --font-display: "Playfair Display", "Times New Roman", Georgia, serif;
  --font-accent:  "Cormorant Garamond", "Playfair Display", Georgia, serif;
  /* Gövde: Jost — geometrik, Futura ruhlu, otel/davetiye diline uygun.
     (Inter/Roboto gibi "varsayılan" yüzlerden bilinçli olarak kaçınıldı;
     Türkçe glif kapsamı Google Fonts alt kümesinden doğrulandı.) */
  --font-body:    "Jost", "Segoe UI", system-ui, -apple-system, sans-serif;

  /* Akışkan tip ölçeği — clamp() ile 375px → 1920px arası sorunsuz ölçekler */
  --fs-hero:      clamp(3.2rem, 13vw, 12rem);
  --fs-display:   clamp(2.1rem, 5.2vw, 4.5rem);
  --fs-h2:        clamp(1.8rem, 3.9vw, 3.1rem);
  --fs-h3:        clamp(1.35rem, 2.3vw, 1.9rem);
  --fs-lead:      clamp(1.06rem, 1.55vw, 1.32rem);
  --fs-body:      1rem;        /* 16px tabanı — iOS otomatik yakınlaştırmayı önler */
  --fs-small:     0.9375rem;   /* 15px */
  --fs-eyebrow:   0.75rem;     /* üst etiket, harf aralığı geniş */

  --lh-tight:     1.08;
  --lh-heading:   1.18;
  --lh-body:      1.68;   /* Türkçe uzun sözcükler için ferah satır aralığı */

  --ls-hero:      -0.02em;
  --ls-display:   -0.012em;
  --ls-eyebrow:   0.22em;
  --ls-button:    0.14em;

  /* ---------- Boşluk ölçeği (4/8pt ritmi) ---------- */
  --space-1:  0.25rem;   /*  4px */
  --space-2:  0.5rem;    /*  8px */
  --space-3:  0.75rem;   /* 12px */
  --space-4:  1rem;      /* 16px */
  --space-5:  1.5rem;    /* 24px */
  --space-6:  2rem;      /* 32px */
  --space-7:  3rem;      /* 48px */
  --space-8:  4rem;      /* 64px */
  --space-9:  6rem;      /* 96px */
  --space-10: 8rem;      /* 128px */

  /* Bölüm içi dikey ritim — küçük ekranda daralır */
  --section-y:   clamp(4rem, 9vw, 8.5rem);
  --gutter:      clamp(1.25rem, 5vw, 5rem);
  --container:   80rem;    /* 1280px */
  --container-wide: 96rem; /* 1536px */
  --measure:     68ch;     /* okunabilir satır uzunluğu */

  /* ---------- Kenar yuvarlaklığı ---------- */
  --r-sm:  2px;
  --r-md:  4px;
  --r-lg:  8px;
  --r-pill: 999px;

  /* ---------- Gölge ölçeği (tutarlı yükseklik) ---------- */
  --sh-1: 0 1px 2px rgba(11, 26, 36, 0.06);
  --sh-2: 0 4px 16px rgba(11, 26, 36, 0.08);
  --sh-3: 0 12px 40px rgba(11, 26, 36, 0.12);
  --sh-4: 0 24px 70px rgba(11, 26, 36, 0.20);

  /* ---------- Katman (z-index) ölçeği ---------- */
  --z-base:     0;
  --z-raised:   10;
  --z-sticky:   40;
  --z-header:   60;
  --z-overlay:  80;
  --z-modal:    100;
  --z-toast:    120;

  /* ---------- Hareket ---------- */
  --dur-fast:   160ms;
  --dur-base:   260ms;
  --dur-slow:   420ms;
  --dur-reveal: 760ms;

  --ease-out:   cubic-bezier(0.22, 1, 0.36, 1);   /* girişler */
  --ease-in:    cubic-bezier(0.64, 0, 0.78, 0);   /* çıkışlar */
  --ease-soft:  cubic-bezier(0.4, 0, 0.2, 1);

  /* --- İmza hareket eğrileri ---------------------------------------------
     Tek bir "ease-out" her yerde kullanıldığında hareket şablon gibi durur.
     Aşağıdaki üç eğri malzemeye ağırlık kazandırır:
     luxe   : güçlü out-expo — hızlı çıkar, uzun ve yumuşak oturur (açılışlar)
     glide  : daha sakin, doğrusala yakın bitiş (opaklık, renk)
     spring : hafif aşma — dokunma/imleç geri bildirimi                     */
  --ease-luxe:   cubic-bezier(0.16, 1, 0.30, 1);
  --ease-glide:  cubic-bezier(0.33, 1, 0.68, 1);
  --ease-spring: cubic-bezier(0.34, 1.4, 0.64, 1);

  --dur-draw:   1.1s;    /* saç teli çizgilerin çizilmesi */
  --dur-crest:  1.7s;    /* arma konturunun çizilmesi */
  --dur-word:   0.95s;   /* maskeden yükselen kelime */

  --stagger-word: 42ms;  /* kelimeler arası gecikme */
  --stagger-card: 105ms; /* kartlar arası gecikme (daha kendinden emin) */
}

/* Geniş ekranda ölçüyü biraz ferahlat */
@media (min-width: 1440px) {
  :root {
    --section-y: clamp(6rem, 8vw, 10rem);
  }
}