@extends('master.principal')
@section('header')
    <title> Línea Constellation | {{ config('vw.name') }} </title>
@endsection
@section('content')

<div id="headerBreadcrumb" class="header__breadcrumb absolute" style="top: 98px;">
    <a href="{{ route('inicio') }}">inicio</a> / <a href="{{ route('modelos') }}">Modelos</a> / <a href="{{ route('constellation') }}">Constellation</a>
</div>

<div class="trucks--detailed">

    <div class="sectionTitle">
        <div>
            <span>
                <span>Constellation</span>
            </span>
            <div class="yellowBorder"></div>
        </div>
        <div class="title">
            <span>Línea Constellation</span>
        </div>
    </div>

    <div class="card-area row">
        <div id="cardArea" style="width: 100%; padding: 0 15px;"> 
			<span>
				<div class="row cardArea">

                    @foreach($modelos as $modelo)
					
					<span class="col-12 col-sm-6 col-lg-4 card-detailed-container batata">
            			<div>
        					<div class="truckCard card card-border">
        						<h6 class="card-title subtitle-section">{{ $modelo->nombre }}</h6>
        						<img src="{{ asset('assets/front/img/placeholder-img-medium.png')}}" data-src="{{ asset('storage/modelo/' . $modelo->id . '/' . $modelo->imagen) }}" class="card-img-top lazy">
        						
        						<div style="height: 1.875rem"></div>

    						</div>
        					<div class="button-card-container">
                    			<div class="button-card">
                        			<button type="" class="btn btn-outline" onclick="window.location.href='{{ route('modelo.detalle' , $modelo->id) }}';">
    									<span>+ Más información</span>
    								</button>
                    			</div>
	                    		<div class="button-card">
	                        		<button type="" class="btn btn-secondary" onclick="window.location.href='{{ route('contacto') }}?ref={!! str_replace(' ', '-', $modelo->nombre) !!}';">
                                        <span>Estoy interesado</span>
                                    </button>
	                    		</div> 
                			</div>
    					</div>
        			</span>
                    @endforeach

    			</div>
    		</span>
    	</div>
    </div>





</div>

@endsection

@section('scripts')

@endsection