/* Benefits page — financial independence */
.benefits-finance {
    position: relative;
    z-index: 3;
    min-height: 1258px;
    margin-top: -100px;
    isolation: isolate;
}

.benefits-finance::before,
.benefits-finance::after {
    position: absolute;
    z-index: 0;
    content: '';
    background-color: var(--color-white);
}

.benefits-finance::before {
    top: 100px;
    right: 0;
    bottom: 0;
    left: 0;
}

.benefits-finance::after {
    top: 0;
    right: 0;
    width: 60%;
    height: 186px;
    border-top-left-radius: 34px;
}

.benefits-finance__panel {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 1440px;
    margin-inline: auto;
}

.benefits-finance__media {
    position: absolute;
    top: 100px;
    left: 0;
    width: 40%;
    height: 1059px;
    margin: 0;
    overflow: hidden;
}

.benefits-finance__media img {
    position: absolute;
    top: 0;
    left: -158%;
    width: 327%;
    max-width: none;
    height: 100%;
    object-fit: fill;
}

@media (min-width: 1441px) {
    .benefits-finance__media {
        left: calc((100vw - 1440px) / -2);
        width: 40vw;
    }

    .benefits-finance:not(.benefits-finance--support) .benefits-finance__media img {
        left: 0;
        width: 100%;
        object-fit: cover;
        object-position: 70% center;
    }
}

.benefits-finance__content {
    width: 60%;
    margin-left: 40%;
    padding: 61px 100px 80px;
}

.benefits-finance__header {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
    color: var(--color-brand-violet);
    text-align: right;
}

.benefits-finance__title {
    margin: 0;
    color: inherit;
    font-family: var(--font-body);
    font-size: 30px;
    font-weight: 600;
    line-height: 1.2;
}

.benefits-finance__description,
.benefits-finance__description * {
    color: inherit;
    font-family: var(--font-body);
    font-size: 18px;
    font-weight: 400;
    line-height: 1.2;
}

.benefits-finance__description {
    max-width: 630px;
}

.benefits-finance__description p {
    margin: 0;
}

.benefits-finance__cards {
    display: flex;
    flex-direction: column;
    gap: 50px;
    margin-top: 60px;
}

.benefit-card.benefits-finance__card {
    padding: 10px;
}

/* Benefits page — life in Europe and ongoing support */
.benefits-finance--support {
    z-index: 5;
    min-height: 1032px;
}

.benefits-finance--support .benefits-finance__header {
    color: var(--color-white);
}

.benefits-finance--support::before,
.benefits-finance--support::after {
    background-color: var(--color-brand-magenta);
}

.benefits-finance--support .benefits-finance__panel {
    min-height: 1032px;
}

.benefits-finance--support .benefits-finance__media {
    top: 96px;
    height: 935px;
}

.benefits-finance--support .benefits-finance__media img {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 45%;
}

.benefits-finance--support + .university-application--benefits-support {
    z-index: auto;
    margin-top: -200px;
    padding-bottom: 48px;
}

.university-application--benefits-support .university-application__layout {
    z-index: auto;
}

.university-application--benefits-support .university-application__form,
.university-application--benefits-support .university-application__aside {
    position: relative;
    z-index: 6;
}

@media (max-width: 1199px) {
    .benefits-finance--support + .university-application--benefits-support {
        margin-top: 0;
        background-image: linear-gradient(to bottom, var(--color-brand-magenta) 30%, var(--color-brand-violet) 30%);
    }

    .benefits-finance {
        min-height: 0;
        margin-top: -24px;
    }

    .benefits-finance::before {
        top: 70px;
    }

    .benefits-finance::after {
        width: 100%;
        height: 140px;
    }

    .benefits-finance__panel {
        display: flex;
        flex-direction: column;
        min-height: 0;
    }

    .benefits-finance__content {
        width: 100%;
        margin-left: 0;
        padding-top: 40px;
        padding-inline: 60px;
        order: 2;
    }

    .benefits-finance__media {
        position: relative;
        top: auto;
        width: 100%;
        height: auto;
        min-height: 560px;
        margin-inline: auto;
        order: 1;
    }

    .benefits-finance__media img {
        position: absolute;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: 58% center;
    }

    .benefits-finance__header {
        max-width: 680px;
        margin-inline: auto;
    }

    .benefits-finance:not(.benefits-finance--support) .benefits-finance__header {
        align-items: flex-start;
        text-align: left;
    }

    .benefits-finance--support .benefits-finance__header {
        align-items: center;
        text-align: center;
    }
}

