/* --- colors.css (дизайн-система «Всё решили») --- */
:root {
  /* ---- Brand: classic SaaS blue (primary) ----
     Синий = доверие, надёжность, знакомая SaaS-классика — спокойно, без агрессии. */
  --blue-900: #16337A;
  --blue-800: #1B44A6;
  --blue-700: #1D4FBE;
  --blue-600: #2563EB; /* primary */
  --blue-500: #4F82F0;
  --blue-300: #A9C3F8;
  --blue-100: #E7EEFD;
  --blue-050: #F3F7FE;

  /* ---- Accent: brighter azure (акцент — тоже синий, ярче основного) ---- */
  --azure-600: #0B76C7;
  --azure-500: #1E90FF; /* accent */
  --azure-300: #7EC0FF;
  --azure-100: #E1F0FF;

  /* ---- Cool neutrals (белый фон + прохладные серо-синие) ---- */
  --slate-050: #FBFCFE;
  --slate-100: #F5F7FB;
  --slate-200: #EDF1F7;
  --slate-300: #E1E7F0;

  --ink-900: #1A2233; /* основной текст */
  --ink-700: #414B5E;
  --ink-500: #5B6577; /* вторичный текст */
  --ink-300: #9AA3B2; /* приглушённый */
  --line-200: #E5E9F0; /* границы */
  --line-100: #EEF1F6;
  --white: #FFFFFF;

  /* ---- Semantic ---- */
  --success-600: #12855A;
  --success-500: #16A06A;
  --success-100: #E3F5EC;
  --attention-600: #C77F1E;
  --attention-500: #E0932B; /* внимание — тёплый янтарь, не тревожный красный */
  --attention-100: #FBEFD6;

  /* ---- Semantic aliases ---- */
  --color-primary: var(--blue-600);
  --color-primary-hover: var(--blue-700);
  --color-primary-press: var(--blue-900);
  --color-secondary: var(--slate-200);
  --color-accent: var(--azure-500);
  --color-accent-hover: var(--azure-600);

  --text-strong: var(--ink-900);
  --text-body: var(--ink-700);
  --text-muted: var(--ink-500);
  --text-on-primary: #FFFFFF;
  --text-link: var(--blue-600);
  --text-link-hover: var(--blue-700);

  --surface-page: var(--white);
  --surface-card: var(--white);
  --surface-sunken: var(--slate-100);
  --surface-tint: var(--blue-050);
  --border-default: var(--line-200);
  --border-strong: var(--ink-300);

  --state-success: var(--success-500);
  --state-success-bg: var(--success-100);
  --state-attention: var(--attention-500);
  --state-attention-bg: var(--attention-100);

  /* ---- Legacy aliases (старые имена → новая синяя система) ---- */
  --green-900: var(--blue-900);
  --green-800: var(--blue-700);
  --green-700: var(--blue-600);
  --green-500: var(--blue-500);
  --green-300: var(--blue-300);
  --green-100: var(--blue-100);
  --green-050: var(--blue-050);
  --coral-600: var(--azure-600);
  --coral-500: var(--azure-500);
  --coral-300: var(--azure-300);
  --coral-100: var(--azure-100);
  --sand-300: var(--slate-300);
  --sand-200: var(--slate-200);
  --sand-100: var(--slate-100);
  --sand-050: var(--slate-050);
}
/* --- typography.css (дизайн-система «Всё решили») --- */
:root {
  --font-display: 'Onest', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-body: 'Golos Text', system-ui, -apple-system, 'Segoe UI', sans-serif;

  /* Weights */
  --fw-regular: 400; /* @kind font */
  --fw-medium: 500; /* @kind font */
  --fw-semibold: 600; /* @kind font */
  --fw-bold: 700; /* @kind font */

  /* Type scale (px) — calm, generous */
  --fs-display: 56px;
  --fs-h1: 40px;
  --fs-h2: 30px;
  --fs-h3: 22px;
  --fs-lead: 19px;
  --fs-body: 16px;
  --fs-small: 14px;
  --fs-caption: 13px;

  /* Line heights */
  --lh-tight: 1.1; /* @kind font */
  --lh-heading: 1.2; /* @kind font */
  --lh-body: 1.55; /* @kind font */

  /* Letter spacing */
  --ls-display: -0.02em; /* @kind font */
  --ls-heading: -0.01em; /* @kind font */
  --ls-normal: 0; /* @kind font */
  --ls-caption: 0.01em; /* @kind font */
}
/* --- spacing.css (дизайн-система «Всё решили») --- */
:root {
  /* 4px base scale */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;

  /* Layout */
  --container-max: 1120px;
  --container-pad: 24px;
}
/* --- effects.css (дизайн-система «Всё решили») --- */
:root {
  /* Corner radii — soft, rounded (мягкие формы) */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 20px;
  --radius-2xl: 28px;
  --radius-pill: 999px;

  /* Shadows — cool blue-tinted, low, diffuse. «Спокойствие», не резкость. */
  --shadow-sm: 0 1px 2px rgba(22, 51, 122, 0.05), 0 1px 3px rgba(22, 51, 122, 0.05);
  --shadow-md: 0 4px 12px rgba(22, 51, 122, 0.06), 0 2px 4px rgba(22, 51, 122, 0.04);
  --shadow-lg: 0 12px 32px rgba(22, 51, 122, 0.08), 0 4px 10px rgba(22, 51, 122, 0.04);
  --shadow-focus: 0 0 0 3px rgba(37, 99, 235, 0.20);

  /* Motion — gentle, no bounce (спокойствие) */
  --ease-calm: cubic-bezier(0.22, 0.61, 0.36, 1); /* @kind other */
  --dur-fast: 120ms; /* @kind other */
  --dur-base: 200ms; /* @kind other */
  --dur-slow: 320ms; /* @kind other */
}