/* =========================================================
   Gurman Ćaka - Design tokens
   ========================================================= */

:root {
  /* Breakpoints (u px) - koriste se u responsive.css */
  --bp-sm: 480px;
  --bp-md: 768px;
  --bp-lg: 1024px;
  --bp-xl: 1280px;

  /* Boje - svetla paleta */
  --ivory: #f6f1e8;
  --ivory-deep: #eee7d9;
  --ivory-soft: #fbf8f2;
  --white: #ffffff;

  /* Boje - tamna paleta */
  --ink: #1e1b16;
  --ink-2: #28241d;
  --ink-3: #332e26;

  /* Tekst */
  --text: #322e27;
  --text-soft: #4d483f;
  --muted: #6f695e;
  --muted-on-dark: #b3ab9d;

  /* Akcenti */
  --accent: #9a6b3d;
  --accent-deep: #7e562f;
  --accent-soft: #b98a55;
  --brass: #b18a55;

  /* Linije */
  --line: rgba(30, 27, 22, 0.12);
  --line-soft: rgba(30, 27, 22, 0.08);
  --line-dark: rgba(255, 255, 255, 0.16);
  --line-dark-soft: rgba(255, 255, 255, 0.09);

  /* Statusi */
  --success: #3c7a4e;
  --danger: #b0473a;

  /* Tipografija */
  --font-display: "Lora", "Georgia", "Times New Roman", serif;
  --font-body: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;

  --text-2xs: 0.6875rem;
  --text-xs: 0.75rem;
  --text-sm: 0.8125rem;
  --text-base: 0.9375rem;
  --text-md: 1.0625rem;
  --text-lg: 1.25rem;

  --h1: clamp(2.35rem, 6vw, 4.4rem);
  --h2: clamp(1.9rem, 4.2vw, 3.15rem);
  --h3: clamp(1.35rem, 2.6vw, 1.85rem);
  --h4: 1.15rem;

  --lh-tight: 1.12;
  --lh-body: 1.65;
  --lh-heading: 1.25;

  /* Prostor */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2rem;
  --sp-7: 3rem;
  --sp-8: 4rem;
  --sp-9: 5rem;
  --sp-10: 6.5rem;

  /* Sekcije */
  --section-pad: clamp(3.5rem, 8vw, 6.5rem);

  /* Radiusi */
  --r-sm: 6px;
  --r: 12px;
  --r-lg: 18px;
  --r-pill: 999px;

  /* Senke */
  --shadow-sm: 0 1px 3px rgba(30, 27, 22, 0.08);
  --shadow: 0 8px 28px rgba(30, 27, 22, 0.1);
  --shadow-lg: 0 24px 60px rgba(30, 27, 22, 0.16);

  /* Kontejner */
  --container: 1200px;
  --gutter: clamp(1.25rem, 4vw, 2rem);

  /* Header */
  --header-h: 76px;
  --header-h-mobile: 64px;

  /* Transition */
  --t-fast: 160ms ease;
  --t: 280ms cubic-bezier(0.22, 0.61, 0.36, 1);
  --t-slow: 500ms cubic-bezier(0.22, 0.61, 0.36, 1);

  /* Mobile bar */
  --mobile-bar-h: 62px;
}