Update website content and styling across multiple pages and services

Education/corporate-trainings.html

@@ -204,12 +204,11 @@
                     <h2 class="section-heading gn-mobile-section-heading">READY TO TRANSFORM YOUR TEAM'S AI CAPABILITIES?</h2>
                     <p>Let us design a custom training solution that perfectly aligns with your business workflows and objectives. Our expert team will work with you to create tailored AI training programs that deliver measurable results and accelerate your organization's AI adoption journey.</p>
                     
-                    <div class="benefits-cards-grid">
+                    <div class="benefits-cards-grid">                        <div class="benefit-card">
-                        <div class="benefit-card">
                             <div class="benefit-card-icon">
                                 <i class="fas fa-pencil-ruler"></i>
                             </div>
-                            <h3>Tailored Content</h3>
+                            <h3>Tailored Content for Industries</h3>
                             <p>Our training programs are customized to address your organization's specific needs, goals, and skill gaps.</p>
                         </div>
                         <div class="benefit-card">

Education/individual-trainings.html

@@ -123,41 +123,6 @@
       </div>
     </div>
   </section>
-
-  <!-- WHY CHOOSE US SECTION -->
-  <section class="why-choose-us-section container benefits-section">
-    <h2 class="section-heading gn-mobile-section-heading">WHY CHOOSE GYANNETRA FOR INDIVIDUAL TRAINING?</h2>
-    <div class="benefits-cards-grid">      <div class="benefit-card">
-        <div class="benefit-card-icon">
-          <i class="fas fa-cogs"></i>
-        </div>
-        <h3>Custom Learning Patterns</h3>
-        <p>Our adaptive learning system creates unique training patterns based on your individual progress, learning preferences, and career objectives, ensuring maximum knowledge retention and practical application.</p>
-      </div>
-      <div class="benefit-card">
-        <div class="benefit-card-icon">
-          <i class="fas fa-chalkboard-teacher"></i>
-        </div>
-        <h3>Expert Mentorship</h3>
-        <p>Learn from industry experts and seasoned AI practitioners who provide one-on-one guidance, support, and real-world insights throughout your training journey.</p>
-      </div>
-      <div class="benefit-card">
-        <div class="benefit-card-icon">
-          <i class="fas fa-chart-line"></i>
-        </div>
-        <h3>Career Advancement</h3>
-        <p>Acquire in-demand AI skills and knowledge that can significantly boost your career prospects, open new opportunities, and help you achieve your professional aspirations.</p>
-      </div>
-      <div class="benefit-card">
-        <div class="benefit-card-icon">
-          <i class="fas fa-laptop-code"></i>
-        </div>
-        <h3>Hands-on Projects</h3>
-        <p>Apply your learning to real-world AI projects with personalized guidance, building a portfolio that demonstrates your practical skills to potential employers.</p>
-      </div>
-    </div>    <a href="../contact.html" class="btn-primary centered-btn gn-mobile-button">Enroll in a Program Today</a>
-  </section>
-
   <!-- CUSTOMER TESTIMONIALS SECTION -->
   <section class="testimonials-section">
     <div class="atmospheric-particles"></div>

Education/workshops.html

@@ -75,12 +75,10 @@
             <li><a href="../about.html" class="nav-link">About Us</a></li>
             <li><a href="../contact.html" class="nav-link">Contact Us</a></li>
           </ul>
-        </nav>
+        </nav>    </header>      <main>        <section class="hero-section gn-responsive-container">
-    </header>      <main>
+            <h1>Free AI Webinars</h1>
-        <section class="hero-section gn-responsive-container">
+            <p>Supercharge your AI journey with expert-led live sessions and our rich library of past webinars — all designed to transform your skills from basics to mastery.</p>
-            <h1>AI Webinars & Training Sessions</h1>
+            <a href="https://wa.me/918949135299" class="btn btn-primary">Chat With AI Experts</a>        </section>
-            <p>Join our live sessions and access our comprehensive library of past webinars to advance your AI knowledge and skills.</p>
-            <a href="../contact.html" class="btn btn-primary">Join Our Sessions</a>        </section>
 
         <!-- Upcoming Webinars Section -->
         <section class="upcoming-webinars-section">
@@ -185,10 +183,8 @@
                         </div>
                     </div>
                 </div>
-            </div>        </section>
+            </div>        </section>        <section id="webinar-benefits" class="container benefits-section">
-
+            <h2 class="section-heading gn-mobile-section-heading">Benefits of Our Webinars</h2><div class="benefits-cards-grid">
-        <section id="workshop-benefits" class="container benefits-section">
-            <h2 class="section-heading gn-mobile-section-heading">Benefits of Our Workshops</h2>            <div class="benefits-cards-grid">
                 <div class="benefit-card">
                     <div class="benefit-card-icon">
                         <i class="fas fa-laptop-code"></i>