.heading-copy--benefits .heading-copy__layout {
    grid-template-columns: minmax(0, 5fr) minmax(0, 8fr);
    width: 100%;
}

.heading-copy--benefits .heading-accent {
    white-space: nowrap;
}

/* Benefits page hero */
.welcomescreen--benefits {
    background-color: var(--color-brand-violet);
}

.welcomescreen--benefits .welcomescreen__lead {
    max-width: 1440px;
    margin-inline: auto;
    margin-bottom: -60px;
}

.welcomescreen--benefits .welcomescreen__bg {
    object-position: center;
}

@media (min-width: 1200px) {
    .welcomescreen--benefits .welcomescreen__cta {
        padding-bottom: 26px;
    }
}

@media (max-width: 1199px) {
    .welcomescreen--benefits {
        height: 760px;
        min-height: 760px;
        max-height: none;
        aspect-ratio: auto;
    }

    .welcomescreen--benefits::after {
        background: linear-gradient(0deg, rgba(8, 14, 33, 0.72) 0%, rgba(8, 14, 33, 0.12) 70%);
    }

    .welcomescreen--benefits .welcomescreen__content {
        padding-bottom: 34px;
    }

    .welcomescreen--benefits .welcomescreen__lead {
        align-items: flex-end;
        margin-bottom: 20px;
        padding-inline: 40px;
    }

    .welcomescreen--benefits .welcomescreen__bg {
        object-position: bottom;
    }

    .benefits-finance--support .benefits-finance__media {
        top: 0px;
        height: 260px;
    }
}

@media (max-width: 575px) {
    .welcomescreen--benefits .welcomescreen__bg {
        object-position: 48% center;
    }
}

.page-intro--standard.page-intro--benefits {
    min-height: 553px;
    padding: 105px 0 80px;
}

.page-intro--benefits > .vertical-grid {
    top: 0;
    bottom: 0;
}

