commit 1fb569ae18950a4bd0394dfb9855defc59df7e99
Author: SloanOps Onboarding <automation@sloanops.com>
Date:   Tue Sep 1 02:43:03 2026 +0000

    Regenerated site from SloanOps template

diff --git a/.gitea/workflows/deploy.yml b/.gitea/workflows/deploy.yml
new file mode 100644
index 0000000..3e4244b
--- /dev/null
+++ b/.gitea/workflows/deploy.yml
@@ -0,0 +1,28 @@
+name: Deploy to Cloudflare Pages
+
+# Preview deployments are created for pushes to any non-master branch.
+# Pushing to master creates the production deployment (served on custom domain).
+# Non-master branches get a unique preview URL for client review.
+
+on:
+  push:
+  workflow_dispatch:
+
+env:
+  # These will be replaced during site creation
+  CLOUDFLARE_PROJECT_NAME: birdops
+  CLOUDFLARE_CUSTOM_DOMAIN: bird.ops
+
+jobs:
+  deploy:
+    name: Deploy to Cloudflare Pages
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: https://github.com/actions/checkout@v4
+
+      - name: Deploy to Cloudflare Pages (Direct Upload)
+        run: npx wrangler pages deploy . --project-name=${{ env.CLOUDFLARE_PROJECT_NAME }} --branch=${GITHUB_REF#refs/heads/}
+        env:
+          CLOUDFLARE_API_TOKEN: ${{ secrets.CF_API_TOKEN }}
+          CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CF_ACCOUNT_ID }}
diff --git a/README.md b/README.md
new file mode 100644
index 0000000..1b019a7
--- /dev/null
+++ b/README.md
@@ -0,0 +1,64 @@
+# BirdOps
+
+A professional website created for BirdOps using SloanOps template system.
+
+## Overview
+
+This site was generated using the SloanOps client onboarding system and is designed for deployment to Cloudflare Pages via Gitea Actions CI/CD.
+
+## Customization
+
+### Content Updates
+- Edit HTML files in the root directory to update page content
+- Modify images in the `images/` directory
+- Update text content directly in HTML files
+
+### Styling
+- All colors, fonts, and spacing are controlled via CSS variables in `css/style.css`
+- To rebrand: modify the `:root` variables at the top of `css/style.css`
+- Font families can be changed in the HTML `<head>` section
+
+### Deployment
+Pushes to the `master` branch trigger automatic deployment to Cloudflare Pages.
+Preview deployments are created for all other branches.
+
+## Structure
+
+```
+birdops/
+├── index.html              # Home page
+├── about.html              # About page (if included)
+├── services.html           # Services page (if included)
+├── products.html           # Products page (if included)
+├── contact.html            # Contact page
+├── css/
+│   └── style.css           # All styles with CSS variables
+├── js/
+│   └── main.js             # Interactive components (mobile menu, etc.)
+├── images/                 # Image assets
+└── .gitea/
+    └── workflows/
+        └── deploy.yml      # Cloudflare Pages CI/CD configuration
+```
+
+## Deployment Setup
+
+1. Ensure Cloudflare API token and account ID are configured as secrets in your Gitea repository:
+   - `CF_API_TOKEN`: Your Cloudflare API token
+   - `CF_ACCOUNT_ID`: Your Cloudflare account ID
+
+2. Push to the repository to trigger deployment:
+   ```bash
+   git add .
+   git commit -m "Initial commit"
+   git push origin master
+   ```
+
+3. The site will be available at: https://bird.ops
+
+## Maintenance
+
+- Update content by editing HTML files
+- Update styling by modifying CSS variables in `css/style.css`
+- Add new images to the `images/` directory and reference them in HTML
+- For structural changes, modify the appropriate HTML template
diff --git a/about.html b/about.html
new file mode 100644
index 0000000..7ab8a54
--- /dev/null
+++ b/about.html
@@ -0,0 +1,99 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="About BirdOps - ">
+    <title>About | BirdOps</title>
+    <link rel="stylesheet" href="css/style.css">
+    <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=Inter, sans-serif:wght@400;600;700&family=Inter, sans-serif:wght@400;500;600&display=swap" rel="stylesheet">
+</head>
+<body>
+    <header class="site-header">
+        <div class="container">
+            <a href="/" class="logo" aria-label="BirdOps - Home">
+                <span class="logo-text">BirdOps BirdUp</span>
+            </a>
+            <nav class="main-nav" aria-label="Main navigation">
+                <button class="nav-toggle" aria-expanded="false" aria-controls="nav-menu" aria-label="Toggle navigation">
+                    <span class="hamburger"></span>
+                </button>
+                <ul id="nav-menu" class="nav-list">
+                    <li><a href="/" class="nav-link">Home</a></li>
+                    <li><a href="/about.html" class="nav-link active">About</a></li>
+                    <li><a href="/services.html" class="nav-link">Services</a></li>
+                    <li><a href="/products.html" class="nav-link">Products</a></li>
+                </ul>
+            </nav>
+        </div>
+    </header>
+
+    <main class="site-main">
+        <section class="page-hero" aria-labelledby="page-heading">
+            <div class="container">
+                <h1 id="page-heading">About BirdOps</h1>
+                <p class="page-subheadline"></p>
+            </div>
+        </section>
+
+        <section class="about-content" aria-labelledby="about-heading">
+            <div class="container">
+                <div class="about-grid">
+                    <div class="about-text">
+                        <h2 id="about-heading"></h2>
+                        <div class="about-body">
+                        </div>
+                    </div>
+                    <div class="about-image">
+                        <img src="images/" alt="" loading="lazy">
+                    </div>
+                </div>
+            </div>
+        </section>
+
+        <div class="values-section">
+            <h2></h2>
+            <div class="values-grid">
+            </div>
+        </div>
+
+        <section class="team-section" aria-labelledby="team-heading">
+            <h2 id="team-heading"></h2>
+            <div class="team-grid">
+            </div>
+        </section>
+    </main>
+
+    <footer class="site-footer" role="contentinfo">
+        <div class="container">
+            <div class="footer-grid">
+                <div class="footer-brand">
+                    <p class="footer-logo">BirdOps BirdUp</p>
+                    <p class="footer-tagline"></p>
+                </div>
+                <nav class="footer-nav" aria-label="Footer navigation">
+                    <h3>Quick Links</h3>
+                    <ul>
+                        <li><a href="/">Home</a></li>
+                        <li><a href="/about.html">About</a></li>
+<li><a href="/services.html">Services</a></li><li><a href="/products.html">Products</a></li>                    </ul>
+                </nav>
+                <address class="footer-contact" aria-label="Contact information">
+                    <h3>Contact</h3>
+                    <p>1000 business center drive</p>
+                    <p><a href="tel:4074562683">999-999-9999</a></p>
+                    <p><a href="mailto:nightehawk@gmail.com">nightehawk@gmail.com</a></p>
+                </address>
+            </div>
+            <div class="footer-bottom">
+                <p>&copy; 2026 BirdOps. All rights reserved.</p>
+                <p class="footer-credits">Hosted by <a href="https://sloanops.com" target="_blank" rel="noopener">SloanOps</a></p>
+            </div>
+        </div>
+    </footer>
+
+    <script src="js/main.js"></script>
+</body>
+</html>
\ No newline at end of file
diff --git a/contact.html b/contact.html
new file mode 100644
index 0000000..e64a675
--- /dev/null
+++ b/contact.html
@@ -0,0 +1,129 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="Contact BirdOps - ">
+    <title>Contact | BirdOps</title>
+    <link rel="stylesheet" href="css/style.css">
+    <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=Inter, sans-serif:wght@400;600;700&family=Inter, sans-serif:wght@400;500;600&display=swap" rel="stylesheet">
+</head>
+<body>
+    <header class="site-header">
+        <div class="container">
+            <a href="/" class="logo" aria-label="BirdOps - Home">
+                <span class="logo-text">BirdOps BirdUp</span>
+            </a>
+            <nav class="main-nav" aria-label="Main navigation">
+                <button class="nav-toggle" aria-expanded="false" aria-controls="nav-menu" aria-label="Toggle navigation">
+                    <span class="hamburger"></span>
+                </button>
+                <ul id="nav-menu" class="nav-list">
+                    <li><a href="/" class="nav-link">Home</a></li>
+<li><a href="/services.html" class="nav-link">Services</a></li><li><a href="/products.html" class="nav-link">Products</a></li>                    <li><a href="/contact.html" class="nav-link active">Contact</a></li>
+                </ul>
+            </nav>
+        </div>
+    </header>
+
+    <main class="site-main">
+        <section class="page-hero" aria-labelledby="page-heading">
+            <div class="container">
+                <h1 id="page-heading">Contact Us</h1>
+                <p class="page-subheadline"></p>
+            </div>
+        </section>
+
+        <section class="contact-section" aria-labelledby="contact-heading">
+            <div class="container">
+                <div class="contact-grid">
+                    <div class="contact-info">
+                        <h2 id="contact-heading"></h2>
+                        <p></p>
+                        
+                        <div class="contact-methods">
+
+
+                        </div>
+                    </div>
+
+                    <div class="contact-form-wrapper">
+                        <h2></h2>
+                        <form id="contact-form" class="contact-form" action="https://n8n.sloanops.com/webhook/client-contact" method="POST">
+                            <input type="hidden" name="form_type" value="client-contact">
+                            <input type="hidden" name="site_key" value="birdops">
+                            <input type="hidden" name="_subject" value="BirdOps">
+                            <input type="hidden" name="_next" value="">
+                            
+                            <div class="form-group">
+                                <label for="name">Name <span class="required" aria-hidden="true">*</span></label>
+                                <input type="text" id="name" name="name" required autocomplete="name">
+                            </div>
+                            
+                            <div class="form-group">
+                                <label for="email">Email <span class="required" aria-hidden="true">*</span></label>
+                                <input type="email" id="email" name="email" required autocomplete="email">
+                            </div>
+                            
+                            <div class="form-group">
+                                <label for="phone">Phone</label>
+                                <input type="tel" id="phone" name="phone" autocomplete="tel">
+                            </div>
+                            
+                            <div class="form-group">
+                                <label for="subject">Subject</label>
+                                <select id="subject" name="subject">
+                                    <option value="">Select a topic</option>
+                                    <option value="General Inquiry">General Inquiry</option>
+                                </select>
+                            </div>
+                            
+                            <div class="form-group">
+                                <label for="message">Message <span class="required" aria-hidden="true">*</span></label>
+                                <textarea id="message" name="message" rows="6" required placeholder="How can we help you?"></textarea>
+                            </div>
+                            
+                            <button type="submit" class="btn btn-primary btn-full-width">birdup</button>
+                            
+                            <p class="form-note" aria-live="polite"></p>
+                        </form>
+                    </div>
+                </div>
+            </div>
+        </section>
+
+    </main>
+
+    <footer class="site-footer" role="contentinfo">
+        <div class="container">
+            <div class="footer-grid">
+                <div class="footer-brand">
+                    <p class="footer-logo">BirdOps BirdUp</p>
+                    <p class="footer-tagline"></p>
+                </div>
+                <nav class="footer-nav" aria-label="Footer navigation">
+                    <h3>Quick Links</h3>
+                    <ul>
+                        <li><a href="/">Home</a></li>
+<li><a href="/services.html">Services</a></li><li><a href="/products.html">Products</a></li>                        <li><a href="/contact.html">Contact</a></li>
+                    </ul>
+                </nav>
+                <address class="footer-contact" aria-label="Contact information">
+                    <h3>Contact</h3>
+                    <p>1000 business center drive</p>
+                    <p><a href="tel:4074562683">999-999-9999</a></p>
+                    <p><a href="mailto:nightehawk@gmail.com">nightehawk@gmail.com</a></p>
+                </address>
+            </div>
+            <div class="footer-bottom">
+                <p>&copy; 2026 BirdOps. All rights reserved.</p>
+                <p class="footer-credits">Hosted by <a href="https://sloanops.com" target="_blank" rel="noopener">SloanOps</a></p>
+            </div>
+        </div>
+    </footer>
+
+    <script src="js/main.js"></script>
+</body>
+</html>
\ No newline at end of file
diff --git a/css/style.css b/css/style.css
new file mode 100644
index 0000000..c90c4dd
--- /dev/null
+++ b/css/style.css
@@ -0,0 +1,1201 @@
+:root {
+  /* Brand Colors - PRIMARY */
+  --color-primary:       #2563eb;   /* Blue-600 */
+  --color-primary-dark:  #1d4ed8;   /* Blue-700 */
+  --color-primary-light: #3b82f6;   /* Blue-500 */
+  
+  /* Accent Colors */
+  --color-accent:        #10b981;   /* Emerald-500 */
+  --color-accent-dark:   #059669;   /* Emerald-600 */
+  
+  /* Neutral Colors */
+  --color-bg:            #f8fafc;   /* Slate-50 */
+  --color-surface:       #ffffff;   /* White */
+  --color-border:        #e2e8f0;   /* Slate-200 */
+  --color-text:          #1e293b;   /* Slate-800 */
+  --color-text-secondary:#64748b;   /* Slate-500 */
+  --color-text-muted:    #94a3b8;   /* Slate-400 */
+  --color-footer-bg:     #0f172a;   /* Slate-900 */
+  --color-footer-text:   #94a3b8;   /* Slate-400 */
+  
+  /* Typography */
+  --font-family-heading: Inter, sans-serif;
+  --font-family-body:    Inter, sans-serif;
+  
+  /* Layout & Spacing */
+  --max-width:           1200px;
+  --radius-lg:           12px;
+  --radius-md:           8px;
+  --radius-sm:           4px;
+  --spacing-2xs:         4px;
+  --spacing-xs:          8px;
+  --spacing-sm:          12px;
+  --spacing-md:          16px;
+  --spacing-lg:          24px;
+  --spacing-xl:          32px;
+  --spacing-2xl:         48px;
+  --transition-fast:     150ms;
+  --transition-normal:   300ms;
+  --shadow-sm:           0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
+  --shadow-md:           0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
+  --shadow-lg:           0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
+}
+
+/* Base Reset & Utilities */
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+
+html {
+  scroll-behavior: smooth;
+  font-size: 16px;
+}
+
+body {
+  font-family: var(--font-family-body), system-ui, sans-serif;
+  line-height: 1.6;
+  color: var(--color-text);
+  background-color: var(--color-bg);
+}
+
+h1, h2, h3, h4, h5, h6 {
+  font-family: var(--font-family-heading), system-ui, sans-serif;
+  line-height: 1.3;
+  margin-bottom: var(--spacing-md);
+}
+
+h1 { font-size: 2.5rem; }
+h2 { font-size: 2rem; }
+h3 { font-size: 1.75rem; }
+h4 { font-size: 1.5rem; }
+h5 { font-size: 1.25rem; }
+h6 { font-size: 1.125rem; }
+
+p {
+  margin-bottom: var(--spacing-md);
+}
+
+a {
+  color: var(--color-primary);
+  text-decoration: none;
+  transition: color var(--transition-fast);
+}
+
+a:hover {
+  color: var(--color-primary-dark);
+  text-decoration: underline;
+}
+
+img {
+  max-width: 100%;
+  height: auto;
+  display: block;
+}
+
+.container {
+  width: 100%;
+  max-width: var(--max-width);
+  margin: 0 auto;
+  padding: 0 var(--spacing-md);
+}
+
+/* Layout Components */
+.site-header {
+  background-color: var(--color-surface);
+  border-bottom: 1px solid var(--color-border);
+  position: sticky;
+  top: 0;
+  z-index: 1000;
+  box-shadow: var(--shadow-sm);
+}
+
+.logo {
+  display: flex;
+  align-items: center;
+  gap: var(--spacing-sm);
+  padding: var(--spacing-md) 0;
+}
+
+.logo-text {
+  font-size: 1.5rem;
+  font-weight: 700;
+  color: var(--color-primary);
+  text-decoration: none;
+}
+
+.logo-text:hover {
+  text-decoration: underline;
+}
+
+.acronym {
+  font-size: 0.875rem;
+  color: var(--color-text-muted);
+  font-style: italic;
+}
+
+/* Navigation */
+.main-nav {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: var(--spacing-sm) 0;
+}
+
+.nav-list {
+  display: flex;
+  gap: var(--spacing-lg);
+  list-style: none;
+}
+
+.nav-link {
+  font-weight: 500;
+  color: var(--color-text);
+  padding: var(--spacing-xs) 0;
+  position: relative;
+  transition: color var(--transition-fast);
+}
+
+.nav-link:hover {
+  color: var(--color-primary);
+}
+
+.nav-link.active {
+  color: var(--color-primary);
+}
+
+.nav-link.active::after {
+  content: '';
+  position: absolute;
+  bottom: -2px;
+  left: 0;
+  width: 100%;
+  height: 2px;
+  background-color: var(--color-primary);
+  border-radius: var(--radius-sm);
+}
+
+.nav-toggle {
+  display: none;
+  flex-direction: column;
+  gap: var(--spacing-2xs);
+  background: none;
+  border: none;
+  cursor: pointer;
+  padding: var(--spacing-xs);
+}
+
+.hamburger {
+  width: 24px;
+  height: 2px;
+  background-color: var(--color-text);
+  transition: transform var(--transition-fast), opacity var(--transition-fast);
+}
+
+/* Hamburger Animation */
+.nav-toggle[aria-expanded="true"] .hamburger:nth-child(1) {
+  transform: rotate(45deg) translate(5px, 5px);
+}
+.nav-toggle[aria-expanded="true"] .hamburger:nth-child(2) {
+  opacity: 0;
+}
+.nav-toggle[aria-expanded="true"] .hamburger:nth-child(3) {
+  transform: rotate(-45deg) translate(5px, -5px);
+}
+
+/* Mobile Menu */
+@media (max-width: 768px) {
+  .nav-toggle {
+    display: flex;
+  }
+  
+  #nav-menu {
+    position: fixed;
+    top: 0;
+    right: -100%;
+    height: 100vh;
+    width: 250px;
+    background-color: var(--color-surface);
+    flex-direction: column;
+    align-items: flex-start;
+    padding-top: 6rem;
+    gap: 0;
+    transition: right var(--transition-normal);
+    z-index: 999;
+    box-shadow: -2px 0 5px rgba(0,0,0,0.1);
+  }
+  
+  #nav-menu.active {
+    right: 0;
+  }
+  
+  .nav-list {
+    flex-direction: column;
+    width: 100%;
+  }
+  
+  .nav-link {
+    width: 100%;
+    padding: var(--spacing-lg) var(--spacing-xl);
+    border-bottom: 1px solid var(--color-border);
+  }
+  
+  .nav-link:last-child {
+    border-bottom: none;
+  }
+}
+
+/* Hero Section */
+.hero {
+  background: linear-gradient(135deg, var(--color-bg) 0%, #f0f9ff 100%);
+  padding: var(--spacing-2xl) 0 var(--spacing-xl);
+  text-align: center;
+}
+
+.hero h1 {
+  font-size: 2.75rem;
+  margin-bottom: var(--spacing-lg);
+  background: linear-gradient(to right, var(--color-primary), var(--color-accent));
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+  background-clip: text;
+}
+
+.hero-subheadline {
+  font-size: 1.25rem;
+  color: var(--color-text-secondary);
+  max-width: 700px;
+  margin: 0 auto var(--spacing-xl);
+}
+
+.btn {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: var(--spacing-xs);
+  padding: var(--spacing-sm) var(--spacing-lg);
+  font-weight: 600;
+  border-radius: var(--radius-md);
+  cursor: pointer;
+  border: none;
+  transition: all var(--transition-fast);
+  text-decoration: none;
+  font-size: 1rem;
+}
+
+.btn-primary {
+  background-color: var(--color-primary);
+  color: white;
+}
+
+.btn-primary:hover {
+  background-color: var(--color-primary-dark);
+  transform: translateY(-2px);
+  box-shadow: var(--shadow-md);
+}
+
+.btn-secondary {
+  background-color: var(--color-surface);
+  color: var(--color-text);
+  border: 2px solid var(--color-border);
+}
+
+.btn-secondary:hover {
+  background-color: var(--color-bg);
+  border-color: var(--color-primary);
+  transform: translateY(-2px);
+  box-shadow: var(--shadow-sm);
+}
+
+.btn-outline {
+  background-color: transparent;
+  color: var(--color-primary);
+  border: 2px solid var(--color-primary);
+}
+
+.btn-outline:hover {
+  background-color: var(--color-primary);
+  color: white;
+}
+
+/* Features Section */
+.features {
+  padding: var(--spacing-2xl) 0;
+  background-color: var(--color-surface);
+}
+
+.features h2 {
+  text-align: center;
+  margin-bottom: var(--spacing-2xl);
+}
+
+.features-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
+  gap: var(--spacing-lg);
+}
+
+.feature-card {
+  text-align: center;
+  padding: var(--spacing-lg);
+  border-radius: var(--radius-lg);
+  background-color: var(--color-bg);
+  transition: transform var(--transition-normal), box-shadow var(--transition-normal);
+}
+
+.feature-card:hover {
+  transform: translateY(-8px);
+  box-shadow: var(--shadow-lg);
+}
+
+.feature-icon {
+  font-size: 2.5rem;
+  margin-bottom: var(--spacing-md);
+  color: var(--color-primary);
+}
+
+.feature-card h3 {
+  margin-bottom: var(--spacing-sm);
+  color: var(--color-text);
+}
+
+.feature-card p {
+  color: var(--color-text-secondary);
+  line-height: 1.7;
+}
+
+/* About Section */
+.about-content {
+  padding: var(--spacing-2xl) 0;
+  background-color: var(--color-bg);
+}
+
+.about-grid {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: var(--spacing-2xl);
+  align-items: start;
+}
+
+.about-text h2 {
+  color: var(--color-primary);
+  margin-bottom: var(--spacing-lg);
+}
+
+.about-text p {
+  margin-bottom: var(--spacing-lg);
+  color: var(--color-text);
+  line-height: 1.8;
+}
+
+.about-image img {
+  border-radius: var(--radius-lg);
+  box-shadow: var(--shadow-md);
+  object-fit: cover;
+}
+
+/* Values Section */
+.values-section {
+  padding: var(--spacing-2xl) 0;
+  background-color: var(--color-surface);
+}
+
+.values-section h2 {
+  text-align: center;
+  margin-bottom: var(--spacing-2xl);
+  color: var(--color-primary);
+}
+
+.values-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
+  gap: var(--spacing-lg);
+}
+
+.value-card {
+  text-align: center;
+  padding: var(--spacing-lg);
+  border-radius: var(--radius-lg);
+  background-color: var(--color-bg);
+  transition: transform var(--transition-normal);
+}
+
+.value-card:hover {
+  transform: translateY(-5px);
+}
+
+.value-icon {
+  font-size: 2rem;
+  margin-bottom: var(--spacing-md);
+  color: var(--color-accent);
+}
+
+.value-card h3 {
+  margin-bottom: var(--spacing-sm);
+  color: var(--color-text);
+}
+
+.value-card p {
+  color: var(--color-text-secondary);
+  line-height: 1.6;
+}
+
+/* Services Section */
+.services-list {
+  padding: var(--spacing-2xl) 0;
+  background-color: var(--color-bg);
+}
+
+.services-list h2 {
+  text-align: center;
+  margin-bottom: var(--spacing-2xl);
+  color: var(--color-primary);
+}
+
+.services-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
+  gap: var(--spacing-lg);
+}
+
+.service-card {
+  background-color: var(--color-surface);
+  border-radius: var(--radius-lg);
+  overflow: hidden;
+  box-shadow: var(--shadow-sm);
+  transition: transform var(--transition-normal), box-shadow var(--transition-normal);
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+}
+
+.service-card:hover {
+  transform: translateY(-8px);
+  box-shadow: var(--shadow-lg);
+}
+
+.service-icon {
+  font-size: 2.75rem;
+  text-align: center;
+  padding: var(--spacing-xl) 0;
+  background-color: var(--color-bg);
+  color: var(--color-primary);
+}
+
+.service-card h3 {
+  flex-grow: 1;
+  margin: 0 var(--spacing-lg) var(--spacing-sm);
+  color: var(--color-text);
+}
+
+.service-card p {
+  flex-grow: 2;
+  margin: 0 var(--spacing-lg) var(--spacing-sm);
+  color: var(--color-text-secondary);
+  line-height: 1.7;
+}
+
+.service-features {
+  margin: 0 var(--spacing-lg) var(--spacing-sm);
+  padding-left: 1.25rem;
+}
+
+.service-features li {
+  margin-bottom: var(--spacing-xs);
+  color: var(--color-text);
+  position: relative;
+}
+
+.service-features li::before {
+  content: "→";
+  position: absolute;
+  left: -1rem;
+  color: var(--color-accent);
+}
+
+.service-price {
+  margin: 0 var(--spacing-lg) var(--spacing-sm);
+  padding: var(--spacing-xs) var(--spacing-sm);
+  background-color: var(--color-accent);
+  color: white;
+  font-weight: 600;
+  border-radius: var(--radius-sm);
+  display: inline-block;
+}
+
+.service-card .btn-secondary {
+  margin: var(--spacing-sm) var(--spacing-lg) var(--spacing-xl);
+  align-self: flex-start;
+}
+
+/* Process Section */
+.process-section {
+  padding: var(--spacing-2xl) 0;
+  background-color: var(--color-surface);
+}
+
+.process-section h2 {
+  text-align: center;
+  margin-bottom: var(--spacing-2xl);
+  color: var(--color-primary);
+}
+
+.process-steps {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
+  gap: var(--spacing-lg);
+}
+
+.process-step {
+  text-align: center;
+  padding: var(--spacing-lg);
+  background-color: var(--color-bg);
+  border-radius: var(--radius-lg);
+  box-shadow: var(--shadow-sm);
+  transition: transform var(--transition-normal);
+}
+
+.process-step:hover {
+  transform: translateY(-5px);
+}
+
+.step-number {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 48px;
+  height: 48px;
+  background-color: var(--color-primary);
+  color: white;
+  border-radius: 50%;
+  font-weight: 700;
+  margin-bottom: var(--spacing-md);
+  font-size: 1.25rem;
+}
+
+.process-step h3 {
+  margin-bottom: var(--spacing-sm);
+  color: var(--color-text);
+}
+
+.process-step p {
+  color: var(--color-text-secondary);
+  line-height: 1.6;
+}
+
+/* CTA Section */
+.cta-section {
+  padding: var(--spacing-2xl) 0;
+  background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-accent) 100%);
+  color: white;
+  text-align: center;
+}
+
+.cta-section h2 {
+  margin-bottom: var(--spacing-lg);
+}
+
+.cta-section p {
+  margin-bottom: var(--spacing-xl);
+  opacity: 0.9;
+  max-width: 700px;
+  margin-left: auto;
+  margin-right: auto;
+}
+
+.cta-section .btn-primary {
+  background-color: white;
+  color: var(--color-primary);
+}
+
+.cta-section .btn-primary:hover {
+  background-color: var(--color-surface);
+}
+
+/* Testimonials Section */
+.testimonials {
+  padding: var(--spacing-2xl) 0;
+  background-color: var(--color-bg);
+}
+
+.testimonials h2 {
+  text-align: center;
+  margin-bottom: var(--spacing-2xl);
+  color: var(--color-primary);
+}
+
+.testimonials-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
+  gap: var(--spacing-lg);
+}
+
+.testimonial-card {
+  background-color: var(--color-surface);
+  border-radius: var(--radius-lg);
+  padding: var(--spacing-lg);
+  box-shadow: var(--shadow-sm);
+  border-left: 4px solid var(--color-accent);
+}
+
+.testimonial-text {
+  font-style: italic;
+  margin-bottom: var(--spacing-md);
+  color: var(--color-text);
+  line-height: 1.8;
+  position: relative;
+}
+
+.testimonial-text::before {
+  content: '"';
+  font-size: 3rem;
+  opacity: 0.2;
+  position: absolute;
+  top: -1rem;
+  left: -0.5rem;
+}
+
+.testimonial-author {
+  display: flex;
+  align-items: center;
+  gap: var(--spacing-sm);
+  font-size: 0.875rem;
+}
+
+.testimonial-author cite {
+  font-weight: 600;
+  color: var(--color-text);
+}
+
+.author-role {
+  font-size: 0.75rem;
+  color: var(--color-text-muted);
+  font-style: italic;
+}
+
+/* Contact Section */
+.contact-section {
+  padding: var(--spacing-2xl) 0;
+  background-color: var(--color-surface);
+}
+
+.contact-grid {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: var(--spacing-2xl);
+  align-items: start;
+}
+
+.contact-info h2 {
+  color: var(--color-primary);
+  margin-bottom: var(--spacing-lg);
+}
+
+.contact-methods {
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-lg);
+  margin-bottom: var(--spacing-xl);
+}
+
+.contact-method {
+  display: flex;
+  align-items: flex-start;
+  gap: var(--spacing-md);
+}
+
+.method-icon {
+  font-size: 1.5rem;
+  color: var(--color-primary);
+  min-width: 24px;
+}
+
+.method-content h3 {
+  margin-bottom: var(--spacing-xs);
+  color: var(--color-text);
+}
+
+.method-content p,
+.method-content address {
+  margin: 0;
+  color: var(--color-text-secondary);
+  line-height: 1.6;
+}
+
+.method-note {
+  font-size: 0.875rem;
+  color: var(--color-text-muted);
+  margin-top: var(--spacing-xs);
+  font-style: italic;
+}
+
+.contact-form-wrapper h2 {
+  color: var(--color-primary);
+  margin-bottom: var(--spacing-lg);
+}
+
+.contact-form {
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-md);
+}
+
+.form-group {
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-2xs);
+}
+
+.form-group label {
+  font-weight: 600;
+  color: var(--color-text);
+  margin-bottom: var(--spacing-2xs);
+}
+
+.form-group input,
+.form-group textarea,
+.form-group select {
+  padding: var(--spacing-sm);
+  border: 2px solid var(--color-border);
+  border-radius: var(--radius-md);
+  font-family: inherit;
+  font-size: 1rem;
+  transition: border-color var(--transition-fast);
+}
+
+.form-group input:focus,
+.form-group textarea:focus,
+.form-group select:focus {
+  outline: none;
+  border-color: var(--color-primary);
+  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.2);
+}
+
+.form-group input::placeholder,
+.form-group textarea::placeholder {
+  color: var(--color-text-muted);
+}
+
+.form-group textarea {
+  resize: vertical;
+  min-height: 120px;
+}
+
+.form-note {
+  min-height: 1.5rem;
+  margin-top: var(--spacing-xs);
+  font-size: 0.875rem;
+}
+
+/* Products Section */
+.products-list,
+.product-categories {
+  padding: var(--spacing-2xl) 0;
+  background-color: var(--color-bg);
+}
+
+.products-list h2,
+.product-categories h2 {
+  text-align: center;
+  margin-bottom: var(--spacing-2xl);
+  color: var(--color-primary);
+}
+
+.category-tabs {
+  margin-bottom: var(--spacing-xl);
+}
+
+.category-tabs ul {
+  display: flex;
+  gap: var(--spacing-md);
+  justify-content: center;
+  flex-wrap: wrap;
+}
+
+.category-tab {
+  padding: var(--spacing-sm) var(--spacing-lg);
+  background-color: var(--color-surface);
+  border: 2px solid var(--color-border);
+  border-radius: var(--radius-md);
+  color: var(--color-text);
+  font-weight: 500;
+  cursor: pointer;
+  transition: all var(--transition-fast);
+}
+
+.category-tab:hover:not(.active) {
+  background-color: var(--color-bg);
+  border-color: var(--color-primary);
+  color: var(--color-primary);
+}
+
+.category-tab.active {
+  background-color: var(--color-primary);
+  color: white;
+  border-color: var(--color-primary);
+}
+
+.category-panel {
+  display: none;
+  animation: fadeIn 0.3s ease-in-out;
+}
+
+.category-panel.active {
+  display: block;
+}
+
+@keyframes fadeIn {
+  from { opacity: 0; transform: translateY(10px); }
+  to { opacity: 1; transform: translateY(0); }
+}
+
+.products-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
+  gap: var(--spacing-lg);
+}
+
+.product-card {
+  background-color: var(--color-surface);
+  border-radius: var(--radius-lg);
+  overflow: hidden;
+  box-shadow: var(--shadow-sm);
+  transition: transform var(--transition-normal), box-shadow var(--transition-normal);
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+}
+
+.product-card:hover {
+  transform: translateY(-6px);
+  box-shadow: var(--shadow-md);
+}
+
+.product-image {
+  height: 200px;
+  overflow: hidden;
+  background-color: var(--color-bg);
+}
+
+.product-image img {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+  transition: transform var(--transition-normal);
+}
+
+.product-card:hover .product-image img {
+  transform: scale(1.05);
+}
+
+.product-info {
+  flex-grow: 1;
+  display: flex;
+  flex-direction: column;
+  padding: var(--spacing-lg);
+}
+
+.product-info h3 {
+  margin-bottom: var(--spacing-sm);
+  color: var(--color-text);
+  flex-grow: 1;
+}
+
+.product-description {
+  color: var(--color-text-secondary);
+  margin-bottom: var(--spacing-md);
+  flex-grow: 2;
+  line-height: 1.6;
+}
+
+.product-meta {
+  margin-top: auto;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: var(--spacing-sm);
+}
+
+.product-price {
+  font-weight: 700;
+  color: var(--color-primary);
+  font-size: 1.25rem;
+  background-color: rgba(37, 99, 235, 0.1);
+  padding: var(--spacing-xs) var(--spacing-sm);
+  border-radius: var(--radius-sm);
+}
+
+.product-tags {
+  display: flex;
+  gap: var(--spacing-xs);
+  flex-wrap: wrap;
+}
+
+.tag {
+  background-color: var(--color-bg);
+  color: var(--color-text);
+  padding: var(--spacing-2xs) var(--spacing-sm);
+  border-radius: var(--radius-sm);
+  font-size: 0.875rem;
+  border: 1px solid var(--color-border);
+}
+
+/* Footer */
+.site-footer {
+  background-color: var(--color-footer-bg);
+  color: var(--color-footer-text);
+  padding: var(--spacing-xl) 0 var(--spacing-lg);
+}
+
+.footer-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
+  gap: var(--spacing-2xl);
+}
+
+.footer-brand .footer-logo {
+  font-size: 1.5rem;
+  font-weight: 700;
+  color: var(--color-primary);
+  margin-bottom: var(--spacing-sm);
+}
+
+.footer-brand .footer-tagline {
+  font-size: 0.875rem;
+  color: var(--color-footer-text);
+}
+
+.footer-nav h3,
+.footer-contact h3 {
+  font-size: 1.125rem;
+  margin-bottom: var(--spacing-sm);
+  color: var(--color-surface);
+}
+
+.footer-nav ul {
+  list-style: none;
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-xs);
+}
+
+.footer-nav a {
+  color: var(--color-footer-text);
+  transition: color var(--transition-fast);
+}
+
+.footer-nav a:hover {
+  color: var(--color-surface);
+}
+
+.footer-contact p {
+  margin-bottom: var(--spacing-sm);
+  line-height: 1.6;
+}
+
+.footer-bottom {
+  text-align: center;
+  margin-top: var(--spacing-2xl);
+  padding-top: var(--spacing-lg);
+  border-top: 1px solid rgba(255, 255, 255, 0.1);
+  font-size: 0.875rem;
+  color: var(--color-footer-text);
+}
+
+.footer-credits a {
+  color: var(--color-footer-text);
+  text-decoration: underline;
+}
+
+.footer-credits a:hover {
+  opacity: 0.8;
+}
+
+/* Utility Classes */
+.visually-hidden {
+  position: absolute !important;
+  width: 1px !important;
+  height: 1px !important;
+  padding: 0 !important;
+  margin: -1px !important;
+  overflow: hidden !important;
+  clip: rect(0, 0, 0, 0) !important;
+  white-space: nowrap !important;
+  border: 0 !important;
+}
+
+.text-center {
+  text-align: center;
+}
+
+.text-primary {
+  color: var(--color-primary);
+}
+
+.bg-primary {
+  background-color: var(--color-primary);
+}
+
+.bg-surface {
+  background-color: var(--color-surface);
+}
+
+.rounded-lg {
+  border-radius: var(--radius-lg);
+}
+
+.shadow-md {
+  box-shadow: var(--shadow-md);
+}
+
+/* Animations */
+@keyframes pulse {
+  0% { opacity: 1; }
+  50% { opacity: 0.7; }
+  100% { opacity: 1; }
+}
+
+.pulse {
+  animation: pulse 2s infinite;
+}
+
+/* Responsive Breakpoints */
+@media (max-width: 1024px) {
+  .container {
+    padding: 0 var(--spacing-lg);
+  }
+  
+  h1 { font-size: 2.25rem; }
+  h2 { font-size: 1.75rem; }
+  h3 { font-size: 1.5rem; }
+}
+
+@media (max-width: 768px) {
+  :root {
+    --spacing-2xl: 32px;
+    --spacing-xl: 24px;
+    --spacing-lg: 20px;
+    --spacing-md: 16px;
+    --spacing-sm: 12px;
+    --spacing-xs: 8px;
+    --spacing-2xs: 4px;
+  }
+  
+  .features-grid,
+  .services-grid,
+  .values-grid,
+  .process-steps,
+  .testimonials-grid,
+  .products-grid {
+    grid-template-columns: 1fr;
+  }
+  
+  .about-grid,
+  .contact-grid {
+    grid-template-columns: 1fr;
+  }
+  
+  .hero h1 {
+    font-size: 2rem;
+  }
+  
+  .logo {
+    justify-content: center;
+  }
+  
+  .nav-list {
+    gap: var(--spacing-md);
+  }
+  
+  .nav-link {
+    padding: var(--spacing-xs) 0;
+  }
+}
+
+@media (max-width: 480px) {
+  h1 { font-size: 1.75rem; }
+  h2 { font-size: 1.5rem; }
+  h3 { font-size: 1.25rem; }
+  
+  .btn {
+    padding: var(--spacing-xs) var(--spacing-md);
+    font-size: 0.875rem;
+  }
+  
+  .hero {
+    padding: var(--spacing-xl) 0 var(--spacing-lg);
+  }
+  
+  .hero h1 {
+    font-size: 1.75rem;
+  }
+  
+  .hero-subheadline {
+    font-size: 1.125rem;
+  }
+  
+  .step-number {
+    width: 40px;
+    height: 40px;
+    font-size: 1.125rem;
+  }
+}
+
+/* Dark Mode Support */
+@media (prefers-color-scheme: dark) {
+  :root {
+    --color-bg: #0f172a;
+    --color-surface: #1e293b;
+    --color-border: #334155;
+    --color-text: #f8fafc;
+    --color-text-secondary: #94a3b8;
+    --color-text-muted: #64748b;
+    --color-footer-bg: #000000;
+    --color-footer-text: #94a3b8;
+  }
+  
+  .site-header {
+    background-color: var(--color-surface);
+    border-color: var(--color-border);
+  }
+  
+  .hero {
+    background: linear-gradient(135deg, var(--color-bg) 0%, #1e293b 100%);
+  }
+  
+  .feature-card,
+  .value-card,
+  .process-step,
+  .testimonial-card,
+  .product-card,
+  .service-card {
+    background-color: var(--color-surface);
+    border-color: var(--color-border);
+  }
+  
+  .footer-bottom {
+    border-top: 1px solid rgba(255, 255, 255, 0.05);
+  }
+}
+
+/* Print Styles */
+@media print {
+  .site-header,
+  .nav-toggle,
+  .btn,
+  .cta-section {
+    display: none !important;
+  }
+  
+  body {
+    background-color: white !important;
+    color: black !important;
+  }
+  
+  a {
+    color: black !important;
+    text-decoration: underline;
+  }
+}
\ No newline at end of file
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..5ab025a
--- /dev/null
+++ b/index.html
@@ -0,0 +1,92 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="BirdUp for BirdOps">
+    <title>BirdOps</title>
+    <link rel="stylesheet" href="css/style.css">
+    <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=Inter, sans-serif:wght@400;600;700&family=Inter, sans-serif:wght@400;500;600&display=swap" rel="stylesheet">
+</head>
+<body>
+    <header class="site-header">
+        <div class="container">
+            <a href="/" class="logo" aria-label="BirdOps - Home">
+                <span class="logo-text">BirdOps BirdUp</span>
+            </a>
+            <nav class="main-nav" aria-label="Main navigation">
+                <button class="nav-toggle" aria-expanded="false" aria-controls="nav-menu" aria-label="Toggle navigation">
+                    <span class="hamburger"></span>
+                </button>
+                <ul id="nav-menu" class="nav-list">
+                    <li><a href="/" class="nav-link">Home</a></li>
+                    <li><a href="/services.html" class="nav-link">Services</a></li>
+                    <li><a href="/products.html" class="nav-link">Products</a></li>
+                </ul>
+            </nav>
+        </div>
+    </header>
+
+    <main class="site-main">
+        <!-- Hero Section -->
+        <section class="hero" aria-labelledby="hero-heading">
+            <div class="container">
+                <h1 id="hero-heading">BirdUp with BirdOps</h1>
+                <p class="hero-subheadline">Birds da word</p>
+                <a href="" class="btn btn-primary">BirdOps</a>
+            </div>
+        </section>
+
+        <!-- Value Props / Features -->
+        <section class="features" aria-labelledby="features-heading">
+            <div class="container">
+                <h2 id="features-heading" class="section-title"></h2>
+                <div class="features-grid">
+                </div>
+            </div>
+        </section>
+
+        <!-- About Preview -->
+
+        <!-- Testimonials -->
+        <section class="testimonials" aria-labelledby="testimonials-heading">
+            <div class="container">
+                <h2 id="testimonials-heading" class="section-title">What Our Clients Say</h2>
+                <div class="testimonials-grid">
+                </div>
+            </div>
+        </section>
+    </main>
+
+    <footer class="site-footer" role="contentinfo">
+        <div class="container">
+            <div class="footer-grid">
+                <div class="footer-brand">
+                    <p class="footer-logo">BirdOps BirdUp</p>
+                    <p class="footer-tagline"></p>
+                </div>
+                <nav class="footer-nav" aria-label="Footer navigation">
+                    <h3>Quick Links</h3>
+                    <ul>
+                        <li><a href="/">Home</a></li>
+<li><a href="/services.html">Services</a></li><li><a href="/products.html">Products</a></li>                    </ul>
+                </nav>
+                <address class="footer-contact" aria-label="Contact information">
+                    <h3>Contact</h3>
+                    <p>1000 business center drive</p>
+                    <p><a href="tel:4074562683">999-999-9999</a></p>
+                    <p><a href="mailto:nightehawk@gmail.com">nightehawk@gmail.com</a></p>
+                </address>
+            </div>
+            <div class="footer-bottom">
+                <p>&copy; 2026 BirdOps. All rights reserved.</p>
+                <p class="footer-credits">Hosted by <a href="https://sloanops.com" target="_blank" rel="noopener">SloanOps</a></p>
+            </div>
+        </div>
+    </footer>
+
+    <script src="js/main.js"></script>
+</body>
+</html>
\ No newline at end of file
diff --git a/js/main.js b/js/main.js
new file mode 100644
index 0000000..2a923f6
--- /dev/null
+++ b/js/main.js
@@ -0,0 +1,153 @@
+// Mobile Menu Toggle
+document.addEventListener('DOMContentLoaded', function() {
+    const navToggle = document.querySelector('.nav-toggle');
+    const navMenu = document.getElementById('nav-menu');
+    
+    if (navToggle && navMenu) {
+        navToggle.addEventListener('click', function() {
+            const expanded = this.getAttribute('aria-expanded') === 'true' || false;
+            this.setAttribute('aria-expanded', !expanded);
+            navMenu.classList.toggle('active');
+        });
+    }
+    
+    // Close mobile menu when clicking outside
+    document.addEventListener('click', function(event) {
+        if (navToggle && navMenu) {
+            const isClickInsideNav = navToggle.contains(event.target) || navMenu.contains(event.target);
+            if (!isClickInsideNav && navMenu.classList.contains('active')) {
+                navToggle.setAttribute('aria-expanded', 'false');
+                navMenu.classList.remove('active');
+            }
+        }
+    });
+    
+    // FAQ Accordion
+    const faqItems = document.querySelectorAll('.faq-item');
+    faqItems.forEach(item => {
+        const question = item.querySelector('.faq-question');
+        if (question) {
+            question.addEventListener('click', () => {
+                const isActive = item.classList.contains('active');
+                // Close all items
+                faqItems.forEach(i => i.classList.remove('active'));
+                // Open clicked item if it wasn't active
+                if (!isActive) {
+                    item.classList.add('active');
+                }
+            });
+        }
+    });
+    
+    // Smooth scrolling for anchor links
+    document.querySelectorAll('a[href^="#"]').forEach(anchor => {
+        anchor.addEventListener('click', function(e) {
+            const target = document.querySelector(this.getAttribute('href'));
+            if (target) {
+                e.preventDefault();
+                target.scrollIntoView({
+                    behavior: 'smooth',
+                    block: 'start'
+                });
+            }
+        });
+    });
+    
+    // Back to top button
+    const backToTopButton = document.createElement('button');
+    backToTopButton.innerHTML = '&#x25B2;'; // Up arrow
+    backToTopButton.className = 'back-to-top';
+    backToTopButton.setAttribute('aria-label', 'Back to top');
+    document.body.appendChild(backToTopButton);
+    
+    backToTopButton.addEventListener('click', () => {
+        window.scrollTo({
+            top: 0,
+            behavior: 'smooth'
+        });
+    });
+    
+    window.addEventListener('scroll', () => {
+        if (window.pageYOffset > 300) {
+            backToTopButton.classList.add('visible');
+        } else {
+            backToTopButton.classList.remove('visible');
+        }
+    });
+    
+    // Send contact messages to the configured n8n webhook without exposing any mail credentials.
+    const forms = document.querySelectorAll('.contact-form');
+    forms.forEach(form => {
+        form.addEventListener('submit', async function(e) {
+            e.preventDefault();
+            const formNote = this.querySelector('.form-note');
+            const submitButton = this.querySelector('button[type="submit"]');
+            if (submitButton) submitButton.disabled = true;
+            if (formNote) formNote.textContent = 'Sending…';
+
+            try {
+                const response = await fetch(this.action, {
+                    method: 'POST',
+                    body: new FormData(this),
+                    headers: { 'Accept': 'application/json' }
+                });
+                if (!response.ok) throw new Error('Webhook submission failed');
+                if (formNote) {
+                    formNote.textContent = 'Thank you for your message! We will get back to you soon.';
+                    formNote.style.color = '#10b981';
+                }
+                this.reset();
+            } catch (error) {
+                if (formNote) {
+                    formNote.textContent = 'We could not send your message. Please try again or contact us directly.';
+                    formNote.style.color = '#dc2626';
+                }
+            } finally {
+                if (submitButton) submitButton.disabled = false;
+            }
+        });
+    });
+    
+    // Tab functionality for product categories
+    const tabButtons = document.querySelectorAll('.category-tab');
+    tabButtons.forEach(button => {
+        button.addEventListener('click', () => {
+            const tabSlug = button.getAttribute('aria-controls');
+            const tabPanel = document.getElementById(tabSlug);
+            
+            // Remove active class from all tabs and panels
+            tabButtons.forEach(btn => btn.classList.remove('active'));
+            document.querySelectorAll('.category-panel').forEach(panel => panel.classList.remove('active'));
+            
+            // Add active class to clicked tab and corresponding panel
+            button.classList.add('active');
+            if (tabPanel) {
+                tabPanel.classList.add('active');
+            }
+        });
+    });
+    
+    // Header scroll effect
+    const header = document.querySelector('.site-header');
+    let lastScroll = 0;
+    
+    window.addEventListener('scroll', () => {
+        const currentScroll = window.pageYOffset;
+        
+        if (currentScroll <= 0) {
+            header.classList.remove('scroll-up');
+            return;
+        }
+        
+        if (currentScroll > lastScroll && !header.classList.contains('scroll-down')) {
+            // Scrolling down
+            header.classList.remove('scroll-up');
+            header.classList.add('scroll-down');
+        } else if (currentScroll < lastScroll && header.classList.contains('scroll-down')) {
+            // Scrolling up
+            header.classList.remove('scroll-down');
+            header.classList.add('scroll-up');
+        }
+        lastScroll = currentScroll;
+    });
+});
diff --git a/products.html b/products.html
new file mode 100644
index 0000000..cfb014e
--- /dev/null
+++ b/products.html
@@ -0,0 +1,84 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="BirdOps Products - ">
+    <title>Products | BirdOps</title>
+    <link rel="stylesheet" href="css/style.css">
+    <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=Inter, sans-serif:wght@400;600;700&family=Inter, sans-serif:wght@400;500;600&display=swap" rel="stylesheet">
+</head>
+<body>
+    <header class="site-header">
+        <div class="container">
+            <a href="/" class="logo" aria-label="BirdOps - Home">
+                <span class="logo-text">BirdOps BirdUp</span>
+            </a>
+            <nav class="main-nav" aria-label="Main navigation">
+                <button class="nav-toggle" aria-expanded="false" aria-controls="nav-menu" aria-label="Toggle navigation">
+                    <span class="hamburger"></span>
+                </button>
+                <ul id="nav-menu" class="nav-list">
+                    <li><a href="/" class="nav-link">Home</a></li>
+<li><a href="/services.html" class="nav-link">Services</a></li>                    <li><a href="/products.html" class="nav-link active">Products</a></li>
+                </ul>
+            </nav>
+        </div>
+    </header>
+
+    <main class="site-main">
+        <section class="page-hero" aria-labelledby="page-heading">
+            <div class="container">
+                <h1 id="page-heading">Our Products</h1>
+                <p class="page-subheadline">birds for your needs</p>
+            </div>
+        </section>
+
+        <section class="product-categories" aria-labelledby="categories-heading">
+            <div class="container">
+                <nav class="category-tabs" aria-label="Product categories">
+                    <h2 id="categories-heading" class="visually-hidden">Product Categories</h2>
+                    <ul role="tablist">
+                    </ul>
+                </nav>
+
+                <div class="category-panels">
+                </div>
+            </div>
+        </section>
+
+    </main>
+
+    <footer class="site-footer" role="contentinfo">
+        <div class="container">
+            <div class="footer-grid">
+                <div class="footer-brand">
+                    <p class="footer-logo">BirdOps BirdUp</p>
+                    <p class="footer-tagline"></p>
+                </div>
+                <nav class="footer-nav" aria-label="Footer navigation">
+                    <h3>Quick Links</h3>
+                    <ul>
+                        <li><a href="/">Home</a></li>
+<li><a href="/services.html">Services</a></li>                        <li><a href="/products.html">Products</a></li>
+                    </ul>
+                </nav>
+                <address class="footer-contact" aria-label="Contact information">
+                    <h3>Contact</h3>
+                    <p>1000 business center drive</p>
+                    <p><a href="tel:4074562683">999-999-9999</a></p>
+                    <p><a href="mailto:nightehawk@gmail.com">nightehawk@gmail.com</a></p>
+                </address>
+            </div>
+            <div class="footer-bottom">
+                <p>&copy; 2026 BirdOps. All rights reserved.</p>
+                <p class="footer-credits">Hosted by <a href="https://sloanops.com" target="_blank" rel="noopener">SloanOps</a></p>
+            </div>
+        </div>
+    </footer>
+
+    <script src="js/main.js"></script>
+</body>
+</html>
\ No newline at end of file
diff --git a/services.html b/services.html
new file mode 100644
index 0000000..9e9738a
--- /dev/null
+++ b/services.html
@@ -0,0 +1,88 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="BirdOps Services - ">
+    <title>Services | BirdOps</title>
+    <link rel="stylesheet" href="css/style.css">
+    <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=Inter, sans-serif:wght@400;600;700&family=Inter, sans-serif:wght@400;500;600&display=swap" rel="stylesheet">
+</head>
+<body>
+    <header class="site-header">
+        <div class="container">
+            <a href="/" class="logo" aria-label="BirdOps - Home">
+                <span class="logo-text">BirdOps BirdUp</span>
+            </a>
+            <nav class="main-nav" aria-label="Main navigation">
+                <button class="nav-toggle" aria-expanded="false" aria-controls="nav-menu" aria-label="Toggle navigation">
+                    <span class="hamburger"></span>
+                </button>
+                <ul id="nav-menu" class="nav-list">
+                    <li><a href="/" class="nav-link">Home</a></li>
+                    <li><a href="/services.html" class="nav-link active">Services</a></li>
+                    <li><a href="/products.html" class="nav-link">Products</a></li>
+                </ul>
+            </nav>
+        </div>
+    </header>
+
+    <main class="site-main">
+        <section class="page-hero" aria-labelledby="page-heading">
+            <div class="container">
+                <h1 id="page-heading">Our Services</h1>
+                <p class="page-subheadline"></p>
+            </div>
+        </section>
+
+        <section class="services-list" aria-labelledby="services-heading">
+            <div class="container">
+                <h2 id="services-heading" class="section-title"></h2>
+                <div class="services-grid">
+                </div>
+            </div>
+        </section>
+
+        <section class="process-section" aria-labelledby="process-heading">
+            <div class="container">
+                <h2 id="process-heading" class="section-title"></h2>
+                <div class="process-steps">
+                </div>
+            </div>
+        </section>
+
+    </main>
+
+    <footer class="site-footer" role="contentinfo">
+        <div class="container">
+            <div class="footer-grid">
+                <div class="footer-brand">
+                    <p class="footer-logo">BirdOps BirdUp</p>
+                    <p class="footer-tagline"></p>
+                </div>
+                <nav class="footer-nav" aria-label="Footer navigation">
+                    <h3>Quick Links</h3>
+                    <ul>
+                        <li><a href="/">Home</a></li>
+                        <li><a href="/services.html">Services</a></li>
+<li><a href="/products.html">Products</a></li>                    </ul>
+                </nav>
+                <address class="footer-contact" aria-label="Contact information">
+                    <h3>Contact</h3>
+                    <p>1000 business center drive</p>
+                    <p><a href="tel:4074562683">999-999-9999</a></p>
+                    <p><a href="mailto:nightehawk@gmail.com">nightehawk@gmail.com</a></p>
+                </address>
+            </div>
+            <div class="footer-bottom">
+                <p>&copy; 2026 BirdOps. All rights reserved.</p>
+                <p class="footer-credits">Hosted by <a href="https://sloanops.com" target="_blank" rel="noopener">SloanOps</a></p>
+            </div>
+        </div>
+    </footer>
+
+    <script src="js/main.js"></script>
+</body>
+</html>
\ No newline at end of file