Update index.html
Browse files- index.html +162 -26
index.html
CHANGED
|
@@ -1,26 +1,162 @@
|
|
| 1 |
-
|
| 2 |
-
|
| 3 |
-
|
| 4 |
-
|
| 5 |
-
<
|
| 6 |
-
|
| 7 |
-
|
| 8 |
-
|
| 9 |
-
|
| 10 |
-
|
| 11 |
-
|
| 12 |
-
|
| 13 |
-
|
| 14 |
-
|
| 15 |
-
|
| 16 |
-
|
| 17 |
-
|
| 18 |
-
|
| 19 |
-
|
| 20 |
-
|
| 21 |
-
|
| 22 |
-
|
| 23 |
-
|
| 24 |
-
|
| 25 |
-
|
| 26 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 1 |
+
<!DOCTYPE html>
|
| 2 |
+
<html lang="en">
|
| 3 |
+
<head>
|
| 4 |
+
<meta charset="UTF-8">
|
| 5 |
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
| 6 |
+
<title>About | Klove AI</title>
|
| 7 |
+
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;700&display=swap" rel="stylesheet">
|
| 8 |
+
<style>
|
| 9 |
+
:root {
|
| 10 |
+
--primary-color: #007bff;
|
| 11 |
+
--bg-dark: #0f172a;
|
| 12 |
+
--text-main: #f8fafc;
|
| 13 |
+
--text-dim: #94a3b8;
|
| 14 |
+
--card-bg: rgba(30, 41, 59, 0.7);
|
| 15 |
+
}
|
| 16 |
+
|
| 17 |
+
* {
|
| 18 |
+
margin: 0;
|
| 19 |
+
padding: 0;
|
| 20 |
+
box-sizing: border-box;
|
| 21 |
+
}
|
| 22 |
+
|
| 23 |
+
body {
|
| 24 |
+
font-family: 'Inter', sans-serif;
|
| 25 |
+
background-color: var(--bg-dark);
|
| 26 |
+
background-image: radial-gradient(circle at top right, #1e293b, #0f172a);
|
| 27 |
+
color: var(--text-main);
|
| 28 |
+
display: flex;
|
| 29 |
+
justify-content: center;
|
| 30 |
+
align-items: center;
|
| 31 |
+
min-height: 100vh;
|
| 32 |
+
padding: 20px;
|
| 33 |
+
}
|
| 34 |
+
|
| 35 |
+
.container {
|
| 36 |
+
max-width: 800px;
|
| 37 |
+
width: 100%;
|
| 38 |
+
background: var(--card-bg);
|
| 39 |
+
backdrop-filter: blur(12px);
|
| 40 |
+
border: 1px solid rgba(255, 255, 255, 0.1);
|
| 41 |
+
border-radius: 24px;
|
| 42 |
+
padding: 60px 40px;
|
| 43 |
+
box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5);
|
| 44 |
+
animation: fadeIn 1s ease-out;
|
| 45 |
+
}
|
| 46 |
+
|
| 47 |
+
@keyframes fadeIn {
|
| 48 |
+
from { opacity: 0; transform: translateY(20px); }
|
| 49 |
+
to { opacity: 1; transform: translateY(0); }
|
| 50 |
+
}
|
| 51 |
+
|
| 52 |
+
.header {
|
| 53 |
+
text-align: center;
|
| 54 |
+
margin-bottom: 40px;
|
| 55 |
+
}
|
| 56 |
+
|
| 57 |
+
.brand-name {
|
| 58 |
+
font-size: 2.5rem;
|
| 59 |
+
font-weight: 700;
|
| 60 |
+
letter-spacing: -1px;
|
| 61 |
+
background: linear-gradient(to right, #60a5fa, #3b82f6);
|
| 62 |
+
-webkit-background-clip: text;
|
| 63 |
+
-webkit-text-fill-color: transparent;
|
| 64 |
+
}
|
| 65 |
+
|
| 66 |
+
.content {
|
| 67 |
+
line-height: 1.8;
|
| 68 |
+
font-size: 1.1rem;
|
| 69 |
+
text-align: justify;
|
| 70 |
+
font-weight: 300;
|
| 71 |
+
color: var(--text-main);
|
| 72 |
+
}
|
| 73 |
+
|
| 74 |
+
.content p {
|
| 75 |
+
margin-bottom: 24px;
|
| 76 |
+
}
|
| 77 |
+
|
| 78 |
+
.content strong {
|
| 79 |
+
color: var(--primary-color);
|
| 80 |
+
font-weight: 600;
|
| 81 |
+
}
|
| 82 |
+
|
| 83 |
+
hr {
|
| 84 |
+
border: 0;
|
| 85 |
+
height: 1px;
|
| 86 |
+
background: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.2), transparent);
|
| 87 |
+
margin: 40px 0;
|
| 88 |
+
}
|
| 89 |
+
|
| 90 |
+
.footer {
|
| 91 |
+
text-align: center;
|
| 92 |
+
}
|
| 93 |
+
|
| 94 |
+
.links {
|
| 95 |
+
margin-bottom: 20px;
|
| 96 |
+
}
|
| 97 |
+
|
| 98 |
+
.links a {
|
| 99 |
+
color: var(--text-dim);
|
| 100 |
+
text-decoration: none;
|
| 101 |
+
margin: 0 12px;
|
| 102 |
+
font-weight: 500;
|
| 103 |
+
font-size: 0.9rem;
|
| 104 |
+
transition: all 0.3s ease;
|
| 105 |
+
}
|
| 106 |
+
|
| 107 |
+
.links a:hover {
|
| 108 |
+
color: var(--primary-color);
|
| 109 |
+
text-shadow: 0 0 8px rgba(59, 130, 246, 0.5);
|
| 110 |
+
}
|
| 111 |
+
|
| 112 |
+
.copyright {
|
| 113 |
+
font-size: 0.85rem;
|
| 114 |
+
color: var(--text-dim);
|
| 115 |
+
letter-spacing: 0.5px;
|
| 116 |
+
}
|
| 117 |
+
|
| 118 |
+
.copyright strong {
|
| 119 |
+
color: #cbd5e1;
|
| 120 |
+
}
|
| 121 |
+
|
| 122 |
+
/* Responsive Tweaks */
|
| 123 |
+
@media (max-width: 640px) {
|
| 124 |
+
.container { padding: 40px 20px; }
|
| 125 |
+
.brand-name { font-size: 2rem; }
|
| 126 |
+
.links a { display: block; margin: 10px 0; }
|
| 127 |
+
}
|
| 128 |
+
</style>
|
| 129 |
+
</head>
|
| 130 |
+
<body>
|
| 131 |
+
|
| 132 |
+
<div class="container">
|
| 133 |
+
<header class="header">
|
| 134 |
+
<h1 class="brand-name">Klove AI</h1>
|
| 135 |
+
</header>
|
| 136 |
+
|
| 137 |
+
<article class="content">
|
| 138 |
+
<p>
|
| 139 |
+
The inception of <strong>Klove AI</strong> was driven by a single observation: the modern professional landscape had become too complex for traditional navigation. While talent is universal, the clarity required to bridge the gap between current skills and future potential was not. The founders envisioned a "Career Intelligence" layer—a sophisticated, data-driven compass that could decode the shifting demands of the global market.
|
| 140 |
+
</p>
|
| 141 |
+
|
| 142 |
+
<p>
|
| 143 |
+
By leveraging advanced neural architectures, Klove AI moved beyond static resumes to understand the living architecture of human competencies. The company was built to transform the uncertainty of career growth into a structured science, providing individuals with the clarity needed to navigate their professional journeys with precision. Today, Klove AI stands as the silent infrastructure for human advancement, ensuring that ambition is always met with an intelligent path forward.
|
| 144 |
+
</p>
|
| 145 |
+
</article>
|
| 146 |
+
|
| 147 |
+
<hr />
|
| 148 |
+
|
| 149 |
+
<footer class="footer">
|
| 150 |
+
<div class="links">
|
| 151 |
+
<a href="https://klove.ai">Official Website</a>
|
| 152 |
+
<a href="https://linkedin.com/company/klove-ai">LinkedIn</a>
|
| 153 |
+
<a href="mailto:hello@klove.ai">Contact Inquiries</a>
|
| 154 |
+
</div>
|
| 155 |
+
<p class="copyright">
|
| 156 |
+
<strong>Klove AI © 2026</strong> | Advancing Professional Potential
|
| 157 |
+
</p>
|
| 158 |
+
</footer>
|
| 159 |
+
</div>
|
| 160 |
+
|
| 161 |
+
</body>
|
| 162 |
+
</html>
|