
/* ======================================== */
/* HEADER */
/* ======================================== */

.premium-header{

    position:fixed;

    top:0;
    left:0;

    width:100%;

    z-index:9999;

    padding:20px 0;

    transition:.4s ease;
}

/* ======================================== */
/* SCROLL */
/* ======================================== */

.premium-header.scrolled{

    background:
    rgba(255,255,255,.92);

    backdrop-filter:blur(12px);

    -webkit-backdrop-filter:blur(12px);

    box-shadow:
    0 5px 20px rgba(0,0,0,.08);

    padding:15px 0;
}

/* ======================================== */
/* CONTAINER */
/* ======================================== */

.premium-container{

    width:100%;

    padding:
    0
    50px;

    display:flex;

    align-items:center;

    justify-content:space-between;
}

/* ======================================== */
/* LOGO */
/* ======================================== */

.premium-logo{

    display:flex;

    align-items:center;

    flex-shrink:0;
}

.premium-logo img{

    width:150px;

    transition:.3s ease;
}

/* ======================================== */
/* LOGOS */
/* ======================================== */

.logo-color{

    display:none;
}

/* SCROLL LOGOS */

.premium-header.scrolled .logo-white{

    display:none;
}

.premium-header.scrolled .logo-color{

    display:block;
}

/* ======================================== */
/* NAV */
/* ======================================== */

.premium-nav{

    display:flex;

    align-items:center;

    gap:30px;
}

/* ======================================== */
/* LINKS */
/* ======================================== */

.premium-nav a{

    color:#fff;

    font-size:16px;

    font-weight:700;

    position:relative;

    transition:.3s ease;
}

/* SCROLL LINKS */

.premium-header.scrolled .premium-nav a{

    color:#1d1d1d;
}

/* HOVER */

.premium-nav a:hover{

    color:#f15a24;
}

/* ======================================== */
/* BUTTON */
/* ======================================== */

.premium-btn{

    background:#f15a24;

    color:#fff !important;

    padding:
    14px
    28px;

    border-radius:999px;

    display:inline-flex;

    align-items:center;

    justify-content:center;

    font-size:15px;

    transition:.3s ease;
}

.premium-btn:hover{

    transform:translateY(-3px);

    background:#d94716;
}

/* ========================================
LAPTOP
======================================== */

@media(max-width:1400px){

.premium-container{

    padding:
    0
    40px;
}

.premium-nav{

    gap:24px;
}

}

/* ========================================
TABLET
======================================== */

@media(max-width:992px){

.premium-container{

    padding:
    0
    24px;
}

}

