@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&display=swap');

* {margin: 0; padding: 0; list-style-type: none; text-decoration: none; box-sizing: border-box; }
img {max-width: 100%; }
a, p {font-family: Manrope, sans-serif !important; }
.menu_main {width: 100%; position: relative; /*transition: all 0.3s ease;*/ z-index: 999; }
.menu_main.sticky {position: fixed; top: 0; left: 0; background-color: #fff; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); }
.navbar {width: 100%; display: flex; justify-content: space-between; align-items: center; padding: 15px 0px; flex-wrap: wrap; position: relative; }
.logo {display: flex; flex-direction: column; align-items: center; }
.nav_links ul {list-style: none; display: flex; gap: 22px; align-items: center; padding-right: 20px; margin: 0; }
.nav_links li {position: relative; }
.nav_links li a {font-size: 16px; line-height: 26px; text-decoration: none; color: #323232; font-weight: 700; display: inline-block; }
.nav_links ul li ul li {padding: 6px 0; }
.nav_links ul li ul {box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); }
.nav_links .dropdown {display: flex; align-items: center; position: relative; }
.nav_links .dropdown_content {visibility: hidden; transform: translateY(50px); transition: top 0.2s ease-in, opacity 0.3s ease-in, transform 0.3s ease-in; position: absolute; top: 65px; left: 50%; transform: translateX(-44%, 20px); z-index: 100; background: #fff; padding: 20px; min-width: 800px; grid-template-columns: repeat(3, 1fr); gap: 10px 40px; }
.nav_links {margin-left: auto; }
.nav_links li a:active {color: #4481eb !important; }
.nav_links li a:hover {color: #4481eb; }
.dropdown_content.features_grid {display: none; gap: 10px 40px; padding: 20px 30px; background: #ffffff; min-width: 1155px; }
.dropdown_content.features_grid li a {color: #212121; font-size: 16px; font-weight: 500; line-height: 26px; font-style: normal; white-space: nowrap; transition: color 0.2s; text-transform: capitalize; }
.dropdown_content.features_grid li a:hover {text-decoration: underline; }
.nav_links .dropdown:hover .dropdown_content {display: grid; opacity: 1; visibility: visible; transform: translate(-45%, 0); }
#dropdown_icon {display: none; }
.dropdown_content.features-grid li a:hover {color: #027fff; }
.nav_buttons {display: flex; gap: 20px; }
.btn {padding: 10px 25px; border-radius: 150px; font-weight: bold; text-decoration: none; transition: all 0.3s ease; }
.sign_up {background: linear-gradient(to right, #3dbdff, #027fff); color: #fff; border: none; }
.login {border: 1px solid #027fff; color: #027fff; }
.hamburger {display: none; font-size: 26px; cursor: pointer; border: 1px solid #ccc; padding: 6px 10px; border-radius: 6px; }
.features_grid {display: grid; grid-template-columns: repeat(3, 1fr); list-style: none; padding: 0; margin: 0; gap: 10px 30px; }
.features_grid li {padding: 5px 10px; }
.features_grid .features-heading {grid-column: 1 / -1; font-weight: 700; font-size: 20px; line-height: 36px; letter-spacing: .0025em; padding-bottom: 8px; color: #000; border-bottom: 1px solid #000; font-family: Manrope, sans-serif !important; /* margin-bottom: 18px; */ pointer-events: none; }
.nav_links ul li {padding: 20px 0; }

#nav_mobile {
    display: none;
}

/* =============================
    Footer Top  Section CSS
   ============================= */

.footer_top_section {background: url(../images/bottom_banner_back.webp); background-repeat: repeat-x; background-position: 0;background-size: contain; animation: moveBackground 4s ease-in-out infinite alternate; background-position-y: bottom !important; img {display: block; max-width: fit-content; margin: 0 auto; }}
@keyframes moveBackground {0% {background-position: 0 0; } 100% {background-position: 70px 0; } }
.footer_top_main {text-align: center; }
.footer_top_section {.section_heading {margin-bottom: 8px; } p {text-align: center; margin-bottom: 16px; } .button_fill {margin: 40px auto; } }


/* =================================
    Footer Section CSS
   ================================= */
.footer_section {background-color: #000a30; padding: 70px 0 0;
.footer_main {display: flex; justify-content: space-between; padding-bottom: 20px;
h4 {font-size: 17px; font-family: Manrope, sans-serif !important; line-height: 30px; color: #fff; margin-bottom: 8px; }
a {color: #fff; font-size: 14px; line-height: 30px; }
.footer_box {width: 35%;
ul {display: flex; justify-content: space-between; flex-wrap: wrap; li {width: 50%; } } } }
.footer_box_2 {width: 30%; display: flex;
.box_left {width: 50%; ul {flex-direction: column; } }
.box_right {width: 50%; } }
.footer_box_3 {width: 25%; .app {display: flex; gap: 10px; }
.media_footer {margin-top: 8px; display: flex; justify-content: space-between;
a {img {display: block; background: rgba(255, 255, 255, .2); padding: 10px; width: 40px; border-radius: 10px; } } } }
.footer_copy_right {background-color: #0f1b4a; padding: 20px;
p {color: #fff; font-style: normal; font-weight: 600; font-size: 14px; font-family: Manrope; line-height: 18px; } } }

@media (max-width: 1200px) {}


@media (max-width: 1024px) {
    
    .nav_links {width:75%;}
    .nav_buttons {position: absolute;right:0;}}

@media (max-width: 991px) {
    
    .hamburger {display: table; position: absolute; top: 20px; right: 0; }
  .nav_links {flex-direction: column; display: none; width: 100%; height: 80vh; overflow-y: auto; margin-top: 20px; }
  .nav_links ul li {padding: 0; }
  
  /*.nav_links li ul li {border-bottom: none; }*/
  .nav_links li ul li:last-child {border-bottom: none; }
  
  .nav_links li ul {border-top: 1px solid #000; }
  .features_grid .features-heading {display: none; }
  .nav_links.show, .nav_buttons.show {display: flex; }
      .nav_links .dropdown:hover .dropdown_content {display: grid; opacity: 1; visibility: visible; transform: translate(0); }
  .dropdown_toggle {display: flex; align-items: center; gap: 5px; cursor: pointer; }
  .nav_links .dropdown {display: flex; flex-direction: column; align-items: center; position: relative; }
  #dropdown_icon {display: block; cursor: pointer; font-size: 30px; padding: 5px 20px; user-select: none; position: absolute; top: 0px; right: 0; }
  .nav_links ul {flex-direction: column; width: 100%; padding: 0; gap: 0; }
  .nav_links li {width: 100%; border-bottom: 1px solid #ccc; }
  .nav_links ul li ul li {padding: 10px 0; }
  .nav_links li a {width: 100%; padding: 10px 12px; display: block; }
  .dropdown_content {display: none; flex-direction: column; padding-left: 20px; background: #f9f9f9; box-shadow: none; border: none; }
  
  ul.dropdown_content.features_grid.show {gap:0; visibility: visible;}
  
  .dropdown_content.show {display: block !important; position: initial; }
  .dropdown_content.features_grid li a {padding: 0 12px 0px 32px; }
  .nav_links .dropdown_content {transform: translateX(0%); padding: 0; }
  .nav_buttons {top: 24px; right: 60px; display: flex; gap: 10px; z-index: 101; }
  .features_grid {grid-template-columns: 1fr; }
  .dropdown_content.features_grid {display: none; background: transparent; border: none; box-shadow: none; min-width: 200px; border-top: 1px solid #ccc; }
  .nav_links .dropdown:hover .dropdown_content {display: none; }
}


@media (max-width: 768px) {
  
  .footer_top_section {background-size: contain;
  img {display: block; max-width: fit-content; margin: 0 auto; max-width: 450px !important; } }
  .footer_section {.footer_main {display: flex; justify-content: space-between; padding-bottom: 20px; flex-wrap: wrap; }
  .footer_box {width: 48% !important; }
  .footer_box_2 {width: 48%; display: flex; }
  .footer_box_3 {width: 35%; margin-top: 30px; } }
}

@media (max-width: 680px) {

  .footer_top_section {img {max-width: 400px !important; } }
  .footer_section {.footer_box {width: 100% !important; }
  .footer_box_2 {margin-top: 30px; width: 100%; display: flex; }
  .footer_box_3 {width: 49%; margin-top: 30px; } }
}

@media (max-width: 480px) {
    
    #nav_mobile {
        display: block !important;
        border: none;
        max-width: fit-content;
        margin-right: auto;
        margin-top: 15px;
        
        a{
            padding: 5px 30px;
        }
    }
    
    .nav_links {margin-top: 50px;}
    .logo {width: 36%;}
    .nav_buttons {right: 70px;top: 30px;}
    .sign_up, .btn {font-size: 14px;}
    .navbar {padding: 20px 0px;}
    .hamburger {display: table; left: 85%; top: 30px; margin: 0 auto;font-size: 20px;}
    .footer_section {padding: 40px 0 0; }
    .footer_section {.footer_box_3 {width: 70%; margin-top: 30px; }}
    
    .nav_desktop {
        display: none !important;
    }
}