:root {
    --neon-blue: #00f2ff;
    --magenta: #ff00ff; /* Glitch için */
    --cyan: #00ffff;    /* Glitch için */
    --bg-black: #010204;
}

* { 
    margin: 0; 
    padding: 0; 
    box-sizing: border-box; 
    -webkit-tap-highlight-color: transparent;
}

body {
    background-color: var(--bg-black);
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: 'Rajdhani', sans-serif;
    color: white;
    overflow: hidden;
    position: relative;
}

/* --- Parçacık Arka Planı (Öncekiyle aynı) --- */
#particles-js { position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 0; }
.main-wrapper { z-index: 10; width: 100%; display: flex; justify-content: center; padding: 20px; }
.container { text-align: center; width: 100%; max-width: 550px; }

/* --- 1. YARATICI NEON GLITCH YAZI TASARIMI --- */
.glitch-wrapper {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 20px;
}

.neon-text {
    font-family: 'Orbitron', sans-serif;
    font-size: clamp(2.5rem, 15vw, 5.5rem); /* Daha büyük ve dinamik boyut */
    letter-spacing: clamp(8px, 4vw, 20px);  /* Geniş harf boşluğu */
    color: #fff;
    text-transform: uppercase;
    position: relative;
}

/* Ana Yazı Stili ve Parlama */
.g-text {
    position: relative;
    z-index: 5;
    text-shadow: 
        0 0 10px #fff,
        0 0 20px var(--neon-blue),
        0 0 40px var(--neon-blue);
    animation: neonPulse 2s infinite alternate; /* Hafif nefes alma efekti */
}

/* Glitch Katmanları Stili */
.g-before, .g-after {
    content: attr(data-text);
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    opacity: 0.8;
}

.g-before {
    color: var(--magenta);
    z-index: -1;
    animation: glitchBefore 0.3s cubic-bezier(.25, .46, .45, .94) both 3;
}

.g-after {
    color: var(--cyan);
    z-index: -2;
    animation: glitchAfter 0.3s cubic-bezier(.25, .46, .45, .94) reverse both 3;
    animation-delay: 0.1s;
}

/* --- Animasyonlar --- */

/* Neon Nefes Alma */
@keyframes neonPulse {
    0% { opacity: 0.8; text-shadow: 0 0 5px #fff, 0 0 15px var(--neon-blue); }
    100% { opacity: 1; text-shadow: 0 0 10px #fff, 0 0 30px var(--neon-blue), 0 0 50px var(--neon-blue); }
}

/* Glitch Efektleri (Parazitli hareketler) */
@keyframes glitchBefore {
    0% { transform: translate(0); }
    15% { transform: translate(-3px, 3px); }
    30% { transform: translate(-3px, -3px); }
    45% { transform: translate(3px, 3px); }
    60% { transform: translate(3px, -3px); }
    75% { transform: translate(-2px, 0px); }
    100% { transform: translate(0); }
}

@keyframes glitchAfter {
    0% { transform: translate(0); }
    15% { transform: translate(3px, -3px); }
    30% { transform: translate(3px, 3px); }
    45% { transform: translate(-3px, -3px); }
    60% { transform: translate(-3px, 3px); }
    75% { transform: translate(2px, 0px); }
    100% { transform: translate(0); }
}

/* --- Diğer Stiller (Öncekiyle aynı) --- */
.neon-line { width: 100%; height: 2px; background: var(--neon-blue); box-shadow: 0 0 20px var(--neon-blue); margin: 20px 0; }
.sub-text { font-size: clamp(0.9rem, 4vw, 1.2rem); letter-spacing: 4px; color: var(--neon-blue); font-weight: 700; }
.loader-section { margin: 35px 0; }
.scan-bar { width: 140px; height: 1px; background: rgba(0, 242, 255, 0.05); margin: 0 auto 12px auto; position: relative; overflow: hidden; }
.scan-bar::after { content: ''; position: absolute; width: 50px; height: 100%; background: var(--neon-blue); box-shadow: 0 0 15px var(--neon-blue); animation: scanMove 2.5s infinite ease-in-out; }
@keyframes scanMove { 0% { left: -50px; } 100% { left: 100%; } }
.loading-msg { font-size: 0.75rem; color: #333; letter-spacing: 3px; }
.contact-grid { display: flex; flex-direction: column; gap: 15px; margin-top: 40px; }
.neon-card { background: rgba(0, 242, 255, 0.01); border: 1px solid rgba(0, 242, 255, 0.1); padding: 25px 20px; border-radius: 8px; display: flex; align-items: center; gap: 18px; text-decoration: none; color: white; transition: box-shadow 0.3s ease, border-color 0.3s ease; transform-style: preserve-3d; }
.neon-card i { font-size: 1.5rem; color: var(--neon-blue); text-shadow: 0 0 10px var(--neon-blue); transform: translateZ(20px); }
.card-info { text-align: left; transform: translateZ(10px); }
.label { display: block; font-size: 0.6rem; color: #555; letter-spacing: 2px; }
.value { font-size: 0.9rem; font-weight: 700; letter-spacing: 0.5px; }
.neon-card:hover { border-color: var(--neon-blue); box-shadow: 0 0 30px rgba(0, 242, 255, 0.2); }

/* MASAÜSTÜ İÇİN DÜZENLEME */
@media (min-width: 650px) {
    .contact-grid { flex-direction: row; gap: 20px; }
    .neon-card { flex: 1; padding: 30px 20px; }
    .neon-text { letter-spacing: 20px; }
}