/* ============================================================
   Synontech Brand Identity System
   Minimalist, professional, product-focused.
   ============================================================ */

:root {
  /* --- Primary Colors --- */
  --color-deep-navy: #0F172A;
  --color-charcoal: #111827;

  /* --- Secondary Colors --- */
  --color-blue: #2563EB;
  --color-emerald: #10B981;

  /* --- Neutral Colors --- */
  --color-white: #FFFFFF;
  --color-light-gray: #F8FAFC;
  --color-border-gray: #E5E7EB;
  --color-text-gray: #64748B;

  /* --- Functional Assignments (Light Theme) --- */
  --bg-main: var(--color-light-gray);
  --bg-card: var(--color-white);
  --text-main: var(--color-charcoal);
  --text-dim: var(--color-text-gray);

  --primary: var(--color-blue);
  --accent: var(--color-emerald);

  /* --- UI Elements --- */
  --border-main: 1px solid var(--color-border-gray);
  --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --radius-md: 8px;
  --radius-lg: 12px;

  /* --- Typography --- */
  --font-primary: 'Inter', sans-serif;
}