.sectionPromo
{
    margin: 40px 0 60px 0;
}
.promoGrid {
    display: grid;
    grid-template-columns: 2fr 1fr;
    margin-bottom: 50px;
    border-radius: 20px;
    overflow: hidden;
    line-height: 1.5;
    text-align: center;
    background-color: #000;
}

.promoGridNarrow {
    grid-template-columns: 1fr 1fr;
}

.promoGrid h2, .promoAbout h2 {
    margin-bottom: 0px;
    font-size: 52px;
    line-height: 105%;
}

.promoGrid .heroImg {
    align-self: center;

}

.promoGrid .promoContent {
    background: linear-gradient(160deg, #1F51A5, #191D70);
    color: #fff;
    padding: 30px;
    display: flex;
    gap: 30px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.promoGridNarrow .promoContent {
    padding: 20px;
}

.promoGridNarrow .promoContent .promoText {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.promoGrid .promoContent .CTA {
    background: linear-gradient(15deg, #5939DB, #D433E2, #E83595);
    color: #fff;
    font-weight: 600;
    border-radius: 30px;
    padding: 10px 34px 10px 34px;
    box-shadow: rgba(0, 0, 0, 0.08) 0px 0px 2px 0px, rgba(0, 0, 0, 0.1) 0px 4px 8px 0px;
    transition: all 200ms ease 0s;
    align-self: center;
    text-decoration: none;
    font-size: 24px;
}

.promoGrid .promoContent .CTAnote
{
    margin-top: -18px;
    font-size: 12px;
}

.promoGrid .promoContent .CTA:hover {
    transform: scale(1.1);
    color: #fff;
}

.promoGridNarrow .promoContent .CTA {
    margin-top: 0px;
    padding: 8px;
    min-width: 150px;
}

.promoAbout {
    background: linear-gradient(135deg, #eadeff, #dfeaff 25%, #ecf4fa 70%, #e5fffc);
    border-radius: 20px;
    display: grid;
    grid-template-columns: 2fr 1fr;
    text-decoration: none;
    padding: 20px 20px 0 20px;
    column-gap: 30px;
    align-items: center;
    justify-items: center;
}

.promoAbout img {
    align-self: self-end;
}

.promoAbout .promoContent {
    padding: 30px;
    display: flex;
    gap: 30px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    max-width: 800px;
}

.promoAbout .promoContent a {
    background-color: #fff;
    border-radius: 10px;
    padding: 4px 32px 4px 16px;
    color: #1B2D81;
    text-decoration: none;
    background-position: right 10px center;
    background-repeat: no-repeat;
    background-image: url('data:image/svg+xml, <svg width="16" height="16" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.00977 16.2402C5.00977 16.0775 5.03906 15.9212 5.09766 15.7715C5.15625 15.6217 5.2474 15.485 5.37109 15.3613L10.7324 10L5.37109 4.62891C5.13021 4.38802 5.00977 4.0918 5.00977 3.74023C5.00977 3.57096 5.04232 3.41146 5.10742 3.26172C5.17253 3.11198 5.26042 2.97852 5.37109 2.86133C5.48177 2.74414 5.61523 2.65299 5.77148 2.58789C5.92773 2.52279 6.09049 2.49023 6.25977 2.49023C6.42253 2.49023 6.58203 2.52279 6.73828 2.58789C6.89453 2.65299 7.02799 2.74414 7.13867 2.86133L13.3887 9.11133C13.4993 9.22201 13.5872 9.35547 13.6523 9.51172C13.7174 9.66797 13.7533 9.82747 13.7598 9.99023C13.7598 10.3353 13.6361 10.6315 13.3887 10.8789L7.13867 17.1289C7.02148 17.2461 6.88802 17.3372 6.73828 17.4023C6.58854 17.4674 6.42578 17.5 6.25 17.5C6.07422 17.5 5.91146 17.4674 5.76172 17.4023C5.61198 17.3372 5.48177 17.2493 5.37109 17.1387C5.26042 17.028 5.17253 16.8945 5.10742 16.7383C5.04232 16.582 5.00977 16.416 5.00977 16.2402Z" fill="%231B2D81"/></svg>');
}

.promoAbout .promoContent a:hover {
    background-position: right 5px center;
}

@media (min-width: 991px) and (max-width: 1400px) {
    .promoGrid h2, .promoAbout h2 {
        font-size: 38px;
    }

    .promoGrid .promoContent .CTA {
        border-radius: 24px;
        padding: 10px 24px 10px 24px;
        font-size: 20px;
    }
}

@media (max-width: 990px) {
    .promoGrid, .promoAbout {
        grid-template-columns: 1fr;
    }

    .promoGrid .promoContent .CTA {
        border-radius: 24px;
        padding: 10px 24px 10px 24px;
        font-size: 20px;
    }

    .promoGrid h2, .promoAbout h2 {
        font-size: 38px;
    }

}