<!DOCTYPE html>
<html lang="en">
<head>
    {% include 'head.html' %}

</head>
<body>
    {% include 'nav.html' %}
    <div class="smooth-scroll">
        <div class="banner" id="banner">
            <div class="img-sec">
                <img src="/static/images/banner_box_1.jpg" alt="" width="100%" id="farmhouse_img">
                <div class="container">
                    <div class="row">
                        <div class="col-md-12 col-lg-12">
                            <div class="banner-content" id="banner-content">
                                <h2>Preserve Your Cigar In Style</h2>
                                <!-- <p>Grow Farms are not new in the market. We promise you that we will not fail to deliver your agricultural land.</p> -->
                                <!-- <div class="join-btn">
                                    <a href="#">Join Now</a>
                                    <a href="#">Learn More</a>
                                </div> -->
                            </div>
                        </div>
                    </div>
                </div>
                    <img src="/static/images/banner/smoke_1.png" alt="" width="100%" class="smoke">
                    <img src="/static/images/smoke.gif" alt="" width="100%" class="smoke_gif">
                    <!-- <video><source src="/static/images/smoke_new.gif" type="video/mp4"></video> -->
                    
            </div>
        </div>

        <section class="product-showcase">
            <div class="container">
                <div class="row">
                    <div class="col-lg-8 col-md-8">
                        <div class="showcase-main">
                            <h2>YOUR PERSONALIZED LUXURY CIGAR BOX
                                COME IN YOUR CHOICE OF MATERIAL</h2>
                        </div>
                    </div>
                </div>
            </div>
            <div class="showcase-slider">
                <div class="showcase-item">
                    <div class="row m-0">
                        <div class="col-lg-7 col-md-7">
                            <img src="/static/images/showcase-2.png" alt=" " class="">
                        </div>
                        <div class="col-lg-5 col-md-5 showcase-content">
                            <h3>PERSONALIZED CIGAR BOX</h3>
                            <P> Introducing your gateway to refined indulgence – the Personalized Cigar Box with your exclusive Cigar Crest. A bespoke emblem, intricately designed to mirror your cigar journey, adorns a meticulously crafted box, housing a curated collection of premium cigars. This is more than a box; it's a personalized sanctuary for your unique taste, a celebration of the artistry in every puff. Elevate your cigar experience and make a statement with this symbol of distinction.</P>
                            <div class="book_now">
                                <a href="product-detail.php">Buy Now</a>
                            </div>
                        </div>
                    </div>
                    
                </div>
                <div class="showcase-item">
                    <div class="row m-0">
                        <div class="col-lg-7 col-md-7">
                            <img src="/static/images/showcase.png" alt=" " class="">
                        </div>
                        <div class="col-lg-5 col-md-5 showcase-content">
                            <h3>PERSONALIZED CIGAR BOX</h3>
                            <P>My Cigar Crest Case is available in two eye-catching designs that will make you the best person at your next party. Easily and stylishly transport your favorite cigars, your lighter, and your Guillotine Cutter wherever you go.</P>
                            <div class="book_now">
                                <a href="product-detail.php">Buy Now</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>


        <section class="inspiration_sec" id="inspiration_main">
            <div class="container">
                <div class="row">
                    <div class="col-lg-8 col-md-8 offset-lg-2">
                        <div class="heading-all" id="inspiration_1">
                            <h2>INSPIRATION</h2>
                            <p>These packaging options are designed to replicate the texture and visual appeal of
                                dried tobacco leaves, creating an earthy and authentic aesthetic that complements
                                the cigars inside. The natural hues and intricate patterns of dried tobacco leaves
                                are carefully replicated on the exterior of each package, creating a unique and
                                visually stunning product.</p>
                        </div>
                    </div>
                </div>
            </div>
            <img src="/static/images/shape-23.png" alt="" width="100%" class="shape-2">
        </section>


        <section class="leather-options">
            <div class="container">
                <div class="row">
                    <div class="col-lg-8 col-md-8">
                        <div class="heading-all text-start" id="">
                            <h2> PERSONALISED MATERIAL</h2>
                            <p>YOUR PERSONALIZED LUXURY CIGAR BOX
                                COME IN YOUR CHOICE OF MATERIAL</p>
                        </div>
                    </div>
                </div>
            </div>
            <div class="container">
                <!-- Showcase -->
                <div class="tms-showcase gap-bottom-40">
                    <div class="img-circle tms-circle-move"></div>
            
                    <!-- Showcase items -->
                    <div class="tms-showcase-items">
            
            
            
                        <!--showcase item-->
                        <div class="tms-showcase-item hover">
                            <h3 class="title">
                                <a href="#">
                                    <img src="/static/images/wood.jpg" alt="" class="leater-img-sm">
                                    <span class="tms-lnk words lines splitting" data-splitting="" data-tms-scroll="" style="--word-total: 5; --line-total: 2;" data-scroll="in"> 
                                        <span class="word" data-word="Tagg" style="--word-index: 0; --line-index: 0;">WOOD</span>
                                    </span>
                                </a>
                            </h3>
                            <div class="image" data-tms-overlay="" data-tms-scroll="" data-scroll="in">
                                <span class="img" style="background-image: url(/static/images/portfolio/wood-12.png);"></span>
                                <div class="tms-overlay"></div>
                            </div>
                        </div>
            
            
                        <!--showcase item-->
                        <div class="tms-showcase-item">
                            <h3 class="title">
                                <a href="#">
                                    <img src="/static/images/leather.jpg" alt="" class="leater-img-sm">
                                    <span class="tms-lnk words lines splitting" data-splitting="" data-tms-scroll="" style="--word-total: 5; --line-total: 2;" data-scroll="in">
                                            <span class="word" data-word="Tagg" style="--word-index: 0; --line-index: 0;">LEATHER</span>
                                    </span>
                                </a>
                            </h3>
                            <div class="image" data-tms-overlay="" data-tms-scroll="" data-scroll="in">
                                <span class="img" style="background-image: url(/static/images/portfolio/leather-12.png);"></span>
                            <div class="tms-overlay"></div></div>
                        </div>
            
                        <!--showcase item-->
                        <div class="tms-showcase-item">
                            <h3 class="title">
                                <a href="#">
                                    <img src="/static/images/velvet.jpg" alt="" class="leater-img-sm">
                                    <span class="word" data-word="Tagg" style="--word-index: 0; --line-index: 0;">VELVET</span>
                                </a>
                            </h3>
                            <div class="image" data-tms-overlay="" data-tms-scroll="" data-scroll="in">
                                <span class="img" style="background-image: url(/static/images/portfolio/velvet-12.png);"></span>
                            <div class="tms-overlay"></div></div>
                        </div>
            
                        <!--showcase item-->
                        <div class="tms-showcase-item">
                            <h3 class="title">
                                <a href="#">
                                    <img src="/static/images/carban.jpg" alt="" class="leater-img-sm">
                                    <span class="word" data-word="Tagg" style="--word-index: 0; --line-index: 0;">CARBON</span>
                                </a>
                            </h3>
                            <div class="image" data-tms-overlay="" data-tms-scroll="" data-scroll="in">
                                <span class="img" style="background-image: url(/static/images/portfolio/carben-12.png);"></span>
                            <div class="tms-overlay"></div></div>
                        </div>
            
                    </div>
            
                </div>
    
            
            </div>
        </section>
        
        {% include 'footer.html' %}
    </div>


    {% include 'script.html' %}
    <script src="/static/js/home.js"></script>
</body>
</html>