.siteheader{
padding: 14px 36px;
width:100%;
background-color:#283352;
font-family: "Inter", sans-serif;
font-optical-sizing: auto;
}

.siteheader .innercontent {
display: flex;
justify-content: space-between;
align-items: center;
}
.logo h1{
color:#308CF0;
}
img{
width:75px;
}

.sitemenu ul{
display: flex;
color:white;
align-items: center;
gap:4px;
}

.sitemenu ul li{
    padding: 0 16px;
}

.sitemenu ul li a{font-size:16px;gap:4px;display: flex;color:white;text-decoration:none;}

.login-in i{
    color:white;

}

.login-in{
background: linear-gradient(45deg, #308CF0, #09B2D7);
padding:6px 5px;
border-radius: 4px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-ms-border-radius: 4px;
-o-border-radius: 4px;
}
.menu-toggle{display: none;}
@media (max-width:768px){
.sitemenu{display:none;}
.menu-toggle{font-size:18px;display:block}
}

/* Default desktop styles already work */

.menu-toggle {
display: none; /* Hide by default */
cursor: pointer;
font-size: 24px;
}

/* Responsive Nav */
@media (max-width: 768px) {
  .sitemenu {
display: none;
flex-direction: column;
background-color: #1e1e1e; /* adjust as needed */
position: absolute;
top: 70px; /* below header */
right: 0;
width: 200px;
padding: 10px;
z-index: 1000;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3)
 }

  .sitemenu.show {
    display: flex;
  }

  .sitemenu ul {
    flex-direction: column;
    gap: 10px;
  }

  .sitemenu ul li {
    margin: 10px 0;
  }

  .menu-toggle {
    display: block; /* Show on mobile */
  }
}
/* Mobile Navigation Styles */
@media (max-width: 768px) {
  .sitemenu {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease;
    flex-direction: column;
    background-color: #1e1e1e;
    position: absolute;
    top: 70px; /* adjust based on header height */
    right: 0;
    width: 200px;
    padding: 0 10px;
    z-index: 1000;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
  }

  .sitemenu ul {
    flex-direction: column;
    padding: 10px 0;
  }

  .sitemenu ul li {
    margin: 10px 0;
  }

  .sitemenu.show {
    max-height: 500px; /* enough to fit full menu */
    padding: 10px;     /* re-enable padding on open */
  }

  .menu-toggle {
    display: block;
    cursor: pointer;
    font-size: 24px;
  }
}

.container{max-width: 1320px;margin: auto;}