@extends('frontend.layouts.app')

@section('title')

@endsection

@section('seo')
<title>FAQs | JRS</title>
<meta property="og:locale" content="en_US" />
<meta property="og:url" content="" />
<meta property="og:type" content="website" />
<meta property="og:title" content="FAQs | JRS" />
<meta property="og:description" content="Discover the power of smart investments with JRS Holdings Inc. We specialize in managing a diverse portfolio for long-term success." />
<meta property="og:site_name" content="FAQs | JRS" />
<meta property="og:image" content="{{ asset('images/thumbnail.png') }}" />
<meta property="og:thumbnail" content="{{ asset('images/thumbnail.png') }}" />
<meta property="og:keywords" content="JRS Holdings Inc., Holding Company, Investment Portfolio, Diversified Holdings, Business Investments, Strategic Holdings, Corporate Investments, Investment Management, Asset Portfolio, Growth Investments, Financial Holdings, Holding Group, Investment Holdings, Investment Strategies, Portfolio Management, Capital Investments, Business Expansion, Equity Holdings, Investment Opportunities, Investment Diversification, Investment Company, Holding Group, Strategic Investments, Diverse Portfolio, Financial Holdings, Investment Management, Corporate Holdings, Investment Strategies, Asset Diversification, Growth Opportunities, Business Expansion, Investment Portfolio, Equity Holdings, Capital Management, Investment Diversity, Investment Growth, Portfolio Diversification, Profitable Investments, Investment Ventures">
@endsection

@section('content')
<div class="banner mb-5">
    <div class="container">

        <div class="col-3 text-end d-md-block d-none">
            <h1 class="banner-title fw-bold text-white fs-1">FAQS</h1>
            <span class="text-white">JRS HOLDINGS INC</span>
        </div>

        <div class="text-center d-sm-block d-md-none">
            <h1 class="banner-title fw-bold text-white fs-1">FAQS</h1>
            <span class="text-white">JRS HOLDINGS INC</span>
        </div>

    </div>
</div>

<div class="container mb-5">

    <div class="my-5 text-center">
        <h1 class="fw-bold">FREQUENTLY ASKED QUESTIONS</h1>
    </div>


    <div class="accordion accordion-flush rounded" id="accordionFlushExample">

        @foreach ($faqs as $index => $item)
        <div class="accordion-item mb-3">
            <h2 class="accordion-header">
                <button id="accordion-style" class="accordion-button ps-5 text-uppercase" type="button" data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapse{{$item->id}}" aria-expanded="true" aria-controls="panelsStayOpen-collapseOne">
                    {{$item->question}}
                </button>
            </h2>
            <div id="panelsStayOpen-collapse{{$item->id}}" class="accordion-collapse collapse {{ $index === 0 ? 'show' : '' }}">
                <div class="accordion-body bg-goldenrod p-5">
                    <p class="text-uppercase">{{$item->answer}}
                    </p>
                </div>
            </div>
        </div>
        @endforeach
        <!-- <div class="accordion-item mb-3">
            <h2 class="accordion-header">
                <button id="accordion-style" class="accordion-button ps-5" type="button" data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapseTwo" aria-expanded="true" aria-controls="panelsStayOpen-collapseOne">
                    LOREM IPSUM QUESTION?
                </button>
            </h2>
            <div id="panelsStayOpen-collapseTwo" class="accordion-collapse collapse ">
                <div class="accordion-body bg-goldenrod p-5">
                    <p class="text-uppercase">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
                        Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
                        Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
                        Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
                        Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
                    </p>
                </div>
            </div>
        </div>

        <div class="accordion-item mb-3">
            <h2 class="accordion-header">
                <button id="accordion-style" class="accordion-button ps-5" type="button" data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapseThree" aria-expanded="true" aria-controls="panelsStayOpen-collapseOne">
                    LOREM IPSUM QUESTION?
                </button>
            </h2>
            <div id="panelsStayOpen-collapseThree" class="accordion-collapse collapse ">
                <div class="accordion-body bg-goldenrod p-5">
                    <p class="text-uppercase">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
                        Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
                        Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
                        Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
                        Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
                    </p>
                </div>
            </div>
        </div>

        <div class="accordion-item mb-3">
            <h2 class="accordion-header">
                <button id="accordion-style" class="accordion-button ps-5" type="button" data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapseFour" aria-expanded="true" aria-controls="panelsStayOpen-collapseOne">
                    LOREM IPSUM QUESTION?
                </button>
            </h2>
            <div id="panelsStayOpen-collapseFour" class="accordion-collapse collapse ">
                <div class="accordion-body bg-goldenrod p-5">
                    <p class="text-uppercase">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
                        Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
                        Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
                        Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
                        Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
                    </p>
                </div>
            </div>
        </div>

        <div class="accordion-item mb-3">
            <h2 class="accordion-header">
                <button id="accordion-style" class="accordion-button ps-5" type="button" data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapseFive" aria-expanded="true" aria-controls="panelsStayOpen-collapseOne">
                    LOREM IPSUM QUESTION?
                </button>
            </h2>
            <div id="panelsStayOpen-collapseFive" class="accordion-collapse collapse ">
                <div class="accordion-body bg-goldenrod p-5">
                    <p class="text-uppercase">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
                        Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
                        Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
                        Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
                        Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
                    </p>
                </div>
            </div>
        </div> -->

    </div>
</div>

<style>
    .banner {
        background-image: url("{{ asset('images/banner-faqs.jpg') }}");
        background-position: center;
        background-size: cover;
        align-items: center;
        display: flex;
        height: 45vh;
        width: 100%;
    }
</style>
@endsection