/* Home Page Custom Styles */

/* ==================== HERO TITLE ==================== */
.repel-container {
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: center;
    position: relative;
}

@keyframes gradientFlow {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

.repel-letter {
    display: inline-block;
    background: linear-gradient(90deg, #6366f1, #8b5cf6, #d946ef, #f43f5e, #6366f1);
    background-size: 300% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: gradientFlow 4s ease infinite;
    transition: transform 0.15s ease-out;
    cursor: default;
    position: relative;
}

.repel-letter.space {
    width: 0.3em;
}

/* ==================== HERO SUBTITLE ==================== */
.hero-subtitle {
    animation: fadeIn 1s ease-out 0.5s both;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}