 /* -----------------------------------
        TOP INFO BAR (Hide on Scroll Down)
        ------------------------------------*/
 .top-bar {
    background: #0A1A3A;
    color: #fff;
    height: 40px;
    display: flex;
    align-items: center;        /* vertical center FIX */
    padding: 0;                 /* remove padding issue */
    font-size: 14px;
    position: relative !important;
    top: 0;
    width: 100%;
    z-index: 9999;
    transition: top 0.25s ease-in-out;
}

.top-bar.hide {
    margin-top: -40px;
}

.top-bar i,
.top-bar span,
.top-bar a {
    line-height: 40px;      /* fixes icon vertical center */
}


 /* -----------------------------------
        MAIN HEADER / NAVBAR (Always Fixed)
         ------------------------------------*/
 /* Default navbar position when top bar is visible */
 .navbar {
     background: #FFFFFF;
     position: relative !important;
     width: 100%;
     top: 0;
     /* top bar height */
     z-index: 9998;
     transition: top 0.25s ease-in-out;
     border-bottom: 1px solid #e5e7eb;
 }

 .navbar.navbar-scroll {
    position: fixed !important;
    top: 0 !important;
    left: 0;
    width: 100%;
    z-index: 9999;
    background: #ffffff;
    box-shadow: 0 4px 10px rgba(0,0,0,0.15);
}

 .nav-link {
     font-weight: 500;
     color: #0A1A3A !important;
     margin-left: 8px;
 }

 .nav-link:hover {
     color: #19B8C6 !important;
 }
.nav-link.active {
    color: #19B8C6 !important;  /* same as hover */
    font-weight: 600;
}

/* Script CSS */
.script{
    display: none;
}


/* Top bar COLORS */
 .icon-primary {
     color: #19B8C6;
 }

 /* ICON CIRCLE */
 .icon-circle {
     width: 55px;
     height: 55px;
     border-radius: 50%;
     overflow: hidden;
     display: flex;
     align-items: center;
     justify-content: center;
     background: #ffffff;
     border: 2px solid #19B8C6;
 }
 
 /* ICON IMAGE INSIDE CIRCLE */
.icon-circle-img {
    width: 90%;
    height: auto;
}

 /*logo text */
 .logo-text1 {
     font-size: 18px;
     font-weight: 700;
     color: #19B8C6;
 }

 .logo-text2 {
     font-size: 18px;
     font-weight: 700;
     color: #0A1A3A;
 }

 .logo-text3 {
     font-size: 13px;
     color: #B18AE0;
     letter-spacing: 1px;
 }

/* LINE HEIGHT */
 .tight-line {
  line-height: 1.1;
}



 /* ======================================================
        ANIMATED NAVIGATION BORDER
        ====================================================== */
 #navigation::after {
     content: "";
     position: absolute;
     bottom: 0;
     left: 0;
     height: 4px;
     width: 100%;
     background: #062444;
     background: linear-gradient(90deg, #19B8C6, #0A1A3A, #19B8C6);
     background-size: 200% 100%;
     animation: moveLine 8s linear infinite;
 }

 /* Line slow animation */
 @keyframes moveLine {
     0% {
         background-position: 0% 0;
     }

     100% {
         background-position: 200% 0;
     }
 }

 /* -----------------------------------
        FOOTER
        ------------------------------------*/
 footer {
     background: #0A1A3A;
     color: #FFF;
     padding: 40px 0 20px;
 }

 footer a {
     color: #d0d4e4;
     text-decoration: none;
 }

 footer a:hover {
     color: #19B8C6;
 }

 footer h5 {
     font-weight: 700;
     margin-bottom: 15px;
     position: relative;
     padding-bottom: 8px;
 }


 .footer-logo-box {
     width: 60px;
     height: 60px;
     border-radius: 50%;
     border: 2px solid #19B8C6;
     overflow: hidden;
     display: flex;
     justify-content: center;
     align-items: center;
     background: white;
 }

