<?php
/**
 * The template part for displaying services cards of home page
 *
 */

// Exit if accessed directly.
defined( 'ABSPATH' ) || exit;

if(!!$args['isLast'] === false && !!$args['is_invitation_card'] === false):

?>

<div class="card__wrapper">
    <div class="card__background">
        <img alt="<?php echo esc_attr($args['img']['alt']); ?>" class="lazy"
            src="<?php echo esc_attr($args['img']['sizes']['thumbnail']); ?>"
            data-src="<?php echo esc_attr($args['img']['sizes']['large']); ?>" 
			data-srcset="<?php echo esc_attr($args['img']['sizes']['medium']); ?> 300w,
            <?php echo esc_attr($args['img']['sizes']['large']); ?> 768w,
            <?php echo esc_attr($args['img']['sizes']['1536x1536']); ?> 1024w" 
			data-sizes="100w" 
			/>
    </div>
    <a class="card__anchor" href="<?php echo esc_attr( $args['link'] )?>">
        <h1 class="btnText__alt"><?php echo esc_html( $args['title'] )  ?></h1>
    </a>
</div>

<?php elseif (!!$args['is_invitation_card']): ?>

<div class="card__wrapper">
    <div class="card__background">
        <img alt="<?php echo esc_attr($args['img']['alt']); ?>" class="lazy"
            src="<?php echo esc_attr($args['img']['sizes']['thumbnail']); ?>"
            data-src="<?php echo esc_attr($args['img']['sizes']['large']); ?>" 
			data-srcset="<?php echo esc_attr($args['img']['sizes']['medium']); ?> 300w,
            <?php echo esc_attr($args['img']['sizes']['large']); ?> 768w,
            <?php echo esc_attr($args['img']['sizes']['1536x1536']); ?> 1024w" 
			data-sizes="100w" 
			/>
    </div>
    <div class="card__body" href="<?php echo esc_attr( $args['link'] )?>">
        <h1 class="heading3"><?php echo esc_html( $args['title'] )  ?></h1>
        <p class="paragraph"><?php echo esc_html( $args['text'] ) ?></p>
        <button data-title="<?php echo esc_attr( $args['title']) ?>" class="btn btnText__alt">Send invitasjon</button>
    </div>
</div>

<?php else: ?>

<div class="card__wrapper">
    <div class="card__background --blur">
        <img alt="<?php echo esc_attr($args['img']['alt']); ?>" class="lazy"
            src="<?php echo esc_attr($args['img']['sizes']['thumbnail']); ?>"
            data-src="<?php echo esc_attr($args['img']['sizes']['large']); ?>" 
			data-srcset="<?php echo esc_attr($args['img']['sizes']['medium']); ?> 300w,
            <?php echo esc_attr($args['img']['sizes']['large']); ?> 768w,
            <?php echo esc_attr($args['img']['sizes']['1536x1536']); ?> 1024w" 
			data-sizes="100w" 
			/>
    </div>
    <a href="<?php echo esc_attr( $args['link'] )?>">
        <div class="card__circBtn"><span></span></div>
    </a>
    <a class="card__anchor" href="<?php echo esc_attr( $args['link'] )?>">
        <h1 class="btnText__alt"><?php echo esc_html( $args['title'] )  ?></h1>
    </a>
</div>

<?php

endif;