@charset "utf-8";

/*seção erro*/
.error .focus-container {
    align-items: center;
}

.error .content-block {
    width: 100%;
    max-width: var(--max-box-1);
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    gap: 30px 0px;
}

@media (min-width: 768px) and (max-width: 1024px) {
    .error .content-block {
        max-width: var(--max-box-2);
    }
}

@media (min-width: 0px) and (max-width: 767px) {
    .error .content-block {
        max-width: 100%;
    }
}

.error .text-block {
    width: 100%;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    gap: 10px 0px;
}

.error .text-block h1 {
    width: 100%;
    text-align: center;
    color: var(--text-color-1);
    font-size: 60px;
    line-height: 60px;
}

.error .text-block h2 {
    width: 100%;
    text-align: center;
    color: var(--text-color-1);
}

.error .image-block {
    width: 100%;
    max-width: var(--max-box-1);
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    gap: 20px 0px;
}

@media (min-width: 768px) and (max-width: 1024px) {
    .error .image-block {
        max-width: var(--max-box-2);
    }
}

@media (min-width: 0px) and (max-width: 767px) {
    .error .image-block {
        max-width: 100%;
    }
}

.error .image-block .image {
    width: 100%;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    gap: 0;
}

.error .image-block .image img {
    width: 314px;
    height: auto;
    aspect-ratio: 314 / 358;
    animation: float 1.8s infinite alternate;
}

.error .image-block .image-shadow {
    width: 314px;
    height: 45px;
    background: #ff9e0026;
    border-radius: 100%;
    filter: blur(5px);
    animation: shadow 1.8s infinite alternate;
}

@keyframes float {
    0% {
        transform: translateY(0);
    }

    100% {
        transform: translateY(15px);
    }
}

@keyframes shadow {
    0% {
        transform: scale(1.1);
    }

    100% {
        transform: scale(.85, .85);
    }
}

/*fim: seção erro*/