.student-item {
    display: flex;
    flex-wrap: wrap;
}

.student-photo {
    width: 100%;       /* Fill the column */
    height: auto;      /* Keep aspect ratio */
    max-width: 180px;  /* Optional: max size */
    border-radius: 8px;
    object-fit: cover;
}

.student-item p {
    margin: 0;
    line-height: 1.2;
}

/* Two columns layout on larger screens */
@media (min-width: 768px) {
    .students-list {
        display: flex;
        flex-wrap: wrap;
        gap: 20px;
    }
    .student-item {
        flex: 0 0 48%; /* two items per row */
        margin-bottom: 20px;
    }
}

/* One column for smaller screens */
@media (max-width: 767px) {
    .student-item {
        flex: 0 0 100%;
    }
}