@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@100..700&display=swap");

* {
  font-family: "IBM Plex Mono", monospace;
}

/* Navbar -- Start */
/* This will ensure that the Home section is always scrolled into view when the page loads. */
#home:target {
  scroll-margin-top: 80px; /* Adjust based on your navbar height */
}

.navbar .navbar-toggler {
  border: none;
}

.navbar.navbar-expand-lg {
  position: fixed !important;
  justify-content: flex-start;
  top: 0;
  width: 100%;
}

.header.fixed {
  background: #010101;
  z-index: 10;
  transition: background 0.01s ease-in-out;
}

.navbar.navbar-expand-lg .navbar-nav {
  gap: 20px;
}

.navbar_brand {
  text-decoration: none;
  color: white;
  margin-top: 25px;
  font-size: 21px;
}

img.logo {
  padding-top: 25px;
}

.nav-item .nav-link {
  font-size: 17px;
  font-weight: 700;
  color: #ffffff !important;
  margin-top: 20px;
  text-decoration: none;
  padding-bottom: 5px;
  transition: color 0.3s ease-in-out;
  text-decoration: 0.3s ease-in-out;
}

.nav-item .nav-link:hover {
  color: white !important; /* Ensure hover color is white */
}

.nav-item .nav-link.active {
  border-bottom: 3px solid white; /* Thicker underline */
  font-weight: bold;
  color: white !important; /* Ensure text color remains white when active */
}

nav.fixed a {
  color: white !important; /* Ensure sticky navbar links are white */
}

/* Navbar -- End */

/* Smooth Scrolling */
html {
  scroll-behavior: smooth;
}

/* Active Section Underline Effect */
body {
  position: relative;
}

.section {
  padding-top: 80px; /* Adjust for navbar height */
}

.section:target {
  outline: none;
}

/* Scroll-Based Underline Activation */
.navbar-nav .nav-item a {
  transition: text-decoration 0.3s ease-in-out;
}

/* Responsive -- Start */

/* Responsive -- End */