/*
 * Фирменный стиль DPA по брендбуку
 * Цвета: HEX из руководства по фирменному стилю
 * Шрифт: Raleway (Light 300, Regular 400, SemiBold 600, ExtraBold 800)
 */

:root {
  /* Основные цвета бренда */
  --dpa-blue-dark: #003971;   /* Pantone 662 C — основной тёмно-синий */
  --dpa-blue: #004C97;       /* Pantone 2945 C */
  --dpa-blue-accent: #0077C8; /* Pantone 3005 C — акцентный синий */
  --dpa-gray-dark: #525E66;  /* основной серый текст */
  --dpa-gray: #A6AFB4;
  --dpa-gray-light: #DDE2E6;
  --dpa-black: #000000;
  --dpa-white: #ffffff;

  /* Семантика для интерфейса */
  --dpa-primary: var(--dpa-blue-dark);
  --dpa-primary-hover: #002d52;
  --dpa-accent: var(--dpa-blue-accent);
  --dpa-accent-hover: #0066ad;
  --dpa-text: var(--dpa-gray-dark);
  --dpa-text-muted: var(--dpa-gray);
  --dpa-bg-subtle: var(--dpa-gray-light);
  --dpa-border: var(--dpa-gray-light);

  /* Типографика по брендбуку (экраны) */
  --dpa-font-family: 'Raleway', sans-serif;
  --dpa-heading-size: clamp(1.75rem, 4vw, 3.75rem);   /* 60 px эквивалент */
  --dpa-subheading-size: clamp(1.125rem, 2.5vw, 2.375rem); /* 38 px */
  --dpa-body-size: clamp(0.875rem, 1.5vw, 1.5rem);    /* 14–24 px */
  --dpa-small-size: clamp(0.75rem, 1vw, 0.875rem);    /* 12–14 px */
  --dpa-caption-size: 0.75rem;                        /* 12 px сноска */
}

body {
  font-family: var(--dpa-font-family);
  color: var(--dpa-text);
}

/* Утилиты для использования в разметке */
.dpa-bg-primary { background-color: var(--dpa-primary) !important; }
.dpa-bg-accent { background-color: var(--dpa-accent) !important; }
.dpa-text-primary { color: var(--dpa-primary) !important; }
.dpa-text-accent { color: var(--dpa-accent) !important; }
.dpa-text-muted { color: var(--dpa-text-muted) !important; }
.dpa-border-color { border-color: var(--dpa-border) !important; }

/* Ховеры для кнопок и ссылок в стиле бренда */
.dpa-bg-primary:hover { background-color: var(--dpa-primary-hover) !important; }
.dpa-bg-accent:hover { background-color: var(--dpa-accent-hover) !important; }
.dpa-text-accent:hover { color: var(--dpa-primary-hover) !important; }

/* Заголовки — ExtraBold по брендбуку */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--dpa-font-family);
  font-weight: 800;
  color: var(--dpa-gray-dark);
}

/* Подзаголовки можно оформлять Light All Caps при необходимости */
.dpa-subheading {
  font-weight: 300;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  font-size: var(--dpa-subheading-size);
}