/* Стили для контейнера папок */
.folders-container {
    display: flex;
    justify-content: space-between;
    width: 100%;
    height: auto;
    gap: 20px;
    margin-top: 30px;
}

/* Стили для карточки папки */
.folder-card {
    flex: 1;
    perspective: 1000px;
    height: 100%;
    position: relative;
    aspect-ratio: 1 / 0.75;
}

/* Внутренние стили для лицевой и обратной сторон */
.folder-front, .folder-back {
    position: absolute;
    width: 100%;
    height: auto;
    backface-visibility: hidden;
    transition: transform 0.8s;
    border-radius: 8px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    margin: 0;
}

/* Лицевая сторона */
.folder-front {
    transform: rotateY(0deg);
}

/* Обратная сторона */
.folder-back {
    transform: rotateY(180deg);
}

/* Стили для изображения внутри папки */
.folder-front img, .folder-back img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    width: 100%;
    height: 100%;
}

/* Эффект переворота при наведении */
.folder-card:hover .folder-front {
    transform: rotateY(180deg);
}

.folder-card:hover .folder-back {
    transform: rotateY(360deg);
}