@extends('template.'.config('settings.template').'.content.master')
@section('meta_title', 'Alpakas vom Konradenhof - Gaisheim, Moosbach')
@section('meta_description', 'Informationen und Neuigkeiten rund um unseren Alpaka Hof')
@section('content')

     <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Lobster&family=Shadows+Into+Light&display=swap" rel="stylesheet">

<style>
    @media only screen and (max-width: 676px) {
        #home-hero {
            background-color: #9699AA;
            background-image: url("{{ asset('template/images/alpaka-hero.jpg') }}");
            background-position: center;
            background-size: cover;
            min-height: 250px;
        }
    }
    @media only screen and (min-width: 676px) {
        #home-hero {
            background-color: #9699AA;
            background-image: url("{{ asset('template/images/alpaka-hero.jpg') }}");
            background-position: center;
            background-size: cover;
            min-height: 500px;
        }
    }






</style>
<link rel="stylesheet" href="{{ asset('template/css/pages/main.css') }}">
<div class="row">
    <div id="home-hero" class="shadow-lg">
        <div class="d-none d-md-block">
            <br>
            <br>
            <br>
            <br>
            <br>
            <br>

            <br>
            <br>
            <br>
        </div>

        <div id="city_headline">
            <h1 class="ci-font" style="font-size: 3.5rem;            font-family: 'Lobster', cursive;"><strong>Alpakas</strong> vom <strong>Konradenhof</strong></h1>
            <h2 class="shadow">Gaisheim, Moosbach</h2>
        </div>

        <div class="d-none d-md-block">
            <br>
        </div>
        <div class="d-none d-lg-block">
            <br>
            <br>
            <br>
        </div>
    </div>

    </div> <!-- header_static -->

<section class="mt-2 mb-5">
    <div class="row">
        <div class="col-12">
            <h2 id="konradenhof" class="mt-5 mb-4">Willkommen auf dem  <strong class="ci-font">Konradenhof</strong>!</h2>

        </div>
        <div class="col-12 col-md-7">

            <p style="font-size: 19px;">
                Wir sind Petra und Martin Bäumler.
                <br>
                <br>
                Zusammen mit unseren beiden Kindern wohnen wir in Gaisheim,
                einem kleinen Dorf das zum Markt Moosbach im Naturpark Oberpfälzer Wald gehört.

                <br>
                Unser Hof liegt etwas abseits, inmitten von Feldern und Wiesen
                Der ideale Ort um den Alltag zu vergessen und neue Kraft zu tanken.
                <br>
                <br>
                Mit großer Begeisterung züchten wir Alpakas!
                Die ersten Tiere zogen 2013 bei uns auf den Hof ein,
                und sind seitdem nicht mehr wegzudenken.
                <br>
                <br>
                Wir bieten auf unsrem Hof, neben geführte Wanderungen,
                auch Produkte aus Alpakawolle in unserem kleinen Hofladen an.
                <br>
                <br>
                Wenn sie mehr über Alpakas erfahren möchten, oder sogar mal ein Alpaka live erleben wollen,
                dann kommen sie zu uns auf den Hof und wir bieten ihnen, dass etwas andere besondere
                Erlebnis mit diesen wundervollen Tieren.
                <br>
                <br>
                Gerne begrüßen wir Sie bei uns auf dem Hof.
            </p>


        </div>
        <div class="col-12 col-md-4 offset-md-1 text-center">
            <img class="img-fluid mx-auto d-block rounded" src="{{asset('template/images/petra.jpg')}}">
            <small class="fst-italic mt-1">Petra Bäumler mit Alpaka</small>
        </div>

    </div>


    <div class="row text-center" style="font-size: 20px; margin-top:100px;">
        <div class="col-6 col-md-3 mb-5">
            <img src="{{asset('template/images/alpakas-1.jpg')}}" class="img-fluid rounded border shadow-sm" loading="lazy">
        </div>
        <div class="col-6 col-md-3 mb-5">
            <img src="{{asset('template/images/alpakas-4.jpg')}}" class="img-fluid rounded border shadow-sm" loading="lazy">
        </div>
        <div class="col-6 col-md-3 mb-5">
            <img src="{{asset('template/images/alpakas-2.jpg')}}" class="img-fluid rounded border shadow-sm" loading="lazy">
        </div>
        <div class="col-6 col-md-3 mb-5">
            <img src="{{asset('template/images/alpakas-3.jpg')}}" class="img-fluid rounded border shadow-sm" loading="lazy">
        </div>

    </div>


</section>

