<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">.CPC-ArtifactGrid .artifacts {
    display: grid;
    gap: 1.5rem;
}

@media screen and (min-width: 1025px) {
    /* 4 COLUMN LAYOUT: */
    .CPC-ArtifactGrid[data-columns="4"] .artifacts {
        grid-template-columns: repeat(12, minmax(0, 1fr));
    }
    /* Ensure 4 artifacts per row */
    .CPC-ArtifactGrid[data-columns="4"] .artifact {
        grid-column: span 3;
    }
        /* If last row contains 3 artifacts (1 empty column), ensure last 2 artifacts fill the remaining column equally */
        .CPC-ArtifactGrid[data-columns="4"] .artifact:nth-last-child(3):nth-child(4n+1),
        .CPC-ArtifactGrid[data-columns="4"] .artifact:nth-last-child(3):nth-child(4n+1) ~ * {
            grid-column: span 4;
        }
        /* If last row contains 2 artifacts (2 empty column), ensure last 2 artifacts fill the remaining column equally */
        .CPC-ArtifactGrid[data-columns="4"] .artifact:nth-last-child(2):nth-child(4n+1),
        .CPC-ArtifactGrid[data-columns="4"] .artifact:nth-last-child(2):nth-child(4n+1) ~ * {
            grid-column: span 6;
        }
        /* If last row contains 1 artifact (3 empty columns), ensure last artifact fills the entire row */
        .CPC-ArtifactGrid[data-columns="4"] .artifact:nth-last-child(1):nth-child(4n+1) {
            grid-column: 1 / -1;
        }
    /* 3 COLUMN LAYOUT: */
    .CPC-ArtifactGrid[data-columns="3"] .artifacts {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }
    /* Ensure 3 artifacts per row */
    .CPC-ArtifactGrid[data-columns="3"] .artifact {
        grid-column: span 2;
    }
        /* If last row contains 2 artifacts (1 empty column), ensure last 2 artifacts fill the remaining column equally */
        .CPC-ArtifactGrid[data-columns="3"] .artifact:nth-last-child(2):nth-child(3n+1),
        .CPC-ArtifactGrid[data-columns="3"] .artifact:nth-last-child(2):nth-child(3n+1) ~ * {
            grid-column: span 3;
        }
        /* If last row contains 1 artifact (2 empty columns), ensure last artifact fills the entire row */
        .CPC-ArtifactGrid[data-columns="3"] .artifact:nth-last-child(1):nth-child(3n+1) {
            grid-column: 1 / -1;
        }
    /* 2 COLUMN LAYOUT */
    .CPC-ArtifactGrid[data-columns="2"] .artifacts {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    /* If last row contains 1 artifact (1 empty column), ensure last artifact fills the entire row */
    .CPC-ArtifactGrid[data-columns="2"] .artifact:nth-last-child(1):nth-child(2n+1) {
        grid-column: 1 / -1;
    }
    /* 1 COLUMN LAYOUT */
    .CPC-ArtifactGrid[data-columns="1"] .artifacts {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .CPC-ArtifactGrid[data-columns="4"] .artifacts,
    .CPC-ArtifactGrid[data-columns="3"] .artifacts {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    /* If last row contains 1 artifact (1 empty column), ensure last artifact fills the entire row */
    .CPC-ArtifactGrid[data-columns="4"] .artifact:nth-last-child(1):nth-child(2n+1),
    .CPC-ArtifactGrid[data-columns="3"] .artifact:nth-last-child(1):nth-child(2n+1) {
        grid-column: 1 / -1;
    }
}

@media screen and (max-width: 767px) {
    .CPC-ArtifactGrid .artifacts {
        grid-template-columns: 1fr;
    }
}

.CPC-ArtifactGrid .artifact {
    background-color: white;
    display: flex;
    flex-wrap: wrap;
    gap: 0 2rem;
}

.CPC-ArtifactGrid a {
    text-decoration: none !important;
    flex-basis: 320px;
    flex-grow: 1;
    cursor: pointer;
}

.CPC-ArtifactGrid .artifact .preview {
    width: 100%;
    height: 13rem;
    object-fit: cover;
}

.CPC-ArtifactGrid[data-imageSizing="short"] .artifact .preview {
    aspect-ratio: unset;
    height: 100px;
}

.CPC-ArtifactGrid .artifact .content {
    height: 100%;
    padding: 20px 0;
    flex-grow: 20;
    flex-basis: 320px;
}

div[class*="theme"] .CPC-ArtifactGrid .artifact .content {
    --current-text-color: var(--global-text-color);
    --current-link-color: var(--global-link-color);
    --current-link-color-hover: var(--global-link-color-hover);
    padding: 20px;
}

.CPC-ArtifactGrid[data-imageSizing="short"] .artifact .content {
    flex-basis: unset;
    width: 100%;
}

.CPC-ArtifactGrid .top-label {
    text-transform: uppercase;
    padding-bottom: 6px;
    color: var(--grey);
    font-size: 0.9rem;
    font-weight: normal;
}

.CPC-ArtifactGrid .title {
    display: block;
    margin-bottom: 0.5rem;
    font-size: 1.3rem;
    font-weight: bold;
}

.CPC-ArtifactGrid .description {
    font-size: 1.1rem;
    line-height: 1.5;
    color: var(--dk-grey);
}

.CPC-ArtifactGrid[data-status="collapsed"] .artifact.show-hide {
    display: none;
}

.CPC-ArtifactGrid[data-status="collapsed"] .show-less,
.CPC-ArtifactGrid[data-status="expanded"] .show-more {
    display: none !important;
}

.CPC-ArtifactGrid[data-status="expanded"] .show-less,
.CPC-ArtifactGrid[data-status="collapsed"] .show-more {
    display: flex;
    margin: 3rem auto 0;
    font-weight: bold;
    position: relative;
}

.dark-theme-text:not(.bg-lt-blue) .CPC-ArtifactGrid .cta::after {
    filter: var(--filter-white);
}
</pre></body></html>