:root {
  --brand: #1c74bc;
  --brand-dark: #155d96;
  --brand-light: #e8f2fb;
  --site-dark: #0f2236;
}

body {
  font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
}

.navbar-brand {
  font-size: 1.4rem;
  letter-spacing: -0.5px;
}

/* Brand button */
.btn-brand {
  background-color: var(--brand);
  border-color: var(--brand);
  color: #fff;
}
.btn-brand:hover, .btn-brand:focus {
  background-color: var(--brand-dark);
  border-color: var(--brand-dark);
  color: #fff;
}

/* Brand outline button */
.btn-outline-brand {
  border-color: var(--brand);
  color: var(--brand);
  background-color: transparent;
}
.btn-outline-brand:hover, .btn-outline-brand:focus {
  background-color: var(--brand);
  color: #fff;
}

/* Brand background */
.bg-brand {
  background-color: var(--brand) !important;
}

/* Brand text */
.text-brand {
  color: var(--brand) !important;
}

.card {
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.1) !important;
}

/* Footer links */
.footer-link {
  color: #6c757d;
  text-decoration: none;
}
.footer-link:hover {
  color: var(--brand);
  text-decoration: underline;
}

/* Navbar + footer background */
.navbar,
footer {
  background-color: #fff !important;
  border-bottom: 1px solid #e9ecef;
}

footer {
  border-bottom: none;
  border-top: 1px solid #e9ecef;
}

/* Navbar logo spacing */
.navbar {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}

.accordion-button:not(.collapsed) {
  background-color: var(--brand-light);
  color: #1a1a1a;
}

.accordion-button:focus {
  box-shadow: none;
}

.border-brand {
  border-color: var(--brand) !important;
}

/* Light brand background — used for selected variant highlight */
.bg-brand-light {
  background-color: var(--brand-light) !important;
}

/* Variant option card cursor */
.variant-option {
  cursor: pointer;
  transition: border-color 0.15s, background-color 0.15s;
}
.variant-option:hover {
  border-color: var(--brand) !important;
  background-color: var(--brand-light);
}

/* Hero logo — subtle glow on dark bg */
.hero-logo {
  max-width: 260px;
  filter: drop-shadow(0 4px 24px rgba(28, 116, 188, 0.4));
  opacity: 0.95;
}
