<div class="grid-row intro-container">

    <section class="grid-col col-sm-12 col-md-8 col-8 col-xl-6 center overflow intro-block">

        <div class="call-btn-mobile button-linking" data-href="tel:<?php echo Config::get('business.phone.call'); ?>">

            <div class="icon">
                <img id="call-icon" class="svg" src="/img/icons/call_icon.svg"/>
            </div>
            <div class="seperator-10"></div>
            <span class="mobile-hide-number mobile-number-white"><?php echo Config::get('business.phone.display'); ?></span>

        </div>

        <?php if(isset($page->content->home_introduction)): ?>
            <h3><?php echo $page->content->home_introduction->translation->name; ?></h3>
            <?php echo $page->content->home_introduction->translation->description; ?>

        <?php else: ?>
            <h3>Voeg een tekstblok toe met code_name 'home_introduction'</h3>
            <p>Titel + omschrijving</p>
        <?php endif; ?>

        <div class="intro-btns">
            <div class="intro-btn btn-call button-linking" data-href="tel:<?php echo Config::get('business.phone.call'); ?>">
                <div class="icon">
                    <img id="call-icon" class="svg" src="/img/icons/call_icon.svg"/>
                </div>
                <div class="seperator-10"></div>
                <span class="mobile-hide-number"><?php echo Config::get('business.phone.display'); ?></span>
            </div>
            <div class="intro-btn btn-contact button-linking" data-href="<?php echo url('contact'); ?>">
                Contact
                <div class="seperator-10"></div>
                <div class="icon">
                    <img id="contact-icon" class="svg" src="/img/icons/arrow_right_icon.svg"/>
                </div>
            </div>
        </div>

    </section>

</div>