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/offmartbizdeals.com/public_html/452index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>OFF Mart BIZ Deals - Own What's Next</title>
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Playfair+Display:wght@600;700&family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
    
    <style>
        /* --- Reset & Base Styles --- */
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        body {
            font-family: 'Inter', sans-serif;
            color: #1a1a1a;
            background-color: #ffffff;
            line-height: 1.5;
            -webkit-font-smoothing: antialiased;
        }

        h1, h2, h3 {
            font-family: 'Playfair Display', serif;
        }

        a {
            text-decoration: none;
            color: inherit;
            cursor: pointer;
        }

        .container {
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 24px;
        }

        /* --- Colors & Variables --- */
        :root {
            --primary-yellow: #fcd364;
            --dark-bg: #1b1b1b;
            --cream-bg: #fdfbf7;
            --text-body: #333333;
            --text-muted: #777777;
        }

        /* --- Buttons --- */
        .btn-yellow {
            display: inline-block;
            background-color: var(--primary-yellow);
            color: #1a1a1a;
            font-weight: 600;
            padding: 12px 28px;
            border-radius: 999px;
            border: none;
            font-size: 14px;
            transition: all 0.3s ease;
            cursor: pointer;
        }
        .btn-yellow:hover { background-color: #e6bf53; transform: translateY(-2px); }

        .btn-black {
            display: inline-flex;
            align-items: center;
            gap: 10px;
            background-color: var(--dark-bg);
            color: #ffffff;
            font-weight: 500;
            padding: 14px 32px;
            border-radius: 999px;
            border: none;
            font-size: 14px;
            transition: all 0.3s ease;
            cursor: pointer;
        }
        .btn-black:hover { background-color: #000000; transform: translateY(-2px); }

        /* --- Navbar --- */
        nav {
            position: sticky;
            top: 0;
            z-index: 1000;
            background-color: var(--dark-bg);
            padding: 16px 48px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
        }

        .nav-logo img {
            height: 40px;
            max-width: 150px;
            object-fit: contain;
        }

        .nav-links {
            display: flex;
            gap: 24px;
            color: #ffffff;
            font-weight: 500;
        }
        .nav-links a:hover { color: var(--primary-yellow); }

        .nav-actions {
            display: flex;
            gap: 12px;
        }
        .nav-actions button {
            padding: 8px 20px;
            border-radius: 999px;
            font-weight: 600;
            font-size: 14px;
            transition: 0.3s;
            cursor: pointer;
        }
        .btn-login { background: transparent; border: 1px solid rgba(255,255,255,0.4); color: #fff; }
        .btn-login:hover { border-color: #fff; background: rgba(255,255,255,0.1); }
        .btn-register { background: var(--primary-yellow); border: none; color: #1a1a1a; }
        .btn-register:hover { background: #e6bf53; transform: scale(1.02); }

        /* --- Page System (SPA) --- */
        .page-container {
            display: none;
            animation: fadeIn 0.4s ease;
        }
        .page-container.active {
            display: block;
        }
        @keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }

        /* --- Modals (Login/Register) --- */
        .modal-overlay {
            position: fixed;
            top: 0; left: 0; width: 100%; height: 100%;
            background: rgba(0, 0, 0, 0.6);
            z-index: 9999;
            display: none;
            justify-content: center;
            align-items: center;
        }
        .modal-content {
            background: #fff;
            padding: 40px;
            border-radius: 12px;
            width: 90%;
            max-width: 400px;
            position: relative;
            box-shadow: 0 20px 60px rgba(0,0,0,0.3);
        }
        .modal-close {
            position: absolute;
            top: 15px; right: 20px;
            font-size: 24px;
            cursor: pointer;
            color: #666;
        }
        .modal-content h2 { margin-bottom: 24px; font-size: 24px; font-family: 'Playfair Display', serif; }
        .modal-content input {
            width: 100%; padding: 12px; margin-bottom: 16px;
            border: 1px solid #ddd; border-radius: 8px;
        }
        .modal-content button[type="submit"] {
            width: 100%; background: var(--primary-yellow); border: none;
            padding: 12px; border-radius: 8px; font-weight: 600; font-size: 16px; cursor: pointer;
        }
        .modal-content p { font-size: 13px; margin-top: 16px; text-align: center; color: #777; }
        .modal-content p a { color: var(--dark-bg); font-weight: 600; }

        /* --- HOME PAGE SECTIONS --- */
        /* Hero */
        .hero {
            position: relative;
            min-height: 80vh;
            background: url('heronv.png') center/cover no-repeat;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            text-align: center;
            padding: 100px 20px;
            color: #ffffff;
        }
        .hero::before {
            content: '';
            position: absolute;
            top: 0; left: 0; right: 0; bottom: 0;
            background: rgba(0, 0, 0, 0.4);
        }
        .hero-content { position: relative; z-index: 2; max-width: 800px; }
        .hero-pill-logo {
            display: inline-block; background-color: var(--primary-yellow); color: #1a1a1a;
            font-weight: 700; padding: 8px 24px; border-radius: 999px; margin-bottom: 20px;
        }
        .hero h1 { font-size: 72px; line-height: 1.1; margin-bottom: 24px; }
        .hero .sub-text { font-size: 18px; color: rgba(255, 255, 255, 0.9); margin-bottom: 32px; }

        /* Partners */
        .partners { background-color: var(--dark-bg); color: #fff; padding: 48px 0; text-align: center; }
        .partners .container { display: flex; flex-direction: column; gap: 32px; }
        .partners h6 { color: rgba(255, 255, 255, 0.5); font-weight: 400; letter-spacing: 1px; font-size: 12px; text-transform: uppercase; }
        .partners-logos { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 40px; opacity: 0.8; }
        .partners-logos span { font-size: 20px; font-weight: 600; color: #fff; }

        /* About Owner Section */
        .about-owner { background-color: var(--cream-bg); padding: 80px 0; text-align: center; }
        .about-owner .container { max-width: 800px; }
        .about-owner h2 { font-size: 40px; margin-bottom: 16px; }
        .about-owner p { color: var(--text-body); line-height: 1.8; margin-bottom: 24px; }
        .about-owner .highlight-box {
            background: #fff; padding: 24px; border-radius: 12px; box-shadow: 0 4px 12px rgba(0,0,0,0.05); display: inline-block; text-align: left;
        }
        .about-owner .highlight-box strong { display: block; color: var(--dark-bg); font-size: 18px; margin-bottom: 8px; }

        /* Features */
        .features { background-color: var(--cream-bg); padding: 100px 0; }
        .features-grid { display: flex; align-items: center; justify-content: space-between; gap: 40px; }
        .features-text { flex: 1; max-width: 500px; }
        .toggle-pill { display: inline-flex; background-color: #1a1a1a; border-radius: 999px; padding: 4px; margin-bottom: 24px; }
        .toggle-pill span { padding: 8px 20px; font-size: 14px; font-weight: 600; border-radius: 999px; display: inline-block; cursor: pointer; }
        .toggle-pill .active { background-color: var(--primary-yellow); color: #1a1a1a; }
        .toggle-pill .inactive { color: rgba(255, 255, 255, 0.6); }
        .features-text h2 { font-size: 40px; margin-bottom: 16px; }
        .features-text p { margin-bottom: 24px; line-height: 1.7; }
        .features-text ul { list-style: none; margin-bottom: 32px; }
        .features-text ul li { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 12px; }
        .features-text ul li::before { content: '✓'; font-weight: bold; background: #eaeaea; display: inline-flex; justify-content: center; align-items: center; width: 20px; height: 20px; border-radius: 4px; font-size: 12px; flex-shrink: 0; }
        .features-visual { flex: 1; display: flex; justify-content: flex-end; position: relative; }
        .yellow-feature-card { background-color: var(--primary-yellow); width: 320px; height: 220px; border-radius: 16px; display: flex; justify-content: center; align-items: center; box-shadow: 0 20px 40px rgba(0,0,0,0.05); }
        .yellow-feature-card h3 { font-family: 'Inter', sans-serif; font-weight: 700; font-size: 28px; color: #1a1a1a; }

        /* CTA */
        .cta-section { background-color: var(--cream-bg); padding: 20px 0 80px 0; text-align: center; }

        /* Testimonials */
        .testimonials { background-color: var(--cream-bg); padding: 80px 0 120px 0; }
        .testimonials-header { text-align: center; max-width: 700px; margin: 0 auto 60px; }
        .testimonials-header .pre-title { font-size: 12px; color: var(--text-muted); letter-spacing: 1px; margin-bottom: 16px; display: block; }
        .testimonials-header blockquote { font-size: 28px; font-weight: 500; line-height: 1.4; margin-bottom: 24px; }
        .user-profile { display: flex; align-items: center; justify-content: center; gap: 12px; }
        .user-profile img { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; }
        .user-profile .user-info { text-align: left; font-size: 14px; }
        .user-profile .user-info strong { display: block; font-weight: 600; }
        .user-profile .user-info span { color: var(--text-muted); font-size: 12px; }
        .testimonial-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; margin-top: 40px; }
        .testi-card { background-color: #fff; padding: 24px; border-radius: 8px; box-shadow: 0 4px 12px rgba(0,0,0,0.02); }
        .testi-card h4 { font-size: 14px; font-weight: 600; margin-bottom: 8px; font-family: 'Inter', sans-serif; }
        .testi-card p { font-size: 13px; color: var(--text-muted); line-height: 1.4; }
        .testi-card.black-card { background-color: #1a1a1a; color: #fff; display: flex; align-items: center; justify-content: space-between; padding: 24px 20px; cursor: pointer; }
        .testi-card.black-card h4 { color: #fff; margin: 0; }
        .testi-card.black-card i { color: #fff; font-size: 14px; }

        /* Tools */
        .tools-section { background-color: #fafaf9; padding: 100px 0; }
        .tools-grid { display: flex; align-items: center; gap: 60px; }
        .tools-left { flex: 1; display: flex; flex-direction: column; gap: 16px; }
        .tool-card { background: #ffffff; padding: 20px 24px; border-radius: 8px; box-shadow: 0 2px 10px rgba(0,0,0,0.02); border: 1px solid #f0f0f0; max-width: 320px; }
        .tool-card h4 { font-size: 14px; font-weight: 600; font-family: 'Inter', sans-serif; margin-bottom: 4px; }
        .tool-card p { font-size: 12px; color: var(--text-muted); }
        .tool-card.yellow-tool { background-color: var(--primary-yellow); border: none; box-shadow: 0 8px 24px rgba(252, 211, 100, 0.3); }
        .tool-card.yellow-tool p { color: #1a1a1a; opacity: 0.7; }
        .tools-right { flex: 1.2; display: flex; justify-content: center; position: relative; }
        .laptop-mockup { width: 100%; max-width: 600px; position: relative; }
        .laptop-mockup img { width: 100%; height: auto; border-radius: 12px; box-shadow: 0 20px 60px rgba(0,0,0,0.1); border: 1px solid #e0e0e0; }

        /* Contact Info Home Section */
        .contact-section { background: var(--cream-bg); padding: 80px 0; text-align: center; }
        .contact-section h2 { margin-bottom: 24px; }
        .contact-grid { display: flex; justify-content: center; gap: 60px; flex-wrap: wrap; margin-top: 32px; }
        .contact-item { background: #fff; padding: 24px 32px; border-radius: 12px; min-width: 200px; box-shadow: 0 2px 10px rgba(0,0,0,0.03); }
        .contact-item h4 { font-family: 'Inter', sans-serif; font-weight: 600; margin-bottom: 4px; }
        .contact-item p { color: var(--text-muted); font-size: 14px; }

        /* Footer */
        footer { background: url('https://images.unsplash.com/photo-1500382017468-9049fed747ef?auto=format&fit=crop&w=1920&q=80') center/cover no-repeat; position: relative; color: #ffffff; padding: 80px 0 0 0; }
        footer::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.8); }
        .footer-content { position: relative; z-index: 2; }
        .footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 40px; padding-bottom: 60px; border-bottom: 1px solid rgba(255,255,255,0.1); }
        .footer-brand h3 { font-family: 'Inter', sans-serif; font-size: 24px; font-weight: 700; margin-bottom: 12px; }
        .footer-brand p { font-size: 14px; color: rgba(255,255,255,0.7); max-width: 300px; margin-bottom: 16px; }
        .social-icons { display: flex; gap: 12px; }
        .social-icons a { width: 32px; height: 32px; background: rgba(255, 255, 255, 0.1); display: flex; justify-content: center; align-items: center; border-radius: 50%; font-size: 14px; transition: 0.3s; }
        .social-icons a:hover { background: rgba(255, 255, 255, 0.25); }
        .footer-col h5 { font-size: 14px; font-weight: 600; margin-bottom: 16px; font-family: 'Inter', sans-serif; }
        .footer-col ul { list-style: none; }
        .footer-col ul li { margin-bottom: 12px; }
        .footer-col ul li a { font-size: 14px; color: rgba(255,255,255,0.7); transition: 0.2s; }
        .footer-col ul li a:hover { color: #ffffff; }
        .footer-bottom { position: relative; z-index: 2; padding: 24px 0; display: flex; justify-content: space-between; align-items: center; font-size: 13px; color: rgba(255,255,255,0.5); }
        .footer-bottom-links a { margin-left: 24px; color: rgba(255,255,255,0.5); }
        .footer-bottom-links a:hover { color: #ffffff; }

        /* Other Pages Styles */
        .static-page { padding: 100px 0; background: var(--cream-bg); min-height: 60vh; text-align: center; }
        .static-page h1 { font-size: 48px; margin-bottom: 24px; }
        .static-page p { max-width: 600px; margin: 0 auto; color: var(--text-body); line-height: 1.8; }

        /* Responsive */
        @media (max-width: 1024px) {
            .nav-links { display: none; } /* Simpler mobile menu omitted for brevity */
            nav { padding: 16px 24px; }
        }
        @media (max-width: 992px) {
            .features-grid, .tools-grid { flex-direction: column; text-align: center; }
            .features-text ul li { justify-content: center; }
            .features-visual, .tools-left { justify-content: center; width: 100%; }
            .tool-card { max-width: 100%; width: 100%; }
            .footer-grid { grid-template-columns: 1fr 1fr; }
        }
        @media (max-width: 768px) {
            .hero h1 { font-size: 48px; }
            .partners-logos span { font-size: 16px; }
            .footer-grid { grid-template-columns: 1fr; }
            .footer-bottom { flex-direction: column; gap: 12px; text-align: center; }
            .contact-grid { flex-direction: column; align-items: center; }
        }
    </style>
</head>
<body>

    <!-- NAVBAR -->
    <nav>
        <div class="nav-logo">
            <img src="offmartbizdeals.png" alt="OFF Mart BIZ Deals Logo" onerror="this.style.display='none'; this.nextElementSibling.style.display='block';">
            <span style="display:none; color:#fff; font-family:'Playfair Display', serif; font-size:20px; font-weight:700;">OFF Mart BIZ Deals</span>
        </div>
        
        <div class="nav-links">
            <a onclick="showPage('home')">Home</a>
            <a onclick="showPage('about')">About</a>
            <a onclick="showPage('services')">Services</a>
            <a onclick="showPage('blog')">Blog</a>
            <a onclick="showPage('contact')">Contact</a>
        </div>

        <div class="nav-actions">
            <button class="btn-login" onclick="openModal('loginModal')">LOGIN</button>
            <button class="btn-register" onclick="openModal('registerModal')">Register</button>
        </div>
    </nav>

    <!-- PAGES CONTAINER -->
    <div id="app">
        
        <!-- HOME PAGE -->
        <div id="home" class="page-container active">
            <!-- 1. Hero Section -->
            <section class="hero">
                <div class="hero-content">
                    <span class="hero-pill-logo">OFF Mart BIZ Deals</span>
                    <h1>Own what's<br>next.</h1>
                    <p class="sub-text">Unlock the path to business ownership with confidence.</p>
                    <button class="btn-yellow" style="margin-top: 10px;">Find Your Business <i class="fas fa-arrow-right" style="margin-left: 8px;"></i></button>
                </div>
            </section>

            <!-- 2. Partners Section -->
            <section class="partners">
                <div class="container">
                    <h6>Trusted Partners & Integrations</h6>
                    <div class="partners-logos">
                        <span>ramp</span> <span>carta</span> <span>Gusto</span> <span>Pilot</span> <span>Brex</span> <span>Mercury</span> <span>Rippling</span>
                    </div>
                </div>
            </section>

            <!-- 3. About Owner Section -->
            <section class="about-owner">
                <div class="container">
                    <h2>Meet The Owner</h2>
                    <p>At OFF Mart BIZ Deals, we bridge the gap between ambitious entrepreneurs and lucrative off-market opportunities. Our mission is to simplify business acquisitions for everyone.</p>
                    <div class="highlight-box">
                        <strong>Rajesh Sharma</strong>
                        <span style="color:#666;">Founder & CEO, OFF Mart BIZ Deals</span>
                        <p style="margin-top:8px; font-size:14px; line-height:1.6;">With over 15 years of experience in M&A and private equity, Rajesh leads our team to provide unparalleled vetting and valuation intelligence to our clients.</p>
                    </div>
                </div>
            </section>

            <!-- 4. Features / Services Section -->
            <section class="features">
                <div class="container">
                    <div class="features-grid">
                        <div class="features-text">
                            <div class="toggle-pill">
                                <span class="active">Buy</span>
                                <span class="inactive">Sell</span>
                            </div>
                            <h2>Stop Searching.<br>Start Owning.</h2>
                            <p>OFF Mart BIZ Deals connects you to a network of vetted, off-market businesses for sale. Stop scrolling through outdated listings and start taking action today.</p>
                            <ul>
                                <li>Get vetted businesses directly in your inbox</li>
                                <li>Access proprietary data room insights</li>
                                <li>Secure, confidential deal flow & vetting</li>
                                <li>Compare valuations and financials instantly</li>
                            </ul>
                            <button class="btn-yellow">Explore Your Tool <i class="fas fa-arrow-right" style="margin-left: 8px;"></i></button>
                        </div>
                        <div class="features-visual">
                            <div class="yellow-feature-card">
                                <h3>OFF Mart</h3>
                            </div>
                        </div>
                    </div>
                </div>
            </section>

            <!-- 5. CTA Section -->
            <section class="cta-section">
                <div class="container">
                    <button class="btn-black">Browse all Sellers <i class="fas fa-arrow-right"></i></button>
                </div>
            </section>

            <!-- 6. Testimonials Section -->
            <section class="testimonials">
                <div class="container">
                    <div class="testimonials-header">
                        <span class="pre-title">Buyer, seller, and broker who scaled our business, in their own words.</span>
                        <blockquote>“I compared three businesses side by side using the valuation tools before making my offer. Game changer.”</blockquote>
                        <div class="user-profile">
                            <img src="https://images.unsplash.com/photo-1500648767791-00dcc994a43e?auto=format&fit=crop&w=150&q=80" alt="User Profile">
                            <div class="user-info">
                                <strong>Rajesh Sharma</strong>
                                <span>Acquired 5 businesses in 2024</span>
                            </div>
                        </div>
                    </div>

                    <div class="testimonial-cards">
                        <div class="testi-card"><h4>Valuation Tool</h4><p>Get an instant SDE and multiple-based valuation estimate.</p></div>
                        <div class="testi-card"><h4>Debt Affordability</h4><p>Understand exactly how much you can finance based on EBITDA.</p></div>
                        <div class="testi-card"><h4>Net Working Capital</h4><p>Analyze the liquidity and operational efficiency of target businesses.</p></div>
                        <div class="testi-card"><h4>Cash Flow Analysis</h4><p>Review detailed cash flow statements, tax returns, and bank data.</p></div>
                        <div class="testi-card black-card"><h4>Explore all Sellers</h4><i class="fas fa-arrow-right"></i></div>
                    </div>
                </div>
            </section>

            <!-- 7. Tools Calculator Section -->
            <section class="tools-section">
                <div class="container">
                    <div class="tools-grid">
                        <div class="tools-left">
                            <div class="tool-card yellow-tool"><h4>Buying Power Calculator</h4><p>Calculate your maximum purchasing capacity based on cash down and SDE.</p></div>
                            <div class="tool-card"><h4>Debt Affordability Calculator</h4><p>Estimate financing options and debt service coverage.</p></div>
                            <div class="tool-card"><h4>Net Working Capital Calculator</h4><p>Evaluate financial health and working capital requirements.</p></div>
                            <div class="tool-card"><h4>SDE Multiple Calculator</h4><p>Find the fair market value range based on industry multiples.</p></div>
                        </div>
                        <div class="tools-right">
                            <div class="laptop-mockup">
                                <img src="https://images.unsplash.com/photo-1460925895917-afdab827c52f?auto=format&fit=crop&w=800&q=80" alt="Dashboard on Laptop">
                                <div style="position: absolute; top: 20%; left: 10%; background: rgba(255,255,255,0.9); padding: 12px 16px; border-radius: 8px; box-shadow: 0 4px 12px rgba(0,0,0,0.1); border: 1px solid #eaeaea;">
                                    <small style="display: block; font-weight: 600; font-size: 10px; letter-spacing: 1px; color: #666;">Buying Power Calculator</small>
                                    <span style="font-size: 18px; font-weight: 700; color: #1a1a1a;">SDE $1,000,000</span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>

            <!-- 8. Contact Details Section (Home) -->
            <section class="contact-section">
                <div class="container">
                    <h2>Get In Touch</h2>
                    <p>We are here to help you take the next step in your business journey.</p>
                    <div class="contact-grid">
                        <div class="contact-item">
                            <h4><i class="fas fa-map-marker-alt" style="color:var(--primary-yellow); margin-right:8px;"></i> Address</h4>
                            <p>123, Business District,<br>Mumbai, India.</p>
                        </div>
                        <div class="contact-item">
                            <h4><i class="fas fa-envelope" style="color:var(--primary-yellow); margin-right:8px;"></i> Email</h4>
                            <p>info@offmartbizdeals.com</p>
                        </div>
                        <div class="contact-item">
                            <h4><i class="fas fa-phone-alt" style="color:var(--primary-yellow); margin-right:8px;"></i> Phone</h4>
                            <p>+91 98765 43210</p>
                        </div>
                    </div>
                </div>
            </section>

            <!-- 9. Footer -->
            <footer>
                <div class="container footer-content">
                    <div class="footer-grid">
                        <div class="footer-brand">
                            <h3>OFF Mart BIZ Deals</h3>
                            <p>Empowering business acquisition with data-driven insights and a proprietary marketplace.</p>
                            <div class="social-icons">
                                <a href="#"><i class="fab fa-facebook-f"></i></a>
                                <a href="#"><i class="fab fa-instagram"></i></a>
                                <a href="#"><i class="fab fa-linkedin-in"></i></a>
                                <a href="#"><i class="fab fa-twitter"></i></a>
                            </div>
                        </div>
                        <div class="footer-col"><h5>Product</h5><ul><li><a href="#">How it works</a></li><li><a href="#">Pricing</a></li><li><a href="#">For Buyers</a></li><li><a href="#">For Sellers</a></li><li><a href="#">Case Studies</a></li></ul></div>
                        <div class="footer-col"><h5>Explore</h5><ul><li><a href="#">Blog</a></li><li><a href="#">Guides</a></li><li><a href="#">Webinars</a></li><li><a href="#">Events</a></li><li><a href="#">Calculator</a></li></ul></div>
                        <div class="footer-col"><h5>Company</h5><ul><li><a href="#">About</a></li><li><a href="#">Careers</a></li><li><a href="#">Contact</a></li><li><a href="#">Press</a></li><li><a href="#">Partner Program</a></li></ul></div>
                    </div>
                    <div class="footer-bottom">
                        <div class="copyright">
                            &copy; 2026 OFF Mart BIZ Deals. All rights reserved.
                        </div>
                        <div class="footer-bottom-links">
                            <a href="#">Privacy Policy</a>
                            <a href="#">Terms of Service</a>
                            <a href="#">Cookie Policy</a>
                        </div>
                    </div>
                </div>
            </footer>
        </div>

        <!-- ABOUT PAGE -->
        <div id="about" class="page-container">
            <section class="static-page">
                <div class="container">
                    <h1>About OFF Mart BIZ Deals</h1>
                    <p>Founded by <strong>Rajesh Sharma</strong> in 2022, OFF Mart BIZ Deals was built on the belief that buying a business should be transparent, data-driven, and simple. We provide a curated marketplace for small-to-medium enterprise acquisitions, connecting private sellers with qualified buyers through our proprietary valuation and vetting technology.</p>
                    <br>
                    <p><strong>Contact:</strong><br>Email: info@offmartbizdeals.com<br>Phone: +91 98765 43210</p>
                </div>
            </section>
        </div>

        <!-- SERVICES PAGE -->
        <div id="services" class="page-container">
            <section class="static-page">
                <div class="container">
                    <h1>Our Services</h1>
                    <p style="text-align: left; max-width: 800px;">
                        <strong>Business Valuation:</strong> Accurate, real-time SDE and EBITDA multiple calculations.<br><br>
                        <strong>M&A Advisory:</strong> End-to-end support for buyers and sellers through the acquisition process.<br><br>
                        <strong>Financing Support:</strong> Connecting you with lending partners to fund your acquisition.<br><br>
                        <strong>Due Diligence:</strong> Thoroughly vetted data rooms providing bank statements, tax returns, and operational metrics.
                    </p>
                </div>
            </section>
        </div>

        <!-- BLOG PAGE -->
        <div id="blog" class="page-container">
            <section class="static-page">
                <div class="container">
                    <h1>Business Insights</h1>
                    <p>Read the latest trends, guides, and success stories in the world of business acquisitions. Check back soon for our weekly updates on M&A strategies and market movements.</p>
                </div>
            </section>
        </div>

        <!-- CONTACT PAGE -->
        <div id="contact" class="page-container">
            <section class="static-page" style="text-align: left;">
                <div class="container" style="max-width: 800px; text-align: center;">
                    <h1>Contact Us</h1>
                    <div style="background:#fff; padding:40px; border-radius:12px; margin-top:24px; box-shadow: 0 4px 12px rgba(0,0,0,0.05);">
                        <p style="margin-bottom:20px;"><strong>📞 Phone:</strong> +91 98765 43210</p>
                        <p style="margin-bottom:20px;"><strong>✉️ Email:</strong> info@offmartbizdeals.com</p>
                        <p style="margin-bottom:20px;"><strong>🏢 Address:</strong> 123, Business District, Mumbai, India - 400001</p>
                        <p><strong>⏰ Working Hours:</strong> Mon - Sat, 9:00 AM to 6:00 PM (IST)</p>
                    </div>
                </div>
            </section>
        </div>
    </div>

    <!-- MODALS -->
    <!-- Login Modal -->
    <div id="loginModal" class="modal-overlay" onclick="if(event.target===this) closeModal('loginModal')">
        <div class="modal-content">
            <span class="modal-close" onclick="closeModal('loginModal')">&times;</span>
            <h2>Welcome Back</h2>
            <form onsubmit="event.preventDefault(); alert('Login successful!'); closeModal('loginModal');">
                <input type="email" placeholder="Email Address" required>
                <input type="password" placeholder="Password" required>
                <button type="submit">Login</button>
                <p>Don't have an account? <a href="javascript:void(0)" onclick="closeModal('loginModal'); openModal('registerModal');">Register here</a></p>
            </form>
        </div>
    </div>

    <!-- Register Modal -->
    <div id="registerModal" class="modal-overlay" onclick="if(event.target===this) closeModal('registerModal')">
        <div class="modal-content">
            <span class="modal-close" onclick="closeModal('registerModal')">&times;</span>
            <h2>Create Account</h2>
            <form onsubmit="event.preventDefault(); alert('Registration successful!'); closeModal('registerModal');">
                <input type="text" placeholder="Full Name" required>
                <input type="email" placeholder="Email Address" required>
                <input type="password" placeholder="Password" required>
                <input type="password" placeholder="Confirm Password" required>
                <button type="submit">Register</button>
                <p>Already have an account? <a href="javascript:void(0)" onclick="closeModal('registerModal'); openModal('loginModal');">Login here</a></p>
            </form>
        </div>
    </div>

    <!-- JAVASCRIPT -->
    <script>
        // --- SPA Navigation ---
        function showPage(pageId) {
            // Hide all pages
            document.querySelectorAll('.page-container').forEach(page => {
                page.classList.remove('active');
            });
            // Show the target page
            document.getElementById(pageId).classList.add('active');
            // Scroll to top
            window.scrollTo(0, 0);
        }

        // --- Modal Management ---
        function openModal(modalId) {
            document.getElementById(modalId).style.display = 'flex';
        }

        function closeModal(modalId) {
            document.getElementById(modalId).style.display = 'none';
        }

        // Close modal if clicked outside
        window.onclick = function(event) {
            if (event.target.classList.contains('modal-overlay')) {
                event.target.style.display = 'none';
            }
        }
    </script>
</body>
</html>
Back to Directory=ceiIENDB`