Services/agentic-ai.html

@@ -71,11 +71,11 @@
   <link rel="stylesheet" href="../css/01-base-variables.css">
   <link rel="stylesheet" href="../css/02-layout-components.css">
   <link rel="stylesheet" href="../css/03-navigation-header.css">
-
   <!-- Content Styles -->
   <link rel="stylesheet" href="../css/04-hero-sections.css">
   <link rel="stylesheet" href="../css/05-technology-cards.css">
   <link rel="stylesheet" href="../css/06-forms-buttons.css">
+  <link rel="stylesheet" href="../css/overview-cards.css">
 
   <!-- Responsive & Effects - Load Last -->
   <link rel="stylesheet" href="../css/07-media-responsive.css">
@@ -170,11 +170,12 @@
       <h1>Empowering Autonomy with Agentic AI</h1>
       <p>Gyannetra pioneers Agentic AI solutions, developing intelligent, autonomous agents that perceive, reason, and act to achieve complex goals across diverse environments.</p>
       <a href="../contact.html" class="btn btn-primary">Deploy Intelligent Agents</a>
-    </section>
+    </section>    <section class="overview-section section-padding container">
-
-    <section class="overview-section section-padding container">
       <h2>OVERVIEW OF AGENTIC AI SERVICES</h2>
+      <div class="overview-card">
+          <h3>Autonomous Agents</h3>
           <p>Our Agentic AI services focus on creating sophisticated AI agents that can operate independently or collaboratively. We leverage advanced reinforcement learning, planning, and perception techniques to build agents capable of intelligent automation, autonomous decision-making, and providing interactive assistance, tailored to your specific industry needs.</p>
+      </div>
     </section>
     
     <section class="key-offerings-section section-padding container">

Services/automation-flows.html

@@ -71,11 +71,11 @@
   <link rel="stylesheet" href="../css/01-base-variables.css">
   <link rel="stylesheet" href="../css/02-layout-components.css">
   <link rel="stylesheet" href="../css/03-navigation-header.css">
-
   <!-- Content Styles -->
   <link rel="stylesheet" href="../css/04-hero-sections.css">
   <link rel="stylesheet" href="../css/05-technology-cards.css">
   <link rel="stylesheet" href="../css/06-forms-buttons.css">
+  <link rel="stylesheet" href="../css/overview-cards.css">
 
   <!-- Responsive & Effects - Load Last -->
   <link rel="stylesheet" href="../css/07-media-responsive.css">
@@ -170,11 +170,12 @@
       <h1>Intelligent Automation Flows</h1>
       <p>AI-powered automation solutions that optimize processes, enhance efficiency, and drive productivity.</p>
       <a href="../contact.html" class="btn btn-primary">Automate Your Processes</a>
-    </section>
+    </section>    <section class="overview-section section-padding container">
-
-    <section class="overview-section section-padding container">
       <h2>OVERVIEW OF AUTOMATION FLOW SERVICES</h2>
+      <div class="overview-card">
+          <h3>Intelligent Workflows</h3>
           <p>Our Automation Flow services are engineered to identify and automate repetitive, complex, and time-consuming tasks within your organization. We integrate AI and machine learning to create smart, adaptive automation solutions that go beyond traditional RPA, enabling intelligent decision-making, seamless system integration, and continuous process improvement for sustained operational excellence.</p>
+      </div>
     </section>
     
     <section class="key-offerings-section section-padding container">

Services/data-analysis.html

@@ -71,11 +71,11 @@
   <link rel="stylesheet" href="../css/01-base-variables.css">
   <link rel="stylesheet" href="../css/02-layout-components.css">
   <link rel="stylesheet" href="../css/03-navigation-header.css">
-
   <!-- Content Styles -->
   <link rel="stylesheet" href="../css/04-hero-sections.css">
   <link rel="stylesheet" href="../css/05-technology-cards.css">
   <link rel="stylesheet" href="../css/06-forms-buttons.css">
+  <link rel="stylesheet" href="../css/overview-cards.css">
 
   <!-- Responsive & Effects - Load Last -->
   <link rel="stylesheet" href="../css/07-media-responsive.css">
@@ -172,11 +172,12 @@
         <h1>Unveiling Insights with Data Analysis</h1>
         <p>Gyannetra empowers your business by transforming raw data into actionable intelligence. We help you understand trends, optimize performance, and make data-driven decisions with confidence and clarity.</p>
         <a href="../contact.html" class="btn btn-primary">Unlock Your Data's Potential</a>
