@extends('layouts.default')
@section('content')
<section class="productSummary serviceSummary sectionSpac pb-0">
    <div class="container">
        <div class="row align-items-center">
            <div class="col-lg-6">
                <div class="sliderforProd mb-2">
                    <div class="productImage">
                        <img src="{{ asset('assets/images/prd1.png') }}" alt="product" class="serviceSummaryImg">
                    </div>
                    <div class="productImage">
                        <img src="{{ asset('assets/images/prd2.png') }}" alt="product" class="serviceSummaryImg">
                    </div>
                    <div class="productImage">
                        <img src="{{ asset('assets/images/product1.jpg') }}" alt="product" class="serviceSummaryImg">
                    </div>
                    <div class="productImage">
                        <img src="{{ asset('assets/images/product2.jpg') }}" alt="product" class="serviceSummaryImg">
                    </div>
                    <div class="productImage">
                        <img src="{{ asset('assets/images/product3.jpg') }}" alt="product" class="serviceSummaryImg">
                    </div>
                    <div class="productImage">
                        <img src="{{ asset('assets/images/product4.jpg') }}" alt="product" class="serviceSummaryImg">
                    </div>
                    <div class="productImage">
                        <img src="{{ asset('assets/images/prd1.png') }}" alt="product" class="serviceSummaryImg">
                    </div>
                </div>
                <div class="slidernavProd">
                    <div class="productImage">
                        <img src="{{ asset('assets/images/prd1.png') }}" alt="product">
                    </div>
                    <div class="productImage">
                        <img src="{{ asset('assets/images/prd2.png') }}" alt="product">
                    </div>
                    <div class="productImage">
                        <img src="{{ asset('assets/images/product1.jpg') }}" alt="product">
                    </div>
                    <div class="productImage">
                        <img src="{{ asset('assets/images/product2.jpg') }}" alt="product">
                    </div>
                    <div class="productImage">
                        <img src="{{ asset('assets/images/product3.jpg') }}" alt="product">
                    </div>
                    <div class="productImage">
                        <img src="{{ asset('assets/images/product4.jpg') }}" alt="product">
                    </div>
                    <div class="productImage">
                        <img src="{{ asset('assets/images/prd1.png') }}" alt="product">
                    </div>
                </div>
            </div>
            <div class="col-lg-6 py-4">
                <div class="row">
                    <div class="col-md-7">
                        <h2 class="productName mt-0">Customized Alloy Rim </h2>
                        <div class="my-4">
                            <div class="priceService">
                                <span class="salePrice me-4">$359.99</span>
                                <span class="regPrice">$450.00</span>
                            </div>
                        </div>
                        <div class="prodRating position-relative mb-3">
                            <div class="ratingStars">
                                <i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i>
                            </div>
                            <div class="ratingReviews">
                                (3 Reviews)<i class="ms-3 fa-solid fa-angle-down"></i>
                            </div>
                            <div class="ratingbyStars">
                                <div class="starRatingWrap d-flex align-items-center mb-3">
                                    <span class="ms-2">5 stars</span>
                                    <div class="progress w-100 ms-3 me-4" style="height: 4px;">
                                        <div class="progress-bar" role="progressbar" style="width: 70%" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100"></div>
                                    </div>
                                    <div class="ratingPercn">70%</div>
                                </div>
                                <div class="starRatingWrap d-flex align-items-center mb-3">
                                    <span class="ms-2">4 stars</span>
                                    <div class="progress w-100 ms-3 me-4" style="height: 4px;">
                                        <div class="progress-bar" role="progressbar" style="width: 95%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
                                    </div>
                                    <div class="ratingPercn">95%</div>
                                </div>
                                <div class="starRatingWrap d-flex align-items-center mb-3">
                                    <span class="ms-2">3 stars</span>
                                    <div class="progress w-100 ms-3 me-4" style="height: 4px;">
                                        <div class="progress-bar" role="progressbar" style="width: 8%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
                                    </div>
                                    <div class="ratingPercn">8%</div>
                                </div>
                                <div class="starRatingWrap d-flex align-items-center mb-3">
                                    <span class="ms-2">2 stars</span>
                                    <div class="progress w-100 ms-3 me-4" style="height: 4px;">
                                        <div class="progress-bar" role="progressbar" style="width: 55%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
                                    </div>
                                    <div class="ratingPercn">55%</div>
                                </div>
                                <div class="starRatingWrap d-flex align-items-center mb-3">
                                    <span class="ms-2">1 stars</span>
                                    <div class="progress w-100 ms-3 me-4" style="height: 4px;">
                                        <div class="progress-bar" role="progressbar" style="width: 15%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
                                    </div>
                                    <div class="ratingPercn">15%</div>
                                </div>
                            </div>
                        </div>
                        <div class="itemCat mb-2">Item Number:<span class="ms-2 itemcatNum">AUM58963</span></div>
                        <div class="itemCat mb-3">Category:<span class="ms-2 itemcatNum">Electronics</span></div>
                        <div class="singlePrdBtns mt-5">
                            <button class="btnMain w-100">Book An Order</button>
                        </div>
                    </div>
                    <div class="col-md-5">
                        <div class="buyerProtec d-flex mb-md-5 mb-4">
                                <img src="{{ asset('assets/images/buyerprot.png') }}" alt="buyer">
                                <div class="protText ms-2">
                                    <p class="mb-0 fw-bold buyerTitle">21 Day Buyer Protection</p>
                                    <a href="buyerprotection" target="_blank" class="mb-0">Money Back Guarantee<i class="fa-solid fa-angle-down ms-2"></i></a>
                                </div>
                            </div>
                            <div class="buyerProtec d-flex mb-4">
                                <img src="{{ asset('assets/images/shipping.png') }}" alt="shipping">
                                <div class="protText ms-2">
                                    <p class="mb-0 fw-bold buyerTitle">Free Shipping</p>
                                    <p>From Nigeria To United <br>
                                    Kingdom via Automobile<br>
                                    Standard Shipping.</p>
                                    <p class="shipdays mb-1">Estimated delivery: 40-50 Days</p>
                                    <a data-bs-toggle="modal" data-bs-target="#deliveryopt" class="mb-0 pointer">More Options<i class="fa-solid fa-angle-down ms-2"></i></a>
                                </div>
                            </div>
                            <a data-bs-toggle="modal" data-bs-target="#vehicleservice" class="btnMain pointer px-3 w-100">Vehicle Service Insurance</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
