<section data-component-type="Content" class="bg-[#0019BA] py-20 px-4 sm:px-6 lg:px-8" data-component-slug="ss-interior-kitchen-awards_banner">
  <div class="max-w-6xl mx-auto text-center">
    
    <!-- Heading -->
    <h2 data-node="awards_heading" data-node-type="text" data-node-label="Heading" data-node-default="Awards" class="text-6xl md:text-8xl font-bold text-white mb-16 tracking-tight">
      {{awards_heading}}
    </h2>

    <!-- Awards Grid/Flex -->
    <div class="flex flex-wrap justify-center gap-6">
      
      <!-- Award 1 -->
      <div class="bg-white/5 backdrop-blur-sm border border-white/20 rounded-lg p-4 flex items-center gap-4 min-w-[280px] text-left">
        <div class="bg-white p-2 rounded shrink-0">
             <img data-node="award_1_icon" data-node-type="file" data-node-label="Award 1 Icon" data-node-default="https://res.cloudinary.com/duukclzsd/image/upload/v1767779829/seltrix/templates/ss-interior-kitchen/cup.png" src="{{award_1_icon}}" alt="Icon" class="w-8 h-8 object-contain">
        </div>
        <div>
          <h3 data-node="award_1_title" data-node-type="text" data-node-label="Award 1 Title" data-node-default="Design" class="text-white font-bold text-lg leading-tight font-mono">
            {{award_1_title}}
          </h3>
          <p data-node="award_1_year" data-node-type="text" data-node-label="Award 1 Year" data-node-default="2024" class="text-white/80 font-mono text-sm">
            {{award_1_year}}
          </p>
        </div>
      </div>

       <!-- Award 2 -->
      <div class="bg-white/5 backdrop-blur-sm border border-white/20 rounded-lg p-4 flex items-center gap-4 min-w-[280px] text-left">
        <div class="bg-white p-2 rounded shrink-0">
             <img data-node="award_2_icon" data-node-type="file" data-node-label="Award 2 Icon" data-node-default="https://res.cloudinary.com/duukclzsd/image/upload/v1767779829/seltrix/templates/ss-interior-kitchen/cup.png" src="{{award_2_icon}}" alt="Icon" class="w-8 h-8 object-contain">
        </div>
        <div>
          <h3 data-node="award_2_title" data-node-type="text" data-node-label="Award 2 Title" data-node-default="Innovation" class="text-white font-bold text-lg leading-tight font-mono">
            {{award_2_title}}
          </h3>
          <p data-node="award_2_year" data-node-type="text" data-node-label="Award 2 Year" data-node-default="2023" class="text-white/80 font-mono text-sm">
            {{award_2_year}}
          </p>
        </div>
      </div>

       <!-- Award 3 -->
      <div class="bg-white/5 backdrop-blur-sm border border-white/20 rounded-lg p-4 flex items-center gap-4 min-w-[280px] text-left">
        <div class="bg-white p-2 rounded shrink-0">
             <img data-node="award_3_icon" data-node-type="file" data-node-label="Award 3 Icon" data-node-default="https://res.cloudinary.com/duukclzsd/image/upload/v1767779829/seltrix/templates/ss-interior-kitchen/cup.png" src="{{award_3_icon}}" alt="Icon" class="w-8 h-8 object-contain">
        </div>
        <div>
          <h3 data-node="award_3_title" data-node-type="text" data-node-label="Award 3 Title" data-node-default="Best Line" class="text-white font-bold text-lg leading-tight font-mono">
            {{award_3_title}}
          </h3>
          <p data-node="award_3_year" data-node-type="text" data-node-label="Award 3 Year" data-node-default="2022" class="text-white/80 font-mono text-sm">
            {{award_3_year}}
          </p>
        </div>
      </div>

       <!-- Award 4 -->
      <div class="bg-white/5 backdrop-blur-sm border border-white/20 rounded-lg p-4 flex items-center gap-4 min-w-[280px] text-left">
        <div class="bg-white p-2 rounded shrink-0">
             <img data-node="award_4_icon" data-node-type="file" data-node-label="Award 4 Icon" data-node-default="https://res.cloudinary.com/duukclzsd/image/upload/v1767779829/seltrix/templates/ss-interior-kitchen/cup.png" src="{{award_4_icon}}" alt="Icon" class="w-8 h-8 object-contain">
        </div>
        <div>
          <h3 data-node="award_4_title" data-node-type="text" data-node-label="Award 4 Title" data-node-default="Choice Award" class="text-white font-bold text-lg leading-tight font-mono">
            {{award_4_title}}
          </h3>
          <p data-node="award_4_year" data-node-type="text" data-node-label="Award 4 Year" data-node-default="2021" class="text-white/80 font-mono text-sm">
            {{award_4_year}}
          </p>
        </div>
      </div>

       <!-- Award 5 -->
      <div class="bg-white/5 backdrop-blur-sm border border-white/20 rounded-lg p-4 flex items-center gap-4 min-w-[280px] text-left">
        <div class="bg-white p-2 rounded shrink-0">
             <img data-node="award_5_icon" data-node-type="file" data-node-label="Award 5 Icon" data-node-default="https://res.cloudinary.com/duukclzsd/image/upload/v1767779829/seltrix/templates/ss-interior-kitchen/cup.png" src="{{award_5_icon}}" alt="Icon" class="w-8 h-8 object-contain">
        </div>
        <div>
          <h3 data-node="award_5_title" data-node-type="text" data-node-label="Award 5 Title" data-node-default="Sustainability" class="text-white font-bold text-lg leading-tight font-mono">
            {{award_5_title}}
          </h3>
          <p data-node="award_5_year" data-node-type="text" data-node-label="Award 5 Year" data-node-default="2020" class="text-white/80 font-mono text-sm">
            {{award_5_year}}
          </p>
        </div>
      </div>

    </div>

  </div>
</section>