@extends('layouts.master')

@section('content')
    <!-- Start of page header -->
<!--     <div class="personal-bgimg">
        <div class="container">
            <div class="row">
                <div class="col-md-12 text-center">
                    <h2 style="color: #f26c25;font-weight: bold;font-size: 35px;">National Pension Scheme</h2>
                    <nav aria-label="breadcrumb">
                        <ol class="breadcrumb">
                            <li class="breadcrumb-item active" aria-current="page" style="font-size: 20px;">Invest for retirement and save immensely in taxes every year</li>
                        </ol>
                    </nav>
                </div>
            </div>
        </div>
    </div> -->
    <!-- end of page header -->
    <div class="container text-center" id="mob-head">
        <h1><b style="color: #f26c25;">National Pension Scheme</b></h1>
    </div>
    <section class="section-padding banner-section" style="background-image: url('asset/img/nps.jpg')">
        <div class="container">
            <section class="section-padding" style="padding-top: 25px; padding-bottom: 25px;">
                <div class="container">
                    <div class="row">
                        <div class="col-md-12 d-none">    
                            <h2 style="text-align: center; font-size: 30px; color: #f26c25;"><b>Make a massive difference by making a systematic investment to your life post retirement.</b></h2>
                        </div>
                    </div>
                </div>
            </section>
            <div class="col-md-12">
                <div class="row">
                    <div class="col-md-6">

                    <div class="how-it-work-content">

                        <h2 style="font-size: 25px;">Lower risk and worlds cheapest retirement plan.</h2>

                    </div><br>
                    
                        <div class="choose-img">
                            <img src="asset/img/NPS.png" alt="">
                        </div>
                    </div>
                    <div class="col-md-6">
                    
                    <div class="how-it-work-content">
                        <h4><b>Let us help you Invest in NPS.</b></h4><br>
                    </div>
                        <div class="get-in-touch">
                            @include('forms.nps')
                        </div>
                    </div>
                </div>
                <br>
            </div>
        </div>
    </section>

    <!-- start second about area -->
    <section class="second-about-area section-padding">
        <div class="container">
            <div class="row">
                <div class="col-md-12 text-center">
                    <div class="section-title">
                        <h2 style="font-size: 30px;" class="text-center">National Pension Scheme with Vizza FinTech</h2>
                    </div>
                </div>
            </div>
            <div class="row justify-content-between">
                <div class="col-md-6">
                    <div class="second-about-content">
                        <h3><b>Do you want to have a Low Risk Appetite by Investing in NPS?</b></h3>
                        <br>
                        <a href="{{route('nps.add')}}" target="_blank" class="btn btn-default btn-sm">Apply Now</a>
                    </div>
                </div>
                <div class="col-md-6 col-lg-6">
                    <div class="about-cradit-list">
                        <ul>
                            <li> Risk Assessment offered</li>
                            <li> Low Cost structure</li>
                            <li> High Returns/Interest </li>
                            <li> Higher NPS Tax Benefit</li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- end of second about area -->

    <section class="services-page ">
        <div class="container">
            <div class="row">
                <div class="col-md-8 col-lg-12">
                    <div class="services-details ">
                        <ul class="nav nav-tabs" id="myTab" role="tablist">
                            <li class="nav-item">
                                <a class="nav-link active" id="inspections-tab" data-toggle="tab" href="#inspections" role="tab" aria-controls="inspections" aria-selected="true">Feature</a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" id="mortgage-tab" data-toggle="tab" href="#mortgage" role="tab" aria-controls="mortgage" aria-selected="false">Eligibility</a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" id="overspending-tab" data-toggle="tab" href="#overspending" role="tab" aria-controls="overspending" aria-selected="false">Benefits</a>
                            </li>
                        </ul>
                        <div class="tab-content" id="myTabContent">
                            <div class="tab-pane fade show active" id="inspections" role="tabpanel" aria-labelledby="inspections-tab">
                                <p><i class="fa fa-dot-circle-o" aria-hidden="true"></i> Portability – NPS does not have any physical boundaries. An account opened in any state of India can be accessed from all over the nation. NPS business account is transferable between employers.</p>
                                <p><i class="fa fa-dot-circle-o" aria-hidden="true"></i> Flexibility – NPS gives the subscriber the elasticity to choose the Fund Manager, Investment Option, Annuity Service Provider, etc. This gives you the control over your savings.</p>
                                <p><i class="fa fa-dot-circle-o" aria-hidden="true"></i> Cost-Effective – NPS is presently one of the cheapest investment products available.</p>
                                <p><i class="fa fa-dot-circle-o" aria-hidden="true"></i> Voluntary – NPS is voluntary product for citizens of India. Only for central and state Government employees, NPS is compulsory under the permanent contribution plan.</p>
                            </div>
                            <div class="tab-pane fade" id="mortgage" role="tabpanel" aria-labelledby="mortgage-tab">
                                <p> Subscriber can register for NPS via the online application way from the handiness of their house / place of work. The major purpose of the scheme is to provide all citizens of India with an lucrative long term savings to plan for retirement through secure and practical market based returns. The account can be opened by all Indian Citizens between 18 to 60 Years.</p>
                            </div>
                            <div class="tab-pane fade" id="overspending" role="tabpanel" aria-labelledby="overspending-tab">
                                <p><i class="fa fa-dot-circle-o" aria-hidden="true"></i> Low-priced retirement Scheme --Your annual fees are lower priced than your investment.</p>
                                <p><i class="fa fa-dot-circle-o" aria-hidden="true"></i> Better returns than traditional options --A mix of stocks & FD-like investments results in a bigger bank balance</p>
                                <p><i class="fa fa-dot-circle-o" aria-hidden="true"></i> Unique way to reduce risk --Automatically increases allocation to FD-like investments as you reach closer to retirement</p>
                                <p><i class="fa fa-dot-circle-o" aria-hidden="true"></i> Managed by professionals. --Your money is invested & managed by India's best pension fund managers</p>
                                <p><i class="fa fa-dot-circle-o" aria-hidden="true"></i> Enforces investment discipline --Your investment is locked-in until you turn 60 years. Plus, a minimum yearly investment of Rs.1,000 is compulsory</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>


    <!-- start customer faq -->
    <section class="custom-faq section-padding ">
        <div class="container">
            <div class="row">
                <div class="col-md-12 text-center">
                    <div class="section-title">
                        <h2 style="font-size: 30px;">FAQ’s</h2>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-6">
                    <div id="accordion" class="second-accordion">
                        <div class="card">
                            <div class="card-header" id="headingOne">
                                <h5 class="mb-0">
                                    <button class="btn btn-link font__sizeMs" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
                                        Who can join NPS? 
                                    </button>
                                </h5>
                            </div>
                            <div id="collapseOne" class="collapse show" aria-labelledby="headingOne" data-bs-parent="#accordion">
                                <div class="card-body">
                                    Any resident of India aged among 18-65 years as on the date of compliance of his/her application can invest in NPS. The people can join NPS either as individuals or in groups. However, OCI (Overseas Citizens of India), PIO (Person of Indian Origin) card holder and HUFs are not qualified for creating an NPS account.
                                </div>
                            </div>
                        </div>
                        <div class="card">
                            <div class="card-header" id="headingTwo">
                                <h5 class="mb-0">
                                    <button class="btn btn-link font__sizeMs collapsed" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
                                        Can I have more than 1 NPS Account?
                                    </button>
                                </h5>
                            </div>
                            <div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-bs-parent="#accordion">
                                <div class="card-body">
                                    No, numerous NPS accounts for an individual is not permissible as NPS is completely transferable across sectors and locations; hence, client need not apply for new account in case of alter in job or location.
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-md-6">
                    <div id="second-accordion" class="second-accordion">
                        <div class="card">
                            <div class="card-header" id="headingfour">
                                <h5 class="mb-0">
                                    <button class="btn btn-link font__sizeMs" data-bs-toggle="collapse" data-bs-target="#collapsfour" aria-expanded="false" aria-controls="collapsfour">
                                        Will the government contribute to my NPS Account?
                                    </button>
                                </h5>
                            </div>
                            <div id="collapsfour" class="collapse" aria-labelledby="headingfour" data-bs-parent="#second-accordion">
                                <div class="card-body">                 
                                    NPS is a Government of India scheme to offer old age safety to Citizens of India; nevertheless, Government will not be making any payment to your NPS account. The payment in NPS account is completed only by the person under the "all citizens of India" model or by the employee-employer group beneath the business model.
                                </div>
                            </div>
                        </div>
                        <div class="card">
                            <div class="card-header" id="headingfive">
                                <h5 class="mb-0">
                                    <button class="btn btn-link font__sizeMs collapsed" data-bs-toggle="collapse" data-bs-target="#collapsfive" aria-expanded="false" aria-controls="collapsfive">
                                        How is the annuity Index taxed?
                                    </button>
                                </h5>
                            </div>
                            <div id="collapsfive" class="collapse" aria-labelledby="headingfive" data-bs-parent="#second-accordion">
                                <div class="card-body">
                                    NPS qualifies as EEE product, where your investment is completely tax-free at all stages. Your invested sum, return earned and maturity withdrawal are all completely tax-free.  
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- end of customer faq -->
    <script>
