@extends('layouts.frontend', ['body_class' => ''])

@php
    SEOMeta::setTitle('Nyitólap');
@endphp

@section('content')
    <x-frontend.header />

    <x-frontend.main>

        <x-frontend.section>
            <x-frontend.container>
                <x-frontend.animation>
                    <x-frontend.slideshow.mobile />
                    <x-frontend.slideshow.desktop />
                </x-frontend.animation>
            </x-frontend.container>
        </x-frontend.section>

        <x-frontend.section class="py-8 lg:py-16">
            <x-frontend.container size="large">
                <x-frontend.column.two>
                    <x-slot name="left">
                        <img class="rounded-image" src="{{ asset('kepek/home/01.jpg') }}" alt="Vadvirág Residence"
                            width="1080" height="1080">
                    </x-slot>
                    <x-slot name="right">
                        <x-frontend.column.content>
                            <h2>Vadvirág <span>Residence</span></h2>
                            <p>A Vadvirág Residence a Balaton-part egyik legrégebbi, közkedvelt üdülőhelyén, Balatonszemes
                                és Balatonlelle tőszomszédságában kerül kialakításra. A városközpontokhoz közel, de mégis
                                megfelelő távolságra a nyugodt pihenéshez, kikapcsolódáshoz.</p>
                            <p>A különleges adottságú partszakasz újragondolása során különösen nagy figyelmet fordítottunk
                                a zöldövezetek és zöldfelületek megtartására, célunk egy modern megjelenésű, prémium, zöld
                                lakópark kialakítása, közös használatú medencével, közösségi terekkel, játszótérrel és
                                biztonságos beléptetéssel a zárt lakóparkba.</p>
                            <p>
                                <x-frontend.form.button href="/{{ app()->getLocale() }}/{{ __('url_vadvirag_residence') }}">
                                    Tudjon meg többet a lakóparkról
                                </x-frontend.form.button>
                            </p>
                        </x-frontend.column.content>
                    </x-slot>
                </x-frontend.column.two>
            </x-frontend.container>
        </x-frontend.section>



        <x-frontend.section class="pb-8 bg-aqua/20 lg:pb-16">
            <div class="h-2 bg-gradient"></div>
            <div class="-mb-8 lg:-mb-16">
                <img class="mx-auto" src="{{ asset('kepek/home/separator-01.jpg') }}" alt="Vadvirág Residence"
                    width="1920" height="800">
            </div>
            <x-frontend.container size="medium">
                <x-frontend.animation>
                    <x-frontend.content.box>
                        <div class="grid grid-cols-1 md:grid-cols-2 md:gap-5 lg:gap-20">
                            <div>
                                <x-frontend.animation>
                                    <x-frontend.column.content>
                                        <h2>Exkluzív<span> vízparti lakások</span></h2>
                                    </x-frontend.column.content>
                                </x-frontend.animation>
                            </div>
                            <div>
                                <x-frontend.animation delay="250">
                                    <x-frontend.column.content>
                                        <p>
                                            Közvetlenül a Balaton parton, 2 ütemben, 9 modern formai világban megálmodott
                                            épületben, összesen 155 db, kimagasló műszaki specifikációval rendelkező lakás
                                            kerül kivitelezésre. A telek egyedülálló
                                            adottságait kihasználva, minden lakásnak kilátása van a Balatonra.
                                        </p>
                                        <p>
                                            A lakások valódi biztonságos otthonként szolgálnak, amely ideálisak mindennapi
                                            lakhatásra, ugyanakkor kihasználja a Balaton közelségét és a vízparti élet
                                            előnyeit. Az ilyen lakások nem csupán nyári pihenésre vagy szezonális
                                            használatra vannak tervezve, hanem hosszú távú, kényelmes és fenntartható
                                            otthont kínálnak, amely mindennapi életet biztosít az év minden hónapjában.
                                        </p>
                                    </x-frontend.column.content>
                                </x-frontend.animation>
                            </div>
                        </div>
                        <hr class="my-8">
                        <x-frontend.numbers />
                    </x-frontend.content.box>
                </x-frontend.animation>
            </x-frontend.container>
        </x-frontend.section>


        <x-frontend.section class="py-8 lg:py-16">
            <x-frontend.container size="large">
                <x-frontend.section.title class="mb-8 lg:mb-16"
                    title="Találja meg nálunk az Önhöz illő új, örökpanorámás otthonát!" center />
                <x-frontend.apartment.types />
            </x-frontend.container>
        </x-frontend.section>


        <x-frontend.section class="py-8 bg-gradient lg:py-16">
            <x-frontend.container>
                <x-frontend.section.title class="mb-8 lg:mb-16" title="Fedezze fel a Vadvirág Residence-t!" center
                    inverse />
                <x-frontend.gallery.list />
            </x-frontend.container>
        </x-frontend.section>



        <x-frontend.section class="py-8 bg-aqua/20 lg:py-16">
            <x-frontend.container size="large">
                <x-frontend.section.title class="mb-8 lg:mb-16" title="Miért ideális választás a Vadvirág Residence?"
                    center />
                @php
                    $items = \App\Models\Frontendtext::where('lang' , app()->getLocale() )->get()->toArray();
                @endphp
                <div class="relative w-full">
                    <div class="absolute hidden h-full border-l-2 border-dotted border-iron/50 lg:left-1/2 lg:block"></div>
                    @foreach ($items as $item)
                        <x-frontend.animation delay="{{ $loop->index * 100 }}">
                            <div class="flex items-center my-4 lg:my-8">
                                <div @class(['lg:w-5/12', 'hidden lg:block lg:order-last' => $loop->even])></div>
                                <div class="z-10 flex-none w-2/12"><img src="{{ asset($item['icon']) }}"
                                        alt="{{ $item['title'] }}" width="120" height="120" class="mx-auto">
                                </div>
                                <div @class([
                                    'lg:w-5/12',
                                    'lg:order-first lg:text-right pl-8' => $loop->even,
                                    'pl-8 lg:pr-8 lg:pl-0' => $loop->odd,
                                ])>
                                    <h3 class="mb-2 text-lg font-bold font-headline text-laurel lg:text-xl">
                                        {{ $item['title'] }}
                                    </h3>
                                    <p>{!! $item['description'] !!}</p>
                                </div>
                            </div>
                        </x-frontend.animation>
                    @endforeach
                </div>
            </x-frontend.container>
        </x-frontend.section>




        <x-frontend.section class="py-8 lg:py-16">
            <x-frontend.container size="large">
                <x-frontend.section.title class="mb-8 lg:mb-16" title="Hírek" center />
                <x-frontend.news.list limit="3" />
                <div class="flex justify-center mt-8 lg:mt-16">
                    <x-frontend.form.button href="/{{ app()->getLocale() }}/{{ __('url_news') }}" class="button">
                        További hírek
                    </x-frontend.form.button>
                </div>
            </x-frontend.container>
        </x-frontend.section>



        <x-frontend.section>
            <img class="mx-auto" src="{{ asset('kepek/home/separator-02.jpg') }}" alt="Vadvirág Residence" width="1920"
                height="800">
        </x-frontend.section>


        <x-frontend.section class="py-8 bg-aqua/20 lg:py-16">
            <x-frontend.container size="medium">
                <x-frontend.animation>
                    <x-frontend.content.box>
                        <x-frontend.contact />
                    </x-frontend.content.box>
                </x-frontend.animation>
            </x-frontend.container>
        </x-frontend.section>


    </x-frontend.main>

    <x-frontend.footer />
@endsection