<?php
/**
 * Template Name: Industries
 *
 * @package ViitorX
 */

if ( ! defined( 'ABSPATH' ) ) {
	exit;
}

$ind_hero_title    = get_field( 'ind_hero_title' );
$ind_hero_subtitle = get_field( 'ind_hero_subtitle' );
$ind_items         = get_field( 'ind_items' );
$ind_stats         = get_field( 'ind_stats' );

get_header();
?>

<div class="page industries-page">
	<main id="primary" class="site-main">

		<section class="hero-inner hero-industries" aria-label="<?php esc_attr_e( 'Industries hero', 'viitorx' ); ?>">
			<?php get_template_part( 'template-parts/hero-wordmark' ); ?>
			<video class="hero-inner__video" autoplay muted loop playsinline preload="metadata" fetchpriority="high" aria-hidden="true">
				<source src="<?php echo esc_url( get_template_directory_uri() . '/assets/videos/inner-page-hero-video.webm' ); ?>" type="video/webm">
			</video>
			<div class="hero-inner__overlay" aria-hidden="true"></div>
			<div class="container hero-inner__content" data-section-reveal>
				<nav class="hero-breadcrumb" aria-label="<?php esc_attr_e( 'Breadcrumb', 'viitorx' ); ?>">
					<a href="<?php echo esc_url( home_url( '/' ) ); ?>"><?php esc_html_e( 'Home', 'viitorx' ); ?></a>
					<span class="hero-breadcrumb__sep" aria-hidden="true">&gt;</span>
					<span class="hero-breadcrumb__current"><?php esc_html_e( 'Industries', 'viitorx' ); ?></span>
				</nav>
				<?php if ( $ind_hero_title ) : ?>
				<h1 class="hero-inner__title"><?php echo esc_html( $ind_hero_title ); ?></h1>
				<?php endif; ?>
				<?php if ( $ind_hero_subtitle ) : ?>
				<p class="hero-inner__subtitle"><?php echo esc_html( $ind_hero_subtitle ); ?></p>
				<?php endif; ?>
			</div>
		</section>

		<?php if ( $ind_items ) : ?>
		<section class="industries" aria-label="<?php esc_attr_e( 'Industries list', 'viitorx' ); ?>">
			<div class="container industries__inner">
				<?php foreach ( $ind_items as $i => $item ) :
					$is_reverse = ( $i % 2 !== 0 );
					$total      = count( $ind_items );
					$index_str  = str_pad( $i + 1, 2, '0', STR_PAD_LEFT ) . ' / ' . str_pad( $total, 2, '0', STR_PAD_LEFT );
				?>
				<article class="industry<?php echo $is_reverse ? ' industry--reverse' : ''; ?>" data-section-reveal aria-label="<?php echo esc_attr( $item['title'] ?? '' ); ?>">
					<div class="industry__text">
						<p class="industry__index"><?php echo esc_html( $index_str ); ?></p>
						<?php if ( ! empty( $item['title'] ) ) : ?>
						<h2 class="industry__title"><?php echo esc_html( $item['title'] ); ?></h2>
						<?php endif; ?>
						<?php if ( ! empty( $item['description'] ) ) : ?>
						<p class="industry__desc"><?php echo esc_html( $item['description'] ); ?></p>
						<?php endif; ?>
						<?php if ( ! empty( $item['bullets'] ) ) : ?>
						<ul class="industry__bullets" aria-label="<?php echo esc_attr( ( $item['title'] ?? '' ) . ' ' . __( 'capabilities', 'viitorx' ) ); ?>">
							<?php foreach ( $item['bullets'] as $bullet ) : ?>
								<?php if ( ! empty( $bullet['text'] ) ) : ?>
								<li class="industry__bullet"><?php echo esc_html( $bullet['text'] ); ?></li>
								<?php endif; ?>
							<?php endforeach; ?>
						</ul>
						<?php endif; ?>
					</div>
					<?php if ( ! empty( $item['image']['url'] ) ) : ?>
					<div class="industry__media" aria-label="<?php echo esc_attr( $item['title'] ?? '' ); ?>">
						<img
							class="industry__img"
							src="<?php echo esc_url( $item['image']['url'] ); ?>"
							alt="<?php echo esc_attr( $item['image']['alt'] ?? '' ); ?>"
							loading="<?php echo 0 === $i ? 'eager' : 'lazy'; ?>"
							decoding="async"
							<?php echo 0 === $i ? 'fetchpriority="high"' : ''; ?>
						>
					</div>
					<?php endif; ?>
				</article>
				<?php endforeach; ?>
			</div>
		</section>
		<?php endif; ?>

		<?php if ( $ind_stats ) : ?>
		<section class="stats" data-section-reveal aria-label="<?php esc_attr_e( 'Stats', 'viitorx' ); ?>">
			<div class="container stats__inner">
				<?php foreach ( $ind_stats as $stat ) :
					$val = (int) ( $stat['value'] ?? 0 );
					$suf = $stat['suffix'] ?? '';
				?>
				<div class="stat-card js-count-stat" data-count-to="<?php echo esc_attr( $val ); ?>" data-count-suffix="<?php echo esc_attr( $suf ); ?>" aria-label="<?php echo esc_attr( $stat['label'] ?? '' ); ?>">
					<p class="stat-card__value stat-count-display">0<?php echo esc_html( $suf ); ?></p>
					<?php if ( ! empty( $stat['label'] ) ) : ?>
					<p class="stat-card__label"><?php echo esc_html( $stat['label'] ); ?></p>
					<?php endif; ?>
				</div>
				<?php endforeach; ?>
			</div>
		</section>
		<?php endif; ?>

		<?php get_template_part( 'template-parts/contact-form-section' ); ?>

	</main>
</div>

<?php get_footer(); ?>