.agents-list {
    padding: 20px 20px 60px;

    display: flex;
    flex-direction: column;
    gap: 60px;
}

.agents-container {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.agent-card {
    background-color: var(--lighter-grey);
    padding: 20px;
    border-radius: 6px;
}

.agent-card *:last-child {
    display: block;
    margin-top: 20px;
}



@media (min-width: 1024px) {
    .agents-list {
        padding-block: 56px 60px;
    }

    .agents-container {
        width: 100%;
        margin: 0 auto;
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(407px, 1fr));

    }
}

@media (min-width: 1280px) {
    .agents-list {
        padding-inline: 120px;
    }
}
