/* ============================================
   brand.css - D&G Auto LLC
   Brand config layer. Colors, fonts and brand-level rules only; no component or page styles.
   Load order on /dga26/ (ARN L9): mainstyle.css -> brand.css -> the page's own <style> -> custom.css.
   It loads BEFORE the prototype's rules on purpose, so the prototype still wins every tie.
   Palette measured 2026-10-01 from the 22 prototype comps + custom.css: these 13 hex values are
   the only ones used. The prototype CSS keeps its literal hex values; the tokens are for CSS
   written from here on (build-page rows).
   ============================================ */

/* --- Brand Colors --- */
:root {
  --brand-bg:              #0A1220;  /* page background, text on gold */
  --brand-surface:         #101B2E;  /* cards, panels, toasts */
  --brand-surface-2:       #0F1C33;  /* image placeholders, inset panels */
  --brand-line:            #1D2C45;  /* hairlines, dividers */
  --brand-line-strong:     #2A3B57;  /* stronger and hover borders */
  --brand-text:            #EAF1FA;  /* body and heading ink */
  --brand-muted:           #93A6BC;  /* secondary copy, footer links */
  --brand-accent:          #00DCFF;  /* cyan: links, focus rings, outline buttons */
  --brand-primary:         #F2B93C;  /* gold: primary CTA */
  --brand-primary-hover:   #FFCB57;
  --brand-secondary:       #1668E0;  /* blue: secondary CTA, blue bands */
  --brand-secondary-hover: #2F7CF0;
  --brand-on-primary:      #0A1220;  /* text on gold */
  --brand-on-secondary:    #FFFFFF;  /* text on blue */
}

/* --- Brand Fonts (loaded from Google Fonts in each page head) --- */
:root {
  --font-heading: Oswald, Impact, sans-serif;
  --font-body:    Poppins, system-ui, sans-serif;
}
body {
  font-family: var(--font-body);
}

/* --- Dark grounds (E-25) ---
   This site is dark everywhere, so the page itself is the dark band: body declares the
   on-dark ink and headings inherit it. Headings that carry their own colour (inline or a
   class rule) keep it. No rule in this file sets a heading colour. */
body {
  color: var(--brand-text);
}
body :is(h1, h2, h3, h4, h5, h6) {
  color: inherit;
}

/* --- Orphan / Widow Prevention (base standard v2.21.0+) --- */
/* Required on every site. Never remove. Never hand-patch with <br>. */
h1, h2, h3, h4, h5, .display, .eyebrow { text-wrap: balance; }
p, li, blockquote, figcaption, .blurb, .lead { text-wrap: pretty; }
