* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    font-family: 'Arial', sans-serif;
    overflow: hidden;
}

.container {
    position: relative;
}

.name {
    font-size: 5rem;
    font-weight: 700;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 0.3rem;
}

.letter {
    display: inline-block;
    animation: wave 1.5s ease-in-out infinite;
    animation-delay: calc(0.1s * var(--i));
    text-shadow: 
        0 0 10px rgba(255, 255, 255, 0.5),
        0 0 20px rgba(255, 255, 255, 0.3),
        0 0 30px rgba(255, 255, 255, 0.2);
}

.letter:nth-child(1) { --i: 1; }
.letter:nth-child(2) { --i: 2; }
.letter:nth-child(3) { --i: 3; }
.letter:nth-child(4) { --i: 4; }
.letter:nth-child(5) { --i: 5; }
.letter:nth-child(7) { --i: 6; }
.letter:nth-child(8) { --i: 7; }
.letter:nth-child(9) { --i: 8; }
.letter:nth-child(10) { --i: 9; }
.letter:nth-child(11) { --i: 10; }
.letter:nth-child(12) { --i: 11; }
.letter:nth-child(13) { --i: 12; }

.space {
    display: inline-block;
    width: 1.5rem;
}

@keyframes wave {
    0%, 100% {
        transform: translateY(0) scale(1);
    }
    50% {
        transform: translateY(-20px) scale(1.1);
    }
}

/* Responsive design */
@media (max-width: 768px) {
    .name {
        font-size: 3rem;
        letter-spacing: 0.2rem;
    }
}

@media (max-width: 480px) {
    .name {
        font-size: 2rem;
        letter-spacing: 0.1rem;
    }
}