/* Базовые настройки */
body {
    cursor: crosshair;
}

html {
    scroll-behavior: smooth;
}

/* Эффект шума (Noise) */
.bg-noise {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 9998;
    opacity: 0.04;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");
}

/* Технологическая сетка */
.bg-tech-grid {
    background-size: 40px 40px;
    background-image: linear-gradient(to right, rgba(255, 255, 255, 0.03) 1px, transparent 1px),
                      linear-gradient(to bottom, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
}

/* Эффект старого монитора (Scanlines) */
.scanlines {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(
      to bottom,
      rgba(255,255,255,0),
      rgba(255,255,255,0) 50%,
      rgba(0,0,0,0.2) 50%,
      rgba(0,0,0,0.2)
    );
    background-size: 100% 4px;
    z-index: 9999;
    pointer-events: none;
    opacity: 0.15;
}

/* Кастомный скроллбар */
::-webkit-scrollbar {
    width: 6px;
}
::-webkit-scrollbar-track {
    background: #050505; 
}
::-webkit-scrollbar-thumb {
    background: #333; 
    border-radius: 0;
}
::-webkit-scrollbar-thumb:hover {
    background: #ccff00; 
}

/* Утилиты */
.text-glow {
    text-shadow: 0 0 10px rgba(204, 255, 0, 0.5);
}

.clip-diagonal {
    clip-path: polygon(0 0, 100% 0, 100% 85%, 85% 100%, 0 100%);
}

.clip-frame {
    clip-path: polygon(
      0 0, 
      20px 0, 
      20px 2px, 
      calc(100% - 20px) 2px, 
      calc(100% - 20px) 0, 
      100% 0, 
      100% 100%, 
      calc(100% - 20px) 100%, 
      calc(100% - 20px) calc(100% - 2px), 
      20px calc(100% - 2px), 
      20px 100%, 
      0 100%
    );
}

/* Анимация проявления при скролле */
.reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: all 1s ease-out;
}
.reveal.active {
    opacity: 1;
    transform: translateY(0);
}