<section data-component-type="Hero" class="relative w-full overflow-hidden" data-component-slug="interior-product-showcase-template-service-hero">
  <!-- ================= STYLES ================= -->
  

  <!-- ================= HERO ================= -->
  <div class="service-hero-wrapper">
    <!-- BACKGROUND IMAGE (SAFE) -->
    <img src="{{sh_hero_background}}" alt class="service-hero-bg-img" data-node="sh_hero_background" data-node-type="file" data-node-default="https://res.cloudinary.com/duukclzsd/image/upload/v1768210841/seltrix/templates/interior-product-showcase-template/srvices-hero.webp">

    <!-- CONTENT -->
    <div class="service-hero-content">
      <h1 class="service-hero-heading" data-node="sh_hero_heading" data-node-type="text" data-node-default="Interiors That Elevate Every Space Effortlessly">
        {{sh_hero_heading}}
      </h1>

      <p class="service-hero-subtext" data-node="sh_hero_subtext" data-node-type="text" data-node-default="From furniture selection to material coordination, every service is designed to bring beauty to your space.">
        {{sh_hero_subtext}}
      </p>

      <a href="{{sh_hero_cta_link}}" class="service-hero-cta" data-node="sh_hero_cta_link" data-node-type="url" data-node-default="#">
        <span data-node="sh_hero_cta_text" data-node-type="text" data-node-default="Explore Services">
          {{sh_hero_cta_text}}
        </span>
      </a>

      <img src="{{sh_hero_scroll_icon}}" class="service-hero-scroll" id="heroScrollTrigger" data-node="sh_hero_scroll_icon" data-node-type="file" data-node-default="https://res.cloudinary.com/duukclzsd/image/upload/v1768302454/seltrix/templates/interior-product-showcase-template/scroll.svg" alt="Scroll Down">
    </div>
  </div>

  <!-- ================= SCRIPT ================= -->
  
</section>