<header data-scroll-section class="pSection header header--withCover" data-section-color-force="dark">
    <div class="pSection_target header_target"></div>
    <div class="header_action" data-scroll data-scroll-call="pageHeader"></div>
    <div class="container" id="top" is-anchor data-scroll data-scroll-call="detectSection" data-ui="light" data-scroll-repeat data-scroll-offset="90%, 10%">
        <div class="sectionTitle sectionTitle--light">
            <div class="sectionTitle_header">
                <div class="sectionTitle_header_content">
                    <div class="sectionTitle_header_content_title"><?php echo $pageData['title']; ?></div>
                    <div class="sectionTitle_header_content_separator"></div>
                </div>
            </div>
            <div class="sectionTitle_content"><?php echo $pageData['intro_title']; ?></div>
            <?php if ($pageData['intro_quote']): ?>
            <div class="sectionQuoteWrap">
                <div class="sectionQuote">
                    <?php svg('quote', 'sectionQuote_icon') ?>
                    <div class="sectionQuote_content"><?php echo $pageData['intro_quote']; ?></div>
                </div>
            </div>
            <?php endif; ?>
            <button type="button" class="mobileHeaderButton">
                <?php svg('arrow-bottom') ?>
            </button>
        </div>
    </div>
    <div class="header_cover">
        <?php svg('logo-p', 'header_cover_logo', 'data-scroll data-scroll-speed="3.5" data-scroll-target=".header_target"') ?>
        <div class="header_cover_background imageRender" style="<?php /*background-image: url(<?php echo $pageData['intro_cover']; ?>); */ ?>">
            <img src="<?php echo getImageUrl($pageData['intro_cover_object'], 'lazy'); ?>"
                <?php echo getImageSrcSetSizes($pageData['intro_cover_object']); ?>
                alt="<?php echo pradel_format_attr($pageData['intro_title']); ?>" class="__vhidden">
        </div>
    </div>
    <div class="header_behind imageRender" style="<?php /*background-image: url(<?php echo $pageData['intro_cover']; ?>); */ ?>">
        <img src="<?php echo getImageUrl($pageData['intro_cover_object'], 'lazy'); ?>"
            <?php echo getImageSrcSetSizes($pageData['intro_cover_object']); ?>
            alt="<?php echo pradel_format_attr($pageData['intro_title']); ?>" class="__vhidden">
    </div>
</header>


