/* ============================================================
 * BANNA Design Tokens (v2) — Inter + Be Vietnam Pro system
 * ============================================================ */
:root {
  /* === Colors === */
  --banna-black:      #0A0A0A;
  --banna-bone:       #FAFAF7;
  --banna-navy:       #102A4C;
  --banna-navy-light: #AACCEE;
  --banna-gold:       #D4924B;
  --banna-border:     #E5E2DA;
  --banna-bg-soft:    #F5F1E9;
  --banna-text-secondary: #444;
  --banna-text-muted: #888;

  /* === Typography === */
  --banna-font-ui:      'Inter', 'Be Vietnam Pro', system-ui, sans-serif;
  --banna-font-body:    'Be Vietnam Pro', 'Inter', system-ui, sans-serif;
  --banna-font-display: 'Fredoka', 'Inter', sans-serif;

  /* === Type scale (refined for Inter metrics) === */
  --banna-size-xs:  0.8125rem;
  --banna-size-sm:  0.9375rem;
  --banna-size-base: 1rem;
  --banna-size-md:  1.125rem;
  --banna-size-lg:  1.25rem;
  --banna-size-xl:  1.5rem;
  --banna-size-2xl: 1.875rem;
  --banna-size-3xl: 2.25rem;
  --banna-size-4xl: 3rem;
  --banna-size-5xl: 3.75rem;

  /* === Spacing (4px base) === */
  --banna-space-1: 0.25rem; --banna-space-2: 0.5rem;
  --banna-space-3: 0.75rem; --banna-space-4: 1rem;
  --banna-space-6: 1.5rem; --banna-space-8: 2rem;
  --banna-space-12: 3rem; --banna-space-16: 4rem;

  /* === Radius === */
  --banna-radius-sm: 4px; --banna-radius-md: 6px;
  --banna-radius-lg: 8px; --banna-radius-xl: 12px;

  /* === Shadow === */
  --banna-shadow-sm: 0 1px 2px rgba(10,10,10,.05);
  --banna-shadow-md: 0 4px 12px rgba(10,10,10,.08);
  --banna-shadow-lg: 0 12px 32px rgba(10,10,10,.12);
}