h1 {
    text-align: center;
}

.all-tests {
    position:relative;
    columns: 300px 3;
    gap:1rem;
}

.test {
    break-inside: avoid;

    &::before {
        content:'' !important;
    }

    & .quote {
        grid-column: 1/-1;
        position:relative;
        background-color:var(--bg_colour);
        padding:clamp(1rem,2vw,2rem);
        border-radius:1rem;
        font-style: italic;
        margin-bottom:1rem;

        &::after {
            position:absolute;
            content:url('../img/speech-part-green.svg');
            width:2rem;
            left:5rem;
            top:100%;
        }

        & p:last-child {
            margin-bottom:0;
        }
    }

    .g_theme & .quote {
        background-color:#000;
    }

    & .info {
        display:grid;
        grid-template-columns: 4rem 1fr;
        align-items: center;
        gap:1rem;
        margin-bottom:2.5rem;
    }

    & .image {
        position: relative;
        width:100%;
        aspect-ratio: 1;
        background-color:var(--yellow);
        border-radius:100%;
        overflow:hidden;
    }

    & .image:not(:has(img))::after{
        position: absolute;
        top:0;
        left:0;
        padding:1rem;
        width:calc(100% - 2rem);
        content:url('../img/person-black.svg');
    }

    & h3 {
        margin:0;
    }
}