@section('page-title', __('language.home'))
{{-- @section('page-description', $detail->description) --}}
@section('page-image', asset($detail->image ?? 'site/img/default.png'))
@extends('site.master')

@section('main-content')
    @php
        $currentLanguage = app()->getLocale();
    @endphp



    @if ($websitetype->marquee == 1)
        {{-- marquee news slide starts --}}
        <div class="marquee-slide shadow-sm bg-light bg-opacity-25 mb-2">
            <div class="container">
                <div class="acme-news-ticker border-0 bg-transparent">
                    <div
                        class="acme-news-ticker-label bg-danger text-white px-4 d-flex align-items-center text-uppercase fs-7">
                        @lang('language.latest_notice')
                    </div>
                    <div class="acme-news-ticker-box">
                        <ul class="my-news-ticker-2">
                            {{-- {{dd($news)}} --}}
                            @foreach ($news as $eachNews)
                                <li id="{{ $eachNews->id }}">
                                    <a class="p-3 text-black fs-7"
                                        href="{{ route('post.detailwithcategory', ['postcategory' => $eachNews->categories[0]->slug, 'slug' => $eachNews->slug]) }}">
                                        <span class="text-danger fw-bold me-2 text-uppercase">
                                            @if (session('localeSession') == 'en')
                                                {{ date('j F Y, l', strtotime($eachNews->published_date)) }}
                                                {{-- {{ format('d M, Y') }} --}}
                                            @else
                                                {{ getNepaliDate($eachNews->published_date) }}
                                            @endif
                                        </span>

                                        {{ $eachNews["title_$currentLanguage"] }}
                                    </a>
                                </li>
                            @endforeach
                        </ul>
                    </div>
                    <div class="acme-news-ticker-controls acme-news-ticker-horizontal-controls">
                        <span class="acme-news-ticker-pause"></span>
                        <i class="fa-bars"></i>
                    </div>
                </div>
            </div>
        </div>
    @endif

    <div class="slidersection position-relative overflow-hidden">
        <div class="container">
            <div class="row">
                <div class="col-lg-10">
                    <div class="overflow-hidden position-relative">
                        <div class="slider-fornavigation ">
                            @foreach ($slider as $item)
                                <div class="slide-items position-relative">
                                    <!-- Lazy-loaded image -->
                                    <img data-lazy="{{ asset($item->image) }}"
                                        class="{{ session('lowbandwidth') == 'low' ? 'd-none' : '' }}"
                                        alt="{{ $item->title }}" />
                                    <div
                                        class="position-absolute h-100 w-100 d-flex align-items-center justify-content-start top-0 left-0 px-5 z-20">
                                        <div class="col-lg-5">
                                            <!-- Icon -->
                                            <i class="{{ $item->icons }} text-white fs-1"></i>
                                            <!-- Title -->
                                            <h2 class="text-white fw-bold text-danger text-capitalize">{{ $item->title }}
                                            </h2>
                                            <!-- Caption -->
                                            <p class="text-white w-75">{{ $item->caption }}</p>
                                            @if ($item->product)
                                                <!-- Learn more button with dynamic product slug -->
                                                <a href="{{ route('products.details', ['slug' => $item->product->slug]) }}"
                                                    class="btn btn-danger rounded-5 px-4 py-3 fs-7 w-50 d-flex align-items-center justify-content-between gap-3 lh-1">
                                                    <span>@lang('language.learnmore')</span> <i class="bi-arrow-right"></i>
                                                </a>
                                            @endif
                                        </div>
                                    </div>
                                </div>
                            @endforeach

                        </div>
                        <div class="position-absolute top-0 end-0 d-none d-lg-block" style="margin-right: -1px;">
                            <svg width="457" height="2820" viewBox="0 0 457 2820" fill="none"
                                xmlns="http://www.w3.org/2000/svg">
                                <path d="M457 0L0 2819.5H457V0Z" fill="white" />
                            </svg>

                        </div>
                        <div class="slider-navigation"
                            style="margin-top: -117px;position: relative;z-index: 99; margin-bottom: 34px; margin-left: 1%; width: 90%;">
                            @foreach ($slider as $item)
                                <span
                                    class="p-2 rounded shadow-sm d-flex align-items-center justify-content-around flex-column bg-white text-custom-blue-dark2"
                                    style="width: 90px;height: 90px;position: relative;z-index: 1;">
                                    <span class="fs-3"><i class="{{ $item->icons }}"></i></span>
                                    @if ($item->product)
                                        <span class="text-center fs-8 lh-1 d-flex align-items-center justify-content-center"
                                            style="height: 30px;">{{ $item->product->shortcode }}</span>
                                    @endif
                                </span>
                            @endforeach

                        </div>
                    </div>

                </div>
                <div class="col-lg-2 mt-5 mt-md-2 mt-lg-0 mb-4 mb-lg-0">
                    <ul
                        class="d-flex align-items-center justify-content-center gap-3 flex-row flex-lg-column h-100 w-100 mb-0 p-0 mb-md-5">
                        <li class=" sliding-bg shadow rounded-3  p-4 w-100">
                            <a href="#" class="w-100 h-100">
                                <div
                                    class="position-relative z-20 d-flex flex-column  justify-content-start align-items-center w-100 gap-3">
                                    <i class="ggicons-amazon-pay fs-2 text-danger"></i>
                                    <span class="text-start fs-6 text-dark text-center fwc-600">
                                        @lang('language.buypremium')

                                    </span>

                                </div>
                            </a>
                        </li>

                        <li class=" sliding-bg shadow rounded-3  p-4 w-100">
                            <a href="#" class="w-100 h-100">
                                <div
                                    class="position-relative z-20 d-flex  flex-column justify-content-start align-items-center w-100 gap-3">
                                    <i class="ggicons-money-check-alt-solid fs-2 text-danger"></i>
                                    <span class="text-start fs-6 text-dark text-center fwc-600">
                                        @lang('language.premium')

                                    </span>
                                </div>
                            </a>
                        </li>

                        <li class=" sliding-bg shadow rounded-3  p-4 w-100">
                            <a href="{{ route('claims.page') }}" class="w-100 h-100">
                                <div
                                    class="position-relative z-20 d-flex flex-column justify-content-start align-items-center w-100 gap-3">
                                    <i class="ggicons-hand-holding-heart-solid fs-2 text-danger"></i>
                                    <span class="text-start fs-6 text-dark text-center fwc-600">
                                        @lang('language.makeclaim')
                                    </span>
                                </div>
                            </a>

                        </li>

                        {{-- <li class=" sliding-bg shadow rounded-3  p-4 w-100">
                            <a href="#" class="w-100 h-100">
                                <div
                                    class="position-relative z-20 d-flex   justify-content-start align-items-center w-100 gap-3">
                                    <i class="ggicons-telegram-plane fs-2 text-danger"></i>
                                    <span class="text-start fs-7 text-dark">
                                        @lang('language.requestaquote')
                                    </span>
                                </div>
                            </a>
                        </li> --}}
                    </ul>
                </div>
            </div>



        </div>

    </div>


    <section class="py-5 position-relative">
        <div class="img-benifits position-absolute opacity-25 w-100 h-100"
            style="background: linear-gradient(45deg, #d23a3a, #0d3aaa);
    z-index: 0;
    top: 0;
    right:0;
