<?php

declare(strict_types=1);

/**
 * Alternierende Bild/Text-Sektion. Props:
 *   $section array{id, title, text, image, flip?, cta?} (aus home.json o.ä.)
 *   $level   int Überschriften-Ebene (default 2)
 */
$level = $level ?? 2;
$flip = !empty($section['flip']);
?>
        <section class="section split<?= $flip ? ' split--flip' : '' ?>" id="<?= e($section['id']) ?>">
            <div class="container split__inner">
                <div class="split__text">
                    <h<?= $level ?>><?= e($section['title']) ?></h<?= $level ?>>
                    <p><?= e($section['text']) ?></p>
<?php if (!empty($section['cta'])): ?>
                    <p class="split__cta"><?php component('cta', ['cta' => $section['cta']]); ?></p>
<?php endif; ?>
                </div>
                <div class="split__media">
<?php component('img', ['image' => $section['image'], 'sizes' => '(max-width: 992px) 100vw, 50vw', 'class' => 'split__img']); ?>
                </div>
            </div>
        </section>
