/* ─────────────────────────────────────────────────────────────
   BARKR Design Tokens
   All CSS custom properties live here. Import this first.
───────────────────────────────────────────────────────────── */

:root {

  /* ── Brand Colors ── */
  --c-primary:      #F26B38;
  --c-primary-lt:   #FF8C5A;
  --c-primary-dk:   #D4521F;
  --c-primary-bg:   rgba(242, 107, 56, 0.09);
  --c-primary-ring: rgba(242, 107, 56, 0.35);

  /* ── Backgrounds ── */
  --c-bg:           #FDF6EE;
  --c-bg-alt:       #F5EAD9;
  --c-surface:      #FFFFFF;
  --c-surface-2:    #FDF9F5;

  /* ── Text ── */
  --c-text:         #1E1B18;
  --c-text-2:       #3D3830;
  --c-text-3:       #9C9080;
  --c-text-4:       #C4B8A8;

  /* ── Utility ── */
  --c-border:       rgba(30, 27, 24, 0.10);
  --c-border-2:     rgba(30, 27, 24, 0.06);
  --c-error:        #D94F4F;
  --c-error-bg:     rgba(217, 79, 79, 0.08);
  --c-success:      #4F9E6B;
  --c-success-bg:   rgba(79, 158, 107, 0.10);
  --c-white:        #FFFFFF;

  /* ── Typography ── */
  --font-display:   'Playfair Display', Georgia, serif;
  --font-body:      'DM Sans', system-ui, -apple-system, sans-serif;

  /* ── Spacing (4px base grid) ── */
  --s-1:   4px;
  --s-2:   8px;
  --s-3:   12px;
  --s-4:   16px;
  --s-5:   20px;
  --s-6:   24px;
  --s-8:   32px;
  --s-10:  40px;
  --s-12:  48px;
  --s-16:  64px;

  /* ── Border Radius ── */
  --r-sm:   8px;
  --r-md:   14px;
  --r-lg:   20px;
  --r-xl:   28px;
  --r-2xl:  40px;
  --r-full: 9999px;

  /* ── Shadows ── */
  --shadow-xs: 0 1px 4px  rgba(30, 27, 24, 0.05);
  --shadow-sm: 0 2px 10px rgba(30, 27, 24, 0.07);
  --shadow-md: 0 6px 24px rgba(30, 27, 24, 0.10);
  --shadow-lg: 0 16px 52px rgba(30, 27, 24, 0.14);

  /* ── Layout ── */
  --nav-top-h:   60px;
  --nav-bot-h:   72px;
  --max-card:    420px;   /* mobile card / form max-width */
  --max-content: 540px;   /* general page content */
  --max-wide:    1100px;  /* wide desktop layout */

  /* ── Motion ── */
  --ease-out:    cubic-bezier(0.22, 1, 0.36, 1);
  --ease-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --t-fast:      0.14s;
  --t-base:      0.22s;
  --t-slow:      0.38s;

}