@extends('layout.front.main')
@section('content')
    <!-- About Banner Section Start -->
    {{-- <section class="d2c_entro_launch_bg">
        <div class="px-4 py-5 my-5 text-center">
            <img class="" src="{{ asset('') }}template/assets/img/logo.png" alt="" style="width: 5%">
            <h1 class="display-5 fw-bold">Merjay</h1>
            <div class="col-lg-6 mx-auto">
            </div>
        </div>
    </section> --}}
    <!-- About Banner Section End -->

    <!-- About Me Section Start -->
    <section class="d2c_about_me_wrapper">
        <div class="container">
            <div class="row">
                <div class="col-12 col-lg-6">
                    <h4>Tentang</h4>
                    <h2>Merjay Jeep Merapi</h2>
                    <p>Perjalanan MERJAY dimulai dari kecintaan terhadap alam dan
                        keinginan untuk menghadirkan pengalaman berkendara
                        yang tak terlupakan di jalur berbatu, pasir vulkanik, hingga
                        aliran sungai di kaki Gunung Merapi. Dengan semangat
                        petualangan tanpa batas, MERJAY hadir untuk membawa
                        setiap pengunjung lebih dekat dengan keindahan , sejarah
                        dan keunikan lanskap Merapi.</p>
                </div>
                <div class="col-12 col-lg-6">
                    <img src="{{ asset('') }}template/assets/images/about_me_img.jpg" class="w-100 h-100"
                        alt="About Me Image">
                </div>
            </div>
        </div>
    </section>
    <!-- About Me Section End -->

    <!-- About Mission Section Start -->
    <section class="d2c_mission_wrapper d2c_props_bg position-relative">
        <div class="container">
            <div class="d2c_content_container pe-4">
                <h2>Partner Berpetualang Kebanggan Pelanggan di Indonesia</h2>
            </div>
            <div class="row">
                <style>
                    .testimonial-card {
                        border: 1px solid #ddd;
                        padding: 20px;
                        border-radius: 10px;
                        text-align: center;
                    }

                    .testimonial-card img {
                        width: 100px;
                        height: 100px;
                        border-radius: 50%;
                        object-fit: cover;
                        margin-bottom: 15px;
                    }

                    .star-rating {
                        color: #FFD700;
                    }
                </style>
                <div class="col-6 col-lg-3 mb-3">
                    <div class="testimonial-card">
                        <img src="{{ asset('') }}template/assets/images/about_me_img.jpg" alt="Testimonial Photo">
                        <h5 class="mb-3">John Doe</h5>
                        <p>"Merjay Jeep Merapi is an amazing experience! The trip was smooth and well-organized. Highly
                            recommended!"</p>
                        <div class="star-rating">
                            <span>&#9733;</span>
                            <span>&#9733;</span>
                            <span>&#9733;</span>
                            <span>&#9733;</span>
                            <span>&#9734;</span>
                        </div>
                    </div>
                </div>
                <div class="col-6 col-lg-3 mb-3">
                    <div class="testimonial-card">
                        <img src="{{ asset('') }}template/assets/images/about_me_img.jpg" alt="Testimonial Photo">
                        <h5 class="mb-3">John Doe</h5>
                        <p>"Merjay Jeep Merapi is an amazing experience! The trip was smooth and well-organized. Highly
                            recommended!"</p>
                        <div class="star-rating">
                            <span>&#9733;</span>
                            <span>&#9733;</span>
                            <span>&#9733;</span>
                            <span>&#9733;</span>
                            <span>&#9734;</span>
                        </div>
                    </div>
                </div>
                <div class="col-6 col-lg-3 mb-3">
                    <div class="testimonial-card">
                        <img src="{{ asset('') }}template/assets/images/about_me_img.jpg" alt="Testimonial Photo">
                        <h5 class="mb-3">John Doe</h5>
                        <p>"Merjay Jeep Merapi is an amazing experience! The trip was smooth and well-organized. Highly
                            recommended!"</p>
                        <div class="star-rating">
                            <span>&#9733;</span>
                            <span>&#9733;</span>
                            <span>&#9733;</span>
                            <span>&#9733;</span>
                            <span>&#9734;</span>
                        </div>
                    </div>
                </div>
                <div class="col-6 col-lg-3 mb-3">
                    <div class="testimonial-card">
                        <img src="{{ asset('') }}template/assets/images/about_me_img.jpg" alt="Testimonial Photo">
                        <h5 class="mb-3">John Doe</h5>
                        <p>"Merjay Jeep Merapi is an amazing experience! The trip was smooth and well-organized. Highly
                            recommended!"</p>
                        <div class="star-rating">
                            <span>&#9733;</span>
                            <span>&#9733;</span>
                            <span>&#9733;</span>
                            <span>&#9733;</span>
                            <span>&#9734;</span>
                        </div>
                    </div>
                </div>
                <div class="col-6 col-lg-3 mb-3">
                    <div class="testimonial-card">
                        <img src="{{ asset('') }}template/assets/images/about_me_img.jpg" alt="Testimonial Photo">
                        <h5 class="mb-3">John Doe</h5>
                        <p>"Merjay Jeep Merapi is an amazing experience! The trip was smooth and well-organized. Highly
                            recommended!"</p>
                        <div class="star-rating">
                            <span>&#9733;</span>
                            <span>&#9733;</span>
                            <span>&#9733;</span>
                            <span>&#9733;</span>
                            <span>&#9734;</span>
                        </div>
                    </div>
                </div>
                <div class="col-6 col-lg-3 mb-3">
                    <div class="testimonial-card">
                        <img src="{{ asset('') }}template/assets/images/about_me_img.jpg" alt="Testimonial Photo">
                        <h5 class="mb-3">John Doe</h5>
                        <p>"Merjay Jeep Merapi is an amazing experience! The trip was smooth and well-organized. Highly
                            recommended!"</p>
                        <div class="star-rating">
                            <span>&#9733;</span>
                            <span>&#9733;</span>
                            <span>&#9733;</span>
                            <span>&#9733;</span>
                            <span>&#9734;</span>
                        </div>
                    </div>
                </div>
                <div class="col-6 col-lg-3 mb-3">
                    <div class="testimonial-card">
                        <img src="{{ asset('') }}template/assets/images/about_me_img.jpg" alt="Testimonial Photo">
                        <h5 class="mb-3">John Doe</h5>
                        <p>"Merjay Jeep Merapi is an amazing experience! The trip was smooth and well-organized. Highly
                            recommended!"</p>
                        <div class="star-rating">
                            <span>&#9733;</span>
                            <span>&#9733;</span>
                            <span>&#9733;</span>
                            <span>&#9733;</span>
                            <span>&#9734;</span>
                        </div>
                    </div>
                </div>
                <div class="col-6 col-lg-3 mb-3">
                    <div class="testimonial-card">
                        <img src="{{ asset('') }}template/assets/images/about_me_img.jpg" alt="Testimonial Photo">
                        <h5 class="mb-3">John Doe</h5>
                        <p>"Merjay Jeep Merapi is an amazing experience! The trip was smooth and well-organized. Highly
                            recommended!"</p>
                        <div class="star-rating">
                            <span>&#9733;</span>
                            <span>&#9733;</span>
                            <span>&#9733;</span>
                            <span>&#9733;</span>
                            <span>&#9734;</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- About Mission Section End -->

    <section class="d2c_pricing_wrapper">
        <div class="container">
            <div class="row">
                <div class="col-lg-8 offset-lg-2 text-center">
                    {{-- <h4 class="d2c_sub_title">Pricing</h4> --}}
                    <h2 class="d2c_title" style="color: #133e87">Pilih Paket Wisata Terbaik</h2>
                    <p class="d2c_title_content">Coba paket wisata kami sekarang. Tidak puas? ada jaminan uang kembali</p>
                </div>
                <div class="row">
                    <div class="col-12 col-md-6 col-lg-3 mb-2">
                        <div class="price-card">
                            <div class="text-center">
                                <h3>Short</h3>
                                <p class="text-muted">Pilihan terbaik untuk pengalaman pertama anda !</p>
                                {{-- <div class="price-original">Rp 89.900</div>
                                <div class="discount-badge">DISKON 86%</div> --}}
                                <div class="price-current">
                                    Rp 400.000
                                </div>
                            </div>
                            <button class="btn-select">Pilih Paket</button>
                            {{-- <div class="renewal-price">Rp 29.900/bln saat perpanjang layanan</div> --}}
                            <ul class="feature-list">
                                <li>Durasi 1.5 - 2 Jam</li>
                                <li>Pilih Jeepmu Sendiri</li>
                                <li>Gratis Ubah Jadwal</li>
                                <li>Jelajahi 3 Wisata</li>
                                <li>Private Guide</li>
                                <li>Dokumentasi Group</li>
                                <li>Kapasitas 4 Orang</li>
                                <li>Asuransi</li>
                            </ul>
                        </div>
                    </div>

                    <div class="col-12 col-md-6 col-lg-3 mb-2">
                        <div class="price-card highlight">
                            <div class="text-center">
                                <div class="popular-badge">PALING LARIS!</div>
                                <h3>Medium</h3>
                                <p class="text-muted">Cocok untuk kamu yang mencari petualangan seru</p>
                                {{-- <div class="price-original">Rp 119.000</div>
                                <div class="discount-badge">DISKON 80%</div> --}}
                                <div class="price-current">
                                    Rp 500.000
                                </div>
                            </div>
                            <button class="btn-select">Pilih Paket</button>
                            {{-- <div class="bonus-text">+3 bulan gratis</div> --}}
                            {{-- <div class="renewal-price">Rp 49.900/bln saat perpanjang layanan</div> --}}
                            <ul class="feature-list">
                                <li>Durasi 2 - 2.5 Jam</li>
                                <li>Pilih Jeepmu Sendiri</li>
                                <li>Gratis Ubah Jadwal</li>
                                <li>Jelajahi 4 Wisata</li>
                                <li>Private Guide</li>
                                <li>Dokumentasi Group</li>
                                <li>Kapasitas 4 Orang</li>
                                <li>Asuransi</li>
                            </ul>
                        </div>
                    </div>

                    <div class="col-12 col-md-6 col-lg-3 mb-2">
                        <div class="price-card">
                            <div class="text-center">
                                <h3>Long</h3>
                                <p class="text-muted">Paket lengkap untuk seluruh wisata Jeep Merapi</p>
                                {{-- <div class="price-original">Rp 139.900</div>
                                <div class="discount-badge">DISKON 69%</div> --}}
                                <div class="price-current">
                                    Rp 600.000
                                </div>
                            </div>
                            <button class="btn-select">Pilih Paket</button>
                            {{-- <div class="bonus-text">+3 bulan gratis</div> --}}
                            {{-- <div class="renewal-price">Rp 93.900/bln saat perpanjang layanan</div> --}}
                            <ul class="feature-list">
                                <li>Durasi 3 - 3.5 Jam</li>
                                <li>Pilih Jeepmu Sendiri</li>
                                <li>Gratis Ubah Jadwal</li>
                                <li>Jelajahi 5 Wisata</li>
                                <li>Private Guide</li>
                                <li>Dokumentasi Group</li>
                                <li>Kapasitas 4 Orang</li>
                                <li>Asuransi</li>
                            </ul>
                        </div>
                    </div>

                    <div class="col-12 col-md-6 col-lg-3 mb-2">
                        <div class="price-card">
                            <div class="text-center">
                                <h3>Sunrise</h3>
                                <p class="text-muted">Nikmati pengalaman langka untuk petualanganmu</p>
                                {{-- <div class="price-original">Rp 312.900</div>
                                <div class="discount-badge">DISKON 59%</div> --}}
                                <div class="price-current">
                                    Rp 500.000
                                </div>
                            </div>
                            <button class="btn-select">Pilih Paket</button>
                            {{-- <div class="bonus-text">+3 bulan gratis</div> --}}
                            {{-- <div class="renewal-price">Rp 235.900/bln saat perpanjang layanan</div> --}}
                            <ul class="feature-list">
                                <li>Durasi 3 - 3.5 Jam</li>
                                <li>Pilih Jeepmu Sendiri</li>
                                <li>Gratis Ubah Jadwal</li>
                                <li>Jelajahi 4 Wisata</li>
                                <li>Private Guide</li>
                                <li>Dokumentasi Group</li>
                                <li>Kapasitas 4 Orang</li>
                                <li>Asuransi</li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- Counter Section Start -->
    {{-- <section class="d2c_counter_wrapper">
        <div class="container">
            <div class="row">
                <div class="col-6 col-lg-3 text-center mb-4 mb-lg-0">
                    <div class="d2c_counter">
                        <h2><span class="count">15</span></h2>
                        <h4 class="mb-0">Years of experience</h4>
                    </div>
                </div>
                <div class="col-6 col-lg-3 text-center mb-4 mb-md-0">
                    <div class="d2c_counter d2c_border">
                        <h2><span class="count">1250</span>+</h2>
                        <h4 class="mb-0">Happy Clients</h4>
                    </div>
                </div>
                <div class="col-6 col-lg-3 text-center">
                    <div class="d2c_counter">
                        <h2><span class="count">1</span>k+</h2>
                        <h4 class="mb-0">Project Done</h4>
                    </div>
                </div>
                <div class="col-6 col-lg-3 text-center">
                    <div class="d2c_counter">
                        <h2><span class="count">100</span>+</h2>
                        <h4 class="mb-0">Giving Consultancy</h4>
                    </div>
                </div>
            </div>
        </div>
    </section> --}}
    <!-- Counter Section End -->
@endsection