Website Under Maintenance
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
:root {
--background: #070a14;
--card: rgba(255, 255, 255, 0.07);
--border: rgba(255, 255, 255, 0.12);
--text: #ffffff;
--muted: #a8b0c2;
--purple: #6c63ff;
--blue: #00d4ff;
--green: #25d366;
}
body {
min-height: 100vh;
width: 100%;
font-family: Arial, Helvetica, sans-serif;
color: var(--text);
display: flex;
align-items: center;
justify-content: center;
overflow-x: hidden;
position: relative;
background:
radial-gradient(
circle at 15% 20%,
rgba(108, 99, 255, 0.25),
transparent 35%
),
radial-gradient(
circle at 85% 80%,
rgba(0, 212, 255, 0.18),
transparent 35%
),
var(--background);
}
/* Animated background */
body::before,
body::after {
content: "";
position: absolute;
width: 400px;
height: 400px;
border-radius: 50%;
filter: blur(90px);
opacity: 0.18;
pointer-events: none;
animation: floating 10s ease-in-out infinite alternate;
}
body::before {
background: var(--purple);
top: -180px;
left: -130px;
}
body::after {
background: var(--blue);
right: -150px;
bottom: -200px;
animation-delay: 2s;
}
@keyframes floating {
0% {
transform: translate(0, 0) scale(1);
}
100% {
transform: translate(60px, 40px) scale(1.15);
}
}
/* Main container */
.container {
width: min(92%, 900px);
position: relative;
z-index: 2;
margin: 30px auto;
}
/* Main card */
.maintenance-card {
text-align: center;
padding: 55px 40px;
background: var(--card);
border: 1px solid var(--border);
border-radius: 28px;
backdrop-filter: blur(22px);
-webkit-backdrop-filter: blur(22px);
box-shadow: 0 30px 80px rgba(0, 0, 0, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}
/* Maintenance icon */
.icon-wrapper {
width: 90px;
height: 90px;
margin: 0 auto 28px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
background: linear-gradient(
135deg,
var(--purple),
var(--blue)
);
box-shadow: 0 0 45px rgba(108, 99, 255, 0.35);
animation: iconPulse 2.5s infinite;
}
.icon {
font-size: 42px;
}
@keyframes iconPulse {
0%, 100% {
transform: scale(1);
}
50% {
transform: scale(1.08);
}
}
/* Status */
.status {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 8px 16px;
border-radius: 50px;
background: rgba(255, 255, 255, 0.06);
border: 1px solid var(--border);
color: #d5d9e5;
font-size: 13px;
letter-spacing: 0.5px;
margin-bottom: 22px;
}
.status-dot {
width: 8px;
height: 8px;
border-radius: 50%;
background: var(--green);
box-shadow: 0 0 12px var(--green);
animation: statusBlink 1.5s infinite;
}
@keyframes statusBlink {
0%, 100% {
opacity: 1;
}
50% {
opacity: 0.35;
}
}
/* Heading */
h1 {
font-size: clamp(38px, 7vw, 68px);
line-height: 1.05;
font-weight: 800;
letter-spacing: -2.5px;
margin-bottom: 20px;
background: linear-gradient(
90deg,
#ffffff,
#bfc7ff,
#ffffff
);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-size: 200% auto;
animation: headingShine 5s linear infinite;
}
@keyframes headingShine {
to {
background-position: 200% center;
}
}
/* Description */
.description {
max-width: 650px;
margin: 0 auto;
color: var(--muted);
font-size: 17px;
line-height: 1.7;
}
/* WhatsApp section */
.whatsapp-section {
margin-top: 32px;
}
.whatsapp-text {
color: #a8b0c2;
font-size: 14px;
margin-bottom: 14px;
}
/* WhatsApp button */
.whatsapp-button {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 10px;
padding: 14px 24px;
min-width: 250px;
border-radius: 50px;
background: linear-gradient(
135deg,
#25d366,
#16b957
);
color: #ffffff;
text-decoration: none;
font-size: 15px;
font-weight: 700;
box-shadow: 0 10px 30px rgba(37, 211, 102, 0.22);
transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.whatsapp-button:hover {
transform: translateY(-3px);
box-shadow: 0 15px 35px rgba(37, 211, 102, 0.35);
}
.whatsapp-button:active {
transform: translateY(0);
}
/* WhatsApp icon */
.whatsapp-icon {
width: 22px;
height: 22px;
display: flex;
align-items: center;
justify-content: center;
font-size: 21px;
}
/* Footer */
.footer {
margin-top: 30px;
color: #737b90;
font-size: 13px;
line-height: 1.7;
}
.footer strong {
color: #aab2c4;
}
/* Mobile */
@media (max-width: 600px) {
.container {
width: 94%;
margin: 20px auto;
}
.maintenance-card {
padding: 40px 20px;
border-radius: 22px;
}
.icon-wrapper {
width: 75px;
height: 75px;
}
.icon {
font-size: 34px;
}
h1 {
letter-spacing: -1.5px;
}
.description {
font-size: 15px;
}
.whatsapp-button {
width: 100%;
min-width: 0;
padding: 15px 20px;
}
}
/* Very small screens */
@media (max-width: 380px) {
.maintenance-card {
padding: 30px 15px;
}
}
Maintenance in progress
We'll Be Back Soon
Our website is currently undergoing scheduled maintenance. We're working behind the scenes to improve your experience, enhance performance, and bring you exciting updates. We appreciate your patience while we make your shopping experience better.