.nova-section {
    width: 100%;
    overflow: hidden;

    background: #31597d;
}


.nova-slider {
    position: relative;

    width: 100%;

    display: grid;

    overflow: hidden;
}

.nova-slide {
    position: relative;

    grid-area: 1 / 1;

    width: 100%;

    opacity: 0;
    visibility: hidden;

    pointer-events: none;

    transition:
        opacity 1s ease,
        visibility 1s ease;
}


.nova-slide.active {
    opacity: 1;
    visibility: visible;

    pointer-events: auto;
}

.nova-image {
    width: 100%;
}


.nova-image picture {
    display: block;
    width: 100%;
}


.nova-image img {
    display: block;

    width: 100%;
    height: auto;

    object-fit: cover;
}


.nova-content {
    position: absolute;

    left: 5%;
    right: 5%;

    bottom: 4.5%;

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

.nova-text {
    width: 40%;

    color: #ffffff;

    font-family: 'Avenir';
	
	font-weight: normal;

    font-size:
        clamp(
            0.7rem,
            1vw,
            0.95rem
        );

    line-height: 1.3;

    font-weight: 400;
}


.nova-text p {
    margin: 0 0 1rem;
}


.nova-text p:last-child {
    margin-bottom: 0;
}


.nova-controls {
    position: absolute;

    left: 50%;
    bottom: 0;

    transform: translateX(-50%);

    display: flex;

    align-items: center;

    gap: clamp(
        0.7rem,
        1.2vw,
        1rem
    );
}



.nova-controls button {
    position: relative;

    width:
        clamp(
            2rem,
            3vw,
            2.7rem
        );

    aspect-ratio: 1 / 1;

    border: 0.1rem solid #eadbc7;

    border-radius: 50%;

    background: transparent;

    padding: 0;

    cursor: pointer;

    transition:
        background-color 0.25s ease,
        transform 0.25s ease;
}

.nova-controls button::before {
    content: "";

    position: absolute;

    top: 50%;

    width: 0.5rem;
    height: 0.5rem;

    border-top: 0.12rem solid #eadbc7;
    border-right: 0.12rem solid #eadbc7;
}

.nova-prev::before {
    left: 54%;

    transform:
        translate(-50%, -50%)
        rotate(-135deg);
}

.nova-next::before {
    left: 46%;

    transform:
        translate(-50%, -50%)
        rotate(45deg);
}


.nova-controls button:hover {
    background:
        rgba(234, 219, 199, 0.15);

    transform: scale(1.07);
}


@media (min-width: 1025px) {

    .nova-content {
        left: 5%;
        right: 5%;

        bottom: 9%;
    }


    .nova-text {
        width: 39%;
    }


    .nova-controls {
        left: 50%;
    }

}


@media (max-width: 1024px) and (orientation: portrait) {

    .nova-slide {
        display: flex;

        flex-direction: column;
    }

    .nova-image {
        width: 100%;
    }


    .nova-image picture {
        display: block;

        width: 100%;
    }


    .nova-image img {
        display: block;

        width: 100%;
        height: auto;

        object-fit: contain;
    }

    .nova-content {
        position: relative;

        left: auto;
        right: auto;
        bottom: auto;

        width: 100%;

        background: #31597d;

        display: block;

        padding:
            clamp(2rem, 5vh, 3rem)
            12%
            clamp(2rem, 5vh, 3rem);
    }

    .nova-text {
        width: 100%;

        font-size:
            clamp(
                0.72rem,
                2.5vw,
                0.95rem
            );

        line-height: 1.4;
    }


    .nova-text p {
        margin-bottom:
            clamp(
                0.8rem,
                2vh,
                1.2rem
            );
    }

    .nova-controls {
        position: relative;

        left: auto;
        bottom: auto;

        transform: none;

        width: 100%;

        justify-content: center;

        margin-top:
            clamp(
                1.8rem,
                4vh,
                2.8rem
            );

        gap:
            clamp(
                1rem,
                5vw,
                1.5rem
            );
    }


    .nova-controls button {
        width:
            clamp(
                2.2rem,
                8vw,
                2.8rem
            );
    }

}

@media (max-width: 480px) and (orientation: portrait) {

    .nova-content {
        padding:
            2rem
            12%
            2rem;
    }


    .nova-text {
        font-size:
            clamp(
                0.8rem,
                3vw,
                0.82rem
            );

        line-height: 1.4;
    }


    .nova-controls {
        margin-top: 1.8rem;
    }


    .nova-controls button {
        width: 2.4rem;
    }

}

@media (max-width: 1024px) and (orientation: landscape) {

    .nova-slide {
        display: block;
    }

    .nova-image {
        width: 100%;
    }


    .nova-image img {
        width: 100%;
        height: auto;

        object-fit: cover;
    }

    .nova-content {
        position: absolute;

        left: 5%;
        right: 5%;

        bottom: 9%;

        display: flex;

        padding: 0;

        background: transparent;
    }

    .nova-text {
        width: 42%;

        font-size:
            clamp(
                0.55rem,
                1.25vw,
                0.55rem
            );

        line-height: 1.3;
    }


    .nova-text p {
        margin-bottom: 0.6rem;
    }

    .nova-controls {
        position: absolute;

        left: 50%;
        bottom: 0;

        transform: translateX(-50%);

        width: auto;

        margin: 0;

        gap: 0.7rem;
    }


    .nova-controls button {
        width:
            clamp(
                1.7rem,
                4vw,
                2.2rem
            );
    }


    .nova-controls button::before {
        width: 0.4rem;
        height: 0.4rem;
    }

}