@extends('layouts.web')

@section('class', 'page--homepage')
@section('title', 'Úvod')

@section('content')

    @if(webText('upozorneni.text', null, false))
    <!-- -->
    <div class="homepage-alert" color="#de960e">
        <div class="container">
            {!! trim(webText('upozorneni.text', null, false)) !!}
        </div>
    </div>
    @endif

    <section id="carousel" class="teaser teaser--carousel" >

        @for($i = 0; $i < 1; $i++)
        <div class="teaser__item" style="background-image: url({{ asset('images/teaser-home-1.jpg') }});">
            <div class="teaser__middle">
                <div>
                    <h1 class="teaser__title">{{ webText('homepage.cover.title1') }}</h1>
                    <p class="teaser__subtitle">{{ webText('homepage.cover.title2') }}</p>
                </div>
            </div>
        </div>
        @endfor

    </section>

    @include('layouts.includes.nav')

    <section class="section section--home">

        <div class="container text-center">
            <h2 class="h2">{{ webText('homepage.intro.title') }}</h2>

            <div class="row justify-content-center">
                <div class="col-sm-9">
                    <p>
                        {{ webText('homepage.intro.text') }}
                    </p>
                </div>

                <div class="d-flex flex-column flex-lg-row space-m-t-40">
                    @if(webText('homepage.intro.button1'))
                    <a href="{{ route('web.allisonPrevodovky') }}" class="btn btn--gradient">{{ webText('homepage.intro.button1') }}</a>
                    @endif
                    @if(webText('homepage.intro.button2'))
                    <a href="{{ route('web.prevodyAPrevodovaUstroji') }}" class="btn btn--gradient">{{ webText('homepage.intro.button2') }}</a>
                    @endif
                </div>
            </div>

            <!-- boxes -->
            <div class="boxes d-flex flex-column flex-lg-row-reverse">

                <div class="space-m-b-50">
                    <div class="box box--right box--text box--wide">
                        <h2 class="box__title text--large">{{ webText('homepage.weAre.title') }}</h2>
                        <p class="text--semi-small space-m-b-60 text--black">
                            {{ webText('homepage.weAre.text') }}
                        </p>

                        <div class="text--center">
                            <a href="{{ route('web.oNas') }}" class="btn">{{ webText('homepage.weAre.button') }}</a>
                        </div>
                    </div>
                </div>

                <div>
                    <div class="box box--left box--image">
                        <img class="lazy" data-src="{{ asset('images/hp-1.png') }}" alt="">
                    </div>

                    <strong class="d-block text--dark text--semi-small text-left space-m-t-60 space-m-left-10 text-center text-lg-left">
                        {!! webText('homepage.weAre.claim') !!}
                    </strong>
                </div>

            </div>

        </div>

    </section>

    <!-- News -->
    @if(webText('articles.archive'))
        @include('web.includes.news')
    @endif

    <!-- Logos -->
    @include('web.includes.logos')

@endsection