/**
 * Design tokens — styleguide (colors, typography).
 */

@import url('./fonts.css');

:root {
	/* ─────────────────────────────────────────────
	 * DEPRECATED
	 * ───────────────────────────────────────────── */
	/** @deprecated */ --color-navy: #57633F;
	/** @deprecated */ --color-coral: #bf6440;
	/** @deprecated */ --color-gray-600: #666666;
	/** @deprecated */ --color-gray-100: #f9f9f9;
	/** @deprecated */ --border-color: #cccccc;
	/** @deprecated */ --light-gray: #f9f9f9;
	/** @deprecated */ --color-text: #181D19;
	/** @deprecated */ --color-text-muted: #64748b;
	/** @deprecated */ --rs-accordion-body-bg: #f1f5f09c;
	/** @deprecated */ --rs-accordion-item-header-bg: #EAEFE8;
	/** @deprecated */ --rs-accordion-item-idle-bg: #f5f5f5;

	/* ─────────────────────────────────────────────
	 * White
	 * ───────────────────────────────────────────── */
	--color-white: #ffffff;

	/* ─────────────────────────────────────────────
	 * Blues — основная брендовая палитра
	 * ───────────────────────────────────────────── */
	--color-blue-vivid:    #0f62fe;   /* яркий интерактивный синий */
	--color-blue-electric: #1a6ef6;   /* электрик-синий */
	--color-blue:          #0065ca;   /* основной синий */
	--color-blue-dark:     #0056a9;   /* тёмный синий */

	/* ─────────────────────────────────────────────
	 * Navy — тёмно-синяя гамма
	 * ───────────────────────────────────────────── */
	--color-navy-new:  #23378a;   /* насыщенный тёмно-синий */
	--color-navy-dark: #001d6c;   /* тёмный нэви */
	--color-navy-deep: #001932;   /* глубокий нэви */
	--color-midnight:  #00203f;   /* полуночный синий */

	/* ─────────────────────────────────────────────
	 * Grays — нейтральная шкала
	 * ───────────────────────────────────────────── */
	--color-gray-ghost:  #f3f7ff;  /* призрачно-голубой фон */
	--color-gray-ice:    #f2f4f8;  /* холодный светлый фон */
	--color-gray-pale:   #e1e2e6;  /* бледно-серый */
	--color-gray-border: #dde1e6;  /* граница / разделитель */
	--color-gray-medium: #cccdcf;  /* средняя граница */
	--color-gray-slate:  #697077;  /* приглушённый текст */

	/* ─────────────────────────────────────────────
	 * Darks — тёмные тона (текст, фоны)
	 * ───────────────────────────────────────────── */
	--color-charcoal:      #21272a;  /* основной тёмный текст */
	--color-charcoal-dark: #1a1818;  /* очень тёмный */
	--color-black:         #000000;

	/* ─────────────────────────────────────────────
	 * Accents
	 * ───────────────────────────────────────────── */
	--color-red:        #ff0002;  /* ошибка / danger */
	--color-orange:     #e1780b;  /* оранжевый акцент */
	--color-gold:       #b8ad53;  /* золотисто-оливковый */
	--color-brown-dark: #292723;  /* тёмно-коричневый */

	/* ─────────────────────────────────────────────
	 * Semantic aliases
	 * ───────────────────────────────────────────── */
	--color-bg:      var(--color-white);
	--color-accent:  var(--color-blue);
	--color-heading: var(--color-navy-new);

	/* Accordion (Regorstroy block) */
	--rs-accordion-body-bg:        var(--color-gray-ice);
	--rs-accordion-item-header-bg: var(--color-gray-pale);
	--rs-accordion-item-idle-bg:   var(--color-gray-ghost);

	/* ─────────────────────────────────────────────
	 * Typography: Montserrat (primary), Akrobat secondary (@font-face in fonts.css)
	 * ───────────────────────────────────────────── */
	--font-primary: "Montserrat", sans-serif;
	--font-secondary: "Akrobat", sans-serif;

	/* Header stacking (absolute bar over hero) */
	--rs-header-z: 200;

	/* Layout: mobile ≥320, tablet ≥960, desktop ≥1440 */
	--rs-bp-tablet: 960px;
	--rs-bp-desktop: 1440px;
	--rs-container-px-mobile: 20px;
	--rs-container-px-tablet: 53px;
	--rs-container-px-desktop: 80px;
}