$(document).ready(function(){
  $(".nav-tabs ").click(function(){
    $(this).tab('show');
  });
  $('.nav-tabs ').on('shown.bs.tab', function(event){
    var x = $(event.target).text();         // active tab
    var y = $(event.relatedTarget).text();  // previous tab
    $(".act span").text(x);
    $(".prev span").text(y);
  });
});
</script>

<script type="text/javascript">
    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
    });

    /* All Product Form */
    $('#mobile').keypress(function (e) {
    if (e.which != 8 && e.which != 0 && (e.which < 48 || e.which > 57)) {
        $('#errmsg').html('Enter Digits Only').show().fadeOut('slow');
        return false;
    }
});
jQuery.validator.addMethod("lettersonly", function(value, element) {
    return this.optional(element) || /^[a-z," "]+$/i.test(value);
  }, "Name must be a valid name."); 
    $('#national-pension-scheme-form').validate({

        errorElement: 'span',
            errorClass: 'text-danger',
    rules: {
        name:{ 
             required: true,
             minlength: 3,
            maxlength: 50,
            lettersonly:true
        },
        email: {
		  required: true,
		  email: true
		},
        mobile: {
            required: true,
            number: true,
            minlength: 10,
            maxlength: 10,
        },
    },
    messages: {
        name: {
            required: "Please enter your name",
        minlength:'Minimum 3 letters required',
        maxlength:'only 50 characters allowed.',
    },
        mobile: {
            digits: 'Invalid phone number 10 Only numbers allowed',
            required: 'Please provide a valid Phone Number .',
            maxlength: 'Please provide a valid Phone Number',
            minlength: 'Please provide a valid Phone Number'
        },
        email: {
            required: 'Please provide a valid Email ID .',
        },

    },
submitHandler: function(form) {
    $('#product-error').text('');
        $('#name-error').text('');
        $('#email-error').text('');
        $('#mobile-error').text('');

        product_name = $('#product_name').val();
        name = $('#name').val();
        email = $('#email').val();
        mobile = $('#mobile').val();

        $.ajax({
          url: "/store-national-pension-scheme",
          method: "POST",
          data:{
            "_token": "{{ csrf_token() }}",
            product_name:product_name,
            name:name,
            email:email,
            mobile:mobile,
          },
          success:function(response){
            if (response) {
              $('#success-message').text(response.success);
              setTimeout(function() { $("#success-message").hide(); }, 5000);
              $("#national-pension-scheme-form")[0].reset();
            }
          },
          error: function(response) {
         alert("Something Went Wrong.Please Try Again.");
         return false;
          }
         });
}
});

       
      </script>
      <style>
        .how-it-work-content{
            margin-top:15% !important;
            padding-top:0px !important;
        }
        .choose-img{
            display:none;
        }
      </style>
@stop