/* ==============================================
   GARAGE by Dudarev Motorsport — Design Tokens
   Извлечено из архива Tilda-экспорта
   Источник: tilda-blocks-page101798166.min.css
   ============================================== */



:root {
  /* === ЦВЕТА (точные из CSS) === */
  
  /* Фоны */
  --color-bg-primary: #eceef2;           /* основной фон — СВЕТЛЫЙ */
  --color-bg-card: #FFFFFF;              /* карточки */
  --color-bg-dark: #1e212a;              /* тёмные блоки */
  --color-bg-dark-alt: #222222;          /* карточки на тёмном */
  --color-bg-black: #111111;             /* самый тёмный */
  --color-bg-soft: #f6f6f6;              /* мягкий светлый */
  
  /* Текст */
  --color-text-primary: #1e212a;         /* основной */
  --color-text-secondary: #686e8d;       /* описания */
  --color-text-muted: #a1a1a1;           /* приглушённый */
  --color-text-on-dark: #FFFFFF;         /* на тёмном фоне */
  --color-text-on-dark-muted: #d5d8e2;   /* приглушённый на тёмном */
  --color-text-border: #b1b9c8;          /* границы */
  
  /* Акценты */
  --color-accent-red: #fe4465;           /* CTA красная */
  --color-accent-red-hover: #df2a4a;     /* ховер */
  --color-accent-blue: #0077ff;          /* CTA синяя */
  --color-accent-blue-hover: #0063d5;    /* ховер */
  --color-accent-link: #ff8562;          /* ссылки */
  --color-accent-warm: #fa876b;          /* тёплый акцент */
  
  /* === ТИПОГРАФИКА === */
  
  --font-family-heading: 'Golos Text', Arial, sans-serif;
  --font-family-body: 'Golos Text', Arial, sans-serif;
  --font-family-mono: 'JetBrains Mono', Arial, sans-serif;
  
  /* Hero / H1 */
  --font-size-hero: 56px;
  --font-weight-hero: 800;
  --line-height-hero: 1;
  --letter-spacing-hero: -0.93px;
  
  /* H2 */
  --font-size-h2: 42px;
  --font-weight-h2: 800;
  --line-height-h2: 1;
  --letter-spacing-h2: -0.8px;
  
  /* H3 */
  --font-size-h3: 20px;
  --font-weight-h3: 600;
  --line-height-h3: 1.1;
  --letter-spacing-h3: -0.4px;
  
  /* Body */
  --font-size-body: 15px;
  --font-weight-body: 400;
  --line-height-body: 1.35;
  --letter-spacing-body: -0.3px;
  
  /* Mono/Tags (uppercase) */
  --font-size-mono: 14px;
  --font-weight-mono: 400;
  --line-height-mono: 1.3;
  --letter-spacing-mono: -0.4px;
  
  /* Доп. размеры из Tilda-классов */
  --font-size-text-xs: 15px;
  --font-size-text-sm: 18px;
  --font-size-text-md: 20px;
  --font-size-name-md: 20px;
  --font-size-name-xl: 24px;
  --font-size-heading-xs: 26px;
  --font-size-heading-lg: 32px;
  --font-size-title-xs: 42px;
  --font-size-descr-xxs: 14px;
  --font-size-descr-xs: 16px;
  --font-size-uptitle-xs: 12px;
  
  /* Начертания */
  --font-weight-black: 900;
  --font-weight-extrabold: 800;
  --font-weight-bold: 700;
  --font-weight-semibold: 600;
  --font-weight-medium: 500;
  --font-weight-regular: 400;
  --font-weight-light: 300;
  
  /* === КНОПКИ === */
  
  /* Красная CTA */
  --btn-primary-color: #eceef2;
  --btn-primary-bg: #fe4465;
  --btn-primary-bg-hover: #df2a4a;
  --btn-primary-radius: 6px;
  --btn-primary-padding: 11px 16px;
  --btn-primary-font: 'JetBrains Mono', Arial, sans-serif;
  --btn-primary-font-size: 14px;
  --btn-primary-font-weight: 400;
  --btn-primary-text-transform: uppercase;
  --btn-primary-hover-speed: 0.25s;
  
  /* Синяя CTA */
  --btn-secondary-bg: #0077ff;
  --btn-secondary-bg-hover: #0063d5;
  
  /* Outline */
  --btn-outline-border-color: #b1b9c8;
  --btn-outline-hover-color: #df2a4a;
  --btn-outline-hover-border: #df2a4a;
  
  /* === LAYOUT === */
  --container-max-width: 1200px;
  --container-padding: 20px;
  --section-padding-y: 72px;
  --card-gap: 20px;
  --grid-gap: 24px;
  
  /* === СКРУГЛЕНИЯ === */
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 8px;
  --radius-full: 1000px;
  
  /* === ЭФФЕКТЫ === */
  --ease-hover: cubic-bezier(0.4, 0, 0.2, 1);
  --transition-fast: 0.22s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-default: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-slow: 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  
  /* === Z-INDEX === */
  --z-header: 100;
  --z-menu: 200;
  --z-popup: 300;
  --z-overlay: 10000;
}

/* === АДАПТИВНЫЕ ПЕРЕОПРЕДЕЛЕНИЯ (из CSS) === */
@media screen and (max-width: 1199px) {
  :root {
    --font-size-hero: 38px;
    --font-size-h2: 22px;
    --letter-spacing-h2: -0.64px;
    --font-size-h3: 16px;
    --letter-spacing-h3: -0.32px;
    --font-size-body: 12px;
    --letter-spacing-body: -0.2px;
    --font-size-mono: 11px;
    --letter-spacing-mono: -0.32px;
    --btn-primary-radius: 4px;
    --btn-primary-padding: 10px 14px;
    --btn-primary-font-size: 11px;
  }
}

@media screen and (max-width: 959px) {
  :root {
    --font-size-hero: 40px;
    --font-size-h2: 24px;
    --letter-spacing-h2: -0.72px;
    --font-size-h3: 24px;
    --line-height-h3: 1.2;
    --letter-spacing-h3: -0.44px;
    --font-size-body: 14px;
    --letter-spacing-body: -0.28px;
    --font-size-mono: 14px;
    --btn-primary-radius: 8px;
    --btn-primary-padding: 10px 16px 11px 16px;
    --btn-primary-font-size: 14px;
  }
}

@media screen and (max-width: 639px) {
  :root {
    --font-size-hero: 32px;
    --line-height-hero: 0.95;
    --letter-spacing-hero: -0.64px;
    --font-size-h2: 28px;
    --font-size-h3: 18px;
    --font-size-mono: 12px;
    --btn-primary-radius: 8px;
    --btn-primary-padding: 14px 16px;
    --btn-primary-font-size: 12px;
  }
}