@extends('layouts.app')

@php
     $seo =  array (
        'title' =>  App::getLocale() == 'en' ? 'Riviera Nayarit Exclusive Benefits and Rewards | Inovation Travel' : 'Beneficios Exclusivos y Recompensas en Riviera Nayarit | Inovation Travel',
        'description' =>  App::getLocale() == 'en' ? 'Discover Inovation Travel\'s unparalleled benefits: discounts, unique restaurant access, free tours and a free vacation referral program.' : 'Descubre los incomparables beneficios de Inovation Travel: descuentos, accesos únicos a restaurantes, tours gratis y un programa de referidos para vacaciones sin costo.',
        'imagen' => asset('/storage/images/op/inovations-travel-opengraph.jpg'),
        'url' =>  App::getLocale() == 'en' ? 'https://inovationtravel.com/concept/' : 'https://inovationtravel.com/es/concepto/',
    );
@endphp

@push('css')
    @vite('resources/sass/website/pages/groups.scss')
@endpush

@section('content')

<div class="banner">
    <picture>
        <source media="(max-width: 640px)" srcset="{{ asset('storage/images/banner/background-blue.webp') }}">
        <source media="(max-width: 1001px)" srcset="{{ asset('storage/images/banner/background-blue.webp') }}">
        <source media="(max-width: 1600px)" srcset="{{ asset('storage/images/banner/background-blue.webp') }}">
        <img src="{{ asset('storage/images/banner/background-blue.webp') }}" alt="{{ __('concept.title') }}">
    </picture>
    <div class="banner-text">
        <h1>{{ __('concept.title') }}</h1>
    </div>
</div>

<section>
    <div class="concept">
        <div class="container">
            <div class="row d-flex justify-content-center">
                <div class="col-lg-10 col-md-12">
                    {!! __('concept.description') !!}
                </div>
                <div class="col-lg-10 col-md-12">
                    <div class="box-description">
                        <div class="box-imagen">
                            <img src="{{ asset('storage/images/luxury-woman.jpg') }}" class="img-description" alt="{{ __('concept.title') }}">
                        </div>
                        <div> 
                            {!! __('concept.listing') !!}
                        </div>
                    </div>
                    {!! __('concept.description_2') !!}

                    <div class="alert d-flex bg-aqua" role="alert">
                        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" class="bi bi-exclamation-triangle-fill flex-shrink-0 me-2" viewBox="0 0 16 16" role="img" aria-label="Warning:">
                            <path d="M8.982 1.566a1.13 1.13 0 0 0-1.96 0L.165 13.233c-.457.778.091 1.767.98 1.767h13.713c.889 0 1.438-.99.98-1.767L8.982 1.566zM8 5c.535 0 .954.462.9.995l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 5.995A.905.905 0 0 1 8 5zm.002 6a1 1 0 1 1 0 2 1 1 0 0 1 0-2z"/>
                        </svg>
                        <div class="links">
                            {!! __('concept.description_3') !!}
                        </div>
                    </div>
                    
                </div>
            </div>
        </div>
    </div>
</section>

@include('components.contact')

@endsection