.page-intro--benefits .page-intro__heading {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.page-intro--benefits .heading-copy__line {
    white-space: nowrap;
}

@media (max-width: 1199px) {
    .page-intro--standard.page-intro--benefits {
        min-height: 0;
        padding: 70px 0 120px;
    }

    .page-intro--benefits > .vertical-grid {
        height: 100%;
    }

    .page-intro--benefits .heading-copy__line {
        white-space: normal;
    }

    .heading-copy--benefits .heading-copy__layout {
        grid-template-columns: minmax(0, 1fr);
        gap: 30px;
        width: 100%;
    }

    .benefits-finance::after {
        border-top-left-radius: 34px;
        border-top-right-radius: 34px;
    }
}

@media (max-width: 767px) {
    .page-intro--standard.page-intro--benefits {
        padding: 60px 0;
    }
}

@media (max-width: 575px) {
    .page-intro--standard.page-intro--benefits {
        padding: 40px 0 84px;
    }
}

/* Benefits page — education quality */
.benefits-quality {
    position: relative;
    z-index: 2;
    min-height: 815px;
    margin-top: -100px;
    overflow: hidden;
    isolation: isolate;
}

.benefits-quality::before,
.benefits-quality::after {
    position: absolute;
    z-index: 0;
    content: '';
    background-color: var(--color-brand-magenta);
}

.benefits-quality::before {
    top: 100px;
    right: 0;
    bottom: 0;
    left: 0;
}

.benefits-quality::after {
    top: 0;
    left: 0;
    width: 60%;
    height: 186px;
    border-top-right-radius: 34px;
}

.benefits-quality__grid {
    z-index: 1;
    top: 1px;
    bottom: 0;
    background-image:
        linear-gradient(var(--vertical-grid-line-color), var(--vertical-grid-line-color)),
        linear-gradient(var(--vertical-grid-line-color), var(--vertical-grid-line-color)),
        linear-gradient(var(--vertical-grid-line-color), var(--vertical-grid-line-color)),
        linear-gradient(var(--vertical-grid-line-color), var(--vertical-grid-line-color));
    background-repeat: no-repeat;
    background-position:
        20% 0,
        40% 0,
        60% 99px,
        80% 99px;
    background-size:
        1px 100%,
        1px 100%,
        1px 100%,
        1px 100%;
}

.benefits-quality__grid::before,
.benefits-quality__grid::after {
    display: none;
}

.benefits-quality__inner {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 1440px;
    margin-inline: auto;
    padding: 61px 100px 80px;
}

.benefits-quality__header {
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-width: 704px;
    color: var(--color-white);
}

.benefits-quality__title {
    margin: 0;
    color: inherit;
    font-family: var(--font-body);
    font-size: 30px;
    font-weight: 600;
    line-height: 1.2;
}

.benefits-quality__description,
.benefits-quality__description * {
    color: inherit;
    font-family: var(--font-body);
    font-size: 18px;
    font-weight: 400;
    line-height: 1.2;
}

.benefits-quality__description p,
.benefit-card__text p {
    margin: 0;
}

.benefits-quality__cards {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: start;
    gap: 50px;
    margin-top: 60px;
}

.benefit-card {
    --benefit-card-accent: var(--color-brand-green);

    padding: 10px 10px 0 0;
    background-color: var(--benefit-card-accent);
    border-radius: 40px 40px 0 40px;
}

.benefit-card--orange {
    --benefit-card-accent: var(--color-brand-orange);
}

.benefit-card--violet {
    --benefit-card-accent: var(--color-brand-violet);
}

.benefit-card--magenta {
    --benefit-card-accent: var(--color-brand-magenta);
}

.benefits-quality--comfort {
    z-index: 4;
    min-height: 814px;
}

.benefits-quality--comfort::before,
.benefits-quality--comfort::after {
    background-color: var(--color-brand-violet);
}

.benefit-card__surface {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 30px 40px;
    background-color: var(--color-white);
    border-radius: 34px 34px 0 34px;
}

.benefit-card__title {
    margin: 0;
    color: var(--color-brand-magenta);
    font-family: var(--font-heading);
    font-size: 18px;
    font-weight: 600;
    line-height: 1.2;
    text-transform: uppercase;
}

.benefit-card__text,
.benefit-card__text * {
    color: var(--color-brand-violet);
    font-family: var(--font-body);
    font-size: 18px;
    font-weight: 400;
    line-height: 1.2;
}

@media (max-width: 1199px) {
    .benefit-card__surface {
        padding: 28px 30px;
    }

    .benefits-quality {
        min-height: 0;
        margin-top: 0;
    }

    .benefits-quality::before {
        top: 70px;
    }

    .benefits-quality::after {
        width: 100%;
        height: 140px;
    }

    .benefits-quality__grid {
        top: 0;
        bottom: 0;
        height: auto;
        background-position:
            20% 0,
            40% 0,
            60% 0,
            80% 0;
        background-size:
            1px 100%,
            1px 100%,
            1px 100%,
            1px 100%;
    }

    .benefits-quality__inner {
        padding: 45px 40px 90px;
    }

    .benefits-quality__cards {
        grid-template-columns: minmax(0, 1fr);
        gap: 30px;
        margin-top: 50px;
    }

    .benefits-quality {
        margin-top: -24px;
    }
}

@media (max-width: 575px) {
    .benefits-quality::before {
        top: 40px;
    }

    .benefits-quality::after {
        height: 100px;
        border-top-right-radius: 28px;
        border-top-left-radius: 28px;
    }

    .benefits-quality__inner {
        padding: 32px 16px 64px;
    }

    .benefits-quality__header {
        text-align: center;
    }

    .benefits-quality__title {
        font-size: 24px;
    }

    .benefits-quality__description,
    .benefits-quality__description *,
    .benefit-card__text,
    .benefit-card__text * {
        font-size: 16px;
    }

    .benefits-quality__cards {
        gap: 24px;
        margin-top: 40px;
    }

    .benefit-card__surface {
        padding: 26px 24px;
    }

    .benefits-quality__grid {
        display: none;
    }
}

@media (max-width: 575px) {
    .benefits-finance {
        margin-top: 0;
    }

    .benefits-finance:not(.benefits-finance--support) {
        background-color: var(--color-white);
    }

    .benefits-finance::before,
    .benefits-finance::after {
        display: none;
    }

    .benefits-finance:not(.benefits-finance--support) .benefits-finance__media {
        min-height: 0;
        margin-top: -24px;
        aspect-ratio: 17 / 11;
    }

    .benefits-finance:not(.benefits-finance--support) .benefits-finance__media,
    .benefits-finance--support .benefits-finance__media {
        border-top-left-radius: 28px;
        border-top-right-radius: 28px;
    }

    .benefits-finance:not(.benefits-finance--support) .benefits-finance__media img,
    .benefits-finance--support .benefits-finance__media img {
        position: absolute;
        inset: 0;
        object-fit: cover;
        object-position: center;
    }

    .benefits-finance:not(.benefits-finance--support) .benefits-finance__content {
        width: calc(100% - 32px);
        max-width: 340px;
        margin-inline: auto;
        padding: 18px 8px 40px;
    }

    .benefits-finance:not(.benefits-finance--support) .benefits-finance__title {
        font-size: 18px;
    }

    .benefits-finance:not(.benefits-finance--support) .benefits-finance__description,
    .benefits-finance:not(.benefits-finance--support) .benefits-finance__description * {
        font-size: 14px;
    }

    .benefits-finance:not(.benefits-finance--support) .benefits-finance__cards {
        gap: 30px;
        margin-top: 24px;
    }

    .benefits-finance__card,
    .benefits-quality--comfort .benefit-card {
        padding: 8px;
    }

    .benefits-finance:not(.benefits-finance--support) .benefits-finance__card .benefit-card__surface,
    .benefits-quality--comfort .benefit-card__surface {
        gap: 6px;
        padding: 18px 14px;
    }

    .benefits-finance__card .benefit-card__title,
    .benefits-quality--comfort .benefit-card__title {
        font-size: 16px;
        white-space: normal;
    }

    .benefits-quality--comfort {
        margin-top: 0;
        border-top-right-radius: 24px;
        border-top-left-radius: 24px;
    }

    .benefits-quality--comfort::before {
        top: 0;
    }

    .benefits-quality--comfort::after {
        height: 112px;
    }

    .benefits-quality--comfort .benefits-quality__inner {
        padding-top: 28px;
    }

    .benefits-quality--comfort .benefits-quality__cards {
        gap: 30px;
        margin-top: 30px;
    }

    .benefits-finance--support {
        background-color: var(--color-brand-magenta);
    }

    .benefits-finance--support .benefits-finance__media {
        top: -24px;
        min-height: 0;
        aspect-ratio: 65 / 39;
    }

    .benefits-finance--support .benefits-finance__content {
        padding: 28px 16px 64px;
    }

    .benefits-finance--support .benefits-finance__header {
        max-width: 340px;
        margin-inline: auto;
    }

    .benefits-finance--support .benefits-finance__title {
        font-size: 24px;
    }

    .benefits-finance--support .benefits-finance__description,
    .benefits-finance--support .benefits-finance__description * {
        font-size: 16px;
    }

    .benefits-finance--support .benefits-finance__cards {
        gap: 30px;
        max-width: 340px;
        margin: 30px auto 0;
    }

    .benefits-finance--support .benefits-finance__card .benefit-card__surface {
        gap: 6px;
        padding: 24px 30px;
    }
}