.top-header{

    z-index: 99999999;
}
.other-links a{
    font-size: 1rem!important;
}
.other-links li {
    position: relative;
    display: inline-block;
    padding-bottom: 4px;
    cursor: pointer;
    transition: color 0.3s ease-in-out !important;
}

.other-links li a {
    color: inherit !important;
    text-decoration: none !important;
    transition: color 0.3s ease-in-out !important;
}

/* underline */
.other-links li::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0%;
    height: 2px;
    background-color: #0b6db2;
    transition: width 0.35s ease-in-out !important;
    border-radius: 3px;
    cursor: pointer;
}

/* Hover Effect */
.other-links li:hover {
    color: #0b6db2 !important;
    cursor: pointer;
}

.other-links li:hover::after {
    width: 100%;
}

/* ====== Mobile overlay menu ====== */
.other-links-mobile {
    position: fixed;
    inset: 0; /* top:0; right:0; bottom:0; left:0 */
    background: #020617; /* dark navy feel */
    z-index: 99999999;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    padding-top: 4rem;
    padding-bottom: 2rem;
    opacity: 0;
    transform: translateY(-10px);
    pointer-events: none;
    transition: opacity 0.25s ease, transform 0.25s ease;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.other-links-mobile.show {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

/* Make body not scroll when menu open */
body.no-scroll {
    overflow: hidden;
}

/* Mobile menu links */
.other-links-mobile .navbar-nav {
    text-align: center;
}

.other-links-mobile .nav-item a {
    font-size: 1.2rem;
    font-weight: 500;
    color: #f9fafb;
    text-decoration: none;
    padding: 0.5rem 1rem;
    display: inline-block;
    border-radius: 999px;
    transition: background 0.2s ease, transform 0.15s ease;
}

/* Base item styling */
.other-links-mobile li {
    position: relative;
    display: block;
    text-align: center;
    cursor: pointer;
    transition: color 0.3s ease-in-out !important;
}

/* Ensure all anchors inherit styling */
.other-links-mobile li a {
    color: inherit !important;
    text-decoration: none !important;
    font-size: 1.1rem;
    transition: color 0.3s ease-in-out !important;
}

/* Underline animation */
.other-links-mobile li::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 4px;
    transform: translateX(-50%);
    width: 0%;
    height: 2px;
    background-color: #0b6db2;
    transition: width 0.35s ease-in-out !important;
    border-radius: 3px;
}

/* Hover / tap feedback */
.other-links-mobile li:hover,
.other-links-mobile li:active {
    color: #0b6db2 !important;
}

.other-links-mobile li:hover::after,
.other-links-mobile li:active::after {
    width: 60%; /* smaller underline for mobile aesthetics */
}


/* Close button inside mobile menu */
.other-links-mobile .close-btn-mobile {
    background: transparent !important;
}

/* ====== Cool toggle buttons (open & close) ====== */
.cool-toggle-btn {
    border: none;
    outline: none;
    /*background: #0ea5e9;*/
    background: none;
    color: #0074c1;
    border-radius: 999px;
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    /*box-shadow: 0 10px 25px rgba(14, 165, 233, 0.35);*/
    transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
    cursor: pointer;
}

.cool-toggle-btn i {
    font-size: 1.1rem;
}

.cool-toggle-btn:hover {
    background: #0284c7;
    transform: translateY(-1px) scale(1.03);
    box-shadow: 0 14px 30px rgba(14, 165, 233, 0.45);
}

.cool-toggle-btn:active {
    transform: translateY(1px) scale(0.98);
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.55);
}

/* ====== Responsive behaviour ====== */
@media (max-width: 991.98px) {
    /* Hide desktop links on mobile */
    .other-links {
        display: none !important;
    }
}

@media (min-width: 992px) {
    /* Hide mobile overlay completely on desktop */
    .other-links-mobile {
        display: none !important;
    }
}