/* ── TEST GRID ────────────────────────────────────── */

.test-grid {

    display: grid;

    grid-template-columns:
        repeat(3, 1fr);

    gap: 16px;

    margin-top: 50px;

}

/* ── CARD ─────────────────────────────────────────── */

.test-card {

    background: var(--bg2);

    border:
        1px solid var(--border);

    border-radius: 18px;

    padding: 26px;

    transition: all 0.25s;

}

.test-card:hover {

    border-color:
        rgba(249,115,22,0.25);

    transform: translateY(-3px);

}

/* ── STARS ────────────────────────────────────────── */

.test-stars {

    font-size: 14px;

    margin-bottom: 14px;

    color: var(--gold);

}

/* ── QUOTE ────────────────────────────────────────── */

.test-quote {

    font-size: 14px;

    color: var(--text2);

    line-height: 1.7;

    margin-bottom: 20px;

    font-style: italic;

}

/* ── AUTHOR ───────────────────────────────────────── */

.test-author {

    display: flex;

    align-items: center;

    gap: 12px;

}

/* ── AVATAR ───────────────────────────────────────── */

.test-avatar {

    width: 40px;
    height: 40px;

    border-radius: 50%;

    display: flex;

    align-items: center;
    justify-content: center;

    font-family: 'Syne', sans-serif;

    font-size: 15px;

    font-weight: 800;

    color: #fff;

    flex-shrink: 0;

}

/* COLORS */

.avatar-orange {

    background:
        linear-gradient(
            135deg,
            #f97316,
            #c2410c
        );

}

.avatar-green {

    background:
        linear-gradient(
            135deg,
            #22c55e,
            #15803d
        );

}

.avatar-blue {

    background:
        linear-gradient(
            135deg,
            #6366f1,
            #4338ca
        );

}

/* ── NAME ─────────────────────────────────────────── */

.test-name {

    font-family: 'Syne', sans-serif;

    font-size: 14px;

    font-weight: 700;

}

/* ── ROLE ─────────────────────────────────────────── */

.test-role {

    font-size: 11px;

    color: var(--muted2);

    margin-top: 2px;

}