/* ==========================================================================
   u.stin vpn — дизайн-токены (единый источник цветов, шрифтов, радиусов, easing)
   Палитра: глубокий чёрный + ночной тёмно-синий + небесно-голубой акцент.
   Подключается ПЕРВЫМ на всех страницах, до base.css.
   ========================================================================== */
:root {
  color-scheme: dark;

  /* Фон — почти чёрный с синим подтоном */
  --bg: #02040a;
  --bg-rgb: 2, 4, 10;
  --bg-2: #050a17;            /* чуть светлее — чередование секций */
  --bg-3: #081127;            /* глубокий ночной синий */

  /* Тёмно-синие плоскости */
  --navy: #0a1633;
  --navy-rgb: 10, 22, 51;
  --navy-2: #10244f;
  --navy-3: #16336e;

  /* Небесный акцент */
  --sky: #7cc4ff;             /* основной акцент */
  --sky-rgb: 124, 196, 255;
  --azure: #3a86ff;           /* насыщенный синий */
  --azure-rgb: 58, 134, 255;
  --cobalt: #1f4fd8;          /* глубокий синий для градиентов */
  --cobalt-rgb: 31, 79, 216;
  --ice: #dcefff;             /* светлый «лёд» для бликов */
  --ice-rgb: 220, 239, 255;

  /* Текст */
  --text: #eef5ff;
  --text-rgb: 238, 245, 255;
  --text-2: #a8b8d8;          /* вторичный */
  --text-3: #6d7c9e;          /* подписи, мета */
  --text-4: #445273;          /* совсем тихий */

  /* Линии и стекло */
  --line: rgba(150, 190, 255, 0.10);
  --line-2: rgba(150, 190, 255, 0.18);
  --line-3: rgba(150, 190, 255, 0.30);
  --glass: rgba(12, 22, 48, 0.55);
  --glass-2: rgba(18, 34, 72, 0.62);
  --glass-blur: 18px;

  /* Статусы */
  --ok: #6fe3c1;
  --ok-rgb: 111, 227, 193;
  --err: #ff7a8a;
  --err-rgb: 255, 122, 138;

  /* Градиенты */
  --grad-text: linear-gradient(100deg, #eef5ff 0%, #bfe1ff 35%, #7cc4ff 65%, #3a86ff 100%);
  --grad-accent: linear-gradient(120deg, #9fd4ff 0%, #5aa8ff 45%, #2f6bff 100%);
  --grad-line: linear-gradient(90deg, rgba(124, 196, 255, 0) 0%, rgba(124, 196, 255, 0.6) 50%, rgba(124, 196, 255, 0) 100%);
  --grad-surface: linear-gradient(180deg, rgba(22, 40, 84, 0.55) 0%, rgba(8, 16, 36, 0.55) 100%);

  /* Свечения */
  --glow-sm: 0 0 24px rgba(var(--sky-rgb), 0.25);
  --glow-md: 0 10px 40px -10px rgba(var(--azure-rgb), 0.55), 0 0 0 1px rgba(var(--sky-rgb), 0.18);
  --glow-lg: 0 30px 120px -30px rgba(var(--azure-rgb), 0.6);
  --shadow-card: 0 30px 80px -40px rgba(0, 0, 0, 0.9), 0 1px 0 rgba(255, 255, 255, 0.04) inset;

  /* Шрифты */
  --f-display: 'Unbounded', 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --f-body: 'Manrope', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --f-mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  /* Радиусы */
  --r-xs: 8px;
  --r-sm: 12px;
  --r-md: 18px;
  --r-lg: 26px;
  --r-xl: 36px;
  --r-pill: 999px;

  /* Сетка */
  --container: 1240px;
  --gutter: clamp(16px, 4vw, 40px);
  --section-y: clamp(96px, 14vw, 180px);
  --header-h: 72px;

  /* Движение */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);      /* quint-out — основной: мягкий старт, долгое «приземление» */
  --ease-in-out: cubic-bezier(0.83, 0, 0.17, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur-1: 0.2s;
  --dur-2: 0.45s;
  --dur-3: 0.9s;

  /* Слои */
  --z-globe: 1;
  --z-content: 2;
  --z-card: 20;
  --z-header: 50;
  --z-menu: 60;
  --z-modal: 80;
  --z-intro: 100;
}
