/* ===== PAGE SPECIFIC STYLES ===== */

/* Typing Effect */
.typing-effect {
    position: relative;
}

.typing-effect::after {
    content: '|';
    position: absolute;
    right: -10px;
    animation: blink 1s infinite;
}

@keyframes blink {
    0%, 50% { opacity: 1; }
    51%, 100% { opacity: 0; }
}

/* Glitch Effect for Hero */
.hero-glitch {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: repeating-linear-gradient(
        0deg,
        transparent,
        transparent 2px,
        rgba(0, 255, 136, 0.05) 2px,
        rgba(0, 255, 136, 0.05) 4px
    );
    pointer-events: none;
    opacity: 0.3;
}

/* Code Syntax Highlighting */
.code-block code {
    display: block;
    line-height: 1.8;
}

.code-block .key {
    color: #9cdcfe;
}

.code-block .string {
    color: #ce9178;
}

.code-block .bracket {
    color: #ffd700;
}

/* Skill Cards Hover Effects */
.skill-card {
    position: relative;
    overflow: hidden;
    user-select: none;
}

.skill-card::after {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: radial-gradient(circle, rgba(0, 255, 136, 0.1) 0%, transparent 70%);
    opacity: 0;
    transition: opacity 0.3s;
}

.skill-card:hover::after {
    opacity: 1;
}

/* Service Card Badge */
.service-card .price {
    position: relative;
    z-index: 1;
}

/* Matrix Background Effect */
.hero::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: 
        radial-gradient(circle at 20% 50%, rgba(0, 255, 136, 0.1) 0%, transparent 50%),
        radial-gradient(circle at 80% 80%, rgba(0, 212, 255, 0.1) 0%, transparent 50%);
    pointer-events: none;
}

/* Section Spacing Adjustments */
#about {
    position: relative;
}

#skills {
    position: relative;
}

/* Contact Section Special Styling */
.contact {
    background: linear-gradient(180deg, var(--bg-darker) 0%, var(--bg-dark) 100%);
}

/* Mobile Menu Active State */
.nav-links.nav-active {
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    background: var(--bg-darker);
    padding: 2rem;
    border-bottom: 1px solid var(--border-color);
}

/** отметка про лох и чушпан*/

#spanchik {
    color: rgb(97, 207, 211);
    text-decoration: underline;
}


/* Selection Color */
::selection {
    background: var(--primary-color);
    color: var(--bg-dark);
}

/* Focus States for Accessibility */
a:focus,
button:focus {
    outline: 2px solid var(--primary-color);
    outline-offset: 2px;
}

/* Smooth Transitions */
* {
    transition-property: transform, background-color, border-color, box-shadow;
    transition-duration: 0.3s;
    transition-timing-function: ease;
}

/* Print Styles */
@media print {
    .navbar,
    .hero-glitch,
    .cta-button,
    .telegram-btn {
        display: none;
    }
    
    body {
        background: white;
        color: black;
    }
}