<?php
    /**
     * Page: O Kancelarii
     */

    get_header();

    $box1 = get_field('box-1');
    $box2 = get_field('box-2');
    $box3 = get_field('box-3');
    $box4 = get_field('box-4');
?>
	<main id="primary" class="site-main">
        <div class="box-0">
            <?php get_template_part('inc/breadcrumb');?>
        </div>
        <div class="box-1">
            <div class="container">
                <div class="row row-1">
                    <div class="col col-1">
                        <div class="box-head">
                            <h2><?php echo esc_html($box1['title']); ?></h2>
                        </div>
                    </div>
                    <div class="col col-2">
                        <div class="box-text animate-text">
                            <?php echo split_text_into_spans(wp_kses_post($box1['text'])); ?>
                        </div>
                    </div>
                </div>
                <div class="row row-2">
                    <img src="<?php echo esc_url($box1['img']); ?>" alt="">
                </div>
            </div>
        </div>

        <div class="box-2">
            <div class="container">
                <div class="row">
                    <div class="col col-1">
                        <p><?php echo esc_html($box2['text']); ?></p>
                    </div>
                    <div class="col col-2">
                        <div class="tiles">
                            <?php foreach ($box2['cards'] as $item) : ?>
                            <div class="tile">
                                <div class="tile-data">
                                    <h3><?php echo esc_html($item['title']); ?></h3>
                                    <?php echo wp_kses_post($item['text']); ?>
                                </div>
                            </div>
                            <?php endforeach; ?>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="box-3">
            <div class="container">
                <div class="row">
                    <div class="col col-1" box-title="<?php echo esc_html($box3['mini_title']); ?>">
                        <div class="box-title animate-text">
                            <p><?php echo split_text_into_spans(esc_html($box3['title'])); ?></p>
                        </div>
                        <div class="box-text animate-text">
                            <p><?php echo split_text_into_spans(esc_html($box3['text'])); ?></p>
                        </div>
                        <a class="btn_4" href="<?php echo esc_url($box3['btn']['url']); ?>" target="<?php echo esc_attr($box3['btn']['target'] ?: '_self'); ?>">
                            <?php echo esc_html($box3['btn']['title']); ?>
                        </a>
                    </div>
                    <div class="col col-2">
                        <video autoplay muted loop playsinline>
                            <source src="/wp-content/uploads/2025/08/bg-video-v.mp4" media="(min-width: 992px)" type="video/mp4">
                            <source src="/wp-content/uploads/2025/09/bg-video-h.mp4" media="(max-width: 991px)" type="video/mp4">
                        </video>
                    </div>
                </div>
            </div>
        </div>

        <div class="box-4">
            <div class="container">
                <div class="row">
                    <div class="col col-1" box-title="<?php echo esc_html($box4['mini_title']); ?>">
                        <img src="<?php echo esc_url($box4['img']); ?>" alt="">
                    </div>
                    <div class="col col-2">
                        <div class="box-title animate-text">
                            <p><?php echo split_text_into_spans(esc_html($box4['title'])); ?></p>
                        </div>
                        <div class="box-text animate-text">
                            <p><?php echo split_text_into_spans(esc_html($box4['text'])); ?></p>
                        </div>
                        <a class="btn_3" href="<?php echo esc_url($box4['btn']['url']); ?>" target="<?php echo esc_attr($box4['btn']['target'] ?: '_self'); ?>">
                            <?php echo esc_html($box4['btn']['title']); ?>
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </main>
<?php
get_footer();
