:root {
    --neon-orange: #FF5500;
    --black-bg: #050505;
    --grid-line: rgba(255, 85, 0, 0.08);
    --border-color: #2A2A2A;
}

body {
    font-family: 'Rubik', sans-serif;
    background-color: var(--black-bg);
    color: #D4D4D4;
    overflow-x: hidden;
}

h1, h2, h3, .mono-font {
    font-family: 'Space Mono', monospace;
}

/* Background Isometric Grid */
.grid-bg {
    background-image: 
        linear-gradient(var(--border-color) 1px, transparent 1px),
        linear-gradient(90deg, var(--border-color) 1px, transparent 1px);
    background-size: 50px 50px;
    background-position: center center;
}

.grid-bg::after {
    content: '';
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: radial-gradient(circle at center, transparent 20%, var(--black-bg) 80%);
    pointer-events: none;
    z-index: -1;
}

/* Hard Edges and Borders */
* {
    border-radius: 0 !important;
}

/* Neon Button */
.neon-btn {
    position: relative;
    background: transparent;
    color: var(--neon-orange);
    border: 1px solid var(--neon-orange);
    transition: all 0.2s ease;
    overflow: hidden;
    z-index: 1;
}

.neon-btn::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: var(--neon-orange);
    z-index: -1;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.neon-btn:hover {
    color: var(--black-bg);
    box-shadow: 0 0 15px rgba(255, 85, 0, 0.4);
}

.neon-btn:hover::before {
    transform: scaleX(1);
}

/* Scanline Animation for Hero Image */
.group-hover\:opacity-100 {
    transition: opacity 0.3s ease;
}

::selection {
    background: var(--neon-orange);
    color: var(--black-bg);
}