:root {
    --educa-font-family: "Montserrat", sans-serif;

    --educa-color-bg: #f7f7fb;
    --educa-color-title: #1d1d1f;
    --educa-color-text: #3c3c46;
    --educa-color-btn-bg: #1f2430;
    --educa-color-btn-bg-hover: #11151d;
    --educa-color-btn-text: #fff;
    --educa-color-link: #a2185b;
    --educa-color-link-hover: #7e1147;

    --educa-radius-main: 24px;
    --educa-radius-img: 16px;
    --educa-radius-btn: 14px;
    --educa-radius-mobile: 18px;

    --educa-banner-width: 100%;
    --educa-inner-max-width: 1440px;
    --educa-bottom-max-width: 1200px;
    --educa-logo-max-width: 214px;

    --educa-padding-y: 48px;
    --educa-padding-x: 24px;
    --educa-padding-mobile-y: 28px;
    --educa-padding-mobile-x: 16px;

    --educa-gap-main: 48px;
    --educa-gap-tablet: 32px;
    --educa-gap-mobile: 24px;
    --educa-gap-actions: 16px;
    --educa-gap-link: 8px;

    --educa-margin-logo: 32px;
    --educa-margin-text-block: 32px;
    --educa-margin-title: 16px;
    --educa-margin-actions: 28px;
    --educa-margin-bottom-banner: 40px;
    --educa-margin-logo-mobile: 20px;
    --educa-margin-bottom-banner-mobile: 28px;

    --educa-title-size: 36px;
    --educa-title-size-tablet: 30px;
    --educa-title-size-mobile: 26px;
    --educa-title-line-height: 1.15;
    --educa-title-weight: 700;

    --educa-text-size: 18px;
    --educa-text-size-tablet: 16px;
    --educa-text-line-height: 1.65;
    --educa-text-strong-weight: 700;

    --educa-btn-min-height: 64px;
    --educa-btn-padding-y: 16px;
    --educa-btn-padding-x: 24px;
    --educa-btn-weight: 600;
    --educa-btn-line-height: 1.35;

    --educa-link-weight: 600;

    --educa-transition: all 0.25s ease;
    --educa-hover-translate-y: -1px;

    --educa-breakpoint-tablet: 1024px;
    --educa-breakpoint-mobile: 767px;
}

.educa-banner-mylxp,
.educa-banner-mylxp *,
.educa-banner-mylxp *::before,
.educa-banner-mylxp *::after {
    font-family: var(--educa-font-family);
}

.educa-banner-mylxp {
    width: var(--educa-banner-width);
    padding: var(--educa-padding-y) var(--educa-padding-x);
    background: var(--educa-color-bg);
    border-radius: var(--educa-radius-main);
    overflow: hidden;
}

.educa-banner-mylxp__inner {
    max-width: var(--educa-inner-max-width);
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--educa-gap-main);
    align-items: center;
}

.educa-banner-mylxp__media {
    text-align: center;
}

.educa-banner-mylxp__tablet {
    max-width: 100%;
    height: auto;
    display: inline-block;
}

.educa-banner-mylxp__content {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.educa-banner-mylxp__logo-wrap {
    margin-bottom: var(--educa-margin-logo);
}

.educa-banner-mylxp__logo {
    max-width: var(--educa-logo-max-width) !important;
    width: 100%;
    height: auto;
    display: block;
}

.educa-banner-mylxp__text-block {
    margin-bottom: var(--educa-margin-text-block);
}

.educa-banner-mylxp__title {
    margin: 0 0 var(--educa-margin-title);
    font-size: var(--educa-title-size);
    line-height: var(--educa-title-line-height);
    font-weight: var(--educa-title-weight);
    color: var(--educa-color-title);
}

.educa-banner-mylxp__text {
    margin: 0;
    font-size: var(--educa-text-size);
    line-height: var(--educa-text-line-height);
    color: var(--educa-color-text);
}

.educa-banner-mylxp__text strong {
    font-weight: var(--educa-text-strong-weight);
    color: var(--educa-color-title);
}

.educa-banner-mylxp__actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--educa-gap-actions);
    margin-bottom: var(--educa-margin-actions);
}

.educa-banner-mylxp__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: var(--educa-btn-min-height);
    padding: var(--educa-btn-padding-y) var(--educa-btn-padding-x);
    border-radius: var(--educa-radius-btn);
    background: var(--educa-color-btn-bg);
    color: var(--educa-color-btn-text);
    text-decoration: none;
    font-weight: var(--educa-btn-weight);
    line-height: var(--educa-btn-line-height);
    transition: var(--educa-transition);
    text-align: center;
}

.educa-banner-mylxp__btn:hover {
    background: var(--educa-color-btn-bg-hover);
    color: var(--educa-color-btn-text);
    transform: translateY(var(--educa-hover-translate-y));
}

.educa-banner-mylxp__more-link {
    display: inline-flex;
    align-items: center;
    gap: var(--educa-gap-link);
    text-decoration: none;
    font-weight: var(--educa-link-weight);
    color: var(--educa-color-link);
}

.educa-banner-mylxp__more-link:hover {
    color: var(--educa-color-link-hover);
}

.educa-banner-mylxp__bottom-banner {
    max-width: var(--educa-bottom-max-width);
    margin: var(--educa-margin-bottom-banner) auto 0;
}

.educa-banner-mylxp__bottom-banner a,
.educa-banner-mylxp__bottom-banner img {
    display: block;
    width: 100%;
}

.educa-banner-mylxp__bottom-banner img {
    height: auto;
    border-radius: var(--educa-radius-img);
}

@media (max-width: 1024px) {
    .educa-banner-mylxp__inner {
        gap: var(--educa-gap-tablet);
    }

    .educa-banner-mylxp__title {
        font-size: var(--educa-title-size-tablet);
    }

    .educa-banner-mylxp__text {
        font-size: var(--educa-text-size-tablet);
    }
}

@media (max-width: 767px) {
    .educa-banner-mylxp {
        padding: var(--educa-padding-mobile-y) var(--educa-padding-mobile-x);
        border-radius: var(--educa-radius-mobile);
    }

    .educa-banner-mylxp__inner {
        grid-template-columns: 1fr;
        gap: var(--educa-gap-mobile);
    }

    .educa-banner-mylxp__media {
        order: 1;
    }

    .educa-banner-mylxp__content {
        order: 2;
    }

    .educa-banner-mylxp__logo-wrap {
        margin-bottom: var(--educa-margin-logo-mobile);
        text-align: left;
    }

    .educa-banner-mylxp__title {
        font-size: var(--educa-title-size-mobile);
    }

    .educa-banner-mylxp__actions {
        flex-direction: column;
    }

    .educa-banner-mylxp__btn {
        width: 100%;
    }

    .educa-banner-mylxp__bottom-banner {
        margin-top: var(--educa-margin-bottom-banner-mobile);
    }
}