<section class="bg-[#F6FBFF] py-16 overflow-hidden" data-component-type="Content" data-component-slug="real-estate-template-marquee">
  <div class="max-w-[90%] mx-auto">

    <div class="flex flex-col lg:flex-row items-center justify-between gap-12">

    

      <!-- RIGHT MARQUEE -->
      <div class="relative w-full lg:w-[100%] overflow-hidden">

        <!-- LEFT GRADIENT -->
        <div class="absolute left-0 top-0 h-full w-32 z-20 pointer-events-none
                    bg-gradient-to-r from-[#f6fafb] to-transparent"></div>

        <!-- RIGHT GRADIENT -->
        <div class="absolute right-0 top-0 h-full w-32 z-20 pointer-events-none
                    bg-gradient-to-l from-[#f6fafb] to-transparent"></div>

        <!-- MARQUEE TRACK -->
        <div class="marquee-track flex items-center gap-14">

          <!-- LOGO SET 1 -->
          <div class="flex items-center gap-14">
            <img src="{{brand_logo_1}}" data-node="brand_logo_1" data-node-type="file" data-node-label="Brand Logo 1" data-node-default="https://res.cloudinary.com/duukclzsd/image/upload/v1767359369/seltrix/templates/real-estate-template/m1.png" class="h-8 w-auto flex-shrink-0 opacity-40">
            <img src="{{brand_logo_2}}" data-node="brand_logo_2" data-node-type="file" data-node-label="Brand Logo 2" data-node-default="https://res.cloudinary.com/duukclzsd/image/upload/v1767359374/seltrix/templates/real-estate-template/m5.png" class="h-10 w-auto flex-shrink-0">
            <img src="{{brand_logo_3}}" data-node="brand_logo_3" data-node-type="file" data-node-label="Brand Logo 3" data-node-default="https://res.cloudinary.com/duukclzsd/image/upload/v1767359370/seltrix/templates/real-estate-template/m2.png" class="h-9 w-auto flex-shrink-0">
            <img src="{{brand_logo_4}}" data-node="brand_logo_4" data-node-type="file" data-node-label="Brand Logo 4" data-node-default="https://res.cloudinary.com/duukclzsd/image/upload/v1767359372/seltrix/templates/real-estate-template/m3.png" class="h-9 w-auto flex-shrink-0">
            <img src="{{brand_logo_5}}" data-node="brand_logo_5" data-node-type="file" data-node-label="Brand Logo 5" data-node-default="https://res.cloudinary.com/duukclzsd/image/upload/v1767359373/seltrix/templates/real-estate-template/m4.png" class="h-8 w-auto flex-shrink-0 opacity-40">
          
            
          </div>

          <!-- LOGO SET 2 (DUPLICATE FOR MARQUEE LOOP) -->
          <div class="flex items-center gap-14">
            <img src="{{brand_logo_1}}" class="h-8 w-auto flex-shrink-0 ">
            <img src="{{brand_logo_2}}" class="h-10 w-auto flex-shrink-0 ">
            <img src="{{brand_logo_3}}" class="h-9 w-auto flex-shrink-0">
            <img src="{{brand_logo_4}}" class="h-9 w-auto flex-shrink-0">
            <img src="{{brand_logo_5}}" class="h-8 w-auto flex-shrink-0 ">
          </div>

        </div>
      </div>

    </div>
  </div>
</section>