.nxb-media-text-split {
    --media-text-background: #fff;
    --media-text-colour: #5278a2;
    --media-text-accent: #1b426c;
    box-sizing: border-box;
    background: var(--media-text-background);
    color: var(--media-text-colour);
}

.nxb-media-text-split--background-light-grey { --media-text-background: #f6f2ed; }
.nxb-media-text-split--background-dark { --media-text-background: #385474; --media-text-colour: #fff; --media-text-accent: #fff; }
.nxb-media-text-split--background-brand { --media-text-background: #5278a2; --media-text-colour: #fff; --media-text-accent: #fff; }
.nxb-media-text-split--top-no-spacing { padding-top: 0; }
.nxb-media-text-split--top-small { padding-top: 1.5rem; }
.nxb-media-text-split--top-medium { padding-top: 3rem; }
.nxb-media-text-split--top-large { padding-top: 5rem; }
.nxb-media-text-split--bottom-no-spacing { padding-bottom: 0; }
.nxb-media-text-split--bottom-small { padding-bottom: 1.5rem; }
.nxb-media-text-split--bottom-medium { padding-bottom: 3rem; }
.nxb-media-text-split--bottom-large { padding-bottom: 5rem; }

.nxb-media-text-split__inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    width: min(100% - 3rem, 84.375rem);
    margin-inline: auto;
}

.nxb-media-text-split__media {
    position: relative;
    min-width: 0;
    overflow: hidden;
    background: #e6e8eb;
}

.nxb-media-text-split--ratio-4-3 .nxb-media-text-split__media { aspect-ratio: 4 / 3; }
.nxb-media-text-split--ratio-16-9 .nxb-media-text-split__media { aspect-ratio: 16 / 9; }
.nxb-media-text-split__image,
.nxb-media-text-split__video { display: block; width: 100%; height: 100%; border: 0; }
.nxb-media-text-split--ratio-4-3 .nxb-media-text-split__image,
.nxb-media-text-split--ratio-16-9 .nxb-media-text-split__image { object-fit: cover; }
.nxb-media-text-split--ratio-natural .nxb-media-text-split__image { height: auto; }

.nxb-media-text-split__text {
    display: flex;
    min-width: 0;
    flex-direction: column;
    justify-content: center;
    padding: clamp(2rem, 5vw, 5rem);
}
.nxb-media-text-split--align-top .nxb-media-text-split__text { justify-content: flex-start; }
.nxb-media-text-split--align-bottom .nxb-media-text-split__text { justify-content: flex-end; }
.nxb-media-text-split--media-right .nxb-media-text-split__media { order: 2; }
.nxb-media-text-split--media-right .nxb-media-text-split__text { order: 1; }

.nxb-media-text-split__eyebrow {
    margin: 0 0 .6rem;
    color: var(--media-text-accent);
    font: 600 .78rem/1.2 "Alegreya Sans", sans-serif;
    letter-spacing: .12em;
    text-transform: uppercase;
}
.nxb-media-text-split__heading {
    margin: 0;
    color: inherit;
    font: 600 clamp(1.8rem, 4vw, 2.65rem)/1.15 "Playfair Display", serif;
}
.nxb-media-text-split__body { margin-top: 1.5rem; font-size: 1.08rem; line-height: 1.55; }
.nxb-media-text-split__body > :first-child { margin-top: 0; }
.nxb-media-text-split__body > :last-child { margin-bottom: 0; }
.nxb-media-text-split__align-centre { text-align: center; }
.nxb-media-text-split__align-right { text-align: right; }
.nxb-media-text-split__buttons { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.5rem; }
.nxb-media-text-split__align-centre .nxb-media-text-split__buttons { justify-content: center; }
.nxb-media-text-split__align-right .nxb-media-text-split__buttons { justify-content: flex-end; }
.nxb-media-text-split__button {
    display: inline-flex;
    min-height: 2.75rem;
    align-items: center;
    justify-content: center;
    padding: .65rem 1.2rem;
    border: 1px solid currentColor;
    color: inherit;
    font-weight: 600;
    text-decoration: none;
}
.nxb-media-text-split__button:hover { background: var(--media-text-accent); color: #fff; }

@media (max-width: 800px) {
    .nxb-media-text-split__inner { grid-template-columns: 1fr; width: 100%; }
    .nxb-media-text-split__media,
    .nxb-media-text-split__text { order: initial !important; }
    .nxb-media-text-split__text { padding: 2rem 1.25rem 2.5rem; }
    .nxb-media-text-split--ratio-natural .nxb-media-text-split__media { aspect-ratio: auto; }
    .nxb-media-text-split--top-large { padding-top: 3.5rem; }
    .nxb-media-text-split--bottom-large { padding-bottom: 3.5rem; }
}
