/* ============================================================
   BVS Voice — Design Tokens
   Kaynak: Claude Design "BVS Voice Landing & App" design system
   Palet, tipografi, spacing — SADECE bu değerler kullanılır.
   ============================================================ */

@import url("/styles/fonts.css"); /* yerel fontlar — WTK01.10.03, D1728 */

:root {
  /* ---- Base palette ---- */
  --bvs-blue-grey: #8A96A3;
  --bvs-beige: #D9C89E;
  --bvs-beige-deep: #C9B583;
  --bvs-cream: #F8FAFC;
  --bvs-slate: #3A4450;
  --bvs-slate-mid: #5C6773;
  --bvs-slate-deep: #343E49;
  --bvs-grey-light: #B9C1CA;
  --bvs-gold-text: #A8905C;
  --bvs-gold-deep: #8A7343;
  --bvs-danger: #9C5F58;
  --bvs-white: #FFFFFF;

  /* ---- Tints & lines (alpha, not new hues) ---- */
  --bvs-border-soft: rgba(138, 150, 163, 0.25);
  --bvs-border-strong: rgba(138, 150, 163, 0.45);
  --bvs-grey-tint: rgba(138, 150, 163, 0.14);
  --bvs-beige-tint: rgba(217, 200, 158, 0.16);
  --bvs-beige-border: rgba(217, 200, 158, 0.55);
  --bvs-cream-60: rgba(248, 250, 252, 0.6);
  --bvs-cream-25: rgba(248, 250, 252, 0.25);

  /* ---- Semantic aliases ---- */
  --surface-page: var(--bvs-cream);
  --surface-card: var(--bvs-white);
  --surface-beige: var(--bvs-beige-tint);
  --surface-dark: var(--bvs-slate);
  --text-heading: var(--bvs-slate);
  --text-body: var(--bvs-slate-mid);
  --text-muted: var(--bvs-blue-grey);
  --text-on-dark: var(--bvs-cream);
  --accent-live: var(--bvs-beige);
  --border-card: var(--bvs-border-soft);
  --border-input: var(--bvs-border-strong);

  /* ---- Type ---- */
  --font-serif: "Lora", Georgia, serif;
  --font-sans: "Nunito Sans", "Segoe UI", sans-serif;
  --leading-tight: 1.12;
  --leading-body: 1.65;

  /* ---- Radii ---- */
  --radius-card: 16px;
  --radius-card-sm: 14px;
  --radius-panel: 18px;
  --radius-pill: 999px;

  /* ---- Shadows (slate-toned, never black) ---- */
  --shadow-panel: 0 24px 60px rgba(58, 68, 80, 0.14);
  --shadow-photo: 0 16px 40px rgba(58, 68, 80, 0.16);

  /* ---- Spacing ---- */
  --space-section: 64px;
  --space-gutter: 56px;
  --space-card: 24px;
  --space-gap: 16px;
}
