/*
 * Design Tokens — extracted verbatim from the live Elementor Global Kit (post ID 8).
 * These values guarantee the custom theme reuses the EXACT same palette, typography,
 * container width and breakpoints as the current site, so nothing shifts visually.
 *
 * Source mapping (Elementor kit -> token):
 *   custom "main color"        #1B2B4A  -> --usa-navy
 *   custom "yellow color"      #FF7E00  -> --usa-orange
 *   custom "yellow color #3"   #FF8D00  -> --usa-orange-hover
 *   system Secondary           #54595F  -> --usa-secondary
 *   system Text                #7A7A7A  -> --usa-text
 *   system Primary             #6EC1E4  -> --usa-primary (legacy/rarely used)
 *   system Accent              #61CE70  -> --usa-accent  (legacy/rarely used)
 *   typography font family     Poppins  -> --usa-font-family
 *   container_width            1200px   -> --usa-container
 *   viewport_md / viewport_lg  768/1025 -> breakpoints
 */

:root {
	/* Brand palette */
	--usa-navy: #1B2B4A;
	--usa-navy-2: #2D4471; /* secondary navy used in header/chat UI */
	--usa-orange: #FF7E00;
	--usa-orange-hover: #FF8D00;

	/* Elementor system colors (kept for parity) */
	--usa-primary: #6EC1E4;
	--usa-secondary: #54595F;
	--usa-text: #7A7A7A;
	--usa-accent: #61CE70;

	/* Neutrals */
	--usa-white: #ffffff;
	--usa-light: #f8f9fa;
	--usa-border: #d3d8e0;
	--usa-heading: #1B2B4A;

	/* Typography — Poppins everywhere, matching the kit weights */
	--usa-font-family: "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--usa-fw-text: 400;     /* system "Text" + "Secondary" */
	--usa-fw-accent: 500;   /* system "Accent" */
	--usa-fw-heading: 600;  /* system "Primary" */
	--usa-fw-bold: 700;

	/* Layout */
	--usa-container: 1200px;
	--usa-gutter: 20px;

	/* Breakpoints (for reference in calc/clamp; media queries use literals) */
	--usa-bp-tablet: 1024px; /* viewport_lg = 1025 */
	--usa-bp-mobile: 767px;  /* viewport_md = 768 */
}
