.comp{position:relative;border-radius:10px;box-sizing:border-box;background-color:var(--light-grey);display:grid;grid-gap:20px;gap:20px;grid-template-columns:repeat(2,1fr);cursor:pointer;transition:.3s}.comp:hover{background-color:var(--button-hover)}.comp .pic{aspect-ratio:7/9;width:100%}.comp .pics{overflow:hidden;bottom:19px;left:19px;position:absolute;display:flex;gap:20px;width:calc(100% - 38px);height:calc(100% - 88px)}.comp .block .compName{position:absolute;top:19px;left:19px}.comp .pic:nth-child(4){display:none}.comp .block{aspect-ratio:7/9}.comp .name{font-weight:500;font-size:18px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden;text-overflow:ellipsis;white-space:normal}.comp .num{color:var(--grey);font-size:15px;font-weight:500}@media (max-width:1150px){.comp{grid-template-columns:repeat(3,1fr)}.comp .pics{grid-template-columns:repeat(4,1fr)}.comp .pic:nth-child(4){display:block}}@media (max-width:850px){.comp{grid-template-columns:repeat(2,1fr)}.comp .pics{grid-template-columns:repeat(3,1fr)}.comp .pic:nth-child(4){display:none}}@media (max-width:550px){.comp .pics{bottom:12px;left:12px;gap:10px;width:calc(100% - 24px);height:calc(100% - 66px)}.comp .block .compName{top:12px;left:12px}.comp:hover{background-color:var(--bg-contrast)}.comp .num{font-size:12px}.comp .name{font-size:14px}}