<section class="page-title page-title-parallax bg-primary parallax scroll-detect dark include-header page-title-center">
    <img src="<?= $pageTitle->image ?>" class="parallax-bg" style="background-position: center">
    <div class="container">
        <div class="page-title-row">

            <div class="page-title-content">
                <small class="p-1 text-uppercase font-secondary ls-2 mb-1 gradient-border bg-primary mb-3"><?= $pageTitle->modalidade ?></small>
                <h1 data-animate="fadeInUp"><div class="fw-bold display-5 nocolor mt-4 px-0 px-lg-5"><?= $pageTitle->title ?></div></h1>
                <span data-animate="fadeInUp" data-delay="300" class="text-white"><?= $pageTitle->subtitle ?></span>
            </div>
            <span data-animate="fadeInUp" data-delay="300" class="text-white bg-secondary button button-circle button-small mt-3 mb-0 font-xsmall"><?= $pageTitle->formato ?></span>

        </div>
    </div>
</section><!-- .page-title end -->