-    </section>
+    </section>    <section class="overview-section section-padding container">
-
-    <section class="overview-section section-padding container">
         <h2>OVERVIEW OF DATA ANALYSIS SERVICES</h2>
+        <div class="overview-card">
+            <h3>Data Intelligence</h3>
             <p>At Gyannetra, our data analysis services are designed to help businesses of all sizes harness the power of their data. We offer a comprehensive suite of analytical capabilities, including descriptive, diagnostic, predictive, and prescriptive analytics. Our experts work closely with you to uncover hidden patterns, identify key trends, and extract meaningful insights that address your specific business challenges and drive performance improvements.</p>
+        </div>
     </section>
 
     <section class="key-offerings-section section-padding container">
@@ -249,11 +250,35 @@
                 </div>
                 <h3>Better Decision-Making</h3>
                 <p>Enhance decision-making capabilities across all levels of your organization with data-driven insights.</p>
+            </div>        </div>
+    </section>
+
+    <section class="blogs-case-studies-section section-padding container">
+      <h2>BLOGS & CASE STUDIES</h2>
+      <div class="articles-grid">
+        <div class="article-card">
+          <img src="../assets/data-visualization.svg" alt="Data Visualization Techniques Article Thumbnail" class="gn-responsive-image">
+          <h3>Modern Data Visualization Techniques for Decision Makers</h3>
+          <p>Explore the latest visualization methods that make complex data understandable and actionable for business leaders.</p>
+          <a href="../Industries/case-studies.html" class="read-more-link">Read Article</a>
+        </div>
+        <div class="article-card">
+          <img src="../assets/predictive-analytics-demand-forecasting.svg" alt="Retail Analytics Case Study" class="gn-responsive-image">
+          <h3>Case Study: Retail Analytics Transformation</h3>
+          <p>How our data analytics solution helped a retail chain optimize inventory and increase sales by 28% through advanced customer insights.</p>
+          <a href="../Industries/case-studies.html" class="read-more-link">View Case Study</a>
+        </div>
+        <div class="article-card">
+          <img src="../assets/insights-placeholder-1.svg" alt="Data Ethics Article Thumbnail" class="gn-responsive-image">
+          <h3>Ethics in Data Analysis: Balancing Insights and Privacy</h3>
+          <p>An in-depth look at navigating the ethical considerations of data analysis while maximizing business value.</p>
+          <a href="../Industries/case-studies.html" class="read-more-link">Explore Insights</a>
         </div>
       </div>
     </section>
+    
     <section class="related-content-section section-padding container">
-        <h2>EXPLORE OUR CAPABILITIES</h2>
+        <h2>EXPLORE OUR AI CAPABILITIES</h2>
         <div class="related-content-grid">
             <div class="related-content-item">
                 <img src="../assets/mlng.png" alt="Machine Learning Services" class="related-content-image" class="gn-responsive-image">

Services/generative-ai.html

@@ -71,11 +71,11 @@
   <link rel="stylesheet" href="../css/01-base-variables.css">
   <link rel="stylesheet" href="../css/02-layout-components.css">
   <link rel="stylesheet" href="../css/03-navigation-header.css">
-
   <!-- Content Styles -->
   <link rel="stylesheet" href="../css/04-hero-sections.css">
   <link rel="stylesheet" href="../css/05-technology-cards.css">
   <link rel="stylesheet" href="../css/06-forms-buttons.css">
+  <link rel="stylesheet" href="../css/overview-cards.css">
 
   <!-- Responsive & Effects - Load Last -->
   <link rel="stylesheet" href="../css/07-media-responsive.css">
@@ -170,11 +170,12 @@
         Gyannetra leads the charge in Generative AI, crafting bespoke solutions that redefine creativity, content generation, and problem-solving. Explore how we can transform your industry with intelligent, adaptive AI models.
       </p>
       <a href="#contact-form" class="btn btn-primary">Innovate with GenAI</a>
-    </section>
+    </section>    <section class="overview-section section-padding container">
-
-    <section class="overview-section section-padding container">
       <h2>OVERVIEW OF GENERATIVE AI SERVICES</h2>
-      <p>Use GANs, VAEs, and Transformers to create advanced Generative AI solutions for content creation, design, and data augmentation.</p>
+      <div class="overview-card">
+        <h3>Generative Intelligence</h3>
+        <p>Our Generative AI solutions leverage cutting-edge technologies like GANs, VAEs, and Transformer models to create original content including text, images, code, and designs. We help businesses revolutionize content creation, product development, and customer experiences through AI systems that generate high-quality, innovative outputs tailored to your specific industry needs and strategic goals.</p>
+      </div>
     </section>
     
     <section class="key-offerings-section section-padding container"> <!-- ADDED section-padding -->

