.block--page-about-features[data-bg-colour=aqua] {
    background-color: var(--wp--preset--color--aqua);
    color: var(--wp--preset--color--white);
}

.block--page-about-features--image {
    grid-column: 1 / 6;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    height: 100%;
}

.block--page-about-features--image figure {
    mix-blend-mode: multiply;
}

.block--page-about-features--content {
    padding: 140px 0;
    grid-column: 7 / 13;
}

@media screen and (max-width: 1024px) {
    .block--page-about-features--image {
        grid-column: 1 / 13;
        grid-row: 2 / 2;
    }
    
    .block--page-about-features--content {
        padding: 96px 0;
        grid-column: 1 / 13;
        grid-row: 1 / 1;
    }
}

@media screen and (max-width: 768px) {  
    .block--page-about-features--content {
        padding: 80px 0;
    }
}

@media screen and (max-width: 640px) {  
    .block--page-about-features--content {
        padding: 48px 0;
    }
}

.block--page-about-features--content .feature-items {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 32px 24px;
}

@media screen and (max-width: 480px) {  
    .block--page-about-features--content .feature-items {
        grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    }
}

@media screen and (max-width: 360px) {  
    .block--page-about-features--content .feature-items {
        grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
    }
}

.block--page-about-features--content .feature-item {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.block--page-about-features--content .feature-item p {
    color: var(--Cloud, #F1F5F9);
    font-size: clamp(1.25rem, 0.75rem + 1.25vw, 1.875rem);
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    text-transform: capitalize;
    margin-bottom: 0;
}

.feature-item--icon--wrapper {
    border-radius: 48px;
    height: clamp(4rem, 2.4rem + 4vw, 6rem);
    width: clamp(4rem, 2.4rem + 4vw, 6rem);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 5px;
    background-color: var(--wp--preset--color--white);
    box-shadow: 0px 10px 10px 0px rgba(0, 94, 125, 0.10);
}

.feature-item--icon {
    --extra-padding: 0px;
    background-color: #005E7D;
    border-radius: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: calc(16px + var(--extra-padding));    
    box-shadow: 0px 19.202px 41.895px rgba(13, 158, 172, 0.50);
    height: 100%;
    width: 100%;
}

@media screen and (max-width: 768px) {
    .feature-item--icon--wrapper {
        padding: 3px;
    }

    .feature-item--icon {
        --extra-padding: 0px;
        padding: calc(8px + var(--extra-padding));    
    }
}