﻿.at-benefits .g-container__inner {
    max-width: var(--maxHeaderWidth);
}

.at-benefits__contentWrapper {
    align-items: center;
}

.at-benefits__contentWrapper.g-gridContainer__inner {
    display: block;
    gap: 0;
}

.at-benefits__intro {
    max-width: 60ch;
    margin-bottom: var(--marginMedium);
}

.at-benefits__text {
    margin-top: var(--marginSmall);
}

.at-benefits__button {
    display: inline-block;
    margin-inline: auto 0;
    margin-block: var(--marginSmall) 0;
}

.at-benefits__textWrapper {
    padding-inline-end: var(--marginMedium);
    padding-block: var(--marginLarge);
}

.at-benefits__imageWrapper {
    position: relative;
    width: 100%;
    height: 100%;
}

.at-benefits__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

@media (min-width: 850px) {
    .at-benefits__contentWrapper.g-gridContainer__inner {
        display: grid;
    }

    .at-benefits__image {
        position: absolute;
    }
}

@media (min-width: 990px) {
    .at-benefits__textWrapper {
        padding-inline-end: 4rem;
    }
}

/**
 * Highlights
 */

.at-benefits__highlight {
    display: grid;
    gap: var(--marginMedium);
    margin-block-end: var(--marginSmall);
    padding: var(--marginMedium);
    border: 2px solid var(--primaryColor200);
    border-radius: var(--borderRadiusSmall);
}

@media (min-width: 450px) {
    .at-benefits__highlight {
        grid-template-columns: 1fr 3fr;
    }
}

.at-benefits__highlightTitle {
    margin-block-end: var(--marginExtraSmall);
}

.at-benefits__highlightIconWrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100px;
    height: 100px;
    background: url(../../img/icon-gradient.svg) no-repeat;
    background-size: cover;
}

.at-benefits__highlightIcon {
    width: 50px;
    height: 50px;
}
