.elementor-1560 .elementor-element.elementor-element-19e070bd{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:48px 48px;--row-gap:48px;--column-gap:48px;border-style:solid;--border-style:solid;border-width:1px 0px 0px 0px;--border-top-width:1px;--border-right-width:0px;--border-bottom-width:0px;--border-left-width:0px;border-color:var( --e-global-color-893a158 );--border-color:var( --e-global-color-893a158 );--margin-top:50px;--margin-bottom:50px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:70px;--padding-right:70px;}.elementor-1560 .elementor-element.elementor-element-4f744f28{text-align:center;}.elementor-1560 .elementor-element.elementor-element-4f744f28 .elementor-heading-title{color:var( --e-global-color-primary );}.elementor-1560 .elementor-element.elementor-element-7a87df44 .gallery-item .gallery-caption{display:none;}@media(max-width:767px){.elementor-1560 .elementor-element.elementor-element-19e070bd{--padding-top:48px;--padding-bottom:48px;--padding-left:32px;--padding-right:32px;}}/* Start custom CSS for image-gallery, class: .elementor-element-7a87df44 *//* 1. Setup the 7-Column Grid */
.logo-gallery .gallery {
    display: grid !important;
    grid-template-columns: repeat(8, 1fr) !important;
    gap: 30px 80px !important; /* 60px gap everywhere */
    margin: 0 !important;
}

/* 2. Reset individual item spacing */
.logo-gallery .gallery-item {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    display: flex;
    align-items: center;     /* Vertically center */
    justify-content: center; /* Horizontally center */
}

/* 3. Image Sizing & Smooth Transition */
.logo-gallery .gallery-item img {
    height: 80px !important;  /* Fixed height */
    width: auto !important;   /* Protects aspect ratio */
    object-fit: contain;
    transition: transform 0.3s ease-in-out;
    transform-origin: center;
}

/* 4. The "Grow" Hover Effect */
.logo-gallery .gallery-item img:hover {
    transform: scale(1.15); 
}

/* --- RESPONSIVE FIXES --- */

/* Tablet (Portrait): Switch to 4 columns, Keep 60px gap */
@media (max-width: 1024px) {
    .logo-gallery .gallery {
        grid-template-columns: repeat(4, 1fr) !important;
        gap: 60px !important; /* Strict 60px gap */
    }
}

/* Mobile: Switch to 2 columns, Keep 60px gap */
@media (max-width: 767px) {
    .logo-gallery .gallery {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 60px !important; /* Strict 60px gap */
    }
    
    /* Optional: Make logos slightly smaller on mobile so they fit with the big gap */
    .logo-gallery .gallery-item img {
        height: 60px !important; 
    }
}/* End custom CSS */