This commit is contained in:
2025-09-08 08:15:58 +02:00
parent 7e603c7c54
commit af48303c94
31 changed files with 2700 additions and 2598 deletions

View File

@@ -4,6 +4,15 @@
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');
/* Monaco Font for Domain */
@font-face {
font-family: 'Monaco';
src: url('https://fonts.gstatic.com/s/monaco/v1/Monaco-Regular.woff2') format('woff2');
font-weight: normal;
font-style: normal;
font-display: swap;
}
:root {
--background: #0a0a0a;
--foreground: #fafafa;
@@ -83,6 +92,27 @@ body {
background-clip: text;
}
/* Domain Text with Monaco Font */
.domain-text {
font-family: 'Monaco', 'Menlo', 'Consolas', monospace;
font-size: 2.5rem;
font-weight: bold;
letter-spacing: 0.1em;
position: relative;
}
@media (min-width: 768px) {
.domain-text {
font-size: 3.5rem;
}
}
@media (min-width: 1024px) {
.domain-text {
font-size: 4rem;
}
}
.gradient-text-blue {
background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%);
-webkit-background-clip: text;
@@ -92,9 +122,64 @@ body {
/* Animated Background */
.animated-bg {
background: linear-gradient(-45deg, #0f0f0f, #1a1a1a, #0f0f0f, #1a1a1a);
background-size: 400% 400%;
animation: gradientShift 15s ease infinite;
background:
radial-gradient(circle at 20% 80%, rgba(59, 130, 246, 0.08) 0%, transparent 50%),
radial-gradient(circle at 80% 20%, rgba(139, 92, 246, 0.08) 0%, transparent 50%),
radial-gradient(circle at 40% 40%, rgba(236, 72, 153, 0.04) 0%, transparent 50%),
linear-gradient(-45deg, #0a0a0a, #111111, #0d0d0d, #151515);
background-size: 400% 400%, 400% 400%, 400% 400%, 400% 400%;
animation: gradientShift 25s ease infinite;
}
/* Film Grain / TV Noise Effect */
.animated-bg::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-image:
radial-gradient(circle at 2px 2px, rgba(255,255,255,0.08) 2px, transparent 0),
radial-gradient(circle at 4px 4px, rgba(0,0,0,0.04) 2px, transparent 0),
radial-gradient(circle at 6px 6px, rgba(255,255,255,0.06) 2px, transparent 0),
radial-gradient(circle at 8px 8px, rgba(0,0,0,0.03) 2px, transparent 0);
background-size: 4px 4px, 6px 6px, 8px 8px, 10px 10px;
pointer-events: none;
opacity: 0.7;
}
@keyframes filmGrain {
0%, 100% {
background-position: 0px 0px, 0px 0px, 0px 0px;
}
10% {
background-position: -1px -1px, 1px 1px, -1px 1px;
}
20% {
background-position: 1px -1px, -1px 1px, 1px -1px;
}
30% {
background-position: -1px 1px, 1px -1px, -1px -1px;
}
40% {
background-position: 1px 1px, -1px -1px, 1px 1px;
}
50% {
background-position: -1px -1px, 1px 1px, -1px 1px;
}
60% {
background-position: 1px -1px, -1px 1px, 1px -1px;
}
70% {
background-position: -1px 1px, 1px -1px, -1px -1px;
}
80% {
background-position: 1px 1px, -1px -1px, 1px 1px;
}
90% {
background-position: -1px -1px, 1px 1px, -1px 1px;
}
}
@keyframes gradientShift {