@import url('https://fonts.googleapis.com/css2?family=Lexend:wght@400;600;700&display=swap');
:root{
  /* palette */
  --brand-red: #B80000;
  --brand-cream: #F5E9E2;
  --brand-blue: #0077B6;
  --brand-navy: #080357;
  --brand-black: #07090F;

  /* bootstrap overrides */
  --bs-primary: var(--brand-blue);
  --bs-danger: var(--brand-red);
  --bs-dark: var(--brand-navy);
  --bs-body-bg: var(--brand-cream);
  --bs-body-color: var(--brand-black);
  --bs-link-color: var(--brand-blue);
  --bs-link-hover-color: color-mix(in srgb, var(--brand-blue) 75%, black 25%);
}

/* basic page colors */
body {
  background-color: var(--bs-body-bg) !important;
  color: var(--bs-body-color) !important;
}

/* navbar adjustments for contrast */
.navbar-dark .navbar-brand {
  color: var(--brand-red) !important;
  font-weight: 700;
  font-size: 1.5rem;
}
.navbar-dark .navbar-brand:hover {
  color: color-mix(in srgb, var(--brand-red) 85%, black 15%) !important;
}
.navbar-dark .navbar-nav .nav-link,
.navbar-dark .navbar-toggler-icon {
  color: var(--brand-cream) !important;
}
.navbar-dark .navbar-nav .nav-link:hover {
  color: var(--brand-red) !important;
}

/* Animated gradient background for header */
@keyframes gradientShift {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

header.bg-dark {
  border-bottom: 4px solid var(--brand-red);
  position: relative;
  overflow: hidden;
}

/* Animated gradient background layer */
header.bg-dark::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(
    135deg,
    #080357 0%,
    #0077B6 25%,
    #B80000 50%,
    #0077B6 75%,
    #080357 100%
  );
  background-size: 200% 200%;
  animation: gradientShift 8s ease infinite;
  z-index: 0;
}

/* Overlay for text readability */
header.bg-dark::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(8, 3, 87, 0.35);
  z-index: 1;
  pointer-events: none;
}

/* Ensure content stays above background */
header.bg-dark > .container {
  position: relative;
  z-index: 2;
}

/* primary / accent tweaks */
.btn-primary {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}
.btn-primary:hover {
  background-color: color-mix(in srgb, var(--bs-primary) 85%, black 15%);
  border-color: color-mix(in srgb, var(--bs-primary) 85%, black 15%);
}

/* red accent buttons */
.btn-danger {
  background-color: var(--brand-red);
  border-color: var(--brand-red);
}
.btn-danger:hover {
  background-color: color-mix(in srgb, var(--brand-red) 85%, black 15%);
  border-color: color-mix(in srgb, var(--brand-red) 85%, black 15%);
}

.badge.bg-danger {
  background-color: var(--brand-red) !important;
  color: var(--brand-cream) !important;
}

/* headings with red accent */
h1, h2, h3 {
  position: relative;
}
h1::before, h2::before {
  content: '';
  position: absolute;
  left: 0;
  bottom: -8px;
  width: 60px;
  height: 3px;
  background-color: var(--brand-red);
}

/* feature boxes red accent */
.feature {
  background: linear-gradient(135deg, var(--brand-red), color-mix(in srgb, var(--brand-red) 70%, var(--brand-blue))) !important;
}

/* offcanvas header contrast */
.offcanvas, .card, .bg-light {
  background-color: #fff;
}
.offcanvas-header {
  border-bottom: 2px solid var(--brand-red);
}
.offcanvas-header .offcanvas-title {
  color: var(--brand-red);
  font-weight: 700;
}

/* card borders and accents */
.card {
  border: 1px solid #ddd;
  border-top: 3px solid var(--brand-red);
}

/* section dividers with red */
hr {
  border-color: var(--brand-red);
  opacity: 0.5;
}

/* badge accents */
.badge.bg-primary {
  background-color: var(--brand-red) !important;
}

/* links and accents */
a.accent-red {
  color: var(--brand-red);
  font-weight: 600;
}
a.accent-red:hover {
  color: color-mix(in srgb, var(--brand-red) 85%, black 15%);
}

/* testimonial/quote section border */
.fst-italic {
  border-left: 4px solid var(--brand-red);
  padding-left: 1rem;
}

/* footer accent */
footer.bg-dark {
  border-top: 4px solid var(--brand-red);
}

/* active nav link */
.nav-link.active {
  color: var(--brand-red) !important;
  font-weight: 600;
}

/* Hero text enhancements */
header.bg-dark .lead {
  font-size: 1.1rem;
  font-weight: 500;
  letter-spacing: 0.3px;
  line-height: 1.8;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
  color: #ffffff !important;
}

/* === NAVBAR LINK STYLING === */
.navbar-dark .navbar-nav .nav-link {
  color: black !important;
  font-size: 1.15rem;             
  font-family: 'Lexend', sans-serif;
  font-weight: 600;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  transition: color 0.2s ease;
}

.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link:focus {
  color: var(--brand-red) !important;
}
/* === NAVBAR BRAND STYLING === */
.navbar-dark .navbar-brand {
  font-family: 'Lexend', sans-serif;
  font-size: 1.7rem;
  letter-spacing: 1px;
  font-weight: 700;
}


/* NAVBAR TEXT STYLING FIX */
.navbar-dark .navbar-nav .nav-link {
  color: #ffffff !important;          /* white */
  font-size: 1.0rem;
  font-family: 'Lexend', sans-serif;
  font-weight: 600;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}

.navbar-dark .navbar-nav .nav-link:hover {
  color: var(--brand-red) !important;  /* keep your red hover */
}

/* BRAND TEXT */
.navbar-dark .navbar-brand {
  color: #ffffff !important;  
  font-family: 'Lexend', sans-serif;
  font-size: 1.7rem;
  letter-spacing: 1px;
  font-weight: 700;
}