Services/machine-learning.html

@@ -71,11 +71,11 @@
   <link rel="stylesheet" href="../css/01-base-variables.css">
   <link rel="stylesheet" href="../css/02-layout-components.css">
   <link rel="stylesheet" href="../css/03-navigation-header.css">
-
   <!-- Content Styles -->
   <link rel="stylesheet" href="../css/04-hero-sections.css">
   <link rel="stylesheet" href="../css/05-technology-cards.css">
   <link rel="stylesheet" href="../css/06-forms-buttons.css">
+  <link rel="stylesheet" href="../css/overview-cards.css">
 
   <!-- Responsive & Effects - Load Last -->
   <link rel="stylesheet" href="../css/07-media-responsive.css">
@@ -169,11 +169,12 @@
       <h1>Unlock Potential with Machine Learning</h1>
       <p>Gyannetra delivers cutting-edge Machine Learning solutions, enabling your business to predict trends, automate processes, and gain deeper insights from your data.</p>
       <a href="../contact.html" class="btn btn-primary">Harness ML Power</a>
-    </section>
+    </section>    <section class="overview-section section-padding container">
-
-    <section class="overview-section section-padding container">
       <h2>OVERVIEW OF MACHINE LEARNING SERVICES</h2>
+      <div class="overview-card">
+          <h3>Intelligent Solutions</h3>
           <p>We specialize in developing and deploying bespoke machine learning models that address your unique challenges. From predictive analytics and natural language processing to computer vision and deep learning, our expertise helps you transform data into a strategic asset, driving innovation and efficiency.</p>
+      </div>
     </section>
     
     <section class="key-offerings-section section-padding container">

about.html

@@ -308,9 +308,11 @@
             <li><strong>Innovate with integrity</strong>, ensuring transparency, ethics, and long-term value creation.</li>
           </ul>
         </div>
-      </div><div class="about-section">
+      </div>      <div class="about-section">        <h2>OUR JOURNEY</h2>
-        <h2>OUR JOURNEY</h2>
         <p>Gyannetra was founded in early 2024. Since our inception, we have focused on expanding our expertise and building strong relationships with partners across various industries.</p>
+        <div class="journey-image-container">
+          <img src="assets/Company Icons/GNPL_Journey.svg" alt="Gyannetra Journey Timeline" class="journey-image gn-responsive-image">
+        </div>
       </div>
     </section>
   </main>

css/02-layout-components.css

@@ -666,7 +666,7 @@ footer {
 }
 
 .footer-col .social-links a {
-    color: var(--text-muted);
+    color: var(--primary-color); /* Changed to primary color to match Contact Us icons */
     font-size: 1.6rem;
     text-decoration: none; /* Remove underlines from social media icons */
     transition: color 0.3s ease, transform 0.3s ease;
@@ -680,7 +680,7 @@ footer {
 }
 
 .footer-col .social-links a:hover {
-    color: var(--primary-color); /* Use primary color for hover */
+    color: #52eef5; /* Using cyan for hover to create a nice contrast effect */
     transform: translateY(-2px);
     background-color: rgba(var(--primary-color-rgb), 0.1);
 }
@@ -688,7 +688,7 @@ footer {
 .footer-bottom {
     text-align: center;
     padding-top: 20px;
-    border-top: 1px solid rgba(255, 255, 255, 0.1); /* Light border */
+    /* Removed the border-top that was creating the horizontal dividing grey line */
     font-size: 1.25rem;
 }
 

css/03-navigation-header.css

@@ -190,16 +190,17 @@
     background-color: #100732;
     border-radius: 8px;
     padding: 1rem;
-    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3);
+    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3), 0 0 30px rgba(82, 238, 245, 0.15);
     z-index: 1;
     top: 100%;
-    left: 0;
+    left: 0; /* Align with parent menu item */
     margin-top: 0.5rem;
     opacity: 0;
     visibility: hidden;
     transform: translateY(10px);
     transition: opacity 0.3s ease, transform 0.3s ease, margin-top 0.3s ease, visibility 0s linear 0.3s;
-    padding-top: 0.8rem;
+    padding-top: 1rem;
+    overflow: visible; /* Allow content overflow */
 }
 
 .dropdown-menu::before {
@@ -211,28 +212,48 @@
     height: 0.5rem;
 }
 
