body {
        background: #000;
        font-family: 'museo-sans', sans-serif;
        font-weight: 500;
    }

    .navbar {
        padding: 20px 0;
    }

    .navbar-brand img {
        width: 150px;
    }

    .main-wrapper {
        height: 100vh;
        display: flex;
        flex-direction: column;
        z-index: 3;
        position: relative;
    }

    .body-content {
        flex: 1 0 0;
        display: flex;
        align-items: flex-end;
    }

    .video-bg {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        z-index: 1;
        opacity: 1;
    }

    img.video-overlay {
        position: fixed;
        top: 0px;
        left: 0px;
        width: 100%;
        height: 100%;
        object-fit: cover;
        z-index: 2;
        opacity: 1;
    }
    .btns-bannner{
        display: flex;
        justify-content: flex-end;
        gap: 24px;
        
    }
    .btn-blue {
        color: #000;
        background-color: #33C2FF;
        transition: all 0.2s ease;
        border-radius: 9999px;
        box-shadow: none;
        text-decoration: none;
        padding: calc(.667em + 2px) calc(1.333em + 2px);
        font-size: 1.125em;
        display: block;
        text-align: center;
        word-break: break-word;
    }
    .btn-blue:hover{
        background-color: #61d0ff;
    }

    .btn-watch-demo .wp-element-button {
        color: #fff;
        padding: 10px 24px 10px 54px;
        background: #09132C;
        transition: all 0.2s ease;
        align-content: center;
        box-sizing: border-box;
        cursor: pointer;
        display: block;
        height: 100%;
        text-align: center;
        word-break: break-word;
        border-radius: 9999px;
        text-decoration: none;
        font-size: 18px;
    }

    .btn-watch-demo {
        padding: 3px; /* border thickness */
        background: linear-gradient(137deg, #FFC94F 1.72%, #009FE3 46.27%, #9778E0 85.96%);
        border-radius: 999px;
        display: block;
        transition: background-position 0.5s ease;
        background-size: 200% 200%; /* important for animation */
        background-position: 0% 50%;
        transition: all 0.2s ease;
    }

    .btn-watch-demo:hover .wp-element-button {
        color: #ffffffda;
        background: #09132ce1;
    }

    .btn-watch-demo:hover .wp-element-button svg {
        color: #ffffffda;
    }

    .btn-watch-demo .wp-element-button svg {
        position: absolute;
        margin-left: -39px;
    }

    .btn-watch-demo:hover {
        background-position: 100% 50%;
        /* transform: translateY(-2px); */
    }

    .btn-group {
        justify-content: flex-end;
    }

    .sign-in-btn:hover {
        opacity: .9;
    }

    .main-heading {
        font-size: 3rem;
        font-weight: 700;
    }

    .Font-20-500 {
        font-size: 20px;
        font-weight: 500;
        line-height: 28px; /* 140% */
        opacity: .7;
    }

    .nav-link {
        line-height: 20px; /* 142.857% */
        text-decoration: none;
        color: #fff;
        opacity: .7;
    }

    .nav-link:hover {
        opacity: 1;
        color: #fff;
    }

    .footer-link {
        color: rgba(211, 212, 233, 0.70);
        line-height: 20px; /* 142.857% */
        text-decoration: none;
        margin-left: 30px;
    }

    .footer-link:hover {
        color: #fff;
    }

    .body-text {
        color: rgba(211, 212, 233, 0.70);
    }

    .footer-blk {
        border-top: 1px solid rgba(211, 212, 233, 0.20);
    }

    .btn-large-signup {
        display: flex;
        width: 400px;
        height: 60px;
        padding: 6px 22px 6px 16px;
        align-items: center;
        gap: 16px;
        border-radius: 85px;
        background: rgba(114, 106, 122, 0.20);
        font-size: 16px;
        color: #000;
        text-decoration: none;
        transition: all 0.4s;
        border: 1px solid rgba(114, 106, 122, 0.00);
    }

    .btn-large-signup:hover {
        background: rgba(114, 106, 122, 0.30);
    }

    .btn-large-signup.mk-btn {
        background: #33C2FF;
    }

    .btn-large-signup.mk-btn:hover {
        background: #33c2ffcc;
    }

    .get-started-modal-cnt {
        display: flex;
        flex-direction: column;
        gap: 20px;
        align-items: center;
        padding-bottom: 48px;
    }

    .modal-backdrop {
        background-color: rgba(0, 0, 0, 0.4); /* Adjust darkness */
        backdrop-filter: blur(8px); /* Blur effect */
        -webkit-backdrop-filter: blur(8px); /* Safari support */
    }
    .banner-link {
        display: flex;
        gap: 43px;
        margin-top: 24px;
    }
    .banner-link .nav-link {
        color: #33C2FF;
        opacity: 1;
    }
    .banner-link .nav-link:hover {
        color: #33C2FF;
        opacity: .7;
    }


/* Large devices ≥991px */

@media (max-width: 991px) {
  .btns-bannner { flex-direction: column; }
  .mobile-nav-fix{display: flex; flex-basis: auto;}
  .navbar-collapse .navbar-nav{flex-direction: row;}
}

@media (min-width: 767px) {
    .btns-bannner .navbar-nav{display: none;}
}

@media (max-width: 767px) {
  .footer-link {margin-left: 0; margin-right: 24px;}
  .footer-blk ul.list-inline{ margin-top: 20px;}
  .main-wrapper{height: auto;}
  .body-content{margin-top: 70px;}
  .navbar-brand img {width: 100px;}
  .btns-bannner{margin-top: 100px;}
  .navbar-collapse .navbar-nav{display: none;}
  .main-wrapper{padding: 0 12px;}
  .main-heading{font-size: 2rem;}
  .Font-20-500{font-size: 16px; line-height: 22px;}
  .footer-blk{font-size: 14px;}
}