/* ==========================================================================
   YQG Business — Design Tokens v2: "Riverfront at Dusk"
   (source: yqgbusiness-site-handoff-v2.md)

   The --yqg-* names are legacy aliases kept so existing page styles pick up
   the new palette without per-page rewrites. New code should use the v2
   names directly.
   ========================================================================== */

:root {
  /* ---- v2 Foundation ---- */
  --navy-900: #0E2235;   /* Dusk navy — dark section backgrounds, footer */
  --navy-800: #16314A;   /* Cards/elevated surfaces on dark sections */
  --navy-700: #1F4163;   /* Borders/dividers on dark */

  /* Light surfaces */
  --paper:    #FBFAF7;
  --paper-2:  #F3F1EC;
  --line:     #E4E2DB;

  /* Text */
  --ink:      #15212E;
  --ink-soft: #51606F;
  --cream:    #F6EFE6;
  --cream-soft: rgba(246,239,230,0.72);

  /* Sunset accent — use sparingly */
  --sunset:      #E76A2E;
  --sunset-deep: #C24E14;
  --sunset-glow: linear-gradient(90deg, #E76A2E 0%, #F2A65A 100%);

  /* ---- Typography ---- */
  --font-display: 'Bricolage Grotesque', system-ui, sans-serif;
  --font-body:    'Figtree', system-ui, sans-serif;

  /* ======================================================================
     Legacy aliases (--yqg-*) — mapped onto the v2 palette
     ====================================================================== */

  /* Structural dark (page heroes, dark sections, .btn-primary) */
  --yqg-primary:       var(--navy-900);
  --yqg-primary-hover: var(--navy-800);
  --yqg-overlay:       rgba(14, 34, 53, 0.35);

  /* CTA — interactive sunset */
  --yqg-cta:           var(--sunset-deep);
  --yqg-cta-hover:     #A94310;

  /* ---- Text ---- */
  --yqg-ink:           var(--ink);
  --yqg-muted:         var(--ink-soft);

  /* ---- Surfaces ---- */
  --yqg-page:          var(--paper);
  --yqg-page-alt:      var(--paper-2);
  --yqg-surface:       #FFFFFF;
  --yqg-line:          var(--line);

  /* Photo placeholders */
  --yqg-hatch-a:       #ECE9E3;
  --yqg-hatch-b:       #E3DFD7;

  /* ---- Typography ---- */
  --yqg-font:          var(--font-body);
  --yqg-w-regular:     400;
  --yqg-w-medium:      500;
  --yqg-w-semibold:    600;
  --yqg-w-bold:        700;

  /* ---- Type scale ---- */
  --yqg-fs-hero:       52px;
  --yqg-fs-h2:         32px;
  --yqg-fs-h3:         20px;
  --yqg-fs-lead:       18px;
  --yqg-fs-body:       16px;
  --yqg-fs-nav:        15px;
  --yqg-fs-small:      14px;
  --yqg-fs-meta:       13px;

  /* ---- Radius ---- */
  --yqg-r-btn:         12px;
  --yqg-r-card:        16px;
  --yqg-r-pill:        999px;

  /* ---- Shadow ---- */
  --yqg-shadow-card:   0 2px 12px rgba(14,34,53,.07);
  --yqg-shadow-hover:  0 12px 32px rgba(14,34,53,.10);

  /* ---- Layout ---- */
  --yqg-max-w:         1140px;
  --yqg-pad-x:         24px;
  --yqg-section-pad:   96px;
}