.my-navbar {
    /*background-color: var(--primary-color);*/
    background-color: transparent;
    font-size: xx-large;
    height: fit-content;
    /*position: absolute;*/
    /*z-index: 999;*/
    z-index: 999;
    padding: 0;
    margin: 0;
    /*margin: 1vi 0 0 0.5vi;*/
    border-radius: 0px;
}

.my-navbar>.container-fluid {
    padding: 0;
}

.navbar-brand {
    display: none;
}

.navbar-nav {
    width: 100%;
    justify-content: space-between;
    align-items: left;
}

.navbar-collapse {
    justify-content: space-between;
}


.nav-link {
    color: #ffffff !important;
    font-size: clamp(1rem, 0.7rem + 0.96vi, 2.5rem);
    letter-spacing: 2px;
    padding: 0;
    height: clamp(5rem, 3rem + 3vi, 7rem);
    align-content: center;
    display: contents;
}

.nav-link:hover {
    background-color: var(--primary-color);
}

/*
================================== NAVBAR : fix on scroll ==================================
*/
body nav#main-nav {
  transition: all 0.6s ease;
  width: 100%;
  position: absolute;
}
body nav#main-nav button.navbar-toggler,
body.scroll-level-2 nav#main-nav button.navbar-toggler{
  position: fixed;
  top: 0;
  right: 0;
  padding: 0px;
  }
body nav#main-nav button#navbar_NoDropdown_Search,
body.scroll-level-2 nav#main-nav button#navbar_NoDropdown_Search {
  position: fixed;
  top: 0;
  right: 0px;
  margin: calc(clamp(3rem, 1.6rem + 4.48vi, 10rem) + 2vi) 0 0 0;
  border-radius: 0px;
  border: 0;
  padding: 0;
  }
/*
================================== NAVBAR : fixed ==================================
*/
button.navbar-toggler {
  display: block !important;
  background-color: var(--primary-color);
  border-radius: 0px;
  border: 0px;
  margin: 1vi 0 0 0;
  }

button.navbar-toggler:hover {
  background-color: var(--primary-color-faded);
}

button.navbar-toggler:focus,
button.navbar-toggler:hover,
button.navbar-toggler:active {
  outline: none;
  box-shadow: none;
  }
#main-nav button#navbar_NoDropdown_Search{
  background-color: var(--primary-color);
  height: clamp(3rem, 1.6rem + 4.48vi, 10rem);
  aspect-ratio: 1 / 1;
  }

#main-nav button#navbar_NoDropdown_Search:hover{
  background-color: var(--primary-color-faded);
}


/*
================================== NAVBAR : toggler ==================================
*/
#ColNavbar {
  padding: 0;
  }
button.c2navbar-toggler {
  padding: 0;
  border: 0px;
  }
.ham {
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: transform 400ms;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
  }
.hamRotate.active {
  transform: rotate(45deg);
  }
.hamRotate180.active {
  transform: rotate(180deg);
  }
.line {
  fill:none;
  transition: stroke-dasharray 400ms, stroke-dashoffset 400ms;
  stroke: #fff;
  stroke-width:5.5;
  stroke-linecap:round;
  }
#hamAlt{
  width: clamp(3rem, 1.6rem + 4.48vi, 10rem);
  }
.ham6 .top {
  stroke-dasharray: 40 172;
  }
.ham6 .middle {
  stroke-dasharray: 40 111;
  }
.ham6 .bottom {
  stroke-dasharray: 40 172;
  }
.ham6.active .top {
  stroke-dashoffset: -132px;
  }
.ham6.active .middle {
  stroke-dashoffset: -71px;
  }
.ham6.active .bottom {
  stroke-dashoffset: -132px;
  }
.ham8 .top {
  stroke-dasharray: 40 160;
  }
.ham8 .middle {
  stroke-dasharray: 40 142;
  transform-origin: 50%;
  transition: transform 400ms;
  }
.ham8 .bottom {
  stroke-dasharray: 40 85;
  transform-origin: 50%;
  transition: transform 400ms, stroke-dashoffset 400ms;
  }
.ham8.active .top {
  stroke-dashoffset: -64px;
  }
.ham8.active .middle {
/*stroke-dashoffset: -20px;*/
  transform: rotate(90deg);
  }
.ham8.active .bottom {
  stroke-dashoffset: -64px;
  }
#navbarNavOffcanvas {
  background-color: var(--primary-color);
  height: 100vh;
  /*width: 100%;*/
  width: fit-content;
  }
.offcanvas-backdrop{
  display: none;
  }
/*
ul#main-menu.navbar-nav .nav-link:hover{
  text-decoration: underline;
  }
  */

/*
================================== NAVBAR ITEMS HOVER EFFECTS / 11.06.25 CA ==================================
*/
#main-menu .nav-link {
  display: inline-block;
  transition: transform 0.3s ease, color 0.3s ease;
  height: fit-content;
  }

#main-menu .nav-link:hover,
#main-menu .nav-link:focus {
  transform: translateX(5px) scale(1.05);
  color: #d10000; /* Optional: change to match your theme */
  }

#main-menu .nav-link:hover,
#main-menu .nav-link:focus {
  transform: translateX(5px) scale(1.05);
  color: #d10000;
  text-shadow: 0 0 2px rgba(0,0,0,0.15);
  }

@media (min-width: 1240px) {
    .navbar-expand-lg .navbar-nav .nav-link {
        padding-right: var(--bs-navbar-nav-link-padding-x);
        padding-left: var(--bs-navbar-nav-link-padding-x);
    }
}