@extends('layouts.app3')

@section('title')
    Contact
@endsection

@section('breadcrumb-title')
    Get Started with a free quotation
@endsection

@section('breadcrumb-path')
    <li class="rainbow-breadcrumb-item"><a href="{{ route('home') }}">Home</a></li>
    <li class="rainbow-breadcrumb-item active">Contact</li>
@endsection

@section('content')
    <!-- Start Contact Area  -->
    <div class="main-content">

        <div class="rainbow-contact-area rainbow-section-gapTop-big">
            <div class="container">
                <div class="row mt--40 row--15">
                    <div class="col-lg-8">
                        <div class="contact-details-box">
                            <h3 class="title">Get Started with a free quotation</h3>

                            <div class="profile-details-tab">
                                <div class="advance-tab-button">
                                    <ul class="nav nav-tabs tab-button-style-2 justify-content-start" id="settinsTab-4"
                                        role="tablist">
                                        <li role="presentation">
                                            <a href="#" class="tab-button active" id="image-genarator-tab"
                                                data-bs-toggle="tab" data-bs-target="#image-genarator" role="tab"
                                                aria-controls="image-genarator" aria-selected="true">
                                                <span class="title">AI Image</span>
                                                <span class="title">Generator</span>
                                            </a>
                                        </li>
                                        <li role="presentation">
                                            <a href="#" class="tab-button" id="photo-editor-tab" data-bs-toggle="tab"
                                                data-bs-target="#photo-editor" role="tab" aria-controls="photo-editor"
                                                aria-selected="true">
                                                <span class="title">AI Photo</span>
                                                <span class="title">Generator</span>
                                            </a>
                                        </li>
                                        <li role="presentation">
                                            <a href="#" class="tab-button" id="email-genarator-tab"
                                                data-bs-toggle="tab" data-bs-target="#email-genarator" role="tab"
                                                aria-controls="email-genarator" aria-selected="true">
                                                <span class="title">AI Email</span>
                                                <span class="title">Generator</span>
                                            </a>
                                        </li>
                                        <li role="presentation">
                                            <a href="#" class="tab-button" id="code-genarator-tab"
                                                data-bs-toggle="tab" data-bs-target="#code-genarator" role="tab"
                                                aria-controls="code-genarator" aria-selected="true">
                                                <span class="title">AI Code</span>
                                                <span class="title">Generator</span>
                                            </a>
                                        </li>
                                    </ul>
                                </div>

                                <div class="tab-content">
                                    <div class="tab-pane fade active show" id="image-genarator" role="tabpanel"
                                        aria-labelledby="image-genarator-tab">
                                        <!-- Start image-genarator Row  -->
                                        <form action="#" class="rbt-profile-row rbt-default-form row row--15">
                                            <div class="col-lg-6 col-md-6 col-sm-6 col-12">
                                                <div class="form-group">
                                                    <label for="firstname1">First Name</label>
                                                    <input id="firstname1" type="text" placeholder="Smith">
                                                </div>
                                            </div>
                                            <div class="col-lg-6 col-md-6 col-sm-6 col-12">
                                                <div class="form-group">
                                                    <label for="lastname1">Last Name</label>
                                                    <input id="lastname1" type="text" placeholder="Jonson">
                                                </div>
                                            </div>
                                            <div class="col-lg-6 col-md-6 col-sm-6 col-12">
                                                <div class="form-group">
                                                    <label for="username1">User Name</label>
                                                    <input id="username1" type="text" placeholder="Jonson Milner">
                                                </div>
                                            </div>
                                            <div class="col-lg-6 col-md-6 col-sm-6 col-12">
                                                <div class="form-group">
                                                    <label for="phonenumber1">Phone Number</label>
                                                    <input id="phonenumber1" type="tel" placeholder="+1-202-555-0174">
                                                </div>
                                            </div>
                                            <div class="col-12">
                                                <div class="form-group">
                                                    <label for="bio1">Bio</label>
                                                    <textarea id="bio1" cols="20" rows="5"
                                                        placeholder="I'm the Front-End Developer for #Rainbow IT in Bangladesh, OR. I have serious passion for UI effects, animations and creating intuitive, dynamic user experiences."></textarea>
                                                </div>
                                            </div>
                                            <div class="col-12 mt--20">
                                                <div class="form-group mb--0">
                                                    <a class="btn-default" href="#">Update Info</a>
                                                </div>
                                            </div>
                                        </form>
                                        <!-- End Profile Row  -->
                                    </div>

                                    <div class="tab-pane fade" id="photo-editor" role="tabpanel"
                                        aria-labelledby="photo-editor-tab">
                                        <!-- Start photo-editor Row  -->
                                        <form action="#" class="rbt-profile-row rbt-default-form row row--15">
                                            <div class="col-lg-6 col-md-6 col-sm-6 col-12">
                                                <div class="form-group">
                                                    <label for="firstname2">First Name</label>
                                                    <input id="firstname2" type="text" placeholder="Smith">
                                                </div>
                                            </div>
                                            <div class="col-lg-6 col-md-6 col-sm-6 col-12">
                                                <div class="form-group">
                                                    <label for="lastname2">Last Name</label>
                                                    <input id="lastname2" type="text" placeholder="Jonson">
                                                </div>
                                            </div>
                                            <div class="col-lg-6 col-md-6 col-sm-6 col-12">
                                                <div class="form-group">
                                                    <label for="username2">User Name</label>
                                                    <input id="username2" type="text" placeholder="Jonson Milner">
                                                </div>
                                            </div>
                                            <div class="col-lg-6 col-md-6 col-sm-6 col-12">
                                                <div class="form-group">
                                                    <label for="phonenumber2">Phone Number</label>
                                                    <input id="phonenumber2" type="tel"
                                                        placeholder="+1-202-555-0174">
                                                </div>
                                            </div>
                                            <div class="col-12">
                                                <div class="form-group">
                                                    <label for="bio2">Bio</label>
                                                    <textarea id="bio2" cols="20" rows="5"
                                                        placeholder="I'm the Front-End Developer for #Rainbow IT in Bangladesh, OR. I have serious passion for UI effects, animations and creating intuitive, dynamic user experiences."></textarea>
                                                </div>
                                            </div>
                                            <div class="col-12 mt--20">
                                                <div class="form-group mb--0">
                                                    <a class="btn-default" href="#">Update Info</a>
                                                </div>
                                            </div>
                                        </form>
                                        <!-- End Profile Row  -->
                                    </div>


                                    <div class="tab-pane fade" id="email-genarator" role="tabpanel"
                                        aria-labelledby="email-genarator-tab">
                                        <!-- Start email-genarator Row  -->
                                        <form action="#" class="rbt-profile-row rbt-default-form row row--15">
                                            <div class="col-lg-6 col-md-6 col-sm-6 col-12">
                                                <div class="form-group">
                                                    <label for="firstname3">First Name</label>
                                                    <input id="firstname3" type="text" placeholder="Smith">
                                                </div>
                                            </div>
                                            <div class="col-lg-6 col-md-6 col-sm-6 col-12">
                                                <div class="form-group">
                                                    <label for="lastname3">Last Name</label>
                                                    <input id="lastname3" type="text" placeholder="Jonson">
                                                </div>
                                            </div>
                                            <div class="col-lg-6 col-md-6 col-sm-6 col-12">
                                                <div class="form-group">
                                                    <label for="username3">User Name</label>
                                                    <input id="username3" type="text" placeholder="Jonson Milner">
                                                </div>
                                            </div>
                                            <div class="col-lg-6 col-md-6 col-sm-6 col-12">
                                                <div class="form-group">
                                                    <label for="phonenumber3">Phone Number</label>
                                                    <input id="phonenumber3" type="tel"
                                                        placeholder="+1-202-555-0174">
                                                </div>
                                            </div>
                                            <div class="col-12">
                                                <div class="form-group">
                                                    <label for="bio3">Bio</label>
                                                    <textarea id="bio3" cols="20" rows="5"
                                                        placeholder="I'm the Front-End Developer for #Rainbow IT in Bangladesh, OR. I have serious passion for UI effects, animations and creating intuitive, dynamic user experiences."></textarea>
                                                </div>
                                            </div>
                                            <div class="col-12 mt--20">
                                                <div class="form-group mb--0">
                                                    <a class="btn-default" href="#">Update Info</a>
                                                </div>
                                            </div>
                                        </form>
                                        <!-- End Profile Row  -->
                                    </div>

                                    <div class="tab-pane fade" id="code-genarator" role="tabpanel"
                                        aria-labelledby="code-genarator-tab">
                                        <!-- Start code-genarator Row  -->
                                        <form action="#" class="rbt-image-genarator-row rbt-default-form row row--15">
                                            <div class="col-lg-6 col-md-6 col-sm-6 col-12">
                                                <div class="form-group">
                                                    <label for="firstname4">First Name</label>
                                                    <input id="firstname4" type="text" placeholder="Smith">
                                                </div>
                                            </div>
                                            <div class="col-lg-6 col-md-6 col-sm-6 col-12">
                                                <div class="form-group">
                                                    <label for="lastname4">Last Name</label>
                                                    <input id="lastname4" type="text" placeholder="Jonson">
                                                </div>
                                            </div>
                                            <div class="col-lg-6 col-md-6 col-sm-6 col-12">
                                                <div class="form-group">
                                                    <label for="username4">User Name</label>
                                                    <input id="username4" type="text" placeholder="Jonson Milner">
                                                </div>
                                            </div>
                                            <div class="col-lg-6 col-md-6 col-sm-6 col-12">
                                                <div class="form-group">
                                                    <label for="phonenumber4">Phone Number</label>
                                                    <input id="phonenumber4" type="tel"
                                                        placeholder="+1-202-555-0174">
                                                </div>
                                            </div>
                                            <div class="col-12">
                                                <div class="form-group">
                                                    <label for="bio4">Bio</label>
                                                    <textarea id="bio4" cols="20" rows="5"
                                                        placeholder="I'm the Front-End Developer for #Rainbow IT in Bangladesh, OR. I have serious passion for UI effects, animations and creating intuitive, dynamic user experiences."></textarea>
                                                </div>
                                            </div>
                                            <div class="col-12 mt--20">
                                                <div class="form-group mb--0">
                                                    <a class="btn-default" href="#">Update Info</a>
                                                </div>
                                            </div>
                                        </form>
                                        <!-- End Profile Row  -->
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-4 mt_md--30 mt_sm--30">
                        <div class="rainbow-address">
                            <div class="icon">
                                <i class="fa-sharp fa-regular fa-location-dot"></i>
                            </div>
                            <div class="inner">
                                <h4 class="title">Location</h4>
                                <p class="b2">100 avenue of the moon, 12 new <br> York, ny 1001B US.</p>
                            </div>
                        </div>
                        <div class="rainbow-address">
                            <div class="icon">
                                <i class="fa-sharp fa-solid fa-headphones"></i>
                            </div>
                            <div class="inner">
                                <h4 class="title">Contact Number</h4>
                                <p class="b2"><a href="#">+444 555 666 777</a></p>
                                <p class="b2"><a href="#">+222 222 222 333</a></p>
                            </div>
                        </div>
                        <div class="rainbow-address">
                            <div class="icon">
                                <i class="fa-sharp fa-regular fa-envelope"></i>
                            </div>
                            <div class="inner">
                                <h4 class="title">Our Email Address</h4>
                                <p class="b2"><a href="mailto:admin@gmail.com">admin@gmail.com</a></p>
                                <p class="b2"><a href="mailto:example@gmail.com">example@gmail.com</a></p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>




        <!-- Start CTA Area -->
        <div class="rainbow-cta-area rainbow-section-gap-big">
            <div class="container">
                <div class="row">
                    <div class="col-lg-12">
                        <div class="aiwave-cta">
                            <div class="inner">
                                <div class="content-left">
                                    <div class="section-title text-left" data-sal="slide-up" data-sal-duration="400"
                                        data-sal-delay="150">
                                        <h4 class="subtitle">
                                            <span class="theme-gradient">customer saying</span>
                                        </h4>
                                        <h2 class="title w-600 mb--20">
                                            The opinions of the community
                                        </h2>
                                        <p class="description b1">
                                            Collaborate with AI to generate content that resonates.
                                        </p>
                                    </div>
                                    <div class="app-store-btn">
                                        <a class="store-btn" href="#">
                                            <img src="{{asset("assets/images/cta-img/play-app.png")}}" alt="Play Store Button">
                                        </a>
                                        <a class="store-btn" href="#">
                                            <img src="{{asset("assets/images/cta-img/apple-app.png")}}" alt="Apple Store Button">
                                        </a>
                                    </div>
                                </div>
                                <div class="content-right">
                                    <div class="img-right">
                                        <img src="{{asset("assets/images/cta-img/view-img.png")}}" alt="Mobile View">
                                    </div>
                                </div>
                                <div class="bg-shape-one">
                                    <img src="{{asset("assets/images/cta-img/bg-shape.png")}}" alt="Bg shape">
                                </div>
                            </div>
                            <div class="bg-shape-inside">
                                <img src="{{asset("assets/images/bg/bg-shape-tree.png")}}" alt="Bg shape">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection