.hero-container{flex-direction:column;justify-content:space-between;align-items:center;gap:5px;width:95%;height:fit-content;margin-top:10px;display:flex}.upper-hero-container{background-color:#292b30;border-radius:12px;align-items:center;width:100%;height:500px;display:flex;position:relative}.upper-hero-container img,.first-image img,.second-image img{height:inherit;object-fit:cover;border-radius:inherit;width:100%;position:absolute}.lower-hero-container{border-radius:18px;justify-content:space-between;align-items:center;gap:10px;width:100%;display:none}.lower-image-holder{background-color:#292b30;background-position:50%;background-size:cover;border-radius:15px;flex:1;align-items:flex-end;height:280px;display:flex;position:relative;overflow:hidden}.hero-info{z-index:8;color:#fff;border-radius:12px;flex-direction:column;gap:16px;max-width:500px;margin-left:10px;padding:20px 24px;display:flex}.hero-header{text-align:left;-webkit-line-clamp:2;text-overflow:ellipsis;-webkit-box-orient:vertical;font-size:2.2rem;font-weight:700;line-height:1.3;display:-webkit-box;overflow:hidden}.hero-desc{color:#cfd1d4;text-align:left;-webkit-line-clamp:3;text-overflow:ellipsis;-webkit-box-orient:vertical;font-size:.95rem;line-height:1.6;display:-webkit-box;overflow:hidden}.hero-buttons{align-items:center;gap:14px;display:flex}.hero-button{background:linear-gradient(135deg, var(--accent), var(--accent-hover));cursor:pointer;border-radius:8px;justify-content:center;align-items:center;height:44px;padding:.6rem 1.6rem;font-size:1rem;font-weight:600;transition:transform .2s,box-shadow .2s;display:flex;box-shadow:0 4px 12px #00000059}.hero-button:hover{transform:translateY(-2px);box-shadow:0 6px 16px #00000073}.add-to-library{border:2px solid var(--accent);color:var(--accent);cursor:pointer;border-radius:8px;padding:.6rem 1.4rem;font-size:.95rem;font-weight:600;transition:background .3s,color .3s,transform .2s}.add-to-library:hover{background:var(--accent);color:#fff;transform:translateY(-2px)}.card-overlay{color:#fff;z-index:8;background:linear-gradient(#0003,#000000bf);justify-content:space-between;align-items:flex-end;gap:10px;width:100%;padding:8px 12px;display:flex}.card-text{flex-direction:column;display:flex}.card-title{text-align:left;-webkit-line-clamp:1;text-overflow:ellipsis;-webkit-box-orient:vertical;font-size:1rem;font-weight:600;display:-webkit-box;overflow:hidden}.card-subtitle{text-align:left;color:#cfd1d4;font-size:.85rem}.card-button{color:#000;white-space:nowrap;cursor:pointer;background:#fff;border-radius:6px;padding:10px 14px;font-size:.85rem;font-weight:600;transition:background .2s,transform .2s}.shade{border-radius:inherit;background-color:#0000007d;width:100%;height:100%;position:absolute}.card-button:hover{background:#f0f0f0;transform:translateY(-2px)}@media (max-width:808px){.upper-hero-container{border-radius:5px;width:98%;height:260px;background-color:#292b30!important}.hero-header{font-size:18px}.hero-info{gap:10px;margin-top:25px;padding-left:10px}.hero-desc{width:230px;font-size:10px}.hero-button{height:38px;padding:12px 13px;font-size:12px}.add-to-library{justify-content:center;align-items:center;height:38px;padding:12px 13px;display:flex}.lower-hero-container{gap:5px;display:flex}.lower-image-holder{border-radius:5px;height:130px}.card-subtitle{font-size:12px}.card-overlay{gap:0;padding:8px 4px}.card-button{align-self:center;padding:5px 7px}.card-title{font-size:16px}}@media (max-width:450px){.card-subtitle{font-size:9px}.card-title{font-size:12px}.card-button{border-radius:2px;padding:5px 6px;font-size:12px}.upper-hero-container{height:260px}.lower-image-holder{height:130px}}@media (max-width:750px) and (min-width:480px){.upper-hero-container{height:370px}.lower-image-holder{height:165px}}