@include mappy-bp(md) {
    .tb-grid {
        display: flex;
    }

    .tb-grid__main {
        padding-right: 2rem;
        width: 66.66%;
    }

    .tb-grid__aside {
        width: 33.33%;
    }

    .tb-grid--reverse {
        .tb-grid__main {
            padding-right: 0;
            padding-left: 2rem;
        }
    }

    .tb-offer-grid {
        flex-direction: row-reverse;
    }
}

@include mappy-bp(xl) {
    .tb-grid__main {
        padding-right: 5rem;
        width: 66.66%;
    }

    .tb-grid--reverse {
        .tb-grid__main {
            padding-right: 0;
            padding-left: 5rem;
        }
    }
}

// Aside titles never need a margin top as they are always being placed inside
// a container that manages vertical spacing
.tb-aside-title {
    margin-top: 0;
    font-size: theme('fontSize.xl');
}
