/*==================================================
Aarohan Wealth
Components
Navbar Part 1
==================================================*/
/*==================================
Header
==================================*/
.header{
    position:absolute;
    top:25px;
    left:0;
    width:100%;
    z-index:var(--z-header);
    }
    /*==================================
    Navbar
    ==================================*/
    .navbar{
    background:rgba(255,255,255,.88);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    border:1px solid rgba(255,255,255,.65);
    border-radius:22px;
    padding:16px 28px;
    box-shadow:
    0 12px 45px rgba(15,23,42,.08);
    transition:.4s ease;
    }
    /*==================================
    Scrolled Navbar
    ==================================*/
    .header.sticky{
    position:fixed;
    top:12px;
    animation:slideDown .4s ease;
    }
    .header.sticky .navbar{
    padding:12px 24px;
    box-shadow:
    0 18px 55px rgba(15,23,42,.12);
    }
    /*==================================
    Animation
    ==================================*/
    @keyframes slideDown{
    from{
    opacity:0;
    transform:translateY(-25px);
    }
    to{
    opacity:1;
    transform:translateY(0);
    }
    }
    /*==================================
    Logo
    ==================================*/
    .navbar-brand{
    padding:0;
    }
    .navbar-brand img{
    height:52px;
    width:auto;
    transition:.35s;
    }
    .header.sticky .navbar-brand img{
    height:46px;
    }

    /*==================================================
Aarohan Wealth
Components
Navbar Part 2/4
Navigation Menu
==================================================*/
/*==================================
Navbar Menu
==================================*/
.navbar-nav{
    align-items:center;
    gap:8px;
    }
    .navbar-nav .nav-item{
    position:relative;
    }
    .navbar-nav .nav-link{
    position:relative;
    padding:12px 18px !important;
    font-family:var(--heading-font);
    font-size:.95rem;
    font-weight:700;
    color:var(--dark);
    letter-spacing:.2px;
    transition:var(--transition);
    border-radius:var(--radius-pill);
    }
    /*==================================
    Hover Background
    ==================================*/
    .navbar-nav .nav-link::before{
    content:"";
    position:absolute;
    inset:0;
    background:var(--primary-light);
    border-radius:var(--radius-pill);
    transform:scale(.85);
    opacity:0;
    transition:var(--transition);
    z-index:-1;
    }
    .navbar-nav .nav-link:hover::before,
    .navbar-nav .nav-link.active::before{
    opacity:1;
    transform:scale(1);
    }
    /*==================================
    Gold Underline
    ==================================*/
    .navbar-nav .nav-link::after{
    content:"";
    position:absolute;
    left:18px;
    bottom:8px;
    width:0;
    height:2px;
    background:var(--secondary);
    border-radius:50px;
    transition:.35s ease;
    }
    .navbar-nav .nav-link:hover::after,
    .navbar-nav .nav-link.active::after{
    width:calc(100% - 36px);
    }
    /*==================================
    Active & Hover
    ==================================*/
    .navbar-nav .nav-link:hover,
    .navbar-nav .nav-link.active{
    color:var(--primary);
    }
    /*==================================
    Dropdown Ready
    ==================================*/
    .navbar-nav .dropdown-menu{
    margin-top:18px;
    border:none;
    border-radius:18px;
    padding:14px;
    min-width:240px;
    background:#fff;
    box-shadow:0 20px 60px rgba(15,23,42,.10);
    }
    .navbar-nav .dropdown-item{
    padding:12px 16px;
    border-radius:12px;
    color:var(--text);
    font-weight:600;
    transition:var(--transition);
    }
    .navbar-nav .dropdown-item:hover{
    background:var(--primary-light);
    color:var(--primary);
    }

    /*==================================================
Aarohan Wealth
Components
Navbar Part 3/4
Header Right & Mobile Toggle
==================================================*/
/*==================================
Header Right
==================================*/
.header-right{
    display:flex;
    align-items:center;
    gap:22px;
    margin-left:40px;
    }
    /*==================================
    Phone Card
    ==================================*/
    .header-phone{
    display:flex;
    align-items:center;
    gap:14px;
    }
    .header-phone i{
    width:48px;
    height:48px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:var(--primary-light);
    color:var(--primary);
    font-size:18px;
    transition:var(--transition);
    }
    .header-phone small{
    display:block;
    font-size:.75rem;
    color:var(--text-light);
    line-height:1;
    margin-bottom:4px;
    }
    .header-phone a{
    display:block;
    font-family:var(--heading-font);
    font-size:.98rem;
    font-weight:700;
    color:var(--dark);
    }
    .header-phone:hover i{
    background:var(--primary);
    color:var(--white);
    transform:rotate(-12deg);
    }
    .header-phone:hover a{
    color:var(--primary);
    }
    /*==================================
    Navbar Button
    ==================================*/
    .header-right .btn-theme{
    padding-inline:30px;
    white-space:nowrap;
    box-shadow:var(--shadow-md);
    }
    /*==================================
    Navbar Toggler
    ==================================*/
    .navbar-toggler{
    width:52px;
    height:52px;
    padding:0;
    border:none;
    border-radius:16px;
    background:var(--primary-light);
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    gap:6px;
    box-shadow:none !important;
    }
    .navbar-toggler:focus{
    box-shadow:none;
    }
    .navbar-toggler span{
    display:block;
    width:22px;
    height:2px;
    background:var(--primary);
    border-radius:50px;
    transition:.35s ease;
    }
    .navbar-toggler:hover{
    background:var(--primary);
    }
    .navbar-toggler:hover span{
    background:var(--white);
    }
    /*==================================
    Sticky Effects
    ==================================*/
    .header.sticky .header-phone i{
    width:44px;
    height:44px;
    }
    .header.sticky .btn-theme{
    height:52px;
    }

    /*==================================================
Aarohan Wealth
Components
Navbar Part 4/4
Responsive
==================================================*/
/*==================================
Large Desktop
==================================*/
@media (min-width:1400px){
    .navbar{
    padding:18px 34px;
    }
    .navbar-brand img{
    height:56px;
    }
    }
    /*==================================
    Laptop
    ==================================*/
    @media (max-width:1199px){
    .navbar{
    padding:14px 22px;
    }
    .header-right{
    margin-left:24px;
    gap:16px;
    }
    .header-phone{
    display:none;
    }
    .navbar-nav .nav-link{
    padding:12px 14px !important;
    }
    }
    /*==================================
    Tablet & Mobile
    ==================================*/
    @media (max-width:991px){
    .header{
    top:15px;
    }
    .header.sticky{
    top:10px;
    }
    .navbar{
    border-radius:18px;
    padding:14px 18px;
    }
    .navbar-collapse{
    margin-top:20px;
    padding-top:20px;
    border-top:1px solid var(--border);
    }
    .navbar-nav{
    gap:6px;
    margin-bottom:24px;
    }
    .navbar-nav .nav-link{
    padding:14px 16px !important;
    border-radius:14px;
    }
    .navbar-nav .nav-link::after{
    display:none;
    }
    .navbar-nav .nav-link:hover::before,
    .navbar-nav .nav-link.active::before{
    border-radius:14px;
    }
    .header-right{
    width:100%;
    margin-left:0;
    flex-direction:column;
    align-items:stretch;
    gap:16px;
    }
    .header-phone{
    display:flex;
    justify-content:center;
    padding:16px;
    border:1px solid var(--border);
    border-radius:16px;
    background:var(--background-light);
    }
    .header-right .btn-theme{
    width:100%;
    }
    }
    /*==================================
    Mobile
    ==================================*/
    @media (max-width:767px){
    .header{
    top:12px;
    }
    .navbar{
    padding:12px 16px;
    border-radius:16px;
    }
    .navbar-brand img{
    height:44px;
    }
    .navbar-toggler{
    width:46px;
    height:46px;
    }
    .navbar-toggler span{
    width:20px;
    }
    .header-phone{
    flex-direction:column;
    text-align:center;
    gap:10px;
    }
    .header-phone i{
    width:42px;
    height:42px;
    font-size:16px;
    }
    .header-phone a{
    font-size:.92rem;
    }
    }
    /*==================================
    Small Mobile
    ==================================*/
    @media (max-width:480px){
    .header{
    top:10px;
    }
    .navbar{
    border-radius:14px;
    }
    .navbar-brand img{
    height:40px;
    }
    .navbar-nav .nav-link{
    font-size:.92rem;
    }
    .header-right .btn-theme{
    height:50px;
    font-size:.92rem;
    }
    }

    @media (max-width: 991.98px){
        .navbar-collapse:not(.show){
        display: none !important;
        }
        .navbar-collapse.show{
        display: block !important;
        }
        }   

        