@extends('layouts.public')

@section('title', 'Home')

@section('content')
    <section id="banner" class="container-fluid">
        <div class="d-flex justify-content-center">
            <div class="hero">
                <h1 class="text-capitalize">{{__('Celebrate Life’s Moments')}}</h1>
                <h3 class="text-uppercase">{{__('With a Lifetime Vintage Wine Registry')}}</h3>
            </div>
        </div>
        <div class="d-flex">
            <div class="link-row d-flex flex-column flex-md-row justify-content-around align-items-center">
                @if(Auth::check() && user()->hasRole('bride'))
                <button class="btn btn-hero-button btn-hero-x-large"><a href="{{ route('registry.personal-info') }}"> {{__('My Registry')}}</a></button>
                @else
                <button class="btn btn-hero-button btn-hero-x-large"><a href="{{ route('registry.sign-up') }}"> {{__('Getting Married')}}</a></button>
                @endif
                <button class="btn btn-hero-button btn-hero-x-large"><a href="{{ route('guest') }}">{{__("I'm a guest")}}</a></button>
            </div>
        </div>
        <div class="link-row d-none d-lg-flex justify-content-center align-items-center">
            <div class="banner-footer">
                <div class="flex-row d-flex justify-content-center">
                    <a href="{{ route('home').'#learn-more' }}">{{__('Learn More')}}</a>
                </div>
                <div class="flex-row d-flex justify-content-center">
                    <i class="fa fa-chevron-down"></i>
                </div>
            </div>
        </div>
    </section>

    <section id="learn-more" class="container mt-5">
        <div class="row justify-content-center">
            <h2>{{__("Here’s How We Build Your Dream Wine Cellar")}}</h2>
        </div>
        <div class="d-flex flex-row flex-wrap justify-content-center">
            <div class="d-flex flex-row flex-grow-1 flex-sm-shrink-0 flex-wrap justify-content-between ml-0 mr-0">
                <div class="">
                    <div class="card card-default">
                        <div class="card-header">
                            <img src="{{ asset('/images/step_1.jpg') }}"/>
                            <h1>{{__('1')}}</h1>
                            <h2>{{__('Favorite')}}</h2>
                        </div>

                        <div class="card-body">
                            {{__('Tell us about your wine dos and don’ts')}}
                        </div>
                    </div>
                </div>
                <div class="">
                    <div class="card card-default">
                        <div class="card-header">
                            <img src="{{ asset('/images/step_2.jpg') }}"/>
                            <h1>{{__('2')}}</h1>
                            <h2>{{__('Curate')}}</h2>
                        </div>

                        <div class="card-body">
                            {{__('Our sommeliers select wines to suit every occasion')}}
                        </div>
                    </div>
                </div>
            </div>
            <div class="d-flex flex-row flex-grow-1 flex-sm-shrink-0 flex-wrap justify-content-between ml-0 mr-0">
                <div class="">
                    <div class="card card-default">
                        <div class="card-header">
                            <img src="{{ asset('/images/sommelier_07.jpg') }}"/>
                            <h1>{{__('3')}}</h1>
                            <h2>{{__('Gift')}}</h2>
                        </div>

                        <div class="card-body">
                            {{__('Family & friends bring your dream wine cellar to life')}}
                        </div>
                    </div>
                </div>
                <div class="">
                    <div class="card card-default">
                        <div class="card-header">
                            <img src="{{ asset('/images/step_4.jpg') }}"/>
                            <h1>{{__('4')}}</h1>
                            <h2>{{__('Celebrate')}}</h2>
                        </div>

                        <div class="card-body">
                            {{__('Uncork, unwind, and celebrate life’s big moments')}}
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="d-flex flex-column align-items-center">
            <div class="verve-text mb-2">We’ve partnered with Verve Wine to provide a high quality and curated wine selection for all our couples.</div>
            <a href="https://vervewine.com" target="_blank"><img style="max-width:200px;" src="{{ asset('/images/verve.png') }}"/></a>
        </div>
        <div class="row justify-content-center">
            <button class="btn btn-getting-started"><a href="{{ route('registry.sign-up') }}">{{__("Let’s Get Started")}} </a></button>
        </div>
        @include('partials.registration.already')
    </section>
@endsection