/* brand.css — RKE Contractors / Brand config layer
   Load order: mainstyle.css -> brand.css -> custom.css
   ---------------------------------------------------------------------------
   Palette source: the DesignCode inline-style system, harvested in
   .dwight/template-catalog.json (this is a CONVERT project — no template CSS
   file to scan; the brand lives in the DC inline styles). Brief from Paul is
   pending — revisit any token below if the brief supplies official brand specs.
   These tokens are the single source of truth; as the DC inline styles get
   extracted into classes during per-page builds (Option B), reference
   var(--brand-*) rather than raw hex. */

:root {
  /* ---- brand colors ---- */
  --brand-primary:        #C20104;  /* RKE red — buttons, links, accents */
  --brand-primary-hover:  #9c0103;  /* darker red — hover/active */
  --brand-ink:            #1A1F20;  /* near-black — headings + dark sections */
  --brand-text:           #1A1F20;  /* body text on light */
  --brand-text-soft:      #33383a;  /* softer paragraph copy */
  --brand-text-muted:     #6B7072;  /* muted labels / meta */
  --brand-bg:             #ffffff;  /* page background */
  --brand-bg-alt:         #F4F5F5;  /* light section background */
  --brand-border:         #E2E4E4;  /* hairline borders */
  --brand-border-concrete:#D6D8D9;  /* concrete — hairline dividers on light bg (news/list rows, per brand guide) */
  --brand-on-dark:        #9aa0a1;  /* muted text on dark bg */
  --brand-on-dark-soft:   #c7cacb;  /* softer text on dark bg */
  --brand-border-dark:    #34393a;  /* borders on dark bg */

  /* ---- typography ---- */
  --brand-heading-font: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --brand-body-font:    'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --brand-mono-font:    'Roboto Mono', ui-monospace, 'Cascadia Mono', monospace;  /* eyebrows / labels / meta */
}

/* ---- base brand primitives ----
   DC pages are inline-styled today; these take full effect as inline styles are
   extracted into classes during per-page builds. brand.css owns link color so a
   token change propagates sitewide. */
a { color: var(--brand-primary); }
a:hover { color: var(--brand-primary-hover); }

/* ---- No Orphans / Widows (Dwight standard — ship structurally, never <br> hand-policing) ---- */
h1, h2, h3, h4, h5, .display, .eyebrow { text-wrap: balance; }
p, li, blockquote, figcaption, .blurb, .lead { text-wrap: pretty; }
