:root {
    --bg: #000;
    --card: #121a28;
    --border: #1e2a3a;
    --text: #e6ecf5;
    --muted: #8aa0bd;
    --blue: #4f9cf7;
    --green: #2ecc8f;
    --red: #ff5a5f;
    --gold: #f7b32b;
    --violet: #a78bfa;
    --grid: #1e2a3a;
    --tick: #8aa0bd;
    --radius: 14px;
    --glow: 0 0 24px rgba(79, 156, 247, 0.12);
    --mono: 'DejaVu Sans Mono', 'SFMono-Regular', Consolas, monospace;
    --sans: 'DejaVu Sans', 'Liberation Sans', sans-serif;
}

body {
    background: var(--bg);
    color: var(--text);
    font-family: var(--sans);
}

h1, h2, h3, h4 {
    font-family: var(--sans);
}

body .font-mono {
    font-family: var(--mono);
    font-variant-numeric: tabular-nums;
}

.nav-link.active {
    color: var(--blue);
    border-bottom: 2px solid var(--blue);
    padding-bottom: 2px;
}

.nav-glass {
    background: #000;
}

.pull-quote {
    font-family: var(--sans);
    font-style: normal;
    font-weight: 700;
    font-size: 2rem;
    line-height: 1.3;
    color: #c76b4a;
}

html {
    scroll-behavior: smooth;
}

section[id] {
    scroll-margin-top: 80px;
}

.hamburger-line {
    display: block;
    width: 24px;
    height: 2px;
    background: #e6ecf5;
    margin: 5px 0;
    transition: transform 0.2s, opacity 0.2s;
}

.card-hover {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.card-hover:hover {
    transform: translateY(-2px);
    box-shadow: var(--glow);
}

.bg-network {
    background-color: #000;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='400'%3E%3Ccircle cx='60' cy='80' r='3' fill='%234f9cf7' opacity='0.25'/%3E%3Ccircle cx='120' cy='160' r='3.5' fill='%234f9cf7' opacity='0.2'/%3E%3Ccircle cx='200' cy='60' r='3' fill='%234f9cf7' opacity='0.25'/%3E%3Ccircle cx='280' cy='120' r='3.5' fill='%234f9cf7' opacity='0.2'/%3E%3Ccircle cx='340' cy='220' r='3' fill='%234f9cf7' opacity='0.2'/%3E%3Ccircle cx='80' cy='300' r='3.5' fill='%234f9cf7' opacity='0.25'/%3E%3Ccircle cx='240' cy='320' r='3' fill='%234f9cf7' opacity='0.2'/%3E%3Ccircle cx='160' cy='240' r='4' fill='%234f9cf7' opacity='0.2'/%3E%3Ccircle cx='40' cy='200' r='2.5' fill='%234f9cf7' opacity='0.2'/%3E%3Ccircle cx='360' cy='80' r='2.5' fill='%234f9cf7' opacity='0.2'/%3E%3C/svg%3E");
}

[data-animate] {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

[data-animate].visible {
    opacity: 1;
    transform: translateY(0);
}

[data-animate="fade-in"] {
    transform: none;
}

[data-animate="pulse"] {
    opacity: 1;
    transform: none;
    animation: pulse-arrow 2.5s ease-in-out infinite;
}

[data-animate="stagger"] {
    transform: none;
}

[data-animate="stagger"] > * {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.5s ease-out, transform 0.5s ease-out;
}

[data-animate="stagger"].visible > * {
    opacity: 1;
    transform: translateY(0);
}

[data-animate="stagger"].visible > *:nth-child(1) { transition-delay: 0s; }
[data-animate="stagger"].visible > *:nth-child(2) { transition-delay: 0.12s; }
[data-animate="stagger"].visible > *:nth-child(3) { transition-delay: 0.24s; }
[data-animate="stagger"].visible > *:nth-child(4) { transition-delay: 0.36s; }

.animate-ready {
    opacity: 1 !important;
    transform: translateY(0) !important;
}

@keyframes pulse-arrow {
    0%, 100% { transform: scale(1); opacity: 0.6; }
    50% { transform: scale(1.2); opacity: 1; }
}
