From 9b0256c9b371126b4cc716fd975f253ca23c3e71 Mon Sep 17 00:00:00 2001
From: haseebzafar9832 <78751320+haseebzafar9832@users.noreply.github.com>
Date: Fri, 13 Mar 2026 00:14:43 +0500
Subject: [PATCH] email signatures

---
 Ahmad.html    | 301 ++++++++++++++++++++++++++++++++++++++++++++++++++
 Baten.html    | 301 ++++++++++++++++++++++++++++++++++++++++++++++++++
 Benjamin.html | 301 ++++++++++++++++++++++++++++++++++++++++++++++++++
 Bukhari.html  | 301 ++++++++++++++++++++++++++++++++++++++++++++++++++
 Diponkar.html | 301 ++++++++++++++++++++++++++++++++++++++++++++++++++
 Haseeb.html   | 301 ++++++++++++++++++++++++++++++++++++++++++++++++++
 Moeez.html    | 301 ++++++++++++++++++++++++++++++++++++++++++++++++++
 Noman.html    | 301 ++++++++++++++++++++++++++++++++++++++++++++++++++
 Rohit.html    | 301 ++++++++++++++++++++++++++++++++++++++++++++++++++
 Shahzad.html  | 301 ++++++++++++++++++++++++++++++++++++++++++++++++++
 Till.html     | 301 ++++++++++++++++++++++++++++++++++++++++++++++++++
 Waris.html    | 301 ++++++++++++++++++++++++++++++++++++++++++++++++++
 12 files changed, 3612 insertions(+)
 create mode 100644 Ahmad.html
 create mode 100644 Baten.html
 create mode 100644 Benjamin.html
 create mode 100644 Bukhari.html
 create mode 100644 Diponkar.html
 create mode 100644 Haseeb.html
 create mode 100644 Moeez.html
 create mode 100644 Noman.html
 create mode 100644 Rohit.html
 create mode 100644 Shahzad.html
 create mode 100644 Till.html
 create mode 100644 Waris.html
