<div class="stories-slider block-margin-top--<?php echo e($block->margin_type_top); ?> block-margin-bottom--<?php echo e($block->margin_type_bottom); ?>" data-controller="blocks/stories-slider">
    <?php if($block->anchor_id ): ?>
        <div id="<?php echo e($block->anchor_id); ?>" class="anchor-offset"></div>
    <?php endif; ?>
    <div class="stories-slider__wrap"  data-aos="fade">
        <div class="stories-slider__header">
            <?php if($block->block_title): ?>
                <h2><?php echo e($block->block_title); ?></h2>
            <?php endif; ?>
            <?php echo $block->content; ?>

        </div>
        <div class="swiper stories-slider__slider" data-role="slider">
            <div class="swiper-wrapper">
                <?php $__currentLoopData = $block->stories; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $story): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                    <div class="swiper-slide" data-role="cta-block">
                        <?php if($story->image): ?>
                            <div class="stories-slider__slider-img" data-action="click-cta">
                                <picture>
                                    <source media="(min-width: 768px)" srcset="<?php echo e(getMediaUrl($story->image->filename, '1000x1200')); ?>.webp" type="image/webp">
                                    <source media="(min-width: 768px)" srcset="<?php echo e(getMediaUrl($story->image->filename, '1000x1200')); ?>">
                                    <source srcset="<?php echo e(getMediaUrl($story->image->filename, '500x600')); ?>.webp" type="image/webp">
                                    <img src="<?php echo e(getMediaUrl($story->image->filename, '500x600')); ?>" alt="<?php echo e(htmlentities($story->title)); ?>">
                                </picture>
                            </div>
                        <?php endif; ?>
                        <div class="stories-slider__slide-legend">
                            <a href="#" data-action="open-detail" data-story="<?php echo e($story->id); ?>">
                                <div class="open-detail__title">Read <?php echo e($story->title); ?></div>
                                <div class="open-detail__subtitle"><?php echo e($story->subtitle); ?></div>
                            </a>
                        </div>
                    </div>
                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
            </div>
            <div class="stories-slider__nav-prev"></div>
            <div class="stories-slider__nav-next"></div>
        </div>
    </div>
    <div class="stories-slider__modal modal-overlay" data-role="modal">
        <div class="stories-slider__modal-box">
            <div class="stories-slider__modal-content">
                <?php $__currentLoopData = $block->stories; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $story): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                    <div class="stories-slider__modal-story" data-story="<?php echo e($story->id); ?>">
                        <?php if($story->image): ?>
                            <div class="stories-slider__modal-img">
                                <div>
                                    <picture>
                                        <source media="(min-width: 768px)" srcset="<?php echo e(getMediaUrl($story->image->filename, '1000x1200')); ?>.webp" type="image/webp">
                                        <source media="(min-width: 768px)" srcset="<?php echo e(getMediaUrl($story->image->filename, '1000x1200')); ?>">
                                        <source srcset="<?php echo e(getMediaUrl($story->image->filename, '500x600')); ?>.webp" type="image/webp">
                                        <img src="<?php echo e(getMediaUrl($story->image->filename, '500x600')); ?>" alt="<?php echo e(htmlentities($story->title)); ?>">
                                    </picture>
                                </div>
                            </div>
                        <?php endif; ?>
                        <div class="stories-slider__modal-header">
                            <h2><?php echo e($story->title); ?></h2>
                            <p><?php echo e($story->subtitle); ?></p>
                        </div>
                        <div class="stories-slider__story-items">
                            <?php $__currentLoopData = $story->storyItems; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $item): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                <div class="stories-slider__story-item">
                                    <div class="stories-slider__story-item-number">
                                        <span><?php echo e($loop->iteration); ?></span>
                                    </div>
                                    <div class="stories-slider__story-item-content">
                                        <h4><?php echo e($item->title); ?></h4>
                                        <?php echo $item->content; ?>

                                    </div>
                                </div>
                            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                        </div>
                    </div>
                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                <div class="stories-slider__modal-control">
                    <button class="std-button blue-button" data-action="next">Read the next story</button>
                </div>
            </div>
            <button class="stories-slider__modal-close modal-close" data-action="close-detail"></button>
        </div>
    </div>
</div>
<?php /**PATH /var/www/html-staging/resources/views/frontend/templates/blocks/stories-slider.blade.php ENDPATH**/ ?>