.product-row {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 2rem;
}

.product-row > .detail-container {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.product-row > .detail-container > img {
    width: 6rem;
    height: 6rem;
    object-fit: cover;
    border-radius: 0.5rem;
}

.product-row > .detail-container > .text-container {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.product-row > .detail-container > .text-container > .title {
    font-weight: bold;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
}

.product-row > .detail-container > .text-container > .description {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    overflow: hidden;
    text-overflow: ellipsis;
}

.product-row > .counts-container {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: center;
    gap: 1rem;
}

.product-row > .counts-container > .count-container {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.product-row > .counts-container > .count-container > .count {
    white-space: nowrap;
}

.product-row > .link-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.product-row > .link-container > .link {
    white-space: nowrap;
}

@container (min-width: 60rem) {
    .product-row {
        flex-direction: row;
        gap: 4rem;
    }

    .product-row > .counts-container > .count-container {
        justify-content: flex-end;
    }
}