/* ==========================================
   Top Bar
========================================== */

:root{
    --ws-primary:#AA2D44;
    --ws-white:#ffffff;
    --ws-black:#222222;
    --ws-border:#ececec;
    --ws-container:1320px;
}

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{
    font-family:system-ui,-apple-system,sans-serif;
    color:var(--ws-black);
    background:#fff;
}

.ws-container{
    width:100%;
    max-width:var(--ws-container);
    margin:auto;
    padding:0 20px;
}

.ws-topbar{
    background:var(--ws-primary);
    color:var(--ws-white);
    height:40px;

    display:flex;
    align-items:center;
    justify-content:center;
}

.ws-topbar-text{

    font-size:14px;

    font-weight:500;

    text-align:center;

    line-height:1;
}
/* ==========================================
   Header
========================================== */

.ws-header{

    background:#fff;

    border-bottom:1px solid var(--ws-border);

}

.ws-header-wrapper{

    display:flex;

    align-items:center;

    justify-content:space-between;

    height:80px;

}
.ws-header-actions{
    display:flex;
    align-items:center;
    gap:15px;
}

.ws-search-btn,
.ws-cart-btn{
    display:flex;
    align-items:center;
    justify-content:center;

    width:42px;
    height:42px;

    border:none;
    border-radius:50%;

    background:#f5f5f5;
    color:var(--ws-heading);

    cursor:pointer;
    transition:var(--ws-transition);
}

.ws-search-btn:hover,
.ws-cart-btn:hover{
    background:var(--ws-primary);
    color:#fff;
}

.ws-icon svg{
    width:22px;
    height:22px;

    stroke:currentColor;
    stroke-width:2;

    fill:none;
}
.ws-logo img{

    max-height:55px;

    width:auto;

}

.ws-site-title{

    text-decoration:none;

    color:var(--ws-black);

    font-size:28px;

    font-weight:700;

}

.ws-navigation{

    flex:1;

    display:flex;

    justify-content:center;

}

.ws-menu{

    display:flex;

    list-style:none;

    gap:35px;

}

.ws-menu li{

    list-style:none;

}

.ws-menu a{

    text-decoration:none;

    color:var(--ws-black);

    font-size:15px;

    font-weight:500;

    transition:.3s;

}

.ws-menu a:hover{

    color:var(--ws-primary);

}

.ws-header-actions{

    display:flex;

    align-items:center;

    gap:15px;

}

.ws-search-btn,
.ws-cart-btn{

    width:42px;

    height:42px;

    border:none;

    border-radius:50%;

    background:#f5f5f5;

    cursor:pointer;

    font-size:18px;

    transition:.3s;

}

.ws-search-btn:hover,
.ws-cart-btn:hover{

    background:var(--ws-primary);

    color:#fff;

}