.img-prd{width:100%;height:100%;border-radius:1.5rem;object-fit:contain}.card__article{position:relative;overflow:hidden;box-shadow:1px 1px 14px -6.8px;border-radius:16px;width:300px;height:300px;padding:20px;object-fit:contain;background-color:#fff;margin:20px}.card__data{width:280px;background-color:#fff;padding:16px;box-shadow:0 8px 24px rgba(0,0,0,.15);border-radius:1rem;position:absolute;bottom:-9rem;left:0;right:0;margin-inline:auto;opacity:0;transition:opacity 1s 1s}.card__description{display:block;margin-bottom:.25rem}.card__title{font-size:20px;font-weight:500;color:red;margin-bottom:.75rem}.card__button{text-decoration:none;font-size:12px;font-weight:500;color:blue}.card__button:hover{text-decoration:underline}.card__article:hover .card__data{animation:show-data 1s forwards;opacity:1;transition:opacity .3s}.card__article:hover{animation:remove-overflow 2s forwards;transform:scale(1.1);transition:all .3s ease-in-out}.card__article:not(:hover){animation:show-overflow 2s forwards}.card__article:not(:hover) .card__data{animation:remove-data 1s forwards}@keyframes show-data{50%{transform:translateY(-10rem)}to{transform:translateY(-7rem)}}@keyframes remove-overflow{to{overflow:initial}}@keyframes remove-data{0%{transform:translateY(-7rem)}50%{transform:translateY(-10rem)}to{transform:translateY(.5rem)}}@keyframes show-overflow{0%{overflow:initial;pointer-events:none}50%{overflow:hidden}}@media screen and (min-width:1120px){.card__data{width:270px}}@media screen and (max-width:1030px){.product-11{padding:40px 0}.card__data{width:210px}}@media screen and (max-width:830px){.card__article{height:200px}.card__data{width:150px}}@media screen and (max-width:630px){.card__article{height:150px}.card__data{width:100px}.card__title{font-size:14px}.card__button{font-size:10px}}@media screen and (max-width:530px){.prd-22{flex-wrap:wrap}.card__data{width:200px}}