﻿.block__text {
}

    .block__text h2,
    .block__textandimage h2 {
        margin-bottom: 5rem;
    }

.block__textandimage img {
    aspect-ratio: 1/1;
}

.block__textandimage .container:has(>.col + .col) {
    gap: calc(var(--padding-grid) * 3);
}

.block__textandimage .richtext p {
    text-wrap: pretty;
}

@media(min-width: 1024px) {
    .block__textandimage .container:has(.col:nth-child(2)) .col {
        width: 50%;
    }

    .block__textandimage--fillimage .textandimage__image {
        position: relative;
    }

        .block__textandimage--fillimage .textandimage__image img {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: calc(100% - 1rem);
            transform: translateY(.75rem);
            aspect-ratio: unset;
        }

    .block__textandimage--mirror .textandimage__text {
        order: 1;
    }

    .block__textandimage--mirror .textandimage__image {
        order: 0;
    }
}

@media(max-width: 1023px) {
    .block__text h2,
    .block__textandimage h2 {
        margin-bottom: 2rem;
    }

    .block__textandimage .container:has(>.col + .col) {
        gap: var(--padding-grid);
    }

    .block__textandimage .container:has(.col:nth-child(2)) .col:nth-child(1) {
        width: 60%;
    }

    .block__textandimage .container:has(.col:nth-child(2)) .col:nth-child(2) {
        width: 40%;
    }

    .block__textandimage .container:has(.col:nth-child(2)) .col img {
        width: 100%;
    }
}

@media(max-width: 576px) {
    .block__textandimage .container:has(.col:nth-child(2)) {
        flex-flow: column;
    }

    .block__textandimage .container:has(.col:nth-child(2)) .col:nth-child(1),
    .block__textandimage .container:has(.col:nth-child(2)) .col:nth-child(2) {
        width: 100%;
    }

    .block__textandimage .container:has(.col:nth-child(2)) .col:nth-child(1) {
        order: 1;
    }

    .block__textandimage .container:has(.col:nth-child(2)) .col:nth-child(2) {
        order: 0;
    }
}
