<?php
/** Service teaser on the homepage. @package Fragrance_Trade */
$service_query = new WP_Query(
	array(
		'post_type'      => 'service',
		'posts_per_page' => 6,
		'post_status'    => 'publish',
	)
);
if ( ! $service_query->have_posts() ) {
	return;
}
?>
<section id="services" class="b2b-section services-section">
	<div class="container">
		<div class="section-heading text-center mx-auto">
			<p class="section-eyebrow"><?php esc_html_e( '我们的服务', 'fragrance-trade' ); ?></p>
			<h2><?php esc_html_e( '为您的爱车提供的贴膜服务', 'fragrance-trade' ); ?></h2>
			<p><?php esc_html_e( '从隐形车衣到改色与隔热，专业施工，按需定制。', 'fragrance-trade' ); ?></p>
		</div>
		<div class="capability-grid mt-5">
			<?php
			$count = 1;
			while ( $service_query->have_posts() ) :
				$service_query->the_post();
				$image   = get_post_meta( get_the_ID(), '_service_image', true );
				$fallback = 'products/placeholder-0' . ( $count < 10 ? $count : 1 ) . '.svg';
				$img      = $image ? $image : fragrance_trade_asset_uri( $fallback );
				?>
				<article class="capability-card">
					<div class="capability-image"><a href="<?php the_permalink(); ?>"><img src="<?php echo esc_url( $img ); ?>" alt="<?php the_title_attribute(); ?>" class="img-fluid" loading="lazy" decoding="async"></a></div>
					<div class="capability-body">
						<p class="capability-label"><?php esc_html_e( '贴膜服务', 'fragrance-trade' ); ?></p>
						<h3><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3>
						<p><?php echo esc_html( get_the_excerpt() ); ?></p>
						<a href="<?php echo esc_url( home_url( '/contact/?service=' . rawurlencode( get_the_title() ) ) ); ?>" class="btn btn-b2b-outline"><?php esc_html_e( '预约这项服务', 'fragrance-trade' ); ?></a>
					</div>
				</article>
				<?php
				$count++;
			endwhile;
			wp_reset_postdata();
			?>
		</div>
		<div class="text-center mt-5">
			<a href="<?php echo esc_url( home_url( '/services/' ) ); ?>" class="btn btn-b2b-primary"><?php esc_html_e( '查看全部服务项目', 'fragrance-trade' ); ?></a>
		</div>
	</div>
</section>
