/*
 * Bousra Coffee brand tokens - single source of truth.
 * Consumed by the Digital Farm Control Room (src/index.css) and the project
 * landing page (landing/). The landing page uses a synced copy; run
 * `npm run brand:sync` after editing this file.
 *
 * One brand system, two expressions:
 *   - Brand / project website  -> coffee brown + cream + sand (editorial)
 *   - Digital Farm Control Room -> navy + cream + forest (institutional)
 */
:root {
  /* Core brand colors */
  --brand-coffee: #4e342e;
  --brand-roasted: #6d4c41;
  --brand-sand: #d7c4a3;
  --brand-forest: #1f5d42;
  --brand-navy: #183b5b;
  --brand-cream: #f8f5ee;
  --brand-charcoal: #263238;

  /* Derived neutrals (warm) */
  --brand-surface: #fffdf8;
  --brand-surface-alt: #f1ece1;
  --brand-border: #e0d8c8;
  --brand-muted: #665d55;
  --brand-navy-deep: #10283d;
  --brand-forest-deep: #164732;
  --brand-forest-tint: #e8efe7;
  --brand-navy-tint: #e6edf3;
  --brand-sand-tint: #f3ecdb;
  --brand-sand-ink: #6f5418;

  /* Status (restrained) */
  --brand-status-recorded: #3b6a53;
  --brand-status-illustrative: #4d6b88;
  --brand-status-exception: #a1432b;
  --brand-status-exception-tint: #f6e8e2;
  --brand-status-illustrative-tint: #e9eff5;

  /* Typography */
  --font-display: "Playfair Display Variable", "Playfair Display", Georgia, "Times New Roman", serif;
  --font-ui: "Inter Variable", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  /* Type scale */
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.375rem;
  --text-2xl: 1.75rem;
  --text-hero: clamp(2.125rem, 6vw, 3.75rem);

  /* Spacing */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-12: 3rem;
  --space-16: 4rem;

  /* Shape, elevation, motion */
  --radius-sm: 2px;
  --radius-md: 4px;
  --shadow-panel: 0 1px 0 rgba(78, 52, 46, 0.04);
  --shadow-overlay: 0 12px 32px rgba(16, 40, 61, 0.22);
  --transition-fast: 120ms ease;
  --focus-ring: 0 0 0 3px rgba(31, 93, 66, 0.55);
}