/* 404 Page */
    .page-404 {
        min-height: 100vh;
        display: flex;
        flex-direction: column;
    }

    .error-hero {
        flex: 1;
        display: grid;
        place-items: center;
        padding-block: clamp(5rem, 12vw, 7.5rem);
        text-align: center;
    }

    .error-content {
        width: min(90%, 680px);
        display: grid;
        gap: 1.5rem;
    }

    .error-code {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: clamp(0.75rem, 5vw, 1.5rem);
    }

    .error-digit {
        font-size: clamp(4.5rem, 14vw, 8.5rem);
        font-family: var(--font-family-display);
        font-weight: var(--font-weight-bold);
        background: linear-gradient(120deg, var(--color-primary), var(--color-accent));
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
    }

    .error-title {
        font-size: clamp(1.9rem, 5vw, 2.8rem);
    }

    .error-description {
        font-size: clamp(1rem, 3vw, 1.1rem);
        color: var(--color-text-muted);
        line-height: 1.7;
    }

    .error-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 0.75rem;
        justify-content: center;
    }

    .error-links {
        width: min(90%, 540px);
        margin-inline: auto;
        padding: clamp(1.75rem, 5vw, 2.25rem);
        border-radius: var(--radius-md);
        border: 1px solid rgba(148, 163, 184, 0.18);
        background: rgba(12, 19, 34, 0.78);
        display: grid;
        gap: 1.1rem;
    }

    .error-links h3 {
        font-size: clamp(1.2rem, 4vw, 1.5rem);
    }

    .quick-links {
        display: grid;
        gap: 0.75rem;
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    }

    .quick-links a {
        padding: 0.9rem 1.1rem;
        border-radius: var(--radius-sm);
        border: 1px solid rgba(148, 163, 184, 0.18);
        background: rgba(17, 24, 39, 0.7);
        color: var(--color-text);
        transition: transform var(--transition-base), border var(--transition-base);
    }

    .quick-links a:hover {
        transform: translateY(-2px);
        border-color: rgba(99, 102, 241, 0.55);
    }

    @media (max-width: 640px) {
        .error-actions {
            flex-direction: column;
        }

        .error-btn {
            width: 100%;
        }

        .error-links {
            padding: clamp(1.5rem, 6vw, 1.75rem);
        }

        .quick-links {
            grid-template-columns: 1fr;
        }
    }