.template--404 {
    padding: 0 80px 80px;
    .error--text {
        font-size: 120px;
        text-align: center;
        color: var(--farallon-text-gray);
    }
}

.error--posts {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 20px;
}

.post--error {
    border: 1px solid var(--farallon-border-color);
    padding: 15px;
    border-radius: 10px;
    .post--title {
        font-size: 18px;
        font-weight: bold;
        line-height: 1.3;
        margin-bottom: 10px;
    }
    .meta {
        font-size: var(--farallon-text-size-smallest);
        color: var(--farallon-text-gray-lightest);
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        time {
            display: flex;
            align-items: center;
        }
        svg {
            margin-right: 4px;
            fill: var(--farallon-text-gray-lightest);
            margin-left: 10px;
            &:first-child {
                margin-left: 0;
            }
        }
        a {
            &:hover {
                text-decoration: underline;
            }
        }
    }
}
