mirror of
https://github.com/thecyberlearn/quantum-website-2026.git
synced 2026-08-18 07:43:20 +00:00
1434 lines
57 KiB
HTML
1434 lines
57 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="UTF-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||
<title>Quantum Tasks AI — AI & Cybersecurity Solutions</title>
|
||
<meta name="description" content="AI-powered automation, cybersecurity consulting, and digital branding for modern businesses. Based in Dubai, UAE." />
|
||
<!-- OpenGraph -->
|
||
<meta property="og:type" content="website" />
|
||
<meta property="og:site_name" content="Quantum Tasks AI" />
|
||
<meta property="og:title" content="Quantum Tasks AI — AI & Cybersecurity Solutions" />
|
||
<meta property="og:description" content="AI-powered automation, cybersecurity consulting, and digital branding for modern businesses. Based in Dubai, UAE." />
|
||
<meta property="og:url" content="https://quantumtaskai.com" />
|
||
<meta property="og:image" content="https://quantumtaskai.com/img/og-image.png" />
|
||
<meta property="og:image:width" content="1200" />
|
||
<meta property="og:image:height" content="630" />
|
||
<!-- Twitter Card -->
|
||
<meta name="twitter:card" content="summary_large_image" />
|
||
<meta name="twitter:title" content="Quantum Tasks AI — AI & Cybersecurity Solutions" />
|
||
<meta name="twitter:description" content="AI-powered automation, cybersecurity consulting, and digital branding for modern businesses. Based in Dubai, UAE." />
|
||
<meta name="twitter:image" content="https://quantumtaskai.com/img/og-image.png" />
|
||
<link rel="canonical" href="https://quantumtaskai.com" />
|
||
<link rel="icon" type="image/x-icon" href="img/favicon.ico" />
|
||
<link rel="apple-touch-icon" sizes="180x180" href="img/apple-touch-icon.png" />
|
||
<link rel="icon" type="image/png" sizes="32x32" href="img/favicon-32x32.png" />
|
||
<link rel="icon" type="image/png" sizes="16x16" href="img/favicon-16x16.png" />
|
||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap" rel="stylesheet" />
|
||
|
||
<style>
|
||
/* ── Reset ───────────────────────────────────────────── */
|
||
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
|
||
|
||
:root {
|
||
--navy: #0a0f1e;
|
||
--navy2: #111827;
|
||
--navy3: #1e293b;
|
||
--indigo: #6366f1;
|
||
--indigo2: #818cf8;
|
||
--violet: #a855f7;
|
||
--orange: #f97316;
|
||
--orange2: #fb923c;
|
||
--cyan: #06b6d4;
|
||
--green: #22c55e;
|
||
--white: #ffffff;
|
||
--gray50: #f8fafc;
|
||
--gray100: #f1f5f9;
|
||
--gray200: #e2e8f0;
|
||
--gray400: #94a3b8;
|
||
--gray500: #64748b;
|
||
--gray700: #334155;
|
||
--text: #0f172a;
|
||
--r: 12px;
|
||
--shadow: 0 4px 24px rgba(0,0,0,0.08);
|
||
--shadow-lg: 0 20px 60px rgba(0,0,0,0.14);
|
||
}
|
||
|
||
html { scroll-behavior: smooth; }
|
||
body {
|
||
font-family: 'Inter', system-ui, sans-serif;
|
||
color: var(--text);
|
||
background: var(--white);
|
||
line-height: 1.6;
|
||
-webkit-font-smoothing: antialiased;
|
||
overflow-x: hidden;
|
||
}
|
||
img { max-width: 100%; display: block; }
|
||
a { text-decoration: none; color: inherit; }
|
||
|
||
/* ── Utilities ───────────────────────────────────────── */
|
||
.container { max-width: 1160px; margin: 0 auto; padding: 0 24px; }
|
||
|
||
.section-label {
|
||
font-size: 12px; font-weight: 700;
|
||
letter-spacing: 0.12em; text-transform: uppercase;
|
||
color: var(--indigo); margin-bottom: 14px;
|
||
display: flex; align-items: center; gap: 8px;
|
||
}
|
||
.section-label::before {
|
||
content: ''; width: 20px; height: 2px;
|
||
background: var(--indigo); border-radius: 2px;
|
||
}
|
||
|
||
.section-title {
|
||
font-size: clamp(30px, 3.6vw, 46px);
|
||
font-weight: 800; line-height: 1.12;
|
||
color: var(--navy); letter-spacing: -0.025em;
|
||
}
|
||
.section-sub {
|
||
font-size: 17px; color: var(--gray500);
|
||
max-width: 540px; line-height: 1.75; margin-top: 12px;
|
||
}
|
||
|
||
/* Buttons */
|
||
.btn {
|
||
display: inline-flex; align-items: center; gap: 8px;
|
||
font-family: inherit; font-size: 15px; font-weight: 700;
|
||
padding: 13px 26px; border-radius: 10px; cursor: pointer;
|
||
border: none; transition: all .2s; white-space: nowrap;
|
||
position: relative; overflow: hidden;
|
||
}
|
||
.btn::after {
|
||
content: ''; position: absolute; inset: 0;
|
||
background: rgba(255,255,255,0); transition: background .2s;
|
||
}
|
||
.btn:hover::after { background: rgba(255,255,255,0.08); }
|
||
.btn:hover { transform: translateY(-2px); }
|
||
.btn:active { transform: translateY(0); }
|
||
|
||
.btn-primary {
|
||
background: linear-gradient(135deg, var(--orange), #ef4444);
|
||
color: var(--white);
|
||
box-shadow: 0 4px 20px rgba(249,115,22,0.4);
|
||
}
|
||
.btn-primary:hover { box-shadow: 0 8px 30px rgba(249,115,22,0.55); }
|
||
|
||
.btn-ghost {
|
||
background: rgba(255,255,255,0.08);
|
||
color: var(--white);
|
||
border: 1px solid rgba(255,255,255,0.18);
|
||
backdrop-filter: blur(8px);
|
||
}
|
||
.btn-ghost:hover { background: rgba(255,255,255,0.14); }
|
||
|
||
.btn-white {
|
||
background: var(--white); color: var(--navy);
|
||
box-shadow: 0 4px 16px rgba(0,0,0,0.12);
|
||
}
|
||
.btn-white:hover { box-shadow: 0 8px 28px rgba(0,0,0,0.18); }
|
||
|
||
/* ════════════════════════════════════════════ HERO */
|
||
.hero {
|
||
background: var(--navy);
|
||
position: relative; overflow: hidden;
|
||
padding: 100px 0 88px;
|
||
}
|
||
|
||
/* Animated gradient orbs */
|
||
.hero-orb {
|
||
position: absolute; border-radius: 50%;
|
||
filter: blur(80px); pointer-events: none;
|
||
}
|
||
.hero-orb-1 {
|
||
width: 700px; height: 700px;
|
||
background: radial-gradient(circle, rgba(99,102,241,0.3) 0%, transparent 65%);
|
||
top: -200px; left: -150px;
|
||
animation: orbFloat1 12s ease-in-out infinite;
|
||
}
|
||
.hero-orb-2 {
|
||
width: 500px; height: 500px;
|
||
background: radial-gradient(circle, rgba(168,85,247,0.2) 0%, transparent 65%);
|
||
bottom: -150px; right: 10%;
|
||
animation: orbFloat2 15s ease-in-out infinite;
|
||
}
|
||
.hero-orb-3 {
|
||
width: 300px; height: 300px;
|
||
background: radial-gradient(circle, rgba(249,115,22,0.18) 0%, transparent 65%);
|
||
top: 30%; right: 5%;
|
||
animation: orbFloat1 10s ease-in-out infinite reverse;
|
||
}
|
||
|
||
@keyframes orbFloat1 {
|
||
0%,100% { transform: translate(0,0); }
|
||
50% { transform: translate(30px, -40px); }
|
||
}
|
||
@keyframes orbFloat2 {
|
||
0%,100% { transform: translate(0,0); }
|
||
50% { transform: translate(-25px, 30px); }
|
||
}
|
||
|
||
/* Grid overlay */
|
||
.hero::before {
|
||
content: '';
|
||
position: absolute; inset: 0;
|
||
background-image:
|
||
linear-gradient(rgba(255,255,255,0.025) 1px, transparent 1px),
|
||
linear-gradient(90deg, rgba(255,255,255,0.025) 1px, transparent 1px);
|
||
background-size: 60px 60px;
|
||
pointer-events: none;
|
||
}
|
||
|
||
.hero-inner {
|
||
position: relative; z-index: 2;
|
||
display: grid;
|
||
grid-template-columns: 1fr 1fr;
|
||
gap: 72px; align-items: center;
|
||
}
|
||
|
||
/* Announcement pill */
|
||
.hero-pill {
|
||
display: inline-flex; align-items: center; gap: 10px;
|
||
background: rgba(99,102,241,0.12);
|
||
border: 1px solid rgba(99,102,241,0.3);
|
||
border-radius: 999px; padding: 6px 16px 6px 8px;
|
||
margin-bottom: 28px;
|
||
}
|
||
.hero-pill-badge {
|
||
background: var(--indigo); color: var(--white);
|
||
font-size: 10px; font-weight: 800;
|
||
letter-spacing: 0.08em; text-transform: uppercase;
|
||
padding: 3px 8px; border-radius: 999px;
|
||
}
|
||
.hero-pill-text {
|
||
font-size: 13px; font-weight: 500; color: var(--indigo2);
|
||
}
|
||
|
||
.hero-h1 {
|
||
font-size: clamp(40px, 5.5vw, 72px);
|
||
font-weight: 900; line-height: 1.06;
|
||
letter-spacing: -0.035em;
|
||
color: var(--white);
|
||
margin-bottom: 22px;
|
||
}
|
||
|
||
.hero-h1 .grad {
|
||
background: linear-gradient(135deg, #818cf8 0%, #c084fc 40%, #fb923c 80%);
|
||
-webkit-background-clip: text; -webkit-text-fill-color: transparent;
|
||
background-clip: text;
|
||
}
|
||
|
||
.hero-sub {
|
||
font-size: 17px; color: rgba(255,255,255,0.6);
|
||
line-height: 1.75; max-width: 460px; margin-bottom: 36px;
|
||
}
|
||
|
||
.hero-ctas { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 48px; }
|
||
|
||
/* Scrolling trust ticker */
|
||
.hero-trust {
|
||
display: flex; align-items: center; gap: 12px;
|
||
padding-top: 40px;
|
||
border-top: 1px solid rgba(255,255,255,0.08);
|
||
}
|
||
.hero-trust-label {
|
||
font-size: 12px; font-weight: 600;
|
||
color: rgba(255,255,255,0.35);
|
||
text-transform: uppercase; letter-spacing: 0.08em;
|
||
white-space: nowrap;
|
||
}
|
||
.hero-trust-items {
|
||
display: flex; gap: 24px; flex-wrap: wrap;
|
||
}
|
||
.hero-trust-item {
|
||
display: flex; align-items: center; gap: 6px;
|
||
font-size: 13px; font-weight: 600;
|
||
color: rgba(255,255,255,0.5);
|
||
}
|
||
.hero-trust-item .dot {
|
||
width: 6px; height: 6px; border-radius: 50%;
|
||
background: var(--green);
|
||
}
|
||
|
||
/* ─── Mockup ─── */
|
||
.hero-visual { position: relative; z-index: 2; }
|
||
|
||
.mockup-wrap {
|
||
position: relative;
|
||
filter: drop-shadow(0 40px 80px rgba(0,0,0,0.5));
|
||
}
|
||
|
||
.mockup {
|
||
background: rgba(15,23,42,0.8);
|
||
border: 1px solid rgba(255,255,255,0.1);
|
||
border-radius: 20px; padding: 0;
|
||
backdrop-filter: blur(20px);
|
||
overflow: hidden;
|
||
}
|
||
|
||
/* Window chrome */
|
||
.mockup-chrome {
|
||
background: rgba(255,255,255,0.04);
|
||
border-bottom: 1px solid rgba(255,255,255,0.06);
|
||
padding: 14px 20px;
|
||
display: flex; align-items: center; gap: 12px;
|
||
}
|
||
.chrome-dots { display: flex; gap: 6px; }
|
||
.chrome-dot {
|
||
width: 10px; height: 10px; border-radius: 50%;
|
||
}
|
||
.chrome-dot:nth-child(1) { background: #ef4444; }
|
||
.chrome-dot:nth-child(2) { background: #f59e0b; }
|
||
.chrome-dot:nth-child(3) { background: #22c55e; }
|
||
.chrome-url {
|
||
flex: 1; background: rgba(255,255,255,0.05);
|
||
border: 1px solid rgba(255,255,255,0.08);
|
||
border-radius: 6px; padding: 5px 12px;
|
||
font-size: 12px; color: rgba(255,255,255,0.3);
|
||
font-family: 'SF Mono', monospace;
|
||
}
|
||
|
||
/* Mockup body */
|
||
.mockup-body { padding: 24px; }
|
||
|
||
.audit-site-label {
|
||
font-size: 11px; font-weight: 700;
|
||
color: rgba(255,255,255,0.3);
|
||
text-transform: uppercase; letter-spacing: .1em;
|
||
margin-bottom: 18px;
|
||
display: flex; align-items: center; gap: 8px;
|
||
}
|
||
.audit-site-label::after {
|
||
content: 'LIVE'; font-size: 9px; font-weight: 800;
|
||
background: rgba(34,197,94,0.2); color: #22c55e;
|
||
border: 1px solid rgba(34,197,94,0.3);
|
||
padding: 2px 6px; border-radius: 4px;
|
||
}
|
||
|
||
.score-row {
|
||
display: flex; align-items: center;
|
||
justify-content: space-between;
|
||
padding: 11px 0;
|
||
border-bottom: 1px solid rgba(255,255,255,0.04);
|
||
}
|
||
.score-row:last-of-type { border-bottom: none; }
|
||
|
||
.score-left {
|
||
display: flex; align-items: center; gap: 10px;
|
||
font-size: 13px; color: rgba(255,255,255,0.65);
|
||
}
|
||
.score-ico {
|
||
width: 28px; height: 28px; border-radius: 7px;
|
||
display: flex; align-items: center; justify-content: center;
|
||
font-size: 13px;
|
||
}
|
||
|
||
.score-right {
|
||
display: flex; align-items: center; gap: 10px;
|
||
}
|
||
.score-bar {
|
||
width: 88px; height: 5px;
|
||
background: rgba(255,255,255,0.08); border-radius: 999px;
|
||
overflow: hidden;
|
||
}
|
||
.score-fill {
|
||
height: 100%; border-radius: 999px;
|
||
animation: fillBar 1.5s ease forwards;
|
||
}
|
||
@keyframes fillBar { from { width: 0; } }
|
||
|
||
.score-val {
|
||
font-size: 13px; font-weight: 800;
|
||
color: var(--white); width: 32px; text-align: right;
|
||
}
|
||
|
||
.mockup-insight {
|
||
margin-top: 20px;
|
||
background: rgba(99,102,241,0.12);
|
||
border: 1px solid rgba(99,102,241,0.2);
|
||
border-radius: 10px; padding: 14px 16px;
|
||
display: flex; align-items: center; justify-content: space-between;
|
||
}
|
||
.insight-text {
|
||
font-size: 13px; font-weight: 600; color: var(--indigo2);
|
||
}
|
||
.insight-action {
|
||
font-size: 11px; font-weight: 800;
|
||
background: var(--indigo); color: var(--white);
|
||
padding: 5px 12px; border-radius: 6px;
|
||
text-transform: uppercase; letter-spacing: .04em;
|
||
}
|
||
|
||
/* Floating badges */
|
||
.float-badge {
|
||
position: absolute;
|
||
background: var(--white); border-radius: 12px;
|
||
padding: 10px 16px; box-shadow: 0 12px 32px rgba(0,0,0,0.25);
|
||
display: flex; align-items: center; gap: 10px;
|
||
font-size: 13px; font-weight: 700; color: var(--navy);
|
||
z-index: 3; white-space: nowrap;
|
||
}
|
||
.float-badge .fb-icon {
|
||
width: 32px; height: 32px; border-radius: 8px;
|
||
display: flex; align-items: center; justify-content: center;
|
||
font-size: 15px;
|
||
}
|
||
.float-badge-left {
|
||
left: -44px; bottom: 100px;
|
||
animation: floatBadge 4s ease-in-out infinite;
|
||
}
|
||
.float-badge-right {
|
||
right: -28px; top: 80px;
|
||
animation: floatBadge 4s ease-in-out infinite .8s;
|
||
}
|
||
@keyframes floatBadge {
|
||
0%,100% { transform: translateY(0); }
|
||
50% { transform: translateY(-6px); }
|
||
}
|
||
|
||
/* ════════════════════════════════ MARQUEE STRIP */
|
||
.marquee-strip {
|
||
background: var(--navy2);
|
||
border-top: 1px solid rgba(255,255,255,0.06);
|
||
border-bottom: 1px solid rgba(255,255,255,0.06);
|
||
padding: 14px 0; overflow: hidden;
|
||
}
|
||
.marquee-track {
|
||
display: flex; gap: 0;
|
||
animation: marquee 28s linear infinite;
|
||
width: max-content;
|
||
}
|
||
.marquee-track:hover { animation-play-state: paused; }
|
||
|
||
@keyframes marquee {
|
||
from { transform: translateX(0); }
|
||
to { transform: translateX(-50%); }
|
||
}
|
||
|
||
.marquee-item {
|
||
display: flex; align-items: center; gap: 10px;
|
||
padding: 0 36px;
|
||
font-size: 13px; font-weight: 600;
|
||
color: rgba(255,255,255,0.4);
|
||
border-right: 1px solid rgba(255,255,255,0.08);
|
||
white-space: nowrap;
|
||
}
|
||
.marquee-item span { color: var(--indigo2); font-size: 15px; }
|
||
|
||
/* ════════════════════════════════ PROOF NUMBERS */
|
||
.proof {
|
||
background: var(--white);
|
||
padding: 72px 0;
|
||
border-bottom: 1px solid var(--gray100);
|
||
}
|
||
|
||
.proof-grid {
|
||
display: grid; grid-template-columns: repeat(4,1fr);
|
||
gap: 0;
|
||
}
|
||
|
||
.proof-item {
|
||
text-align: center; padding: 0 24px;
|
||
border-right: 1px solid var(--gray100);
|
||
position: relative;
|
||
}
|
||
.proof-item:last-child { border-right: none; }
|
||
|
||
.proof-num {
|
||
font-size: clamp(36px, 4vw, 52px);
|
||
font-weight: 900; letter-spacing: -0.04em;
|
||
background: linear-gradient(135deg, var(--navy) 0%, var(--indigo) 100%);
|
||
-webkit-background-clip: text; -webkit-text-fill-color: transparent;
|
||
background-clip: text;
|
||
line-height: 1; margin-bottom: 8px;
|
||
}
|
||
.proof-label {
|
||
font-size: 14px; font-weight: 600; color: var(--gray500);
|
||
}
|
||
.proof-sub {
|
||
font-size: 12px; color: var(--gray400); margin-top: 4px;
|
||
}
|
||
|
||
/* ════════════════════════════════ SERVICES */
|
||
.services {
|
||
background: var(--gray50); padding: 100px 0;
|
||
}
|
||
|
||
.services-header {
|
||
display: grid; grid-template-columns: 1fr auto;
|
||
align-items: end; margin-bottom: 56px; gap: 32px;
|
||
}
|
||
|
||
.services-grid {
|
||
display: grid;
|
||
grid-template-columns: repeat(3,1fr);
|
||
gap: 20px;
|
||
}
|
||
|
||
.svc-card {
|
||
background: var(--white);
|
||
border: 1px solid var(--gray200);
|
||
border-radius: 16px; padding: 30px;
|
||
transition: all .25s;
|
||
position: relative; overflow: hidden;
|
||
}
|
||
.svc-card::before {
|
||
content: ''; position: absolute;
|
||
top: 0; left: 0; right: 0; height: 0;
|
||
background: linear-gradient(135deg, var(--indigo), var(--violet));
|
||
transition: height .25s; opacity: 0.06;
|
||
}
|
||
.svc-card:hover { box-shadow: var(--shadow-lg); transform: translateY(-6px); border-color: transparent; }
|
||
.svc-card:hover::before { height: 100%; }
|
||
|
||
/* Featured card */
|
||
.svc-card.featured {
|
||
background: linear-gradient(135deg, var(--navy), #1a1040);
|
||
border-color: rgba(99,102,241,0.3);
|
||
color: var(--white);
|
||
}
|
||
.svc-card.featured::before { background: linear-gradient(135deg, var(--indigo), var(--violet)); opacity: 0.1; }
|
||
.svc-card.featured:hover { box-shadow: 0 20px 60px rgba(99,102,241,0.3); }
|
||
|
||
.svc-icon {
|
||
width: 48px; height: 48px; border-radius: 12px;
|
||
display: flex; align-items: center; justify-content: center;
|
||
font-size: 20px; margin-bottom: 18px;
|
||
}
|
||
|
||
.svc-title {
|
||
font-size: 17px; font-weight: 700;
|
||
color: var(--navy); margin-bottom: 10px;
|
||
}
|
||
.svc-card.featured .svc-title { color: var(--white); }
|
||
|
||
.svc-text {
|
||
font-size: 14px; color: var(--gray500); line-height: 1.7;
|
||
}
|
||
.svc-card.featured .svc-text { color: rgba(255,255,255,0.6); }
|
||
|
||
.svc-link {
|
||
display: inline-flex; align-items: center; gap: 6px;
|
||
font-size: 13px; font-weight: 700; color: var(--indigo);
|
||
margin-top: 18px; transition: gap .15s;
|
||
}
|
||
.svc-card.featured .svc-link { color: var(--indigo2); }
|
||
.svc-link:hover { gap: 10px; }
|
||
|
||
.svc-badge {
|
||
position: absolute; top: 18px; right: 18px;
|
||
font-size: 10px; font-weight: 800;
|
||
text-transform: uppercase; letter-spacing: .06em;
|
||
background: rgba(249,115,22,0.15); color: var(--orange);
|
||
border: 1px solid rgba(249,115,22,0.3);
|
||
padding: 3px 8px; border-radius: 6px;
|
||
}
|
||
|
||
/* ════════════════════════════════ DIFFERENTIATORS */
|
||
.why {
|
||
background: var(--white); padding: 100px 0;
|
||
}
|
||
|
||
.why-grid {
|
||
display: grid; grid-template-columns: 1fr 1fr;
|
||
gap: 56px; align-items: center; margin-top: 60px;
|
||
}
|
||
|
||
.why-list { display: flex; flex-direction: column; gap: 28px; }
|
||
|
||
.why-item {
|
||
display: flex; gap: 20px; align-items: flex-start;
|
||
}
|
||
|
||
.why-icon {
|
||
width: 44px; height: 44px; border-radius: 12px;
|
||
display: flex; align-items: center; justify-content: center;
|
||
font-size: 18px; flex-shrink: 0; margin-top: 2px;
|
||
}
|
||
|
||
.why-item-title {
|
||
font-size: 16px; font-weight: 700; color: var(--navy); margin-bottom: 6px;
|
||
}
|
||
.why-item-text { font-size: 14px; color: var(--gray500); line-height: 1.7; }
|
||
|
||
.why-visual {
|
||
background: linear-gradient(135deg, var(--navy) 0%, #1a0a2e 100%);
|
||
border-radius: 24px; padding: 40px;
|
||
position: relative; overflow: hidden;
|
||
}
|
||
.why-visual::before {
|
||
content: ''; position: absolute;
|
||
top: -60px; right: -60px;
|
||
width: 250px; height: 250px;
|
||
background: radial-gradient(circle, rgba(99,102,241,0.25), transparent 65%);
|
||
}
|
||
|
||
.why-stat-grid {
|
||
display: grid; grid-template-columns: 1fr 1fr; gap: 16px;
|
||
position: relative; z-index: 1;
|
||
}
|
||
|
||
.why-stat-card {
|
||
background: rgba(255,255,255,0.06);
|
||
border: 1px solid rgba(255,255,255,0.1);
|
||
border-radius: 14px; padding: 20px;
|
||
}
|
||
.why-stat-num {
|
||
font-size: 32px; font-weight: 900; letter-spacing: -0.03em;
|
||
background: linear-gradient(135deg, var(--white), var(--indigo2));
|
||
-webkit-background-clip: text; -webkit-text-fill-color: transparent;
|
||
background-clip: text; line-height: 1; margin-bottom: 6px;
|
||
}
|
||
.why-stat-label { font-size: 13px; color: rgba(255,255,255,0.5); font-weight: 500; }
|
||
|
||
.why-visual-badge {
|
||
margin-top: 20px; position: relative; z-index: 1;
|
||
background: rgba(249,115,22,0.12);
|
||
border: 1px solid rgba(249,115,22,0.25);
|
||
border-radius: 10px; padding: 14px 16px;
|
||
font-size: 14px; font-weight: 600; color: var(--orange2);
|
||
line-height: 1.5;
|
||
}
|
||
|
||
/* ════════════════════════════════ TESTIMONIAL */
|
||
.testimonials { background: var(--gray50); padding: 100px 0; }
|
||
|
||
.testimonials-header { text-align: center; margin-bottom: 56px; }
|
||
.testimonials-header .section-sub { margin: 12px auto 0; }
|
||
|
||
.t-grid {
|
||
display: grid; grid-template-columns: repeat(3,1fr); gap: 24px;
|
||
}
|
||
|
||
.t-card {
|
||
background: var(--white);
|
||
border: 1px solid var(--gray200);
|
||
border-radius: 16px; padding: 30px;
|
||
position: relative;
|
||
transition: box-shadow .2s, transform .2s;
|
||
}
|
||
.t-card:hover { box-shadow: var(--shadow-lg); transform: translateY(-4px); }
|
||
|
||
.t-quote {
|
||
font-size: 36px; line-height: 1;
|
||
color: var(--indigo); margin-bottom: 16px; font-family: Georgia, serif;
|
||
}
|
||
|
||
.t-text {
|
||
font-size: 15px; color: var(--gray700); line-height: 1.75;
|
||
margin-bottom: 24px; font-style: italic;
|
||
}
|
||
|
||
.t-author { display: flex; align-items: center; gap: 12px; }
|
||
.t-avatar {
|
||
width: 40px; height: 40px; border-radius: 50%;
|
||
display: flex; align-items: center; justify-content: center;
|
||
font-size: 15px; font-weight: 800; color: var(--white);
|
||
}
|
||
.t-name { font-size: 14px; font-weight: 700; color: var(--navy); }
|
||
.t-role { font-size: 12px; color: var(--gray400); margin-top: 2px; }
|
||
|
||
.t-stars {
|
||
position: absolute; top: 24px; right: 24px;
|
||
font-size: 13px; letter-spacing: 1px; color: #f59e0b;
|
||
}
|
||
|
||
/* ════════════════════════════════ CTA BANNER */
|
||
.cta-banner {
|
||
background: var(--navy); padding: 100px 0;
|
||
position: relative; overflow: hidden;
|
||
}
|
||
.cta-banner::before {
|
||
content: ''; position: absolute;
|
||
inset: 0;
|
||
background:
|
||
radial-gradient(ellipse at 30% 50%, rgba(99,102,241,0.2) 0%, transparent 60%),
|
||
radial-gradient(ellipse at 70% 50%, rgba(249,115,22,0.15) 0%, transparent 60%);
|
||
}
|
||
.cta-inner {
|
||
position: relative; z-index: 1; text-align: center;
|
||
}
|
||
.cta-pill {
|
||
display: inline-flex; align-items: center; gap: 8px;
|
||
background: rgba(34,197,94,0.12); border: 1px solid rgba(34,197,94,0.25);
|
||
border-radius: 999px; padding: 6px 16px; margin-bottom: 24px;
|
||
font-size: 13px; font-weight: 600; color: #4ade80;
|
||
}
|
||
.cta-pill-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--green); }
|
||
.cta-title {
|
||
font-size: clamp(30px, 4.5vw, 56px);
|
||
font-weight: 900; color: var(--white);
|
||
letter-spacing: -0.03em; margin-bottom: 16px; line-height: 1.1;
|
||
}
|
||
.cta-title .grad {
|
||
background: linear-gradient(135deg, var(--indigo2), var(--orange2));
|
||
-webkit-background-clip: text; -webkit-text-fill-color: transparent;
|
||
background-clip: text;
|
||
}
|
||
.cta-sub {
|
||
font-size: 17px; color: rgba(255,255,255,0.55);
|
||
max-width: 500px; margin: 0 auto 36px; line-height: 1.7;
|
||
}
|
||
.cta-buttons {
|
||
display: flex; gap: 14px; justify-content: center; flex-wrap: wrap;
|
||
}
|
||
.cta-note {
|
||
margin-top: 20px;
|
||
font-size: 13px; color: rgba(255,255,255,0.3);
|
||
}
|
||
|
||
/* ════════════════════════════════ CONTACT */
|
||
.contact { padding: 100px 0; background: var(--white); }
|
||
|
||
.contact-header { text-align: center; margin-bottom: 60px; }
|
||
.contact-header .section-sub { margin: 12px auto 0; }
|
||
|
||
.contact-grid {
|
||
display: grid; grid-template-columns: 1fr 1fr;
|
||
gap: 56px; align-items: start;
|
||
}
|
||
|
||
.form-card {
|
||
background: var(--white);
|
||
border: 1px solid var(--gray200);
|
||
border-radius: 20px; padding: 40px;
|
||
box-shadow: var(--shadow);
|
||
}
|
||
|
||
.form-title { font-size: 20px; font-weight: 800; color: var(--navy); margin-bottom: 28px; }
|
||
|
||
.form-group { margin-bottom: 18px; }
|
||
.form-label {
|
||
display: block; font-size: 13px; font-weight: 700;
|
||
color: var(--navy2); margin-bottom: 6px; letter-spacing: .01em;
|
||
}
|
||
.form-input, .form-textarea {
|
||
width: 100%; font-family: inherit; font-size: 15px;
|
||
color: var(--text); background: var(--gray50);
|
||
border: 1.5px solid var(--gray200);
|
||
border-radius: 10px; padding: 12px 14px;
|
||
transition: border-color .15s, box-shadow .15s; outline: none;
|
||
}
|
||
.form-input:focus, .form-textarea:focus {
|
||
border-color: var(--indigo);
|
||
box-shadow: 0 0 0 3px rgba(99,102,241,0.1);
|
||
}
|
||
.form-textarea { resize: vertical; min-height: 110px; }
|
||
|
||
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
|
||
|
||
.form-submit {
|
||
width: 100%; font-family: inherit; font-size: 15px; font-weight: 700;
|
||
color: var(--white);
|
||
background: linear-gradient(135deg, var(--orange), #ef4444);
|
||
border: none; border-radius: 10px; padding: 14px;
|
||
cursor: pointer; transition: all .2s;
|
||
box-shadow: 0 4px 20px rgba(249,115,22,0.35);
|
||
margin-top: 4px;
|
||
}
|
||
.form-submit:hover { transform: translateY(-2px); box-shadow: 0 8px 28px rgba(249,115,22,0.45); }
|
||
|
||
.contact-aside { padding-top: 8px; }
|
||
.contact-aside-title { font-size: 24px; font-weight: 800; color: var(--navy); margin-bottom: 8px; }
|
||
.contact-aside-sub { font-size: 15px; color: var(--gray500); margin-bottom: 36px; line-height: 1.6; }
|
||
|
||
.c-item { display: flex; gap: 16px; margin-bottom: 24px; align-items: flex-start; }
|
||
.c-icon {
|
||
width: 44px; height: 44px; border-radius: 12px;
|
||
background: var(--gray50); border: 1px solid var(--gray200);
|
||
display: flex; align-items: center; justify-content: center;
|
||
font-size: 18px; flex-shrink: 0;
|
||
}
|
||
.c-item h4 { font-size: 13px; font-weight: 700; color: var(--navy); margin-bottom: 4px; }
|
||
.c-item p, .c-item a { font-size: 15px; color: var(--gray500); line-height: 1.6; }
|
||
.c-item a:hover { color: var(--indigo); }
|
||
|
||
.c-promise {
|
||
margin-top: 36px; padding: 24px;
|
||
background: linear-gradient(135deg, rgba(99,102,241,0.06) 0%, rgba(168,85,247,0.06) 100%);
|
||
border: 1px solid rgba(99,102,241,0.15);
|
||
border-radius: 16px;
|
||
}
|
||
.c-promise-title { font-size: 15px; font-weight: 700; color: var(--navy); margin-bottom: 8px; }
|
||
.c-promise-text { font-size: 14px; color: var(--gray500); line-height: 1.65; }
|
||
|
||
/* ════════════════════════════════ FOOTER */
|
||
.footer { background: var(--navy); padding: 72px 0 32px; }
|
||
|
||
.footer-main {
|
||
display: grid; grid-template-columns: 2.2fr 1fr 1fr 1fr;
|
||
gap: 48px; margin-bottom: 56px;
|
||
}
|
||
|
||
.footer-logo-img {
|
||
height: 60px; width: auto; margin-bottom: 18px;
|
||
filter: brightness(0) invert(1); opacity: 0.8;
|
||
}
|
||
|
||
.footer-desc { font-size: 14px; color: rgba(255,255,255,0.65); line-height: 1.7; margin-bottom: 24px; }
|
||
|
||
.footer-contact-link {
|
||
display: flex; align-items: center; gap: 8px;
|
||
font-size: 13px; color: rgba(255,255,255,0.4);
|
||
margin-bottom: 8px; transition: color .15s;
|
||
}
|
||
.footer-contact-link:hover { color: var(--white); }
|
||
|
||
.footer-col-title {
|
||
font-size: 12px; font-weight: 700; text-transform: uppercase;
|
||
letter-spacing: .1em; color: var(--white); margin-bottom: 20px;
|
||
}
|
||
.footer-links { display: flex; flex-direction: column; gap: 10px; }
|
||
.footer-link { font-size: 14px; color: rgba(255,255,255,0.65); transition: color .15s; }
|
||
.footer-link:hover { color: var(--white); }
|
||
|
||
.footer-bottom {
|
||
display: flex; align-items: center; justify-content: space-between;
|
||
padding-top: 28px;
|
||
border-top: 1px solid rgba(255,255,255,0.08);
|
||
font-size: 13px; color: rgba(255,255,255,0.3);
|
||
}
|
||
.footer-bottom-links { display: flex; gap: 20px; }
|
||
|
||
/* ════════════════════════════════ RESPONSIVE */
|
||
@media (max-width: 1024px) {
|
||
.hero-inner { grid-template-columns: 1fr; gap: 56px; }
|
||
.hero-visual { display: none; }
|
||
.proof-grid { grid-template-columns: repeat(2,1fr); }
|
||
.proof-item:nth-child(2) { border-right: none; }
|
||
.proof-item:nth-child(3) { border-top: 1px solid var(--gray100); }
|
||
.proof-item:nth-child(4) { border-top: 1px solid var(--gray100); border-right: none; }
|
||
.services-grid { grid-template-columns: 1fr 1fr; }
|
||
.why-grid { grid-template-columns: 1fr; }
|
||
.t-grid { grid-template-columns: 1fr; }
|
||
.contact-grid { grid-template-columns: 1fr; }
|
||
.footer-main { grid-template-columns: 1fr 1fr; gap: 36px; }
|
||
}
|
||
|
||
@media (max-width: 768px) {
|
||
.hero { padding: 72px 0 64px; }
|
||
.hero-h1 { font-size: 38px; }
|
||
.services-header { grid-template-columns: 1fr; }
|
||
.services-grid { grid-template-columns: 1fr; }
|
||
.proof-grid { grid-template-columns: 1fr 1fr; }
|
||
.form-row { grid-template-columns: 1fr; }
|
||
.footer-main { grid-template-columns: 1fr; }
|
||
.footer-bottom { flex-direction: column; gap: 12px; text-align: center; }
|
||
.float-badge { display: none; }
|
||
.hero-trust-items { gap: 14px; }
|
||
}
|
||
</style>
|
||
|
||
<!-- JSON-LD Structured Data -->
|
||
<script type="application/ld+json">
|
||
{
|
||
"@context": "https://schema.org",
|
||
"@graph": [
|
||
{
|
||
"@type": "Organization",
|
||
"@id": "https://quantumtaskai.com/#organization",
|
||
"name": "Quantum Task AI LLC FZ",
|
||
"url": "https://quantumtaskai.com",
|
||
"logo": "https://quantumtaskai.com/img/logo.png",
|
||
"email": "abhay@quantumtaskai.com",
|
||
"foundingDate": "2023",
|
||
"description": "AI-powered automation, cybersecurity consulting, and digital branding for modern businesses.",
|
||
"address": {
|
||
"@type": "PostalAddress",
|
||
"streetAddress": "Meydan Grandstand, 6th floor, Meydan Road, Nad Al Sheba",
|
||
"addressLocality": "Dubai",
|
||
"addressCountry": "AE"
|
||
},
|
||
"sameAs": [
|
||
"https://blog.quantumtaskai.com",
|
||
"https://audit.quantumtaskai.com"
|
||
]
|
||
},
|
||
{
|
||
"@type": "LocalBusiness",
|
||
"@id": "https://quantumtaskai.com/#localbusiness",
|
||
"name": "Quantum Task AI LLC FZ",
|
||
"url": "https://quantumtaskai.com",
|
||
"image": "https://quantumtaskai.com/img/og-image.png",
|
||
"email": "abhay@quantumtaskai.com",
|
||
"priceRange": "$$",
|
||
"description": "AI-powered automation, cybersecurity consulting, and digital branding for modern businesses in Dubai and globally.",
|
||
"address": {
|
||
"@type": "PostalAddress",
|
||
"streetAddress": "Meydan Grandstand, 6th floor, Meydan Road, Nad Al Sheba",
|
||
"addressLocality": "Dubai",
|
||
"addressCountry": "AE"
|
||
},
|
||
"hasOfferCatalog": {
|
||
"@type": "OfferCatalog",
|
||
"name": "AI & Cybersecurity Services",
|
||
"itemListElement": [
|
||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Cybersecurity Consulting"}},
|
||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "AI Automation"}},
|
||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "AI Site Auditor"}},
|
||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "AI Digital Branding"}},
|
||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Rapid Response"}}
|
||
]
|
||
}
|
||
},
|
||
{
|
||
"@type": "WebSite",
|
||
"@id": "https://quantumtaskai.com/#website",
|
||
"url": "https://quantumtaskai.com",
|
||
"name": "Quantum Tasks AI",
|
||
"publisher": {"@id": "https://quantumtaskai.com/#organization"},
|
||
"potentialAction": {
|
||
"@type": "SearchAction",
|
||
"target": "https://blog.quantumtaskai.com/?s={search_term_string}",
|
||
"query-input": "required name=search_term_string"
|
||
}
|
||
}
|
||
]
|
||
}
|
||
</script>
|
||
</head>
|
||
<body>
|
||
|
||
<script src="/shared-header.js"></script>
|
||
|
||
<main id="main-content">
|
||
|
||
<!-- ══════════════════════════════════════════ HERO -->
|
||
<section class="hero">
|
||
<div class="hero-orb hero-orb-1"></div>
|
||
<div class="hero-orb hero-orb-2"></div>
|
||
<div class="hero-orb hero-orb-3"></div>
|
||
|
||
<div class="container">
|
||
<div class="hero-inner">
|
||
|
||
<!-- Copy side -->
|
||
<div>
|
||
<div class="hero-pill">
|
||
<span class="hero-pill-badge">New</span>
|
||
<span class="hero-pill-text">AI Site Auditor is live — free for a limited time</span>
|
||
</div>
|
||
|
||
<h1 class="hero-h1">
|
||
Stop Running Your<br>
|
||
Business on<br>
|
||
<span class="grad">Guesswork.</span>
|
||
</h1>
|
||
|
||
<p class="hero-sub">
|
||
AI-powered automation, cybersecurity, and digital growth — all in one place. We do the complex work so your business can move faster, safer, and smarter.
|
||
</p>
|
||
|
||
<div class="hero-ctas">
|
||
<a href="https://audit.quantumtaskai.com" class="btn btn-primary">
|
||
Get a Free AI Audit →
|
||
</a>
|
||
<a href="https://form.jotform.com/252121444918050" target="_blank" class="btn btn-ghost">
|
||
Talk to an Expert
|
||
</a>
|
||
</div>
|
||
|
||
<div class="hero-trust">
|
||
<span class="hero-trust-label">Trusted by</span>
|
||
<div class="hero-trust-items">
|
||
<span class="hero-trust-item"><span class="dot"></span> Food & Beverage</span>
|
||
<span class="hero-trust-item"><span class="dot"></span> Manufacturing</span>
|
||
<span class="hero-trust-item"><span class="dot"></span> Technology</span>
|
||
<span class="hero-trust-item"><span class="dot"></span> Logistics</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Visual side -->
|
||
<div class="hero-visual">
|
||
<div class="mockup-wrap">
|
||
|
||
<div class="float-badge float-badge-left">
|
||
<div class="fb-icon" style="background:rgba(34,197,94,0.15);color:#22c55e;">✓</div>
|
||
Audit complete
|
||
</div>
|
||
<div class="float-badge float-badge-right">
|
||
<div class="fb-icon" style="background:rgba(99,102,241,0.15);color:#818cf8;">✦</div>
|
||
AI-powered
|
||
</div>
|
||
|
||
<div class="mockup">
|
||
<div class="mockup-chrome">
|
||
<div class="chrome-dots">
|
||
<div class="chrome-dot"></div>
|
||
<div class="chrome-dot"></div>
|
||
<div class="chrome-dot"></div>
|
||
</div>
|
||
<div class="chrome-url">audit.quantumtaskai.com</div>
|
||
</div>
|
||
|
||
<div class="mockup-body">
|
||
<div class="audit-site-label">GEO & AI Visibility Report</div>
|
||
|
||
<div class="score-row">
|
||
<div class="score-left">
|
||
<div class="score-ico" style="background:rgba(99,102,241,0.15);color:#818cf8;">✦</div>
|
||
AI Visibility Score
|
||
</div>
|
||
<div class="score-right">
|
||
<div class="score-bar"><div class="score-fill" style="width:87%;background:linear-gradient(90deg,#6366f1,#818cf8);"></div></div>
|
||
<div class="score-val">87</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="score-row">
|
||
<div class="score-left">
|
||
<div class="score-ico" style="background:rgba(249,115,22,0.15);color:#fb923c;">◎</div>
|
||
SEO Score
|
||
</div>
|
||
<div class="score-right">
|
||
<div class="score-bar"><div class="score-fill" style="width:92%;background:linear-gradient(90deg,#f97316,#fb923c);"></div></div>
|
||
<div class="score-val">92</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="score-row">
|
||
<div class="score-left">
|
||
<div class="score-ico" style="background:rgba(168,85,247,0.15);color:#c084fc;">⚡</div>
|
||
Performance
|
||
</div>
|
||
<div class="score-right">
|
||
<div class="score-bar"><div class="score-fill" style="width:78%;background:linear-gradient(90deg,#a855f7,#c084fc);"></div></div>
|
||
<div class="score-val">78</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="score-row">
|
||
<div class="score-left">
|
||
<div class="score-ico" style="background:rgba(6,182,212,0.15);color:#22d3ee;">◈</div>
|
||
Schema & GEO
|
||
</div>
|
||
<div class="score-right">
|
||
<div class="score-bar"><div class="score-fill" style="width:95%;background:linear-gradient(90deg,#06b6d4,#67e8f9);"></div></div>
|
||
<div class="score-val">95</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="mockup-insight">
|
||
<div class="insight-text">3 quick fixes → +12 visibility points</div>
|
||
<div class="insight-action">Fix Now</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ══════════════════════════════════════ MARQUEE -->
|
||
<div class="marquee-strip">
|
||
<div class="marquee-track">
|
||
<!-- Duplicated for seamless loop -->
|
||
<span class="marquee-item"><span>🛡</span> Cybersecurity Consulting</span>
|
||
<span class="marquee-item"><span>⚡</span> AI Automation</span>
|
||
<span class="marquee-item"><span>🔍</span> AI Site Auditor</span>
|
||
<span class="marquee-item"><span>✦</span> Digital Branding</span>
|
||
<span class="marquee-item"><span>📊</span> SOSTAC+RACE Framework</span>
|
||
<span class="marquee-item"><span>🤖</span> AI Content Generation</span>
|
||
<span class="marquee-item"><span>🏆</span> Six Sigma Methodology</span>
|
||
<span class="marquee-item"><span>🌐</span> Based in Dubai, UAE</span>
|
||
<span class="marquee-item"><span>🛡</span> Cybersecurity Consulting</span>
|
||
<span class="marquee-item"><span>⚡</span> AI Automation</span>
|
||
<span class="marquee-item"><span>🔍</span> AI Site Auditor</span>
|
||
<span class="marquee-item"><span>✦</span> Digital Branding</span>
|
||
<span class="marquee-item"><span>📊</span> SOSTAC+RACE Framework</span>
|
||
<span class="marquee-item"><span>🤖</span> AI Content Generation</span>
|
||
<span class="marquee-item"><span>🏆</span> Six Sigma Methodology</span>
|
||
<span class="marquee-item"><span>🌐</span> Based in Dubai, UAE</span>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ══════════════════════════════════════ PROOF -->
|
||
<section class="proof">
|
||
<div class="container">
|
||
<div class="proof-grid">
|
||
<div class="proof-item">
|
||
<div class="proof-num">35+</div>
|
||
<div class="proof-label">Years Combined Expertise</div>
|
||
<div class="proof-sub">Cybersecurity & Process Automation</div>
|
||
</div>
|
||
<div class="proof-item">
|
||
<div class="proof-num">250%</div>
|
||
<div class="proof-label">Average ROI Increase</div>
|
||
<div class="proof-sub">Across digital branding clients</div>
|
||
</div>
|
||
<div class="proof-item">
|
||
<div class="proof-num">3×</div>
|
||
<div class="proof-label">Faster Content Output</div>
|
||
<div class="proof-sub">With AI automation pipelines</div>
|
||
</div>
|
||
<div class="proof-item">
|
||
<div class="proof-num">24/7</div>
|
||
<div class="proof-label">Monitoring & Response</div>
|
||
<div class="proof-sub">Security & automation coverage</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ══════════════════════════════════════ SERVICES -->
|
||
<section id="services" class="services">
|
||
<div class="container">
|
||
<div class="services-header">
|
||
<div>
|
||
<p class="section-label">What We Do</p>
|
||
<h2 class="section-title">Every AI tool your<br>business needs to win</h2>
|
||
</div>
|
||
<a href="https://form.jotform.com/252121444918050" target="_blank" class="btn btn-primary" style="align-self:center;">
|
||
Get Started →
|
||
</a>
|
||
</div>
|
||
|
||
<div class="services-grid">
|
||
|
||
<div class="svc-card featured">
|
||
<div class="svc-badge">Free</div>
|
||
<div class="svc-icon" style="background:rgba(99,102,241,0.2);color:#818cf8;">🔍</div>
|
||
<div class="svc-title">AI Site Auditor</div>
|
||
<div class="svc-text">See exactly how ChatGPT, Perplexity, and Google AI see your site. GEO + SEO audit with actionable fixes — in minutes, not weeks.</div>
|
||
<a href="https://audit.quantumtaskai.com" class="svc-link">Run a free audit →</a>
|
||
</div>
|
||
|
||
<div class="svc-card">
|
||
<div class="svc-icon" style="background:rgba(249,115,22,0.1);color:#f97316;">🛡</div>
|
||
<div class="svc-title">Cybersecurity Consulting</div>
|
||
<div class="svc-text">Threat detection, security frameworks, and incident response backed by 35+ years of hands-on expertise and Six Sigma methodology.</div>
|
||
<a href="https://form.jotform.com/252121444918050" target="_blank" class="svc-link">Get a security review →</a>
|
||
</div>
|
||
|
||
<div class="svc-card">
|
||
<div class="svc-icon" style="background:rgba(34,197,94,0.1);color:#16a34a;">⚡</div>
|
||
<div class="svc-title">AI Automation</div>
|
||
<div class="svc-text">Eliminate repetitive work with intelligent workflows, machine learning integrations, and automated pipelines that scale with your team.</div>
|
||
<a href="https://form.jotform.com/252121444918050" target="_blank" class="svc-link">Automate your workflow →</a>
|
||
</div>
|
||
|
||
<div class="svc-card">
|
||
<div class="svc-icon" style="background:rgba(168,85,247,0.1);color:#a855f7;">✦</div>
|
||
<div class="svc-title">AI Digital Branding</div>
|
||
<div class="svc-text">Build a brand that stands out. Strategy + content + identity using the proven SOSTAC+RACE framework — powered by AI for 3× faster execution.</div>
|
||
<a href="digital-branding.html" class="svc-link">Explore branding →</a>
|
||
</div>
|
||
|
||
<div class="svc-card">
|
||
<div class="svc-icon" style="background:rgba(239,68,68,0.1);color:#ef4444;">⚠</div>
|
||
<div class="svc-title">Rapid Response</div>
|
||
<div class="svc-text">When a security incident hits, every minute costs money. Our response team activates immediately to contain threats and restore operations.</div>
|
||
<a href="https://form.jotform.com/252121444918050" target="_blank" class="svc-link">Get emergency support →</a>
|
||
</div>
|
||
|
||
<div class="svc-card">
|
||
<div class="svc-icon" style="background:rgba(6,182,212,0.1);color:#0891b2;">✍</div>
|
||
<div class="svc-title">AI Content & Blog</div>
|
||
<div class="svc-text">Automated content pipelines that research, write, and publish SEO-optimized articles — keeping your blog alive without lifting a finger.</div>
|
||
<a href="https://blog.quantumtaskai.com/" class="svc-link">Read our blog →</a>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ══════════════════════════════ WHY QUANTUM TASKS AI -->
|
||
<section id="about" class="why">
|
||
<div class="container">
|
||
<p class="section-label">Why Choose Us</p>
|
||
<h2 class="section-title">Not a software vendor.<br>A strategic AI partner.</h2>
|
||
|
||
<div class="why-grid">
|
||
|
||
<div class="why-list">
|
||
<div class="why-item">
|
||
<div class="why-icon" style="background:rgba(99,102,241,0.1);color:var(--indigo);">🎯</div>
|
||
<div>
|
||
<div class="why-item-title">35+ Years Operational Depth</div>
|
||
<div class="why-item-text">Our founders bring decades of real-world experience in cybersecurity, process automation, and international business — not just theory.</div>
|
||
</div>
|
||
</div>
|
||
<div class="why-item">
|
||
<div class="why-icon" style="background:rgba(249,115,22,0.1);color:var(--orange);">🏆</div>
|
||
<div>
|
||
<div class="why-item-title">Six Sigma Black Belt Rigor</div>
|
||
<div class="why-item-text">Every engagement is built on proven operational methodology. Zero-waste processes, measurable outcomes, and continuous improvement built in.</div>
|
||
</div>
|
||
</div>
|
||
<div class="why-item">
|
||
<div class="why-icon" style="background:rgba(34,197,94,0.1);color:#16a34a;">🌍</div>
|
||
<div>
|
||
<div class="why-item-title">Global Perspective, Local Focus</div>
|
||
<div class="why-item-text">Based in Dubai with international reach — we understand the unique challenges of businesses operating across the UAE and beyond.</div>
|
||
</div>
|
||
</div>
|
||
<div class="why-item">
|
||
<div class="why-icon" style="background:rgba(168,85,247,0.1);color:var(--violet);">⚡</div>
|
||
<div>
|
||
<div class="why-item-title">Results in Days, Not Months</div>
|
||
<div class="why-item-text">AI tools that deploy fast. Strategy that shows measurable results within the first 30 days — or we don't stop until they do.</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="why-visual">
|
||
<div class="why-stat-grid">
|
||
<div class="why-stat-card">
|
||
<div class="why-stat-num">45+</div>
|
||
<div class="why-stat-label">Years combined business leadership</div>
|
||
</div>
|
||
<div class="why-stat-card">
|
||
<div class="why-stat-num">250%</div>
|
||
<div class="why-stat-label">Avg. ROI increase for branding clients</div>
|
||
</div>
|
||
<div class="why-stat-card">
|
||
<div class="why-stat-num">3×</div>
|
||
<div class="why-stat-label">Faster content output with AI pipelines</div>
|
||
</div>
|
||
<div class="why-stat-card">
|
||
<div class="why-stat-num">100%</div>
|
||
<div class="why-stat-label">AI-powered delivery model</div>
|
||
</div>
|
||
</div>
|
||
<div class="why-visual-badge">
|
||
✦ "The only consultancy in the region combining deep cybersecurity expertise with full-stack AI implementation."
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ══════════════════════════════ TESTIMONIALS -->
|
||
<section class="testimonials">
|
||
<div class="container">
|
||
<div class="testimonials-header">
|
||
<p class="section-label" style="justify-content:center;">Client Results</p>
|
||
<h2 class="section-title">Businesses that made the switch</h2>
|
||
<p class="section-sub">Real outcomes from real engagements — no fluff.</p>
|
||
</div>
|
||
|
||
<div class="t-grid">
|
||
|
||
<div class="t-card">
|
||
<div class="t-stars">★★★★★</div>
|
||
<div class="t-quote">"</div>
|
||
<p class="t-text">Quantum Tasks AI overhauled our entire security posture in under three weeks. The combination of technical depth and structured Six Sigma methodology meant nothing was left to chance.</p>
|
||
<div class="t-author">
|
||
<div class="t-avatar" style="background:linear-gradient(135deg,#6366f1,#a855f7);">M</div>
|
||
<div>
|
||
<div class="t-name">Management Team</div>
|
||
<div class="t-role">MTSV Foods Industries Pvt Ltd</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="t-card">
|
||
<div class="t-stars">★★★★★</div>
|
||
<div class="t-quote">"</div>
|
||
<p class="t-text">The AI branding strategy delivered exactly what they promised — our content output tripled and our digital presence went from invisible to ranking on the first page within 60 days.</p>
|
||
<div class="t-author">
|
||
<div class="t-avatar" style="background:linear-gradient(135deg,#f97316,#ef4444);">A</div>
|
||
<div>
|
||
<div class="t-name">Operations Director</div>
|
||
<div class="t-role">Apple Tree Industries</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="t-card">
|
||
<div class="t-stars">★★★★★</div>
|
||
<div class="t-quote">"</div>
|
||
<p class="t-text">Running the free AI audit was an eye-opener. We had no idea how poorly our site was performing for AI-powered search. The fixes took a day and the results were immediate.</p>
|
||
<div class="t-author">
|
||
<div class="t-avatar" style="background:linear-gradient(135deg,#06b6d4,#6366f1);">T</div>
|
||
<div>
|
||
<div class="t-name">Founder</div>
|
||
<div class="t-role">TechStart Solutions</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ══════════════════════════════════════ CTA BANNER -->
|
||
<section class="cta-banner">
|
||
<div class="container">
|
||
<div class="cta-inner">
|
||
<div class="cta-pill">
|
||
<span class="cta-pill-dot"></span>
|
||
Free — no credit card required
|
||
</div>
|
||
<h2 class="cta-title">Your competitors are<br>already using AI.<br><span class="grad">Don't get left behind.</span></h2>
|
||
<p class="cta-sub">Start with a free audit of your site — see exactly where you stand in under 5 minutes.</p>
|
||
<div class="cta-buttons">
|
||
<a href="https://audit.quantumtaskai.com" class="btn btn-primary">
|
||
Run My Free Audit →
|
||
</a>
|
||
<a href="https://form.jotform.com/252121444918050" target="_blank" class="btn btn-ghost">
|
||
Book a Consultation
|
||
</a>
|
||
</div>
|
||
<p class="cta-note">Or email us directly at <a href="mailto:abhay@quantumtaskai.com" style="color:rgba(255,255,255,0.5);text-decoration:underline;">abhay@quantumtaskai.com</a></p>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ══════════════════════════════════════ CONTACT -->
|
||
<section id="contact" class="contact">
|
||
<div class="container">
|
||
<div class="contact-header">
|
||
<p class="section-label" style="justify-content:center;">Get In Touch</p>
|
||
<h2 class="section-title">Let's talk about your business</h2>
|
||
<p class="section-sub">Security concern, automation project, or branding strategy — we respond within 24 hours.</p>
|
||
</div>
|
||
|
||
<div class="contact-grid">
|
||
|
||
<div class="form-card">
|
||
<div class="form-title">Send us a message</div>
|
||
<form id="contactForm" method="post" action="#">
|
||
<div class="form-row">
|
||
<div class="form-group">
|
||
<label class="form-label">Full Name *</label>
|
||
<input class="form-input" type="text" name="name" required maxlength="100" placeholder="Your name" />
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="form-label">Email *</label>
|
||
<input class="form-input" type="email" name="email" required maxlength="254" placeholder="you@company.com" />
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="form-label">Company</label>
|
||
<input class="form-input" type="text" name="company" maxlength="100" placeholder="Your company name" />
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="form-label">What can we help with? *</label>
|
||
<textarea class="form-input form-textarea" name="message" required minlength="10" maxlength="1000" placeholder="Tell us about your security needs, automation goals, or branding project…"></textarea>
|
||
</div>
|
||
<button type="submit" class="form-submit">Send Message →</button>
|
||
</form>
|
||
</div>
|
||
|
||
<div class="contact-aside">
|
||
<div class="contact-aside-title">We're based in Dubai.</div>
|
||
<div class="contact-aside-sub">Serving businesses across the UAE, GCC, and globally. Response within 24 hours, guaranteed.</div>
|
||
|
||
<div class="c-item">
|
||
<div class="c-icon">📍</div>
|
||
<div>
|
||
<h4>Office</h4>
|
||
<p>Meydan Grandstand, 6th floor<br>Meydan Road, Nad Al Sheba<br>Dubai, U.A.E.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="c-item">
|
||
<div class="c-icon">✉</div>
|
||
<div>
|
||
<h4>Email</h4>
|
||
<a href="mailto:abhay@quantumtaskai.com">abhay@quantumtaskai.com</a>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="c-promise">
|
||
<div class="c-promise-title">Our commitment to you</div>
|
||
<div class="c-promise-text">Every engagement starts with understanding your specific challenge. No generic solutions, no unnecessary upselling — just the right AI strategy for your business.</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
</main>
|
||
|
||
<!-- ══════════════════════════════════════ FOOTER -->
|
||
<footer class="footer">
|
||
<div class="container">
|
||
<div class="footer-main">
|
||
<div>
|
||
<img src="img/logo.png" alt="Quantum Tasks AI" class="footer-logo-img" />
|
||
<p class="footer-desc">AI-powered automation, cybersecurity, and digital growth — built for businesses ready to move faster and compete smarter.</p>
|
||
<a href="mailto:abhay@quantumtaskai.com" class="footer-contact-link">✉ abhay@quantumtaskai.com</a>
|
||
<span class="footer-contact-link">📍 Dubai, UAE</span>
|
||
</div>
|
||
<div>
|
||
<div class="footer-col-title">Services</div>
|
||
<div class="footer-links">
|
||
<a href="https://audit.quantumtaskai.com" class="footer-link">AI Site Auditor</a>
|
||
<a href="#services" class="footer-link">Cybersecurity</a>
|
||
<a href="#services" class="footer-link">AI Automation</a>
|
||
<a href="digital-branding.html" class="footer-link">Digital Branding</a>
|
||
</div>
|
||
</div>
|
||
<div>
|
||
<div class="footer-col-title">Company</div>
|
||
<div class="footer-links">
|
||
<a href="#about" class="footer-link">About Us</a>
|
||
<a href="https://blog.quantumtaskai.com/" class="footer-link">Blog</a>
|
||
<a href="#contact" class="footer-link">Contact</a>
|
||
</div>
|
||
</div>
|
||
<div>
|
||
<div class="footer-col-title">Free Tools</div>
|
||
<div class="footer-links">
|
||
<a href="https://audit.quantumtaskai.com" class="footer-link">Free Site Audit</a>
|
||
<a href="digital-branding.html" class="footer-link">Branding Framework</a>
|
||
<a href="https://blog.quantumtaskai.com/" class="footer-link">AI Insights</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="footer-bottom">
|
||
<span>© 2025 Quantum Task AI LLC FZ · Dubai, UAE</span>
|
||
<div class="footer-bottom-links">
|
||
<a href="privacy.html" class="footer-link">Privacy Policy</a>
|
||
<a href="terms.html" class="footer-link">Terms of Service</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</footer>
|
||
|
||
<script>
|
||
// Form handler
|
||
document.getElementById('contactForm').addEventListener('submit', function(e) {
|
||
e.preventDefault();
|
||
const btn = this.querySelector('.form-submit');
|
||
btn.textContent = 'Message sent ✓';
|
||
btn.style.background = '#16a34a';
|
||
btn.disabled = true;
|
||
setTimeout(() => {
|
||
btn.textContent = 'Send Message →';
|
||
btn.style.background = '';
|
||
btn.disabled = false;
|
||
this.reset();
|
||
}, 4000);
|
||
});
|
||
|
||
// Scroll-triggered fade-in for sections
|
||
const observer = new IntersectionObserver((entries) => {
|
||
entries.forEach(el => {
|
||
if (el.isIntersecting) {
|
||
el.target.style.opacity = '1';
|
||
el.target.style.transform = 'translateY(0)';
|
||
}
|
||
});
|
||
}, { threshold: 0.1 });
|
||
|
||
document.querySelectorAll('.svc-card, .t-card, .why-item, .proof-item, .founder-card').forEach(el => {
|
||
el.style.opacity = '0';
|
||
el.style.transform = 'translateY(20px)';
|
||
el.style.transition = 'opacity .5s ease, transform .5s ease';
|
||
observer.observe(el);
|
||
});
|
||
</script>
|
||
|
||
</body>
|
||
</html>
|