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

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

.preheadline-headline-cards .cards-container {
    grid-area: 3/3/3/span 10;
    column-gap: var(--grid-gap);
    row-gap: var(--m-md);
}

.preheadline-headline-cards .cards-container .card-item {
    width: calc(20% - (var(--grid-gap) / 5 * 4));
}

.preheadline-headline-cards .cards-container .card-item .card-title {
	grid-area: 1/1/1/1;
	z-index: 1;
	width: max(96px, 4.375vw);
	aspect-ratio: 2/1;
	border-radius: 0 0 max(96px, 4.375vw) max(96px, 4.375vw);
	padding-top: .5em;
}

.preheadline-headline-cards .cards-container .card-item .card-img {
	grid-area: 1/1/1/1;
	aspect-ratio: 360/498;
	height: fit-content;
}

.preheadline-headline-cards .cards-container .card-item .card-img img {
	aspect-ratio: 360/498;
}

@media (max-width: 1299.98px) {
	.preheadline-headline-cards .cards-container {
		grid-area: 3/2/3/span 12;
	}
}

@media (max-width: 991.98px) {
	.preheadline-headline-cards .cards-container .card-item {
    	width: calc(33% - (var(--grid-gap) / 3 * 2));
	}
}

@media (max-width: 767.98px) {
	.preheadline-headline-cards .cards-container .card-item {
    	width: calc(50% - (var(--grid-gap) / 2));
	}
}

@media (max-width: 575.98px) {
	.preheadline-headline-cards .cards-container .card-item {
    	width: 100%;
	}
}