diff --git a/Data Encryption.png b/Data Encryption.png
new file mode 100644
index 0000000..de41a5d
Binary files /dev/null and b/Data Encryption.png differ
diff --git a/Deception.png b/Deception.png
new file mode 100644
index 0000000..97979a1
Binary files /dev/null and b/Deception.png differ
diff --git a/EnterpriseFuzzing.png b/EnterpriseFuzzing.png
new file mode 100644
index 0000000..e697512
Binary files /dev/null and b/EnterpriseFuzzing.png differ
diff --git a/Incident Response (2).png b/Incident Response (2).png
new file mode 100644
index 0000000..6979f69
Binary files /dev/null and b/Incident Response (2).png differ
diff --git a/Incident Response.png b/Incident Response.png
new file mode 100644
index 0000000..b67dd4b
Binary files /dev/null and b/Incident Response.png differ
diff --git a/Malware Detection.png b/Malware Detection.png
new file mode 100644
index 0000000..6219c2c
Binary files /dev/null and b/Malware Detection.png differ
diff --git a/OSINT.png b/OSINT.png
new file mode 100644
index 0000000..e25e9c3
Binary files /dev/null and b/OSINT.png differ
diff --git a/Privacy & Compliance.png b/Privacy & Compliance.png
new file mode 100644
index 0000000..f6bc150
Binary files /dev/null and b/Privacy & Compliance.png differ
diff --git a/Responsible Disclosure.png b/Responsible Disclosure.png
new file mode 100644
index 0000000..adb1694
Binary files /dev/null and b/Responsible Disclosure.png differ
diff --git a/SecurityAudits.png b/SecurityAudits.png
new file mode 100644
index 0000000..27df985
Binary files /dev/null and b/SecurityAudits.png differ
diff --git a/cypsec-logo-white-transparent.webp b/cypsec-logo-white-transparent.webp
new file mode 100644
index 0000000..76824b1
Binary files /dev/null and b/cypsec-logo-white-transparent.webp differ
diff --git a/index.html b/index.html
index b0a05f1..247fd9f 100644
--- a/index.html
+++ b/index.html
@@ -3,50 +3,113 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>CypSec Security - Interactive Cards</title>
+    <title>CypSec Security Center</title>
+    <script src="https://cdn.tailwindcss.com "></script>
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css ">
     <style>
