@extends('layouts.app')

@php
    $seo =  array (
        'title' =>  App::getLocale() == 'en' ? 'Inovation Travel by Marival Resorts' : 'Inovation Travel by Marival Resorts',
        'description' =>  App::getLocale() == 'en' ? 'Discover the new way of traveling that is giving the word vacation a new meaning and turning it into a lifestyle.' : 'Descubre la nueva forma de viajar que está cambiando completamente la manera de vacacionar y conviértela en tu estilo de vida.',
        'imagen' => asset('/storage/opengraph/inovations-travel-vacations.jpg'),
        'url' =>  App::getLocale() == 'en' ? 'https://traveladvisors.inovationtravel.com' : 'https://asesoresdeviaje.inovationtravel.com',
        'index'=>'index',
        'follow'=>'follow',
    );
@endphp

@push('css')
    <style>
        .bottom-bar .list .item.hide-home{
            display: none;
        }
    </style>
@endpush

@section('content')

<div class="video header">
    @desktop
        <video poster="{{ asset('storage/img/contact-us-inovation-travel-l.webp') }}" width="100%" autoplay="" loop="" muted="" playsinline="">
            <source src="{{ asset('storage/video/header-marival-resort-large.webm') }}" type="video/webm">
            <source src="{{ asset('storage/video/header-marival-resort-large.mp4') }}" type="video/mp4">
            <track src="#" label="Marival Distinct" kind="no" srclang="en" default="">
        </video>
        <a href="#intro" alt="icon">
            <img src="{{ asset('storage/icons/double-down.svg') }}" class="down-icon"> 
        </a>
   @elsedesktop
        <video poster="{{ asset('storage/img/contact-us-inovation-travel-s.webp') }}" width="100%" autoplay="" loop="" muted="" playsinline="">
            <source src="{{ asset('storage/video/header-marival-resort-small.webm') }}" type="video/webm">
            <source src="{{ asset('storage/video/header-marival-resort-small.mp4') }}" type="video/mp4">
            <track src="#" label="Marival Distinct" kind="no" srclang="en" default="">
        </video>
    @enddesktop
</div>

<section id="intro" class="home pt-5">
    <div class="container text-center">
        <div class="row justify-content-center">
            <div class="col text-center col-md-10 col-lg-7">
                <h1 class="page-title mb-0">{{ __('home.title')}}</h1>
                <h2 class="page-subtitle">{{ __('home.subtitle')}}</h2>
                <p>{!! __('home.description')!!}</p>
            </div>
        </div>
    </div>
</section>
<section id="resorts" class="pt-5 home">
    <div class="container text-center">
        <div class="row justify-content-center">
            <div class="col-md-6 col-lg-4 my-4">
                <div class="card">
                    <a href="{{ route('agents-armony') }}">
                        <img src="{{ asset('storage/img/armony-inovation-travel.webp') }}" class="card-img-top" alt="Armony Luxury Resort & Spa in Punta de Mita">
                    </a>
                    <div class="card-body">
                        <h2 class="card-title">{{ __('home.armony.title')}}</h2>
                        <h3 class="card-destination">
                            <img src="{{ asset('storage/icons/location.svg') }}" class="icon" alt="icon"> 
                            {{ __('home.armony.destination')}}
                        </h3>
                        <p class="card-text">{{ __('home.armony.description')}}</p>
                        <a href="{{ route('agents-armony') }}" class="btn btn-secondary my-3">{{ __('home.button')}}</a>
                    </div>
                </div>
            </div>
            <div class="col-md-6 col-lg-4 my-4">
                <div class="card">
                    <a href="{{ route('agents-distinct') }}">
                        <img src="{{ asset('storage/img/distinct-inovation-travel.webp') }}" class="card-img-top" alt="Marival Distinct Luxury Residences in Nuevo Vallarta">
                    </a>
                    <div class="card-body">
                        <h2 class="card-title">{{ __('home.distinct.title')}}</h2>
                        <h3 class="card-destination">
                            <img src="{{ asset('storage/icons/location.svg') }}" class="icon" alt="icon">
                            {{ __('home.distinct.destination')}}
                        </h3>
                        <p class="card-text">{{ __('home.distinct.description')}}</p>
                        <a href="{{ route('agents-distinct') }}" class="btn btn-secondary my-3">{{ __('home.button')}}</a>
                    </div>
                </div>
            </div>
            <div class="col-md-6 col-lg-4 my-4">
                <div class="card">
                    <a href="{{ route('agents-emotions') }}">
                        <img src="{{ asset('storage/img/emotions-inovation-travel.webp') }}" class="card-img-top" alt="Marival Emotions Resort & Suites in Nuevo Vallarta">
                    </a>
                    <div class="card-body">
                        <h2 class="card-title">{{ __('home.emotions.title')}}</h2>
                        <h3 class="card-destination">
                            <img src="{{ asset('storage/icons/location.svg') }}" class="icon" alt="icon">
                            {{ __('home.emotions.destination')}}
                        </h3>
                        <p class="card-text">{{ __('home.emotions.description')}}</p>
                        <a href="{{ route('agents-emotions') }}" class="btn btn-secondary my-3">{{ __('home.button')}}</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

@include('components.footer')
@include('components.bottom-bar')

@endsection