/* ==========================================================================
   Аспро.Встречи — дизайн-токены
   Источник: боевая дизайн-система aspro.cloud (шаблон asprocloud_v2).
   Значения сняты из :root продакшена 08.09.2026.

   ЭТО ЕДИНСТВЕННЫЙ ФАЙЛ, КОТОРЫЙ НУЖНО ЗАМЕНИТЬ, когда придёт дизайн-код
   от дизайнеров. Вся вёрстка ссылается только на переменные ниже.
   ========================================================================== */

/* Inter грузится с aspro.cloud. Чтобы перейти на локальные файлы: положить три
   woff2 в assets/fonts/ и в каждом из трёх @font-face ниже поставить перед
   внешним адресом строку
       url('/assets/fonts/<имя файла>') format('woff2'),
   Подробности и имена файлов — assets/fonts/README.md. */

/* --- Шрифты Аспро (единая дизайн-система) ------------------------------- */
/* Тянем Inter с aspro.cloud. При выкладке на meetings.aspro.cloud стоит
   скопировать woff2 в /assets/fonts/ и переключить src на локальные пути
   (см. README) — cross-origin шрифтам нужен CORS-заголовок. */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('https://aspro.cloud/local/templates/asprocloud_v2/css/fonts/inter/fonts/inter-v20-cyrillic_cyrillic-ext_latin-regular.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('https://aspro.cloud/local/templates/asprocloud_v2/css/fonts/inter/fonts/inter-v20-cyrillic_cyrillic-ext_latin-500.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('https://aspro.cloud/local/templates/asprocloud_v2/css/fonts/inter/fonts/inter-v20-cyrillic_cyrillic-ext_latin-600.woff2') format('woff2');
}

:root {
  /* --- Бренд ------------------------------------------------------------ */
  --brand-blue: #3761e9;
  --brand-blue-hover: #1c4ade;
  --brand-blue-rgb: 55, 97, 233;
  --brand-blue-transparent: rgba(55, 97, 233, 0.1);
  --brand-blue-transparent-hover: rgba(55, 97, 233, 0.2);
  --brand-green: #35d3ac;
  --brand-teal: #35d3ac;
  --brand-light-green: #3ae7bc;
  --brand-red: #ff7188;
  --brand-yellow: #ffce51;
  --deep-blue: #26263e;
  --matte-blue: #3c3c58;
  --matte-blue-hover: #31314d;

  /* --- Нейтральные ------------------------------------------------------ */
  --white: #ffffff;
  --white-hover: #f5f7fc;
  --white-12: rgba(255, 255, 255, 0.12);
  --black: #222222;
  --heading-color: #333338;
  --text-color: #444448;
  --secondary-text-color: #8c94a7;
  --additional-color: #919bb6;
  --gray-date: #969aa5;
  --placeholder-color: #91a2b6;
  --text-onblack: #b2b8c6;

  /* --- Фоны и границы --------------------------------------------------- */
  --main-bg-color: #f5f7fc;
  --light-bg-color: #f8f9fd;
  --special-grey: #f3f4f9;
  --special-grey-darken: #f0f2f8;
  --divider-color: #e6e9f2;
  --divider-on-blue: rgba(255, 255, 255, 0.12);
  --hover-gray: #ccd3e5;
  --header-shadow: rgba(38, 38, 62, 0.04);
  --header-bottom-divider: rgba(140, 148, 167, 0.12);
  --dropmenu-shadow-color: rgba(0, 0, 0, 0.08);
  --blanket: rgba(0, 0, 0, 0.25);

  /* --- Типографика ------------------------------------------------------ */
  --font-family-base: 'Inter', Arial, 'Helvetica Neue', Helvetica, sans-serif;

  --h1-size-desktop: 3.125rem;   /* 50px */
  --h1-size-mobile: 2rem;        /* 32px */
  --h1-lh: 131%;
  --h2-size-desktop: 2.25rem;    /* 36px */
  --h2-size-mobile: 1.75rem;     /* 28px */
  --h2-lh: 130%;
  --h3-size-desktop: 1.875rem;   /* 30px */
  --h3-size-mobile: 1.5rem;      /* 24px */
  --h3-lh: 132%;
  --h4-size-desktop: 1.25rem;    /* 20px */
  --h4-size-mobile: 1.125rem;    /* 18px */
  --h4-lh: 150%;

  --text-big-desktop: 1.125rem;  /* 18px */
  --text-big-mobile: 1rem;
  --text-big-lh: 156%;
  --text-medium: 1rem;
  --text-medium-lh: 162%;
  --text-regular: 0.875rem;      /* 14px */
  --text-regular-lh: 143%;
  --text-15: 0.9375rem;
  --text-15-lh: 167%;
  --text-12: 0.75rem;
  --text-12-lh: 150%;
  --txt-size-26: 1.625rem;

  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;

  /* --- Радиусы ---------------------------------------------------------- */
  --radius-3xs: 2px;
  --radius-2xs: 4px;
  --radius-xs: 6px;
  --radius-sm: 8px;
  --radius-md: 10px;
  --radius-lg: 12px;
  --radius-xl: 14px;
  --radius-2xl: 16px;
  --radius-3xl: 20px;
  --radius-pill: 99rem;
  --radius-circle: 50%;

  /* --- Отступы (вертикальный ритм Аспро) -------------------------------- */
  --g1: 0.25rem;
  --g2: 0.5rem;
  --g3: 0.75rem;
  --g4: 1rem;
  --g5: 1.25rem;
  --g6: 1.5rem;
  --g7: 1.75rem;
  --g8: 2rem;
  --g9: 2.5rem;
  --g10: 3rem;
  --g11: 3.5rem;
  --g12: 4rem;
  --g13: 5rem;
  --g14: 6rem;
  --g15: 7.5rem;

  /* --- Тени ------------------------------------------------------------- */
  --shadow-xs: 0 2px 2px 0 rgba(0, 0, 0, 0.07);
  --shadow-s: 0 2px 4px 0 rgba(0, 0, 0, 0.08);
  --shadow-m: 0 3px 4px 0 rgba(0, 0, 0, 0.08);
  --shadow-l: 0 4px 5px 0 rgba(0, 0, 0, 0.08);
  --shadow-xl: 0 6px 10px 0 rgba(0, 0, 0, 0.1);
  --shadow-2xl: 0 8px 10px 0 rgba(0, 0, 0, 0.1);
  --shadow-3xl: 0 12px 17px 0 rgba(0, 0, 0, 0.1);
  --shadow-card: 0 4px 24px 0 rgba(38, 38, 62, 0.06);
  --shadow-card-hover: 0 12px 32px 0 rgba(38, 38, 62, 0.1);

  /* --- Раскладка -------------------------------------------------------- */
  --container-max: 1240px;
  --container-pad: 20px;
  --header-h: 72px;
  --transition: 0.2s ease;
}

@media (max-width: 767px) {
  :root {
    --g5: 1rem;
    --g6: 1.25rem;
    --g7: 1.5rem;
    --g8: 1.5rem;
    --g9: 2rem;
    --g10: 2rem;
    --g11: 2.5rem;
    --g12: 2.5rem;
    --g13: 3rem;
    --g14: 3.5rem;
    --g15: 4rem;
    --container-pad: 16px;
    --header-h: 64px;
  }
}