/* =========================================================================
   ДИЗАЙН-ТОКЕНЫ «Регионстрой»
   Единый источник цветов, типографики, отступов, радиусов и теней.
   Меняйте значения здесь — они разойдутся по всем компонентам.
   ========================================================================= */

:root {
  /* ---------- Бренд ---------- */
  --rs-brand-950: #061a36;
  --rs-brand-900: #0a2750;
  --rs-brand-800: #0c3266;
  --rs-brand: #003b7c;             /* основной синий из логотипа */
  --rs-brand-600: #0b4c96;
  --rs-brand-500: #2563b0;
  --rs-brand-200: #c9d8ec;
  --rs-brand-100: #e6eef8;
  --rs-brand-50: #f2f6fc;

  --rs-accent: #e52e10;            /* красный из логотипа — только для акций и главного CTA */
  --rs-accent-600: #c8260b;
  --rs-accent-100: #fde3dd;
  --rs-accent-50: #fef3f0;

  --rs-success: #1f8a54;
  --rs-success-500: #2fa46a;
  --rs-success-50: #eaf7f0;
  --rs-warning: #d9820f;
  --rs-warning-50: #fdf4e6;

  /* ---------- Нейтральные (с лёгким холодным оттенком) ---------- */
  --rs-ink: #0f1b2d;               /* заголовки */
  --rs-text: #2b3646;              /* основной текст */
  --rs-muted: #667085;             /* второстепенный текст */
  --rs-subtle: #98a2b3;            /* подписи, плейсхолдеры */
  --rs-line: #e4e9f0;              /* границы */
  --rs-line-soft: #eef2f6;
  --rs-surface: #ffffff;
  --rs-surface-2: #f6f8fb;         /* фон секций */
  --rs-surface-3: #eef2f7;

  /* ---------- Типографика ---------- */
  --rs-font: Gilroy, "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;

  --rs-fs-xs: 12px;
  --rs-fs-sm: 13px;
  --rs-fs-base: 15px;
  --rs-fs-md: 16px;
  --rs-fs-lg: 18px;
  --rs-fs-xl: 20px;
  --rs-fs-h3: clamp(20px, 1.6vw, 24px);
  --rs-fs-h2: clamp(24px, 2.2vw, 32px);
  --rs-fs-h1: clamp(32px, 4.2vw, 60px);

  --rs-lh-tight: 1.12;
  --rs-lh-snug: 1.3;
  --rs-lh-base: 1.55;
  --rs-tracking-tight: -0.022em;
  --rs-tracking-caps: 0.08em;

  /* ---------- Отступы (сетка 4px) ---------- */
  --rs-space-1: 4px;
  --rs-space-2: 8px;
  --rs-space-3: 12px;
  --rs-space-4: 16px;
  --rs-space-5: 20px;
  --rs-space-6: 24px;
  --rs-space-8: 32px;
  --rs-space-10: 40px;
  --rs-space-12: 48px;
  --rs-space-16: 64px;

  --rs-section-gap: 24px;          /* вертикальный ритм между блоками страницы */
  --rs-card-padding: clamp(18px, 2.2vw, 32px);

  /* ---------- Радиусы ---------- */
  --rs-radius-xs: 6px;
  --rs-radius-sm: 10px;
  --rs-radius: 14px;
  --rs-radius-lg: 20px;
  --rs-radius-xl: 28px;
  --rs-radius-pill: 999px;

  /* ---------- Тени (с оттенком бренда) ---------- */
  --rs-shadow-xs: 0 1px 2px rgba(15, 27, 45, 0.05);
  --rs-shadow-sm: 0 1px 2px rgba(15, 27, 45, 0.04), 0 2px 8px rgba(15, 27, 45, 0.05);
  --rs-shadow: 0 2px 4px rgba(15, 27, 45, 0.03), 0 8px 24px rgba(15, 27, 45, 0.07);
  --rs-shadow-lg: 0 4px 8px rgba(15, 27, 45, 0.04), 0 18px 48px rgba(15, 27, 45, 0.12);
  --rs-shadow-brand: 0 6px 18px rgba(0, 59, 124, 0.22);
  --rs-shadow-accent: 0 6px 18px rgba(229, 46, 16, 0.28);
  --rs-ring: 0 0 0 3px rgba(37, 99, 176, 0.28);

  /* ---------- Стекло (элементы поверх фото) ---------- */
  --rs-glass-dark: rgba(10, 18, 32, 0.52);
  --rs-glass-light: rgba(255, 255, 255, 0.14);
  --rs-glass-border: rgba(255, 255, 255, 0.18);
  --rs-blur: saturate(160%) blur(14px);

  /* ---------- Анимации ---------- */
  --rs-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --rs-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --rs-dur-fast: 0.18s;
  --rs-dur: 0.3s;
  --rs-dur-slow: 0.6s;

  /* ---------- Контролы ---------- */
  --rs-control-h: 48px;
  --rs-control-h-sm: 40px;

  /* ---------- Слои ---------- */
  --rs-z-float: 900;
  --rs-z-cookie: 1000;

  /* =======================================================================
     СОВМЕСТИМОСТЬ: старые переменные (могут использоваться в блоках Porto,
     шорткодах и HTML-контенте). Все ссылаются на новые токены.
     ======================================================================= */
  --color-primary: var(--rs-brand);
  --color-primary-hover: var(--rs-brand-600);
  --color-secondary: var(--rs-surface-2);
  --color-tertiary: var(--rs-surface-3);
  --color-accent: var(--rs-accent);
  --color-accent-hover: var(--rs-accent-600);
  --color-success: var(--rs-success-500);
  --color-success-hover: var(--rs-success);
  --color-warning: #ffc107;
  --color-warning-hover: #e0a800;
  --color-danger: #dc3545;
  --color-danger-hover: #c82333;
  --color-info: #17a2b8;
  --color-info-hover: #138496;
  --color-golden: #a11313;
  --color-orange: #ef7d00;
  --color-green: #65b32e;
  --color-blue-light: var(--rs-brand-50);
  --color-gray-blue: var(--rs-surface-2);
  --color-badge-gold: #705427;
  --color-badge-green: #355944;
  --color-badge-blue: #294971;
  --color-badge-red: #a11313;

  --bg-primary: var(--rs-surface);
  --bg-secondary: var(--rs-surface-2);
  --bg-tertiary: var(--rs-surface-3);
  --bg-light: #fafbfd;
  --bg-dark: #212529;
  --bg-overlay: rgba(0, 0, 0, 0.5);
  --bg-modal: rgba(0, 0, 0, 0.75);

  --border-color: var(--rs-line);
  --border-light: var(--rs-line-soft);
  --border-dark: #294971;
  --border-focus: var(--rs-brand);
  --border-error: #dc3545;
  --border-success: var(--rs-success-500);

  --text-primary: var(--rs-ink);
  --text-secondary: var(--rs-muted);
  --text-tertiary: var(--rs-subtle);
  --text-light: #f8f9fa;
  --text-dark: var(--rs-ink);
  --text-muted: #b1b1b1;
  --text-white: #ffffff;
  --text-error: #dc3545;
  --text-success: var(--rs-success-500);
  --text-warning: #ffc107;
  --text-info: #17a2b8;

  --shadow-sm: var(--rs-shadow-xs);
  --shadow-md: var(--rs-shadow-sm);
  --shadow-lg: var(--rs-shadow);
  --shadow-xl: var(--rs-shadow-lg);
  --shadow-blue: var(--rs-shadow-sm);
  --shadow-porto: var(--rs-shadow-sm);
  --shadow-card: var(--rs-shadow-sm);
  --shadow-modal: var(--rs-shadow-lg);
  --shadow-dropdown: var(--rs-shadow);
  --shadow-button: var(--rs-shadow-brand);

  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 8px;
  --radius-xl: 15px;
  --radius-2xl: 16px;
  --radius-3xl: 20px;
  --radius-full: 50%;
  --radius-pill: 9999px;

  --space-xs: 5px;
  --space-sm: 10px;
  --space-md: 15px;
  --space-lg: 20px;
  --space-xl: 25px;
  --space-2xl: 30px;
  --space-3xl: 40px;
  --space-4xl: 50px;
  --space-5xl: 60px;
  --space-6xl: 80px;

  --font-primary: var(--rs-font);
  --font-display: var(--rs-font);
  --font-text: var(--rs-font);
  --font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;
  --font-icon: "Font Awesome 6 Free";

  --text-xs: 0.7em;
  --text-sm: 0.9em;
  --text-base: 1em;
  --text-lg: 1.1em;
  --text-xl: 1.5em;
  --text-2xl: 1.8em;
  --text-3xl: 2em;
  --text-4xl: 2.5em;
  --text-5xl: 3em;

  --font-light: 300;
  --font-normal: 400;
  --font-medium: 500;
  --font-semibold: 600;
  --font-bold: 700;
  --font-black: 900;

  --transition: var(--rs-dur) var(--rs-ease);
  --transition-fast: var(--rs-dur-fast) var(--rs-ease);
  --transition-base: var(--rs-dur) ease;
  --transition-slow: 0.5s ease;
  --transition-slower: 2s ease;

  --z-dropdown: 1000;
  --z-sticky: 1020;
  --z-fixed: 1030;
  --z-modal-backdrop: 1040;
  --z-modal: 1050;
  --z-tooltip: 1070;
  --z-popover: 1080;
  --z-toast: 1090;
  --z-max: 9999;

  --border-width: 1px;
  --border-width-thick: 2px;
}