"use client";
import Image from "next/image";
import Link from "next/link";
import Portfolio from "../component/portoflio";
import ReviewSec from "../component/Testimonials";
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import '@fortawesome/fontawesome-svg-core/styles.css';
import { faPhoneVolume, faArrowDown } from '@fortawesome/free-solid-svg-icons';

export default function Home() {
  
  return (
    <main>
        <section  className="main-banner inner-banner">
            <div  className="container">
                <div  className="row align-items-center justify-content-center">
                    <div  className="col-xl-8 col-lg-8 col-md-8 col-sm-12 col-12">
                        <div  className="banner-content text-center">
                            <h1 data-aos="fade-down">Book Video Trailer Services USA</h1>
                            <p data-aos="fade-up" data-aos-delay="150">Cinematic, engaging, and professionally produced book video trailers designed to captivate readers and boost your book’s visibility. Our U.S.-based video production team creates compelling trailers for fiction, nonfiction, memoirs, and children’s books.</p>
                            <div  className="banner-btns justify-content-center" data-aos="zoom-in" data-aos-delay="300">
                                <Link href="/contact-us">Contact Us</Link>
                                <a href="tel:+1 (323) 503-1458 "><FontAwesomeIcon icon={faPhoneVolume} /> +1 (323) 503-1458</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>

        <section  className="sec-services bookwriting">
            <div  className="container">
                <div  className="row">
                    <div  className="col-lg-6">
                        <div  className="content" data-aos="fade-right">
                            <h3 data-aos="fade-right">Leading Professional</h3>
                            <h2 data-aos="fade-right" data-aos-delay="100">Book Video Trailers</h2>
                            <p data-aos="fade-right" data-aos-delay="200">Our U.S.-based marketing and video production team creates cinematic book trailers that capture your story’s essence through visuals, motion graphics, voiceover, and music. Whether you want an emotional teaser, fast-paced action promo, character-driven visuals, or a professional narrator-led trailer, we bring your book to life on screen. Perfect for Amazon ads, social media campaigns, author websites, and book launch promotions.</p>
                            <div  className="banner-btns" data-aos="zoom-in" data-aos-delay="350">
                                <Link href="/contact-us">Contact Us</Link>
                                <a href="tel:+1 (323) 503-1458 "><FontAwesomeIcon icon={faPhoneVolume} /> +1 (323) 503-1458</a>
                            </div>
                        </div>
                    </div>

                    <div  className="col-lg-6">
                        <div  className="img-ser" data-aos="fade-left" data-aos-delay="200">
                            <Image src="/assets/images/book-writing-img.webp"  width={636} height={608} alt="Professional book video trailer services in USA with cinematic visuals, motion graphics, and voiceover for book promotion" title="Book Video Trailer Services in USA | The Book Quill"  className="img-fluid" />
                        </div>
                    </div>

                </div>
            </div>
        </section>

        <section  className="cta-banner cta-banner-2">
            <div  className="container">
                <div  className="row align-items-center">
                    <div  className="col-lg-6">
                        <div  className="banner-content">
                            <h3 data-aos="fade-right">Transform Your Book <span>Into a Visual</span> <br/>
                                Experience with a <span>Professional Trailer</span></h3>
                            <p data-aos="fade-right" data-aos-delay="150">we are offer our client a <span>40% discount</span> on all of our services. avail your discount coupon now through our live chat
                            </p>
                            <div  className="banner-btns" data-aos="zoom-in" data-aos-delay="300">
                                <Link href="/contact-us">Contact Us</Link>
                                <a href="tel:+1 (323) 503-1458 "><FontAwesomeIcon icon={faPhoneVolume} /> +1 (323) 503-1458</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>

        <Portfolio />

        <section  className="our-promise-sec extra-features">
            <div  className="container">

                <div  className="title heading" data-aos="fade-down" data-aos-delay="100" data-aos-duration="900">
                    <h2>what we offer</h2>
                    <p>Our book video trailer services help authors create cinematic, story-driven trailers that increase book visibility and attract new readers across all major marketing channels.</p>
                </div>

                <div  className="row align-items-md-end">

                    <div  className="col-xxl-7 col-xl-7 col-lg-7 col-md-8">
                        <div  className="title">
                            <h2 data-aos="fade-right" data-aos-delay="150" data-aos-duration="800">expert book trailer production</h2>
                            <p>We follow a professional trailer creation process to ensure your video is visually compelling, emotionally engaging, and optimized for online promotion.</p>
                            <ul>
                                <li>Concept Development</li>
                                <li>Scriptwriting</li>
                                <li>Stock Footage Selection</li>
                                <li>Motion Graphics</li>
                                <li>Voiceover Recording</li>
                                <li>Sound Design</li>
                                <li>Video Editing</li>
                                <li>Social Media Export Files</li>
                            </ul>
                            <div  className="banner-btns">
                                <Link href="/contact-us">start your project</Link>
                                        <a href="tel:+1 (323) 503-1458 "><FontAwesomeIcon icon={faPhoneVolume} /> +1 (323) 503-1458</a>
                            </div>
                        </div>
                    </div>

                    <div  className="col-xxl-5 col-xl-5 col-lg-5 col-md-4">
                        <div  className="img-our" data-aos="fade-left" data-aos-delay="250" data-aos-duration="800">
                            <Image src="/assets/images/ser-img.webp"  alt="Expert book trailer production with cinematic visuals, motion graphics, voiceover, and video editing for book promotion" title="Book Trailer Production Support | The Book Quill"  className="img-fluid" />
                        </div>
                    </div>

                </div>

            </div>
        </section>

        <section  className="section-our-process" data-aos="fade-up">
            <div  className="container">

                <div  className="row justify-content-center">
                    <div  className="col-xxl-9">
                        <div  className="title">
                            <h2 data-aos="fade-down">our process</h2>
                            <p data-aos="fade-up" data-aos-delay="100">Our video trailer workflow ensures your book receives a polished, visually striking trailer designed for maximum impact and engagement.</p>
                        </div>
                    </div>
                </div>

                <div  className="row our-line">

                    <div  className="col-xl-3 col-lg-3 col-md-3">
                        <div  className="pro-card" data-aos="fade-right" data-aos-delay="0">
                            <div  className="top-h3"><h3>Planning</h3></div>
                            <h2>01</h2>
                            <div  className="content">
                                <h3>Planning</h3>
                                <p>We understand your book’s genre, tone, message, and audience to shape the trailer direction.</p>
                            </div>
                        </div>
                    </div>

                    <div  className="col-xl-3 col-lg-3 col-md-3">
                        <div  className="pro-card" data-aos="fade-right" data-aos-delay="150">
                            <div  className="top-h3"><h3>Production</h3></div>
                            <h2>02</h2>
                            <div  className="content">
                                <h3>Production</h3>
                                <p>We create visuals, motion graphics, and voiceovers to match the trailer’s theme and mood.</p>
                            </div>
                        </div>
                    </div>

                    <div  className="col-xl-3 col-lg-3 col-md-3">
                        <div  className="pro-card" data-aos="fade-right" data-aos-delay="300">
                            <div  className="top-h3"><h3>Editing</h3></div>
                            <h2>03</h2>
                            <div  className="content">
                                <h3>Editing</h3>
                                <p>Our editors craft a smooth, cinematic trailer with professional audio mixing and transitions.</p>
                            </div>
                        </div>
                    </div>

                    <div  className="col-xl-3 col-lg-3 col-md-3">
                        <div  className="pro-card" data-aos="fade-right" data-aos-delay="450">
                            <div  className="top-h3"><h3>Delivery</h3></div>
                            <h2>04</h2>
                            <div  className="content">
                                <h3>Delivery</h3>
                                <p>Your trailer is exported in multiple formats suitable for Amazon ads, YouTube, and social media.</p>
                            </div>
                        </div>
                    </div>

                </div>

            </div>
        </section>

        <ReviewSec />
    </main>
  );
}