<?php $cptSection = 1; foreach ($pageData['sections'] as $section): ?>
    <?php if ($section['acf_fc_layout'] == 'white-image'): ?>
        <section data-scroll-section class="pSection rse-light">
            <div class="pSection_target rse-<?php echo $cptSection; ?>"></div>
            <div class="container" is-anchor data-scroll data-scroll-call="detectSection" data-ui="dark" data-scroll-repeat data-scroll-offset="90%, 10%">
                <div class="row row--noPadding">
                    <div class="col-9 col-xs-18 col--noPT col--noPB">
                        <div class="pSection_header pSection_header--fullMobile" data-scroll data-scroll-sticky data-scroll-target=".rse-<?php echo $cptSection; ?>">
                            <div class="pSection_header_cover">
                                <div class="carousel carousel--nb carousel-rse-<?php echo $cptSection; ?>" data-id="<?php echo $cptSection; ?>">
                                    <?php foreach ($section['gallery'] as $img): ?>
                                    <div class="carousel_slide">
                                        <div class="carousel_slide_cover">
                                            <div class="carousel_slide_cover_img imageRender" style="<?php /*background-image: url(<?php echo getImageUrl($img); ?>); */ ?>">
                                                <img src="<?php echo getImageUrl($img, 'lazy'); ?>"
                                                    <?php echo getImageSrcSetSizes($img); ?>
                                                    alt="" class="__vhidden">
                                            </div>
                                        </div>
                                    </div>
                                    <?php endforeach; ?>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-7 offset-1 col-xs-18 offset-xs-0 col--noPT col--noPB">
                        <div class="pSection_content">
                            <div class="sectionTitle" data-scroll data-scroll-call="sectionTitle" data-scroll-offset="15%">
                                <div class="sectionTitle_header">
                                    <div class="sectionTitle_header_content">
                                        <div class="sectionTitle_header_content_title"><?php echo $section['surtitle']; ?></div>
                                        <div class="sectionTitle_header_content_separator"></div>
                                    </div>
                                </div>
                                <div class="sectionTitle_content">
                                    <?php echo $section['title']; ?>
                                </div>
                            </div>

                            <?php if ($section['intro']): ?>
                            <div class="sp4"><?php echo $section['intro']; ?></div>
                            <?php endif; ?>

                            <?php if ($section['content']): ?>
                            <div class="sp6"><?php echo $section['content']; ?></div>
                            <?php endif; ?>

                            <?php if ($section['links']): ?>
                            <ul class="rse-links">
                                <?php foreach ($section['links'] as $link): ?>
                                    <li>
                                        <a href="<?php echo $link['link']['url']; ?>" target="<?php echo $link['link']['target']; ?>"><?php echo $link['link']['title']; ?></a>
                                    </li>
                                <?php endforeach; ?>
                            </ul>
                            <?php endif; ?>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    <?php endif; ?>
    <?php if ($section['acf_fc_layout'] == 'black'): ?>
        <section data-scroll-section class="pSection rse-dark">
            <div class="pSection_target rse-<?php echo $cptSection; ?>"></div>
            <div class="container" is-anchor data-scroll data-scroll-call="detectSection" data-ui="light" data-scroll-repeat data-scroll-offset="90%, 10%">
                <div class="row">
                    <div class="col-9 col-xs-18 col--noPT col--noPB">
                        <div class="pSection_header pSection_header--top" data-scroll data-scroll-sticky data-scroll-target=".rse-<?php echo $cptSection; ?>">
                            <div class="pSection_header_inner">
                                <div class="sectionTitle sectionTitle--light" data-scroll data-scroll-call="sectionTitle" data-scroll-offset="15%">
                                    <div class="sectionTitle_header">
                                        <div class="sectionTitle_header_content">
                                            <div class="sectionTitle_header_content_title"><?php echo $section['surtitle']; ?></div>
                                            <div class="sectionTitle_header_content_separator"></div>
                                        </div>
                                    </div>
                                    <div class="sectionTitle_content">
                                        <?php echo $section['title']; ?>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-8 col-xs-18 col--noPT col--noPB">
                        <div class="pSection_content">
                            <?php if ($section['intro']): ?>
                            <div class="sp5"><?php echo $section['intro']; ?></div>
                            <?php endif; ?>
                            <?php if ($section['content']): ?>
                            <div class="sp6"><?php echo $section['content']; ?></div>
                            <?php endif; ?>
                            <?php if ($section['links']): ?>
                            <ul class="rse-links">
                                <?php foreach ($section['links'] as $link): ?>
                                    <li>
                                        <a href="<?php echo $link['link']['url']; ?>" target="<?php echo $link['link']['target']; ?>"><?php echo $link['link']['title']; ?></a>
                                    </li>
                                <?php endforeach; ?>
                            </ul>
                            <?php endif; ?>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    <?php endif; ?>
    <?php if ($section['acf_fc_layout'] == 'black-image'): ?>
        <section data-scroll-section class="pSection rse-dark rse-dark-image">
            <div class="pSection_target rse-<?php echo $cptSection; ?>"></div>
            <div class="container" is-anchor data-scroll data-scroll-call="detectSection" data-ui="light" data-scroll-repeat data-scroll-offset="90%, 10%">
                <div class="row row--noPadding">
                    <div class="col-7 offset-1 col-xs-18 offset-xs-0 col--noPT col--noPB">
                        <div class="pSection_content">
                            <div class="sectionTitle sectionTitle--light" data-scroll data-scroll-call="sectionTitle" data-scroll-offset="15%">
                                <div class="sectionTitle_header">
                                    <div class="sectionTitle_header_content">
                                        <div class="sectionTitle_header_content_title"><?php echo $section['surtitle']; ?></div>
                                        <div class="sectionTitle_header_content_separator"></div>
                                    </div>
                                </div>
                                <div class="sectionTitle_content">
                                    <?php echo $section['title']; ?>
                                </div>
                            </div>

                            <?php if ($section['intro']): ?>
                            <div class="sp4"><?php echo $section['intro']; ?></div>
                            <?php endif; ?>

                            <?php if ($section['content']): ?>
                            <div class="sp6"><?php echo $section['content']; ?></div>
                            <?php endif; ?>

                            <?php if ($section['links']): ?>
                            <ul class="rse-links">
                                <?php foreach ($section['links'] as $link): ?>
                                    <li>
                                        <a href="<?php echo $link['link']['url']; ?>" target="<?php echo $link['link']['target']; ?>"><?php echo $link['link']['title']; ?></a>
                                    </li>
                                <?php endforeach; ?>
                            </ul>
                            <?php endif; ?>
                        </div>
                    </div>
                    <div class="col-9 offset-1 col-xs-18 offset-xs-0 col--noPT col--noPB col--first-xs">
                        <div class="pSection_header pSection_header--fullMobile" data-scroll data-scroll-sticky data-scroll-target=".rse-<?php echo $cptSection; ?>">
                            <div class="pSection_header_cover">
                                <div class="carousel carousel--nb carousel-rse-<?php echo $cptSection; ?>" data-id="<?php echo $cptSection; ?>">
                                    <?php foreach ($section['gallery'] as $img): ?>
                                    <div class="carousel_slide">
                                        <div class="carousel_slide_cover">
                                            <div class="carousel_slide_cover_img imageRender" style="<?php /*background-image: url(<?php echo getImageUrl($img); ?>); */ ?>">
                                                <img src="<?php echo getImageUrl($img, 'lazy'); ?>"
                                                    <?php echo getImageSrcSetSizes($img); ?>
                                                    alt="" class="__vhidden">
                                            </div>
                                        </div>
                                    </div>
                                    <?php endforeach; ?>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    <?php endif; ?>
    <?php if ($section['acf_fc_layout'] == 'child'): ?>
        <section data-scroll-section class="pSection rse-child">
            <div class="pSection_target rse-<?php echo $cptSection; ?>"></div>
            <div class="container" is-anchor data-scroll data-scroll-call="detectSection" data-ui="light" data-scroll-repeat data-scroll-offset="90%, 10%">
                <div class="row">
                    <div class="col-9 col-md-11 col-xs-18 col--noPT col--noPB">
                        <div class="pSection_header pSection_header--top" data-scroll data-scroll-sticky data-scroll-target=".rse-<?php echo $cptSection; ?>">
                            <div class="pSection_header_inner">
                                <div class="sectionTitle sectionTitle--light" data-scroll data-scroll-call="sectionTitle" data-scroll-offset="15%">
                                    <div class="sectionTitle_header">
                                        <div class="sectionTitle_header_content">
                                            <div class="sectionTitle_header_content_title"><?php echo $section['surtitle']; ?></div>
                                            <div class="sectionTitle_header_content_separator"></div>
                                        </div>
                                    </div>
                                    <div class="sectionTitle_content">
                                        <?php echo $section['title']; ?>
                                    </div>
                                    <div class="sectionTitle_footer">
                                        <div class="sectionTitle_footer_separator"></div>
                                        <?php if ($section['link']): ?>
                                        <a href="<?php echo $section['link']['url']; ?>" class="sectionTitle_footer_link"><span><?php echo $section['link']['title']; ?></span></a>
                                        <?php endif; ?>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="rse-child_background">
                <div class="imageRender">
                    <img src="<?php echo getImageUrl($section['media'], 'lazy'); ?>"
                        <?php echo getImageSrcSetSizes($section['media']); ?>
                        alt="" class="__vhidden">
                </div>
            </div>
            <?php if ($section['link']): ?>
            <a href="<?php echo $section['link']['url']; ?>" class="rse-child_link"></a>
            <?php endif; ?>
        </section>
    <?php endif; ?>
<?php $cptSection++; endforeach; ?>