.icon-box-wrapper {
    display: flex;
    gap: 1rem;
    padding: 1rem;
    background: #8d8d8d1c
}

/* Image occupies only needed space */
.icon-box-wrapper > img {
    flex: 0 0 auto;
    max-width: 4rem;
    height: auto;
    filter: invert(100%) sepia(0%) saturate(2476%) hue-rotate(359deg) brightness(50%) contrast(119%);
}

.icon-box-icon {
    font-family: 'icomoon';
    font-size: 2rem;
    color: inherit; /* or a fixed color */
    display: inline-block;
}

/* Text occupies remaining space */
.icon-box-text {
    flex: 1;
}

/* Horizontal (left/right) alignment: vertically centered */
.position-desktop-left {
    flex-direction: row;
    align-items: center;
}

.position-desktop-right {
    flex-direction: row-reverse;
    align-items: center;
}

/* Vertical (top/bottom) alignment: horizontally centered */
.position-desktop-top {
    flex-direction: column;
    align-items: center;
}

.position-desktop-bottom {
    flex-direction: column-reverse;
    align-items: center;
}

/* Tablet responsive */
@media (max-width: 1024px) {
    .position-tablet-left {
        flex-direction: row;
        align-items: center;
    }

    .position-tablet-right {
        flex-direction: row-reverse;
        align-items: center;
    }

    .position-tablet-top {
        flex-direction: column;
        align-items: center;
    }

    .position-tablet-bottom {
        flex-direction: column-reverse;
        align-items: center;
    }
}

/* Mobile responsive */
@media (max-width: 768px) {
    .position-mobile-left {
        flex-direction: row;
        align-items: center;
    }

    .position-mobile-right {
        flex-direction: row-reverse;
        align-items: center;
    }

    .position-mobile-top {
        flex-direction: column;
        align-items: center;
    }

    .position-mobile-bottom {
        flex-direction: column-reverse;
        align-items: center;
    }
}
