.__envolve_books_sections {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}





.container_library_envolve {
    width: 100%;
    position: absolute;
    left: 50%;
    top: 47%;
    transform: translate(-50%, -50%);
    max-width: 1200px;
    text-align: center;
}

.carousel_library {
    width: 100%;
    overflow: hidden;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    display: flex;
    padding: 40px 0;
    height: 400px;
    position: relative;
    border-top: 1px solid #565137;
    border-bottom: 1px solid #565137;

}

.carousel_library::-webkit-scrollbar {
    display: none;
}


:root {
    --card-width: 180px;
    --gap: 50px;
}



.cards_library_page {
    display: flex;
    gap: var(--gap);

}

.cards_library_page::before,
.cards_library_page::after {
    content: "";
    flex: 0 0 calc(50% - (var(--card-width) / 2));
}

.card_library {
    width: var(--card-width);
    flex: 0 0 var(--card-width);
    border-radius: 28px;
    scroll-snap-align: center;
    scroll-snap-stop: always;

    position: relative;
    cursor: default;
    display: flex;
    align-items: center;
    justify-content: center;
}

.carousel_library_container {
    touch-action: pan-y;
}





.card_library.active {
    transform: scale(1.5);
    transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}


.box_cover_settings {
    width: 200px;
    position: relative;
    left: -2px;
    height: 200px;
    background-position: center center;
    background-size: contain;
    transform: scale(1.4);
    background-repeat: no-repeat;
}


._cover_img_1 {
    background-image: url('/assets/imgs/covers/decored.png');
}

._cover_img_2 {
    background-image: url('/assets/imgs/covers/v13.png');
}

._cover_img_3 {
    background-image: url('/assets/imgs/dd.png');
}




.__container_library_section {

    width: 300px;
    height: 500px;
    display: block;
}





/* CSS */
.__lib_button-button-82-pushable {
    position: relative;
    border: none;
    background: transparent;
    padding: 0;
    cursor: pointer;
    outline-offset: 4px;
    transition: filter 250ms;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
}

.__lib_button-button-82-shadow {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 12px;
    background: hsl(0deg 0% 0% / 0.25);
    will-change: transform;
    transform: translateY(2px);
    transition:
        transform 600ms cubic-bezier(.3, .7, .4, 1);
}


.__lib_button-button-82-front_index_0 {
    display: block;
    position: relative;
    padding: 12px 27px;
    border-radius: 12px;
    font-size: 1.1rem;
    color: white;
    background: #0D0D0D;
    will-change: transform;
    transform: translateY(-4px);
    transition:
        transform 600ms cubic-bezier(.3, .7, .4, 1);
}

.__lib_button-button-82-front_index_1 {
    display: block;
    position: relative;
    padding: 12px 27px;
    border-radius: 12px;
    font-size: 1.1rem;
    color: white;
    background: #BF610F;
    will-change: transform;
    transform: translateY(-4px);
    transition:
        transform 600ms cubic-bezier(.3, .7, .4, 1);
}

.__lib_button-button-82-front_index_2 {
    display: block;
    position: relative;
    padding: 12px 27px;
    border-radius: 12px;
    font-size: 1.1rem;
    color: white;
    background: #592202;
    will-change: transform;
    transform: translateY(-4px);
    transition:
        transform 600ms cubic-bezier(.3, .7, .4, 1);
}

.__lib_button-button-82-front_index_3 {
    display: block;
    position: relative;
    padding: 12px 27px;
    border-radius: 12px;
    font-size: 1.1rem;
    color: white;
    background: #592202;
    will-change: transform;
    transform: translateY(-4px);
    transition:
        transform 600ms cubic-bezier(.3, .7, .4, 1);
}

.__lib_button-button-82-front_index_4 {
    display: block;
    position: relative;
    padding: 12px 27px;
    border-radius: 12px;
    font-size: 1.1rem;
    color: white;
    background: #8C5454;
    will-change: transform;
    transform: translateY(-4px);
    transition:
        transform 600ms cubic-bezier(.3, .7, .4, 1);
}


.__lib_button-button-82-edge_index_0 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 12px;
    background: linear-gradient(to left,
            #643748 0%,
            #613747 8%,
            #683749 92%,
            #583140 100%);
}

.__lib_button-button-82-edge_index_1 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 12px;
    background: linear-gradient(to left,
            #BF3E0F 0%,
            #BF3E0F 8%,
            #BF3E0F 92%,
            #BF3E0F 100%);
}

.__lib_button-button-82-edge_index_2 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 12px;
    background: linear-gradient(to left,
            #260F01 0%,
            #260F01 8%,
            #260F01 92%,
            #260F01 100%);
}



.__lib_button-button-82-pushable:hover {
    filter: brightness(110%);
    -webkit-filter: brightness(110%);
}

.__lib_button-button-82-pushable:hover .__lib_button-button-82-front {
    transform: translateY(-6px);
    transition:
        transform 250ms cubic-bezier(.3, .7, .4, 1.5);
}

.__lib_button-button-82-pushable:active .__lib_button-button-82-front {
    transform: translateY(-2px);
    transition: transform 34ms;
}

.__lib_button-button-82-pushable:hover .__lib_button-button-82-shadow {
    transform: translateY(4px);
    transition:
        transform 250ms cubic-bezier(.3, .7, .4, 1.5);
}

.__lib_button-button-82-pushable:active .__lib_button-button-82-shadow {
    transform: translateY(1px);
    transition: transform 34ms;
}

.__lib_button-button-82-pushable:focus:not(:focus-visible) {
    outline: none;
}

.analog_button_container {
    height: 100%;
    width: 100%;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}


.envolve_analog_button {
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    width: 100%;
    z-index: 1000;
    height: 110px;
}

.page-content-library {
    display: flex;
}