<?php
/**
 * Title: Where We Work Section
 * Slug: virza/virza-where-we-work-section
 * Categories: virza
 * Description: with icons and descriptions.
 * Keywords: services, virza, grid, features
 */
?>
<!-- wp:group {"metadata":{"name":"Where We Work","categories":["virza"],"patternName":"virza/virza-where-we-work-section"},"align":"full","className":"tse-section","layout":{"type":"constrained"}} -->
<div class="wp-block-group alignfull tse-section">
<!-- wp:group {"layout":{"type":"constrained"}} -->
<div class="wp-block-group">
<!-- wp:html -->
<div class="map-container" id="map-lazy-container">
	<img src="<?php echo esc_url( get_stylesheet_directory_uri() ); ?>/assets/images/map-electrician.webp" alt="<?php esc_attr_e( 'Virza service area across London', 'virza' ); ?>" width="100%" height="480" loading="lazy" decoding="async" class="map-static-img">
	<div class="map-load-overlay">
		<button class="map-load-btn">
			<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
				<path d="M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7z" />
				<circle cx="12" cy="9" r="2.5"/>
			</svg>
			<?php esc_html_e( 'View Interactive Map', 'virza' ); ?>
		</button>
	</div>
</div>
<!-- /wp:html -->
</div>
<!-- /wp:group -->
</div>
<!-- /wp:group -->
