PNG  IHDR pHYs   OiCCPPhotoshop ICC profilexڝSgTS=BKKoR RB&*! J!QEEȠQ, !{kּ> H3Q5 B.@ $pd!s#~<<+"x M0B\t8K@zB@F&S`cbP-`'{[! eDh;VEX0fK9-0IWfH  0Q){`##xFW<+*x<$9E[-qWW.(I+6aa@.y24x6_-"bbϫp@t~,/;m%h^ uf@Wp~<5j>{-]cK'Xto(hw?G%fIq^D$.Tʳ?D*A, `6B$BB dr`)B(Ͱ*`/@4Qhp.U=pa( Aa!ڈbX#!H$ ɈQ"K5H1RT UH=r9\F;2G1Q= C7F dt1r=6Ыhڏ>C03l0.B8, c˱" VcϱwE 6wB aAHXLXNH $4 7 Q'"K&b21XH,#/{C7$C2'ITFnR#,4H#dk9, +ȅ3![ b@qS(RjJ4e2AURݨT5ZBRQ4u9̓IKhhitݕNWGw Ljg(gwLӋT071oUX**| J&*/Tު UUT^S}FU3S ԖUPSSg;goT?~YYLOCQ_ cx,!k u5&|v*=9C3J3WRf?qtN (~))4L1e\kXHQG6EYAJ'\'GgSSݧ M=:.kDwn^Loy}/TmG X $ <5qo</QC]@Caaᄑ.ȽJtq]zۯ6iܟ4)Y3sCQ? 0k߬~OCOg#/c/Wװwa>>r><72Y_7ȷOo_C#dz%gA[z|!?:eAAA!h쐭!ΑiP~aa~ 'W?pX15wCsDDDޛg1O9-J5*>.j<74?.fYXXIlK9.*6nl {/]py.,:@LN8A*%w% yg"/6шC\*NH*Mz쑼5y$3,幄'L Lݛ:v m2=:1qB!Mggfvˬen/kY- BTZ(*geWf͉9+̳ې7ᒶKW-X潬j9(xoʿܔĹdff-[n ڴ VE/(ۻCɾUUMfeI?m]Nmq#׹=TR+Gw- 6 U#pDy  :v{vg/jBFS[b[O>zG499?rCd&ˮ/~јѡ򗓿m|x31^VwwO| (hSЧc3- cHRMz%u0`:o_F@8N ' p @8N@8}' p '#@8N@8N pQ9p!i~}|6-ӪG` VP.@*j>[ K^<֐Z]@8N'KQ<Q(`s" 'hgpKB`R@Dqj '  'P$a ( `D$Na L?u80e J,K˷NI'0eݷ(NI'؀ 2ipIIKp`:O'`ʤxB8Ѥx Ѥx $ $P6 :vRNb 'p,>NB 'P]-->P T+*^h& p '‰a ‰ (ĵt#u33;Nt̵'ޯ; [3W ~]0KH1q@8]O2]3*̧7# *p>us p _6]/}-4|t'|Smx= DoʾM×M_8!)6lq':l7!|4} '\ne t!=hnLn (~Dn\+‰_4k)0e@OhZ`F `.m1} 'vp{F`ON7Srx 'D˸nV`><;yMx!IS钦OM)Ե٥x 'DSD6bS8!" ODz#R >S8!7ّxEh0m$MIPHi$IvS8IN$I p$O8I,sk&I)$IN$Hi$I^Ah.p$MIN$IR8I·N "IF9Ah0m$MIN$IR8IN$I 3jIU;kO$ɳN$+ q.x* tEXtComment

Viewing File: /home/u456810272/domains/huntbooking.org/public_html/0index.html

<!DOCTYPE html>
<html lang="en-US">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no, maximum-scale=1">
    <title>HuntBooking - The Premier Hunting SaaS</title>
    <link rel="preconnect" href="https://fonts.gstatic.com/" crossorigin="anonymous">
    <link rel="preconnect" href="https://fonts.googleapis.com/">
    <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700&display=swap">
    <meta name="description" content="HuntBooking - The premier booking destination for hunting adventures globally.">
    <style>
        /* Core Reset & Provided Theme Variables */
        :root { 
            --primary: #ae8b2b; 
            --primary-l10: #cfa83d; 
            --gray: #cbd5e0; 
            --gray-text: #717171; 
            --gold: #dbb127; 
            --bg: #f4f3f4; 
            --dark: #091211; 
            --white: #ffffff;
        }
        * { box-sizing: border-box; margin: 0; padding: 0; font-family: 'Roboto', sans-serif; }
        body { background-color: var(--bg); color: var(--dark); line-height: 1.5; overflow-x: hidden; }
        a { text-decoration: none; color: inherit; }
        img { max-width: 100%; display: block; border-radius: 8px; }
        
        /* UI Components */
        .container { max-width: 1248px; margin: 0 auto; padding: 0 1.5rem; }
        .ui-button { display: inline-flex; align-items: center; justify-content: center; padding: 0 1.5rem; height: 50px; font-weight: 500; border-radius: 8px; cursor: pointer; transition: 0.3s; border: none; font-size: 1rem; }
        .ui-button--gold { background-color: var(--gold); color: #fff; }
        .ui-button--gold:hover { background-color: var(--primary-l10); transform: translateY(-2px); }
        .ui-button--outline { background-color: transparent; border: 1px solid var(--primary); color: var(--primary); }
        .ui-button--outline:hover { background-color: var(--primary); color: #fff; }
        .ui-button--wide { width: 100%; }

        /* Multi-Page Routing CSS */
        .view-section { display: none; min-height: 80vh; padding: 60px 0; }
        .view-section.active { display: block; }
        #home { padding: 0; } 

        /* Header */
        header { background: rgba(255, 255, 255, 0.95); backdrop-filter: blur(10px); box-shadow: 0 2px 10px rgba(0,0,0,0.05); padding: 15px 0; position: sticky; top: 0; z-index: 1000; }
        .header-inner { display: flex; justify-content: space-between; align-items: center; }
        .logo { font-size: 1.8rem; font-weight: 700; color: var(--primary); letter-spacing: -0.5px; }
        .nav-links { display: flex; gap: 25px; align-items: center; font-weight: 500; }
        .nav-links a:hover { color: var(--primary); }

        /* Auth Forms */
        .auth-card { background: #fff; max-width: 450px; margin: 0 auto; padding: 40px; border-radius: 12px; box-shadow: 0 10px 30px rgba(0,0,0,0.08); }
        .auth-card h2 { margin-bottom: 25px; text-align: center; color: var(--dark); font-size: 1.8rem; }
        .form-group { margin-bottom: 20px; }
        .form-group label { display: block; margin-bottom: 8px; font-size: 0.9rem; color: var(--gray-text); }
        .form-group input { width: 100%; height: 45px; padding: 0 15px; border: 1px solid var(--gray); border-radius: 6px; font-size: 1rem; transition: 0.3s; }
        .form-group input:focus { border-color: var(--primary); outline: none; box-shadow: 0 0 0 3px rgba(174, 139, 43, 0.1); }
        .auth-switch { text-align: center; margin-top: 20px; font-size: 0.9rem; }
        .auth-switch a { color: var(--primary); font-weight: 500; }
        
        /* Toast */
        #toast { position: fixed; bottom: 20px; right: 20px; padding: 15px 25px; border-radius: 8px; color: #fff; font-weight: 500; opacity: 0; transition: opacity 0.3s; z-index: 9999; pointer-events: none; box-shadow: 0 4px 12px rgba(0,0,0,0.15); }
        .toast-success { background-color: #27ae60; }
        .toast-error { background-color: #db2828; }

        /* Section Titles */
        .section-title { text-align: center; margin-bottom: 50px; }
        .section-title h2 { font-size: 2.5rem; color: var(--dark); margin-bottom: 15px; }
        .section-title p { color: var(--gray-text); font-size: 1.1rem; max-width: 600px; margin: 0 auto; }

        /* Hero Section with Video Background */
        .hero { position: relative; height: 90vh; display: flex; align-items: center; justify-content: center; text-align: center; color: #fff; overflow: hidden; }
        .hero-video { position: absolute; top: 50%; left: 50%; min-width: 100%; min-height: 100%; width: auto; height: auto; transform: translateX(-50%) translateY(-50%); z-index: -2; object-fit: cover; }
        .hero-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(to bottom, rgba(9,18,17,0.6), rgba(9,18,17,0.8)); z-index: -1; }
        .hero-content { position: relative; z-index: 1; max-width: 800px; padding: 0 20px; }
        .hero h1 { font-size: 4rem; margin-bottom: 20px; font-weight: 700; line-height: 1.1; text-shadow: 0 2px 10px rgba(0,0,0,0.5); }
        .hero p { font-size: 1.3rem; margin-bottom: 40px; opacity: 0.95; }
        .search-box { display: flex; gap: 10px; background: rgba(255,255,255,0.1); padding: 10px; border-radius: 12px; backdrop-filter: blur(5px); }
        .search-box input { flex: 1; padding: 18px 25px; border-radius: 8px; border: none; font-size: 1.1rem; box-shadow: 0 4px 15px rgba(0,0,0,0.1); }
        
        /* New Section: How It Works */
        .how-it-works { padding: 100px 0; background-color: var(--white); }
        .steps-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 40px; text-align: center; }
        .step-card { padding: 20px; }
        .step-img { width: 100%; height: 220px; object-fit: cover; border-radius: 12px; margin-bottom: 25px; box-shadow: 0 10px 20px rgba(0,0,0,0.05); }
        .step-card h3 { font-size: 1.5rem; margin-bottom: 15px; color: var(--primary); }
        .step-card p { color: var(--gray-text); line-height: 1.6; }

        /* Products Section */
        .products-section { padding: 100px 0; background-color: var(--bg); }
        .products-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 30px; }
        .product-card { background: #fff; border-radius: 12px; overflow: hidden; box-shadow: 0 4px 15px rgba(0,0,0,0.05); transition: transform 0.3s, box-shadow 0.3s; display: flex; flex-direction: column; }
        .product-card:hover { transform: translateY(-8px); box-shadow: 0 15px 30px rgba(0,0,0,0.1); }
        .product-img-wrapper { position: relative; height: 220px; overflow: hidden; }
        .product-img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s; }
        .product-card:hover .product-img { transform: scale(1.05); }
        .product-badge { position: absolute; top: 15px; right: 15px; background: var(--primary); color: #fff; padding: 5px 12px; border-radius: 20px; font-size: 0.8rem; font-weight: 700; z-index: 2; }
        .product-info { padding: 25px; flex: 1; display: flex; flex-direction: column; }
        .product-location { font-size: 0.85rem; color: var(--gray-text); margin-bottom: 8px; display: flex; align-items: center; gap: 5px; text-transform: uppercase; letter-spacing: 0.5px; }
        .product-title { font-size: 1.2rem; font-weight: 700; margin-bottom: 15px; line-height: 1.4; color: var(--dark); }
        .product-meta { display: flex; justify-content: space-between; align-items: flex-end; margin-top: auto; padding-top: 20px; border-top: 1px solid var(--gray); }
        .product-price { color: var(--primary); font-size: 1.4rem; font-weight: 700; }
        .product-price-old { color: var(--gray-text); text-decoration: line-through; font-size: 0.9rem; font-weight: 400; margin-left: 8px; }
        .product-duration { font-size: 0.9rem; color: var(--gray-text); }

        /* New Section: The Experience (About) */
        .experience-section { position: relative; padding: 120px 0; background: #000; color: #fff; overflow: hidden; }
        .experience-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url('https://images.unsplash.com/photo-1544256722-e257bc5ea1e4?q=80&w=2000&auto=format&fit=crop') center/cover fixed; opacity: 0.4; z-index: 0; }
        .experience-content { position: relative; z-index: 1; display: flex; align-items: center; gap: 60px; }
        .experience-text { flex: 1; }
        .experience-text h2 { font-size: 3rem; margin-bottom: 25px; line-height: 1.2; }
        .experience-text p { font-size: 1.15rem; opacity: 0.8; margin-bottom: 30px; line-height: 1.8; }
        .experience-image { flex: 1; }
        .experience-image img { border-radius: 12px; box-shadow: 0 20px 40px rgba(0,0,0,0.5); }
        @media(max-width: 768px) { .experience-content { flex-direction: column; } }

        /* New Section: Hunter Feedback */
        .testimonials { padding: 100px 0; background-color: var(--white); }
        .testimonial-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(350px, 1fr)); gap: 30px; }
        .testimonial-card { background: var(--bg); padding: 40px; border-radius: 12px; text-align: left; position: relative; }
        .quote-icon { font-size: 3rem; color: var(--primary); opacity: 0.2; position: absolute; top: 20px; right: 30px; }
        .test-image { width: 100%; height: 200px; object-fit: cover; border-radius: 8px; margin-bottom: 20px; }
        .stars { color: var(--gold); margin-bottom: 15px; font-size: 1.2rem; }
        .test-text { font-size: 1.05rem; color: var(--dark); font-style: italic; margin-bottom: 25px; line-height: 1.6; }
        .test-author { display: flex; align-items: center; gap: 15px; }
        .author-avatar { width: 50px; height: 50px; border-radius: 50%; object-fit: cover; }
        .author-info h4 { font-size: 1rem; color: var(--dark); }
        .author-info span { font-size: 0.85rem; color: var(--gray-text); }

        /* Footer */
        footer { background: var(--dark); color: #fff; padding: 60px 0 30px; text-align: center; }
        .footer-logo { font-size: 2rem; color: var(--primary); font-weight: 700; margin-bottom: 20px; display: inline-block; }
        .footer-links { margin-bottom: 30px; display: flex; justify-content: center; gap: 30px; flex-wrap: wrap; }
        .footer-links a { color: var(--gray); transition: 0.3s; }
        .footer-links a:hover { color: var(--primary); }
        .copyright { color: var(--gray-text); font-size: 0.9rem; border-top: 1px solid rgba(255,255,255,0.1); padding-top: 30px; margin-top: 30px; }
    </style>
</head>
<body>

    <!-- Header -->
    <header>
        <div class="container header-inner">
            <a href="#home" class="logo">HuntBooking</a>
            <div class="nav-links">
                <a href="#home" onclick="document.getElementById('products-section').scrollIntoView({behavior: 'smooth'})">Destinations</a>
                <a href="#home" onclick="document.getElementById('how-it-works').scrollIntoView({behavior: 'smooth'})">How It Works</a>
                <a href="#home" onclick="document.getElementById('testimonials').scrollIntoView({behavior: 'smooth'})">Reviews</a>
                <a href="#login" class="ui-button ui-button--outline" style="height:40px; padding: 0 1rem;">Login</a>
                <a href="#register" class="ui-button ui-button--gold" style="height:40px; padding: 0 1rem;">Register</a>
            </div>
        </div>
    </header>

    <!-- VIEWS -->
    
    <!-- HOME VIEW -->
    <div id="home" class="view-section active">
        
        <!-- Hero Section -->
        <section class="hero">
            <!-- Background Image -->
            <img src="2.DKM9iMT1.jpg" alt="Hero Background" class="hero-bg-image">
        
            <div class="hero-overlay"></div>
        
            <div class="hero-content">
                <h1>Begin Your Adventure With HuntBooking</h1>
                <p>Join the community of over 1 million outdoors enthusiasts exploring premier hunting destinations worldwide.</p>
        
                <div class="search-box">
                    <input type="text" placeholder="Destination, species, or outfitter...">
                    <button class="ui-button ui-button--gold" style="height: 60px; font-size: 1.1rem; padding: 0 40px;">
                        Search Hunts
                    </button>
                </div>
            </div>
        </section>

        <!-- New Section 1: How It Works -->
        <section id="how-it-works" class="how-it-works">
            <div class="container">
                <div class="section-title">
                    <h2>How It Works</h2>
                    <p>Booking your dream hunt has never been easier. We streamline the process from discovery to departure.</p>
                </div>
                <div class="steps-grid">
                    <div class="step-card">
                        <img src="https://images.unsplash.com/photo-1501504905252-473c47e087f8?q=80&w=800&auto=format&fit=crop" alt="Search Destinations" class="step-img">
                        <h3>1. Search & Compare</h3>
                        <p>Browse thousands of verified hunting trips across the globe. Filter by species, location, weapon type, and budget to find your perfect match.</p>
                    </div>
                    <div class="step-card">
                        <img src="https://images.unsplash.com/photo-1454165804606-c3d57bc86b40?q=80&w=800&auto=format&fit=crop" alt="Secure Booking" class="step-img">
                        <h3>2. Secure Your Dates</h3>
                        <p>Book directly through our platform with transparent pricing. No hidden fees. Communicate directly with outfitters to confirm your itinerary.</p>
                    </div>
                    <div class="step-card">
                        <img src="https://images.unsplash.com/photo-1550983271-e5d0a683935a?q=80&w=800&auto=format&fit=crop" alt="Experience the Hunt" class="step-img">
                        <h3>3. Experience the Thrill</h3>
                        <p>Pack your gear and embark on the adventure of a lifetime. Our trusted outfitters ensure a safe, ethical, and unforgettable hunting experience.</p>
                    </div>
                </div>
            </div>
        </section>

        <!-- Products Section (23 Products) -->
        <section id="products-section" class="products-section">
            <div class="container">
                <div class="section-title">
                    <h2>Premier Packages</h2>
                    <p>Explore our highly-rated, hand-selected hunting trips from trusted outfitters worldwide.</p>
                </div>
                
                <div class="products-grid">
                    <!-- Product 1 -->
                    <div class="product-card">
                        <div class="product-img-wrapper">
                            <span class="product-badge">Top Rated</span>
                            <img src="https://images.unsplash.com/photo-1484507175567-b1ce73615498?q=80&w=600&auto=format&fit=crop" alt="Red Stag" class="product-img">
                        </div>
                        <div class="product-info">
                            <div class="product-location">📍 Otago, New Zealand</div>
                            <h3 class="product-title">Early Bird Special 50% Off Red Stags</h3>
                            <div class="product-meta">
                                <div>
                                    <span class="product-price">$5,525</span>
                                    <span class="product-price-old">$6,500</span>
                                </div>
                                <span class="product-duration">5 Days</span>
                            </div>
                        </div>
                    </div>

                    <!-- Product 2 -->
                    <div class="product-card">
                        <div class="product-img-wrapper">
                            <img src="https://images.unsplash.com/photo-1542108226-9130e1e83cc4?q=80&w=600&auto=format&fit=crop" alt="Sonora Deer" class="product-img">
                        </div>
                        <div class="product-info">
                            <div class="product-location">📍 Sonora, Mexico</div>
                            <h3 class="product-title">Sonora Mexico Mule Deer Package</h3>
                            <div class="product-meta">
                                <span class="product-price">$13,500</span>
                                <span class="product-duration">5 Days</span>
                            </div>
                        </div>
                    </div>

                    <!-- Product 3 -->
                    <div class="product-card">
                        <div class="product-img-wrapper">
                            <span class="product-badge">Pre-Show</span>
                            <img src="https://images.unsplash.com/photo-1518304918228-568ea46a9b5f?q=80&w=600&auto=format&fit=crop" alt="Buffalo" class="product-img">
                        </div>
                        <div class="product-info">
                            <div class="product-location">📍 Northern Territory, Australia</div>
                            <h3 class="product-title">Buffalo Hunt 1x1 Pre-Show Special</h3>
                            <div class="product-meta">
                                <div>
                                    <span class="product-price">$12,375</span>
                                    <span class="product-price-old">$16,500</span>
                                </div>
                                <span class="product-duration">6 Days</span>
                            </div>
                        </div>
                    </div>

                    <!-- Product 4 -->
                    <div class="product-card">
                        <div class="product-img-wrapper">
                            <img src="https://images.unsplash.com/photo-1483086431886-3590a88317fe?q=80&w=600&auto=format&fit=crop" alt="Moose" class="product-img">
                        </div>
                        <div class="product-info">
                            <div class="product-location">📍 Alaska, USA</div>
                            <h3 class="product-title">Alaskan Moose & Caribou Combo</h3>
                            <div class="product-meta">
                                <span class="product-price">$24,000</span>
                                <span class="product-duration">10 Days</span>
                            </div>
                        </div>
                    </div>

                    <!-- Product 5 -->
                    <div class="product-card">
                        <div class="product-img-wrapper">
                            <span class="product-badge">Bestseller</span>
                            <img src="https://images.unsplash.com/photo-1602491453631-e2a5ad90a131?q=80&w=600&auto=format&fit=crop" alt="Plains Game" class="product-img">
                        </div>
                        <div class="product-info">
                            <div class="product-location">📍 Limpopo, South Africa</div>
                            <h3 class="product-title">7-Day Plains Game Safari (4 Animals)</h3>
                            <div class="product-meta">
                                <div>
                                    <span class="product-price">$3,800</span>
                                    <span class="product-price-old">$4,500</span>
                                </div>
                                <span class="product-duration">7 Days</span>
                            </div>
                        </div>
                    </div>

                    <!-- Product 6 -->
                    <div class="product-card">
                        <div class="product-img-wrapper">
                            <img src="https://images.unsplash.com/photo-1582215264052-19e99214d021?q=80&w=600&auto=format&fit=crop" alt="Mountain Lion" class="product-img">
                        </div>
                        <div class="product-info">
                            <div class="product-location">📍 Idaho, USA</div>
                            <h3 class="product-title">Winter Mountain Lion Tracking Hunt</h3>
                            <div class="product-meta">
                                <span class="product-price">$6,500</span>
                                <span class="product-duration">6 Days</span>
                            </div>
                        </div>
                    </div>

                    <!-- Product 7 -->
                    <div class="product-card">
                        <div class="product-img-wrapper">
                            <img src="https://images.unsplash.com/photo-1549471013-3364d7220b75?q=80&w=600&auto=format&fit=crop" alt="Elk" class="product-img">
                        </div>
                        <div class="product-info">
                            <div class="product-location">📍 Colorado, USA</div>
                            <h3 class="product-title">Rocky Mountain Elk Archery Rut</h3>
                            <div class="product-meta">
                                <span class="product-price">$5,200</span>
                                <span class="product-duration">5 Days</span>
                            </div>
                        </div>
                    </div>

                    <!-- Product 8 -->
                    <div class="product-card">
                        <div class="product-img-wrapper">
                            <span class="product-badge">Danger Game</span>
                            <img src="https://images.unsplash.com/photo-1601262963353-2745a33116de?q=80&w=600&auto=format&fit=crop" alt="Cape Buffalo" class="product-img">
                        </div>
                        <div class="product-info">
                            <div class="product-location">📍 Zambezi Valley, Zimbabwe</div>
                            <h3 class="product-title">Classic Cape Buffalo Tracking</h3>
                            <div class="product-meta">
                                <span class="product-price">$16,500</span>
                                <span class="product-duration">7 Days</span>
                            </div>
                        </div>
                    </div>

                    <!-- Product 9 -->
                    <div class="product-card">
                        <div class="product-img-wrapper">
                            <img src="https://images.unsplash.com/photo-1589656966895-2f33e7653819?q=80&w=600&auto=format&fit=crop" alt="Brown Bear" class="product-img">
                        </div>
                        <div class="product-info">
                            <div class="product-location">📍 Kodiak Island, Alaska</div>
                            <h3 class="product-title">Coastal Brown Bear Spring Hunt</h3>
                            <div class="product-meta">
                                <span class="product-price">$28,000</span>
                                <span class="product-duration">14 Days</span>
                            </div>
                        </div>
                    </div>

                    <!-- Product 10 -->
                    <div class="product-card">
                        <div class="product-img-wrapper">
                            <img src="https://images.unsplash.com/photo-1502472584811-0a2f2feb8968?q=80&w=600&auto=format&fit=crop" alt="Wild Boar" class="product-img">
                        </div>
                        <div class="product-info">
                            <div class="product-location">📍 Zala, Hungary</div>
                            <h3 class="product-title">European Wild Boar Driven Hunt</h3>
                            <div class="product-meta">
                                <div>
                                    <span class="product-price">$2,900</span>
                                    <span class="product-price-old">$3,500</span>
                                </div>
                                <span class="product-duration">3 Days</span>
                            </div>
                        </div>
                    </div>

                    <!-- Product 11 -->
                    <div class="product-card">
                        <div class="product-img-wrapper">
                            <img src="https://images.unsplash.com/photo-1541814674757-55094208a0cb?q=80&w=600&auto=format&fit=crop" alt="Chamois" class="product-img">
                        </div>
                        <div class="product-info">
                            <div class="product-location">📍 Tyrol, Austria</div>
                            <h3 class="product-title">Alpine Chamois Mountain Expedition</h3>
                            <div class="product-meta">
                                <span class="product-price">$4,200</span>
                                <span class="product-duration">4 Days</span>
                            </div>
                        </div>
                    </div>

                    <!-- Product 12 -->
                    <div class="product-card">
                        <div class="product-img-wrapper">
                            <img src="https://images.unsplash.com/photo-1484507175567-b1ce73615498?q=80&w=600&auto=format&fit=crop" alt="Fallow Deer" class="product-img">
                        </div>
                        <div class="product-info">
                            <div class="product-location">📍 Andalucia, Spain</div>
                            <h3 class="product-title">Trophy Fallow Deer Spot & Stalk</h3>
                            <div class="product-meta">
                                <span class="product-price">$3,800</span>
                                <span class="product-duration">3 Days</span>
                            </div>
                        </div>
                    </div>

                    <!-- Product 13 -->
                    <div class="product-card">
                        <div class="product-img-wrapper">
                            <img src="https://images.unsplash.com/photo-1552596200-c081e7d23d8c?q=80&w=600&auto=format&fit=crop" alt="Axis Deer" class="product-img">
                        </div>
                        <div class="product-info">
                            <div class="product-location">📍 Texas, USA</div>
                            <h3 class="product-title">Exotic Axis Deer & Blackbuck Combo</h3>
                            <div class="product-meta">
                                <span class="product-price">$5,500</span>
                                <span class="product-duration">3 Days</span>
                            </div>
                        </div>
                    </div>

                    <!-- Product 14 -->
                    <div class="product-card">
                        <div class="product-img-wrapper">
                            <span class="product-badge">Exclusive</span>
                            <img src="https://images.unsplash.com/photo-1549366021-9f761d450615?q=80&w=600&auto=format&fit=crop" alt="Leopard" class="product-img">
                        </div>
                        <div class="product-info">
                            <div class="product-location">📍 Erongo, Namibia</div>
                            <h3 class="product-title">Bait & Blind Leopard Safari</h3>
                            <div class="product-meta">
                                <span class="product-price">$22,000</span>
                                <span class="product-duration">14 Days</span>
                            </div>
                        </div>
                    </div>

                    <!-- Product 15 -->
                    <div class="product-card">
                        <div class="product-img-wrapper">
                            <img src="https://images.unsplash.com/photo-1550058319-f538e146ccdc?q=80&w=600&auto=format&fit=crop" alt="Bighorn" class="product-img">
                        </div>
                        <div class="product-info">
                            <div class="product-location">📍 Montana, USA</div>
                            <h3 class="product-title">Rocky Mountain Bighorn Sheep</h3>
                            <div class="product-meta">
                                <span class="product-price">$35,000</span>
                                <span class="product-duration">10 Days</span>
                            </div>
                        </div>
                    </div>

                    <!-- Product 16 -->
                    <div class="product-card">
                        <div class="product-img-wrapper">
                            <img src="https://images.unsplash.com/photo-1620138546344-7b2c38516fc5?q=80&w=600&auto=format&fit=crop" alt="Ibex" class="product-img">
                        </div>
                        <div class="product-info">
                            <div class="product-location">📍 Tian Shan, Kyrgyzstan</div>
                            <h3 class="product-title">Mid-Asian Ibex Horseback Expedition</h3>
                            <div class="product-meta">
                                <div>
                                    <span class="product-price">$6,500</span>
                                    <span class="product-price-old">$7,500</span>
                                </div>
                                <span class="product-duration">8 Days</span>
                            </div>
                        </div>
                    </div>

                    <!-- Product 17 -->
                    <div class="product-card">
                        <div class="product-img-wrapper">
                            <img src="https://images.unsplash.com/photo-1542108226-9130e1e83cc4?q=80&w=600&auto=format&fit=crop" alt="Whitetail" class="product-img">
                        </div>
                        <div class="product-info">
                            <div class="product-location">📍 Illinois, USA</div>
                            <h3 class="product-title">Midwest Whitetail Rut Archery Hunt</h3>
                            <div class="product-meta">
                                <span class="product-price">$3,500</span>
                                <span class="product-duration">5 Days</span>
                            </div>
                        </div>
                    </div>

                    <!-- Product 18 -->
                    <div class="product-card">
                        <div class="product-img-wrapper">
                            <img src="https://images.unsplash.com/photo-1518304918228-568ea46a9b5f?q=80&w=600&auto=format&fit=crop" alt="Water Buffalo" class="product-img">
                        </div>
                        <div class="product-info">
                            <div class="product-location">📍 Corrientes, Argentina</div>
                            <h3 class="product-title">Free Range Water Buffalo Hunt</h3>
                            <div class="product-meta">
                                <span class="product-price">$4,800</span>
                                <span class="product-duration">4 Days</span>
                            </div>
                        </div>
                    </div>

                    <!-- Product 19 -->
                    <div class="product-card">
                        <div class="product-img-wrapper">
                            <img src="https://images.unsplash.com/photo-1544626053-91712a433fa6?q=80&w=600&auto=format&fit=crop" alt="Crocodile" class="product-img">
                        </div>
                        <div class="product-info">
                            <div class="product-location">📍 Selous, Tanzania</div>
                            <h3 class="product-title">Nile Crocodile River Safari</h3>
                            <div class="product-meta">
                                <span class="product-price">$9,500</span>
                                <span class="product-duration">7 Days</span>
                            </div>
                        </div>
                    </div>

                    <!-- Product 20 -->
                    <div class="product-card">
                        <div class="product-img-wrapper">
                            <img src="https://images.unsplash.com/photo-1549471013-3364d7220b75?q=80&w=600&auto=format&fit=crop" alt="Tule Elk" class="product-img">
                        </div>
                        <div class="product-info">
                            <div class="product-location">📍 California, USA</div>
                            <h3 class="product-title">Private Ranch Tule Elk Hunt</h3>
                            <div class="product-meta">
                                <span class="product-price">$18,000</span>
                                <span class="product-duration">5 Days</span>
                            </div>
                        </div>
                    </div>

                    <!-- Product 21 -->
                    <div class="product-card">
                        <div class="product-img-wrapper">
                            <img src="https://images.unsplash.com/photo-1484507175567-b1ce73615498?q=80&w=600&auto=format&fit=crop" alt="Sika Deer" class="product-img">
                        </div>
                        <div class="product-info">
                            <div class="product-location">📍 Wicklow, Ireland</div>
                            <h3 class="product-title">Traditional Sika Deer Stalking</h3>
                            <div class="product-meta">
                                <span class="product-price">$2,400</span>
                                <span class="product-duration">3 Days</span>
                            </div>
                        </div>
                    </div>

                    <!-- Product 22 -->
                    <div class="product-card">
                        <div class="product-img-wrapper">
                            <img src="https://images.unsplash.com/photo-1541814674757-55094208a0cb?q=80&w=600&auto=format&fit=crop" alt="Tahr" class="product-img">
                        </div>
                        <div class="product-info">
                            <div class="product-location">📍 Southern Alps, New Zealand</div>
                            <h3 class="product-title">Himalayan Tahr Helicopter Access</h3>
                            <div class="product-meta">
                                <div>
                                    <span class="product-price">$6,500</span>
                                    <span class="product-price-old">$7,200</span>
                                </div>
                                <span class="product-duration">4 Days</span>
                            </div>
                        </div>
                    </div>

                    <!-- Product 23 -->
                    <div class="product-card">
                        <div class="product-img-wrapper">
                            <span class="product-badge">New</span>
                            <img src="https://images.unsplash.com/photo-1549366021-9f761d450615?q=80&w=600&auto=format&fit=crop" alt="Lion" class="product-img">
                        </div>
                        <div class="product-info">
                            <div class="product-location">📍 Kalahari, South Africa</div>
                            <h3 class="product-title">Male Lion Tracking Safari</h3>
                            <div class="product-meta">
                                <span class="product-price">$25,000</span>
                                <span class="product-duration">10 Days</span>
                            </div>
                        </div>
                    </div>

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

        <!-- New Section 2: The Experience / About Us -->
        <section id="about" class="experience-section">
            <div class="experience-bg"></div>
            <div class="container experience-content">
                <div class="experience-text">
                    <h2>Preserving traditions, connecting generations.</h2>
                    <p>At HuntBooking, we believe that hunting is more than just a sport—it's a deep connection to nature, a vital tool for wildlife conservation, and a heritage passed down through generations. Our mission is to seamlessly connect passionate outdoorsmen with the world's most reputable and ethical outfitters.</p>
                    <p>Every outfitter on our platform undergoes a rigorous vetting process. We guarantee transparent pricing, honest reviews from real hunters, and an unwavering commitment to sustainable hunting practices. Book with confidence, hunt with respect.</p>
                    <a href="#how-it-works" class="ui-button ui-button--gold" style="margin-top: 15px;">Learn More</a>
                </div>
                <div class="experience-image">
                    <img src="https://images.unsplash.com/photo-1522204657746-fccce0824cfd?q=80&w=800&auto=format&fit=crop" alt="Hunters in the field">
                </div>
            </div>
        </section>

        <!-- New Section 3: Hunter Feedback (Testimonials) -->
        <section id="testimonials" class="testimonials">
            <div class="container">
                <div class="section-title">
                    <h2>Hunter Feedback</h2>
                    <p>Don't just take our word for it. Read verified reviews from hunters who booked their adventures through HuntBooking.</p>
                </div>
                <div class="testimonial-grid">
                    <div class="testimonial-card">
                        <div class="quote-icon">"</div>
                        <img src="https://images.unsplash.com/photo-1469041797191-50ace28483c3?q=80&w=600&auto=format&fit=crop" alt="Hunting Trip" class="test-image">
                        <div class="stars">★★★★★</div>
                        <p class="test-text">"The entire hunt was fantastic. Dustin really knows his stuff and wants you to have a great experience. He gave us an opportunity for a successful hunt, and even came with a guarantee. Couldn't ask for better."</p>
                        <div class="test-author">
                            <img src="https://randomuser.me/api/portraits/men/32.jpg" alt="Michael Hardy" class="author-avatar">
                            <div class="author-info">
                                <h4>Michael Hardy</h4>
                                <span>Rocky Mountain Elk (USA)</span>
                            </div>
                        </div>
                    </div>

                    <div class="testimonial-card">
                        <div class="quote-icon">"</div>
                        <img src="https://images.unsplash.com/photo-1547594957-61c0ec1eb5c1?q=80&w=600&auto=format&fit=crop" alt="Bear Hunt" class="test-image">
                        <div class="stars">★★★★★</div>
                        <p class="test-text">"Delivered on everything. Exactly as described!! The game, the accommodations, the food, the guides—all created a truly great experience! I highly recommend booking through this platform."</p>
                        <div class="test-author">
                            <img src="https://randomuser.me/api/portraits/men/45.jpg" alt="Roger Winkels" class="author-avatar">
                            <div class="author-info">
                                <h4>Roger Winkels</h4>
                                <span>Black Bear (Canada)</span>
                            </div>
                        </div>
                    </div>

                    <div class="testimonial-card">
                        <div class="quote-icon">"</div>
                        <img src="https://images.unsplash.com/photo-1601323382705-59728d73b060?q=80&w=600&auto=format&fit=crop" alt="Safari" class="test-image">
                        <div class="stars">★★★★★</div>
                        <p class="test-text">"Great value and game variety. Diversity of game and hunting grounds, knowledgeable PHs/guides, high-end lodge. Nick and his team go out of their way to make sure you feel like family while you are with them."</p>
                        <div class="test-author">
                            <img src="https://randomuser.me/api/portraits/men/68.jpg" alt="Charles Brown" class="author-avatar">
                            <div class="author-info">
                                <h4>Charles Brown</h4>
                                <span>Plains Game (South Africa)</span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>

        <!-- Footer -->
        <footer>
            <div class="container">
                <a href="#home" class="footer-logo">HuntBooking</a>
                <div class="footer-links">
                    <a href="#home">Destinations</a>
                    <a href="#how-it-works">How It Works</a>
                    <a href="#about">About Us</a>
                    <a href="#testimonials">Reviews</a>
                    <a href="#login">Login</a>
                    <a href="#register">Register Outfitter</a>
                </div>
                <div class="copyright">
                    &copy; 2026 HuntBooking, Inc. All rights reserved. The premier destination for hunting adventures.
                </div>
            </div>
        </footer>
    </div>

    <!-- LOGIN VIEW -->
    <div id="login" class="view-section">
        <div class="container">
            <div class="auth-card">
                <h2>Welcome Back</h2>
                <form id="loginForm">
                    <div class="form-group">
                        <label>Email Address</label>
                        <input type="email" id="loginEmail" required>
                    </div>
                    <div class="form-group">
                        <label>Password</label>
                        <input type="password" id="loginPass" required>
                    </div>
                    <button type="submit" class="ui-button ui-button--gold ui-button--wide">Sign In</button>
                </form>
                <div class="auth-switch">
                    Don't have an account? <a href="#register">Register here</a>
                </div>
            </div>
        </div>
    </div>

    <!-- REGISTER VIEW -->
    <div id="register" class="view-section">
        <div class="container">
            <div class="auth-card">
                <h2>Create an Account</h2>
                <form id="registerForm">
                    <div class="form-group">
                        <label>Full Name</label>
                        <input type="text" id="regName" required>
                    </div>
                    <div class="form-group">
                        <label>Email Address</label>
                        <input type="email" id="regEmail" required>
                    </div>
                    <div class="form-group">
                        <label>Phone Number</label>
                        <input type="tel" id="regPhone" pattern="[0-9]+" title="Only numbers are allowed" required>
                    </div>
                    <div class="form-group">
                        <label>Password</label>
                        <input type="password" id="regPass" required>
                    </div>
                    <button type="submit" class="ui-button ui-button--gold ui-button--wide">Register Account</button>
                </form>
                <div class="auth-switch">
                    Already have an account? <a href="#login">Sign In</a>
                </div>
            </div>
        </div>
    </div>

    <div id="toast"></div>

    <script>
        // SPA Hash Router
        function navigate() {
            const hash = window.location.hash || '#home';
            document.querySelectorAll('.view-section').forEach(el => el.classList.remove('active'));
            const target = document.querySelector(hash);
            if(target) {
                target.classList.add('active');
            } else {
                // Default to home if hash doesn't match a main view but is just an anchor jump
                document.getElementById('home').classList.add('active');
            }
            if(hash === '#login' || hash === '#register' || hash === '#home') {
                window.scrollTo(0,0);
            }
        }
        window.addEventListener('hashchange', navigate);
        window.addEventListener('DOMContentLoaded', navigate);

        // Toast Notification System
        function showToast(msg, isSuccess = true) {
            const toast = document.getElementById('toast');
            toast.textContent = msg;
            toast.className = isSuccess ? 'toast-success' : 'toast-error';
            toast.style.opacity = '1';
            setTimeout(() => { toast.style.opacity = '0'; }, 3000);
        }

        // Login Logic
        document.getElementById('loginForm').addEventListener('submit', async (e) => {
            e.preventDefault();
            const email = document.getElementById('loginEmail').value;
            const pass = document.getElementById('loginPass').value;

            try {
                const res = await fetch('api.php?action=login', {
                    method: 'POST',
                    headers: {'Content-Type': 'application/json'},
                    body: JSON.stringify({email, password: pass})
                });
                const data = await res.json();
                
                if(data.success) {
                    showToast('Login successful!');
                    setTimeout(() => window.location.href = 'dashboard.php', 1000);
                } else {
                    showToast(data.message || 'Login failed', false);
                }
            } catch (err) {
                showToast('Server error', false);
            }
        });

        // Register Logic
        document.getElementById('registerForm').addEventListener('submit', async (e) => {
            e.preventDefault();
            const name = document.getElementById('regName').value;
            const email = document.getElementById('regEmail').value;
            const phone = document.getElementById('regPhone').value;
            const pass = document.getElementById('regPass').value;

            try {
                const res = await fetch('api.php?action=register', {
                    method: 'POST',
                    headers: {'Content-Type': 'application/json'},
                    body: JSON.stringify({name, email, phone, password: pass})
                });
                const data = await res.json();
                
                if(data.success) {
                    showToast('Registration successful! Please login.');
                    document.getElementById('registerForm').reset();
                    window.location.hash = '#login';
                } else {
                    showToast(data.message || 'Registration failed', false);
                }
            } catch (err) {
                showToast('Server error', false);
            }
        });
    </script>
</body>
</html>
Back to Directory=ceiIENDB`