.sidebar {
    width: 350px;
    height: 100%;
    padding: 150px 40px 20px;

    position: fixed;
    top: 0;
    right: -350px;
    z-index: 9;

    background-color: var(--white);
    box-shadow: 0 4px 20px 0 rgba(14, 56, 60, 0.10);

    transition: all .2s ease;
}

.sidebar.opened {
    right: 0;
}

.sidebar__menu {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 40px;
}

.sidebar__menu-item {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.sidebar__menu-item > a {
    font-size: 18px;
    font-weight: 700;
    color: var(--text-color);

    transition: all .2s ease;
}

.sidebar__menu-item > a:not(:last-of-type) {
    pointer-events: none;
}

.sidebar__menu-item:hover > a {
        color: var(--green);
    }

.sidebar__submenu {
    height: 0;
    opacity: 0;
    overflow: hidden;
    transition: margin-top .2s ease, opacity .4s ease;

    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.sidebar__menu-item.active .sidebar__submenu {
        height: auto;
        margin-top: 10px;
        opacity: 1;
    }

.sidebar__menu-item:last-child {
    background: var(--green-gradient);
    cursor: pointer;
}

.sidebar__menu-item:last-child > a {
    padding: 12px 30px;

    background: var(--white);
    background-clip: text;

    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}