@extends('web.layouts.layout')
@section('content')



    <main>

        <!-- Start header -->
        @include('web.pages.components.banner')

        <!-- Start banner-sec -->
        <section class="banner-sec section mt-5">
            <div class="container">
                <div class="text-center">
                    <h5 class="subtitle text-uppercase text-white"><b>{{$second_banner->title}}</b></h5>
                    <h1 class="title text-uppercase text-white mb-0"><b>{{$second_banner->description}}</b></h1>
                </div>
            </div>
            <img src="{{asset($second_banner->image)}}" alt="" class="bg"/>
        </section>

        <!-- Start falvors-sec -->
        <section class="falvors-sec falvors-pg  section">
            <div class="container">
                <h1 class="title mb-4">{{__('web.our_flavors')}}</h1>
                @foreach($products as $product)
                    <div class="row justify-content-center">
                        @foreach($product as $row)
                            <div class="col-lg-4 col-md-6">
                                <a href="#">
                                    <div class="flavor_card">
                                        <div class="img-box">
                                            <img src="{{asset($row->image)}}" alt="" class="sec-img"/>
                                        </div>
                                        <div class="hvr-content">
                                            <h1 class="title text-white"><b>{{$row->name}}</b></h1>
                                            <p class="p text-white col-lg-10 m-auto my-0">
                                                {{$row->description}}
                                            </p>
                                            @foreach($row->features as $feature)
                                                <div class="profile_data d-flex align-items-enter mt-4 w-100">
                                                    <img src="{{asset($feature->image)}}" alt="" class="avatar_img me-2"/>
                                                    <h6 class="prof_name text-white mb-0 mt-1">{{$feature->currentDescription->name}}</h6>
                                                </div>
                                            @endforeach
                                        </div>
                                    </div>
                                </a>
                            </div>
                        @endforeach
                    </div>
                @endforeach
            </div>
        </section>

    </main>


@section('inject_js')

@endsection

@stop
