/*********************************************************************************

    CARDS 
                                                                            
 *********************************************************************************/



    /* Make links non clickable in backend. */

    .is-root-container .nvm-posts-list a {
        pointer-events: none;
    }

    .colorful-cards {
        
    }

    .colorful-cards [class*="column"] {
        padding-left: calc(var(--nvm-grid-gutter)/1.5);
        padding-right: calc(var(--nvm-grid-gutter)/1.5);
    }

    .colorful-cards .row {
        padding-left: calc(var(--nvm-grid-gutter)/2);
        padding-right: calc(var(--nvm-grid-gutter)/2);
    }

        .colorful-cards .row.reverse {
            flex-direction: row-reverse;
        }

    .colorful-cards .row:not(:first-child) {
        margin-top: calc(var(--nvm-text-rhythm) / 3);
    }

    .colorful-card-image, 
    .colorful-card-content {
        position: relative;

    }

    /*.colorful-card-image figure {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        height: 100% !important;
        width: calc(100% - var(--nvm-grid-gutter));
        object-fit: cover;
    }*/

    .colorful-card-content-text {
        height: 100%;
        overflow: hidden;
    }


    .colorful-card-decor-svg {
        position: absolute;
        overflow: hidden;
        z-index: 0;
        width: 100%;
    }

    .colorful-card-decor-svg svg, 
    .colorful-card-decor-svg img {
        height: 100% !important;

    }

    /* Positioning styles based on the select field values */
    .colorful-card-decor-svg.topleft {
        top: 0;
        left: 0;
        transform: translate(0, 0);
    }

    .colorful-card-decor-svg.topright {
        top: 0;
        right: 0;
        transform: translate(0, 0);
    }

    .colorful-card-decor-svg.bottomleft {
        bottom: 0;
        left: 0;
        transform: translate(0, 0);
    }

    .colorful-card-decor-svg.bottomright {
        bottom: 0;
        right: 0;
        transform: translate(0, 0);
    }

    .colorful-card-content-text-title-description {
        position: relative;
        padding: calc(3*var(--nvm-grid-gutter)) calc(4*var(--nvm-grid-gutter));
        color: var(--nvm-color-white);
        position: relative;
        z-index: 1;
        height: 100%;
    }

        .colorful-card-content-text-title-description h3 {
            position: relative;
            margin-bottom: 38px;
            z-index: 1;
            font-size: clamp(18px, 1vw + 18px, 28px);


        }

            .colorful-card-content-text-title-description h3:after {
                position: absolute;
                left: 0;
                bottom: -22px;
                content: "";
                width: 25px;
                height: 3px;
                background: var(--nvm-color-white);
            }

        .colorful-card-content-text-title-description p.colorful-card-paragraph {
            font-weight: 700;
            position: relative;
            z-index: 1;
            font-size: 22px;
            line-height: 27px;
        }