/**
 * Reusable Cover Fan component.
 */

.ncnms-cover-fan {
    position: relative;
}

.ncnms-cover-fan--single {
    width: min(250px, 100%);
    aspect-ratio: 17 / 22;
    margin-inline: auto;
}

.ncnms-cover-fan--single .ncnms-cover-fan__item {
    left: 50%;
    bottom: 0;
    width: 100%;
    z-index: 1;
    transform: translateX(-50%);
}

.ncnms-cover-fan--hero_fan {
    width: min(460px, 100%);
    aspect-ratio: 46 / 34;
    margin-inline: auto;
}

.ncnms-cover-fan__item {
    position: absolute;
    left: var(--ncnms-cover-left, 50%);
    bottom: var(--ncnms-cover-lift, 0);
    width: 39%;
    z-index: var(--ncnms-cover-z, 1);
    transform:
        translateX(-50%)
        rotate(var(--ncnms-cover-rotation, 0deg))
        scale(var(--ncnms-cover-scale, 1));
    transform-origin: bottom center;
}

.ncnms-cover-fan__item img {
    display: block;
    width: 100%;
    height: auto;
    box-shadow: 0 20px 35px rgba(0, 0, 0, .15);
}

@media (max-width: 600px) {
    .ncnms-cover-fan--hero_fan {
        width: min(360px, 100%);
    }

    .ncnms-cover-fan__item {
        width: 40%;
    }
}