<section class="productsWrap productTabs servicewrap sectionSpac">
    <div class="container">
        <h3 class="sectionTitle mb-4"><span class="me-1">Frequently</span>Bought Together</h3>
        <div class="moreServices">
            <div class="subService py-3">
                <div class="subServiceWrap mx-3 d-flex align-items-center">
                    <img src="{{ asset('assets/images/moresvs.png') }}" alt="" class="imgSvs me-2">
                    <div class="svsCatWrap d-flex flex-column">
                        <span class="svsCat">Wheels & Rims</span>
                        <span class="svsCat svsName">Wheel Alignment</span>
                        <a href="subsvs" class="btnMain ">Details</a>
                    </div>
                </div>
            </div>
            <div class="subService py-3">
                <div class="subServiceWrap mx-3 d-flex align-items-center">
                    <img src="{{ asset('assets/images/moresvs.png') }}" alt="" class="imgSvs me-2">
                    <div class="svsCatWrap d-flex flex-column">
                        <span class="svsCat">Wheels & Rims</span>
                        <span class="svsCat svsName">Wheel Alignment</span>
                        <a href="subsvs" class="btnMain ">Details</a>
                    </div>
                </div>
            </div>
            <div class="subService py-3">
                <div class="subServiceWrap mx-3 d-flex align-items-center">
                    <img src="{{ asset('assets/images/moresvs.png') }}" alt="" class="imgSvs me-2">
                    <div class="svsCatWrap d-flex flex-column">
                        <span class="svsCat">Wheels & Rims</span>
                        <span class="svsCat svsName">Wheel Alignment</span>
                        <a href="subsvs" class="btnMain ">Details</a>
                    </div>
                </div>
            </div>
            <div class="subService py-3">
                <div class="subServiceWrap mx-3 d-flex align-items-center">
                    <img src="{{ asset('assets/images/moresvs.png') }}" alt="" class="imgSvs me-2">
                    <div class="svsCatWrap d-flex flex-column">
                        <span class="svsCat">Wheels & Rims</span>
                        <span class="svsCat svsName">Wheel Alignment</span>
                        <a href="subsvs" class="btnMain ">Details</a>
                    </div>
                </div>
            </div>
            <div class="subService py-3">
                <div class="subServiceWrap mx-3 d-flex align-items-center">
                    <img src="{{ asset('assets/images/moresvs.png') }}" alt="" class="imgSvs me-2">
                    <div class="svsCatWrap d-flex flex-column">
                        <span class="svsCat">Wheels & Rims</span>
                        <span class="svsCat svsName">Wheel Alignment</span>
                        <a href="subsvs" class="btnMain ">Details</a>
                    </div>
                </div>
            </div>
        </div>
        <ul class="nav nav-pills mt-5 mb-4" id="pills-tab" role="tablist">
            <li class="nav-item" role="presentation">
                <button class="nav-link active" id="pills-Descriptions-tab" data-bs-toggle="pill" data-bs-target="#pills-Descriptions" type="button" role="tab" aria-controls="pills-Descriptions" aria-selected="true">Descriptions</button>
            </li>
            <li class="nav-item" role="presentation">
                <button class="nav-link" id="pills-Reviews-tab" data-bs-toggle="pill" data-bs-target="#pills-Reviews" type="button" role="tab" aria-controls="pills-Reviews" aria-selected="false">Customer's Reviews (21)</button>
            </li>
        </ul>
        <div class="tab-content" id="pills-tabContent">
            <div class="tab-pane fade show active" id="pills-Descriptions" role="tabpanel" aria-labelledby="pills-Descriptions-tab">
            <p class="svsText lh-lg mb-3">Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis amet voluptas assumenda est, omnis dolor repellendus quis nostrum. Temporibus autem quibusdam et aut officiis debitis aut rerum dolorem necessitatibus saepe eveniet ut et neque porro quisquam est, qui Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis amet voluptas assumenda est, omnis dolor repellendus quis nostrum. Temporibus autem quibusdam et aut officiis debitis aut rerum dolorem necessitatibus saepe eveniet ut et neque porro quisquam est, qui...</p>
            <p class="svsText lh-lg">Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis amet voluptas assumenda est, omnis dolor repellendus quis nostrum. Temporibus autem quibusdam et aut officiis debitis aut rerum dolorem necessitatibus saepe eveniet ut et neque porro quisquam est, qui Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis amet voluptas assumenda est, omnis dolor repellendus quis nostrum. Temporibus autem quibusdam et aut officiis debitis aut rerum dolorem necessitatibus saepe eveniet ut et neque porro quisquam est, qui...</p>
            </div>
            <div class="tab-pane fade" id="pills-Reviews" role="tabpanel" aria-labelledby="pills-Reviews-tab">
                <div class="d-flex mb-4">
                    <div class="reviewImg me-4"><img src="{{ asset('assets/images/avatar.png') }}" alt="avatar"></div>
                    <div class="reviewContent">
                        <div class="d-flex mb-2">
                            <span class="ratingStars me-3">
                                <i class="fa-solid fa-star" style="color: #FDA800"></i><i class="fa-solid fa-star" style="color: #FDA800"></i><i class="fa-solid fa-star" style="color: #FDA800"></i><i class="fa-solid fa-star" style="color: #FDA800"></i><i class="fa-solid fa-star" style="color: #FDA800"></i>
                            </span>
                            <span class="reviewName me-4">Cobus Bester</span>
                            <span class="reviewDate">- June 7, 2021</span>
                        </div>
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing 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 </p>
                    </div>
                </div>
                <div class="d-flex mb-4">
                    <div class="reviewImg me-3"><img src="{{ asset('assets/images/avatar.png') }}" alt="avatar"></div>
                    <div class="reviewContent">
                        <div class="d-flex mb-2">
                            <span class="ratingStars me-3">
                                <i class="fa-solid fa-star" style="color: #FDA800"></i><i class="fa-solid fa-star" style="color: #FDA800"></i><i class="fa-solid fa-star" style="color: #FDA800"></i><i class="fa-solid fa-star" style="color: #FDA800"></i><i class="fa-solid fa-star" style="color: #FDA800"></i>
                            </span>
                            <span class="reviewName me-4">Cobus Bester</span>
                            <span class="reviewDate">- June 7, 2021</span>
                        </div>
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing 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 </p>
                    </div>
                </div>
            </div>
        </div>
        <div class="row mt-md-5 mt-4">
            <div class="col-lg-4 col-md-6 mb-4">
                <div class="serviceCenter d-flex align-items-center">
                    <img src="{{ asset('assets/images/intercar.png') }}" alt="" class="imgSvs me-4">
                    <div class="svsCenterContent">
                        <p class="svsTitleCnt mb-2">Instant Car Services</p>
                        <p class="svsDesc mb-0">Maintain wireless scerios after sure quality vectors future</p>
                    </div>
                </div>
            </div>
            <div class="col-lg-4 col-md-6 mb-4">
                <div class="serviceCenter d-flex align-items-center">
                    <img src="{{ asset('assets/images/intreqs.png') }}" alt="" class="imgSvs me-4">
                    <div class="svsCenterContent">
                        <p class="svsTitleCnt mb-2">24/7 Quality Service</p>
                        <p class="svsDesc mb-0">Maintain wireless scerios after sure quality vectors future</p>
                    </div>
                </div>
            </div>
            <div class="col-lg-4 col-md-6 mb-4">
                <div class="serviceCenter d-flex align-items-center">
                    <img src="{{ asset('assets/images/intercost.png') }}" alt="" class="imgSvs me-4">
                    <div class="svsCenterContent">
                        <p class="svsTitleCnt mb-2">Quality Cost Service</p>
                        <p class="svsDesc mb-0">Maintain wireless scerios after sure quality vectors future</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
