@extends('frontend.layouts.app')

@section('content')
<style>
header .navbar {
    background: #1a1a1a !important;
    padding-top: 10px;
}

.about {
    padding: 200px 0;
}

.about::after {
    width: 70%;
    height: 88%;
    top: 8%;
}

.services2 {
    padding: 65px 0 120px !important;
}

.services2::after {
    left: -9%;
    height: 92%;
    top: 1%;
}
.dawn .h-100::before{
    content:'';
    position: absolute;
    inset: 0;
    background-color: rgb(0 0 0 / 15%)
}
</style>
<main>

    <section class="banner bannercon">
        <div class="main-slide">
            <div class="dawn">
                <div class="h-100 position-relative">
                    <img src="{{asset('assets/front/images/log12.jpg')}}" class="img-fluid banner-img" alt="">
                    <div class="container h-100">
                        <div class="row h-100">
                            <div class="banner-slider">
                                <div class="content" data-aos="fade-right" data-aos-duration="1500">
                                    <h3>Membership</h3>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <section class="member services2">
        <div class="container">
            <div class="row gy-4">
                <div class="col-12 col-lg-4">
                    <div class="boxi" data-aos="fade-right"  data-aos-duration="1500">
                        <ul class="fisrt">
                            <li>
                                <h3>Basic</h3>
                                <p>Clasic Plan</p>
                            </li>
                            <li>
                                <h3>1</h3>
                            </li>
                        </ul>
                        <div class="include">
                            <ul>
                                <li><i class="fa-solid fa-check"></i>
                                    <h5>Lorem Ipsum is simply dummy</h5>
                                </li>
                                <li><i class="fa-solid fa-check"></i>
                                    <h5>Lorem Ipsum is simply dummy</h5>
                                </li>
                                <li><i class="fa-solid fa-check"></i>
                                    <h5>Lorem Ipsum is simply dummy</h5>
                                </li>
                                <li><i class="fa-solid fa-check"></i>
                                    <h5>Lorem Ipsum is simply dummy</h5>
                                </li>
                            </ul>
                            <div class="text-center hoz">
                                <h2>$100</h2>
                                <p>Per Month</p>
                            </div>
                            <div class="btn-div text-center">
                                <form action="{{ route('checkUser') }}" method="post">
                                    @csrf
                                    <input type="hidden" name="basic" value="https://buy.stripe.com/test_dR6bJa43UeR78M05kk?payment_intent=pi_1234567890">
                                    <button type="submit" class="btn banner_btn bckclr">Subscribe now</button>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-12 col-lg-4">
                    <div class="boxi" data-aos="zoom-out-down" data-aos-duration="1500">
                        <ul class="fisrt">
                            <li>
                                <h3>Standard</h3>
                                <p>Clasic Plan</p>
                            </li>
                            <li>
                                <h3>2</h3>
                            </li>
                        </ul>
                        <div class="include">
                            <ul>
                                <li><i class="fa-solid fa-check"></i>
                                    <h5>Lorem Ipsum is simply dummy</h5>
                                </li>
                                <li><i class="fa-solid fa-check"></i>
                                    <h5>Lorem Ipsum is simply dummy</h5>
                                </li>
                                <li><i class="fa-solid fa-check"></i>
                                    <h5>Lorem Ipsum is simply dummy</h5>
                                </li>
                                <li><i class="fa-solid fa-check"></i>
                                    <h5>Lorem Ipsum is simply dummy</h5>
                                </li>
                            </ul>
                            <div class="text-center hoz">
                                <h2>$500</h2>
                                <p>Per Month with Discount</p>
                            </div>
                            <div class="btn-div text-center">
                                <form action="{{ route('checkUser') }}" method="post">
                                    @csrf
                                    <input type="hidden" name="standard" value="https://buy.stripe.com/test_00g4gI8ka24l5zOcMO">
                                    <button type="submit" class="btn banner_btn bckclr">Subscribe now</button>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-12 col-lg-4">
                    <div class="boxi" data-aos="fade-left"  data-aos-duration="1500">
                        <ul class="fisrt">
                            <li>
                                <h3>Premium</h3>
                                <p>Clasic Plan</p>
                            </li>
                            <li>
                                <h3>3</h3>
                            </li>
                        </ul>
                        <div class="include">
                            <ul>
                                <li><i class="fa-solid fa-check"></i>
                                    <h5>Lorem Ipsum is simply dummy</h5>
                                </li>
                                <li><i class="fa-solid fa-check"></i>
                                    <h5>Lorem Ipsum is simply dummy</h5>
                                </li>
                                <li><i class="fa-solid fa-check"></i>
                                    <h5>Lorem Ipsum is simply dummy</h5>
                                </li>
                                <li><i class="fa-solid fa-check"></i>
                                    <h5>Lorem Ipsum is simply dummy</h5>
                                </li>
                            </ul>
                            <div class="text-center hoz">
                                <h2>$3,000</h2>
                                <p>Life Time Access</p>
                            </div>
                            <div class="btn-div text-center">
                                <form action="{{ route('checkUser') }}" method="post">
                                    @csrf
                                    <input type="hidden" name="premium" value="https://buy.stripe.com/test_7sI6oQ8kabEV2nC4gh">
                                    <button type="submit" class="btn banner_btn bckclr">Subscribe now</button>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>



</main>

@endsection