/* ============================================================
   Железно — дизайн-токены
   Цвета сняты из Figma «SMM-конструктор» без округления.
   Шрифты подключаются через Google Fonts в index.html.
   ============================================================ */

:root {
  /* --- нейтральные --- */
  --zh-cream: #F6F1EF;
  --zh-warm-grey: #999999;
  --zh-grey-fog: #F2F2F2;
  --zh-grey-paper: #F4F4F1;
  --zh-white: #FFFFFF;
  --zh-charcoal: #262626;
  --zh-charcoal-2: #2C2C2C;
  --zh-near-black: #1A1A1A;
  --zh-ink: #131415;
  --zh-black: #000000;

  /* --- синий: основной акцент (CTA, ссылки, заголовки) --- */
  --zh-blue-primary: #0068D9;
  --zh-blue-bright: #258FF8;
  --zh-blue-sky: #3395FF;
  --zh-blue-pale: #CCE5FE;
  --zh-blue-paler: #E5F2FF;
  --zh-blue-stroke: #8CC3FF;

  /* --- зелёный: вторичный акцент --- */
  --zh-green-olive: #94BC26;
  --zh-green-stroke: #D5FE60;
  --zh-green-lime-text: #D6FF61;

  /* --- тёплые / предупреждающие --- */
  --zh-terracotta: #B68D7C;
  --zh-rust: #C23900;
  --zh-blush: #DDCAC2;

  /* --- шрифты --- */
  --font-display: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
  --font-body: 'Roboto', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --font-label: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;

  /* --- радиусы: радиус пилюли фиксированный 40px, не пропорциональный --- */
  --radius-pill: 40px;
  --radius-lg: 32px;
  --radius-md: 20px;
  --radius-sm: 12px;

  /* --- тени --- */
  --shadow-pill: 0 4px 4px rgba(0, 0, 0, .25);
  --shadow-ambient:
    -26px 85px 25px rgba(0, 0, 0, 0),
    -17px 54px 23px rgba(0, 0, 0, .01),
    -9px 31px 19px rgba(0, 0, 0, .05),
    -4px 14px 14px rgba(0, 0, 0, .09),
    -1px 3px 8px rgba(0, 0, 0, .1);
  --shadow-card: var(--shadow-ambient), 0 30px 70px rgba(0, 0, 0, .13);
}