.cta-list {
    display: flex;
    flex-wrap: wrap;
    margin: 0 0 0 -2rem;
    padding: 0;
    list-style: none;
}

.cta-list__item-4col {
    width: calc(100% - 2rem);
    margin-left: 2rem;
    border-bottom: 0.125rem solid #e7a614;
    @media (min-width: 48em) {
        width: calc(50% - 2rem);
    }
    @media (min-width: 64em) {
        width: calc(25% - 2rem);
    }
    &:nth-child(1) {
        border-top: 0.125rem solid #e7a614;
    }
    &:nth-child(2) {
        @media (min-width: 48em) {
            border-top: 0.125rem solid #e7a614;
        }
    }
    &:nth-child(3) {
        @media (min-width: 64em) {
            border-top: 0.125rem solid #e7a614;
        }
    }
	&:nth-child(4) {
        @media (min-width: 64em) {
            border-top: 0.125rem solid #e7a614;
        }
    }
}

.cta-list__item--stack-4col {
    width: calc(100% - 2rem);
    &:nth-child(2),
    &:nth-child(3),
	&:nth-child(4) {
        border-top: 0;
    }
}

.cta-list__link {
    @mixin text-list-cta;
    display: block;
    width: 100%;
    position: relative;
    padding: 1.25rem 5.5rem 1.25rem 0;
    border: 0;
    transition: padding var(--transition);
    background-color: transparent;
    text-align: left;
    &::after {
        content: '';
        position: absolute;
        right: 1.5rem;
        top: 50%;
        transform: translate(-1.5rem, -50%);
        width: 2.5rem;
        height: 2.5rem;
        transition: transform var(--transition), opacity var(--transition);
        background-image: svg-load('icon-arrow-right-blue.svg');
        background-size: 2.5rem 2.5rem;
        opacity: 0;
    }
    &:hover {
        padding-right: 4rem;
        padding-left: 1.5rem;
        &::after {
            transform: translate(0, -50%);
            opacity: 1;
        }
    }
}

.cta-list__link--white {
    &::after {
        background-image: svg-load('icon-arrow-right-white.svg');
    }
}

.cta-list__link--map {
    &::before {
        content: '';
        display: block;
        position: absolute;
        top: 50%;
        right: auto;
        left: 0.75rem;
        width: 1.75rem;
        height: 1.75rem;
        transform: translate(-3rem, -50%);
        transition: transform var(--transition), opacity var(--transition);
        background-image: svg-load('icon-marker.svg');
        background-size: 1.75rem 1.75rem;
        opacity: 0;
    }
    &.cta-list__link--active {
        padding-right: 0.75rem;
        padding-left: 3.25rem;
        &::before {
            transform: translate(0, -50%);
            opacity: 1;
        }
        &::after {
            transform: translate(-1.5rem, -50%);
            opacity: 0;
        }
    }
}