">
            <img src="{{ asset('/site/img/map-section-bg-1.png') }}" alt="">
        </div>
        <div class="container my-5 position-relative zindex-1">
            <div class="row">

                <div class="col-lg-6 d-flex align-items-start justify-content-center gap-3 flex-column ">
                    <div class="row">
                        <div class="col-lg-7 col-md-5">
                            <div class="d-flex flex-column">
                                {{-- <h6 class="text-uppercase text-danger fs-7">our benifits</h6> --}}
                                <h3 class="fwc-600 fs-4  {{ session('localeSession') == 'en' ? 'mb-5' : 'mb-3 lh-md' }}">
                                    <span class="fs-3 fwc-700 ">@lang('language.why_people')</span>
                                    <span class="text-danger fs-5 d-block">@lang('language.chooseus')</span>
                                </h3>
                            </div>
                            <p class="fs-6 {{ session('localeSession') == 'en' ? 'text-justify' : 'fwc-500' }}"
                                style="line-height:{{ session('localeSession') == 'en' ? '1.38' : '1.87' }} ">
                                @lang('language.why_choose_us_p')
                            </p>
                        </div>
                        <div
                            class="col-lg-5 col-md-4 offset-lg-0 offset-md-2 d-flex align-items-center justify-content-center">
                            <img src="{{ asset('site/img/titlepic-1-1.png') }}" alt="" class="wy-img-us">
                        </div>
                    </div>


                </div>
                <div
                    class="col-lg-6 position-relative d-flex align-items-center justify-content-end flex-column flex-lg-row">
                    <div class="circle order-2 order-lg-1" style="--total: 6; margin-top:0; margin-right: 30px;">

                        @foreach ($whyus as $key => $item)
                            @php
                                $words = explode(' ', $item->title); // Split title into words
                                $lastWord = array_pop($words); // Extract the last word
                                $titleWithoutLastWord = implode(' ', $words); // Reconstruct the title without the last word
                            @endphp
                            <div class="stat d-flex align-items-center justify-content-center flex-column text-center shadow {{ $loop->first ? 'active' : '' }}"
                                style="--i:{{ $key + 1 }}" data-tag="{{ $item->slug }}">
                                <i class="{{ $item->icon }} fs-2"></i>
                                <span class="fs-7 label-s">
                                    {{ $titleWithoutLastWord }}
                                    @if ($lastWord)
                                        <span class="d-block text-danger">
                                            {{ $lastWord }} <!-- Display the last word in red -->
                                        </span>
                                    @endif
                                </span>
                            </div>
                        @endforeach



                    </div>

                    <div
                        class="position-absolute  d-flex align-items-center justify-content-center flex-column
                         overflow-hidden r-items-cirsect rounded-circle order-1 order-lg-2">
                        <div class="w-80 stat-list-content">

                            @foreach ($whyus as $key => $item)
                                @php
                                    $words = explode(' ', $item->title); // Split title into words
                                    $lastWord = array_pop($words); // Extract the last word
                                    $titleWithoutLastWord = implode(' ', $words); // Reconstruct the title without the last word
                                @endphp
                                <div class="stat-item gap-4 {{ $loop->first ? 'active' : '' }}" id="{{ $item->slug }}">
                                    <div class="d-flex gap-3 align-items-center mb-4">
                                        <i class="{{ $item->icon }} fs-1"></i>
                                        <h3 class="fs-5 text-custom-blue-dark2 fwc-600"> {{ $titleWithoutLastWord }}
                                            @if ($lastWord)
                                                <span class="d-block text-danger">
                                                    {{ $lastWord }} <!-- Display the last word in red -->
                                                </span>
                                            @endif
                                        </h3>
                                    </div>

                                    <p class="w-90 mb-3">
                                        {{ $item->shrtsummary }}
                                    </p>
                                    <div class="col-lg-11 d-flex mt-3 align-items-center justify-content-start">
                                        <a href="{{ route('whypeoplechooseus.details', ['slug' => $item->slug]) }}"
                                            class="btn btn-danger rounded-5 px-4 py-3 fsc-8 w-75 d-flex align-items-center justify-content-between gap-3 lh-1">
                                            <span>@lang('language.learnmore')</span> <i class="bi-arrow-right"></i></a>
                                    </div>
                                </div>
                            @endforeach


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

        </div>
    </section>



    {{-- why us  --}}


    <section class="bg-white py-5">
        <div class="container py-5">
            <div class="row mb-5">
                <div class="col-lg-9 d-flex flex-column">
                <h6 class="text-uppercase text-danger fs-7">Products</h6>

                    <h3 class="fwc-600 fs-4">
                        @php
                            $producttitle = breakIntoHalves(__('language.producthomecontent'));
                        @endphp
                        {{ $producttitle[0] }}
                        @if (count($producttitle) > 1)
                            <span class="text-danger d-block">{{ $producttitle[1] }}</span>
                        @endif


                    </h3>
                    <p class="w-75">
                        @lang('language.producthomeparagraph')
                    </p>
                </div>
                <div class="col-lg-3 d-flex align-items-center justify-content-end">
                    <a href="{{ route('products.list') }}"
                        class="btn btn-danger rounded-5 px-4 py-3 fs-7 w-auto d-flex align-items-center justify-content-between gap-3 lh-1">
                        <span>View all Services</span> <i class="bi-arrow-right"></i></a>
                </div>
            </div>
            <div class="row">
                @foreach ($products as $key => $item)
                    @if ($key == 5)
                    @break
                @endif
                <div class="{{ $key < 2 ? 'col-lg-6 mb-4' : 'col-lg-4 mb-4 mb-lg-0' }}">
                    <div class="shadow rounded-4 position-relative overflow-hidden lg-product-section "
                        style="height: 300px;">
                        <div class="products-image">

                            <img class="lazy" class="{{ session('lowbandwidth') == 'low' ? 'd-none' : '' }}"
                                data-src="{{ asset($item->image) }}?tr=w-400,h-300" alt="{{ $item->title }}"
                                class="" style="height: 300px;">
                        </div>
                        <div class="position-absolute lg-itemc-product text-white">
                            <span class="icon-block d-flex align-items-center justify-content-center">

                                <i class="{{ $item->icons }} fs-1"></i>
                            </span>
                            <h5 class="fs-5 fw-bold w-75">{{ $item->title }}</h5>
                            <div class="d-flex justify-content-between flex-column vie-more-button"
                                style="height: 150px;">
                                @php
                                    $summary = $item->srtsmry;
                                    $sentences = explode('.', $summary, 2);

                                    $firstSentence = trim($sentences[0]) . '.';
                                    $secondSentence = isset($sentences[1]) ? trim($sentences[1]) : '';
                                @endphp
                                <div class="">
                                    <span class="text-dark-50 d-block">{{ $firstSentence }}</span>
                                    <span class="w-75">{{ $secondSentence }}</span>
                                </div>

                                <a href="{{ route('products.details', ['slug' => $item->slug]) }}"
                                    class="text-white text-hover-danger w-50 py-2">Learn
                                    More
                                    <span><i class="bi-arrow-right"></i></span>
                                </a>

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

                </div>
            @endforeach

        </div>
        <div class="d-flex align-items-center justify-content-center py-3" data-aos="fade-up" data-aos-delay="900">

        </div>
    </div>
