@php
    $category = $categories[0] ?? null;
    $news = $category ? category_news($category->id)->take(8) : collect();
@endphp

<div class="row">
    {{-- Separator --}}
    <div class="col-xs-12">
        @include('global.separatior')
    </div>

    {{-- News Grid --}}
    @foreach ($news as $info)
        {{--
           Logic:
           1. col-md-3 (Desktopt-e 4ti), col-xs-6 (Mobile-e 2ti)
           2. paddingL0/paddingR0 logic jate container-er sathe align thake
        --}}
        <div class="col-md-3 col-sm-6 col-xs-6 marginT15
            {{ $loop->iteration % 4 == 1 ? 'paddingL0' : '' }}
            {{ $loop->iteration % 4 == 0 ? 'paddingR0' : 'borderR1LCN' }}">

            <div class="itemDiv bgWhite hoverOrange">
                <div class="thumbnail borderNone padding0 marginB0">
                    <div class="positionRelative">
                        @include('global.image')
                    </div>

                    <div class="caption padding0 border-bottom" style="border-bottom: 2px solid rgba(89, 91, 96, 0.21) !important;">
                        <h2 class="title3 margin0 paddingB10 two-line">
                            @if ($info->sub_title)
                                <span class="shoulder d-block">{{ $info->sub_title }}</span>
                            @endif
                            {{ $info->title }}
                        </h2>
                    </div>
                </div>
                <a href="{{ news_url($info) }}" class="linkOverlay"></a>
            </div>
        </div>
    @endforeach
</div>