/* Kurzusok előnézete listázva (template-parts/blue/course-list*.php, gold/course-list*.php) */

.course-list-title {
    text-transform: uppercase;
    font-family: "Cormorant Garamond";
    background: -webkit-linear-gradient(180deg, var(--color-gold-dark), var(--color-gold-light), var(--color-gold-dark));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-bottom: 45px;

    font-size: 42px;
    text-align: center;
    font-weight: 500;
}

.course-list-row,
.course-list-col {
    box-sizing: border-box;
    display: flex;
}

.course-list-row {
    width: 100%;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 45px;
    justify-content: center;
}

.course-list-col {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex: 0 0 calc(calc(100% / 3) - 30px);
}

.course-list-item {
    box-sizing: border-box;
    width: 100%;
    height: 400px;

    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;

    padding-bottom: 15px;
}

.blue .course-list-item {
    background-color: var(--color-main-alpha);
}

.gold .course-list-item {
    background-color: var(--color-gold-dark-alpha);
}

.course-list-item-text {
    font-size: 32px;
    font-family: "Cormorant Garamond";
}

@media screen and (max-width: 768px) {
    .course-list-col {
        flex: initial;
        width: 100%;
    }
}