/* ------------------------------------------------------------------------------------------------------------------------------- */

  /* Hide scrollbar in WebKit-based browsers (Chrome, Safari, Edge) */
::-webkit-scrollbar {
    display: none; /* ✅ Hides scrollbar */
}

/* Hide scrollbar in Firefox */
* {
    scrollbar-width: none; /* ✅ Hides scrollbar but allows scrolling */
}

/* Hide scrollbar in Internet Explorer & Edge */
body {
    -ms-overflow-style: none; /* ✅ Hides scrollbar */
}
/* ------------------------------------------------------------------------------------------------------------------------------- */
/* html{
    font-size: calc(14px + (26 - 14) * ((100vw - 300px) / (1600 - 300)));
    }     */
/* ------------------------------------------------------------------------------------------------------------- */

@font-face {
    font-family: 'cnclabFont';
    /* src: url('fonts/AlienInvader') format('alien'); */
    src: url('fonts/AlienInvader.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
  }

  
  html, body{
      font-family: 'Poppins', sans-serif;
      font-size: 1rem;
      width: 100%;
      height: 100vh;
      margin: 0;
      padding: 0;
      display: flex;
      flex-direction: column; /* ✅ Stacks sections vertically */
      background-image: linear-gradient(rgba(4, 9, 30, 0.8), rgba(4, 9, 30, 0.3)), url('images/abstract.jpg');
      background-position: center;
      background-size: cover; 
      /* overflow:hidden; */
    }
    
html, body, button, input, select, textarea {
    font-family: 'Poppins', sans-serif;
    font-size: min(1rem, 16px);
}

body {
    display: flex;
    flex-direction: column;
    height: 100vh; /* ✅ Ensures full screen height */
}

body::-webkit-scrollbar-thumb {
    background-color: #999; /* Color of the thumb */
    border-radius: 10px; /* Rounded corners for the thumb */
  }
  
  /* Customize scrollbar track (the background) */
  body::-webkit-scrollbar-track {
    background-color: #555; /* Color of the track */
    display:flex;
    flex-direction: column;
  }
/* ------------------------------------------ Header --------------------------------------------------- */
    .header-container{
        flex:12%;
        display:flex;
        align-items: center;
        justify-content:space-between;
        box-sizing:border-box;
        margin: 0;
    }
    .image-container-left,
    .image-container-right {
        display:flex;
        flex:30%;
        align-items: center;
        justify-content: center;
        flex:1;
        max-width: 20vw;
        overflow: hidden;
    }
        /* .image-container-left{
        max-width: 15vw;
        margin-left: 5%;
    } */
    .image-container-left img{
        max-height: 6vh;
        object-fit:contain;
    }
    .image-container-right img{
        max-height: 8vh;
    }
    .text-container {
        font-family: 'cnclabFont', sans-serif;
        display: flex;
        font-size: 1.4rem;;
        font-weight:100 ;
        letter-spacing: 0.05em;
        text-align: center;
        justify-content: flex-end;
        color:rgb(250, 249, 245);
        margin-top: 5vh;
        visibility: visible;

        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        text-rendering: optimizeLegibility;
    
    }
/* ------------------------------------------------------------------------------------------------------------------------ */
.nav-menu{
    flex:1%;
    display: flex;
    text-align: center;
    justify-content: right;
    padding-right: 3%;
    background-color: whitesmoke(111, 101, 250, 1);
    
}
ul {
    margin: 0;
    padding: 0; 
    list-style: none; 
    display:flex;
    align-items: right;
}
li {
    margin: 0;
    padding-left: 2vw; 
    list-style: none; 
    display: inline-block;
}
.nav-menu ul li{
    display: inline-block;
}

.nav-menu ul li a{
    color: #efc181;
    text-decoration: none;
    font-size:0.6rem;
    font-weight: 500;
    padding: 0.2vh;
    }
    .nav-menu ul li::after{
        content: '';
        width: 0%;
        height: 2px;
        background: #f44336;
        display: block;
        margin: auto;
        /* transition: 0.5s; */
        transition: width 0.3s ease-in-out;
    }
    .nav-menu ul li:hover::after{
        width: 100%;
    }
    /* .nav-menu ul li a:hover {
        font-size: 0.75rem;
    } */
/* ------------------------------------- Text Box / Content Container ---------------*/
    .content-container{
        flex:85%;
        /* min-height: 83vh; */
        display: flex;
        flex-direction: column;
        box-sizing:border-box; 
        /* background-color: rgba(0, 0, 0, 0.189); */
        border: 2px solid rgba(255, 255, 255, 0.245);
        border-radius: 10px;
        /* color:transparent;
        color: rgba(192, 189, 189, 0.8); */
        justify-content: center;
        overflow-y: auto;
    }
/* ------------------------------------------------------------------------------------------------------------------------ */
    .footer{
        flex:8%;
        /* min-height: 8vh; */
        font-size: 0.6rem;
        font-weight: 400;
        justify-content: center;
        padding-left: 3%;
        text-align:start;
        /* margin-top: 1.2vh; */
        padding-top: 1.2vh;
        color: orange;
        color: white;
        background-color: rgba(11, 4, 91, 0.2);
        margin: 0;
    }
/* ------------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------------- */