/*
 * Treaptă — design tokens for PAS CU PAS PRO.
 * One calm ground, deep ink for text and navigation, emerald for actions,
 * and a single lime accent used sparingly for "you are here" moments.
 */
:root {
  /* Ground and surfaces */
  --paper: #F5F6F2;
  --surface: #FFFFFF;
  --surface-2: #F0F2EC;
  --line: #E3E6DE;
  --line-strong: #CDD2C6;

  /* Text */
  --ink: #10201B;
  --ink-2: #3E4C47;
  --muted: #5B6863;

  /* Brand */
  --primary: #0E6B57;
  --primary-hover: #0A5747;
  --primary-soft: #E3F1EC;
  --primary-ink: #0A5747;
  --accent: #D9F26B;
  --mint: #A9D3C5;
  --sage: #6FA898;

  /* Roles derived from the palette; themes override these too. */
  --on-primary: #FFFFFF;
  --dark: var(--ink);            /* dark surfaces: active nav, hero, portfolio card */
  --dark-hover: #1F342E;
  --on-dark: #FFFFFF;
  --on-dark-muted: #C9D6D1;
  --on-dark-faint: #A9BDB6;
  --on-accent: #10201B;
  --accent-hover: #CBE85A;
  --accent-edge: #B9D24A;
  --danger-line: #F2C4BF;
  --placeholder: #8A958F;
  --surface-tint: #FAFBF8;
  --backdrop: rgba(16, 32, 27, 0.45);
  --topbar-bg: rgba(245, 246, 242, 0.86);
  --glass: rgba(255, 255, 255, 0.95);
  --pipe-1: #8FB8E8;

  /* Sidebar */
  --sidebar-bg: var(--surface);
  --sidebar-line: var(--line);
  --nav-fg: var(--ink-2);
  --nav-hover-bg: var(--surface-2);
  --nav-hover-fg: var(--ink);
  --nav-active-bg: var(--dark);
  --nav-active-fg: var(--on-dark);
  --nav-active-icon: var(--accent);
  --nav-label: var(--muted);
  --brand-fg: var(--ink);
  --brand-em: var(--primary);
  --me-bg: var(--paper);
  --me-fg: var(--ink);
  --me-sub: var(--muted);

  /* Logo mark */
  --mark-bg: #10201B;
  --mark-1: #6FA898;
  --mark-2: #A9D3C5;
  --mark-3: #D9F26B;

  /* Status (each pair passes 4.5:1) */
  --info: #2F5BD3;
  --info-soft: #EAF0FF;
  --warn: #A15C00;
  --warn-soft: #FFF3DC;
  --warn-bright: #D9A400;
  --danger: #B42318;
  --danger-soft: #FDECEA;
  --success: #0A5747;
  --success-soft: #E3F1EC;
  --neutral: #4A5753;
  --neutral-soft: #EEF0EA;

  /* Type */
  --font-display: 'Bricolage Grotesque', 'Manrope', ui-sans-serif, system-ui, sans-serif;
  --font-ui: 'Manrope', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --text-xs: 12px;
  --text-sm: 13px;
  --text-md: 14px;
  --text-base: 15px;
  --text-lg: 17px;
  --text-xl: 22px;
  --text-2xl: 28px;
  --text-3xl: 36px;

  /* Shape and depth */
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 16px;
  --r-xl: 20px;
  --r-pill: 999px;
  --shadow-sm: 0 1px 2px rgba(16, 32, 27, 0.06);
  --shadow-md: 0 1px 2px rgba(16, 32, 27, 0.05), 0 12px 32px -16px rgba(16, 32, 27, 0.18);
  --shadow-lg: 0 24px 64px -24px rgba(16, 32, 27, 0.35);
  --ring: 0 0 0 3px rgba(14, 107, 87, 0.28);

  /* Layout */
  --sidebar-w: 264px;
  --topbar-h: 72px;
  --content-max: 1240px;
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
}