.achievements-slider { position: relative; overflow: hidden; -webkit-mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent); mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent); } .swiper-container { width: 100%; overflow: hidden; position: relative; } .swiper-wrapper { display: flex; animation: scrollLeft 30s linear infinite; } .swiper-slide { flex-shrink: 0; width: auto; } .achievement-item { width: 250px; min-height: 250px; background-color: #fff; border-radius: 8px; display: flex; flex-direction: column; justify-content: center; align-items: center; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); margin-right: 40px; padding: 15px; text-align: center; } .achievement-box img { width: 80px; height: 80px; margin-bottom: 12px; object-fit: contain; } .achievement-item h2 { font-size: 18px; margin-bottom: 6px; } .achievement-item p { font-size: 14px; font-weight: 600; line-height: 1.4; color: #333; } .btn-lg-square { border-radius: 50%; } @media (max-width: 991px) { .achievement-item { width: 220px; min-height: 230px; margin-right: 25px; padding: 12px; } .achievement-item h2 { font-size: 16px; } .achievement-item p { font-size: 13px; } } @media (max-width: 576px) { .achievement-item { width: 180px; min-height: 210px; margin-right: 16px; padding: 10px; } .achievement-box img { width: 60px; height: 60px; } .achievement-item h2 { font-size: 15px; } .achievement-item p { font-size: 12px; } .swiper-wrapper { animation-duration: 40s; } } @keyframes scrollLeft { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }