/* ======================================================
   HEADER
====================================================== */

.header{

    position: fixed;

    inset: 0 0 auto 0;

    height: 84px;

    z-index: 2000;

    background:transparent;


    transition: .45s ease;

}

.header-container{

    width:100%;

    max-width:100%;

    padding:0 48px;

    margin: 0 auto;

    height: 88px;

    display: flex;

    align-items: center;

    justify-content: center;

    position: relative;

}

.header.scrolled{

    background: rgba(10,10,10,.72);

    backdrop-filter: blur(18px);

    -webkit-backdrop-filter: blur(18px);

    box-shadow: 0 8px 30px rgba(0,0,0,.30);

}

.navbar{

    max-width: 1600px;

    margin: auto;

    display: flex;

    justify-content: space-between;

    align-items: center;

    padding: 35px 60px;

}

/* ======================================================
   LOGO
====================================================== */

.logo{

    position: absolute;

    left: 50%;

    transform: translateX(-50%);

    z-index: 2;

}

.logo img{

    display: block;

    width: auto;

    height: 46px;

    object-fit: contain;

}

.header-right{

    display: flex;

    flex-direction: column;

    align-items: flex-end;

    gap: 18px;

}

.phone{

    display: flex;

    align-items: center;

    gap: 6px;

    color: var(--white);

    text-decoration: none;

    font-size: .95rem;

    font-weight: 500;

    letter-spacing: 1px;

    position: absolute;

    right: 48px;

    top: 50%;

    transform: translateY(-50%);

}

.phone i{

    color: var(--gold);

    font-size: 12px;

}




.logo img:hover{

    transform: scale(1.03);

}