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

.site-header{

    position:fixed;

    top:0;
    left:0;

    width:100%;

    z-index:1000;

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

    background:rgba(5,5,5,.45);

    border-bottom:1px solid rgba(255,255,255,.05);

    transition:.35s ease;

}

/*====================================================
SCROLLED
====================================================*/

.site-header.scrolled{

    background:rgba(0,0,0,.88);

    border-bottom:1px solid rgba(255,255,255,.08);

    box-shadow:0 10px 35px rgba(0,0,0,.35);

}

/*====================================================
CONTAINER
====================================================*/

.header-container{

    max-width:1440px;

    margin:auto;

    padding:22px 60px;

    display:flex;

    align-items:center;

    justify-content:space-between;

    transition:.35s;

}

.site-header.scrolled .header-container{

    padding:16px 60px;

}

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

.logo{

    display:flex;

    align-items:center;

    gap:18px;

    text-decoration:none;

}

.logo img{

    width:64px;

    height:64px;

    object-fit:contain;

    transition:.35s ease;

}

.site-header.scrolled .logo img{

    width:54px;

    height:54px;

}

.logo-text{

    display:flex;

    flex-direction:column;

}

.logo-title{

    color:#ffffff;

    font-family:"Cinzel",serif;

    font-size:18px;

    font-weight:600;

    letter-spacing:2px;

}

.logo-subtitle{

    color:#D4AF37;

    font-size:11px;

    letter-spacing:3px;

    text-transform:uppercase;

    margin-top:4px;

}

/*====================================================
NAVIGATION
====================================================*/

.main-nav{

    display:flex;

    align-items:center;

    gap:42px;

}

.nav-link{

    position:relative;

    color:#d7d7d7;

    text-decoration:none;

    font-size:14px;

    font-weight:500;

    letter-spacing:1px;

    transition:.3s;

}

.nav-link:hover{

    color:#D4AF37;

}

.nav-link::after{

    content:"";

    position:absolute;

    left:0;

    bottom:-8px;

    width:0;

    height:2px;

    background:#D4AF37;

    transition:.35s;

}

.nav-link:hover::after{

    width:100%;

}

/*====================================================
RIGHT SIDE
====================================================*/

.header-actions{

    display:flex;

    align-items:center;

    gap:18px;

}

/*====================================================
LANGUAGE
====================================================*/

.lang-btn{

    width:42px;

    height:42px;

    border:1px solid rgba(255,255,255,.12);

    border-radius:50%;

    background:transparent;

    color:#ffffff;

    cursor:pointer;

    font-size:13px;

    transition:.3s;

}

.lang-btn:hover{

    background:#D4AF37;

    color:#000000;

}

/*====================================================
REQUEST BUTTON
====================================================*/

.contact-btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:14px 28px;

    border:1px solid #D4AF37;

    color:#D4AF37;

    text-decoration:none;

    text-transform:uppercase;

    letter-spacing:2px;

    font-size:12px;

    font-weight:600;

    transition:.35s;

}

.contact-btn:hover{

    background:#D4AF37;

    color:#000;

    transform:translateY(-2px);

    box-shadow:0 10px 25px rgba(212,175,55,.30);

}

/*====================================================
RESPONSIVE
====================================================*/

@media(max-width:1200px){

    .main-nav{

        gap:28px;

    }

}

@media(max-width:992px){

    .main-nav{

        display:none;

    }

    .header-container{

        padding:20px 28px;

    }

}

@media(max-width:768px){

    .header-container{

        padding:18px 20px;

    }

    .logo img{

        width:54px;

        height:54px;

    }

    .logo-title{

        font-size:16px;

    }

    .logo-subtitle{

        font-size:10px;

    }

    .contact-btn{

        display:none;

    }

}