@extends('layout.frontend.master-layout')
@section('page-title')
    <title>
        {{ isset($productDetail->meta_title)  ? @$productDetail->meta_title . ' - '.  @$viewComposerSiteSetting->company_name : ucwords(@$productDetail->title) . ' - Golcha Green Energy' }}
    </title>
@endsection
@section('style')
@endsection
@section('main-content')
    <section class="relative min-h-[450px] rounded-2xl overflow-hidden m-2">
        <div class="absolute inset-0">
            <img class="w-full h-full object-cover" src="{{ asset(@$productDetail->image) }}" alt="">
        </div>

        <div class="absolute top-0 left-0 w-full h-full bg-brand-dark-1/30 pt-[10em]">
            <h1 class="text-center h1 text-brand-green-3 font-bold max-sm:text-4xl">
                {{ @$productDetail->title }}
            </h1>
            <div class="text-center text-light-1 mt-4">
                <a href="{{ route('frontend.home') }}">Home</a> <span> > </span>  Product
            </div>
        </div>
    </section>

    <section class="pt-[120px] max-xl:pt-[100px]">
        <div class="container">
            <div class="grid gap-x-20 max-w-4xl mx-auto">
                <div class="text-center">
                    <h3 class="text-3xl font-semibold border-b border-b-brand-gray-1 mb-8 pb-4">Product Overview</h3>
                    <div>
                        {{ strip_tags(@$productDetail->description) }}
                    </div>
                </div>
            </div>
        </div>
    </section>
    @include('frontend.include._contact-bottom-part')
@endsection

@section('script')
    @vite(['resources/js/frontend/pages/project.js'])
@endsection