/* Footer Logo img */
 .footer-logo-img {
     width: 90%;
 }
 
 /* FOOTER BRAND TEXT FIX */
 .footer-brand-text {
     line-height: 1.1;
 }

 .footer-company-name {
     font-size: 20px;
     font-weight: 700;
     margin-bottom: 2px;
 }

 .footer-company-name .blue {
     color: #19B8C6;
 }

 .footer-company-name .white {
     color: #ffffff;
 }

 .footer-tagline {
     font-size: 13px;
     color: #E9C985;
     letter-spacing: 1px;
 }

 .footer-links a {
     display: block;
     margin-bottom: 6px;
 }

/* Footer Niche Ka About */
 .text-light1 {
     color: #d0d4e4;
 }


 /* SOCIAL ICONS FIX */
 .footer-social a {
     width: 40px;
     height: 40px;
     border-radius: 6px;
     background: rgba(255, 255, 255, 0.12);
     color: #fff;
     display: flex;
     justify-content: center;
     align-items: center;
     font-size: 18px;
     transition: 0.3s;
 }

 .footer-social a:hover {
     background: hsl(180, 9%, 98%);
 }

 /* 2 Column Useful Links (Less Gap) */
 .footer-links-2col {
     display: grid;
     grid-template-columns: repeat(2, auto);
     column-gap: 25px;
     /* column gap kam */
     row-gap: 6px;
     /* row gap kam */
 }

 .footer-links-2col ul {
     list-style: none;
     padding: 0;
     margin: 0;
 }

 .footer-links-2col li {
     margin-bottom: 6px;
     /* line gap kam */
 }

 .footer-links-2col a {
     color: #d0d4e4;
     text-decoration: none;
     font-size: 15px;
 }

 .footer-links-2col a:hover {
     color: #19B8C6;
 }

 .subscribe-btn {
     background: #19B8C6;
     color: #fff;
     border: none;
     transition: 0.3s ease;
 }

 .subscribe-btn:hover {
     background: #19B8C6;
     color: #fff;
     box-shadow: 0 0 12px rgba(255, 255, 255, 0.4);
     transform: scale(1.05);
 }

 .newsletter-input {
     border: 1px solid #19B8C6;
     transition: 0.3s;
 }

 .newsletter-input:focus {
     border-color: #B18AE0;
     box-shadow: 0 0 6px rgba(177, 138, 224, 0.6);
 }


/* ============================
   MOBILE MENU BEAUTY FIX
==============================*/
@media (max-width: 768px) {

    /* Menu container */
    #menu {
        background: #ffffff;
        padding: 15px 0;
        border-top: 3px solid #19B8C6;
        box-shadow: 0 4px 12px rgba(0,0,0,0.08);
        border-radius: 0 0 12px 12px;
        margin-top: 10px;
    }

    /* Fix menu open spacing */
    .navbar-collapse {
        background: #ffffff !important;
        padding-top: 12px;
    }

    /* Each menu item box */
    .navbar-nav .nav-item {
        width: 100%;
    }

    .navbar-nav .nav-link {
        display: block;
        width: 92%;
        margin: 6px auto;
        padding: 12px 18px;
        background: #F6F8FC;
        border-radius: 8px;
        border: 1px solid #E2E8F0;
        color: #0A1A3A !important;
        font-weight: 600;
        font-size: 15px;
        text-transform: uppercase;
        transition: 0.3s ease;
    }

    /* Active link highlight */
    .navbar-nav .nav-link.active {
        background: #19B8C6 !important;
        color: #ffffff !important;
        border-color: #19B8C6;
    }

    /* Hover effect */
    .navbar-nav .nav-link:hover {
        background: #19B8C6 !important;
        color: #ffffff !important;
        border-color: #19B8C6;
    }
}


 /* Mobile → also 2 columns */
 @media (max-width: 576px) {
     .footer-links-2col {
         grid-template-columns: repeat(2, 1fr);
         /* mobile me bhi do column */
         column-gap: 15px;
         row-gap: 4px;
     }
 }

 /* MOBILE → hide info bar */
 @media (max-width: 768px) {
     .top-bar {
         display: none !important;
     }

     .navbar {
         top: 0 !important;
     }
 }
 
 
 /* Mobile only */
@media (max-width: 991px) {
  #navigation {
    position: sticky !important;
    top: 0;
  }
}
