* {
  margin: 0;
   box-sizing: border-box !important;
   transition: ease all 0.50s;

 }

 html, body {
   scroll-behavior: smooth;
   position: relative;
   background-color: #000000;
 }

 /* ------------------------------- ------------Navbar------------------------------------------------- */
 /* Navbar Container */
 .navbar {
   display: flex;
   justify-content: space-between;
   align-items: center;
   background: linear-gradient(90.11deg, #2C98E9 1.97%, #044EA4 117.78%);
   width: 100%;
   height: 104px;
   padding: 0 140px;
   color: white;
   flex-wrap: nowrap;
 }

 /* Logo */
 .logo img {
   width: 278px;
   height: auto;
 }

 /* Nav Right Section */
 .nav-right {
   display: flex;
   align-items: center;
   gap: clamp(1rem, 2vw, 2.5rem);
   flex-wrap: nowrap;
   overflow: hidden;
   
 }

 /* Nav Links */
 .nav-links {
   list-style: none;
   display: flex;
   align-items: center;
   gap: 50px;
   flex-wrap: nowrap;
  
 }

 .nav-links li a {
   color: white;
   text-decoration: none;
   font-family: Inter, sans-serif;
   font-weight: 600;
   font-size: 25px;
   white-space: nowrap;
 }

 /* Account Button */
 .account-btn {
   background-color: white;
   color: #2C98E9;
   font-family: Inter, sans-serif;
   font-weight: 700;
   font-size: 24px;
   width: 254px;
   height: 62px;
   padding: 0.5rem 1rem;
   border: none;
   border-radius: 5px;
   white-space: nowrap;
   cursor: pointer;
 }

 /* Cart Icon */
 .cart-icon {
   width: 39px;
   cursor: pointer;
 }

 /* About */
 .nav-links .dropdown {
   position: relative;
   display: inline-block;
 }

 .nav-links .dropdown-button {
   background-color: transparent;
   color: white;
   padding: 0;
   font-size: 25px;
   font-family: Inter, sans-serif;
   font-weight: 600;
   border: none;
   border-radius: 0;
   cursor: pointer;
   display: inline-flex;
   align-items: center;
   gap: 20px;
 }

 .nav-links .dropdown-icon {
   width: 15px;
   height: 10px;
   margin-top: 5px;
 }

 .nav-links .dropdown-content {
   display: none;
   position: absolute;
   background-color: #2C98E9;
   min-width: 160px;
   box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.2);
   z-index: 1;
   border-radius: 4px;
   overflow: hidden;
 }

 .nav-links .dropdown-content a {
   color: white;
   padding: 10px 14px;
   text-decoration: none;
   font-size: 18px;
   display: block;
   font-family: Inter, sans-serif;
 }

 .nav-links .dropdown-content a:hover {
   background-color: #1565c0;
 }

 .nav-links .dropdown:hover .dropdown-content {
   display: block;
   margin-top: 10px;
 }

 .nav-links .dropdown:hover .dropdown-button {
   background-color: transparent;
   padding: 0;
 }

 /* Mobile Icons - hidden until mobile */
 .mobile-icons {
   display: none;
   gap: 1rem;
 }

 /* Dropdown */
 .mobile-dropdown {
   display: none;
   flex-direction: column;
   background-color: #1e293b;
   position: absolute;
   top: 4.5rem;
   right: 1rem;
   padding: 20px 20px 10px 20px;
   border-radius: 0.5rem;
   z-index: 999;
 }

 .mobile-dropdown a {
   font-size: 18px;
   color: white;
   text-decoration: none;
   font-family: Inter, sans-serif;
   margin-bottom: 15px;
   font-weight: 600;
 }

 .mobile-logo {
   display: none;
 }

 /* RESPONSIVE */

 @media (max-width: 1800px) {

   .navbar {
     padding: 0 70px;
   }

 }

 @media (max-width: 1400px) {

   .navbar {
     padding: 0 30px;
   }

   .nav-links {
     gap: 40px;
   }

   .logo img {
     width: 230px;
   }

   .nav-links li a {
     font-size: 22px;
   }

   .nav-links .dropdown-button {
     font-size: 22px;
   }

   .nav-links .dropdown-button {
     gap: 13px;
   }

   .nav-links .dropdown-icon {
     margin-top: 2px;
   }

 }

 @media (max-width: 1200px) {

   .logo img {
     width: 170px;
   }

   .account-btn {
     font-size: 21px;
     width: 212px;
     height: 58px;
   }

   .nav-links {
     gap: 30px;
   }

   .nav-links li a {
     font-size: 20px;
   }

   .nav-links .dropdown-button {
     font-size: 20px;
   }

   .navbar {
     height: 97px;
   }

   .cart-icon {
     width: 32px;
   }
 }

 @media (max-width: 991px) {

   .logo img {
     width: 134px;
   }

   .navbar {
     padding: 0 20px;
   }

   .navbar {
     height: 88px;
   }

   .nav-links {
     gap: 20px;
   }

   .nav-links .dropdown-button {
     font-size: 18px;
   }

   .nav-links .dropdown-icon {
     width: 10px;
   }

   .nav-links li a {
     font-size: 16px;
   }

   .account-btn {
     font-size: 16px;
     width: 165px;
     height: 45px;
   }

   .cart-icon {
     width: 28px;
   }
 }

 /* ===== Responsive Only for Mobile (Below 768px) ===== */
 @media (max-width: 767px) {
   .nav-links {
     display: none;
   }

   .account-btn {
     display: none;
   }

   .cart-icon {
     display: none;
   }

   .mobile-icons {
     display: flex;
     align-items: center;
     font-size: clamp(1rem, 2vw, 1.5rem);
     color: white;
   }

   .navbar {
     padding: 0 15px 0 23px;
     height: 65px;
   }

   .cart-mobile-icon {
     width: 21px;
   }

   .mobile-icons {
     gap: 26px;
   }

   .logo {
     display: none;
   }

   .mobile-logo {
     display: block;
   }
 }

 @media (max-width: 600px) {
   .mobile-icons {
     gap: 16px;
   }

 }
    .home {
        background-color: #000000;
        color: #ffffff;
       
        padding: 90px 140px;
    }

    p {
        font-family: Inter;
        font-weight: 400;
        font-size: 25px;
        line-height: 32px;
        letter-spacing: 0%;
      
    }

    .inter {
        font-family: "Inter", sans-serif;
        font-optical-sizing: auto;
        font-weight: 400;
        font-style: normal;
    }

    h2.inter {
        font-size: 50px;
        font-weight: 700;
        line-height: 1.2;
        margin-bottom: 20px;
    }

    h4.inter {
        font-size: 28px;
        font-weight: 700;
        margin: 20px 0 10px;
    }

    .ul {
        padding-left: 20px;
    }

    .home li {
        font-size: 22px;
        margin-bottom: 10px;
    }

    /* Responsive Media Queries */
    @media (max-width: 768px) {
        .home {
            padding: 60px 30px;
        }

        p, li {
           font-weight: 400;
font-size: 27px;
line-height: 30px;
letter-spacing: -3%;
        }

        h2.inter {
          font-family: Inter;
font-weight: 700;
font-size: 50px;
line-height: 100%;
letter-spacing: 0%;

        }

        h4.inter {
            font-size: 24px;
        }
    }

    @media (max-width: 430px) {
        .home {
            padding: 40px 20px;
        }

        p, li {
            font-family: Inter;
font-weight: 400;
font-size: 27px;
line-height: 30px;
letter-spacing: -3%;

        }

        h2.inter {
            font-family: Inter;
font-weight: 700;
font-size: 30px;
line-height: 100%;
letter-spacing: 0%;

        }

        h4.inter {
            font-size: 20px;
        }
    }