<?php
/**
 * The template for displaying 404 pages (not found)
 *
 * @link https://codex.wordpress.org/Creating_an_Error_404_Page
 *
 * @package lumex
 */

get_header();
?>


	<!-- 404 hero -->
	<div class="mil-hero-5 mil-hero-404" id="top">
		<?php 
		$image = wp_get_attachment_image_url(  get_field( 'p404_bg_image', 'options' ), 'lumex_1920xAuto' ); 
		$image_alt = get_post_meta(  get_field( 'p404_bg_image', 'options' ), '_wp_attachment_image_alt', true);
		if ( $image ) : ?>
			<img src="<?php echo esc_url( $image ); ?>" alt="<?php if ( $image_alt ) : echo esc_attr( $image_alt ); else : echo esc_attr__( 'image', 'lumex' ); endif; ?>" class="mil-hero-bg mil-scale-img-top" data-value-1="1" data-value-2="1.3" />
		<?php endif; ?>
		<div class="mil-overlay"></div>

		<div class="mil-hero-content">
			<div class="mil-container mil-tac">
				<p class="mil-c-m-3 mil-mb-4 mil-t-16"><?php
					if ( get_field( 'p404_subtitle', 'options' ) ) :
						echo wp_kses_post( get_field( 'p404_subtitle', 'options' ) ); 
					else :
						echo esc_html__( 'Oops!', 'lumex' );
					endif;
				?></p>
				<h1 class="mil-fs-xxxl mil-c-m-4 mil-tac mil-mb-4"><?php
					if ( get_field( 'p404_title', 'options' ) ) :
						echo wp_kses_post( get_field( 'p404_title', 'options' ) ); 
					else :
						echo esc_html__( 'Error', 'lumex' );
					endif;
				?> <span class="mil-opacity-text"><?php
					if ( get_field( 'p404_title_accent', 'options' ) ) :
						echo wp_kses_post( get_field( 'p404_title_accent', 'options' ) ); 
					else :
						echo esc_html__( '404', 'lumex' );
					endif;
				?></span></h1>
				<p class="mil-c-m-3 mil-mb-4 mil-tac mil-t-16"><?php 
					if ( get_field( 'p404_content', 'options' ) ) :
						echo wp_kses_post( get_field( 'p404_content', 'options' ) ); 
					else :
						echo esc_html__( 'Looks like you got lost', 'lumex' );
					endif;
				?></p>
				<a href="<?php echo esc_url( home_url( '/' ) ); ?>" class="mil-btn mil-accent">
					<span><?php echo esc_html__( 'Back to homepage', 'lumex' ); ?></span>
					<i class="fa fa-arrow-right"></i>
				</a>
			</div>
		</div>
	</div>
<?php
get_footer();