:root {
  /* Unified breakpoint used across layout & nav rules */
  --bp-desktop: 980px;
  --berkeley-blue: #002676;
  --berkeley-blue-100: #003262;
  --berkeley-blue-80: #004a9e;
  --berkeley-blue-60: #3b7ea1;
  --berkeley-gold: #fdb515;
  --heritage-gold: #c09748;
  --gold-dark: #fc9313;
  --gray-light: #f2f2f2;
  --color-text-secondary: rgba(0, 38, 118, 0.7);
  --border-color: rgba(0, 38, 118, 0.2);
  --burger-border-color: #f3eacf; /* Specific color for burger menu border */
  --burger-line-color: #003262; /* Specific color for burger menu lines */
  --hover-bg: rgba(0, 38, 118, 0.05);
  --gold-medium: rgba(255, 195, 27, 0.5);

  /* Nav tuning vars */
  --nav-width: 220px;
  --nav-left: 12px;
  --nav-gap: 16px; /* space between nav and content */
  --content-right-gap: 24px;
  --content-max: 740px;
  --content-max-with-nav: 980px;
  /* Left rail used by nav + spacing (12 + 220 + 16 = 248px) */
  --left-rail: calc(var(--nav-left) + var(--nav-width) + var(--nav-gap));
}

/* Narrow viewport tweak: add a little breathing room from the edge */
@media (max-width: 1200px) {
  :root { --nav-left: 17px; } /* default 12px + 5px */
}