{# Hero Section Component #}
<section class="demo-hero">
	<div class="container">
		<h1>{{ theme_config('hero-title') }}</h1>
		<p>{{ theme_config('hero-subtitle') }}</p>
		<div
			class="hero-actions">
			{# <a href="{{ path('frontend.navigation.page', {'navigationId': config('core.listing.defaultListingId')}) }}" class="btn btn-primary btn-lg me-2">
										<i class="bi bi-shop"></i>
										{{ "general.shopNow"|trans|default("Shop Now") }}
									</a> #}
			<a href="#featured" class="btn btn-outline-light btn-lg">
				{{ "general.learnMore"|trans|default("Learn More") }}
			</a>
		</div>

		{# Category Cards in Hero #}
		<div class="hero-categories">
			<div
				class="row g-4">
				{# Router Cutters #}
				<div class="col-lg-4 col-md-6">
					<a href="#" class="hero-category-card">
						<div class="category-image-wrapper">
							<img src="{{ asset('bundles/demotheme/assets/router-cutters.png', 'asset') }}" alt="Router Cutters">
						</div>
						<h3>
							<i class="bi bi-gear-fill"></i>
							Router Cutters</h3>
						<p>Precision milling and routing bits for professional woodworking and metalworking</p>
					</a>
				</div>

				{# Drill Bits #}
				<div class="col-lg-4 col-md-6">
					<a href="#" class="hero-category-card">
						<div class="category-image-wrapper">
							<img src="{{ asset('bundles/demotheme/assets/drill-bits.png', 'asset') }}" alt="Drill Bits">
						</div>
						<h3>
							<i class="bi bi-tools"></i>
							Drill Bits</h3>
						<p>High-speed steel drill bits for metal, wood, and concrete drilling applications</p>
					</a>
				</div>

				{# Saw Blades #}
				<div class="col-lg-4 col-md-6">
					<a href="#" class="hero-category-card">
						<div class="category-image-wrapper">
							<img src="{{ asset('bundles/demotheme/assets/saw-blades.png', 'asset') }}" alt="Saw Blades">
						</div>
						<h3>
							<i class="bi bi-circle"></i>
							Saw Blades</h3>
						<p>Industrial-grade circular saw blades and cutting discs for all materials</p>
					</a>
				</div>
			</div>
		</div>
	</div>
</section>