.item-list{display:grid;grid-template-columns:repeat(3,1fr)}.list-card{width:320px;transition:width .3s,margin .3s;transform-origin:center center;position:relative}.details-card{width:700px;margin:auto}.card{perspective:1000px;position:relative;width:100%;aspect-ratio:3/4.5}.list-card:hover{width:330px;margin:-5px -5px -10px}.card-container{width:100%;height:100%;min-width:none;display:flex;flex-direction:column;align-items:center;justify-content:space-between;transition:opacity .3s}.list-card:hover .card-container{opacity:.4}.card>img{position:absolute;top:0;left:0;height:100%;width:100%}.card-section{max-width:100%;width:90%;min-width:0;position:relative}.top-section{min-height:20%;display:flex;flex-direction:row;justify-content:space-between;color:var(--text-primary);overflow:hidden;margin-top:16px}.details-card .top-section{margin-top:36px}.item-thumbnail{height:56%;top:8px;align-items:center;justify-content:center;display:flex}.bottom-section{height:16%;display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:8px}.name{font-size:1.5vw;width:50%;height:80%;align-items:center;justify-content:center;overflow:hidden}.details-card .name{font-size:3.4vw;height:100%}.details-card .name p{line-height:5vw}.name p{display:-webkit-box;text-align:center;max-width:100%;line-height:1.6vw;line-clamp:2;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.perk{display:flex;width:20%;height:56%;align-items:center;justify-content:center}.perk p{text-align:center;height:-moz-fit-content;height:fit-content;font-size:1.8rem;color:var(--text-secondary)}.details-card .perk p{font-size:4vw}.illustrated{width:40%;padding:0 16px;display:flex;flex-direction:row;justify-content:space-evenly;align-items:center}.perks-icon-container{margin-top:4px;width:25%;aspect-ratio:1/1;display:flex;justify-content:center;align-items:center}.perks-icon{width:100%;height:auto;color:var(--text-secondary);font-size:130%}.description{width:100%;max-height:96%;padding:8px 16px;margin-bottom:8px;overflow-y:scroll}.description p{font-size:1.5vw;text-align:justify;overflow-wrap:break-word;word-break:break-word;max-height:100%;overflow:scroll}.add-cart-container{position:absolute;top:40%;left:35%;opacity:0;transition:opacity .3s;z-index:20}.add-cart-container svg{fill:var(--text-secondary);transition:fill .3s}.add-cart-container:hover svg{fill:var(--text-primary)}.add-cart-container>a{display:inline}.list-card:hover .add-cart-container{opacity:1}