-        * {
+        :root {
+            --cyp-dark: #0a0a0a;
+            --cyp-card: #1a1a1a;
+            --cyp-border: #27272a;
+            --cyp-blue: #0066ff;
+            --cyp-purple: #6366f1;
+            --cyp-glow: 0 0 20px rgba(0, 102, 255, .35);
+        }
+        
+        body {
+            background: var(--cyp-dark);
+            color: #e5e5e5;
+            font-family: 'Inter', system-ui, sans-serif;
             margin: 0;
             padding: 0;
-            box-sizing: border-box;
+            width: 100%;
+            overflow-x: hidden;
         }
 
-        body {
-            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
-            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-            min-height: 100vh;
-            padding: 20px;
+        /* Navigation - from No Tracking Cookies page */
+        nav {
+            border-bottom: 1px solid #374151;
+            background: #000000;
         }
 
-        .container {
-            max-width: 1200px;
-            margin: 0 auto;
+        /* Hero Section - combined aesthetic - PRESERVED EXACTLY */
+        .hero-section {
+            position: relative;
+            padding: 6rem 0;
+            overflow: hidden;
         }
 
-        .header {
-            text-align: center;
-            margin-bottom: 50px;
-            color: white;
+        .hero-bg-glow {
+            position: absolute;
+            inset: 0;
+            opacity: 0.2;
+            pointer-events: none;
+            z-index: -1;
         }
 
-        .header h1 {
-            font-size: 3rem;
-            margin-bottom: 10px;
-            text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
+        .hero-bg-glow::before {
+            content: '';
+            position: absolute;
+            top: 50%;
+            left: 50%;
+            transform: translate(-50%, -50%);
+            width: 24rem;
+            height: 24rem;
+            background: linear-gradient(to right, #a855f7, #3b82f6);
+            border-radius: 9999px;
+            filter: blur(100px);
         }
 
-        .header p {
-            font-size: 1.2rem;
-            opacity: 0.9;
+        /* Grid pattern from original security center */
+        .grid-pattern {
+            position: absolute;
+            inset: 0;
+            opacity: 0.1;
+            background-image: 
+                linear-gradient(rgba(255, 255, 255, 0.1) 1px, transparent 1px),
+                linear-gradient(90deg, rgba(255, 255, 255, 0.1) 1px, transparent 1px);
+            background-size: 40px 40px;
+            z-index: -1;
+        }
+
+        /* Divider lines from security center */
+        .header-divider {
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            gap: 0.5rem;
+            margin-top: 2rem;
+        }
+
+        .divider-line {
+            height: 2px;
+            background: linear-gradient(to right, #3b82f6, #8b5cf6);
+            border-radius: 9999px;
+        }
+
+        .divider-line:first-child { width: 10rem; }
+        .divider-line:nth-child(2) { width: 0.75rem; }
+        .divider-line:last-child { width: 0.25rem; }
+
+        /* FIXED: Cards Section - Properly centered */
+        .cards-section {
+            padding: 5rem 0;
+            width: 100%;
+            display: flex;
+            justify-content: center;
         }
 
         .cards-grid {
             display: grid;
             grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
-            gap: 30px;
-            margin-bottom: 50px;
+            gap: 2.5rem;
+            max-width: 1200px;
+            width: 100%;
+            margin: 0 auto;
+            padding: 0 1.5rem;
         }
 
+        /* FIXED: Flip card base styles */
         .flip-card {
             background-color: transparent;
             width: 100%;
@@ -60,7 +123,7 @@
             width: 100%;
             height: 100%;
             text-align: center;
-            transition: transform 0.8s;
+            transition: transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
             transform-style: preserve-3d;
         }
 
@@ -68,148 +131,212 @@
             transform: rotateY(180deg);
         }
 
-        .flip-card-front, .flip-card-back {
+        /* FIXED: Front card - clean and full-size */
+        .flip-card-front {
             position: absolute;
             width: 100%;
             height: 100%;
             -webkit-backface-visibility: hidden;
             backface-visibility: hidden;
-            border-radius: 20px;
-            box-shadow: 0 10px 30px rgba(0,0,0,0.3);
+            border-radius: 0;
+            border: none;
             overflow: hidden;
-        }
-
-        .flip-card-front {
-            background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);
-            color: #333;
+            background: transparent;
             display: flex;
-            flex-direction: column;
             align-items: center;
             justify-content: center;
-            padding: 20px;
-        }
-
-        .flip-card-back {
-            background: linear-gradient(135deg, #2c3e50 0%, #34495e 100%);
-            color: white;
-            transform: rotateY(180deg);
-            padding: 30px;
-            display: flex;
-            flex-direction: column;
-            justify-content: center;
-            text-align: left;
+            transition: all 0.3s ease;
         }
 
+        /* FIXED: Full-size image styling */
         .card-image {
-            width: 150px;
-            height: 150px;
-            object-fit: contain;
-            margin-bottom: 20px;
-            filter: drop-shadow(0 5px 15px rgba(0,0,0,0.2));
+            width: 100%;
+            height: 100%;
+            object-fit: cover;
+            border-radius: 0;
+            display: block;
         }
 
-        .card-title {
-            font-size: 1.8rem;
-            font-weight: bold;
-            margin-bottom: 10px;
-            color: #2c3e50;
+/* FIXED: Black background for flipped cards instead of grey */
+.flip-card-back {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    -webkit-backface-visibility: hidden;
+    backface-visibility: hidden;
+    border-radius: 1rem;
+    border: 1px solid #374151;
+    overflow: hidden;
+    background: #000000 !important; /* BLACK background instead of grey gradient */
+    transform: rotateY(180deg);
+    padding: 2rem;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    text-align: left;
+    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
+}
+
+/* OPTIONAL: Enhance text visibility on black background */
+.card-content h3 {
+    font-size: 1.5rem;
+    font-weight: 700;
+    margin-bottom: 1rem;
+    color: #ffffff;
+    border-bottom: 2px solid #3b82f6;
+    padding-bottom: 0.5rem;
+}
+
+.card-content ul {
+    list-style: none;
+    padding: 0;
+}
+
+.card-content li {
+    margin-bottom: 0.75rem;
+    padding-left: 1.5rem;
+    position: relative;
+    font-size: 0.95rem;
+    line-height: 1.6;
+    color: #e2e8f0;
+}
+
+.card-content li:before {
+    content: "✓";
+    position: absolute;
+    left: 0;
+    color: #10b981;
+    font-weight: bold;
+}
+
+.card-content p {
+    margin-bottom: 1rem;
+    line-height: 1.6;
+    font-size: 0.95rem;
+    color: #e2e8f0;
+}
+
+.contact-form {
+    background: rgba(59, 130, 246, 0.1);
+    backdrop-filter: blur(10px);
+    padding: 1rem;
+    border-radius: 0.5rem;
+    margin-top: 1rem;
+    border: 1px solid rgba(59, 130, 246, 0.3);
+}
+
+.contact-form p {
+    margin: 0;
+    font-size: 0.9rem;
+    color: #cbd5e1;
+}
+
+.contact-form a {
+    color: #60a5fa;
+    text-decoration: none;
+    font-weight: 600;
+}
+
+.contact-form a:hover {
+    color: #3b82f6;
+}
+
+        /* FIXED: Hover effects */
+        .flip-card:hover {
+            transform: translateY(-5px);
+            transition: transform 0.3s ease;
         }
 
-        .card-subtitle {
-            font-size: 1rem;
-            color: #7f8c8d;
-            text-align: center;
+        .flip-card:hover .flip-card-front {
+            box-shadow: 0 20px 40px rgba(59, 130, 246, 0.3);
         }
 
-        .card-content h3 {
-            font-size: 1.5rem;
-            margin-bottom: 20px;
-            color: #ecf0f1;
-            border-bottom: 2px solid #3498db;
-            padding-bottom: 10px;
-        }
-
-        .card-content ul {
-            list-style: none;
-            padding: 0;
-        }
-
-        .card-content li {
-            margin-bottom: 12px;
-            padding-left: 25px;
-            position: relative;
-            font-size: 0.95rem;
-            line-height: 1.5;
-        }
-
-        .card-content li:before {
-            content: "✓";
-            position: absolute;
-            left: 0;
-            color: #27ae60;
-            font-weight: bold;
-            font-size: 1.1rem;
-        }
-
-        .card-content p {
-            margin-bottom: 15px;
-            line-height: 1.6;
-            font-size: 0.95rem;
-        }
-
-        .contact-form {
-            background: rgba(255,255,255,0.1);
-            backdrop-filter: blur(10px);
-            padding: 20px;
-            border-radius: 15px;
-            margin-top: 20px;
-        }
-
-        .contact-form p {
-            margin: 0;
-            font-size: 1rem;
-        }
-
-        .contact-form a {
-            color: #3498db;
-            text-decoration: none;
-            font-weight: bold;
-        }
-
-        .contact-form a:hover {
-            text-decoration: underline;
-        }
-
-        /* Responsive Design */
+        /* FIXED: Responsive Design */
         @media (max-width: 768px) {
-            .header h1 {
+            .header-title {
                 font-size: 2rem;
             }
             
-            .header p {
+            .header-subtitle {
                 font-size: 1rem;
             }
             
             .cards-grid {
                 grid-template-columns: 1fr;
-                gap: 20px;
+                gap: 1.5rem;
+                padding: 0 1rem;
             }
             
             .flip-card {
                 height: 350px;
             }
-            
-            .card-image {
-                width: 120px;
-                height: 120px;
-            }
-            
-            .card-title {
-                font-size: 1.5rem;
-            }
         }
+/* ADD THESE STYLES TO YOUR EXISTING CSS - ONLY AFFECTS CARD BOXES */
 
-        /* Animation for page load */
+/* FIXED: Front card with rounded edges and hover frame */
+.flip-card-front {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    -webkit-backface-visibility: hidden;
+    backface-visibility: hidden;
+    border-radius: 1rem; /* ADD rounded edges */
+    border: 1px solid transparent; /* ADD transparent border */
+    overflow: hidden;
+    background: transparent;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    transition: all 0.3s ease;
+}
+
+/* FIXED: Full-size image with rounded edges */
+.card-image {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+    border-radius: 1rem; /* MATCH card's rounded edges */
+    display: block;
+}
+
+/* FIXED: White frame on hover */
+.flip-card:hover .flip-card-front {
+    border-color: #ffffff; /* WHITE frame on hover */
+    box-shadow: 0 0 20px rgba(255, 255, 255, 0.3); /* Subtle white glow */
+    transform: scale(1.02); /* Slight scale effect */
+}
+
+/* FIXED: Back card keeps rounded edges */
+.flip-card-back {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    -webkit-backface-visibility: hidden;
+    backface-visibility: hidden;
+    border-radius: 1rem; /* KEEP rounded edges */
+    border: 1px solid #374151;
+    overflow: hidden;
+    background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
+    transform: rotateY(180deg);
+    padding: 2rem;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    text-align: left;
+    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
+}
+
+/* FIXED: Smooth hover transition for main card */
+.flip-card {
+    transition: transform 0.3s ease;
+}
+
+.flip-card:hover {
+    transform: translateY(-5px);
+}
+
+
+        /* FIXED: Animation for page load */
         @keyframes fadeInUp {
             from {
                 opacity: 0;
@@ -234,24 +361,98 @@
         .flip-card:nth-child(7) { animation-delay: 0.7s; }
         .flip-card:nth-child(8) { animation-delay: 0.8s; }
         .flip-card:nth-child(9) { animation-delay: 0.9s; }
-        .flip-card:nth-child(10) { animation-delay: 1.0s; }
     </style>
 </head>
 <body>
-    <div class="container">
-        <div class="header">
-            <h1>CypSec Security Center</h1>
-            <p>Click on any card to explore our security measures and programs</p>
+    <!-- ---------------  NAV --------------- -->
+    <nav>
+        <div class="max-w-6xl mx-auto px-4 sm:px-6 lg:px-8">
+            <div class="flex justify-center items-center h-16">
+                <img src="cypsec-logo-white-transparent.webp" alt="CypSec" class="h-7 w-auto mr-2">
+                <span class="text-2xl font-mono text-white">CypSec</span>
+            </div>
         </div>
+    </nav>
 
+    <!-- ---------------  HERO --------------- -->
+    <section class="hero-section">
+        <div class="hero-bg-glow"></div>
+        <div class="grid-pattern"></div>
+        <div class="container mx-auto px-6 text-center relative z-10">
+            <h1 class="text-4xl lg:text-6xl font-semibold leading-tight">
+                Security <span class="text-blue-500">Notice</span>
+            </h1>
+            <p class="text-lg mt-6 max-w-2xl mx-auto text-gray-300">
+                Featuring CypSec's security measurements and security programs.
+            </p>
+            <div class="header-divider">
+                <div class="divider-line"></div>
+                <div class="divider-line"></div>
+                <div class="divider-line"></div>
+            </div>
+        </div>
+    </section>
+<!-- ADD THIS SECTION between hero-section and cards-section -->
+<section class="security-intro">
+  <div class="intro-banner">
+    <span class="intro-text">
+      Security at CypSec — We implement layered security programs, continuous monitoring, and industry-grade controls to protect our platform, data, and users at every level.
+      <a href="#cards-section" class="intro-link">Click&nbsp;on&nbsp;topics&nbsp;>>&nbsp;</a>
+    </span>
+  </div>
+</section>
+
+<style>
+/* ADD THESE STYLES — full-width banner, short height, plain left-to-right text */
+.security-intro {
+  width: 100%;
+  padding: 0.75rem 0;              /* short height */
+  background: linear-gradient(135deg, rgba(79, 70, 229, 0.15), rgba(99, 102, 241, 0.1));
+  border-top: 1px solid rgba(99, 102, 241, 0.2);
+  border-bottom: 1px solid rgba(99, 102, 241, 0.2);
+}
+
+.intro-banner {
+  max-width: 100%;
+  padding: 0 1.5rem;
+  overflow: hidden;
+  white-space: nowrap;
+  box-sizing: border-box;
+}
+
+.intro-text {
+  display: inline-block;
+  font-size: 0.8125rem;            /* small, plain */
+  color: #cbd5e1;
+  line-height: 1.3;
+  animation: banner-scroll 30s linear infinite;
+}
+
+.intro-link {
+  color: #60a5fa;
+  text-decoration: none;
+  margin-left: 0.25rem;
+}
+.intro-link:hover {
+  color: #3b82f6;
+}
+
+/* continuous left-to-right scroll */
+@keyframes banner-scroll {
+  0%   { transform: translateX(100%); }
+  100% { transform: translateX(-100%); }
+}
+</style>
+
+    <!-- Cards Section - FIXED CENTERING -->
+    <section class="cards-section">
         <div class="cards-grid">
+            <!-- All your card content here exactly as it was -->
             <!-- Responsible Disclosure -->
             <div class="flip-card" onclick="flipCard(this)">
                 <div class="flip-card-inner">
                     <div class="flip-card-front">
                         <img src="Responsible Disclosure.png" alt="Responsible Disclosure" class="card-image">
-                        <h2 class="card-title">Responsible Disclosure</h2>
-                        <p class="card-subtitle">Click to learn more</p>
                     </div>
                     <div class="flip-card-back">
                         <div class="card-content">
@@ -270,8 +471,6 @@
                 <div class="flip-card-inner">
                     <div class="flip-card-front">
                         <img src="SecurityAudits.png" alt="Security Audits" class="card-image">
-                        <h2 class="card-title">Security Audits</h2>
-                        <p class="card-subtitle">Click to learn more</p>
                     </div>
                     <div class="flip-card-back">
                         <div class="card-content">
@@ -292,8 +491,6 @@
                 <div class="flip-card-inner">
                     <div class="flip-card-front">
                         <img src="Data Encryption.png" alt="Data Encryption" class="card-image">
-                        <h2 class="card-title">Data Encryption</h2>
-                        <p class="card-subtitle">Click to learn more</p>
                     </div>
                     <div class="flip-card-back">
                         <div class="card-content">
@@ -314,8 +511,6 @@
                 <div class="flip-card-inner">
                     <div class="flip-card-front">
                         <img src="Incident Response.png" alt="Incident Response" class="card-image">
-                        <h2 class="card-title">Incident Response</h2>
-                        <p class="card-subtitle">Click to learn more</p>
                     </div>
                     <div class="flip-card-back">
                         <div class="card-content">
@@ -336,8 +531,6 @@
                 <div class="flip-card-inner">
                     <div class="flip-card-front">
                         <img src="Privacy & Compliance.png" alt="Privacy & Compliance" class="card-image">
-                        <h2 class="card-title">Privacy & Compliance</h2>
-                        <p class="card-subtitle">Click to learn more</p>
                     </div>
                     <div class="flip-card-back">
                         <div class="card-content">
@@ -358,8 +551,6 @@
                 <div class="flip-card-inner">
                     <div class="flip-card-front">
                         <img src="OSINT.png" alt="OSINT & Threat Intelligence" class="card-image">
-                        <h2 class="card-title">OSINT & Threat Intelligence</h2>
-                        <p class="card-subtitle">Click to learn more</p>
                     </div>
                     <div class="flip-card-back">
                         <div class="card-content">
@@ -380,8 +571,6 @@
                 <div class="flip-card-inner">
                     <div class="flip-card-front">
                         <img src="Deception.png" alt="Active Defense & Cyber Deception" class="card-image">
-                        <h2 class="card-title">Active Defense & Cyber Deception</h2>
-                        <p class="card-subtitle">Click to learn more</p>
                     </div>
                     <div class="flip-card-back">
                         <div class="card-content">
@@ -402,8 +591,6 @@
                 <div class="flip-card-inner">
                     <div class="flip-card-front">
                         <img src="EnterpriseFuzzing.png" alt="Enterprise Fuzzing" class="card-image">
-                        <h2 class="card-title">Enterprise Fuzzing</h2>
-                        <p class="card-subtitle">Click to learn more</p>
                     </div>
                     <div class="flip-card-back">
                         <div class="card-content">
@@ -424,8 +611,6 @@
                 <div class="flip-card-inner">
                     <div class="flip-card-front">
                         <img src="Malware Detection.png" alt="Malware Detection & Analysis" class="card-image">
-                        <h2 class="card-title">Malware Detection & Analysis</h2>
-                        <p class="card-subtitle">Click to learn more</p>
                     </div>
                     <div class="flip-card-back">
                         <div class="card-content">
@@ -440,31 +625,49 @@
                     </div>
                 </div>
             </div>
+            <div class="p-2 w-full sm:mx-auto">
+                <div>
+                    <div class="flex items-center">
+                        <a href="/" class="flex">
+                            <picture>
+                                <source srcset="cypsec-logo-white-transparent.webp" media="(prefers-color-scheme: dark)">
+                                <img class="h-10" src="cypsec-logo-white-transparent.webp" alt="CypSec Logo">
+                              </picture>
+                        </a>
+                    </div>
 
-            <!-- Additional Incident Response (2) -->
-            <div class="flip-card" onclick="flipCard(this)">
-                <div class="flip-card-inner">
-                    <div class="flip-card-front">
-                        <img src="Incident Response (2).png" alt="Incident Response Team" class="card-image">
-                        <h2 class="card-title">Incident Response Team</h2>
-                        <p class="card-subtitle">Click to learn more</p>
-                    </div>
-                    <div class="flip-card-back">
-                        <div class="card-content">
-                            <h3>Incident Response Team</h3>
-                            <p>Our dedicated team ensures rapid response to security incidents with comprehensive monitoring and automated mitigation systems.</p>
-                            <ul>
-                                <li>24/7 Security Operations Center</li>
-                                <li>Automated threat detection</li>
-                                <li>Real-time incident tracking</li>
-                                <li>Comprehensive post-incident analysis</li>
-                            </ul>
-                        </div>
-                    </div>
+                    <p class="text-lg text-gray-900 dark:text-white leading-relaxed mt-5">Engineering sovereign cybersecurity that protects, adapts, and sustains critical digital infrastructures.</p>
+
+                    <p class="text-base text-gray-900 dark:text-white leading-snug mt-8">Contact</p>
+
+                    <ul>
+                        <li class="text-base text-gray-900 dark:text-white leading-snug mt-1">
+                            <a href="mailto:contact@cypsec.de">contact@cypsec.de</a>
+                        </li>
+                        <li class="text-base text-gray-900 dark:text-white leading-snug">
+                            <a href="https://linkedin.com/company/cypsec-group">LinkedIn</a>
+                        </li>
+                    </ul>
                 </div>
             </div>
+            </div>
+    </section>
+    <hr class="my-6 border-gray-200 dark:border-gray-700">
+    <div class="flex sm:flex-row justify-evenly mb-4">
+            <div class="hidden sm:flex justify-left mt-2">
+                <a href="/downloads" class="mx-2 text-sm text-gray-500 transition-colors duration-300 hover:text-gray-500 dark:hover:text-gray-300" aria-label="LinkedIn">
+                    <span class="mx-2 text-base text-gray-900 dark:text-white leading-snug sm:mx-6">Downloads</span>
+                </a>
+            </div>
+            <div class="flex justify-center mt-2">
+                <p class="mx-2 text-base text-gray-900 dark:text-white leading-snug sm:mx-6">© 2025 CypSec</p>
+            </div>
+            <div class="hidden sm:flex justify-left mt-2">
+                <a href="/security-notice" class="mx-2 text-sm text-gray-500 transition-colors duration-300 hover:text-gray-500 dark:hover:text-gray-300" aria-label="CypInvest">
+                    <span class="mx-2 text-base text-gray-900 dark:text-white leading-snug sm:mx-6">Security</span>
+                </a>
+            </div>
         </div>
-    </div>
 
     <script>
         function flipCard(card) {
@@ -527,6 +730,7 @@
         document.querySelectorAll('.flip-card').forEach(card => {
             observer.observe(card);
         });
+        
     </script>
 </body>
 </html>
\ No newline at end of file