</section>






<section class="bg-light py-5 position-relative">
    <div class="img-benifits position-absolute w-100 h-100"
        style="background: linear-gradient(45deg, #d23a3a, #0d3aaa);
    z-index: 0;
    opacity: .1 !important;
    top: 0;
    right:0;

">
        <img src="{{ asset('site/img/map-section-bg-1.png') }}" alt="">
    </div>
    <div class="container my-4 position-relative z-10">
        <div class="row">
            <div class="col-lg-5 offset-lg-1 offset-2 col-8 position-relative pb-5 pb-lg-0">
                <div class="position-absolute bg-gradient-blue d-flex align-items-center bg-dark text-white px-4 py-1 rounded-4 gap-2 rotate-90"
                    style="width: 222px; transform: rotate(-90deg); top: 113px; left: -94px;background: linear-gradient(0, #06143d, #002975);">
                    <span class="fs-2 fw-bold text-danger">{{ calculateYearDifference($estd->estd) }}</span>
                    <span class="lh-1 fs-7">YEARS EXPERIENCE IN THIS FEILD</span>
                </div>
                <img src="{{ asset('site/img/Mask group (1).png') }}" alt="" class="rounded-4 img-width-90">
                <div class="position-absolute bg-gradient-blue d-flex align-items-start bg-white flex-column px-4 py-3 pb-2 rounded-4 gap-2"
                    style="bottom:20px;right: 0;">
                    <span class="lh-1 text-custom-blue-dark2 fwc-600 fs-8 ">Our Satisfied Customers</span>
                    <ul class="list-unstyled d-flex mb-0">

                        @if (!empty($testimonial) && count($testimonial) >= 4)
                            @foreach ($testimonial as $item)
                                <li
                                    style="position: relative; margin-right: -5px; z-index: 0; border: 2px solid red; border-radius: 50%; height: 40px; width: 40px;">
                                    <img src="{{ asset('site/img/clients.png') }}" alt=""
                                        class="w-100 h-100">
                                </li>
                            @endforeach
                        @else
                            <li style="position: relative; margin-right: -5px; z-index: 0;">
                                <img src="{{ asset('site/img/clients.png') }}" alt="">
                            </li>

                        @endif


                        <li class="d-flex align-items-center justify-content-center"
                            style="position: relative;margin-left: -6px;z-index:4;background: red;color:white;border:2px solid red;border-radius:50%;height: 33px;width: 33px;font-size: 12px;font-weight: bold;">
                            <span>99+</span>
                        </li>

                    </ul>




                </div>
            </div>
            <div class="col-lg-6 d-flex align-items-start flex-column justify-content-center gap-4">

                <div class="title">
                    <h6 class="text-uppercase text-danger fs-7">About Us</h6>
                    @php
                        $about = breakIntoHalves(__('language.homeabout'));
                    @endphp
                    <h3 class="fwc-700 fs-4 text-uppercase">
                        {{ $about[0] }}
                        @if (count($about) > 1)
                            <span class="text-danger d-block">{{ $about[1] }}</span>
                        @endif
                    </h3>

                </div>
                <div class="col-lg-10 text-justify">


                    {!! strip_tags(Str::words($aboutus->description, 80, '...')) !!}


                </div>

                <div class="row row-cols-3 gap-lg-4 gap-2 w-100 g-0 g-lg-1">

                    @foreach ($stats as $item)
                        <div class="cols has-border d-flex gap-3 flex-grow-1 flex-grow-lg-0">
                            <div class="icon"><i class="{{ $item->icons }} text-danger fs-3"></i></div>
                            <div class="content w-75">
                                <h4 class="fw-bold text-primary-custom mb-0">
                                    <span class="countdown"
                                        data-target="{{ $item->count }}">{{ $item->count }}</span>
                                    {{ $item->unit }}
                                </h4>
                                <small>{{ $item->title }}</small>
                            </div>
                        </div>
                    @endforeach






                </div>
                <a href="{{ route('products.list') }}"
                    class="btn btn-danger rounded-5 px-4 py-3 fs-7  d-flex align-items-center justify-content-between gap-3 lh-1">
                    <span>@lang('language.viewallservices')</span> <i class="bi-arrow-right"></i></a>
            </div>
        </div>
    </div>
