.text-teaser .text-container {
    grid-area: 1/3/1/span 3;
}

.text-teaser .teaser-container {
    grid-area: 1/7/1/span 6;
    gap: var(--m-sm);
}

.text-teaser .teaser-container .teaser-item {
    grid-template-columns: repeat(6, 1fr);
    grid-column-gap: var(--grid-gap);
}

.text-teaser .teaser-container .teaser-item .teaser-img {
    grid-area: 1/1/span 3/span 3;
    aspect-ratio: 560/795;
}

.text-teaser .teaser-container .teaser-item .circle-text {
    grid-area: 1/1/span 3/span 3;
    align-self: flex-end;
    margin-bottom: var(--m-md);
    transform: translateX(-50%);
}

.text-teaser .teaser-container .teaser-item .text-container {
    grid-area: 2/5/2/span 2;
}

.text-teaser .teaser-container .teaser-item .default-btn {
    grid-area: 3/5/3/span 2;
}

@media (max-width: 1199.98px) {
    .text-teaser .text-container {
        grid-area: 1/2/1/span 4;
    }

    .text-teaser .teaser-container {
        grid-area: 1/7/1/span 7;
    }

    .text-teaser .teaser-container .teaser-item .text-container {
        grid-area: 2/4/2/span 3;
    }

    .text-teaser .teaser-container .teaser-item .default-btn {
        grid-area: 3/4/3/span 3;
    }
}

@media (max-width: 991.98px) {
    .text-teaser .text-container {
        grid-area: 1/4/1/span 8;
        position: relative;
        top: unset;
    }

    .text-teaser .teaser-container {
        grid-area: 2/4/2/span 8;
        margin-top: var(--m-lg);
    }
}

@media (max-width: 767.98px) {
    .text-teaser .text-container {
        grid-area: 1/3/1/span 10;
    }

    .text-teaser .teaser-container {
        grid-area: 2/3/2/span 10;
    }
}

@media (max-width: 575.98px) {
    .text-teaser .text-container {
        grid-area: 1/2/1/span 12;
    }

    .text-teaser .teaser-container {
        grid-area: 2/2/2/span 12;
        gap: var(--m-lg);
    }

    .text-teaser .teaser-container .teaser-item {
        grid-template-columns: repeat(4, 1fr);
    }

    .text-teaser .teaser-container .teaser-item .teaser-img,
    .text-teaser .teaser-container .teaser-item .circle-text {
        grid-area: 1/2/1/span 3;
    }

    .text-teaser .teaser-container .teaser-item .text-container {
        grid-area: 2/2/2/span 3;
        margin-top: var(--m-sm);
    }

    .text-teaser .teaser-container .teaser-item .default-btn {
        grid-area: 3/2/31/span 3;
        margin: var(--m-sm) 0 0;
    }
}