<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="Pioneering smart city solutions and innovative financial technology across Africa and the Middle East. Discover how AHT is transforming urban spaces and digital transactions in Sudan, Libya, Rwanda and the UAE.">
<meta name="author" content="A H T Information Technology">
<!-- Open Graph meta tags for social media sharing -->
<meta property="og:title" content="A H T - Smart City & FinTech Innovations">
<meta property="og:description" content="Pioneering smart city solutions and innovative financial technology across Africa and the Middle East. Discover how AHT is transforming urban spaces and digital transactions in Sudan, Libya, Rwanda and the UAE.">
<meta property="og:image" content="https://dabary.s3.ap-northeast-1.amazonaws.com/share.png">
<meta property="og:url" content="https://www.alrefqa.io/">
<meta property="og:site_name" content="alrefqa.io">
<meta property="og:type" content="website">
<meta property="og:image:width" content="2560">
<meta property="og:image:height" content="1600">
<meta property="og:image:type" content="image/png">
<link rel="icon" href="images/alrefqa_logo.png" type="image/x-icon" />
<title>A H T | Smart City & FinTech Solutions</title>
<!-- CSS FILES -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Outfit:wght@100;200;400;700&display=swap" rel="stylesheet">
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/bootstrap-icons.css" rel="stylesheet">
<link href="css/templatemo-festava-live.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<link href="css/smartcity.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
<link href="css/final-touches.css" rel="stylesheet">
<link href="css/smartcity-enhanced.css" rel="stylesheet">
<link href="css/about-revolution.css" rel="stylesheet">
<link href="css/smartcity-enhanced-updated.css" rel="stylesheet">
<!-- Other meta tags, stylesheets, and scripts go here -->
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=KoHo:wght@400;500&display=swap" rel="stylesheet">
<script type="text/javascript" src="https://cdn.emailjs.com/dist/email.min.js"></script>
<script type="text/javascript">
/*
(function() {
emailjs.init("31uo2ob8WWivJ8NLT"); // Replace with your EmailJS user ID
})();
*/
</script>
<!-- Meta theme color for mobile browsers -->
<meta name="theme-color" content="#b28361">
</head>
<body>
<!-- Page Loader -->
<div class="page-loader">
<div class="loader-circle"></div>
</div>
<!-- Back To Top Button -->
<div class="back-to-top">
<i class="fas fa-arrow-up"></i>
</div>
<main>
<nav class="navbar navbar-expand-lg">
<div class="container">
<a class="navbar-brand" href="index.html">
<img src="images/aht.png" height="50" width="120"/>
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav align-items-lg-center ms-auto me-lg-5">
<li class="nav-item">
<a class="nav-link click-scroll" href="#section_1">Home</a>
</li>
<li class="nav-item">
<a class="nav-link click-scroll" href="#section_2">About Us</a>
</li>
<li class="nav-item">
<a class="nav-link click-scroll" href="#section_3">Services</a>
</li>
<li class="nav-item">
<a class="nav-link click-scroll" href="#section_4">Portfolio</a>
</li>
<li class="nav-item">
<a class="nav-link click-scroll" href="#section_5">Pricing</a>
</li>
<li class="nav-item">
<a class="nav-link click-scroll" href="#section_6">Contact</a>
</li>
</ul>
<div class="navbar-nav">
<a class="nav-link nav-lang" href="index_fr.html">FR</a>
<a class="nav-link nav-lang" href="index_am.html">አማ</a>
</div>
<a href="book_meeting.html" class="btn custom-btn d-lg-block d-none">Book a Meeting</a>
<a href="book_meeting.html" class="btn custom-btn d-lg-none mobile-only">Book a Meeting</a>
</div>
</div>
</nav>
<section class="hero-section" id="section_1">
<div class="section-overlay"></div>
<div class="container d-flex justify-content-center align-items-center">
<div class="row">
<div class="col-12 mt-auto mb-5 text-center">
<small>Transforming Cities & Finance with Technology</small>
<h1 class="text-white mb-5">Smart Cities, Smarter Solutions</h1>
<a class="btn custom-btn smoothscroll" href="#section_2">Discover Our Innovations</a>
</div>
<div id="hide_bot" class="col-lg-12 col-12 mt-auto d-flex flex-column flex-lg-row text-center">
</div>
</div>
</div>
<div class="video-wrap">
<video id="customVideo" autoplay loop muted playsinline class="custom-video" poster="">
<source src="video/vid.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
</div>
<script>
document.addEventListener('DOMContentLoaded', function () {
var video = document.getElementById('customVideo');
if (video.paused && video.currentTime <= 0) {
video.play().catch(function (error) {
console.error('Autoplay prevented:', error);
});
}
});
</script>
</section>
<!-- Revolutionized About Section -->
<section class="about-revolution-section" id="section_2">
<div class="about-pattern about-pattern-1"></div>
<div class="about-pattern about-pattern-2"></div>
<div class="container">
<div class="row">
<div class="col-lg-6 col-md-12">
<div class="about-content-wrap">
<h2 class="about-heading">Pioneering <span class="about-heading-highlight">Digital Transformation</span> Across Africa & Middle East</h2>
<h4 class="about-subheading">Local Expertise with Global Vision</h4>
<p class="about-text">
At AHT, we combine deep regional knowledge with cutting-edge technology to create solutions that address the unique challenges of emerging markets. Our implementations are transforming urban landscapes and financial ecosystems in Sudan, Libya, Rwanda, and the UAE.
</p>
<div class="about-features">
<div class="about-feature-item">
<div class="about-feature-icon">
<i class="fas fa-city"></i>
</div>
<div class="about-feature-text">Smart City Infrastructure</div>
</div>
<div class="about-feature-item">
<div class="about-feature-icon">
<i class="fas fa-exchange-alt"></i>
</div>
<div class="about-feature-text">FinTech Solutions</div>
</div>
<div class="about-feature-item">
<div class="about-feature-icon">
<i class="fas fa-mobile-alt"></i>
</div>
<div class="about-feature-text">Mobile-First Approach</div>
</div>
<div class="about-feature-item">
<div class="about-feature-icon">
<i class="fas fa-globe-africa"></i>
</div>
<div class="about-feature-text">Regional Expertise</div>
</div>
</div>
<div class="about-cta">
<a href="#section_3" class="btn custom-btn smoothscroll">Explore Our Solutions</a>
<a href="#section_6" class="text-link">Contact Us <i class="fas fa-arrow-right"></i></a>
</div>
</div>
</div>
<div class="col-lg-6 col-md-12">
<div class="about-image-wrap">
<img src="images/about.png" alt="Digital Transformation" class="about-main-image" >
<div class="about-floating-card about-card-1">
<div class="about-card-icon">
<i class="fas fa-chart-line"></i>
</div>
<div class="about-card-text">27+ Solutions</div>
<div class="about-card-subtext">Deployed Across 4 Countries</div>
</div>
<div class="about-floating-card about-card-2">
<div class="about-card-icon">
<i class="fas fa-handshake"></i>
</div>
<div class="about-card-text">Trusted Partner</div>
<div class="about-card-subtext">For Government & Enterprise</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section id="section_3">
<div id="services_section" class="services-section">
<div class="services-title">
<h2>Smart City & FinTech Solutions</h2>
<p class="section-subtitle">Building Tomorrow's Connected Communities</p>
</div>
<div class="services-grid">
<div class="service-box">
<i class="service-icon fas fa-city"></i>
<h3>Smart City Infrastructure</h3>
<div class="service-content">
<ul class="service-list">
<li>IoT-Enabled Public Services</li>
<li>Intelligent Traffic Management</li>
<li>Smart Utility Solutions</li>
</ul>
</div>
<a href="#section_4a" class="service-link">View Projects →</a>
</div>
<div class="service-box">
<i class="service-icon fas fa-exchange-alt"></i>
<h3>Fintech Solutions</h3>
<div class="service-content">
<ul class="service-list">
<li>Remittance Systems</li>
<li>Digital Payment Platforms</li>
<li>Mobile Banking Integration</li>
</ul>
</div>
<a href="#section_4a" class="service-link">View Projects →</a>
</div>
<div class="service-box">
<i class="service-icon fas fa-building"></i>
<h3>Enterprise Solutions</h3>
<div class="service-content">
<ul class="service-list">
<li>Custom Software Development</li>
<li>IoT Analytics Platforms</li>
<li>Process Automation</li>
</ul>
</div>
<a href="#section_4a" class="service-link">View Projects →</a>
</div>
<div class="service-box">
<i class="service-icon fas fa-chart-bar"></i>
<h3>Data & Analytics</h3>
<div class="service-content">
<ul class="service-list">
<li>Urban Data Analytics</li>
<li>Predictive Maintenance</li>
<li>Custom Dashboards</li>
</ul>
</div>
<a href="#section_4a" class="service-link">View Projects →</a>
</div>
</div>
</div>
</section>
<!-- Updated Smart City Innovations Section with no percentage bars -->
<section class="smart-city-showcase section-padding" id="smart_city">
<div class="container">
<div class="row">
<div class="col-12 text-center mb-5">
<div class="section-header">
<h2>Smart City Innovations</h2>
<p class="section-subtitle">Building Connected, Efficient Urban Spaces</p>
</div>
</div>
</div>
<div class="innovation-grid mb-5">
<!-- Traffic Management Card -->
<div class="innovation-card">
<div class="innovation-icon-wrapper">
<i class="fas fa-traffic-light innovation-icon"></i>
</div>
<h3>Intelligent Traffic Management</h3>
<p>Our AI-powered traffic systems reduce congestion in urban areas through
real-time monitoring and adaptive signal control, improving commute times and reducing
emissions.</p>
<div class="impact-metric">
<div class="impact-icon">
<i class="fas fa-tachometer-alt"></i>
</div>
<div class="impact-text">
<div class="impact-title">Congestion Reduction</div>
<div class="impact-value">35% <span>improvement</span></div>
</div>
</div>
<div class="implementation-tag">
<i class="fas fa-map-marker-alt"></i> Implemented in: Khartoum, Sudan
</div>
</div>
<!-- Smart Energy Card -->
<div class="innovation-card">
<div class="innovation-icon-wrapper">
<i class="fas fa-solar-panel innovation-icon"></i>
</div>
<h3>Smart Energy Grid</h3>
<p>Our smart grid technology optimizes energy distribution, integrates renewable sources,
and enables demand-response capabilities that have increased grid efficiency in
pilot neighborhoods.</p>
<div class="impact-metric">
<div class="impact-icon">
<i class="fas fa-bolt"></i>
</div>
<div class="impact-text">
<div class="impact-title">Grid Efficiency</div>
<div class="impact-value">22% <span>increase</span></div>
</div>
</div>
<div class="implementation-tag">
<i class="fas fa-map-marker-alt"></i> Implemented in: Dubai, UAE
</div>
</div>
<!-- Water Management Card -->
<div class="innovation-card">
<div class="innovation-icon-wrapper">
<i class="fas fa-water innovation-icon"></i>
</div>
<h3>Water Management Systems</h3>
<p>Our IoT-enabled water infrastructure monitors quality, detects leaks, and optimizes
distribution, reducing water waste and improving access to clean water in
underserved communities.</p>
<div class="impact-metric">
<div class="impact-icon">
<i class="fas fa-fill-drip"></i>
</div>
<div class="impact-text">
<div class="impact-title">Water Conservation</div>
<div class="impact-value">28% <span>waste reduction</span></div>
</div>
</div>
<div class="implementation-tag">
<i class="fas fa-map-marker-alt"></i> Implemented in: Kigali, Rwanda
</div>
</div>
<!-- Public Safety Card -->
<div class="innovation-card">
<div class="innovation-icon-wrapper">
<i class="fas fa-shield-alt innovation-icon"></i>
</div>
<h3>Public Safety Network</h3>
<p>Our integrated emergency response system connects law enforcement, medical services,
and fire departments through a unified platform, reducing emergency response times
for better public safety.</p>
<div class="impact-metric">
<div class="impact-icon">
<i class="fas fa-ambulance"></i>
</div>
<div class="impact-text">
<div class="impact-title">Emergency Response</div>
<div class="impact-value">40% <span>faster</span></div>
</div>
</div>
<div class="implementation-tag">
<i class="fas fa-map-marker-alt"></i> Implemented in: Tripoli, Libya
</div>
</div>
</div>
<div class="row">
<div class="col-12 text-center smart-city-cta">
<a href="#section_6" class="btn custom-btn btn-with-icon">
<i class="fas fa-lightbulb"></i> Request Smart City Consultation
</a>
</div>
</div>
</div>
</section>
<section class="portfolio-section section-padding" id="section_4a">
<div class="container">
<div class="row">
<div class="col-12 text-center">
<h2 class="mb-4">Our Portfolio</h2>
<p class="mb-5">Discover our latest innovations and implementations</p>
</div>
</div>
<div class="row mb-5">
<div class="col-12 text-center">
<div class="portfolio-filters">
<button class="filter-btn active" data-filter="all">All</button>
<button class="filter-btn" data-filter="smartcity">Smart City</button>
<button class="filter-btn" data-filter="fintech">FinTech</button>
<button class="filter-btn" data-filter="web">Websites</button>
<button class="filter-btn" data-filter="mobile">Mobile Apps</button>
<button class="filter-btn" data-filter="ecommerce">E-Commerce</button>
<button class="filter-btn" data-filter="dashboard">Dashboards</button>
<button class="filter-btn" data-filter="enterprise">Enterprise</button>
</div>
</div>
</div>
<div class="row portfolio-grid">
<!-- Featured Smart City & FinTech Projects -->
<div class="col-lg-4 col-md-6 mb-4 portfolio-item" data-categories="fintech mobile">
<div class="portfolio-card">
<img src="images/telebirr-remit-app.webp" alt="Digital Payment Platform" class="img-fluid">
<div class="portfolio-overlay">
<h4>Sudan Digital Payments</h4>
<p>Comprehensive payment solution for Sudan's banking sector</p>
<a href="#featured_project" class="btn custom-btn-sm">View Details</a>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 mb-4 portfolio-item" data-categories="smartcity enterprise">
<div class="portfolio-card">
<img src="images/1.avif" alt="Smart Traffic System" class="img-fluid">
<div class="portfolio-overlay">
<h4>Khartoum Traffic Management</h4>
<p>AI-powered traffic control system for urban areas</p>
<a href="#smart_city" class="btn custom-btn-sm">View Details</a>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 mb-4 portfolio-item" data-categories="smartcity enterprise">
<div class="portfolio-card">
<img src="images/2.avif" alt="Smart Grid" class="img-fluid">
<div class="portfolio-overlay">
<h4>Dubai Smart Energy Grid</h4>
<p>Next-generation power distribution network</p>
<a href="#smart_city" class="btn custom-btn-sm">View Details</a>
</div>
</div>
</div>
<!-- Original Website Projects -->
<div class="col-lg-4 col-md-6 mb-4 portfolio-item" data-categories="web enterprise">
<div class="portfolio-card">
<img src="images/portfolio/web1.png" alt="Company Website" class="img-fluid">
<div class="portfolio-overlay">
<h4>Company Website</h4>
<p>Modern product oriented business solution</p>
<a href="https://www.jaddid.ae/" class="btn custom-btn-sm">View Project</a>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 mb-4 portfolio-item" data-categories="web enterprise">
<div class="portfolio-card">
<img src="images/portfolio/web2.png" alt="AI Events Solution" class="img-fluid">
<div class="portfolio-overlay">
<h4>AI Based Events Solution</h4>
<p>Computer Vision system to identify event attendees</p>
<a href="https://spono.ai/" class="btn custom-btn-sm">View Project</a>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 mb-4 portfolio-item" data-categories="web enterprise">
<div class="portfolio-card">
<img src="images/portfolio/web4.png" alt="Logistics Website" class="img-fluid">
<div class="portfolio-overlay">
<h4>Logistics Website</h4>
<p>Streamlined data flow platform for medical professionals</p>
<a href="https://www.sudaflow.com/" class="btn custom-btn-sm">View Project</a>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 mb-4 portfolio-item" data-categories="web enterprise">
<div class="portfolio-card">
<img src="images/portfolio/web3.png" alt="E-Training Platform" class="img-fluid">
<div class="portfolio-overlay">
<h4>E-Training Platform</h4>
<p>Comprehensive online learning platform with diverse courses</p>
<a href="https://training.udwud.com/" class="btn custom-btn-sm">View Project</a>
</div>
</div>
</div>
<!-- Original Mobile App & E-commerce Projects -->
<div class="col-lg-4 col-md-6 mb-4 portfolio-item" data-categories="mobile enterprise">
<div class="portfolio-card">
<img src="images/portfolio/app1.png" alt="Social Platform" class="img-fluid">
<div class="portfolio-overlay">
<h4>Social Platform</h4>
<p>iOS & Android platform for coaches and health specialists</p>
<div class="app-store-links">
<a href="https://apps.apple.com/ae/app/al-taga/id6738932561"><i class="fab fa-apple"></i></a>
<a href="https://play.google.com/store/apps/datasafety?id=com.altaga.platform"><i class="fab fa-google-play"></i></a>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 mb-4 portfolio-item" data-categories="ecommerce mobile">
<div class="portfolio-card">
<img src="images/portfolio/ecom1.png" alt="Fashion Store" class="img-fluid">
<div class="portfolio-overlay">
<h4>Fashion Store</h4>
<p>End-to-End marketplace for latest fashions</p>
<div class="app-store-links">
<a href="https://apps.apple.com/ae/app/merath/id6475197140"><i class="fab fa-apple"></i></a>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 mb-4 portfolio-item" data-categories="mobile ecommerce">
<div class="portfolio-card">
<img src="images/portfolio/ecom2.png" alt="Used items marketplace" class="img-fluid">
<div class="portfolio-overlay">
<h4>Used Items Marketplace</h4>
<p>Mobile platform for buying and selling second-hand goods</p>
<div class="app-store-links">
<a href="#"><i class="fab fa-apple"></i></a>
<a href="#"><i class="fab fa-google-play"></i></a>
</div>
</div>
</div>
</div>
<!-- Original Dashboard & Analytics Projects -->
<div class="col-lg-4 col-md-6 mb-4 portfolio-item" data-categories="dashboard enterprise">
<div class="portfolio-card">
<img src="images/portfolio/dash1.png" alt="Analytics Dashboard" class="img-fluid">
<div class="portfolio-overlay">
<h4>Analytics Dashboard</h4>
<p>Real-time data visualization platform</p>
<a href="#" class="btn custom-btn-sm">View Demo</a>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 mb-4 portfolio-item" data-categories="enterprise dashboard">
<div class="portfolio-card">
<img src="images/portfolio/dash2.png" alt="Business Intelligence Suite" class="img-fluid">
<div class="portfolio-overlay">
<h4>Business Intelligence Suite</h4>
<p>Enterprise analytics platform with advanced reporting</p>
<a href="#" class="btn custom-btn-sm">Learn More</a>
</div>
</div>
</div>
<!-- Update Water Management Project -->
<div class="col-lg-4 col-md-6 mb-4 portfolio-item" data-categories="smartcity enterprise">
<div class="portfolio-card">
<img src="images/Water-management.png" alt="Water Management System" class="img-fluid">
<div class="portfolio-overlay">
<h4>Rwanda Water Management</h4>
<p>IoT-enabled infrastructure for conservation and distribution</p>
<a href="#smart_city" class="btn custom-btn-sm">View Details</a>
</div>
</div>
</div>
</div>
<div class="row mt-5">
<div class="col-12 text-center">
<a href="#section_6" class="btn custom-btn">Start Your Project</a>
</div>
</div>
</div>
</section>
<section class="pricing-section section-padding" id="section_5">
<div class="container">
<div class="col-12 text-center">
<h2 class="mb-4">Solution Packages</h2>
<p class="section-subtitle">Tailored solutions to meet your business needs</p>
<div class="package-selector mb-5">
<button class="selector-btn active" data-type="website">Website</button>
<button class="selector-btn" data-type="mobile">Mobile Apps</button>
<button class="selector-btn" data-type="smartcity">Smart City</button>
<button class="selector-btn" data-type="fintech">FinTech</button>
<button class="selector-btn" data-type="analytics">Data Analytics</button>
<button class="selector-btn" data-type="enterprise">Enterprise Solutions</button>
</div>
<!-- Website Packages -->
<div class="package-group active" id="website-packages">
<div class="row justify-content-center">
<!-- Basic Package -->
<div class="col-lg-4 col-md-6">
<div class="pricing-thumb">
<div class="pricing-header">
<i class="fas fa-globe pricing-icon"></i>
<h3>Basic</h3>
<div class="price">
<span class="custom-quote">Contact for Quote</span>
</div>
</div>
<ul class="pricing-features">
<li><i class="fas fa-check"></i> Up to 5 Pages</li>
<li><i class="fas fa-check"></i> Responsive Design</li>
<li><i class="fas fa-check"></i> Basic SEO Setup</li>
<li><i class="fas fa-check"></i> Contact Form</li>
<li><i class="fas fa-check"></i> Social Media Integration</li>
<li><i class="fas fa-check"></i> Google Analytics Integration</li>
<li><i class="fas fa-check"></i> 3 Months Support</li>
</ul>
<div class="pricing-action">
<a href="#section_6" class="btn custom-btn">Get Quote</a>
<span class="delivery-time">Delivery: 2-3 weeks</span>
</div>
</div>
</div>
<!-- Business Package -->
<div class="col-lg-4 col-md-6">
<div class="pricing-thumb highlighted-plan">
<div class="popular-tag">Most Popular</div>
<div class="pricing-header">
<i class="fas fa-star pricing-icon"></i>
<h3>Business</h3>
<div class="price">
<span class="custom-quote">Contact for Quote</span>
</div>
</div>
<ul class="pricing-features">
<li><i class="fas fa-check"></i> Up to 10 Pages</li>
<li><i class="fas fa-check"></i> Premium Responsive Design</li>
<li><i class="fas fa-check"></i> Advanced SEO Optimization</li>
<li><i class="fas fa-check"></i> Custom Contact Forms</li>
<li><i class="fas fa-check"></i> CMS Integration</li>
<li><i class="fas fa-check"></i> Blog Setup</li>
<li><i class="fas fa-check"></i> Newsletter Integration</li>
<li><i class="fas fa-check"></i> 6 Months Support</li>
</ul>
<div class="pricing-action">
<a href="#section_6" class="btn custom-btn">Get Quote</a>
<span class="delivery-time">Delivery: 4-6 weeks</span>
</div>
</div>
</div>
<!-- Enterprise Package -->
<div class="col-lg-4 col-md-6">
<div class="pricing-thumb">
<div class="pricing-header">
<i class="fas fa-rocket pricing-icon"></i>
<h3>Enterprise</h3>
<div class="price">
<span class="custom-quote">Customized Solution</span>
</div>
</div>
<ul class="pricing-features">
<li><i class="fas fa-check"></i> Unlimited Pages</li>
<li><i class="fas fa-check"></i> Custom Design & Development</li>
<li><i class="fas fa-check"></i> E-commerce Functionality</li>
<li><i class="fas fa-check"></i> Custom API Integrations</li>
<li><i class="fas fa-check"></i> Advanced Analytics</li>
<li><i class="fas fa-check"></i> Multi-language Support</li>
<li><i class="fas fa-check"></i> Payment Gateway Integration</li>
<li><i class="fas fa-check"></i> 12 Months Priority Support</li>
</ul>
<div class="pricing-action">
<a href="#section_6" class="btn custom-btn">Request Consultation</a>
<span class="delivery-time">Custom Timeline</span>
</div>
</div>
</div>
</div>
</div>
<!-- Mobile Apps Packages -->
<div class="package-group" id="mobile-packages">
<div class="row justify-content-center">
<!-- Basic Mobile App Package -->
<div class="col-lg-4 col-md-6">
<div class="pricing-thumb">
<div class="pricing-header">
<i class="fas fa-mobile-alt pricing-icon"></i>
<h3>Starter App</h3>
<div class="price">
<span class="custom-quote">Contact for Quote</span>
</div>
</div>
<ul class="pricing-features">
<li><i class="fas fa-check"></i> Single Platform (iOS/Android)</li>
<li><i class="fas fa-check"></i> Basic UI/UX Design</li>
<li><i class="fas fa-check"></i> Core Features Implementation</li>
<li><i class="fas fa-check"></i> User Authentication</li>
<li><i class="fas fa-check"></i> Push Notifications</li>
<li><i class="fas fa-check"></i> App Store Submission</li>
<li><i class="fas fa-check"></i> 3 Months Support</li>
</ul>
<div class="pricing-action">
<a href="#section_6" class="btn custom-btn">Get Quote</a>
<span class="delivery-time">Delivery: 2-3 months</span>
</div>
</div>
</div>
<!-- Professional Mobile App Package -->
<div class="col-lg-4 col-md-6">
<div class="pricing-thumb highlighted-plan">
<div class="popular-tag">Most Popular</div>
<div class="pricing-header">
<i class="fas fa-mobile-alt pricing-icon"></i>
<h3>Professional App</h3>
<div class="price">
<span class="custom-quote">Contact for Quote</span>
</div>
</div>
<ul class="pricing-features">
<li><i class="fas fa-check"></i> Cross-Platform Development</li>
<li><i class="fas fa-check"></i> Advanced UI/UX Design</li>
<li><i class="fas fa-check"></i> Extended Feature Set</li>
<li><i class="fas fa-check"></i> API Integration</li>
<li><i class="fas fa-check"></i> Social Media Integration</li>
<li><i class="fas fa-check"></i> Analytics Implementation</li>
<li><i class="fas fa-check"></i> App Store Optimization</li>
<li><i class="fas fa-check"></i> 6 Months Support</li>
</ul>
<div class="pricing-action">
<a href="#section_6" class="btn custom-btn">Get Quote</a>
<span class="delivery-time">Delivery: 3-5 months</span>
</div>
</div>
</div>
<!-- Enterprise Mobile App Package -->
<div class="col-lg-4 col-md-6">
<div class="pricing-thumb">
<div class="pricing-header">
<i class="fas fa-rocket pricing-icon"></i>
<h3>Enterprise App</h3>
<div class="price">
<span class="custom-quote">Customized Solution</span>
</div>
</div>
<ul class="pricing-features">
<li><i class="fas fa-check"></i> Native Development</li>
<li><i class="fas fa-check"></i> Premium UI/UX Design</li>
<li><i class="fas fa-check"></i> Complex Feature Implementation</li>
<li><i class="fas fa-check"></i> Payment Gateway Integration</li>
<li><i class="fas fa-check"></i> Custom Backend Development</li>
<li><i class="fas fa-check"></i> Advanced Security Features</li>
<li><i class="fas fa-check"></i> Scalable Architecture</li>
<li><i class="fas fa-check"></i> 12 Months Priority Support</li>
</ul>
<div class="pricing-action">
<a href="#section_6" class="btn custom-btn">Request Consultation</a>
<span class="delivery-time">Custom Timeline</span>
</div>
</div>
</div>
</div>
</div>
<!-- Smart City Packages -->
<div class="package-group" id="smartcity-packages">
<div class="row justify-content-center">
<!-- Smart City Basic Package -->
<div class="col-lg-4 col-md-6">
<div class="pricing-thumb">
<div class="pricing-header">
<i class="fas fa-city pricing-icon"></i>
<h3>Pilot Solution</h3>
<div class="price">
<span class="custom-quote">Contact for Quote</span>
</div>
</div>
<ul class="pricing-features">
<li><i class="fas fa-check"></i> Single Smart City Component</li>
<li><i class="fas fa-check"></i> IoT Sensors Integration</li>
<li><i class="fas fa-check"></i> Basic Data Collection</li>
<li><i class="fas fa-check"></i> Dashboard for Monitoring</li>
<li><i class="fas fa-check"></i> Proof of Concept Implementation</li>
<li><i class="fas fa-check"></i> Basic Training Sessions</li>
<li><i class="fas fa-check"></i> 6 Months Support</li>
</ul>
<div class="pricing-action">
<a href="#section_6" class="btn custom-btn">Get Quote</a>
<span class="delivery-time">Delivery: 3-6 months</span>
</div>
</div>
</div>
<!-- Smart City Intermediate Package -->
<div class="col-lg-4 col-md-6">
<div class="pricing-thumb highlighted-plan">
<div class="popular-tag">Most Popular</div>
<div class="pricing-header">
<i class="fas fa-traffic-light pricing-icon"></i>
<h3>District Solution</h3>
<div class="price">
<span class="custom-quote">Contact for Quote</span>
</div>
</div>
<ul class="pricing-features">
<li><i class="fas fa-check"></i> Multiple Smart City Components</li>
<li><i class="fas fa-check"></i> Advanced IoT Network</li>
<li><i class="fas fa-check"></i> Real-time Data Analytics</li>
<li><i class="fas fa-check"></i> Interactive Dashboards</li>
<li><i class="fas fa-check"></i> Mobile App Integration</li>
<li><i class="fas fa-check"></i> Comprehensive Training</li>
<li><i class="fas fa-check"></i> Implementation Support</li>
<li><i class="fas fa-check"></i> 12 Months Maintenance</li>
</ul>
<div class="pricing-action">
<a href="#section_6" class="btn custom-btn">Get Quote</a>
<span class="delivery-time">Delivery: 6-12 months</span>
</div>
</div>
</div>
<!-- Smart City Advanced Package -->
<div class="col-lg-4 col-md-6">
<div class="pricing-thumb">
<div class="pricing-header">
<i class="fas fa-rocket pricing-icon"></i>
<h3>City-wide Solution</h3>
<div class="price">
<span class="custom-quote">Customized Solution</span>
</div>
</div>
<ul class="pricing-features">
<li><i class="fas fa-check"></i> Comprehensive Smart City Platform</li>
<li><i class="fas fa-check"></i> City-wide IoT Infrastructure</li>
<li><i class="fas fa-check"></i> AI-Powered Analytics</li>
<li><i class="fas fa-check"></i> Predictive Maintenance</li>
<li><i class="fas fa-check"></i> Citizen Engagement Tools</li>
<li><i class="fas fa-check"></i> Emergency Response Integration</li>
<li><i class="fas fa-check"></i> Custom APIs & Integrations</li>
<li><i class="fas fa-check"></i> Long-term Partnership Program</li>
</ul>
<div class="pricing-action">
<a href="#section_6" class="btn custom-btn">Request Consultation</a>
<span class="delivery-time">Custom Timeline</span>
</div>
</div>
</div>
</div>
</div>
<!-- FinTech Packages -->
<div class="package-group" id="fintech-packages">
<div class="row justify-content-center">
<!-- FinTech Basic Package -->
<div class="col-lg-4 col-md-6">
<div class="pricing-thumb">
<div class="pricing-header">
<i class="fas fa-exchange-alt pricing-icon"></i>
<h3>Starter FinTech</h3>
<div class="price">
<span class="custom-quote">Contact for Quote</span>
</div>
</div>
<ul class="pricing-features">
<li><i class="fas fa-check"></i> Basic Payment Processing</li>
<li><i class="fas fa-check"></i> User Authentication</li>
<li><i class="fas fa-check"></i> Transaction History</li>
<li><i class="fas fa-check"></i> Basic Security Features</li>
<li><i class="fas fa-check"></i> Mobile App Integration</li>
<li><i class="fas fa-check"></i> Standard Compliance</li>
<li><i class="fas fa-check"></i> 6 Months Support</li>
</ul>
<div class="pricing-action">
<a href="#section_6" class="btn custom-btn">Get Quote</a>
<span class="delivery-time">Delivery: 3-6 months</span>
</div>
</div>
</div>
<!-- FinTech Professional Package -->
<div class="col-lg-4 col-md-6">
<div class="pricing-thumb highlighted-plan">
<div class="popular-tag">Most Popular</div>
<div class="pricing-header">
<i class="fas fa-credit-card pricing-icon"></i>
<h3>Advanced FinTech</h3>
<div class="price">
<span class="custom-quote">Contact for Quote</span>
</div>
</div>
<ul class="pricing-features">
<li><i class="fas fa-check"></i> Multi-currency Support</li>
<li><i class="fas fa-check"></i> Advanced Payment Processing</li>
<li><i class="fas fa-check"></i> Secure Authentication</li>
<li><i class="fas fa-check"></i> Fraud Detection System</li>
<li><i class="fas fa-check"></i> Bank API Integration</li>
<li><i class="fas fa-check"></i> Detailed Reporting</li>
<li><i class="fas fa-check"></i> Cross-platform Accessibility</li>
<li><i class="fas fa-check"></i> 12 Months Support</li>
</ul>
<div class="pricing-action">
<a href="#section_6" class="btn custom-btn">Get Quote</a>
<span class="delivery-time">Delivery: 6-9 months</span>
</div>
</div>
</div>
<!-- FinTech Advanced Package -->
<div class="col-lg-4 col-md-6">
<div class="pricing-thumb">
<div class="pricing-header">
<i class="fas fa-rocket pricing-icon"></i>
<h3>Enterprise FinTech</h3>
<div class="price">
<span class="custom-quote">Customized Solution</span>
</div>
</div>
<ul class="pricing-features">
<li><i class="fas fa-check"></i> Complete Financial Platform</li>
<li><i class="fas fa-check"></i> Cross-border Transactions</li>
<li><i class="fas fa-check"></i> AI-powered Risk Management</li>
<li><i class="fas fa-check"></i> Blockchain Integration</li>
<li><i class="fas fa-check"></i> Customized Security Protocols</li>
<li><i class="fas fa-check"></i> Regulatory Compliance Management</li>
<li><i class="fas fa-check"></i> Advanced Analytics & Reporting</li>
<li><i class="fas fa-check"></i> Dedicated Support Team</li>
</ul>
<div class="pricing-action">
<a href="#section_6" class="btn custom-btn">Request Consultation</a>
<span class="delivery-time">Custom Timeline</span>
</div>
</div>
</div>
</div>
</div>
<!-- Data Analytics Packages -->
<div class="package-group" id="analytics-packages">
<div class="row justify-content-center">
<!-- Data Analytics Basic Package -->
<div class="col-lg-4 col-md-6">
<div class="pricing-thumb">
<div class="pricing-header">
<i class="fas fa-chart-line pricing-icon"></i>
<h3>Basic Analytics</h3>
<div class="price">
<span class="custom-quote">Contact for Quote</span>
</div>
</div>
<ul class="pricing-features">
<li><i class="fas fa-check"></i> Basic Data Visualization</li>
<li><i class="fas fa-check"></i> Standard Reports</li>
<li><i class="fas fa-check"></i> Data Cleaning Services</li>
<li><i class="fas fa-check"></i> Dashboard Integration</li>
<li><i class="fas fa-check"></i> Data Import/Export</li>
<li><i class="fas fa-check"></i> Basic User Training</li>
<li><i class="fas fa-check"></i> 3 Months Support</li>
</ul>
<div class="pricing-action">
<a href="#section_6" class="btn custom-btn">Get Quote</a>
<span class="delivery-time">Delivery: 2-3 weeks</span>
</div>
</div>
</div>
<!-- Data Analytics Professional Package -->
<div class="col-lg-4 col-md-6">
<div class="pricing-thumb highlighted-plan">
<div class="popular-tag">Most Popular</div>
<div class="pricing-header">
<i class="fas fa-chart-bar pricing-icon"></i>
<h3>Advanced Analytics</h3>
<div class="price">
<span class="custom-quote">Contact for Quote</span>
</div>
</div>
<ul class="pricing-features">
<li><i class="fas fa-check"></i> Advanced Data Visualization</li>
<li><i class="fas fa-check"></i> Custom Dashboards</li>
<li><i class="fas fa-check"></i> Real-time Analytics</li>
<li><i class="fas fa-check"></i> Automated Reporting</li>
<li><i class="fas fa-check"></i> Data Integration Services</li>
<li><i class="fas fa-check"></i> Trend Analysis</li>
<li><i class="fas fa-check"></i> Comprehensive Training</li>
<li><i class="fas fa-check"></i> 6 Months Support</li>
</ul>
<div class="pricing-action">
<a href="#section_6" class="btn custom-btn">Get Quote</a>
<span class="delivery-time">Delivery: 4-6 weeks</span>
</div>
</div>
</div>
<!-- Data Analytics Enterprise Package -->
<div class="col-lg-4 col-md-6">
<div class="pricing-thumb">
<div class="pricing-header">
<i class="fas fa-rocket pricing-icon"></i>
<h3>Enterprise Analytics</h3>
<div class="price">
<span class="custom-quote">Customized Solution</span>
</div>
</div>
<ul class="pricing-features">
<li><i class="fas fa-check"></i> Comprehensive Analytics Platform</li>
<li><i class="fas fa-check"></i> Predictive Analytics</li>
<li><i class="fas fa-check"></i> Machine Learning Integration</li>
<li><i class="fas fa-check"></i> Big Data Processing</li>
<li><i class="fas fa-check"></i> Custom API Development</li>
<li><i class="fas fa-check"></i> Advanced Data Mining</li>
<li><i class="fas fa-check"></i> Decision Support Systems</li>
<li><i class="fas fa-check"></i> 12 Months Support & Updates</li>
</ul>
<div class="pricing-action">
<a href="#section_6" class="btn custom-btn">Request Consultation</a>
<span class="delivery-time">Custom Timeline</span>
</div>
</div>
</div>
</div>
</div>
<!-- Enterprise Solutions Packages -->
<div class="package-group" id="enterprise-packages">
<div class="row justify-content-center">
<!-- Enterprise Starter Package -->
<div class="col-lg-4 col-md-6">
<div class="pricing-thumb">
<div class="pricing-header">
<i class="fas fa-building pricing-icon"></i>
<h3>Basic Enterprise</h3>
<div class="price">
<span class="custom-quote">Contact for Quote</span>
</div>
</div>
<ul class="pricing-features">
<li><i class="fas fa-check"></i> Basic ERP System</li>
<li><i class="fas fa-check"></i> Standard Modules</li>
<li><i class="fas fa-check"></i> User Management</li>
<li><i class="fas fa-check"></i> Basic Workflow Automation</li>
<li><i class="fas fa-check"></i> Data Migration</li>
<li><i class="fas fa-check"></i> User Training</li>
<li><i class="fas fa-check"></i> 6 Months Support</li>
</ul>
<div class="pricing-action">
<a href="#section_6" class="btn custom-btn">Get Quote</a>
<span class="delivery-time">Delivery: 3-4 months</span>
</div>
</div>
</div>
<!-- Enterprise Professional Package -->
<div class="col-lg-4 col-md-6">
<div class="pricing-thumb highlighted-plan">
<div class="popular-tag">Most Popular</div>
<div class="pricing-header">
<i class="fas fa-cogs pricing-icon"></i>
<h3>Advanced Enterprise</h3>
<div class="price">
<span class="custom-quote">Contact for Quote</span>
</div>
</div>
<ul class="pricing-features">
<li><i class="fas fa-check"></i> Comprehensive ERP System</li>
<li><i class="fas fa-check"></i> Custom Modules</li>
<li><i class="fas fa-check"></i> Advanced Integrations</li>
<li><i class="fas fa-check"></i> Workflow Automation</li>
<li><i class="fas fa-check"></i> Business Intelligence</li>
<li><i class="fas fa-check"></i> Mobile Access</li>
<li><i class="fas fa-check"></i> Extended Training Program</li>
<li><i class="fas fa-check"></i> 12 Months Support</li>
</ul>
<div class="pricing-action">
<a href="#section_6" class="btn custom-btn">Get Quote</a>
<span class="delivery-time">Delivery: 4-6 months</span>
</div>
</div>
</div>
<!-- Enterprise Ultimate Package -->
<div class="col-lg-4 col-md-6">
<div class="pricing-thumb">
<div class="pricing-header">
<i class="fas fa-rocket pricing-icon"></i>
<h3>Full Enterprise</h3>
<div class="price">
<span class="custom-quote">Customized Solution</span>
</div>
</div>
<ul class="pricing-features">
<li><i class="fas fa-check"></i> Fully Customized System</li>
<li><i class="fas fa-check"></i> Tailored Business Processes</li>
<li><i class="fas fa-check"></i> Complex Integrations</li>
<li><i class="fas fa-check"></i> Advanced Analytics</li>
<li><i class="fas fa-check"></i> AI-Powered Insights</li>
<li><i class="fas fa-check"></i> Scalable Architecture</li>
<li><i class="fas fa-check"></i> Dedicated Support Team</li>
<li><i class="fas fa-check"></i> Long-term Partnership</li>
</ul>
<div class="pricing-action">
<a href="#section_6" class="btn custom-btn">Request Consultation</a>
<span class="delivery-time">Custom Timeline</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="contact-section section-padding" id="section_6">
<div class="container">
<div class="row">
<div class="col-lg-8 col-12 mx-auto">
<h2 class="text-center mb-4">Let's Build Smarter Solutions Together</h2>
<nav class="d-flex justify-content-center">
<div class="nav nav-tabs align-items-baseline justify-content-center" id="nav-tab"
role="tablist">
<button class="nav-link active" id="nav-ContactForm-tab" data-bs-toggle="tab"
data-bs-target="#nav-ContactForm" type="button" role="tab"
aria-controls="nav-ContactForm" aria-selected="false">
<h5>Contact Form</h5>
</button>
<button class="nav-link" id="nav-ContactMap-tab" data-bs-toggle="tab"
data-bs-target="#nav-ContactMap" type="button" role="tab"
aria-controls="nav-ContactMap" aria-selected="false">
<h5>Our Locations</h5>
</button>
</div>
</nav>
<div class="tab-content shadow-lg mt-5" id="nav-tabContent">
<div class="tab-pane fade show active" id="nav-ContactForm" role="tabpanel"
aria-labelledby="nav-ContactForm-tab">
<form class="custom-form contact-form mb-5 mb-lg-0" method="post"
role="form">
<div class="contact-form-body">
<div class="row">
<div class="col-lg-6 col-md-6 col-12">
<input type="text" name="contact-name" id="contact-name"
class="form-control" placeholder="Full name" required>
</div>
<div class="col-lg-6 col-md-6 col-12">
<input type="email" name="contact-email" id="contact-email"
pattern="[^ @]*@[^ @]*" class="form-control"
placeholder="Email address" required>
</div>
</div>
<div class="form-group">
<h6>Choose Project Area</h6>
<select id="contact-select" class="form-control custom-select">
<option value="" disabled selected>Select your option</option>
<option value="smartcity">Smart City Solutions</option>
<option value="remittance">Remittance Technology</option>
<option value="mobile">Mobile Applications</option>
<option value="analytics">Data Analytics</option>
<option value="enterprise">Enterprise Solutions</option>
</select>
</div>
<input type="text" name="contact-company" id="contact-company"
class="form-control" placeholder="Company" required>
<textarea name="contact-message" rows="3" class="form-control"
id="contact-message" placeholder="Message"></textarea>
<div class="col-lg-4 col-md-10 col-8 mx-auto">
<button type="submit" class="form-control">Send message</button>
</div>
</div>
</form>
</div>
<div class="tab-pane fade" id="nav-ContactMap" role="tabpanel"
aria-labelledby="nav-ContactMap-tab">
<iframe class="google-map"
src="https://www.google.com/maps/embed?pb=!1m14!1m12!1m3!1d309.6616229125421!2d38.78094154254684!3d9.002918469785902!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!5e0!3m2!1sen!2sae!4v1711773645498!5m2!1sen!2sae"
width="100%" height="450" style="border:0;" allowfullscreen="" loading="lazy"
referrerpolicy="no-referrer-when-downgrade"></iframe>
</div>
</div>
</div>
</div>
</div>
</section>
</main>
<footer class="site-footer">
<div class="site-footer-top">
<div class="container">
<div class="row">
<div class="col-lg-6 col-12">
<img src="images/logo.png" />
</div>
<div class="col-lg-6 col-12 d-flex justify-content-lg-end align-items-center">
<ul class="social-icon d-flex justify-content-lg-end">
<li class="social-icon-item">
<a href="#" class="social-icon-link">
<span class="bi-twitter"></span>
</a>
</li>
<li class="social-icon-item">
<a href="#" class="social-icon-link">
<span class="bi-linkedin"></span>
</a>
</li>
<li class="social-icon-item">
<a href="#" class="social-icon-link">
<span class="bi-instagram"></span>
</a>
</li>
<li class="social-icon-item">
<a href="#" class="social-icon-link">
<span class="bi-facebook"></span>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="container">
<div class="row">
<div class="col-lg-6 col-12 mb-4 pb-2">
<h5 class="site-footer-title mb-3">Links</h5>
<ul class="site-footer-links">
<li class="site-footer-link-item">
<a href="#" class="site-footer-link">Home</a>
</li>
<li class="site-footer-link-item">
<a href="#" class="site-footer-link">About</a>
</li>
<li class="site-footer-link-item">
<a href="#" class="site-footer-link">Products</a>
</li>
<li class="site-footer-link-item">
<a href="#" class="site-footer-link">Services</a>
</li>
<li class="site-footer-link-item">
<a href="#" class="site-footer-link">Pricing</a>
</li>
<li class="site-footer-link-item">
<a href="#" class="site-footer-link">Contact</a>
</li>
</ul>
</div>
<div class="col-lg-3 col-md-6 col-12 mb-4 mb-lg-0">
<h5 class="site-footer-title mb-3">Have a question?</h5>
<p class="text-white d-flex mb-1 align-items-center">
<a href="tel:+251902937555" class="site-footer-link">
<i class="fas fa-phone"></i> +251 90 293 7555
</a>
</p>
<p class="text-white d-flex mb-1 align-items-center">
<a href="https://wa.me/251941694131" class="site-footer-link d-flex align-items-center" target="_blank" title="WhatsApp">
<i class="bi-whatsapp" style="color: #25D366; font-size: 1.2em;"></i>
+251 94 169 4131
</a>
</p>
<p class="text-white d-flex mb-1 align-items-center">
<a href="https://wa.me/251902937555" class="site-footer-link d-flex align-items-center" target="_blank" title="WhatsApp">
<i class="bi-whatsapp" style="color: #25D366; font-size: 1.2em;"></i>
+251 90 293 7555
</a>
</p>
<p class="text-white d-flex">
<a href="/cdn-cgi/l/email-protection#c0a9aea6af80a1a8b4eea5b4" class="site-footer-link">
<span class="__cf_email__" data-cfemail="e1888f878ea1808995cf8495">[email protected]</span>
</a>
</p>
</div>
<div class="col-lg-3 col-md-6 col-11 mb-4 mb-lg-0 mb-md-0">
<h5 class="site-footer-title mb-3">Location</h5>
<p class="text-white d-flex mt-3 mb-2">
011, Woreda 03 Bole, Addis Ababa</p>
</div>
</div>
</div>
<div class="site-footer-bottom">
<div class="container">
<div class="row">
<div class="col-lg-2"></div>
<div class="col-lg-3 col-12 mt-4">
<p class="copyright-text">Copyright © <span id="currentYear"></span> A H T</p>
<script data-cfasync="false" src="/cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script><script>
document.addEventListener('DOMContentLoaded', function() {
document.getElementById('currentYear').textContent = new Date().getFullYear();
});
</script>
</div>
<div class="col-lg-6 col-12 mt-lg-4">
<ul class="site-footer-links">
<li class="site-footer-link-item">
<a href="#" class="site-footer-link">Terms & Conditions</a>
</li>
<li class="site-footer-link-item">
<a href="#" class="site-footer-link">Privacy Policy</a>
</li>
<li class="site-footer-link-item">
<a href="#" class="site-footer-link">Your Feedback</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</footer>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.6/dist/umd/popper.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.min.js"></script>
<script src="js/jquery.sticky.js"></script>
<script src="js/click-scroll.js"></script>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@10"></script>
<script type="module">
$(document).ready(function() {
$('.custom-form').on('submit', function(event) {
event.preventDefault();
const formData = {
from_name: $('#contact-name').val(),
from_email: $('#contact-email').val(),
company: $('#contact-company').val(),
project_area: $('#contact-select').val(),
message: $('#contact-message').val()
};
Swal.fire({
title: 'Sending...',
allowOutsideClick: false,
didOpen: () => {
Swal.showLoading();
}
});
$.ajax({
url: '/sendEmail',
type: 'POST',
contentType: 'application/json',
data: JSON.stringify(formData),
success: function() {
Swal.fire({
icon: 'success',
title: 'Message Sent!',
text: 'Thank you for contacting us.',
});
$('.custom-form')[0].reset();
},
error: function() {
Swal.fire({
icon: 'error',
title: 'Oops...',
text: 'Failed to send message. Please try again later.',
});
}
});
});
});
</script>
<script>
document.addEventListener('DOMContentLoaded', function() {
// About section animations
function animateAboutSection() {
const elements = [
'.about-content-wrap',
'.about-image-wrap',
'.about-features',
'.about-cta'
];
const observer = new IntersectionObserver(entries => {
entries.forEach(entry => {
if (entry.isIntersecting) {
setTimeout(() => {
entry.target.classList.add('animated');
}, 200);
observer.unobserve(entry.target);
}
});
}, { threshold: 0.2 });
elements.forEach(selector => {
const element = document.querySelector(selector);
if (element) observer.observe(element);
});
}
animateAboutSection();
});
</script>
<script src="js/custom.js"></script>
<script src="js/portfolio-filter.js"></script>
<script src="js/statistics.js"></script>
<script src="js/pricing-selector.js"></script>
<script src="js/scroll-animations.js"></script>
</body>
</html>