<?php
if ( ! defined( 'ABSPATH' ) ) {
    exit;
}

/**
 * Safe defaults
 */
$gridpress_card_data = $gridpress_card_data ?? [];

/**
 * Safe variables (sanitize early)
 */
$gridpress_bg_class = sanitize_html_class( $gridpress_bg_class ?? '' );

$gridpress_title    = $gridpress_card_data['short_title'] ?? '';
$gridpress_url      = $gridpress_card_data['url'] ?? '';
$gridpress_image    = $gridpress_card_data['imag_url'] ?? '';

$gridpress_sec_url  = $gridpress_card_data['sec_image_url'] ?? '';
$gridpress_sec_img  = $gridpress_card_data['sec_image'] ?? '';

/**
 * Safe class build
 */
$gridpress_row_class = trim(
    'jc-cards-row ' . $gridpress_bg_class
);
?>
<div class="<?php echo esc_attr( $gridpress_row_class ); ?>">
    <h1 class="jc-cards-title">
        <?php echo esc_html( $gridpress_title ); ?>
    </h1>
    <div class="jc-cards-holder">
        <div class="jc-cards">
            <div class="jc-cards-image">
                <a class="jc-cards-image-wrap" href="<?php echo esc_url( $gridpress_url ); ?>">
                    <img
                        src="<?php echo esc_url( $gridpress_image ); ?>"
                        alt="<?php echo esc_attr( $gridpress_title ); ?>"
                    >
                </a>
            </div>
        </div>
        <div class="jc-cards">
            <div class="jc-cards-image">
                <a class="jc-cards-image-wrap" href="<?php echo esc_url( $gridpress_sec_url ); ?>">
                    <img
                        src="<?php echo esc_url( $gridpress_sec_img ); ?>"
                        alt="<?php echo esc_attr( $gridpress_title ); ?>"
                    >
                </a>
            </div>
        </div>
    </div>
</div>