+/* Add a visual connection between parent menu and dropdown */
+.dropdown-menu::after {
+    content: '';
+    position: absolute;
+    top: -8px;
+    left: 25px; /* Position relative to parent menu item */
+    width: 16px;
+    height: 16px;
+    background-color: #100732;
+    transform: rotate(45deg);
+    z-index: -1;
+    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
+}
+
 .industries-dropdown {
-    grid-template-columns: repeat(3, 1fr);
+    grid-template-columns: repeat(2, 1fr);
-    min-width: 600px;
+    width: 700px;
+    max-width: calc(100vw - 40px); /* Prevent overflow outside viewport */
+    left: 0; /* Align with the parent menu item */
+    transform: none; /* Remove centering */
 }
 
 .services-dropdown {
     grid-template-columns: repeat(2, 1fr);
-    min-width: 450px;
+    width: 600px;
+    max-width: calc(100vw - 40px); /* Prevent overflow outside viewport */
+    left: 0; /* Align with the parent menu item */
+    transform: none; /* Remove centering */
 }
 
 .education-dropdown {
     grid-template-columns: 1fr;
-    min-width: 320px;
+    width: 400px;
+    max-width: calc(100vw - 40px); /* Prevent overflow outside viewport */
+    left: 0; /* Align with the parent menu item */
 }
 
-.dropdown:hover .industries-dropdown,
+.dropdown:hover .dropdown-menu {
-.dropdown:hover .services-dropdown,
-.dropdown:hover .education-dropdown {
     opacity: 1;
     visibility: visible;
-    transform: translateY(0);
     margin-top: 0;
+    transform: translateY(0);
     transition: opacity 0.3s ease, transform 0.3s ease, margin-top 0.3s ease, visibility 0s linear 0s;
 }
 
@@ -244,39 +265,66 @@
     text-decoration: none;
     color: var(--fg);
     display: block;
-    padding: 0.5rem;
+    padding: 0.4rem;
-    border-radius: 4px;
+    border-radius: 6px;
-    transition: background-color 0.3s ease;
+    transition: all 0.3s ease;
+    margin: 0.1rem;
+}
+
+/* Add gap between grid items */
+.dropdown-menu {
+    gap: 0.5rem;
+    row-gap: 0.8rem;
 }
 
 .dropdown-menu a:hover {
-    background-color: rgba(255, 255, 255, 0.1);
+    background-color: rgba(82, 238, 245, 0.1);
+    transform: translateY(-2px);
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
+}
+
+.dropdown-menu a:hover .item-title {
+    color: #52eef5;
 }
 
 .dropdown-item-content {
     display: flex;
     align-items: center;
+    padding: 6px;
+    transition: all 0.2s ease;
+    border-radius: 6px;
 }
 
 .dropdown-icon {
-    width: 24px;
+    width: 20px;
-    height: 24px;
+    height: 20px;
-    margin-right: 0.8rem;
+    margin-right: 0.6rem;
     flex-shrink: 0;
 }
 
 .text-content {
     display: flex;
     flex-direction: column;
+    width: 100%;
+    overflow: visible; /* Allow text to be fully visible */
 }
 
 .item-title {
-    font-size: 1.15rem;
+    font-size: 1rem;
+    margin-bottom: 4px;
+    white-space: normal;
+    font-weight: 600;
+    color: #fff;
 }
 
 .item-description {
-    font-size: 0.95rem;
+    font-size: 0.8rem;
     opacity: 0.8;
+    line-height: 1.3;
+    /* Show full description, no truncation */
+    white-space: normal;
+    overflow: visible;
+    display: block;
 }
 
 .dropdown-menu h1,
@@ -335,6 +383,51 @@
     background: #52eef5;
 }
 
