/* 404 page specific styles */

.min-vh-80 {
    min-height: 80vh;
    position: relative;
}

.error-bg-glow {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.error-bg-glow::before,
.error-bg-glow::after {
    content: '';
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    opacity: 0.45;
}

.error-bg-glow::before {
    background: rgba(99, 102, 241, 0.28);
    inline-size: 320px;
    block-size: 320px;
    inset-inline-start: -140px;
    inset-block-start: -110px;
}

.error-bg-glow::after {
    background: rgba(56, 189, 248, 0.28);
    inline-size: 280px;
    block-size: 280px;
    inset-inline-end: -160px;
    inset-block-end: -140px;
}

.error-number-wrapper {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.error-number {
    font-size: clamp(4.5rem, 12vw, 8rem);
    letter-spacing: 0.45rem;
    background: linear-gradient(135deg, rgba(79, 70, 229, 0.9), rgba(129, 140, 248, 0.75));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-shadow: 0 22px 40px rgba(15, 23, 42, 0.25);
    margin: 0;
}

.error-orbit {
    position: absolute;
    inline-size: 120%;
    block-size: 120%;
    border-radius: 50%;
    border: 2px dashed rgba(79, 70, 229, 0.25);
    animation: orbit-spin 12s linear infinite;
}

.error-orbit::after {
    content: '';
    position: absolute;
    inset: -8px;
    border-radius: 50%;
    border: 1px solid rgba(56, 189, 248, 0.35);
}

@keyframes orbit-spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.error-action .btn {
    min-inline-size: 180px;
}

@media (max-width: 575.98px) {
    .error-number {
        letter-spacing: 0.25rem;
    }
}