:root {
  --primary-bg-color: #14679f; /* keep in sync with $primary */
  --primary-text-color: white;
  --navbar-height: 80px;
  --page-margin-left: 125px;
  --navbar-margin-left: 75px;
  --max-width-navbar: 1800px;
  --max-width-container: 2000px;
}

.navbar-custom {
  background-color: var(--primary-bg-color);
  min-height: var(--navbar-height);
}

/* ... keep your navbar link/dropdown rules ... */

.navBarMargin {
  margin-left: var(--navbar-margin-left);
}

.maxWidthNavBar {
  max-width: var(--max-width-navbar);
}

.maxWidthContainer {
  max-width: var(--max-width-container);
}

.defaultMargin {
  margin-left: var(--page-margin-left);
}

body {
  padding-top: var(--navbar-height); /* 80px */
}

/* optional in custom.css */
.navbar-custom .btn.nav-link {
  border: 0;
  background: transparent;
  text-decoration: none;
}

/* Brand surfaces (keep in sync with navbar / $primary) */
.bg-brand {
  background-color: var(--primary-bg-color);
  color: var(--primary-text-color);
}

.text-brand {
  color: var(--primary-bg-color);
}

/* Space above site footer for short pages (login, admin, etc.) */
.page-block {
  margin-bottom: 3rem;
}

body.full-bleed {
  padding-top: 2.5rem; /* 72px + 1.5rem */
}

/* Full-bleed marketing pages: footer edge-to-edge */
body.full-bleed .site-footer-inner {
  padding-left: 1rem;
  padding-right: 1rem;
}

body.full-bleed .blog-shell {
  padding-top: 0.5rem;
}

body.full-bleed .blog-hero {
  margin-bottom: 2rem; /* optional; doesn't affect nav gap */
}

body.full-bleed .blog-hero__breadcrumb {
  margin-bottom: 1.25rem; /* was 1.5rem */
}

/* Existing app-specific overrides stay as they are */