diff --git a/Ahmad.html b/Ahmad.html
new file mode 100644
index 0000000..56fcc04
--- /dev/null
+++ b/Ahmad.html
@@ -0,0 +1,301 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Benjamin Baier - Business Card</title>
+    <style>
+        * {
+            margin: 0;
+            padding: 0;
+            box-sizing: border-box;
+        }
+
+        body {
+            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
+            background: black;
+            min-height: 100vh;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            padding: 20px;
+        }
+
+        .card {
+            background: #1a1a1a;
+            border-radius: 20px;
+            padding: 40px;
+            max-width: 900px;
+            width: 100%;
+            box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
+        }
+
+        .card-container {
+            display: flex;
+            gap: 20px;
+        }
+
+        .left-section {
+            flex: 0.8;
+            text-align: center;
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            justify-content: center;
+        }
+
+        .logo-container {
+            width: 120px;
+            height: 120px;
+            background: #2a2a2a;
+            border-radius: 16px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            margin-bottom: 20px;
+        }
+
+        .logo {
+            width: 80px;
+            height: 80px;
+            /* Yahan apna logo lagao */
+            background: #d4af37;
+            border-radius: 50%;
+        }
+
+        .name {
+            color: #ffffff;
+            font-size: 28px;
+            font-weight: 600;
+            margin-bottom: 8px;
+        }
+
+        .title {
+            color: #a0a0a0;
+            font-size: 16px;
+            font-weight: 400;
+        }
+
+        .right-section {
+            flex: 1.2;
+            display: flex;
+            flex-direction: column;
+            justify-content: center;
+            border-left: 1px solid #333;
+            padding-left: 40px;
+        }
+
+        .contact-item {
+            display: flex;
+            align-items: center;
+            gap: 12px;
+            margin-bottom: 16px;
+            color: #ffffff;
+            font-size: 16px;
+        }
+
+        .contact-icon {
+            width: 20px;
+            height: 20px;
+            color: white;
+        }
+
+        .contact-item a {
+            color: #ffffff;
+            text-decoration: none;
+            transition: color 0.3s ease;
+        }
+
+        .contact-item a:hover {
+            color: #d4af37;
+        }
+
+
+
+        /* Social Icons Container */
+        .social-icons {
+            display: flex;
+            gap: 10px;
+            align-items: center;
+            flex-wrap: wrap;
+        }
+
+        /* Social Icons Links */
+        .social-icons a {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            width: 36px;
+            height: 36px;
+            border-radius: 8px;
+            transition: all 0.3s ease;
+            text-decoration: none;
+        }
+
+        .social-icons a img {
+            width: 25px;
+            /* height: 0px; */
+            object-fit: contain;
+            filter: brightness(0) invert(1);
+            transition: all 0.3s ease;
+        }
+
+
+
+        /* Reddit */
+        .social-icons a:nth-child(7):hover {
+            background: #000000;
+        }
+
+        @media (max-width: 768px) {
+            .social-icons {
+                gap: 12px;
+            }
+
+            .social-icons a {
+                width: 32px;
+                height: 32px;
+            }
+
+            .social-icons a img {
+                width: 18px;
+                height: 18px;
+            }
+        }
+
+        @media (max-width: 480px) {
+            .social-icons {
+                gap: 10px;
+            }
+
+            .social-icons a {
+                width: 28px;
+                height: 28px;
+            }
+
+            .social-icons a img {
+                width: 16px;
+                height: 16px;
+            }
+        }
+
+        .logo-container img {
+            width: 60px;
+        }
+
+        /* Responsive Design */
+        @media (max-width: 768px) {
+            .card-container {
+                flex-direction: column;
+                gap: 30px;
+            }
+
+            .right-section {
+                border-left: none;
+                border-top: 1px solid #333;
+                padding-left: 0;
+                padding-top: 30px;
+            }
+
+            .card {
+                padding: 30px 20px;
+            }
+
+            .name {
+                font-size: 24px;
+            }
+
+            .title {
+                font-size: 14px;
+            }
+
+            .contact-item {
+                font-size: 14px;
+            }
+        }
+
+        @media (max-width: 480px) {
+            .logo-container {
+                width: 100px;
+                height: 100px;
+            }
+
+            .logo {
+                width: 60px;
+                height: 60px;
+            }
+
+            .name {
+                font-size: 20px;
+            }
+
+            .social-icons {
+                gap: 12px;
+            }
+
+            .social-icon {
+                width: 28px;
+                height: 28px;
+            }
+        }
+    </style>
+</head>
+
+<body>
+    <div class="card">
+        <div class="card-container">
+            <!-- Left Section -->
+            <div class="left-section">
+                <div class="logo-container">
+
+                    <img src="https://flirtmetrics.com/assets/logo.png" alt="Flirtmetrics" class="logo-img">
+                </div>
+                <h1 class="name">Ahmad Mahmood</h1>
+                <p class="title">Project Manager</p>
+            </div>
+
+            <!-- Right Section -->
+            <div class="right-section">
+                <div class="contact-item">
+                    <svg class="contact-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                            d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z">
+                        </path>
+                    </svg>
+                    <a href="mailto:benjamin.baier@flirtmetrics.com">ahmad.mahmood@flirtmetrics.com</a>
+                </div>
+
+                <div class="contact-item">
+                    <svg class="contact-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                            d="M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1">
+                        </path>
+                    </svg>
+                    <a href="https://www.flirtmetrics.com" target="_blank">www.flirtmetrics.com</a>
+                </div>
+
+                <div class="social-icons">
+                    <a href="https://www.facebook.com/Flirtmetrics" target="_black"><img
+                            src="../../public/assets/facebook.svg" alt="Facebook" /></a>
+                    <a href="https://www.instagram.com/flirtmetrics/" target="_black"><img
+                            src="../../public/assets/insta.svg" alt="Instagram" /></a>
+                    <a href="https://www.tiktok.com/@flirtmetrics" target="_black"><img
+                            src="../../public/assets/tiktok.svg" alt="TikTok" /></a>
+
+                    <a href="https://x.com/flirtmetrics/" target="_black"><img src="../../public/assets/twitter.svg"
+                            alt="Twitter" /></a>
+                    <a href="https://rumble.com/user/flirtmetrics" target="_black"><img
+                            src="../../public/assets/rumble.svg" alt="Rumble" /></a>
+
+                    <a href="http://reddit.com/flirtmetrics/" target="_black"><img src="../../public/assets/reddit.svg"
+                            alt="Reddit" /></a>
+                    <a href="https://www.threads.com/@flirtmetrics" target="_black"><img
+                            src="/../../public/assets/thread.svg" alt="Thread" /></a>
+                </div>
+            </div>
+        </div>
+    </div>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/Baten.html b/Baten.html
new file mode 100644
index 0000000..03ca697
--- /dev/null
+++ b/Baten.html
@@ -0,0 +1,301 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Benjamin Baier - Business Card</title>
+    <style>
+        * {
+            margin: 0;
+            padding: 0;
+            box-sizing: border-box;
+        }
+
+        body {
+            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
+            background: black;
+            min-height: 100vh;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            padding: 20px;
+        }
+
+        .card {
+            background: #1a1a1a;
+            border-radius: 20px;
+            padding: 40px;
+            max-width: 900px;
+            width: 100%;
+            box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
+        }
+
+        .card-container {
+            display: flex;
+            gap: 20px;
+        }
+
+        .left-section {
+            flex: 0.8;
+            text-align: center;
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            justify-content: center;
+        }
+
+        .logo-container {
+            width: 120px;
+            height: 120px;
+            background: #2a2a2a;
+            border-radius: 16px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            margin-bottom: 20px;
+        }
+
+        .logo {
+            width: 80px;
+            height: 80px;
+            /* Yahan apna logo lagao */
+            background: #d4af37;
+            border-radius: 50%;
+        }
+
+        .name {
+            color: #ffffff;
+            font-size: 28px;
+            font-weight: 600;
+            margin-bottom: 8px;
+        }
+
+        .title {
+            color: #a0a0a0;
+            font-size: 16px;
+            font-weight: 400;
+        }
+
+        .right-section {
+            flex: 1.2;
+            display: flex;
+            flex-direction: column;
+            justify-content: center;
+            border-left: 1px solid #333;
+            padding-left: 40px;
+        }
+
+        .contact-item {
+            display: flex;
+            align-items: center;
+            gap: 12px;
+            margin-bottom: 16px;
+            color: #ffffff;
+            font-size: 16px;
+        }
+
+        .contact-icon {
+            width: 20px;
+            height: 20px;
+            color: white;
+        }
+
+        .contact-item a {
+            color: #ffffff;
+            text-decoration: none;
+            transition: color 0.3s ease;
+        }
+
+        .contact-item a:hover {
+            color: #d4af37;
+        }
+
+
+
+        /* Social Icons Container */
+        .social-icons {
+            display: flex;
+            gap: 10px;
+            align-items: center;
+            flex-wrap: wrap;
+        }
+
+        /* Social Icons Links */
+        .social-icons a {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            width: 36px;
+            height: 36px;
+            border-radius: 8px;
+            transition: all 0.3s ease;
+            text-decoration: none;
+        }
+
+        .social-icons a img {
+            width: 25px;
+            /* height: 0px; */
+            object-fit: contain;
+            filter: brightness(0) invert(1);
+            transition: all 0.3s ease;
+        }
+
+
+
+        /* Reddit */
+        .social-icons a:nth-child(7):hover {
+            background: #000000;
+        }
+
+        @media (max-width: 768px) {
+            .social-icons {
+                gap: 12px;
+            }
+
+            .social-icons a {
+                width: 32px;
+                height: 32px;
+            }
+
+            .social-icons a img {
+                width: 18px;
+                height: 18px;
+            }
+        }
+
+        @media (max-width: 480px) {
+            .social-icons {
+                gap: 10px;
+            }
+
+            .social-icons a {
+                width: 28px;
+                height: 28px;
+            }
+
+            .social-icons a img {
+                width: 16px;
+                height: 16px;
+            }
+        }
+
+        .logo-container img {
+            width: 60px;
+        }
+
+        /* Responsive Design */
+        @media (max-width: 768px) {
+            .card-container {
+                flex-direction: column;
+                gap: 30px;
+            }
+
+            .right-section {
+                border-left: none;
+                border-top: 1px solid #333;
+                padding-left: 0;
+                padding-top: 30px;
+            }
+
+            .card {
+                padding: 30px 20px;
+            }
+
+            .name {
+                font-size: 24px;
+            }
+
+            .title {
+                font-size: 14px;
+            }
+
+            .contact-item {
+                font-size: 14px;
+            }
+        }
+
+        @media (max-width: 480px) {
+            .logo-container {
+                width: 100px;
+                height: 100px;
+            }
+
+            .logo {
+                width: 60px;
+                height: 60px;
+            }
+
+            .name {
+                font-size: 20px;
+            }
+
+            .social-icons {
+                gap: 12px;
+            }
+
+            .social-icon {
+                width: 28px;
+                height: 28px;
+            }
+        }
+    </style>
+</head>
+
+<body>
+    <div class="card">
+        <div class="card-container">
+            <!-- Left Section -->
+            <div class="left-section">
+                <div class="logo-container">
+
+                    <img src="https://flirtmetrics.com/assets/logo.png" alt="Flirtmetrics" class="logo-img">
+                </div>
+                <h1 class="name">Abdul Baten</h1>
+                <p class="title">Backend Developer</p>
+            </div>
+
+            <!-- Right Section -->
+            <div class="right-section">
+                <div class="contact-item">
+                    <svg class="contact-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                            d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z">
+                        </path>
+                    </svg>
+                    <a href="mailto:benjamin.baier@flirtmetrics.com">abdul.baten@flirtmetrics.com</a>
+                </div>
+
+                <div class="contact-item">
+                    <svg class="contact-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                            d="M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1">
+                        </path>
+                    </svg>
+                    <a href="https://www.flirtmetrics.com" target="_blank">www.flirtmetrics.com</a>
+                </div>
+
+                <div class="social-icons">
+                    <a href="https://www.facebook.com/Flirtmetrics" target="_black"><img
+                            src="../../public/assets/facebook.svg" alt="Facebook" /></a>
+                    <a href="https://www.instagram.com/flirtmetrics/" target="_black"><img
+                            src="../../public/assets/insta.svg" alt="Instagram" /></a>
+                    <a href="https://www.tiktok.com/@flirtmetrics" target="_black"><img
+                            src="../../public/assets/tiktok.svg" alt="TikTok" /></a>
+
+                    <a href="https://x.com/flirtmetrics/" target="_black"><img src="../../public/assets/twitter.svg"
+                            alt="Twitter" /></a>
+                    <a href="https://rumble.com/user/flirtmetrics" target="_black"><img
+                            src="../../public/assets/rumble.svg" alt="Rumble" /></a>
+
+                    <a href="http://reddit.com/flirtmetrics/" target="_black"><img src="../../public/assets/reddit.svg"
+                            alt="Reddit" /></a>
+                    <a href="https://www.threads.com/@flirtmetrics" target="_black"><img
+                            src="/../../public/assets/thread.svg" alt="Thread" /></a>
+                </div>
+            </div>
+        </div>
+    </div>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/Benjamin.html b/Benjamin.html
new file mode 100644
index 0000000..20af882
--- /dev/null
+++ b/Benjamin.html
@@ -0,0 +1,301 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Benjamin Baier - Business Card</title>
+    <style>
+        * {
+            margin: 0;
+            padding: 0;
+            box-sizing: border-box;
+        }
+
+        body {
+            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
+            background: black;
+            min-height: 100vh;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            padding: 20px;
+        }
+
+        .card {
+            background: #1a1a1a;
+            border-radius: 20px;
+            padding: 40px;
+            max-width: 900px;
+            width: 100%;
+            box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
+        }
+
+        .card-container {
+            display: flex;
+            gap: 20px;
+        }
+
+        .left-section {
+            flex: 0.8;
+            text-align: center;
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            justify-content: center;
+        }
+
+        .logo-container {
+            width: 120px;
+            height: 120px;
+            background: #2a2a2a;
+            border-radius: 16px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            margin-bottom: 20px;
+        }
+
+        .logo {
+            width: 80px;
+            height: 80px;
+            /* Yahan apna logo lagao */
+            background: #d4af37;
+            border-radius: 50%;
+        }
+
+        .name {
+            color: #ffffff;
+            font-size: 28px;
+            font-weight: 600;
+            margin-bottom: 8px;
+        }
+
+        .title {
+            color: #a0a0a0;
+            font-size: 16px;
+            font-weight: 400;
+        }
+
+        .right-section {
+            flex: 1.2;
+            display: flex;
+            flex-direction: column;
+            justify-content: center;
+            border-left: 1px solid #333;
+            padding-left: 40px;
+        }
+
+        .contact-item {
+            display: flex;
+            align-items: center;
+            gap: 12px;
+            margin-bottom: 16px;
+            color: #ffffff;
+            font-size: 16px;
+        }
+
+        .contact-icon {
+            width: 20px;
+            height: 20px;
+            color: white;
+        }
+
+        .contact-item a {
+            color: #ffffff;
+            text-decoration: none;
+            transition: color 0.3s ease;
+        }
+
+        .contact-item a:hover {
+            color: #d4af37;
+        }
+
+
+
+        /* Social Icons Container */
+        .social-icons {
+            display: flex;
+            gap: 10px;
+            align-items: center;
+            flex-wrap: wrap;
+        }
+
+        /* Social Icons Links */
+        .social-icons a {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            width: 36px;
+            height: 36px;
+            border-radius: 8px;
+            transition: all 0.3s ease;
+            text-decoration: none;
+        }
+
+        .social-icons a img {
+            width: 25px;
+            /* height: 0px; */
+            object-fit: contain;
+            filter: brightness(0) invert(1);
+            transition: all 0.3s ease;
+        }
+
+
+
+        /* Reddit */
+        .social-icons a:nth-child(7):hover {
+            background: #000000;
+        }
+
+        @media (max-width: 768px) {
+            .social-icons {
+                gap: 12px;
+            }
+
+            .social-icons a {
+                width: 32px;
+                height: 32px;
+            }
+
+            .social-icons a img {
+                width: 18px;
+                height: 18px;
+            }
+        }
+
+        @media (max-width: 480px) {
+            .social-icons {
+                gap: 10px;
+            }
+
+            .social-icons a {
+                width: 28px;
+                height: 28px;
+            }
+
+            .social-icons a img {
+                width: 16px;
+                height: 16px;
+            }
+        }
+
+        .logo-container img {
+            width: 60px;
+        }
+
+        /* Responsive Design */
+        @media (max-width: 768px) {
+            .card-container {
+                flex-direction: column;
+                gap: 30px;
+            }
+
+            .right-section {
+                border-left: none;
+                border-top: 1px solid #333;
+                padding-left: 0;
+                padding-top: 30px;
+            }
+
+            .card {
+                padding: 30px 20px;
+            }
+
+            .name {
+                font-size: 24px;
+            }
+
+            .title {
+                font-size: 14px;
+            }
+
+            .contact-item {
+                font-size: 14px;
+            }
+        }
+
+        @media (max-width: 480px) {
+            .logo-container {
+                width: 100px;
+                height: 100px;
+            }
+
+            .logo {
+                width: 60px;
+                height: 60px;
+            }
+
+            .name {
+                font-size: 20px;
+            }
+
+            .social-icons {
+                gap: 12px;
+            }
+
+            .social-icon {
+                width: 28px;
+                height: 28px;
+            }
+        }
+    </style>
+</head>
+
+<body>
+    <div class="card">
+        <div class="card-container">
+            <!-- Left Section -->
+            <div class="left-section">
+                <div class="logo-container">
+
+                    <img src="https://flirtmetrics.com/assets/logo.png" alt="Flirtmetrics" class="logo-img">
+                </div>
+                <h1 class="name">Benjamin Baier</h1>
+                <p class="title">Co-Founder & CEO, Product Lead</p>
+            </div>
+
+            <!-- Right Section -->
+            <div class="right-section">
+                <div class="contact-item">
+                    <svg class="contact-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                            d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z">
+                        </path>
+                    </svg>
+                    <a href="mailto:benjamin.baier@flirtmetrics.com">benjamin.baier@flirtmetrics.com</a>
+                </div>
+
+                <div class="contact-item">
+                    <svg class="contact-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                            d="M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1">
+                        </path>
+                    </svg>
+                    <a href="https://www.flirtmetrics.com" target="_blank">www.flirtmetrics.com</a>
+                </div>
+
+                <div class="social-icons">
+                    <a href="https://www.facebook.com/Flirtmetrics" target="_black"><img
+                            src="../../public/assets/facebook.svg" alt="Facebook" /></a>
+                    <a href="https://www.instagram.com/flirtmetrics/" target="_black"><img
+                            src="../../public/assets/insta.svg" alt="Instagram" /></a>
+                    <a href="https://www.tiktok.com/@flirtmetrics" target="_black"><img
+                            src="../../public/assets/tiktok.svg" alt="TikTok" /></a>
+
+                    <a href="https://x.com/flirtmetrics/" target="_black"><img src="../../public/assets/twitter.svg"
+                            alt="Twitter" /></a>
+                    <a href="https://rumble.com/user/flirtmetrics" target="_black"><img
+                            src="../../public/assets/rumble.svg" alt="Rumble" /></a>
+
+                    <a href="http://reddit.com/flirtmetrics/" target="_black"><img src="../../public/assets/reddit.svg"
+                            alt="Reddit" /></a>
+                    <a href="https://www.threads.com/@flirtmetrics" target="_black"><img
+                            src="/../../public/assets/thread.svg" alt="Thread" /></a>
+                </div>
+            </div>
+        </div>
+    </div>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/Bukhari.html b/Bukhari.html
new file mode 100644
index 0000000..1b5fa70
--- /dev/null
+++ b/Bukhari.html
@@ -0,0 +1,301 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Benjamin Baier - Business Card</title>
+    <style>
+        * {
+            margin: 0;
+            padding: 0;
+            box-sizing: border-box;
+        }
+
+        body {
+            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
+            background: black;
+            min-height: 100vh;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            padding: 20px;
+        }
+
+        .card {
+            background: #1a1a1a;
+            border-radius: 20px;
+            padding: 40px;
+            max-width: 900px;
+            width: 100%;
+            box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
+        }
+
+        .card-container {
+            display: flex;
+            gap: 20px;
+        }
+
+        .left-section {
+            flex: 0.8;
+            text-align: center;
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            justify-content: center;
+        }
+
+        .logo-container {
+            width: 120px;
+            height: 120px;
+            background: #2a2a2a;
+            border-radius: 16px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            margin-bottom: 20px;
+        }
+
+        .logo {
+            width: 80px;
+            height: 80px;
+            /* Yahan apna logo lagao */
+            background: #d4af37;
+            border-radius: 50%;
+        }
+
+        .name {
+            color: #ffffff;
+            font-size: 28px;
+            font-weight: 600;
+            margin-bottom: 8px;
+        }
+
+        .title {
+            color: #a0a0a0;
+            font-size: 16px;
+            font-weight: 400;
+        }
+
+        .right-section {
+            flex: 1.2;
+            display: flex;
+            flex-direction: column;
+            justify-content: center;
+            border-left: 1px solid #333;
+            padding-left: 40px;
+        }
+
+        .contact-item {
+            display: flex;
+            align-items: center;
+            gap: 12px;
+            margin-bottom: 16px;
+            color: #ffffff;
+            font-size: 16px;
+        }
+
+        .contact-icon {
+            width: 20px;
+            height: 20px;
+            color: white;
+        }
+
+        .contact-item a {
+            color: #ffffff;
+            text-decoration: none;
+            transition: color 0.3s ease;
+        }
+
+        .contact-item a:hover {
+            color: #d4af37;
+        }
+
+
+
+        /* Social Icons Container */
+        .social-icons {
+            display: flex;
+            gap: 10px;
+            align-items: center;
+            flex-wrap: wrap;
+        }
+
+        /* Social Icons Links */
+        .social-icons a {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            width: 36px;
+            height: 36px;
+            border-radius: 8px;
+            transition: all 0.3s ease;
+            text-decoration: none;
+        }
+
+        .social-icons a img {
+            width: 25px;
+            /* height: 0px; */
+            object-fit: contain;
+            filter: brightness(0) invert(1);
+            transition: all 0.3s ease;
+        }
+
+
+
+        /* Reddit */
+        .social-icons a:nth-child(7):hover {
+            background: #000000;
+        }
+
+        @media (max-width: 768px) {
+            .social-icons {
+                gap: 12px;
+            }
+
+            .social-icons a {
+                width: 32px;
+                height: 32px;
+            }
+
+            .social-icons a img {
+                width: 18px;
+                height: 18px;
+            }
+        }
+
+        @media (max-width: 480px) {
+            .social-icons {
+                gap: 10px;
+            }
+
+            .social-icons a {
+                width: 28px;
+                height: 28px;
+            }
+
+            .social-icons a img {
+                width: 16px;
+                height: 16px;
+            }
+        }
+
+        .logo-container img {
+            width: 60px;
+        }
+
+        /* Responsive Design */
+        @media (max-width: 768px) {
+            .card-container {
+                flex-direction: column;
+                gap: 30px;
+            }
+
+            .right-section {
+                border-left: none;
+                border-top: 1px solid #333;
+                padding-left: 0;
+                padding-top: 30px;
+            }
+
+            .card {
+                padding: 30px 20px;
+            }
+
+            .name {
+                font-size: 24px;
+            }
+
+            .title {
+                font-size: 14px;
+            }
+
+            .contact-item {
+                font-size: 14px;
+            }
+        }
+
+        @media (max-width: 480px) {
+            .logo-container {
+                width: 100px;
+                height: 100px;
+            }
+
+            .logo {
+                width: 60px;
+                height: 60px;
+            }
+
+            .name {
+                font-size: 20px;
+            }
+
+            .social-icons {
+                gap: 12px;
+            }
+
+            .social-icon {
+                width: 28px;
+                height: 28px;
+            }
+        }
+    </style>
+</head>
+
+<body>
+    <div class="card">
+        <div class="card-container">
+            <!-- Left Section -->
+            <div class="left-section">
+                <div class="logo-container">
+
+                    <img src="https://flirtmetrics.com/assets/logo.png" alt="Flirtmetrics" class="logo-img">
+                </div>
+                <h1 class="name">Waleed Bukhari</h1>
+                <p class="title">Backend Developer</p>
+            </div>
+
+            <!-- Right Section -->
+            <div class="right-section">
+                <div class="contact-item">
+                    <svg class="contact-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                            d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z">
+                        </path>
+                    </svg>
+                    <a href="mailto:benjamin.baier@flirtmetrics.com">waleed.bukhari@flirtmetrics.com</a>
+                </div>
+
+                <div class="contact-item">
+                    <svg class="contact-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                            d="M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1">
+                        </path>
+                    </svg>
+                    <a href="https://www.flirtmetrics.com" target="_blank">www.flirtmetrics.com</a>
+                </div>
+
+                <div class="social-icons">
+                    <a href="https://www.facebook.com/Flirtmetrics" target="_black"><img
+                            src="../../public/assets/facebook.svg" alt="Facebook" /></a>
+                    <a href="https://www.instagram.com/flirtmetrics/" target="_black"><img
+                            src="../../public/assets/insta.svg" alt="Instagram" /></a>
+                    <a href="https://www.tiktok.com/@flirtmetrics" target="_black"><img
+                            src="../../public/assets/tiktok.svg" alt="TikTok" /></a>
+
+                    <a href="https://x.com/flirtmetrics/" target="_black"><img src="../../public/assets/twitter.svg"
+                            alt="Twitter" /></a>
+                    <a href="https://rumble.com/user/flirtmetrics" target="_black"><img
+                            src="../../public/assets/rumble.svg" alt="Rumble" /></a>
+
+                    <a href="http://reddit.com/flirtmetrics/" target="_black"><img src="../../public/assets/reddit.svg"
+                            alt="Reddit" /></a>
+                    <a href="https://www.threads.com/@flirtmetrics" target="_black"><img
+                            src="/../../public/assets/thread.svg" alt="Thread" /></a>
+                </div>
+            </div>
+        </div>
+    </div>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/Diponkar.html b/Diponkar.html
new file mode 100644
index 0000000..4985956
--- /dev/null
+++ b/Diponkar.html
@@ -0,0 +1,301 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Benjamin Baier - Business Card</title>
+    <style>
+        * {
+            margin: 0;
+            padding: 0;
+            box-sizing: border-box;
+        }
+
+        body {
+            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
+            background: black;
+            min-height: 100vh;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            padding: 20px;
+        }
+
+        .card {
+            background: #1a1a1a;
+            border-radius: 20px;
+            padding: 40px;
+            max-width: 900px;
+            width: 100%;
+            box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
+        }
+
+        .card-container {
+            display: flex;
+            gap: 20px;
+        }
+
+        .left-section {
+            flex: 0.8;
+            text-align: center;
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            justify-content: center;
+        }
+
+        .logo-container {
+            width: 120px;
+            height: 120px;
+            background: #2a2a2a;
+            border-radius: 16px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            margin-bottom: 20px;
+        }
+
+        .logo {
+            width: 80px;
+            height: 80px;
+            /* Yahan apna logo lagao */
+            background: #d4af37;
+            border-radius: 50%;
+        }
+
+        .name {
+            color: #ffffff;
+            font-size: 28px;
+            font-weight: 600;
+            margin-bottom: 8px;
+        }
+
+        .title {
+            color: #a0a0a0;
+            font-size: 16px;
+            font-weight: 400;
+        }
+
+        .right-section {
+            flex: 1.2;
+            display: flex;
+            flex-direction: column;
+            justify-content: center;
+            border-left: 1px solid #333;
+            padding-left: 40px;
+        }
+
+        .contact-item {
+            display: flex;
+            align-items: center;
+            gap: 12px;
+            margin-bottom: 16px;
+            color: #ffffff;
+            font-size: 16px;
+        }
+
+        .contact-icon {
+            width: 20px;
+            height: 20px;
+            color: white;
+        }
+
+        .contact-item a {
+            color: #ffffff;
+            text-decoration: none;
+            transition: color 0.3s ease;
+        }
+
+        .contact-item a:hover {
+            color: #d4af37;
+        }
+
+
+
+        /* Social Icons Container */
+        .social-icons {
+            display: flex;
+            gap: 10px;
+            align-items: center;
+            flex-wrap: wrap;
+        }
+
+        /* Social Icons Links */
+        .social-icons a {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            width: 36px;
+            height: 36px;
+            border-radius: 8px;
+            transition: all 0.3s ease;
+            text-decoration: none;
+        }
+
+        .social-icons a img {
+            width: 25px;
+            /* height: 0px; */
+            object-fit: contain;
+            filter: brightness(0) invert(1);
+            transition: all 0.3s ease;
+        }
+
+
+
+        /* Reddit */
+        .social-icons a:nth-child(7):hover {
+            background: #000000;
+        }
+
+        @media (max-width: 768px) {
+            .social-icons {
+                gap: 12px;
+            }
+
+            .social-icons a {
+                width: 32px;
+                height: 32px;
+            }
+
+            .social-icons a img {
+                width: 18px;
+                height: 18px;
+            }
+        }
+
+        @media (max-width: 480px) {
+            .social-icons {
+                gap: 10px;
+            }
+
+            .social-icons a {
+                width: 28px;
+                height: 28px;
+            }
+
+            .social-icons a img {
+                width: 16px;
+                height: 16px;
+            }
+        }
+
+        .logo-container img {
+            width: 60px;
+        }
+
+        /* Responsive Design */
+        @media (max-width: 768px) {
+            .card-container {
+                flex-direction: column;
+                gap: 30px;
+            }
+
+            .right-section {
+                border-left: none;
+                border-top: 1px solid #333;
+                padding-left: 0;
+                padding-top: 30px;
+            }
+
+            .card {
+                padding: 30px 20px;
+            }
+
+            .name {
+                font-size: 24px;
+            }
+
+            .title {
+                font-size: 14px;
+            }
+
+            .contact-item {
+                font-size: 14px;
+            }
+        }
+
+        @media (max-width: 480px) {
+            .logo-container {
+                width: 100px;
+                height: 100px;
+            }
+
+            .logo {
+                width: 60px;
+                height: 60px;
+            }
+
+            .name {
+                font-size: 20px;
+            }
+
+            .social-icons {
+                gap: 12px;
+            }
+
+            .social-icon {
+                width: 28px;
+                height: 28px;
+            }
+        }
+    </style>
+</head>
+
+<body>
+    <div class="card">
+        <div class="card-container">
+            <!-- Left Section -->
+            <div class="left-section">
+                <div class="logo-container">
+
+                    <img src="https://flirtmetrics.com/assets/logo.png" alt="Flirtmetrics" class="logo-img">
+                </div>
+                <h1 class="name">Diponkar Kabiraj</h1>
+                <p class="title">Product Designer</p>
+            </div>
+
+            <!-- Right Section -->
+            <div class="right-section">
+                <div class="contact-item">
+                    <svg class="contact-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                            d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z">
+                        </path>
+                    </svg>
+                    <a href="mailto:benjamin.baier@flirtmetrics.com">diponkar.kabiraj@flirtmetrics.com</a>
+                </div>
+
+                <div class="contact-item">
+                    <svg class="contact-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                            d="M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1">
+                        </path>
+                    </svg>
+                    <a href="https://www.flirtmetrics.com" target="_blank">www.flirtmetrics.com</a>
+                </div>
+
+                <div class="social-icons">
+                    <a href="https://www.facebook.com/Flirtmetrics" target="_black"><img
+                            src="../../public/assets/facebook.svg" alt="Facebook" /></a>
+                    <a href="https://www.instagram.com/flirtmetrics/" target="_black"><img
+                            src="../../public/assets/insta.svg" alt="Instagram" /></a>
+                    <a href="https://www.tiktok.com/@flirtmetrics" target="_black"><img
+                            src="../../public/assets/tiktok.svg" alt="TikTok" /></a>
+
+                    <a href="https://x.com/flirtmetrics/" target="_black"><img src="../../public/assets/twitter.svg"
+                            alt="Twitter" /></a>
+                    <a href="https://rumble.com/user/flirtmetrics" target="_black"><img
+                            src="../../public/assets/rumble.svg" alt="Rumble" /></a>
+
+                    <a href="http://reddit.com/flirtmetrics/" target="_black"><img src="../../public/assets/reddit.svg"
+                            alt="Reddit" /></a>
+                    <a href="https://www.threads.com/@flirtmetrics" target="_black"><img
+                            src="/../../public/assets/thread.svg" alt="Thread" /></a>
+                </div>
+            </div>
+        </div>
+    </div>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/Haseeb.html b/Haseeb.html
new file mode 100644
index 0000000..f540304
--- /dev/null
+++ b/Haseeb.html
@@ -0,0 +1,301 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Benjamin Baier - Business Card</title>
+    <style>
+        * {
+            margin: 0;
+            padding: 0;
+            box-sizing: border-box;
+        }
+
+        body {
+            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
+            background: black;
+            min-height: 100vh;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            padding: 20px;
+        }
+
+        .card {
+            background: #1a1a1a;
+            border-radius: 20px;
+            padding: 40px;
+            max-width: 900px;
+            width: 100%;
+            box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
+        }
+
+        .card-container {
+            display: flex;
+            gap: 20px;
+        }
+
+        .left-section {
+            flex: 0.8;
+            text-align: center;
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            justify-content: center;
+        }
+
+        .logo-container {
+            width: 120px;
+            height: 120px;
+            background: #2a2a2a;
+            border-radius: 16px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            margin-bottom: 20px;
+        }
+
+        .logo {
+            width: 80px;
+            height: 80px;
+            /* Yahan apna logo lagao */
+            background: #d4af37;
+            border-radius: 50%;
+        }
+
+        .name {
+            color: #ffffff;
+            font-size: 28px;
+            font-weight: 600;
+            margin-bottom: 8px;
+        }
+
+        .title {
+            color: #a0a0a0;
+            font-size: 16px;
+            font-weight: 400;
+        }
+
+        .right-section {
+            flex: 1.2;
+            display: flex;
+            flex-direction: column;
+            justify-content: center;
+            border-left: 1px solid #333;
+            padding-left: 40px;
+        }
+
+        .contact-item {
+            display: flex;
+            align-items: center;
+            gap: 12px;
+            margin-bottom: 16px;
+            color: #ffffff;
+            font-size: 16px;
+        }
+
+        .contact-icon {
+            width: 20px;
+            height: 20px;
+            color: white;
+        }
+
+        .contact-item a {
+            color: #ffffff;
+            text-decoration: none;
+            transition: color 0.3s ease;
+        }
+
+        .contact-item a:hover {
+            color: #d4af37;
+        }
+
+
+
+        /* Social Icons Container */
+        .social-icons {
+            display: flex;
+            gap: 10px;
+            align-items: center;
+            flex-wrap: wrap;
+        }
+
+        /* Social Icons Links */
+        .social-icons a {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            width: 36px;
+            height: 36px;
+            border-radius: 8px;
+            transition: all 0.3s ease;
+            text-decoration: none;
+        }
+
+        .social-icons a img {
+            width: 25px;
+            /* height: 0px; */
+            object-fit: contain;
+            filter: brightness(0) invert(1);
+            transition: all 0.3s ease;
+        }
+
+
+
+        /* Reddit */
+        .social-icons a:nth-child(7):hover {
+            background: #000000;
+        }
+
+        @media (max-width: 768px) {
+            .social-icons {
+                gap: 12px;
+            }
+
+            .social-icons a {
+                width: 32px;
+                height: 32px;
+            }
+
+            .social-icons a img {
+                width: 18px;
+                height: 18px;
+            }
+        }
+
+        @media (max-width: 480px) {
+            .social-icons {
+                gap: 10px;
+            }
+
+            .social-icons a {
+                width: 28px;
+                height: 28px;
+            }
+
+            .social-icons a img {
+                width: 16px;
+                height: 16px;
+            }
+        }
+
+        .logo-container img {
+            width: 60px;
+        }
+
+        /* Responsive Design */
+        @media (max-width: 768px) {
+            .card-container {
+                flex-direction: column;
+                gap: 30px;
+            }
+
+            .right-section {
+                border-left: none;
+                border-top: 1px solid #333;
+                padding-left: 0;
+                padding-top: 30px;
+            }
+
+            .card {
+                padding: 30px 20px;
+            }
+
+            .name {
+                font-size: 24px;
+            }
+
+            .title {
+                font-size: 14px;
+            }
+
+            .contact-item {
+                font-size: 14px;
+            }
+        }
+
+        @media (max-width: 480px) {
+            .logo-container {
+                width: 100px;
+                height: 100px;
+            }
+
+            .logo {
+                width: 60px;
+                height: 60px;
+            }
+
+            .name {
+                font-size: 20px;
+            }
+
+            .social-icons {
+                gap: 12px;
+            }
+
+            .social-icon {
+                width: 28px;
+                height: 28px;
+            }
+        }
+    </style>
+</head>
+
+<body>
+    <div class="card">
+        <div class="card-container">
+            <!-- Left Section -->
+            <div class="left-section">
+                <div class="logo-container">
+
+                    <img src="https://flirtmetrics.com/assets/logo.png" alt="Flirtmetrics" class="logo-img">
+                </div>
+                <h1 class="name">Muhammad Haseeb Zafar</h1>
+                <p class="title">Mobile App Developer</p>
+            </div>
+
+            <!-- Right Section -->
+            <div class="right-section">
+                <div class="contact-item">
+                    <svg class="contact-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                            d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z">
+                        </path>
+                    </svg>
+                    <a href="mailto:benjamin.baier@flirtmetrics.com">Muhammad.zafar@flirtmetrics.com</a>
+                </div>
+
+                <div class="contact-item">
+                    <svg class="contact-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                            d="M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1">
+                        </path>
+                    </svg>
+                    <a href="https://www.flirtmetrics.com" target="_blank">www.flirtmetrics.com</a>
+                </div>
+
+                <div class="social-icons">
+                    <a href="https://www.facebook.com/Flirtmetrics" target="_black"><img
+                            src="../../public/assets/facebook.svg" alt="Facebook" /></a>
+                    <a href="https://www.instagram.com/flirtmetrics/" target="_black"><img
+                            src="../../public/assets/insta.svg" alt="Instagram" /></a>
+                    <a href="https://www.tiktok.com/@flirtmetrics" target="_black"><img
+                            src="../../public/assets/tiktok.svg" alt="TikTok" /></a>
+
+                    <a href="https://x.com/flirtmetrics/" target="_black"><img src="../../public/assets/twitter.svg"
+                            alt="Twitter" /></a>
+                    <a href="https://rumble.com/user/flirtmetrics" target="_black"><img
+                            src="../../public/assets/rumble.svg" alt="Rumble" /></a>
+
+                    <a href="http://reddit.com/flirtmetrics/" target="_black"><img src="../../public/assets/reddit.svg"
+                            alt="Reddit" /></a>
+                    <a href="https://www.threads.com/@flirtmetrics" target="_black"><img
+                            src="/../../public/assets/thread.svg" alt="Thread" /></a>
+                </div>
+            </div>
+        </div>
+    </div>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/Moeez.html b/Moeez.html
new file mode 100644
index 0000000..0ac0abc
--- /dev/null
+++ b/Moeez.html
@@ -0,0 +1,301 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Benjamin Baier - Business Card</title>
+    <style>
+        * {
+            margin: 0;
+            padding: 0;
+            box-sizing: border-box;
+        }
+
+        body {
+            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
+            background: black;
+            min-height: 100vh;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            padding: 20px;
+        }
+
+        .card {
+            background: #1a1a1a;
+            border-radius: 20px;
+            padding: 40px;
+            max-width: 900px;
+            width: 100%;
+            box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
+        }
+
+        .card-container {
+            display: flex;
+            gap: 20px;
+        }
+
+        .left-section {
+            flex: 0.8;
+            text-align: center;
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            justify-content: center;
+        }
+
+        .logo-container {
+            width: 120px;
+            height: 120px;
+            background: #2a2a2a;
+            border-radius: 16px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            margin-bottom: 20px;
+        }
+
+        .logo {
+            width: 80px;
+            height: 80px;
+            /* Yahan apna logo lagao */
+            background: #d4af37;
+            border-radius: 50%;
+        }
+
+        .name {
+            color: #ffffff;
+            font-size: 28px;
+            font-weight: 600;
+            margin-bottom: 8px;
+        }
+
+        .title {
+            color: #a0a0a0;
+            font-size: 16px;
+            font-weight: 400;
+        }
+
+        .right-section {
+            flex: 1.2;
+            display: flex;
+            flex-direction: column;
+            justify-content: center;
+            border-left: 1px solid #333;
+            padding-left: 40px;
+        }
+
+        .contact-item {
+            display: flex;
+            align-items: center;
+            gap: 12px;
+            margin-bottom: 16px;
+            color: #ffffff;
+            font-size: 16px;
+        }
+
+        .contact-icon {
+            width: 20px;
+            height: 20px;
+            color: white;
+        }
+
+        .contact-item a {
+            color: #ffffff;
+            text-decoration: none;
+            transition: color 0.3s ease;
+        }
+
+        .contact-item a:hover {
+            color: #d4af37;
+        }
+
+
+
+        /* Social Icons Container */
+        .social-icons {
+            display: flex;
+            gap: 10px;
+            align-items: center;
+            flex-wrap: wrap;
+        }
+
+        /* Social Icons Links */
+        .social-icons a {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            width: 36px;
+            height: 36px;
+            border-radius: 8px;
+            transition: all 0.3s ease;
+            text-decoration: none;
+        }
+
+        .social-icons a img {
+            width: 25px;
+            /* height: 0px; */
+            object-fit: contain;
+            filter: brightness(0) invert(1);
+            transition: all 0.3s ease;
+        }
+
+
+
+        /* Reddit */
+        .social-icons a:nth-child(7):hover {
+            background: #000000;
+        }
+
+        @media (max-width: 768px) {
+            .social-icons {
+                gap: 12px;
+            }
+
+            .social-icons a {
+                width: 32px;
+                height: 32px;
+            }
+
+            .social-icons a img {
+                width: 18px;
+                height: 18px;
+            }
+        }
+
+        @media (max-width: 480px) {
+            .social-icons {
+                gap: 10px;
+            }
+
+            .social-icons a {
+                width: 28px;
+                height: 28px;
+            }
+
+            .social-icons a img {
+                width: 16px;
+                height: 16px;
+            }
+        }
+
+        .logo-container img {
+            width: 60px;
+        }
+
+        /* Responsive Design */
+        @media (max-width: 768px) {
+            .card-container {
+                flex-direction: column;
+                gap: 30px;
+            }
+
+            .right-section {
+                border-left: none;
+                border-top: 1px solid #333;
+                padding-left: 0;
+                padding-top: 30px;
+            }
+
+            .card {
+                padding: 30px 20px;
+            }
+
+            .name {
+                font-size: 24px;
+            }
+
+            .title {
+                font-size: 14px;
+            }
+
+            .contact-item {
+                font-size: 14px;
+            }
+        }
+
+        @media (max-width: 480px) {
+            .logo-container {
+                width: 100px;
+                height: 100px;
+            }
+
+            .logo {
+                width: 60px;
+                height: 60px;
+            }
+
+            .name {
+                font-size: 20px;
+            }
+
+            .social-icons {
+                gap: 12px;
+            }
+
+            .social-icon {
+                width: 28px;
+                height: 28px;
+            }
+        }
+    </style>
+</head>
+
+<body>
+    <div class="card">
+        <div class="card-container">
+            <!-- Left Section -->
+            <div class="left-section">
+                <div class="logo-container">
+
+                    <img src="https://flirtmetrics.com/assets/logo.png" alt="Flirtmetrics" class="logo-img">
+                </div>
+                <h1 class="name">Moeez Sadiq</h1>
+                <p class="title">SEO & Marketing Specialist</p>
+            </div>
+
+            <!-- Right Section -->
+            <div class="right-section">
+                <div class="contact-item">
+                    <svg class="contact-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                            d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z">
+                        </path>
+                    </svg>
+                    <a href="mailto:benjamin.baier@flirtmetrics.com">moeez.sadiq@flirtmetrics.com</a>
+                </div>
+
+                <div class="contact-item">
+                    <svg class="contact-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                            d="M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1">
+                        </path>
+                    </svg>
+                    <a href="https://www.flirtmetrics.com" target="_blank">www.flirtmetrics.com</a>
+                </div>
+
+                <div class="social-icons">
+                    <a href="https://www.facebook.com/Flirtmetrics" target="_black"><img
+                            src="../../public/assets/facebook.svg" alt="Facebook" /></a>
+                    <a href="https://www.instagram.com/flirtmetrics/" target="_black"><img
+                            src="../../public/assets/insta.svg" alt="Instagram" /></a>
+                    <a href="https://www.tiktok.com/@flirtmetrics" target="_black"><img
+                            src="../../public/assets/tiktok.svg" alt="TikTok" /></a>
+
+                    <a href="https://x.com/flirtmetrics/" target="_black"><img src="../../public/assets/twitter.svg"
+                            alt="Twitter" /></a>
+                    <a href="https://rumble.com/user/flirtmetrics" target="_black"><img
+                            src="../../public/assets/rumble.svg" alt="Rumble" /></a>
+
+                    <a href="http://reddit.com/flirtmetrics/" target="_black"><img src="../../public/assets/reddit.svg"
+                            alt="Reddit" /></a>
+                    <a href="https://www.threads.com/@flirtmetrics" target="_black"><img
+                            src="/../../public/assets/thread.svg" alt="Thread" /></a>
+                </div>
+            </div>
+        </div>
+    </div>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/Noman.html b/Noman.html
new file mode 100644
index 0000000..8d1a05e
--- /dev/null
+++ b/Noman.html
@@ -0,0 +1,301 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Benjamin Baier - Business Card</title>
+    <style>
+        * {
+            margin: 0;
+            padding: 0;
+            box-sizing: border-box;
+        }
+
+        body {
+            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
+            background: black;
+            min-height: 100vh;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            padding: 20px;
+        }
+
+        .card {
+            background: #1a1a1a;
+            border-radius: 20px;
+            padding: 40px;
+            max-width: 900px;
+            width: 100%;
+            box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
+        }
+
+        .card-container {
+            display: flex;
+            gap: 20px;
+        }
+
+        .left-section {
+            flex: 0.8;
+            text-align: center;
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            justify-content: center;
+        }
+
+        .logo-container {
+            width: 120px;
+            height: 120px;
+            background: #2a2a2a;
+            border-radius: 16px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            margin-bottom: 20px;
+        }
+
+        .logo {
+            width: 80px;
+            height: 80px;
+            /* Yahan apna logo lagao */
+            background: #d4af37;
+            border-radius: 50%;
+        }
+
+        .name {
+            color: #ffffff;
+            font-size: 28px;
+            font-weight: 600;
+            margin-bottom: 8px;
+        }
+
+        .title {
+            color: #a0a0a0;
+            font-size: 16px;
+            font-weight: 400;
+        }
+
+        .right-section {
+            flex: 1.2;
+            display: flex;
+            flex-direction: column;
+            justify-content: center;
+            border-left: 1px solid #333;
+            padding-left: 40px;
+        }
+
+        .contact-item {
+            display: flex;
+            align-items: center;
+            gap: 12px;
+            margin-bottom: 16px;
+            color: #ffffff;
+            font-size: 16px;
+        }
+
+        .contact-icon {
+            width: 20px;
+            height: 20px;
+            color: white;
+        }
+
+        .contact-item a {
+            color: #ffffff;
+            text-decoration: none;
+            transition: color 0.3s ease;
+        }
+
+        .contact-item a:hover {
+            color: #d4af37;
+        }
+
+
+
+        /* Social Icons Container */
+        .social-icons {
+            display: flex;
+            gap: 10px;
+            align-items: center;
+            flex-wrap: wrap;
+        }
+
+        /* Social Icons Links */
+        .social-icons a {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            width: 36px;
+            height: 36px;
+            border-radius: 8px;
+            transition: all 0.3s ease;
+            text-decoration: none;
+        }
+
+        .social-icons a img {
+            width: 25px;
+            /* height: 0px; */
+            object-fit: contain;
+            filter: brightness(0) invert(1);
+            transition: all 0.3s ease;
+        }
+
+
+
+        /* Reddit */
+        .social-icons a:nth-child(7):hover {
+            background: #000000;
+        }
+
+        @media (max-width: 768px) {
+            .social-icons {
+                gap: 12px;
+            }
+
+            .social-icons a {
+                width: 32px;
+                height: 32px;
+            }
+
+            .social-icons a img {
+                width: 18px;
+                height: 18px;
+            }
+        }
+
+        @media (max-width: 480px) {
+            .social-icons {
+                gap: 10px;
+            }
+
+            .social-icons a {
+                width: 28px;
+                height: 28px;
+            }
+
+            .social-icons a img {
+                width: 16px;
+                height: 16px;
+            }
+        }
+
+        .logo-container img {
+            width: 60px;
+        }
+
+        /* Responsive Design */
+        @media (max-width: 768px) {
+            .card-container {
+                flex-direction: column;
+                gap: 30px;
+            }
+
+            .right-section {
+                border-left: none;
+                border-top: 1px solid #333;
+                padding-left: 0;
+                padding-top: 30px;
+            }
+
+            .card {
+                padding: 30px 20px;
+            }
+
+            .name {
+                font-size: 24px;
+            }
+
+            .title {
+                font-size: 14px;
+            }
+
+            .contact-item {
+                font-size: 14px;
+            }
+        }
+
+        @media (max-width: 480px) {
+            .logo-container {
+                width: 100px;
+                height: 100px;
+            }
+
+            .logo {
+                width: 60px;
+                height: 60px;
+            }
+
+            .name {
+                font-size: 20px;
+            }
+
+            .social-icons {
+                gap: 12px;
+            }
+
+            .social-icon {
+                width: 28px;
+                height: 28px;
+            }
+        }
+    </style>
+</head>
+
+<body>
+    <div class="card">
+        <div class="card-container">
+            <!-- Left Section -->
+            <div class="left-section">
+                <div class="logo-container">
+
+                    <img src="https://flirtmetrics.com/assets/logo.png" alt="Flirtmetrics" class="logo-img">
+                </div>
+                <h1 class="name">Muhammad Noman</h1>
+                <p class="title">Mobile App Developer</p>
+            </div>
+
+            <!-- Right Section -->
+            <div class="right-section">
+                <div class="contact-item">
+                    <svg class="contact-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                            d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z">
+                        </path>
+                    </svg>
+                    <a href="mailto:benjamin.baier@flirtmetrics.com">muhammad.noman@flirtmetrics.com</a>
+                </div>
+
+                <div class="contact-item">
+                    <svg class="contact-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                            d="M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1">
+                        </path>
+                    </svg>
+                    <a href="https://www.flirtmetrics.com" target="_blank">www.flirtmetrics.com</a>
+                </div>
+
+                <div class="social-icons">
+                    <a href="https://www.facebook.com/Flirtmetrics" target="_black"><img
+                            src="../../public/assets/facebook.svg" alt="Facebook" /></a>
+                    <a href="https://www.instagram.com/flirtmetrics/" target="_black"><img
+                            src="../../public/assets/insta.svg" alt="Instagram" /></a>
+                    <a href="https://www.tiktok.com/@flirtmetrics" target="_black"><img
+                            src="../../public/assets/tiktok.svg" alt="TikTok" /></a>
+
+                    <a href="https://x.com/flirtmetrics/" target="_black"><img src="../../public/assets/twitter.svg"
+                            alt="Twitter" /></a>
+                    <a href="https://rumble.com/user/flirtmetrics" target="_black"><img
+                            src="../../public/assets/rumble.svg" alt="Rumble" /></a>
+
+                    <a href="http://reddit.com/flirtmetrics/" target="_black"><img src="../../public/assets/reddit.svg"
+                            alt="Reddit" /></a>
+                    <a href="https://www.threads.com/@flirtmetrics" target="_black"><img
+                            src="/../../public/assets/thread.svg" alt="Thread" /></a>
+                </div>
+            </div>
+        </div>
+    </div>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/Rohit.html b/Rohit.html
new file mode 100644
index 0000000..1ae2110
--- /dev/null
+++ b/Rohit.html
@@ -0,0 +1,301 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Benjamin Baier - Business Card</title>
+    <style>
+        * {
+            margin: 0;
+            padding: 0;
+            box-sizing: border-box;
+        }
+
+        body {
+            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
+            background: black;
+            min-height: 100vh;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            padding: 20px;
+        }
+
+        .card {
+            background: #1a1a1a;
+            border-radius: 20px;
+            padding: 40px;
+            max-width: 900px;
+            width: 100%;
+            box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
+        }
+
+        .card-container {
+            display: flex;
+            gap: 20px;
+        }
+
+        .left-section {
+            flex: 0.8;
+            text-align: center;
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            justify-content: center;
+        }
+
+        .logo-container {
+            width: 120px;
+            height: 120px;
+            background: #2a2a2a;
+            border-radius: 16px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            margin-bottom: 20px;
+        }
+
+        .logo {
+            width: 80px;
+            height: 80px;
+            /* Yahan apna logo lagao */
+            background: #d4af37;
+            border-radius: 50%;
+        }
+
+        .name {
+            color: #ffffff;
+            font-size: 28px;
+            font-weight: 600;
+            margin-bottom: 8px;
+        }
+
+        .title {
+            color: #a0a0a0;
+            font-size: 16px;
+            font-weight: 400;
+        }
+
+        .right-section {
+            flex: 1.2;
+            display: flex;
+            flex-direction: column;
+            justify-content: center;
+            border-left: 1px solid #333;
+            padding-left: 40px;
+        }
+
+        .contact-item {
+            display: flex;
+            align-items: center;
+            gap: 12px;
+            margin-bottom: 16px;
+            color: #ffffff;
+            font-size: 16px;
+        }
+
+        .contact-icon {
+            width: 20px;
+            height: 20px;
+            color: white;
+        }
+
+        .contact-item a {
+            color: #ffffff;
+            text-decoration: none;
+            transition: color 0.3s ease;
+        }
+
+        .contact-item a:hover {
+            color: #d4af37;
+        }
+
+
+
+        /* Social Icons Container */
+        .social-icons {
+            display: flex;
+            gap: 10px;
+            align-items: center;
+            flex-wrap: wrap;
+        }
+
+        /* Social Icons Links */
+        .social-icons a {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            width: 36px;
+            height: 36px;
+            border-radius: 8px;
+            transition: all 0.3s ease;
+            text-decoration: none;
+        }
+
+        .social-icons a img {
+            width: 25px;
+            /* height: 0px; */
+            object-fit: contain;
+            filter: brightness(0) invert(1);
+            transition: all 0.3s ease;
+        }
+
+
+
+        /* Reddit */
+        .social-icons a:nth-child(7):hover {
+            background: #000000;
+        }
+
+        @media (max-width: 768px) {
+            .social-icons {
+                gap: 12px;
+            }
+
+            .social-icons a {
+                width: 32px;
+                height: 32px;
+            }
+
+            .social-icons a img {
+                width: 18px;
+                height: 18px;
+            }
+        }
+
+        @media (max-width: 480px) {
+            .social-icons {
+                gap: 10px;
+            }
+
+            .social-icons a {
+                width: 28px;
+                height: 28px;
+            }
+
+            .social-icons a img {
+                width: 16px;
+                height: 16px;
+            }
+        }
+
+        .logo-container img {
+            width: 60px;
+        }
+
+        /* Responsive Design */
+        @media (max-width: 768px) {
+            .card-container {
+                flex-direction: column;
+                gap: 30px;
+            }
+
+            .right-section {
+                border-left: none;
+                border-top: 1px solid #333;
+                padding-left: 0;
+                padding-top: 30px;
+            }
+
+            .card {
+                padding: 30px 20px;
+            }
+
+            .name {
+                font-size: 24px;
+            }
+
+            .title {
+                font-size: 14px;
+            }
+
+            .contact-item {
+                font-size: 14px;
+            }
+        }
+
+        @media (max-width: 480px) {
+            .logo-container {
+                width: 100px;
+                height: 100px;
+            }
+
+            .logo {
+                width: 60px;
+                height: 60px;
+            }
+
+            .name {
+                font-size: 20px;
+            }
+
+            .social-icons {
+                gap: 12px;
+            }
+
+            .social-icon {
+                width: 28px;
+                height: 28px;
+            }
+        }
+    </style>
+</head>
+
+<body>
+    <div class="card">
+        <div class="card-container">
+            <!-- Left Section -->
+            <div class="left-section">
+                <div class="logo-container">
+
+                    <img src="https://flirtmetrics.com/assets/logo.png" alt="Flirtmetrics" class="logo-img">
+                </div>
+                <h1 class="name">Rohit Darekar</h1>
+                <p class="title">IT & DevOps</p>
+            </div>
+
+            <!-- Right Section -->
+            <div class="right-section">
+                <div class="contact-item">
+                    <svg class="contact-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                            d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z">
+                        </path>
+                    </svg>
+                    <a href="mailto:benjamin.baier@flirtmetrics.com">rohit.darekar@flirtmetrics.com</a>
+                </div>
+
+                <div class="contact-item">
+                    <svg class="contact-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                            d="M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1">
+                        </path>
+                    </svg>
+                    <a href="https://www.flirtmetrics.com" target="_blank">www.flirtmetrics.com</a>
+                </div>
+
+                <div class="social-icons">
+                    <a href="https://www.facebook.com/Flirtmetrics" target="_black"><img
+                            src="../../public/assets/facebook.svg" alt="Facebook" /></a>
+                    <a href="https://www.instagram.com/flirtmetrics/" target="_black"><img
+                            src="../../public/assets/insta.svg" alt="Instagram" /></a>
+                    <a href="https://www.tiktok.com/@flirtmetrics" target="_black"><img
+                            src="../../public/assets/tiktok.svg" alt="TikTok" /></a>
+
+                    <a href="https://x.com/flirtmetrics/" target="_black"><img src="../../public/assets/twitter.svg"
+                            alt="Twitter" /></a>
+                    <a href="https://rumble.com/user/flirtmetrics" target="_black"><img
+                            src="../../public/assets/rumble.svg" alt="Rumble" /></a>
+
+                    <a href="http://reddit.com/flirtmetrics/" target="_black"><img src="../../public/assets/reddit.svg"
+                            alt="Reddit" /></a>
+                    <a href="https://www.threads.com/@flirtmetrics" target="_black"><img
+                            src="/../../public/assets/thread.svg" alt="Thread" /></a>
+                </div>
+            </div>
+        </div>
+    </div>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/Shahzad.html b/Shahzad.html
new file mode 100644
index 0000000..a71d740
--- /dev/null
+++ b/Shahzad.html
@@ -0,0 +1,301 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Benjamin Baier - Business Card</title>
+    <style>
+        * {
+            margin: 0;
+            padding: 0;
+            box-sizing: border-box;
+        }
+
+        body {
+            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
+            background: black;
+            min-height: 100vh;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            padding: 20px;
+        }
+
+        .card {
+            background: #1a1a1a;
+            border-radius: 20px;
+            padding: 40px;
+            max-width: 900px;
+            width: 100%;
+            box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
+        }
+
+        .card-container {
+            display: flex;
+            gap: 20px;
+        }
+
+        .left-section {
+            flex: 0.8;
+            text-align: center;
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            justify-content: center;
+        }
+
+        .logo-container {
+            width: 120px;
+            height: 120px;
+            background: #2a2a2a;
+            border-radius: 16px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            margin-bottom: 20px;
+        }
+
+        .logo {
+            width: 80px;
+            height: 80px;
+            /* Yahan apna logo lagao */
+            background: #d4af37;
+            border-radius: 50%;
+        }
+
+        .name {
+            color: #ffffff;
+            font-size: 28px;
+            font-weight: 600;
+            margin-bottom: 8px;
+        }
+
+        .title {
+            color: #a0a0a0;
+            font-size: 16px;
+            font-weight: 400;
+        }
+
+        .right-section {
+            flex: 1.2;
+            display: flex;
+            flex-direction: column;
+            justify-content: center;
+            border-left: 1px solid #333;
+            padding-left: 40px;
+        }
+
+        .contact-item {
+            display: flex;
+            align-items: center;
+            gap: 12px;
+            margin-bottom: 16px;
+            color: #ffffff;
+            font-size: 16px;
+        }
+
+        .contact-icon {
+            width: 20px;
+            height: 20px;
+            color: white;
+        }
+
+        .contact-item a {
+            color: #ffffff;
+            text-decoration: none;
+            transition: color 0.3s ease;
+        }
+
+        .contact-item a:hover {
+            color: #d4af37;
+        }
+
+
+
+        /* Social Icons Container */
+        .social-icons {
+            display: flex;
+            gap: 10px;
+            align-items: center;
+            flex-wrap: wrap;
+        }
+
+        /* Social Icons Links */
+        .social-icons a {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            width: 36px;
+            height: 36px;
+            border-radius: 8px;
+            transition: all 0.3s ease;
+            text-decoration: none;
+        }
+
+        .social-icons a img {
+            width: 25px;
+            /* height: 0px; */
+            object-fit: contain;
+            filter: brightness(0) invert(1);
+            transition: all 0.3s ease;
+        }
+
+
+
+        /* Reddit */
+        .social-icons a:nth-child(7):hover {
+            background: #000000;
+        }
+
+        @media (max-width: 768px) {
+            .social-icons {
+                gap: 12px;
+            }
+
+            .social-icons a {
+                width: 32px;
+                height: 32px;
+            }
+
+            .social-icons a img {
+                width: 18px;
+                height: 18px;
+            }
+        }
+
+        @media (max-width: 480px) {
+            .social-icons {
+                gap: 10px;
+            }
+
+            .social-icons a {
+                width: 28px;
+                height: 28px;
+            }
+
+            .social-icons a img {
+                width: 16px;
+                height: 16px;
+            }
+        }
+
+        .logo-container img {
+            width: 60px;
+        }
+
+        /* Responsive Design */
+        @media (max-width: 768px) {
+            .card-container {
+                flex-direction: column;
+                gap: 30px;
+            }
+
+            .right-section {
+                border-left: none;
+                border-top: 1px solid #333;
+                padding-left: 0;
+                padding-top: 30px;
+            }
+
+            .card {
+                padding: 30px 20px;
+            }
+
+            .name {
+                font-size: 24px;
+            }
+
+            .title {
+                font-size: 14px;
+            }
+
+            .contact-item {
+                font-size: 14px;
+            }
+        }
+
+        @media (max-width: 480px) {
+            .logo-container {
+                width: 100px;
+                height: 100px;
+            }
+
+            .logo {
+                width: 60px;
+                height: 60px;
+            }
+
+            .name {
+                font-size: 20px;
+            }
+
+            .social-icons {
+                gap: 12px;
+            }
+
+            .social-icon {
+                width: 28px;
+                height: 28px;
+            }
+        }
+    </style>
+</head>
+
+<body>
+    <div class="card">
+        <div class="card-container">
+            <!-- Left Section -->
+            <div class="left-section">
+                <div class="logo-container">
+
+                    <img src="https://flirtmetrics.com/assets/logo.png" alt="Flirtmetrics" class="logo-img">
+                </div>
+                <h1 class="name">Muhammad Shahzad</h1>
+                <p class="title">Mobile App Developer</p>
+            </div>
+
+            <!-- Right Section -->
+            <div class="right-section">
+                <div class="contact-item">
+                    <svg class="contact-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                            d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z">
+                        </path>
+                    </svg>
+                    <a href="mailto:benjamin.baier@flirtmetrics.com">muhammad.shahzad@flirtmetrics.com</a>
+                </div>
+
+                <div class="contact-item">
+                    <svg class="contact-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                            d="M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1">
+                        </path>
+                    </svg>
+                    <a href="https://www.flirtmetrics.com" target="_blank">www.flirtmetrics.comRohit</a>
+                </div>
+
+                <div class="social-icons">
+                    <a href="https://www.facebook.com/Flirtmetrics" target="_black"><img
+                            src="../../public/assets/facebook.svg" alt="Facebook" /></a>
+                    <a href="https://www.instagram.com/flirtmetrics/" target="_black"><img
+                            src="../../public/assets/insta.svg" alt="Instagram" /></a>
+                    <a href="https://www.tiktok.com/@flirtmetrics" target="_black"><img
+                            src="../../public/assets/tiktok.svg" alt="TikTok" /></a>
+
+                    <a href="https://x.com/flirtmetrics/" target="_black"><img src="../../public/assets/twitter.svg"
+                            alt="Twitter" /></a>
+                    <a href="https://rumble.com/user/flirtmetrics" target="_black"><img
+                            src="../../public/assets/rumble.svg" alt="Rumble" /></a>
+
+                    <a href="http://reddit.com/flirtmetrics/" target="_black"><img src="../../public/assets/reddit.svg"
+                            alt="Reddit" /></a>
+                    <a href="https://www.threads.com/@flirtmetrics" target="_black"><img
+                            src="/../../public/assets/thread.svg" alt="Thread" /></a>
+                </div>
+            </div>
+        </div>
+    </div>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/Till.html b/Till.html
new file mode 100644
index 0000000..c301519
--- /dev/null
+++ b/Till.html
@@ -0,0 +1,301 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Benjamin Baier - Business Card</title>
+    <style>
+        * {
+            margin: 0;
+            padding: 0;
+            box-sizing: border-box;
+        }
+
+        body {
+            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
+            background: black;
+            min-height: 100vh;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            padding: 20px;
+        }
+
+        .card {
+            background: #1a1a1a;
+            border-radius: 20px;
+            padding: 40px;
+            max-width: 900px;
+            width: 100%;
+            box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
+        }
+
+        .card-container {
+            display: flex;
+            gap: 20px;
+        }
+
+        .left-section {
+            flex: 0.8;
+            text-align: center;
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            justify-content: center;
+        }
+
+        .logo-container {
+            width: 120px;
+            height: 120px;
+            background: #2a2a2a;
+            border-radius: 16px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            margin-bottom: 20px;
+        }
+
+        .logo {
+            width: 80px;
+            height: 80px;
+            /* Yahan apna logo lagao */
+            background: #d4af37;
+            border-radius: 50%;
+        }
+
+        .name {
+            color: #ffffff;
+            font-size: 28px;
+            font-weight: 600;
+            margin-bottom: 8px;
+        }
+
+        .title {
+            color: #a0a0a0;
+            font-size: 16px;
+            font-weight: 400;
+        }
+
+        .right-section {
+            flex: 1.2;
+            display: flex;
+            flex-direction: column;
+            justify-content: center;
+            border-left: 1px solid #333;
+            padding-left: 40px;
+        }
+
+        .contact-item {
+            display: flex;
+            align-items: center;
+            gap: 12px;
+            margin-bottom: 16px;
+            color: #ffffff;
+            font-size: 16px;
+        }
+
+        .contact-icon {
+            width: 20px;
+            height: 20px;
+            color: white;
+        }
+
+        .contact-item a {
+            color: #ffffff;
+            text-decoration: none;
+            transition: color 0.3s ease;
+        }
+
+        .contact-item a:hover {
+            color: #d4af37;
+        }
+
+
+
+        /* Social Icons Container */
+        .social-icons {
+            display: flex;
+            gap: 10px;
+            align-items: center;
+            flex-wrap: wrap;
+        }
+
+        /* Social Icons Links */
+        .social-icons a {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            width: 36px;
+            height: 36px;
+            border-radius: 8px;
+            transition: all 0.3s ease;
+            text-decoration: none;
+        }
+
+        .social-icons a img {
+            width: 25px;
+            /* height: 0px; */
+            object-fit: contain;
+            filter: brightness(0) invert(1);
+            transition: all 0.3s ease;
+        }
+
+
+
+        /* Reddit */
+        .social-icons a:nth-child(7):hover {
+            background: #000000;
+        }
+
+        @media (max-width: 768px) {
+            .social-icons {
+                gap: 12px;
+            }
+
+            .social-icons a {
+                width: 32px;
+                height: 32px;
+            }
+
+            .social-icons a img {
+                width: 18px;
+                height: 18px;
+            }
+        }
+
+        @media (max-width: 480px) {
+            .social-icons {
+                gap: 10px;
+            }
+
+            .social-icons a {
+                width: 28px;
+                height: 28px;
+            }
+
+            .social-icons a img {
+                width: 16px;
+                height: 16px;
+            }
+        }
+
+        .logo-container img {
+            width: 60px;
+        }
+
+        /* Responsive Design */
+        @media (max-width: 768px) {
+            .card-container {
+                flex-direction: column;
+                gap: 30px;
+            }
+
+            .right-section {
+                border-left: none;
+                border-top: 1px solid #333;
+                padding-left: 0;
+                padding-top: 30px;
+            }
+
+            .card {
+                padding: 30px 20px;
+            }
+
+            .name {
+                font-size: 24px;
+            }
+
+            .title {
+                font-size: 14px;
+            }
+
+            .contact-item {
+                font-size: 14px;
+            }
+        }
+
+        @media (max-width: 480px) {
+            .logo-container {
+                width: 100px;
+                height: 100px;
+            }
+
+            .logo {
+                width: 60px;
+                height: 60px;
+            }
+
+            .name {
+                font-size: 20px;
+            }
+
+            .social-icons {
+                gap: 12px;
+            }
+
+            .social-icon {
+                width: 28px;
+                height: 28px;
+            }
+        }
+    </style>
+</head>
+
+<body>
+    <div class="card">
+        <div class="card-container">
+            <!-- Left Section -->
+            <div class="left-section">
+                <div class="logo-container">
+
+                    <img src="https://flirtmetrics.com/assets/logo.png" alt="Flirtmetrics" class="logo-img">
+                </div>
+                <h1 class="name">Till Jäger</h1>
+                <p class="title">Co-Founder & CFO, Operations Lead</p>
+            </div>
+
+            <!-- Right Section -->
+            <div class="right-section">
+                <div class="contact-item">
+                    <svg class="contact-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                            d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z">
+                        </path>
+                    </svg>
+                    <a href="mailto:benjamin.baier@flirtmetrics.com">btill.jager@flirtmetrics.com</a>
+                </div>
+
+                <div class="contact-item">
+                    <svg class="contact-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                            d="M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1">
+                        </path>
+                    </svg>
+                    <a href="https://www.flirtmetrics.com" target="_blank">www.flirtmetrics.comRohit</a>
+                </div>
+
+                <div class="social-icons">
+                    <a href="https://www.facebook.com/Flirtmetrics" target="_black"><img
+                            src="../../public/assets/facebook.svg" alt="Facebook" /></a>
+                    <a href="https://www.instagram.com/flirtmetrics/" target="_black"><img
+                            src="../../public/assets/insta.svg" alt="Instagram" /></a>
+                    <a href="https://www.tiktok.com/@flirtmetrics" target="_black"><img
+                            src="../../public/assets/tiktok.svg" alt="TikTok" /></a>
+
+                    <a href="https://x.com/flirtmetrics/" target="_black"><img src="../../public/assets/twitter.svg"
+                            alt="Twitter" /></a>
+                    <a href="https://rumble.com/user/flirtmetrics" target="_black"><img
+                            src="../../public/assets/rumble.svg" alt="Rumble" /></a>
+
+                    <a href="http://reddit.com/flirtmetrics/" target="_black"><img src="../../public/assets/reddit.svg"
+                            alt="Reddit" /></a>
+                    <a href="https://www.threads.com/@flirtmetrics" target="_black"><img
+                            src="/../../public/assets/thread.svg" alt="Thread" /></a>
+                </div>
+            </div>
+        </div>
+    </div>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/Waris.html b/Waris.html
new file mode 100644
index 0000000..9a66ac9
--- /dev/null
+++ b/Waris.html
@@ -0,0 +1,301 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Benjamin Baier - Business Card</title>
+    <style>
+        * {
+            margin: 0;
+            padding: 0;
+            box-sizing: border-box;
+        }
+
+        body {
+            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
+            background: black;
+            min-height: 100vh;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            padding: 20px;
+        }
+
+        .card {
+            background: #1a1a1a;
+            border-radius: 20px;
+            padding: 40px;
+            max-width: 900px;
+            width: 100%;
+            box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
+        }
+
+        .card-container {
+            display: flex;
+            gap: 20px;
+        }
+
+        .left-section {
+            flex: 0.8;
+            text-align: center;
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            justify-content: center;
+        }
+
+        .logo-container {
+            width: 120px;
+            height: 120px;
+            background: #2a2a2a;
+            border-radius: 16px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            margin-bottom: 20px;
+        }
+
+        .logo {
+            width: 80px;
+            height: 80px;
+            /* Yahan apna logo lagao */
+            background: #d4af37;
+            border-radius: 50%;
+        }
+
+        .name {
+            color: #ffffff;
+            font-size: 28px;
+            font-weight: 600;
+            margin-bottom: 8px;
+        }
+
+        .title {
+            color: #a0a0a0;
+            font-size: 16px;
+            font-weight: 400;
+        }
+
+        .right-section {
+            flex: 1.2;
+            display: flex;
+            flex-direction: column;
+            justify-content: center;
+            border-left: 1px solid #333;
+            padding-left: 40px;
+        }
+
+        .contact-item {
+            display: flex;
+            align-items: center;
+            gap: 12px;
+            margin-bottom: 16px;
+            color: #ffffff;
+            font-size: 16px;
+        }
+
+        .contact-icon {
+            width: 20px;
+            height: 20px;
+            color: white;
+        }
+
+        .contact-item a {
+            color: #ffffff;
+            text-decoration: none;
+            transition: color 0.3s ease;
+        }
+
+        .contact-item a:hover {
+            color: #d4af37;
+        }
+
+
+
+        /* Social Icons Container */
+        .social-icons {
+            display: flex;
+            gap: 10px;
+            align-items: center;
+            flex-wrap: wrap;
+        }
+
+        /* Social Icons Links */
+        .social-icons a {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            width: 36px;
+            height: 36px;
+            border-radius: 8px;
+            transition: all 0.3s ease;
+            text-decoration: none;
+        }
+
+        .social-icons a img {
+            width: 25px;
+            /* height: 0px; */
+            object-fit: contain;
+            filter: brightness(0) invert(1);
+            transition: all 0.3s ease;
+        }
+
+
+
+        /* Reddit */
+        .social-icons a:nth-child(7):hover {
+            background: #000000;
+        }
+
+        @media (max-width: 768px) {
+            .social-icons {
+                gap: 12px;
+            }
+
+            .social-icons a {
+                width: 32px;
+                height: 32px;
+            }
+
+            .social-icons a img {
+                width: 18px;
+                height: 18px;
+            }
+        }
+
+        @media (max-width: 480px) {
+            .social-icons {
+                gap: 10px;
+            }
+
+            .social-icons a {
+                width: 28px;
+                height: 28px;
+            }
+
+            .social-icons a img {
+                width: 16px;
+                height: 16px;
+            }
+        }
+
+        .logo-container img {
+            width: 60px;
+        }
+
+        /* Responsive Design */
+        @media (max-width: 768px) {
+            .card-container {
+                flex-direction: column;
+                gap: 30px;
+            }
+
+            .right-section {
+                border-left: none;
+                border-top: 1px solid #333;
+                padding-left: 0;
+                padding-top: 30px;
+            }
+
+            .card {
+                padding: 30px 20px;
+            }
+
+            .name {
+                font-size: 24px;
+            }
+
+            .title {
+                font-size: 14px;
+            }
+
+            .contact-item {
+                font-size: 14px;
+            }
+        }
+
+        @media (max-width: 480px) {
+            .logo-container {
+                width: 100px;
+                height: 100px;
+            }
+
+            .logo {
+                width: 60px;
+                height: 60px;
+            }
+
+            .name {
+                font-size: 20px;
+            }
+
+            .social-icons {
+                gap: 12px;
+            }
+
+            .social-icon {
+                width: 28px;
+                height: 28px;
+            }
+        }
+    </style>
+</head>
+
+<body>
+    <div class="card">
+        <div class="card-container">
+            <!-- Left Section -->
+            <div class="left-section">
+                <div class="logo-container">
+
+                    <img src="https://flirtmetrics.com/assets/logo.png" alt="Flirtmetrics" class="logo-img">
+                </div>
+                <h1 class="name">Muhammad Waris</h1>
+                <p class="title">Quality Assurance Engineer</p>
+            </div>
+
+            <!-- Right Section -->
+            <div class="right-section">
+                <div class="contact-item">
+                    <svg class="contact-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                            d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z">
+                        </path>
+                    </svg>
+                    <a href="mailto:benjamin.baier@flirtmetrics.com">muhammad.waris@flirtmetrics.com</a>
+                </div>
+
+                <div class="contact-item">
+                    <svg class="contact-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                            d="M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1">
+                        </path>
+                    </svg>
+                    <a href="https://www.flirtmetrics.com" target="_blank">www.flirtmetrics.comRohit</a>
+                </div>
+
+                <div class="social-icons">
+                    <a href="https://www.facebook.com/Flirtmetrics" target="_black"><img
+                            src="../../public/assets/facebook.svg" alt="Facebook" /></a>
+                    <a href="https://www.instagram.com/flirtmetrics/" target="_black"><img
+                            src="../../public/assets/insta.svg" alt="Instagram" /></a>
+                    <a href="https://www.tiktok.com/@flirtmetrics" target="_black"><img
+                            src="../../public/assets/tiktok.svg" alt="TikTok" /></a>
+
+                    <a href="https://x.com/flirtmetrics/" target="_black"><img src="../../public/assets/twitter.svg"
+                            alt="Twitter" /></a>
+                    <a href="https://rumble.com/user/flirtmetrics" target="_black"><img
+                            src="../../public/assets/rumble.svg" alt="Rumble" /></a>
+
+                    <a href="http://reddit.com/flirtmetrics/" target="_black"><img src="../../public/assets/reddit.svg"
+                            alt="Reddit" /></a>
+                    <a href="https://www.threads.com/@flirtmetrics" target="_black"><img
+                            src="/../../public/assets/thread.svg" alt="Thread" /></a>
+                </div>
+            </div>
+        </div>
+    </div>
+</body>
+
+</html>
\ No newline at end of file
