/* Soft colour fields: only transform and opacity change between frames. */
.may-intro { overflow: hidden; border-radius: 26px; }
.may-intro .wpb_column.pos-middle > .uncol { position: relative; z-index: 1; }
.may-intro .wpb_column.pos-middle {
    background: linear-gradient(125deg, #f1eaf8, #f6f0fc 52%, #eeeaf4);
}
.may-intro .wpb_column.pos-middle {
    overflow: hidden;
    isolation: isolate;
    position: relative;
}
.may-intro .wpb_column.pos-middle::before,
.may-intro .wpb_column.pos-middle::after {
    content: "";
    position: absolute;
    inset: -15%;
    pointer-events: none;
    animation-play-state: paused;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-direction: alternate;
}
.may-intro .wpb_column.pos-middle::before {
    background:
        radial-gradient(ellipse at 20% 24%, rgba(145, 89, 162, .30), rgba(177, 145, 201, .14) 30%, transparent 58%),
        radial-gradient(ellipse at 85% 80%, rgba(122, 152, 120, .27), rgba(157, 173, 151, .10) 28%, transparent 56%);
    animation-name: may-intro-drift;
    animation-duration: 26s;
}
.may-intro .wpb_column.pos-middle::after {
    background:
        radial-gradient(ellipse at 65% 32%, rgba(255, 255, 255, .82), transparent 54%),
        radial-gradient(ellipse at 32% 86%, rgba(185, 151, 211, .29), transparent 52%),
        radial-gradient(ellipse at 93% 12%, rgba(145, 89, 162, .15), transparent 46%);
    animation-name: may-intro-light;
    animation-duration: 34s;
}
.may-intro.may-intro--active .wpb_column.pos-middle::before,
.may-intro.may-intro--active .wpb_column.pos-middle::after {
    animation-play-state: running;
    will-change: transform, opacity;
}
@keyframes may-intro-drift {
    from { transform: translate(-4%, 2%) rotate(-5deg) scale(1.02); opacity: .78; }
    50% { opacity: 1; }
    to { transform: translate(5%, -4%) rotate(6deg) scale(1.09); opacity: .86; }
}
@keyframes may-intro-light {
    from { transform: translate(4%, -3%) rotate(4deg) scale(1.06); opacity: .9; }
    to { transform: translate(-5%, 5%) rotate(-7deg) scale(1.01); opacity: .62; }
}
@media (prefers-reduced-motion: reduce) {
    .may-intro .wpb_column.pos-middle::before,
    .may-intro .wpb_column.pos-middle::after {
        animation: none;
        will-change: auto;
    }
}