:root{
    --light-color : rgb(19, 59, 222);
    --blue-color :rgb(34, 56, 145);
    --orange-color : rgb(248, 158, 69);
}
*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Poppins', sans-serif;
}

.nav-link:hover{
    color: var(--light-color);
}
.nav-item .nav-link.active{
    color: var(--light-color) !important;}
/* start aboutUs */
.landing-profile{
    padding: 3rem;
    background-color: var(--blue-color);
    color: rgb(255, 255, 255);
}
.landing-dashboard{
    background-color: var(--blue-color);
    color: rgb(255, 255, 255);
    height: 25rem;
}
.landing{
    color: rgb(255, 255, 255);
    height: 25rem;
}
.logout-btn{
    
    padding: 1rem;
text-decoration: none;
color: white;
}
.profile-icon, .login-icon, .register-icon{
display: none;
}

.image{
    border-radius: 20px;
    width: 90%;
}
.story p {
    color: rgba(0, 0, 0, 0.684);
}
.values{
    background-color: rgba(245, 244, 244, 0.721);
    
}.values p{
    color: rgba(0, 0, 0, 0.659);
    
}
.card{
    border: 0px;
    border-radius: 20px;
    height: 17rem;

}
.icon{
    color: var(--orange-color); width: 3rem; height: 3rem ; margin: 20px;
}
.coaches{
    background-color: rgba(245, 244, 244, 0.721);

}
.coach-img {
  width: 25rem;
  height: 25rem;       
  object-fit: cover;   
  border-radius: 20px;
}
.achi{
    background-color: var(--blue-color);
    color: white;
    gap: 5rem;
}
.achi h1{
    display: flex;
    justify-content: center;
}
.achi p{
    color : rgba(241, 244, 255, 0.877);
    font-size: 0.9rem;
    text-align: center;
}
/* end aboutUs */
@media (min-width: 992px) {
  .navbar {
    position: sticky;
    top: 0;
    z-index: 1020; 
  }}


@media screen and (max-width: 768px){
    *{
        font-size: 0.8rem;
    }

}
@media (max-width: 991.98px) {
  /* ADD THIS BLOCK */
  .navbar {
    position: relative !important; /* Forces the nav into the document flow */
    height: auto !important;       /* Allows the nav to grow when menu opens */
    overflow: visible !important;  /* Ensures content isn't cut off */
  }

  /* Your existing code for inner collapse */
  .navbar-collapse {
    position: static !important;
    width: 100%;
  }

  .navbar-nav {
    background-color: white;
    padding: 1rem 0;
  }
}