.elementor-6408 .elementor-element.elementor-element-584fea4:not(.elementor-motion-effects-element-type-background), .elementor-6408 .elementor-element.elementor-element-584fea4 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F9FFFB;}.elementor-6408 .elementor-element.elementor-element-584fea4{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;}.elementor-6408 .elementor-element.elementor-element-584fea4 > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-6408 .elementor-element.elementor-element-4be174e > .elementor-widget-container{padding:65px 0px 0px 0px;}.elementor-6408 .elementor-element.elementor-element-a94c231:not(.elementor-motion-effects-element-type-background), .elementor-6408 .elementor-element.elementor-element-a94c231 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FEFEFE;}.elementor-6408 .elementor-element.elementor-element-a94c231{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;}.elementor-6408 .elementor-element.elementor-element-a94c231 > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-6408 .elementor-element.elementor-element-6c703bf > .elementor-widget-container{padding:50px 0px 20px 0px;}.elementor-6408 .elementor-element.elementor-element-068376f .e-gallery-item:hover .elementor-gallery-item__overlay, .elementor-6408 .elementor-element.elementor-element-068376f .e-gallery-item:focus .elementor-gallery-item__overlay{background-color:rgba(0,0,0,0.5);}.elementor-6408 .elementor-element.elementor-element-068376f{--image-border-width:0px;--image-border-radius:6px;--image-transition-duration:800ms;--overlay-transition-duration:800ms;--content-text-align:center;--content-padding:20px;--content-transition-duration:800ms;--content-transition-delay:800ms;}.elementor-6408 .elementor-element.elementor-element-068376f .e-gallery-image{filter:brightness( 100% ) contrast( 100% ) saturate( 100% ) blur( 0px ) hue-rotate( 0deg );}.elementor-6408 .elementor-element.elementor-element-71637cc{margin-top:60px;margin-bottom:60px;}@media(min-width:768px){.elementor-6408 .elementor-element.elementor-element-0dacf79{width:30%;}.elementor-6408 .elementor-element.elementor-element-bbb720d{width:70%;}}/* Start custom CSS for shortcode, class: .elementor-element-4be174e */<div class="modern-section-header">
    <h3 class="header-title">FRANCHISE BRANDS</h3>
</div>

[modern_clients_slider]

<style>
    /* --- HEADING STYLE --- */
    .modern-section-header {
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 40px; /* Gap between heading and slider */
        width: 100%;
    }

    .header-title {
        position: relative;
        font-family: 'Poppins', sans-serif; /* Clean Font */
        font-size: 22px;
        font-weight: 600;
        text-transform: uppercase;
        color: #444; /* Dark Gray Heading */
        margin: 0;
        padding: 0 25px; /* Space around text */
        white-space: nowrap;
    }

    /* The Lines (Left & Right) */
    .header-title::before,
    .header-title::after {
        content: "";
        position: absolute;
        top: 50%;
        width: 1000px; /* Long enough to cover screen */
        height: 1px;
        background-color: #ddd; /* Light Gray Line */
        transform: translateY(-50%);
        z-index: -1; /* Text ke peeche rahe */
    }

    /* Right Line positioning */
    .header-title::after { left: 100%; }
    /* Left Line positioning */
    .header-title::before { right: 100%; }
    
    /* Container to hide overflow lines */
    .modern-section-header { overflow: hidden; }


    /* --- SLIDER STYLE --- */
    .brand-slider-wrapper {
        width: 100%;
        overflow: hidden; /* Hide scrollbar */
        position: relative;
        background: transparent;
        padding: 10px 0;
    }

    .brand-track {
        display: flex;
        width: max-content; /* Auto width based on content */
        animation: scroll-left 25s linear infinite; /* Smooth continuous scroll */
    }

    .brand-slide {
        width: 180px; /* Logo Container Width */
        padding: 0 30px; /* Gap between logos */
        display: flex;
        align-items: center;
        justify-content: center;
    }

    /* Logo Image Styles */
    .brand-slide img {
        max-width: 100%;
        height: auto;
        max-height: 80px; /* Control logo height */
        object-fit: contain;
        
        /* Modern Grayscale Effect */
        filter: grayscale(100%);
        opacity: 0.5;
        transition: all 0.4s ease;
    }

    /* Hover Effect (Color & Pop) */
    .brand-slider-wrapper:hover .brand-slide img {
        /* Jab user slider pe mouse laye to sab thore clear ho jayen */
        opacity: 0.7; 
    }
    
    .brand-slide img:hover {
        /* Specific logo pe mouse laye to wo full color ho jaye */
        filter: grayscale(0%);
        opacity: 1;
        transform: scale(1.1); /* Slight Zoom */
        cursor: pointer;
    }

    /* --- ANIMATION KEYFRAMES --- */
    @keyframes scroll-left {
        0% { transform: translateX(0); }
        100% { transform: translateX(-50%); } /* Move half (since we duplicated loop) */
    }

    /* --- RESPONSIVE MOBILE --- */
    @media (max-width: 768px) {
        .header-title { font-size: 16px; padding: 0 15px; }
        .brand-slide { width: 140px; padding: 0 15px; } /* Mobile pe logo chota */
        .brand-slide img { max-height: 60px; }
    }
</style>/* End custom CSS */