website1

Running

App Files Files Community

dablack commited on May 29, 2025

Commit

fa2f7e6

verified ·

1 Parent(s): 8546136

Add 3 files

Browse files

Files changed (3) hide show

README.md +6 -4
index.html +848 -19
prompts.txt +3 -0

README.md CHANGED Viewed

@@ -1,10 +1,12 @@
 ---
-title: Webproject
-emoji: 🦀
-colorFrom: blue
 colorTo: red
 sdk: static
 pinned: false
 ---
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

 ---
+title: webproject
+emoji: 🐳
+colorFrom: pink
 colorTo: red
 sdk: static
 pinned: false
+tags:
+  - deepsite
 ---
+Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

index.html CHANGED Viewed

@@ -1,19 +1,848 @@
-<!doctype html>
-<html>
-	<head>
-		<meta charset="utf-8" />
-		<meta name="viewport" content="width=device-width" />
-		<title>My static Space</title>
-		<link rel="stylesheet" href="style.css" />
-	</head>
-	<body>
-		<div class="card">
-			<h1>Welcome to your static Space!</h1>
-			<p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
-			<p>
-				Also don't forget to check the
-				<a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
-			</p>
-		</div>
-	</body>
-</html>

+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Nexus Digital Solutions</title>
+    <script src="https://cdn.tailwindcss.com"></script>
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
+    <style>
+        .video-background {
+            position: relative;
+            width: 100%;
+            height: 100vh;
+            overflow: hidden;
+        }
+        .video-background video {
+            position: absolute;
+            top: 50%;
+            left: 50%;
+            transform: translate(-50%, -50%);
+            min-width: 100%;
+            min-height: 100%;
+            width: auto;
+            height: auto;
+            z-index: 1;
+        }
+        .video-overlay {
+            position: absolute;
+            top: 0;
+            left: 0;
+            width: 100%;
+            height: 100%;
+            background-color: rgba(0, 0, 0, 0.6);
+            z-index: 2;
+        }
+        .hero-content {
+            position: relative;
+            z-index: 3;
+        }
+        .service-card:hover {
+            transform: translateY(-10px);
+            box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
+        }
+        .tab-content {
+            display: none;
+        }
+        .tab-content.active {
+            display: block;
+            animation: fadeIn 0.5s ease-in-out;
+        }
+        @keyframes fadeIn {
+            from { opacity: 0; }
+            to { opacity: 1; }
+        }
+        .scroll-down-arrow {
+            animation: bounce 2s infinite;
+        }
+        @keyframes bounce {
+            0%, 20%, 50%, 80%, 100% {
+                transform: translateY(0);
+            }
+            40% {
+                transform: translateY(-20px);
+            }
+            60% {
+                transform: translateY(-10px);
+            }
+        }
+        .section {
+            scroll-margin-top: 80px;
+        }
+        .fade-in {
+            opacity: 0;
+            transition: opacity 0.6s ease-in-out;
+        }
+        .fade-in.visible {
+            opacity: 1;
+        }
+        .hero-bg {
+            background-image: url('https://images.unsplash.com/photo-1499951360447-b19be8fe80f5?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80');
+            background-size: cover;
+            background-position: center;
+            background-repeat: no-repeat;
+            height: 100vh;
+            position: relative;
+        }
+        .hero-overlay {
+            position: absolute;
+            top: 0;
+            left: 0;
+            width: 100%;
+            height: 100%;
+            background-color: rgba(0, 0, 0, 0.6);
+        }
+    </style>
+</head>
+<body class="bg-gray-50 font-sans">
+    <!-- Navigation -->
+    <nav class="bg-gray-900 text-white sticky top-0 z-50 shadow-lg">
+        <div class="container mx-auto px-6 py-4">
+            <div class="flex justify-between items-center">
+                <div class="flex items-center space-x-4">
+                    <div class="w-10 h-10 bg-blue-600 rounded-full flex items-center justify-center">
+                        <i class="fas fa-cube text-white text-xl"></i>
+                    </div>
+                    <span class="text-xl font-bold">Nexus Digital</span>
+                </div>
+                <div class="hidden md:flex space-x-8">
+                    <a href="#home-section" class="nav-link font-medium text-blue-400 border-b-2 border-blue-400 pb-1">Home</a>
+                    <a href="#services" class="nav-link font-medium hover:text-blue-400 transition">Services</a>
+                    <a href="#why-us" class="nav-link font-medium hover:text-blue-400 transition">Why Us</a>
+                    <button onclick="changeTab('offers')" class="font-medium hover:text-blue-400 transition">Offers</button>
+                    <button onclick="changeTab('about')" class="font-medium hover:text-blue-400 transition">About</button>
+                </div>
+                <button class="md:hidden focus:outline-none" id="mobile-menu-button">
+                    <i class="fas fa-bars text-2xl"></i>
+                </button>
+            </div>
+            <!-- Mobile menu -->
+            <div class="md:hidden hidden pt-4" id="mobile-menu">
+                <a href="#home-section" class="block w-full text-left py-2 font-medium text-blue-400">Home</a>
+                <a href="#services" class="block w-full text-left py-2 font-medium hover:text-blue-400">Services</a>
+                <a href="#why-us" class="block w-full text-left py-2 font-medium hover:text-blue-400">Why Us</a>
+                <button onclick="changeTab('offers')" class="block w-full text-left py-2 font-medium hover:text-blue-400">Offers</button>
+                <button onclick="changeTab('about')" class="block w-full text-left py-2 font-medium hover:text-blue-400">About</button>
+            </div>
+        </div>
+    </nav>
+    <!-- Home Tab Content -->
+    <div id="home" class="tab-content active">
+        <!-- Hero Section with Background Image -->
+        <section id="home-section" class="hero-bg section">
+            <div class="hero-overlay"></div>
+            <div class="hero-content flex items-center justify-center text-center h-full">
+                <div class="px-6">
+                    <h1 class="text-4xl md:text-6xl font-bold mb-6 text-white">Digital Excellence, Simplified</h1>
+                    <p class="text-xl md:text-2xl mb-8 max-w-3xl mx-auto text-gray-200">Comprehensive digital solutions tailored to elevate your online presence and drive business growth.</p>
+                    <div class="flex flex-col sm:flex-row justify-center gap-4">
+                        <a href="#services" class="bg-blue-600 hover:bg-blue-700 text-white font-bold py-3 px-8 rounded-full transition duration-300 transform hover:scale-105">
+                            Explore Our Services
+                        </a>
+                        <button onclick="changeTab('offers')" class="bg-transparent hover:bg-white hover:text-gray-900 text-white font-bold py-3 px-8 rounded-full border-2 border-white transition duration-300 transform hover:scale-105">
+                            View Packages
+                        </button>
+                    </div>
+                </div>
+            </div>
+            <div class="absolute bottom-10 left-1/2 transform -translate-x-1/2 scroll-down-arrow">
+                <a href="#services">
+                    <i class="fas fa-chevron-down text-white text-2xl animate-bounce"></i>
+                </a>
+            </div>
+        </section>
+        <!-- Services Overview -->
+        <section id="services" class="py-20 px-6 section fade-in">
+            <div class="container mx-auto">
+                <h2 class="text-3xl md:text-4xl font-bold text-center text-gray-800 mb-4">Our Comprehensive Solutions</h2>
+                <p class="text-xl text-center text-gray-600 mb-16 max-w-3xl mx-auto">Everything you need to establish and grow your digital presence</p>
+                <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-10">
+                    <!-- Service 1 -->
+                    <div class="service-card bg-white rounded-xl shadow-lg p-8 transition duration-300">
+                        <div class="w-16 h-16 bg-blue-100 rounded-full flex items-center justify-center mb-6">
+                            <i class="fas fa-globe text-blue-600 text-2xl"></i>
+                        </div>
+                        <h3 class="text-xl font-bold text-gray-800 mb-3">Multi Page Website Development</h3>
+                        <p class="text-gray-600">Professional, responsive websites designed to showcase your brand and convert visitors into customers.</p>
+                    </div>
+                    <!-- Service 2 -->
+                    <div class="service-card bg-white rounded-xl shadow-lg p-8 transition duration-300">
+                        <div class="w-16 h-16 bg-blue-100 rounded-full flex items-center justify-center mb-6">
+                            <i class="fas fa-search text-blue-600 text-2xl"></i>
+                        </div>
+                        <h3 class="text-xl font-bold text-gray-800 mb-3">Enhanced Google Profile Management</h3>
+                        <p class="text-gray-600">Optimize your Google My Business listing to improve local search visibility and attract more customers.</p>
+                    </div>
+                    <!-- Service 3 -->
+                    <div class="service-card bg-white rounded-xl shadow-lg p-8 transition duration-300">
+                        <div class="w-16 h-16 bg-blue-100 rounded-full flex items-center justify-center mb-6">
+                            <i class="fas fa-share-alt text-blue-600 text-2xl"></i>
+                        </div>
+                        <h3 class="text-xl font-bold text-gray-800 mb-3">Social Media Starter Kit</h3>
+                        <p class="text-gray-600">Launch your social media presence with professionally designed profiles and a content strategy.</p>
+                    </div>
+                    <!-- Service 4 -->
+                    <div class="service-card bg-white rounded-xl shadow-lg p-8 transition duration-300">
+                        <div class="w-16 h-16 bg-blue-100 rounded-full flex items-center justify-center mb-6">
+                            <i class="fas fa-sync-alt text-blue-600 text-2xl"></i>
+                        </div>
+                        <h3 class="text-xl font-bold text-gray-800 mb-3">Unlimited Rapid Monthly Edits</h3>
+                        <p class="text-gray-600">Keep your content fresh with unlimited updates to your website and digital assets every month.</p>
+                    </div>
+                    <!-- Service 5 -->
+                    <div class="service-card bg-white rounded-xl shadow-lg p-8 transition duration-300">
+                        <div class="w-16 h-16 bg-blue-100 rounded-full flex items-center justify-center mb-6">
+                            <i class="fas fa-link text-blue-600 text-2xl"></i>
+                        </div>
+                        <h3 class="text-xl font-bold text-gray-800 mb-3">Free Domain Registration</h3>
+                        <p class="text-gray-600">Get a professional domain name included with your website package to establish your online identity.</p>
+                    </div>
+                    <!-- Service 6 -->
+                    <div class="service-card bg-white rounded-xl shadow-lg p-8 transition duration-300">
+                        <div class="w-16 h-16 bg-blue-100 rounded-full flex items-center justify-center mb-6">
+                            <i class="fas fa-palette text-blue-600 text-2xl"></i>
+                        </div>
+                        <h3 class="text-xl font-bold text-gray-800 mb-3">Custom Logo Design</h3>
+                        <p class="text-gray-600">Professional logo creation that captures your brand essence and makes a lasting impression.</p>
+                    </div>
+                </div>
+                <div class="text-center mt-16">
+                    <button onclick="changeTab('offers')" class="bg-blue-600 hover:bg-blue-700 text-white font-bold py-3 px-8 rounded-full transition duration-300 transform hover:scale-105 inline-flex items-center">
+                        See Our Packages
+                        <i class="fas fa-arrow-right ml-2"></i>
+                    </button>
+                </div>
+            </div>
+        </section>
+        <!-- Ratings Section -->
+        <section class="py-16 bg-gray-100 px-6 section fade-in">
+            <div class="container mx-auto">
+                <h2 class="text-3xl md:text-4xl font-bold text-center text-gray-800 mb-12">Client Satisfaction</h2>
+                <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
+                    <!-- Rating 1 -->
+                    <div class="bg-white p-8 rounded-xl shadow-lg text-center">
+                        <div class="text-yellow-400 text-3xl mb-4">
+                            <i class="fas fa-star"></i>
+                            <i class="fas fa-star"></i>
+                            <i class="fas fa-star"></i>
+                            <i class="fas fa-star"></i>
+                            <i class="fas fa-star"></i>
+                        </div>
+                        <p class="text-gray-600 text-xl font-medium">98% Satisfaction Rate</p>
+                    </div>
+                    <!-- Rating 2 -->
+                    <div class="bg-white p-8 rounded-xl shadow-lg text-center">
+                        <div class="text-yellow-400 text-3xl mb-4">
+                            <i class="fas fa-star"></i>
+                            <i class="fas fa-star"></i>
+                            <i class="fas fa-star"></i>
+                            <i class="fas fa-star"></i>
+                            <i class="fas fa-star"></i>
+                        </div>
+                        <p class="text-gray-600 text-xl font-medium">95% Repeat Business</p>
+                    </div>
+                    <!-- Rating 3 -->
+                    <div class="bg-white p-8 rounded-xl shadow-lg text-center">
+                        <div class="text-yellow-400 text-3xl mb-4">
+                            <i class="fas fa-star"></i>
+                            <i class="fas fa-star"></i>
+                            <i class="fas fa-star"></i>
+                            <i class="fas fa-star"></i>
+                            <i class="fas fa-star"></i>
+                        </div>
+                        <p class="text-gray-600 text-xl font-medium">100% On-Time Delivery</p>
+                    </div>
+                </div>
+            </div>
+        </section>
+        <!-- Value Proposition -->
+        <section id="why-us" class="py-20 bg-white px-6 section fade-in">
+            <div class="container mx-auto">
+                <div class="flex flex-col lg:flex-row items-center">
+                    <div class="lg:w-1/2 mb-12 lg:mb-0 lg:pr-12">
+                        <h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-6">Why Choose Nexus Digital?</h2>
+                        <p class="text-gray-600 mb-8 text-lg">We combine technical expertise with strategic thinking to deliver digital solutions that drive real business results.</p>
+                        <div class="space-y-6">
+                            <div class="flex items-start">
+                                <div class="bg-blue-100 p-2 rounded-full mr-4">
+                                    <i class="fas fa-bolt text-blue-600"></i>
+                                </div>
+                                <div>
+                                    <h4 class="font-bold text-gray-800 mb-1">Rapid Implementation</h4>
+                                    <p class="text-gray-600">Get your digital assets up and running quickly without compromising quality.</p>
+                                </div>
+                            </div>
+                            <div class="flex items-start">
+                                <div class="bg-blue-100 p-2 rounded-full mr-4">
+                                    <i class="fas fa-headset text-blue-600"></i>
+                                </div>
+                                <div>
+                                    <h4 class="font-bold text-gray-800 mb-1">Priority Support</h4>
+                                    <p class="text-gray-600">Dedicated support team available to address your needs promptly.</p>
+                                </div>
+                            </div>
+                            <div class="flex items-start">
+                                <div class="bg-blue-100 p-2 rounded-full mr-4">
+                                    <i class="fas fa-chart-line text-blue-600"></i>
+                                </div>
+                                <div>
+                                    <h4 class="font-bold text-gray-800 mb-1">Strategic Guidance</h4>
+                                    <p class="text-gray-600">Quarterly strategy calls to align your digital presence with business objectives.</p>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="mt-10">
+                            <button onclick="changeTab('about')" class="bg-gray-800 hover:bg-gray-900 text-white font-medium py-3 px-6 rounded-lg transition duration-300 inline-flex items-center">
+                                Learn More About Us
+                                <i class="fas fa-arrow-right ml-2"></i>
+                            </button>
+                        </div>
+                    </div>
+                    <div class="lg:w-1/2 bg-white rounded-xl shadow-lg overflow-hidden">
+                        <img src="https://images.unsplash.com/photo-1551288049-bebda4e38f71?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Team working" class="w-full h-auto">
+                    </div>
+                </div>
+            </div>
+        </section>
+        <!-- Newsletter CTA -->
+        <section class="py-20 bg-gray-900 text-white px-6 section fade-in">
+            <div class="container mx-auto text-center">
+                <h2 class="text-3xl md:text-4xl font-bold mb-6">Ready to Transform Your Business?</h2>
+                <p class="text-xl mb-10 max-w-2xl mx-auto">Get started with a free consultation to discuss your digital needs</p>
+                <div class="max-w-md mx-auto flex flex-col sm:flex-row gap-4">
+                    <input type="email" placeholder="Your email address" class="flex-grow px-4 py-3 rounded-lg text-gray-900 focus:outline-none focus:ring-2 focus:ring-blue-500">
+                    <button onclick="changeTab('consultation')" class="bg-blue-600 hover:bg-blue-700 text-white font-bold py-3 px-6 rounded-lg transition duration-300">
+                        Schedule a Call
+                    </button>
+                </div>
+            </div>
+        </section>
+    </div>
+    <!-- Offers Tab Content -->
+    <div id="offers" class="tab-content">
+        <section class="py-20 px-6">
+            <div class="container mx-auto">
+                <h1 class="text-4xl font-bold text-center text-gray-800 mb-4">Our Service Packages</h1>
+                <p class="text-xl text-center text-gray-600 mb-16 max-w-3xl mx-auto">Comprehensive digital solutions tailored to your business needs and budget.</p>
+                <div class="grid grid-cols-1 lg:grid-cols-3 gap-8">
+                    <!-- Basic Package -->
+                    <div class="bg-white rounded-xl shadow-lg overflow-hidden border border-gray-200 hover:border-blue-500 transition duration-300">
+                        <div class="bg-gray-100 p-6">
+                            <h3 class="text-2xl font-bold text-gray-800 mb-2">Starter Package</h3>
+                            <p class="text-gray-600 mb-4">Perfect for new businesses establishing their online presence</p>
+                            <div class="flex items-baseline mb-4">
+                                <span class="text-4xl font-bold text-gray-800">1,099 AED</span>
+                                <span class="ml-2 text-gray-600">/month</span>
+                            </div>
+                            <button onclick="changeTab('consultation')" class="w-full bg-gray-800 hover:bg-gray-900 text-white font-medium py-2 px-4 rounded-lg transition duration-300">
+                                Get Started
+                            </button>
+                        </div>
+                        <div class="p-6">
+                            <ul class="space-y-3">
+                                <li class="flex items-center">
+                                    <i class="fas fa-check text-green-500 mr-3"></i>
+                                    <span>5-Page Website Development</span>
+                                </li>
+                                <li class="flex items-center">
+                                    <i class="fas fa-check text-green-500 mr-3"></i>
+                                    <span>Google Profile Optimization</span>
+                                </li>
+                                <li class="flex items-center">
+                                    <i class="fas fa-check text-green-500 mr-3"></i>
+                                    <span>Social Media Setup (2 Platforms)</span>
+                                </li>
+                                <li class="flex items-center">
+                                    <i class="fas fa-check text-green-500 mr-3"></i>
+                                    <span>5 Monthly Content Updates</span>
+                                </li>
+                                <li class="flex items-center text-gray-400">
+                                    <i class="fas fa-times text-gray-400 mr-3"></i>
+                                    <span>Free Domain (1 Year)</span>
+                                </li>
+                                <li class="flex items-center text-gray-400">
+                                    <i class="fas fa-times text-gray-400 mr-3"></i>
+                                    <span>Custom Logo Design</span>
+                                </li>
+                            </ul>
+                        </div>
+                    </div>
+                    <!-- Popular Package -->
+                    <div class="bg-white rounded-xl shadow-xl overflow-hidden border-2 border-blue-500 transform scale-105 z-10">
+                        <div class="bg-blue-500 text-white p-6">
+                            <div class="flex justify-between items-start">
+                                <div>
+                                    <h3 class="text-2xl font-bold mb-2">Growth Package</h3>
+                                    <p class="mb-4">Our most popular package for growing businesses</p>
+                                </div>
+                                <span class="bg-white text-blue-500 text-xs font-bold px-3 py-1 rounded-full">POPULAR</span>
+                            </div>
+                            <div class="flex items-baseline mb-4">
+                                <span class="text-4xl font-bold">2,199 AED</span>
+                                <span class="ml-2 opacity-80">/month</span>
+                            </div>
+                            <button onclick="changeTab('consultation')" class="w-full bg-white hover:bg-gray-100 text-blue-500 font-medium py-2 px-4 rounded-lg transition duration-300">
+                                Get Started
+                            </button>
+                        </div>
+                        <div class="p-6">
+                            <ul class="space-y-3">
+                                <li class="flex items-center">
+                                    <i class="fas fa-check text-green-500 mr-3"></i>
+                                    <span>10-Page Website Development</span>
+                                </li>
+                                <li class="flex items-center">
+                                    <i class="fas fa-check text-green-500 mr-3"></i>
+                                    <span>Premium Google Profile Management</span>
+                                </li>
+                                <li class="flex items-center">
+                                    <i class="fas fa-check text-green-500 mr-3"></i>
+                                    <span>Social Media Starter Kit (4 Platforms)</span>
+                                </li>
+                                <li class="flex items-center">
+                                    <i class="fas fa-check text-green-500 mr-3"></i>
+                                    <span>Unlimited Monthly Edits</span>
+                                </li>
+                                <li class="flex items-center">
+                                    <i class="fas fa-check text-green-500 mr-3"></i>
+                                    <span>Free Domain (1 Year)</span>
+                                </li>
+                                <li class="flex items-center">
+                                    <i class="fas fa-check text-green-500 mr-3"></i>
+                                    <span>Custom Logo Design</span>
+                                </li>
+                                <li class="flex items-center">
+                                    <i class="fas fa-check text-green-500 mr-3"></i>
+                                    <span>Priority Email Support</span>
+                                </li>
+                            </ul>
+                        </div>
+                    </div>
+                    <!-- Premium Package -->
+                    <div class="bg-white rounded-xl shadow-lg overflow-hidden border border-gray-200 hover:border-blue-500 transition duration-300">
+                        <div class="bg-gray-100 p-6">
+                            <h3 class="text-2xl font-bold text-gray-800 mb-2">Enterprise Package</h3>
+                            <p class="text-gray-600 mb-4">For businesses needing comprehensive digital solutions</p>
+                            <div class="flex items-baseline mb-4">
+                                <span class="text-4xl font-bold text-gray-800">3,699 AED</span>
+                                <span class="ml-2 text-gray-600">/month</span>
+                            </div>
+                            <button onclick="changeTab('consultation')" class="w-full bg-gray-800 hover:bg-gray-900 text-white font-medium py-2 px-4 rounded-lg transition duration-300">
+                                Get Started
+                            </button>
+                        </div>
+                        <div class="p-6">
+                            <ul class="space-y-3">
+                                <li class="flex items-center">
+                                    <i class="fas fa-check text-green-500 mr-3"></i>
+                                    <span>Unlimited Page Website Development</span>
+                                </li>
+                                <li class="flex items-center">
+                                    <i class="fas fa-check text-green-500 mr-3"></i>
+                                    <span>Enhanced Google Profile Management</span>
+                                </li>
+                                <li class="flex items-center">
+                                    <i class="fas fa-check text-green-500 mr-3"></i>
+                                    <span>Complete Social Media Setup (All Platforms)</span>
+                                </li>
+                                <li class="flex items-center">
+                                    <i class="fas fa-check text-green-500 mr-3"></i>
+                                    <span>Unlimited Rapid Monthly Edits</span>
+                                </li>
+                                <li class="flex items-center">
+                                    <i class="fas fa-check text-green-500 mr-3"></i>
+                                    <span>Free Domain (2 Years)</span>
+                                </li>
+                                <li class="flex items-center">
+                                    <i class="fas fa-check text-green-500 mr-3"></i>
+                                    <span>Premium Logo & Branding Package</span>
+                                </li>
+                                <li class="flex items-center">
+                                    <i class="fas fa-check text-green-500 mr-3"></i>
+                                    <span>24/7 Priority Support</span>
+                                </li>
+                                <li class="flex items-center">
+                                    <i class="fas fa-check text-green-500 mr-3"></i>
+                                    <span>Quarterly Strategy Calls</span>
+                                </li>
+                                <li class="flex items-center">
+                                    <i class="fas fa-check text-green-500 mr-3"></i>
+                                    <span>Monthly Performance Reports</span>
+                                </li>
+                            </ul>
+                        </div>
+                    </div>
+                </div>
+                <div class="mt-16 bg-gray-100 rounded-xl p-8">
+                    <h3 class="text-2xl font-bold text-gray-800 mb-4">Not sure which package is right for you?</h3>
+                    <p class="text-gray-600 mb-6">Our digital consultants can help you determine the perfect solution for your business needs and budget.</p>
+                    <button onclick="changeTab('consultation')" class="bg-blue-600 hover:bg-blue-700 text-white font-medium py-3 px-6 rounded-lg transition duration-300">
+                        Schedule a Free Consultation
+                    </button>
+                </div>
+            </div>
+        </section>
+    </div>
+    <!-- Consultation Tab Content -->
+    <div id="consultation" class="tab-content">
+        <section class="py-20 px-6">
+            <div class="container mx-auto max-w-4xl">
+                <div class="bg-white rounded-xl shadow-lg overflow-hidden">
+                    <div class="md:flex">
+                        <div class="md:w-1/2 bg-blue-600 text-white p-10">
+                            <h2 class="text-3xl font-bold mb-6">Schedule Your Free Consultation</h2>
+                            <p class="mb-8">Let's discuss how we can help grow your business with our digital solutions.</p>
+                            <div class="space-y-6">
+                                <div class="flex items-start">
+                                    <div class="bg-blue-500 p-2 rounded-full mr-4">
+                                        <i class="fas fa-calendar-check text-white"></i>
+                                    </div>
+                                    <div>
+                                        <h4 class="font-bold mb-1">30-Minute Call</h4>
+                                        <p class="text-blue-100">Convenient online meeting at your preferred time</p>
+                                    </div>
+                                </div>
+                                <div class="flex items-start">
+                                    <div class="bg-blue-500 p-2 rounded-full mr-4">
+                                        <i class="fas fa-lightbulb text-white"></i>
+                                    </div>
+                                    <div>
+                                        <h4 class="font-bold mb-1">Custom Strategy</h4>
+                                        <p class="text-blue-100">Personalized recommendations for your business</p>
+                                    </div>
+                                </div>
+                                <div class="flex items-start">
+                                    <div class="bg-blue-500 p-2 rounded-full mr-4">
+                                        <i class="fas fa-question text-white"></i>
+                                    </div>
+                                    <div>
+                                        <h4 class="font-bold mb-1">No Obligation</h4>
+                                        <p class="text-blue-100">Just helpful advice with no pressure to buy</p>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="md:w-1/2 p-10">
+                            <h3 class="text-2xl font-bold text-gray-800 mb-6">Book Your Slot</h3>
+                            <form>
+                                <div class="mb-4">
+                                    <label class="block text-gray-700 mb-2" for="name">Full Name</label>
+                                    <input type="text" id="name" class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500">
+                                </div>
+                                <div class="mb-4">
+                                    <label class="block text-gray-700 mb-2" for="email">Email Address</label>
+                    <input type="email" id="email" class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500">
+                </div>
+                <div class="mb-4">
+                    <label class="block text-gray-700 mb-2" for="phone">Phone Number</label>
+                    <input type="tel" id="phone" class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500">
+                </div>
+                <div class="mb-6">
+                    <label class="block text-gray-700 mb-2" for="date">Preferred Date & Time</label>
+                    <input type="datetime-local" id="date" class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500">
+                </div>
+                <button type="submit" class="w-full bg-blue-600 hover:bg-blue-700 text-white font-bold py-3 px-4 rounded-lg transition duration-300">
+                    Schedule Consultation
+                </button>
+            </form>
+        </div>
+    </div>
+</div>
+</div>
+</section>
+</div>
+<!-- About Us Tab Content -->
+<div id="about" class="tab-content">
+    <section class="py-20 px-6">
+        <div class="container mx-auto">
+            <div class="flex flex-col lg:flex-row items-center mb-20">
+                <div class="lg:w-1/2 mb-12 lg:mb-0 lg:pr-12">
+                    <h1 class="text-4xl font-bold text-gray-800 mb-6">Our Story</h1>
+                    <p class="text-gray-600 mb-6 text-lg">
+                        Founded in 2018, Nexus Digital Solutions began with a simple mission: to help businesses of all sizes establish and grow their digital presence without the complexity and high costs typically associated with digital transformation.
+                    </p>
+                    <p class="text-gray-600 mb-6 text-lg">
+                        What started as a small team of digital enthusiasts has grown into a full-service digital solutions provider serving clients across multiple industries. Our approach combines technical expertise with strategic thinking to deliver results that matter.
+                    </p>
+                    <div class="bg-blue-100 p-6 rounded-lg">
+                        <p class="text-blue-800 font-medium">
+                            "We believe in making digital excellence accessible to every business, regardless of size or technical expertise."
+                        </p>
+                    </div>
+                </div>
+                <div class="lg:w-1/2">
+                    <img src="https://images.unsplash.com/photo-1522071820081-009f0129c71c?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Our team" class="w-full rounded-xl shadow-lg">
+                </div>
+            </div>
+            <div class="py-16">
+                <h2 class="text-3xl font-bold text-center text-gray-800 mb-12">Our Core Values</h2>
+                <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
+                    <div class="bg-white p-8 rounded-xl shadow-lg">
+                        <div class="w-14 h-14 bg-blue-100 rounded-full flex items-center justify-center mb-6">
+                            <i class="fas fa-lightbulb text-blue-600 text-xl"></i>
+                        </div>
+                        <h3 class="text-xl font-bold text-gray-800 mb-3">Innovation</h3>
+                        <p class="text-gray-600">We constantly explore new technologies and strategies to keep our clients ahead of the curve.</p>
+                    </div>
+                    <div class="bg-white p-8 rounded-xl shadow-lg">
+                        <div class="w-14 h-14 bg-blue-100 rounded-full flex items-center justify-center mb-6">
+                            <i class="fas fa-handshake text-blue-600 text-xl"></i>
+                        </div>
+                        <h3 class="text-xl font-bold text-gray-800 mb-3">Integrity</h3>
+                        <p class="text-gray-600">We build trust through transparency, honesty, and delivering on our promises.</p>
+                    </div>
+                    <div class="bg-white p-8 rounded-xl shadow-lg">
+                        <div class="w-14 h-14 bg-blue-100 rounded-full flex items-center justify-center mb-6">
+                            <i class="fas fa-heart text-blue-600 text-xl"></i>
+                        </div>
+                        <h3 class="text-xl font-bold text-gray-800 mb-3">Client-Centric</h3>
+                        <p class="text-gray-600">Your success is our success. We tailor solutions to your unique needs and goals.</p>
+                    </div>
+                </div>
+            </div>
+            <div class="mt-16 text-center">
+                <h2 class="text-3xl font-bold text-gray-800 mb-6">Ready to Transform Your Digital Presence?</h2>
+                <button onclick="changeTab('offers')" class="bg-blue-600 hover:bg-blue-700 text-white font-medium py-3 px-8 rounded-lg transition duration-300 inline-flex items-center">
+                    Explore Our Services
+                    <i class="fas fa-arrow-right ml-2"></i>
+                </button>
+            </div>
+        </div>
+    </section>
+</div>
+<!-- Footer -->
+<footer class="bg-gray-900 text-white py-12 px-6">
+    <div class="container mx-auto">
+        <div class="grid grid-cols-1 md:grid-cols-4 gap-10">
+            <div>
+                <div class="flex items-center space-x-3 mb-6">
+                    <div class="w-10 h-10 bg-blue-600 rounded-full flex items-center justify-center">
+                        <i class="fas fa-cube text-white text-xl"></i>
+                    </div>
+                    <span class="text-xl font-bold">Nexus Digital</span>
+                </div>
+                <p class="text-gray-400 mb-6">
+                    Comprehensive digital solutions to elevate your online presence and drive business growth.
+                </p>
+                <div class="flex space-x-4">
+                    <a href="#" class="text-gray-400 hover:text-white transition">
+                        <i class="fab fa-facebook-f"></i>
+                    </a>
+                    <a href="#" class="text-gray-400 hover:text-white transition">
+                        <i class="fab fa-twitter"></i>
+                    </a>
+                    <a href="#" class="text-gray-400 hover:text-white transition">
+                        <i class="fab fa-linkedin-in"></i>
+                    </a>
+                    <a href="#" class="text-gray-400 hover:text-white transition">
+                        <i class="fab fa-instagram"></i>
+                    </a>
+                </div>
+            </div>
+            <div>
+                <h3 class="text-lg font-bold mb-6">Services</h3>
+                <ul class="space-y-3">
+                    <li><a href="#" class="text-gray-400 hover:text-white transition">Website Development</a></li>
+                    <li><a href="#" class="text-gray-400 hover:text-white transition">Google Profile Management</a></li>
+                    <li><a href="#" class="text-gray-400 hover:text-white transition">Social Media Solutions</a></li>
+                    <li><a href="#" class="text-gray-400 hover:text-white transition">Content Updates</a></li>
+                    <li><a href="#" class="text-gray-400 hover:text-white transition">Branding & Logo Design</a></li>
+                </ul>
+            </div>
+            <div>
+                <h3 class="text-lg font-bold mb-6">Company</h3>
+                <ul class="space-y-3">
+                    <li><a href="#" class="text-gray-400 hover:text-white transition">About Us</a></li>
+                    <li><a href="#" class="text-gray-400 hover:text-white transition">Our Team</a></li>
+                    <li><a href="#" class="text-gray-400 hover:text-white transition">Careers</a></li>
+                    <li><a href="#" class="text-gray-400 hover:text-white transition">Blog</a></li>
+                    <li><a href="#" class="text-gray-400 hover:text-white transition">Contact Us</a></li>
+                </ul>
+            </div>
+            <div>
+                <h3 class="text-lg font-bold mb-6">Contact</h3>
+                <ul class="space-y-3">
+                    <li class="flex items-start">
+                        <i class="fas fa-map-marker-alt text-gray-400 mt-1 mr-3"></i>
+                        <span class="text-gray-400">123 Digital Lane, Suite 100<br>San Francisco, CA 94103</span>
+                    </li>
+                    <li class="flex items-center">
+                        <i class="fas fa-phone-alt text-gray-400 mr-3"></i>
+                        <span class="text-gray-400">(555) 123-4567</span>
+                    </li>
+                    <li class="flex items-center">
+                        <i class="fas fa-envelope text-gray-400 mr-3"></i>
+                        <span class="text-gray-400">info@nexusdigital.com</span>
+                    </li>
+                </ul>
+            </div>
+        </div>
+        <div class="border-t border-gray-800 mt-12 pt-8 flex flex-col md:flex-row justify-between items-center">
+            <p class="text-gray-400 mb-4 md:mb-0">© 2023 Nexus Digital Solutions. All rights reserved.</p>
+            <div class="flex space-x-6">
+                <a href="#" class="text-gray-400 hover:text-white transition">Privacy Policy</a>
+                <a href="#" class="text-gray-400 hover:text-white transition">Terms of Service</a>
+                <a href="#" class="text-gray-400 hover:text-white transition">Cookie Policy</a>
+            </div>
+        </div>
+    </div>
+</footer>
+<script>
+    // Tab functionality
+    function changeTab(tabId) {
+        // Hide all tab contents
+        document.querySelectorAll('.tab-content').forEach(tab => {
+            tab.classList.remove('active');
+        });
+        // Show selected tab content
+        document.getElementById(tabId).classList.add('active');
+        // Update tab links
+        document.querySelectorAll('.nav-link').forEach(link => {
+            link.classList.remove('text-blue-400', 'border-b-2', 'border-blue-400', 'pb-1');
+        });
+        // Scroll to top
+        window.scrollTo(0, 0);
+    }
+    // Mobile menu toggle
+    document.getElementById('mobile-menu-button').addEventListener('click', function() {
+        const menu = document.getElementById('mobile-menu');
+        if (menu.classList.contains('hidden')) {
+            menu.classList.remove('hidden');
+        } else {
+            menu.classList.add('hidden');
+        }
+    });
+    // Smooth scrolling for anchor links
+    document.querySelectorAll('a[href^="#"]').forEach(anchor => {
+        anchor.addEventListener('click', function(e) {
+            if(this.getAttribute('href') !== '#') {
+                e.preventDefault();
+                // Check if we're already on the home tab
+                const currentTab = document.querySelector('.tab-content.active').id;
+                const targetSection = this.getAttribute('href').substring(1);
+                if (currentTab !== 'home' && ['home-section', 'services', 'why-us'].includes(targetSection)) {
+                    // Switch to home tab first
+                    changeTab('home');
+                    // Wait for tab switch to complete before scrolling
+                    setTimeout(() => {
+                        document.querySelector(this.getAttribute('href')).scrollIntoView({
+                            behavior: 'smooth'
+                        });
+                    }, 100);
+                } else {
+                    // Regular scroll
+                    document.querySelector(this.getAttribute('href')).scrollIntoView({
+                        behavior: 'smooth'
+                    });
+                }
+            }
+        });
+    });
+    // Intersection Observer for fade-in animations
+    const fadeElements = document.querySelectorAll('.fade-in');
+    const observer = new IntersectionObserver((entries) => {
+        entries.forEach(entry => {
+            if (entry.isIntersecting) {
+                entry.target.classList.add('visible');
+            }
+        });
+    }, {
+        threshold: 0.1
+    });
+    fadeElements.forEach(element => {
+        observer.observe(element);
+    });
+    // Update active nav link on scroll
+    const sections = document.querySelectorAll('.section');
+    window.addEventListener('scroll', () => {
+        let current = '';
+        sections.forEach(section => {
+            const sectionTop = section.offsetTop;
+            const sectionHeight = section.clientHeight;
+            if (pageYOffset >= (sectionTop - 100)) {
+                current = section.getAttribute('id');
+            }
+        });
+        document.querySelectorAll('.nav-link').forEach(link => {
+            link.classList.remove('text-blue-400', 'border-b-2', 'border-blue-400', 'pb-1');
+            if (link.getAttribute('href') === `#${current}`) {
+                link.classList.add('text-blue-400', 'border-b-2', 'border-blue-400', 'pb-1');
+            }
+        });
+    });
+</script>
+<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=dablack/webproject" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
+</html>

prompts.txt ADDED Viewed

	@@ -0,0 +1,3 @@

+make the home page a scroll to explore type of thing with a video in full screen as the first thing seen on the website
+remove the section that says meet our leadership team. add a background image to the front page/home page. remove the what our clients say section and instead put some ratings without pictures and words of the people like just something simple. put the offers in dirhams and make the buttons to get started take you to a tab for scheduling a free consultation.
+fix the home, services and why us buttons so it takes takes you to the correct spot