.headline-cards {
	overflow-x: clip;
    overflow-y: visible;
}

.headline-cards .headline {
    grid-area: 1/2/1/span 12;
}

.headline-cards .cards-container {
    grid-area: 2/3/2/span 10;
    grid-template-columns: repeat(3, 1fr);
    grid-column-gap: max(32px, 4.0625vw);
}

.headline-cards .cards-container .card-item {
    padding: max(24px, 2.5vw) max(24px, 2.5vw) calc(var(--m-lg) - var(--m-xs));
    border: 1px solid currentColor;
    border-radius: var(--m-xs);
}

.headline-cards .cards-container .card-item::before {
    content: "";
    display: block;
    width: max(40px, 3.28125vw);
    aspect-ratio: 1/1;
    mask: url(../../img/logo-arrow-right.svg) no-repeat center/contain;
    -webkit-mask: url(../../img/logo-arrow-right.svg) no-repeat center/contain;
    background: var(--orange);
    position: absolute;
    top: calc(max(24px, 2.5vw) + (var(--fs-35) * 1.32 / 2));
    left: 0;
    transform: translate(-55%, -50%);
}

.headline-cards .cards-container .card-item::after {
    content: "";
    display: block;
    width: max(92px, 6.71875vw);
    aspect-ratio: 1/1;
    background: var(--white);
    position: absolute;
    top: 100%;
    left: 100%;
    transform: translate(-50%, -50%) rotate(-45deg);
    border-top: 1px solid currentColor;
}


.headline-cards .cards-container .card-item .card-text {
    margin-bottom: auto;
}

.headline-cards .cards-container .card-item .default-btn {
    position: absolute;
    right: 0;
    bottom: var(--m-xs);
}

@media (max-width: 1499.98px) {
    .headline-cards .cards-container {
        grid-area: 2/2/2/span 12;
        padding: 0 var(--grid-gap);
    }
}

@media (max-width: 1199.98px) {
    .headline-cards .cards-container {
        display: flex;
        flex-direction: column;
        width: fit-content;
        justify-self: center;
        gap: var(--m-sm);
    }

    .headline-cards .cards-container .card-item .card-text {
        max-width: 48ch;
    }
}