{{ partial:partials.navbar.navbar }}
<main>
    <!-- Section 1 -->
    <section id="section-1">
        <div id="jumbotron" class="w-full lg:max-h-[600px] overflow-hidden">
            <div
                class="w-full min-h-[600px] lg:bg-[#393939] flex flex-col lg:flex-row lg:justify-end"
            >
                <div
                    class="w-full lg:w-1/3 bg-[#393939] text-white flex justify-end items-center"
                >
                    <div
                        class="w-full lg:w-[325px] pl-[30px] sm:pl-[90px] md:pl-[140px] lg:pl-0 pr-4 py-[82px]"
                    >
                        <h1
                            class="lg:w-auto text-[34px] lg:text-[40px] font-bold leading-tight"
                        >
                            {{title_sec_1}}
                        </h1>
                        <div class="my-4">{{partial:big-line-svg}}</div>
                        <p class="text-xl italic">{{subtitle_sec_1}}</p>
                    </div>
                </div>
                <div
                    class="w-full flex justify-center items-center lg:w-2/3 sm:min-h-[600px] overflow-hidden"
                >
                    {{assets:image}}
                    <img
                        id="primaryimage"
                        srcset="{{ glide:url width='360' }} 360w,
                                {{ glide:url width='640' }} 640w,
                                {{ glide:url width='768' }} 768w,
                                {{ glide:url width='1024' }} 1024w,
                                {{ glide:url width='1280' }} 1280w,
                                {{ glide:url width='1536' }} 1536w"
                        sizes="(min-width: 1536px) 1536px,
                            (min-width: 1280px) 1280px,
                            (min-width: 1024px) 1024px,
                            (min-width: 768px) 768px,
                            (min-width: 640px) 640px,
                            100vw"
                        data-src="{{ glide:url width='360' }}"
                        alt="{{ alt }}"
                        class="w-full object-cover h-[320px] sm:h-[551px] md:h-[600px]"
                    />
                    {{/assets:image}}
                </div>
            </div>
        </div>
    </section>
    <!-- Section 2 -->
    <section id="section-2">
        <article>
            <div class="max-w-7xl mx-auto pb-10">
                <div class="py-[50px] px-12">
                    <div class="my-6">{{partial:breadcrumbs}}</div>
                    <h1 class="text-[40px] font-bold">{{title_sec_2}}</h1>
                    <div class="mt-2 mb-6">{{partial:line-svg}}</div>
                    <div class="text-[#4C4B4B] text-base">
                        {{description_sec_2 | nl2br}}
                    </div>
                </div>
                <div class="flex flex-wrap gap-20 justify-center p-[50px]">
                    {{data_advertising}}
                    <div>
                        <div class="w-[212px] h-[300px] overflow-hidden">
                            {{assets:image}}
                            <img
                                data-srcset="{{ glide:url width='360' }} 360w,
                                {{ glide:url width='640' }} 640w,
                                {{ glide:url width='768' }} 768w,
                                {{ glide:url width='1024' }} 1024w,
                                {{ glide:url width='1280' }} 1280w,
                                {{ glide:url width='1536' }} 1536w"
                                sizes="auto"
                                data-src="{{ glide:url width='360' }}"
                                alt="{{ alt }}"
                                class="lazyload w-full h-full object-cover transition-transform duration-300 ease-in-out hover:scale-150"
                            />
                            {{/assets:image}}
                        </div>
                        <p class="text-sm text-center mt-2">{{title}}</p>
                    </div>
                    {{/data_advertising}}
                </div>
            </div>
        </article>
    </section>
</main>