<hr>
<section class="mt-2">
    <div class="row">
            <h2 id="news" class="mt-5 mb-4">Aktuelle <strong>Neuigkeiten</strong></h2>
            @foreach(filterByContentType($mdContents, "News")->take(3) as $content)
            <div class="col-12 col-md-4 mb-4" >
                <div class="card h-100" style="background-color: #f8f8f8;">
                    @if ($content->image)
                        <img class="rounded-top img-fluid" src="{{ asset($content->image) }}" loading="lazy">
                    @else
                        <img class="rounded-top img-fluid" src="{{ asset('template/images/konradenhof-placeholder.jpg') }}" loading="lazy">
                    @endif
                    <div class="card-body">
                        <div class="row">
                            <div class="col-12">
                                <h5 class="card-title" style="margin-top: 20px;">
                                    <a href="{{ route_content($content) }}" onclick="gtag('event', 'See Job', {'event_category' : 'Home', 'event_label' : '{{$content->title}}'});">
                                        {{$content->title}}
                                    </a>
                                </h5>
                            </div>
                            <div class="col-12">
                                <small class="card-subtitle mb-2 text-muted" title="{{date('d.m.Y', strtotime($content->created_at))}}">  {{ $content->created_at->diffForHumans() }}</small>
                            </div>
                            <div class="col-12 mt-2">
                                {!! strIsset(Str::limit(strip_tags(html_entity_decode($content->data_fields['neuigkeit'])), 600,'...'), 'keine Angaben') !!}
                            </div>
                        </div>
                    </div>
                    <div class="card-footer text-end">
                        <a class="btn btn-sm btn-ci" href="{{ route_content($content) }}" onclick="gtag('event', 'See Job', {'event_category' : 'Home', 'event_label' : '{{$content->title}}'});">
                            Mehr lesen
                            <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-chevron-right" viewBox="0 0 16 16">
                                <path fill-rule="evenodd" d="M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z" />
                            </svg>
                        </a>
                    </div>
                </div>
            </div>
            @endforeach
            <a href="{{url('/neuigkeiten')}}" class="small text-center">Ältere Nachrichten</a>
    </div>
</section>

<hr>

<section>
    <div class="row">
        <div class="col">
            <h2 id="alpakas" class="mb-4">Über <strong>Alpakas</strong></h2>

            <p style="font-size: 19px;">
                Die Heimat der Alpakas ist Südamerika, speziell die Länder Chile, Peru und Bolivien.
                Alpakas gehören zu den Neuweltkameliden, wie Lamas, Vikunjas und Guanakos.
                Alpakas werden ca. 20 – 25 Jahre alt und erreichen ca. 80 – 100 cm als Stockmaß. Ihr
                Körpergewicht liegt ausgewachsen bei 60 - 75 kg und die Wollproduktion je Alpaka liegt zur
                Zeit zwischen drei und sechs Kilogramm pro Jahr.

            </p>
            <p style="font-size: 19px;">
                Gras im Sommer und Heu im Winter - die Hauptnahrung für Alpakas. Durch die
                harten Bedingungen in ihrer Heimat sind sie ausgezeichnete Futterverwerter; besser als
                andere domestizierte Nutztiere. Alpakas schälen auch keine Bäume. Allerdings fressen sie
                die frischen Triebe sehr gerne ab.
            </p>
            <p style="font-size: 19px;">
                Die minimale Weidegröße gemäß Tierschutzgesetz 1.000 m² für die ersten beiden Tiere und
                für jedes weitere lediglich 100 m².
            </p>

        </div>

        <div class="col-12 text-center">
            <br>
            <br>
            <br>
            <a href="{{url('/alpakas')}}" class="text-center small" >Mehr Informationen über Alpakas
            <br>
            <br>
            <br>
        </div>
    </div>
    </section>

<hr>

<section>
    <div class="row">
        <div class="col">
            <h2 id="produkte" class="mb-4">Unsere <strong>Alpaka Produkte</strong></h2>
        </div>
    </div>
    <div class="row">
        @foreach(filterByContentType("Produkte")->take(6) as $content)
        <div class="col-4 col-md-2 mb-4">
            <a href="{{ route_content($content) }}" title="{{$content->title}}">
                @if($content->image)
                <img class="rounded border img-fluid" src="{{ asset($content->image) }}" loading="lazy">
                @else
                <img class="rounded border img-fluid" src="{{ asset('template/images/konradenhof-placeholder.jpg') }}" loading="lazy">
                @endif
            </a>
        </div>
        @endforeach
        <div class="col-12 text-center">
            <a href="{{url('/produkte')}}" class="text-center small" >Mehr Produkte</a>
            <br>
            <br>
            <br>
            <br>
            <br>
        </div>
</section>
<script src="{{asset('template/js/pages/main/script.js')}}"></script>
@stop