<section data-component-type="Content" class="bg-[#E2FC80] py-[30px] lg:py-[0]  relative overflow-hidden" data-component-slug="ss-technology-template-one_platform_banner">
  <div class="max-w-[90%] mx-auto grid grid-cols-1 lg:grid-cols-2 gap-12 lg:gap-20 items-center">
    
    <!-- Left Column: Content -->
    <div class="flex flex-col items-start z-10">
      <h2 class="text-4xl md:text-5xl lg:text-6xl font-bold text-[#0A2519] leading-tight mb-6" data-node="banner_heading" data-node-type="textarea" data-node-default="One Platform. Endless Financial Possibilities.">
          {{banner_heading}}
      </h2>
      
      <p class="text-[#4A736D] text-lg md:text-xl mb-10 max-w-xl leading-relaxed" data-node="banner_desc" data-node-type="textarea" data-node-default="Whether you're managing personal finances or enterprise-level operations, our platform adapts to your needs—today and as you grow.">
         {{banner_desc}}
      </p>
      
      <a href="{{banner_cta_link}}" class="inline-flex items-center justify-center px-8 py-4 bg-[#01483D] hover:bg-[#003D33] text-white font-semibold rounded-lg transition-colors duration-200" data-node="banner_cta_link" data-node-type="text" data-node-default="#">
          <span data-node="banner_cta_text" data-node-type="text" data-node-default="Get Started Today">{{banner_cta_text}}</span>
      </a>
    </div>

    <!-- Right Column: Image -->
    <div class="relative z-10 flex justify-center lg:justify-center items-end lg:h-[500px] h-auto">
        <!-- Decorative Circle behind phone -->
           <div class="hidden lg:block absolute top-0 right-0 -translate-y-[200px] translate-x-1/3 w-[600px] h-[600px] rounded-full border-[50px] border-[#96D649]/30 pointer-events-none"></div>

         
         <img src="{{banner_image}}" alt="App Interface" class="relative z-10 w-full max-w-[350px] drop-shadow-2xl " data-node="banner_image" data-node-type="file" data-node-label="Phone Mockup" data-node-default="https://res.cloudinary.com/duukclzsd/image/upload/v1767956689/seltrix/templates/ss-technology-template/phone_mockup.png">
    </div>
    
  </div>
  
  <!-- Background Decorations (Optional) -->
  <div class="absolute right-0 top-0 w-1/3 h-full bg-[#E2FC80] rounded-l-full opacity-50 pointer-events-none hidden lg:block"></div>
</section>