/*====================================================
                    NAVBAR
====================================================*/

.navbar{

    width:100%;
    background:var(--surface);

    box-shadow:var(--shadow);

    position:sticky;

    top:0;

    z-index:1000;

}

.navbar .container{

    max-width:1400px;

    margin:auto;

    padding:0 25px;

    height:105px;

    display:flex;

    align-items:center;

    justify-content:space-between;

}


/* Logo */

.logo img{

    height:125px;

    width:auto;

    display:block;

}

/* Menu */

.menu{

    display:flex;

    align-items:center;

    gap:28px;

    list-style:none;

}

.menu a{

    text-decoration:none;

    color:var(--text);

    font-size:13px;

    font-weight:600;

    text-transform:uppercase;

    transition:.25s;

}

.menu a:hover{

    color:var(--primary);

}

.menu .active{

    color:var(--primary);

}

/* Partie droite */

.navbar-right{

    display:flex;

    align-items:center;

    gap:18px;

}

/* Boutons icônes */

.icon-btn{

    width:36px;

    height:36px;

    border:none;

    border-radius:50%;

    background:#f7f3ee;

    cursor:pointer;

    transition:.25s;

}

.icon-btn:hover{

    background:var(--primary);

    color:white;

}

/* Utilisateur */

.user{

    display:flex;

    align-items:center;

    gap:10px;

    cursor:pointer;

}

.user img{

    width:36px;

    height:36px;

    border-radius:50%;

    object-fit:cover;

}

.user span{

    font-size:13px;

    font-weight:600;

}