<section class="servicesAdvrt mt-5">
    <div class="container">
        <div class="row productList serviceList">
                    <div class="singlePrdList gridviewprd col-lg-6 mb-4">
                        <div class="homePrdWrap">
                            <a href="singleproduct" target="_blank" class="overflow-hidden d-block prodimgWrap">
                                <img src="{{ asset('assets/images/product4.jpg') }}" alt="item" class="producths">
                            </a>
                            <div class="productDet p-4">
                                <span class="prodCat mb-1">Wheels & Rims</span>
                                <p class="mb-2 prodTitle fw-bold">Customized Alloy Rim </p>
                                <p class="listText">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna</p>
                            </div>
                        </div>
                    </div>
                    <!-- end of product div -->
                    <div class="singlePrdList gridviewprd col-lg-6 mb-4">
                        <div class="homePrdWrap">
                            <a href="singleproduct" target="_blank" class="overflow-hidden d-block prodimgWrap">
                                <img src="{{ asset('assets/images/product4.jpg') }}" alt="item" class="producths">
                            </a>
                            <div class="productDet p-4">
                                <span class="prodCat mb-1">Wheels & Rims</span>
                                <p class="mb-2 prodTitle fw-bold">Customized Alloy Rim </p>
                                <p class="listText">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna</p>
                            </div>
                        </div>
                    </div>
                    <!-- end of product div -->
                    <div class="singlePrdList gridviewprd col-lg-6 mb-4">
                        <div class="homePrdWrap">
                            <a href="singleproduct" target="_blank" class="overflow-hidden d-block prodimgWrap">
                                <img src="{{ asset('assets/images/product4.jpg') }}" alt="item" class="producths">
                            </a>
                            <div class="productDet p-4">
                                <span class="prodCat mb-1">Wheels & Rims</span>
                                <p class="mb-2 prodTitle fw-bold">Customized Alloy Rim </p>
                                <p class="listText">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna</p>
                            </div>
                        </div>
                    </div>
                    <!-- end of product div -->
                    <div class="singlePrdList gridviewprd col-lg-6 mb-4">
                        <div class="homePrdWrap">
                            <a href="singleproduct" target="_blank" class="overflow-hidden d-block prodimgWrap">
                                <img src="{{ asset('assets/images/product4.jpg') }}" alt="item" class="producths">
                            </a>
                            <div class="productDet p-4">
                                <span class="prodCat mb-1">Wheels & Rims</span>
                                <p class="mb-2 prodTitle fw-bold">Customized Alloy Rim </p>
                                <p class="listText">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna</p>
                            </div>
                        </div>
                    </div>
                    <!-- end of product div -->
        </div>
    </div>
