/*
 * Brand colours are sampled from the logo artwork, not guessed:
 *   navy #00143F (6,872 px) and red #C31230 (3,735 px) are the two dominant
 *   non-white colours in img/logo/logo.png.
 *
 * They replace #03202F / #A71930, which came from the old Elementor kit and
 * were both duller than the mark the company actually uses. White text clears
 * AA on both: 17.9:1 on the navy, 6.1:1 on the red.
 */
/* ==========================================================================
   Big State Roof Solutions — design tokens
   Ports directly into the Cassiopeia child template as user.css.
   Palette sampled from the live brand mark (Texas outline logo).
   ========================================================================== */

:root {
	/* ---- brand ---------------------------------------------------------- */
	--navy-900: #000D2B;
	--navy-800: #00143F;   /* primary brand navy - sampled from logo.png */
	--navy-700: #06304a;
	--navy-600: #0a4468;
	--navy-100: #e7edf2;

	--red-700:  #9E0F27;   /* hover for the logo red */
	--red-600:  #C31230;   /* primary brand red - sampled from logo.png */
	--red-500:  #c8203c;
	--red-100:  #fbe9ec;

	/* ---- neutrals ------------------------------------------------------- */
	--ink:      #27282A;
	--ink-mid:  #55575c;
	--ink-soft: #7c7f86;
	--line:     #dfe3e8;
	--surface:  #ffffff;
	--surface-alt: #f5f7f9;

	--star:     #f5a623;

	/* ---- semantic ------------------------------------------------------- */
	--bg:            var(--surface);
	--text:          var(--ink);
	--text-muted:    var(--ink-mid);
	--accent:        var(--red-600);
	--accent-hover:  var(--red-700);

	/* ---- type ----------------------------------------------------------- */
	--font-heading: "Montserrat", system-ui, -apple-system, sans-serif;
	--font-body:    "Roboto", system-ui, -apple-system, sans-serif;

	/* fluid scale — min at 360px, max at 1280px */
	--step--1: clamp(0.83rem, 0.79rem + 0.17vw, 0.92rem);
	--step-0:  clamp(1rem,    0.95rem + 0.22vw, 1.13rem);
	--step-1:  clamp(1.2rem,  1.11rem + 0.39vw, 1.42rem);
	--step-2:  clamp(1.44rem, 1.29rem + 0.65vw, 1.8rem);
	--step-3:  clamp(1.73rem, 1.5rem  + 1.02vw, 2.27rem);
	--step-4:  clamp(2.07rem, 1.72rem + 1.53vw, 2.86rem);
	--step-5:  clamp(2.49rem, 1.97rem + 2.23vw, 3.6rem);
	--step-6:  clamp(2.99rem, 2.23rem + 3.2vw,  4.54rem);

	/* ---- space ---------------------------------------------------------- */
	--sp-1: 0.25rem;
	--sp-2: 0.5rem;
	--sp-3: 0.75rem;
	--sp-4: 1rem;
	--sp-5: 1.5rem;
	--sp-6: 2rem;
	--sp-7: 3rem;
	--sp-8: 4rem;
	--sp-9: 6rem;

	--section-y: clamp(3rem, 1.8rem + 5vw, 6rem);

	/* ---- layout --------------------------------------------------------- */
	--wrap:       1200px;
	--wrap-tight: 820px;
	--gutter:     clamp(1rem, 0.6rem + 1.8vw, 2rem);

	/* ---- form ----------------------------------------------------------- */
	--radius-sm: 4px;
	--radius:    8px;
	--radius-lg: 16px;

	--shadow-sm: 0 1px 2px rgba(3, 32, 47, 0.08);
	--shadow:    0 4px 16px rgba(3, 32, 47, 0.1);
	--shadow-lg: 0 16px 48px rgba(3, 32, 47, 0.16);

	--ring: 0 0 0 3px rgba(167, 25, 48, 0.35);

	--speed: 160ms;
	--ease:  cubic-bezier(0.4, 0, 0.2, 1);
}