</section>
<section class="py-5 has-temp-pattern position-relative">
    <div class="container my-5">
        <div class="row mb-5">
            <div class="col-lg-9 d-flex flex-column">
                <h6 class="text-uppercase text-danger fs-7">News & Media</h6>
                <h3 class="fwc-600 fs-4">
                    @php
                        $textcontent = breakIntoHalves(__('language.newsandmediatitle'));
                    @endphp

                    {{ $textcontent[0] }}
                    @if (count($textcontent) > 1)
                        <span class="text-custom-blue-dark2 d-block">{{ $textcontent[1] }}</span>
                    @endif


                </h3>

            </div>
            <div class="col-lg-3 d-flex align-items-center justify-content-end">
                <a href="{{ route('newsandnotices.list') }}"
                    class="btn btn-danger rounded-5 px-4 py-3 fs-7 w-auto d-flex align-items-center justify-content-between gap-3 lh-1">
                    <span>View all News & Notices </span> <i class="bi-arrow-right"></i></a>
            </div>
        </div>
        <div class="row g-5">
            <div class="col-lg-5">
                @php
                    $firstPost = $singlecategoryposts->firstWhere('big_feature', true);
                @endphp
                {{-- {{dd($firstPost)}} --}}
                @if ($firstPost)
                    <article
                        class="d-flex flex-column bg-light position-relative rounded-3 overflow-hidden shine-animate-item">
                        <div class="image shine-animate w-100">
                            <img src="{{ asset($firstPost->image) }}" alt="{{ $firstPost->title }}"
                                style="min-height: 250px;height: 300px;object-fit: cover;width: 100%;">
                        </div>
                        <div class="d-content p-3 p-lg-4 d-flex flex-column gap-3">
                            <div class="d-flex flex-column">
                                <span class="mb-3">
                                    <i class="bi-calendar-date text-danger me-2"></i>
                                    {{ getNepaliDate($firstPost->published_date) }}
                                </span>
                                <h2 class="fs-6">
                                    <a href="{{ route('post.detailwithcategory', ['postcategory' => $firstPost->category[0]->slug, 'slug' => $firstPost->slug]) }}"
                                        class="text-custom-blue-dark2 text-hover-danger"
                                        title="{{ $firstPost->title }}">
                                        {{ $firstPost->title }}
                                    </a>
                                </h2>
                            </div>

                            <div class="fs-7 text-justify" style="min-height: 106px;">{!! Str::limit($firstPost->summary, 270, '...') !!}</div>
                            <a href="{{ route('post.detailwithcategory', ['postcategory' => $firstPost->category[0]->slug, 'slug' => $firstPost->slug]) }}"
                                class="text-dark text-hover-danger"
                                title="{{ $firstPost->title }}">@lang('language.learnmore')
                                <span class="ms-3"><i class="bi-arrow-right"></i></span></a>
                        </div>
                    </article>
                @else
                    <p>@lang('language.no_featured_posts_found')</p> <!-- Optional fallback message -->
                @endif
            </div>

            <div class="col-lg-7">
                <div class="d-flex flex-column justify-content-between h-100 gap-5 gap-lg-0">
                    @foreach ($singlecategoryposts->where('big_feature', false) as $post)
                        <article
                            class="d-flex flex-column flex-lg-row flex-md-row bg-light position-relative rounded-3 overflow-hidden shine-animate-item"
                            style="min-height: 160px;">
                            <div class="image col-lg-4 col-md-4 shine-animate">
                                <img class="lazy" data-src="{{ asset($post->image) }}" alt="{{ $post->title }}"
                                    style="min-height: 175px;height: 175px;object-fit: cover;width: 100%;">
                            </div>
                            <div
                                class="d-content p-3 p-lg-4 d-flex flex-column col-lg-8 col-md-8 justify-content-between h-100">
                                <div class="d-flex flex-column">
                                    <span class="mb-2">
                                        <i class="bi-calendar-date text-danger me-2"></i>
                                        <span class="fsc-8">{{ getNepaliDate($post->published_date) }}</span>
                                    </span>

                                    <h2 class="fs-6">
                                        <a href="{{ route('post.detailwithcategory', ['postcategory' => $post->category[0]->slug, 'slug' => $post->slug]) }}"
                                            class="text-custom-blue-dark2 text-hover-danger"
                                            title="{{ $post->title }}">
                                            {{ $post->title }}
                                        </a>
                                    </h2>
                                </div>

                                <a href="{{ route('post.detailwithcategory', ['postcategory' => $post->category[0]->slug, 'slug' => $post->slug]) }}"
                                    class="text-dark text-hover-danger"
                                    title="{{ $post->title }}">@lang('language.learnmore')
                                    <span class="ms-3"><i class="bi-arrow-right"></i></span></a>
                            </div>
                        </article>
                    @endforeach
                </div>
            </div>
        </div>


    </div>