</section>
<section class="productsWrap mt-5">
    <div class="container">
        <h3 class="sectionTitle mb-4"><span class="me-1">Recommended</span>services</h3>
        <div class="row productList pt-2">
            <div class="singlePrdList col-lg-3 col-md-6 mb-4">
                <div class="homePrdWrap">
                    <a href="singleproduct" target="_blank" class="overflow-hidden d-block prodimgWrap">
                        <img src="{{ asset('assets/images/product4.jpg') }}" alt="item" class="producths">
                    </a>
                    <div class="productDet p-4">
                        <span class="prodCat mb-1">Filters</span>
                        <p class="mb-2 prodName">Premium Quality Air Filters</p>
                        <div class="prodRating mb-3">
                            <div class="ratingStars">
                                <i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i>
                            </div>
                            <div class="ratingReviews">
                                (3 Reviews)
                            </div>
                        </div>
                        <p class="listText d-none">Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis amet voluptas assumenda est, omnis dolor repellendus quis nostrum. Temporibus autem quibusdam et aut officiis debitis aut rerum dolorem necessitatibus saepe eveniet ut et neque porro quisquam est, qui...</p>
                    <p class="productPrice mb-3">
                            <span class="d-inline-block me-2">Price:</span>$89.00
                        </p>
                        <button data-bs-toggle="modal" data-bs-target="#cartModal" class="btnMain w-100">Add To Cat</button>
                    </div>
                </div>
            </div>
            <!-- end of product div -->
            <div class="singlePrdList col-lg-3 col-md-6 mb-4">
                <div class="homePrdWrap">
                    <a href="singleproduct" target="_blank" class="overflow-hidden d-block prodimgWrap">
                        <img src="{{ asset('assets/images/product3.jpg') }}" alt="item" class="producths">
                    </a>
                    <div class="productDet p-4">
                        <span class="prodCat mb-1">Filters</span>
                        <p class="mb-2 prodName">Premium Quality Air Filters</p>
                        <div class="prodRating mb-3">
                            <div class="ratingStars">
                                <i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i>
                            </div>
                            <div class="ratingReviews">
                                (3 Reviews)
                            </div>
                        </div>
                        <p class="listText d-none">Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis amet voluptas assumenda est, omnis dolor repellendus quis nostrum. Temporibus autem quibusdam et aut officiis debitis aut rerum dolorem necessitatibus saepe eveniet ut et neque porro quisquam est, qui...</p>
                    <p class="productPrice mb-3">
                            <span class="d-inline-block me-2">Price:</span>$89.00
                        </p>
                        <button data-bs-toggle="modal" data-bs-target="#cartModal" class="btnMain w-100">Add To Cat</button>
                    </div>
                </div>
            </div>
            <!-- end of product div -->
            <div class="singlePrdList col-lg-3 col-md-6 mb-4">
                <div class="homePrdWrap">
                    <a href="singleproduct" target="_blank" class="overflow-hidden d-block prodimgWrap">
                        <img src="{{ asset('assets/images/product1.jpg') }}" alt="item" class="producths">
                    </a>
                    <div class="productDet p-4">
                        <span class="prodCat mb-1">Filters</span>
                        <p class="mb-2 prodName">Premium Quality Air Filters</p>
                        <div class="prodRating mb-3">
                            <div class="ratingStars">
                                <i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i>
                            </div>
                            <div class="ratingReviews">
                                (3 Reviews)
                            </div>
                        </div>
                        <p class="listText d-none">Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis amet voluptas assumenda est, omnis dolor repellendus quis nostrum. Temporibus autem quibusdam et aut officiis debitis aut rerum dolorem necessitatibus saepe eveniet ut et neque porro quisquam est, qui...</p>
                    <p class="productPrice mb-3">
                            <span class="d-inline-block me-2">Price:</span>$89.00
                        </p>
                        <button data-bs-toggle="modal" data-bs-target="#cartModal" class="btnMain w-100">Add To Cat</button>
                    </div>
                </div>
            </div>
            <!-- end of product div -->
            <div class="singlePrdList col-lg-3 col-md-6 mb-4">
                <div class="homePrdWrap">
                    <a href="singleproduct" target="_blank" class="overflow-hidden d-block prodimgWrap">
                        <img src="{{ asset('assets/images/product2.jpg') }}" alt="item" class="producths">
                    </a>
                    <div class="productDet p-4">
                        <span class="prodCat mb-1">Filters</span>
                        <p class="mb-2 prodName">Premium Quality Air Filters</p>
                        <div class="prodRating mb-3">
                            <div class="ratingStars">
                                <i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i>
                            </div>
                            <div class="ratingReviews">
                                (3 Reviews)
                            </div>
                        </div>
                        <p class="listText d-none">Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis amet voluptas assumenda est, omnis dolor repellendus quis nostrum. Temporibus autem quibusdam et aut officiis debitis aut rerum dolorem necessitatibus saepe eveniet ut et neque porro quisquam est, qui...</p>
                    <p class="productPrice mb-3">
                            <span class="d-inline-block me-2">Price:</span>$89.00
                        </p>
                        <button data-bs-toggle="modal" data-bs-target="#cartModal" class="btnMain w-100">Add To Cat</button>
                    </div>
                </div>
            </div>
            <!-- end of product div -->
        </div>
    </div>
</section>
@endsection