.about {
    overflow: hidden;
    -webkit-padding-before: 120rem;
            padding-block-start: 120rem;
}

.about__content {
    border-bottom: 1rem solid #e4e4e4;
    -webkit-padding-after: 120rem;
            padding-block-end: 120rem;
}

.about__header {
    text-align: center;
    -webkit-margin-after: 72rem;
            margin-block-end: 72rem;
    padding-inline: 24rem;
}

.about__top-text {
    color: var(--color-gray-700);
    -webkit-margin-after: 16rem;
            margin-block-end: 16rem;
}

.about__title {
    font-weight: 500;
    font-size: 48rem;
    line-height: 52rem;
    -webkit-margin-after: 24rem;
            margin-block-end: 24rem;
}

.about__text {
    opacity: 0.6;
}

.about__row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    gap: 24rem;
}

.about__cards-container {
    width: 100%;
    padding-inline: 24rem;
}

.about__cards {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    gap: 24rem;
}

.about__cards > .about__card {
    width: 100%;
    max-width: calc(50% - 12rem);
}

.about__cards > .about__card--lg {
    max-width: 100%;
}

.about__card {
    width: 100%;
    min-height: 179rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    background-color: var(--color-light);
    border-radius: 24rem;
    padding-block: 24rem;
    padding-inline: 16rem;
}

.about__card-tag {
    width: -moz-fit-content;
    width: -webkit-fit-content;
    width: fit-content;
    max-width: 100%;
    background-color: var(--color-white);
    border-radius: 8rem;
    color: #1f1f1f;
    padding-block: 4rem;
    padding-inline: 16rem;
    -webkit-margin-after: 10rem;
            margin-block-end: 10rem;
}

.about__card-tag--pink {
    background-color: #f6d7f7;
}

.about__card-tag--yellow {
    background-color: #f4e7c6;
}

.about__card-tag--green {
    background-color: #d6f7db;
}

.about__card-title {
    font-weight: 500;
    font-size: 24rem;
    line-height: 28rem;
    -webkit-margin-after: 28rem;
            margin-block-end: 28rem;
}

.about__card--lg .about__card-title {
    font-size: 53rem;
    line-height: 63rem;
    -webkit-margin-after: 70rem;
            margin-block-end: 70rem;
}

.about__card-text {
    opacity: 0.6;
    -webkit-margin-before: auto;
            margin-block-start: auto;
}

.about__media {
    width: 100%;
}

.about__img {
    width: 100%;
    position: relative;
    overflow: hidden;
    border-radius: 24rem;
    -webkit-padding-before: 131.1926605505%;
            padding-block-start: 131.1926605505%;
}

.about__img img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    -o-object-fit: cover;
       object-fit: cover;
}

@media screen and (min-width: 768px) {
    .about__header {
        max-width: 474rem;
        margin-inline: auto;
        padding-inline: 0;
    }

    .about__cards-container {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        max-width: calc(50% - 12rem);
        padding-inline: 0;
    }

    .about__card--lg .about__card-title {
        font-size: 83rem;
        line-height: 98rem;
        -webkit-margin-after: 35rem;
                margin-block-end: 35rem;
    }

    .about__media {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        max-width: calc(50% - 12rem);
    }

    .about__img {
        -webkit-padding-before: 110.5527638191%;
                padding-block-start: 110.5527638191%;
    }
}

@media screen and (min-width: 1024px) and (orientation: landscape) {
    .about__container {
        padding-inline: 24rem;
    }

    .about__row {
        max-width: 832rem;
        margin-inline: auto;
    }

    .about__cards-container {
        max-width: 410rem;
    }

    .about__media {
        max-width: calc(100% - 434rem);
    }
}