</section>
<section class="testimonials py-5" style="background: #f5f5fa;">
    <div class="container">

    </div>
</section>




<section class="pb-5 pt-2 pt-lg-0" style="background: #f5f5fa;">
    <div class="container">
        <div class="row mb-4">
            <div class="col-lg-12 d-flex align-items-center justify-content-between">
               <div class="flex flex-col">
                <h6 class="text-uppercase text-danger fs-7">Gallery & Videos</h6>
                <h3 class="fwc-600 fs-4 text-capitalize">

                    @php
                        $gallerycontent = breakIntoHalves(__('language.gallerytitle'));
                    @endphp

                    {{ $gallerycontent[0] }}
                    @if (count($gallerycontent) > 1)
                        <span class="text-danger d-block">{{ $gallerycontent[1] }}</span>
                    @endif


                </h3>
               </div>
                <a href="{{ route('album.list') }}"
                    class="btn btn-danger rounded-5 px-4 py-3 fs-7 w-auto d-flex align-items-center justify-content-between gap-3 lh-1">
                    <span>@lang('language.viewmore') </span> <i class="bi-arrow-right"></i></a>
                {{-- <a href="{{ route('album.list') }}" class="text-dark text-hover-danger">@lang('language.viewmore')</a> --}}
            </div>

        </div>
        <div class="row g-5">
            <div class="col-lg-12">

                <div class="row">
                    @foreach ($albums as $item)
                        <div class="col-lg-4 position-relative mb-3 chover-item ">
                            <div class="imag-section position-relative bg-white shadow overflow-hidden"
                                style="min-height: 245px;">
                                <img src="{{ asset($item->image) }}"
                                    class="{{ session('lowbandwidth') == 'low' ? 'd-none' : '' }}"
                                    alt="{{ $item->title }}"
                                    style="height: 245px;
                        object-fit: cover;
                        width: 100%;">
                                <span
                                    class="position-absolute r-st bg-custom-blue-dark2 text-white p-1 px-3 rounded-1">
                                    {{ numEnToNp($item->photo_count + 1) }}
                                    @lang('language.photo')</span>

                                <div
                                    class="cshow-on-hover bg-dark bg-opacity-25 text-white fs-5 lh-1 justify-content-start align-items-end position-absolute start-0 h-100 w-100 p-4">
                                    {{ $item->title }} </div>
                            </div>


                            <a href="{{ route('gallery', ['album_id' => $item->slug]) }}" class="stretched-link"></a>
                        </div>
                    @endforeach
                </div>
            </div>

        </div>


        <div class="d-flex align-items-center justify-content-center py-3" data-aos="fade-up" data-aos-delay="900">

        </div>
    </div>
</section>




<br />
<b>Warning</b>:  Undefined variable $popupmessage in <b>/home/nepalmicro/public_html/resources/views/site/home.blade.php</b> on line <b>666</b><br />
<br />
<b>Fatal error</b>:  Uncaught TypeError: count(): Argument #1 ($value) must be of type Countable|array, null given in /home/nepalmicro/public_html/resources/views/site/home.blade.php:666
Stack trace:
#0 {main}
  thrown in <b>/home/nepalmicro/public_html/resources/views/site/home.blade.php</b> on line <b>666</b><br />