/* -----------------------------------------------------------------------
	HIGHLIGHTED
/* ---------------------------------------------------------------------*/

.field--name-field-highlighted-download {
    display: grid;
    grid-template-columns: var(--grid-columns);
    grid-column-gap: var(--grid-gap);
}

.field--name-field-highlighted-download.multiple > .field__item {
    grid-column: span 4;
}

.main-content .field--name-field-ements-wfbb-page > .field__item.wfbb_highlighted_downloads {
    padding-left: var(--section-inner-side-padding);
    padding-right: var(--section-inner-side-padding);
}

.field--name-field-title-hervorgehobener-down {
    font-size: var(--font-size-h3);
    font-weight: 700;
    margin: 0 0 calc(var(--grid-gap) / 2);
    line-height: 1.3;
}

.field--name-field-infotext-wfbb-highlighted {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
}

.field--name-field-image-wfbb-highlighted-dow .image-group {
    position: relative;
    padding-top: 140%;
    box-shadow: 0 15px 30px rgb(0 0 0 / 20%);
}

.field--name-field-image-wfbb-highlighted-dow .image-group img {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: var(--border-radius);
}

.field--name-field-highlighted-download > .field__item .paragraph--type--wfbb-highlighted-download {
    align-items: center;
}


/* MULTIPLE */

.field--name-field-highlighted-download.multiple > .field__item .paragraph--type--wfbb-highlighted-download {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    grid-column-gap: var(--grid-gap);
}

.field--name-field-highlighted-download.multiple > .field__item .paragraph--type--wfbb-highlighted-download .field--name-field-image-wfbb-highlighted-dow {
    grid-column: span 3;
}

.field--name-field-highlighted-download.multiple > .field__item .paragraph--type--wfbb-highlighted-download .group_text_link_highlighted_down {
    grid-column: span 4;
}

.field--name-field-highlighted-download.multiple > .field__item .field--name-field-title-hervorgehobener-down {
    margin: var(--grid-gap) 0 calc(var(--grid-gap) / 2);
}

/* DUO */

.field--name-field-highlighted-download.duo > .field__item {
    grid-column: span 6;
}

.field--name-field-highlighted-download.duo > .field__item .paragraph--type--wfbb-highlighted-download {
    display: grid;
    grid-template-columns: repeat(6,1fr);
    grid-column-gap: var(--grid-gap);
}

.field--name-field-highlighted-download.duo > .field__item .paragraph--type--wfbb-highlighted-download .field--name-field-image-wfbb-highlighted-dow {
    grid-column: span 2;
}

.field--name-field-highlighted-download.duo > .field__item .paragraph--type--wfbb-highlighted-download .group_text_link_highlighted_down {
    grid-column: span 4;
}


/* SINGLE */

.field--name-field-highlighted-download.single > .field__item {
    grid-column: 3 / 11;
}

.field--name-field-highlighted-download.single > .field__item .paragraph--type--wfbb-highlighted-download {
    display: grid;
    grid-template-columns: repeat(8,1fr);
    grid-column-gap: var(--grid-gap);
}

.field--name-field-highlighted-download.single > .field__item .paragraph--type--wfbb-highlighted-download .field--name-field-image-wfbb-highlighted-dow {
    grid-column: span 3;
}

.field--name-field-highlighted-download.single > .field__item .paragraph--type--wfbb-highlighted-download .group_text_link_highlighted_down {
    grid-column: 5 / 9;
}


@media (max-width: 767px) {

    .main-content .field--name-field-ements-wfbb-page > .field__item.wfbb_highlighted_downloads {
        padding-left: 0;
        padding-right: 0;
    }

    .field--name-field-highlighted-download > .field__item {
        grid-column: span 12 !important;
    }

    .field--name-field-highlighted-download > .field__item + .field__item {
        margin-top: calc(var(--grid-gap) * 2);
    }

    .field--name-field-highlighted-download > .field__item .paragraph--type--wfbb-highlighted-download {
        grid-template-columns: var(--grid-columns) !important;
    }

    .field--name-field-highlighted-download > .field__item .paragraph--type--wfbb-highlighted-download .field--name-field-image-wfbb-highlighted-dow {
        grid-column: span 4 !important;
    }

    .field--name-field-highlighted-download.duo > .field__item .paragraph--type--wfbb-highlighted-download .group_text_link_highlighted_down {
        grid-column: span 8 !important;
    }

}

/* TODO: Refactor to base button classes */
.field--name-field-file-wfbb-highlighted-down a {
    padding: .5em 3em .5em 1em;
    border: 2px solid var(--color-primary);
    border-radius: 5rem;
    font-size: 1.125rem;
    margin-top: var(--grid-gap);
    display: inline-block;
    font-weight: 700;
    position: relative;
    color: var(--color-primary);
    cursor: pointer;
    background-color: transparent;
}

.field--name-field-file-wfbb-highlighted-down a::after {
    background-image: var(--arrow-next-primary);
    color: #fff;
    text-decoration: none;
    border-color: var(--color-primary);
    display: inline-block;
    content: '';
    width: 1.063em;
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    right: 1em;
    height: 100%;
    top: 0;
    background-position: center;
}

.field--name-field-file-wfbb-highlighted-down a:hover {
    background-color: var(--color-primary);
    color: #fff;
    text-decoration: none;
    border-color: var(--color-primary);
}

.field--name-field-file-wfbb-highlighted-down a:hover::after {
    background-image: var(--arrow-next-white);
}