+/* ===== RESPONSIVE DROPDOWN ADJUSTMENTS ===== */
+@media (max-width: 1200px) {
+    .industries-dropdown {
+        grid-template-columns: repeat(2, 1fr);
+        width: 650px;
+    }
+    
+    .services-dropdown {
+        grid-template-columns: repeat(2, 1fr);
+        width: 550px;
+    }
+    
+    .item-description {
+        font-size: 0.75rem;
+    }
+}
+
+@media (max-width: 992px) {
+    .industries-dropdown {
+        grid-template-columns: repeat(2, 1fr);
+        width: 550px;
+    }
+    
+    .services-dropdown {
+        grid-template-columns: repeat(2, 1fr);
+        width: 500px;
+    }
+    
+    .education-dropdown {
+        width: 380px;
+    }
+    
+    /* For dropdowns near right edge of screen, push them left */
+    .dropdown:last-child .dropdown-menu,
+    .dropdown:nth-last-child(2) .dropdown-menu {
+        left: auto;
+        right: 0;
+    }
+    
+    /* Ensure dropdown content fits within its container */
+    .dropdown-item-content {
+        padding: 5px;
+    }
+}
+
 /* ===== MOBILE NAVIGATION ===== */
 @media (max-width: 768px) {
     .navbar {

css/04-hero-sections.css

@@ -36,7 +36,8 @@
     position: relative;
     z-index: 20;
     flex: 1;
-    max-width: 800px;
+    width: 100%; /* Full width */
+    max-width: 1200px; /* Increased max-width to accommodate typewriter */
     text-align: center;
     display: flex;
     flex-direction: column;
@@ -82,6 +83,10 @@
 /* ===== HERO TYPEWRITER SECTION ===== */
 .hero-typewriter-section {
     margin: 0.2rem 0;
+    width: 100%; /* Full width */
+    display: flex;
+    flex-direction: column;
+    align-items: center;
 }
 
 .hero-subheading {
@@ -93,17 +98,18 @@
 }
 
 .typewriter-container {
-    font-size: 3rem;
+    font-size: 4.5rem;
     color: #52eef5;
     font-weight: 100;
     text-align: center;
-    min-height: 3.8rem;
+    min-height: 4.8rem; /* Increased to accommodate larger font size */
-    min-width: 90%;
+    width: 100%; /* Full width container */
+    max-width: 100%; /* Ensure it doesn't exceed viewport width */
     display: flex;
     align-items: center;
     justify-content: center;
     margin-bottom: 0.4rem;
-    padding: 0.2rem 1rem;
+    padding: 0.2rem 0; /* Reduced horizontal padding */
     line-height: 1.0;
 }
 
@@ -120,6 +126,8 @@
 .typewriter-text {
     display: inline-block;
     position: relative;
+    white-space: normal; /* Allow text to wrap if needed */
+    overflow-wrap: break-word; /* Break words to prevent overflow */
 }
 
 .cursor {

css/05-technology-cards.css

@@ -50,7 +50,7 @@
 
 .tech-cards-track {
     display: flex;
-    animation: techCardsFlow 75s linear infinite;
+    animation: techCardsFlow 50s linear infinite; /* Changed from 75s to 50s to make it 1.5x faster */
     will-change: transform;
     gap: 70px;
 }
@@ -460,6 +460,14 @@
     background-color: rgba(255, 255, 255, 0.95) !important;
 }
 
+/* Fix icon alignment for specific technologies */
+.tech-icon.pytorch,
+.tech-icon.langchain {
+    margin-top: 15px;
+    background-position: center center;
+    transform: translateY(5px);
+}
+
 /* ===== TECH SHADOWS ===== */
 .tech-shadow {
     position: absolute;

css/06-forms-buttons.css

@@ -159,20 +159,43 @@ div[style*="text-align: center"] {
 /* ===== SPECIALIZED BUTTONS ===== */
 .btn-book-consultation {
     display: inline-block;
-    padding: 0.8rem 1.5rem;
-    background: linear-gradient(90deg, #5a6bff 0%, #a2b0ff 100%);
-    border: none;
-    border-radius: 8px;
-    color: white;
     text-decoration: none;
-    font-size: 1.2rem;
+    padding: 14px 28px;
+    border-radius: 8px;
+    letter-spacing: 1px;
+    text-transform: uppercase;
+    position: relative;
+    overflow: hidden;
     transition: all 0.3s ease;
+    cursor: pointer;
+    text-align: center;
+    color: #ffffff;
+    font-size: 1rem;
+    border: 2px solid rgba(255, 255, 255, 0.2);
+    box-shadow: 0 6px 20px rgba(var(--primary-color-rgb), 0.3);
+    background: linear-gradient(135deg, var(--primary-color), var(--primary-color-hover));
+}
+
+.btn-book-consultation:before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: -100%;
+    width: 100%;
+    height: 100%;
+    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
+    transition: all 0.8s ease;
+    z-index: -1;
 }
 
 .btn-book-consultation:hover {
-    background: linear-gradient(90deg, #6d7dff 0%, #b5c0ff 100%);
+    transform: translateY(-3px) scale(1.02);
-    transform: translateY(-2px);
+    box-shadow: 0 15px 25px -10px rgba(var(--primary-color-rgb), 0.6);
-    box-shadow: 0 8px 25px rgba(90, 107, 255, 0.4);
+    background: linear-gradient(135deg, var(--primary-color-hover), var(--primary-color));
+}
+
+.btn-book-consultation:hover:before {
+    left: 100%;
 }
 
 .btn-discuss-project {

css/09-about-page.css

@@ -50,6 +50,29 @@
     transition: left 0.5s ease;
 }
 
+/* Journey image styling */
+.journey-image-container {
+    margin-top: 3rem;
+    text-align: center;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
+.journey-image {
+    max-width: 100%;
+    height: auto;
+    border-radius: 12px;
+    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
+    border: 1px solid rgba(82, 238, 245, 0.3);
+    transition: transform 0.3s ease, box-shadow 0.3s ease;
+}
+
+.journey-image:hover {
+    transform: translateY(-5px);
+    box-shadow: 0 12px 32px rgba(82, 238, 245, 0.2);
+}
+
 .about-section:hover::before {
     left: 100%;
 }
@@ -155,7 +178,7 @@
 }
 
 .mission h2, .vision h2 {
-    font-size: 2rem;
+    font-size: 2.5rem; /* Updated to match the heading size of What We Do section */
     margin-bottom: 1rem;
     text-align: center;
 }
@@ -163,7 +186,7 @@
 .mission p, .vision p {
     text-align: center;
     margin-bottom: 1rem;
-    font-size: 1.1rem;
+    font-size: 1.3rem; /* Updated to match the body font size of What We Do section */
 }
 
 .vision p {
@@ -185,7 +208,7 @@
     margin-bottom: 1rem;
     padding-left: 1.5rem;
     position: relative;
-    font-size: 1.1rem;
+    font-size: 1.3rem; /* Updated to match the body font size of What We Do section */
     line-height: 1.6;
 }
 

css/card-heading-divider.css

@@ -38,14 +38,12 @@
 .industry-card h3::after {
   content: '';
   position: absolute;
-  bottom: 0;
+  bottom: -10px;
-  left: 50%;
+  left: 0;
-  transform: translateX(-50%);
+  width: 100%;
-  width: 60px;
+  height: 3px;
-  height: 2px;
+  background: linear-gradient(90deg, #52eef5, transparent);
-  background: linear-gradient(90deg, rgba(82, 238, 245, 0.2), rgba(82, 238, 245, 1), rgba(82, 238, 245, 0.2));
   border-radius: 2px;
-  box-shadow: 0 0 8px rgba(82, 238, 245, 0.5);
 }
 
 /* Responsive adjustments for smaller screens */
@@ -66,6 +64,6 @@
   .webinar-main-card h3::after,
   .service-card h3::after,
   .industry-card h3::after {
-    width: 40px;
+    height: 2px;
   }
 }

css/overview-cards.css

@@ -0,0 +1,104 @@
+/* Overview Cards for Service Pages */
+.overview-cards-container {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
+    gap: 2rem;
+    margin: 2.5rem auto;
+    max-width: 1200px;
+}
+
+.overview-card {
+    background: rgba(20, 30, 50, 0.6);
+    border: 1px solid rgba(82, 238, 245, 0.2);
+    border-radius: 16px;
+    padding: 2.5rem 2rem;
+    text-align: center;
+    transition: all 0.4s ease;
+    position: relative;
+    overflow: hidden;
+    backdrop-filter: blur(15px);
+    -webkit-backdrop-filter: blur(15px);
+    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
+}
+
+.overview-card:hover {
+    transform: translateY(-10px);
+    border-color: rgba(82, 238, 245, 0.5);
+    box-shadow: 
+        0 20px 40px rgba(0, 0, 0, 0.4),
+        0 0 30px rgba(82, 238, 245, 0.2);
+}
+
+.overview-card::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: -100%;
+    width: 100%;
+    height: 100%;
+    background: linear-gradient(90deg, transparent, rgba(82, 238, 245, 0.1), transparent);
+    transition: left 0.6s ease;
+}
+
+.overview-card:hover::before {
+    left: 100%;
+}
+
+.overview-card h3 {
+    font-size: 1.8rem;
+    color: #52eef5;
+    margin-bottom: 1.5rem;
+    position: relative;
+    padding-bottom: 12px;
+}
+
+.overview-card h3::after {
+    content: '';
+    position: absolute;
+    bottom: 0;
+    left: 50%;
+    transform: translateX(-50%);
+    width: 60px;
+    height: 2px;
+    background: linear-gradient(90deg, rgba(82, 238, 245, 0.2), rgba(82, 238, 245, 1), rgba(82, 238, 245, 0.2));
+    border-radius: 2px;
+    box-shadow: 0 0 8px rgba(82, 238, 245, 0.5);
+}
+
+.overview-card p {
+    color: rgba(255, 255, 255, 0.9);
+    line-height: 1.7;
+    font-size: 1.2rem;
+}
+
+/* Responsive adjustments */
+@media (max-width: 1024px) {
+    .overview-cards-container {
+        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
+        gap: 1.5rem;
+    }
+}
+
+@media (max-width: 768px) {
+    .overview-cards-container {
+        grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+        gap: 1rem;
+    }
+      .overview-card {
+        padding: 2rem 1.5rem;
+    }
+    
+    .overview-card h3 {
+        font-size: 1.6rem;
+    }
+    
+    .overview-card p {
+        font-size: 1.1rem;
+    }
+}
+
+@media (max-width: 480px) {
+    .overview-cards-container {
+        grid-template-columns: 1fr;
+    }
+}

css/style.css

@@ -105,21 +105,39 @@
 .contact-page-container .widened-contact-info .btn-book-consultation {
     padding: 1rem 2.5rem !important;
     font-size: 1.2rem !important;
-    background: linear-gradient(135deg, #52eef5 0%, #667eea 50%, #764ba2 100%) !important;
+    background: linear-gradient(135deg, var(--primary-color), var(--primary-color-hover)) !important;
-    border: none !important;
+    border: 2px solid rgba(255, 255, 255, 0.2) !important;
     border-radius: 12px !important;
     color: #ffffff !important;
     text-decoration: none !important;
     text-transform: uppercase !important;
     letter-spacing: 1.5px !important;
     transition: all 0.3s ease !important;
-    box-shadow: 0 4px 16px rgba(82, 238, 245, 0.3) !important;
+    box-shadow: 0 6px 20px rgba(var(--primary-color-rgb), 0.3) !important;
+    position: relative !important;
+    overflow: hidden !important;
+}
+
+.contact-page-container .widened-contact-info .btn-book-consultation:before {
+    content: '' !important;
+    position: absolute !important;
+    top: 0 !important;
+    left: -100% !important;
+    width: 100% !important;
+    height: 100% !important;
+    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent) !important;
+    transition: all 0.8s ease !important;
+    z-index: -1 !important;
 }
 
 .contact-page-container .widened-contact-info .btn-book-consultation:hover {
-    transform: translateY(-2px) !important;
+    transform: translateY(-3px) scale(1.02) !important;
-    box-shadow: 0 8px 25px rgba(82, 238, 245, 0.4) !important;
+    box-shadow: 0 15px 25px -10px rgba(var(--primary-color-rgb), 0.6) !important;
-    background: linear-gradient(135deg, #667eea 0%, #764ba2 50%, #52eef5 100%) !important;
+    background: linear-gradient(135deg, var(--primary-color-hover), var(--primary-color)) !important;
+}
+
+.contact-page-container .widened-contact-info .btn-book-consultation:hover:before {
+    left: 100% !important;
 }
 
 /* Responsive design for widened contact info */

css/testimonials.css

@@ -283,9 +283,9 @@
 /* Course Badge */
 .course-badge {
     display: inline-block;
-    background: linear-gradient(135deg, rgba(99, 102, 241, 0.2) 0%, rgba(139, 92, 246, 0.2) 100%);
+    background: rgba(255, 255, 255, 0.1);
-    border: 1px solid rgba(99, 102, 241, 0.3);
+    border: 1px solid rgba(255, 255, 255, 0.3);
-    color: #a2b0ff;
+    color: #ffffff;
     padding: 0.4rem 0.8rem;
     border-radius: 20px;
     font-size: 0.85rem;

index.html

@@ -185,8 +185,7 @@
   <section id="hero">
     <div class="hero-overlay"></div>
     <div class="hero-container" style="padding-top: 5vh;"> <!-- Added inline style to reduce top padding -->
-      <div class="hero-content">
+      <div class="hero-content">        <h1>We Turn Ideas Into AI-Powered Reality</h1>
-        <h1>We Turn Ideas Into AI-Powered Reality</h1>
         <div class="hero-typewriter-section">
           <p class="hero-subheading">We deliver</p>
           <div class="typewriter-container">
@@ -438,11 +437,10 @@
         <img src="assets/technology.png" alt="Technical Excellence Icon" />
         <h3 style="font-size: 1.8rem; line-height: 1.2; margin-top: 0.5rem; margin-bottom: 1.2rem; color: #52eef5; font-weight: 600; letter-spacing: 0.5px;">Tech Mastery</h3>
         <p class="exp-description">Our team combines deep technical expertise with practical experience to build robust, scalable AI systems.</p>
-      </div>
+      </div>        <div class="exp-item">
-        <div class="exp-item">
         <img src="assets/analytics (1).png" alt="Results Driven Icon" />
         <h3 style="font-size: 1.8rem; line-height: 1.2; margin-top: 0.5rem; margin-bottom: 1.2rem; color: #52eef5; font-weight: 600; letter-spacing: 0.5px;">Results Driven</h3>
-        <p class="exp-description">We focus on delivering measurable business impact through AI solutions that drive real value and ROI.</p>
+        <p class="exp-description">We deliver measurable business impact through AI solutions that generate real value and maximize ROI.</p>
       </div>
       
       <div class="exp-item">