.tests-page{max-width:1366px;margin:0 auto;padding:60px 100px}.tests-page .page-title{font-weight:500;font-size:34px}.tests-page .menu{display:flex;gap:10px;margin-top:20px}.tests-page .menu button{font-family:Poppins;border-radius:20px;padding:8px 22px;background-color:#f8f9f4;border:none;font-size:16px;cursor:pointer;font-weight:400;transition:all .2s;color:#5b5b5b;position:relative}.tests-page .menu button .new{text-transform:uppercase;padding:2px 10px;border-radius:14px;font-size:11px;letter-spacing:1px;background-color:rgba(255,0,0,.747);color:#fff;animation:new 1s infinite alternate;opacity:0;position:absolute;top:-50%;transform:translateY(50%);right:0}.tests-page .menu button .new.active{opacity:1}.tests-page .menu button.active,.tests-page .menu button:hover{background-color:#ff8a00;color:#fff}.tests-page .tests-content{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:15px;gap:15px;margin-top:30px}.tests-page .tests-content .test-card{border-radius:15px;width:100%;height:350px;background-color:#f8f9f4;cursor:pointer;transition:all .3s;box-shadow:0 2px 8px rgba(0,0,0,.1)}.tests-page .tests-content .test-card:first-child .card-number,.tests-page .tests-content .test-card:first-child button{background-color:#fd8b00}.tests-page .tests-content .test-card:nth-child(2) .card-number,.tests-page .tests-content .test-card:nth-child(2) button{background-color:#ffcd00}.tests-page .tests-content .test-card:nth-child(3) .card-number,.tests-page .tests-content .test-card:nth-child(3) button{background-color:#ff3b2f}.tests-page .tests-content .test-card:nth-child(4) .card-number,.tests-page .tests-content .test-card:nth-child(4) button{background-color:#fa2f57}.tests-page .tests-content .test-card:nth-child(5) .card-number,.tests-page .tests-content .test-card:nth-child(5) button{background-color:#33acce}.tests-page .tests-content .test-card:nth-child(6) .card-number,.tests-page .tests-content .test-card:nth-child(6) button{background-color:#37aaec}.tests-page .tests-content .test-card:hover{box-shadow:0 2px 8px rgba(0,0,0,0)}.tests-page .tests-content .test-card:hover .card-bottom button span:first-child{opacity:0;transform:translateX(20px)}.tests-page .tests-content .test-card:hover .card-bottom button span:last-child{opacity:1;transform:translate(-50%,-50%)}.tests-page .tests-content .test-card .card-top{display:flex;flex-direction:column;justify-content:space-between;height:70%}.tests-page .tests-content .test-card .card-top .card-top-top{padding:22px 25px 0;display:flex;justify-content:space-between;align-items:flex-start}.tests-page .tests-content .test-card .card-top .card-top-top .card-number{width:60px;height:60px;border-radius:17px;display:flex;align-items:center;justify-content:center;font-size:36px;color:#fff;font-weight:600;transform:rotate(0deg);transition:transform .2s ease}.tests-page .tests-content .test-card .card-top .card-top-top .card-number.rotate-left{transform:rotate(-15deg)}.tests-page .tests-content .test-card .card-top .card-top-top .card-number.rotate-right{transform:rotate(15deg)}.tests-page .tests-content .test-card .card-top .card-top-top .new{text-transform:uppercase;padding:2px 10px;border-radius:14px;font-size:11px;letter-spacing:1px;background-color:rgba(255,0,0,.747);color:#fff;animation:new 1s infinite alternate;opacity:0}.tests-page .tests-content .test-card .card-top .card-top-top .new.active{opacity:1}@keyframes new{to{background-color:rgba(255,0,0,.534)}}.tests-page .tests-content .test-card .card-top .card-top-bottom{padding:0 25px 20px;border-bottom:1px solid #e5e7eb;color:#000}.tests-page .tests-content .test-card .card-top .card-top-bottom.active p span{opacity:1}.tests-page .tests-content .test-card .card-top .card-top-bottom.active p.test-count,.tests-page .tests-content .test-card .card-top .card-top-bottom.active p.test-time{transform:translateX(10px)}.tests-page .tests-content .test-card .card-top .card-top-bottom p{display:flex;align-items:center}.tests-page .tests-content .test-card .card-top .card-top-bottom p span{width:5px;height:5px;background-color:#fd8b00;border-radius:50%;position:absolute;transform:translateX(-10px);opacity:0}.tests-page .tests-content .test-card .card-top .card-top-bottom p.test-title{font-size:26px;font-weight:500;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}.tests-page .tests-content .test-card .card-top .card-top-bottom p.test-time{margin-bottom:15px}.tests-page .tests-content .test-card .card-top .card-top-bottom p.test-count,.tests-page .tests-content .test-card .card-top .card-top-bottom p.test-time{font-size:15px;color:#333}.tests-page .tests-content .test-card .card-bottom{color:#5b5b5b;padding:0 25px;height:30%;display:flex;align-items:center;font-weight:400;justify-content:center}.tests-page .tests-content .test-card .card-bottom button{padding:15px 25px;font-size:15px;border-radius:15px;cursor:pointer;border:none;color:#fff;position:relative;overflow:hidden}.tests-page .tests-content .test-card .card-bottom button span{display:block}.tests-page .tests-content .test-card .card-bottom button span:first-child{position:relative;transition:transform .3s ease}.tests-page .tests-content .test-card .card-bottom button span:last-child{position:absolute;top:50%;left:50%;transform:translate(-60%,-50%);opacity:0;transition:opacity .3s ease,transform .3s ease;width:100%;text-align:center}.tests-page .tests-content .test-card .card-bottom button:hover{opacity:.9}.modal-overlay{min-height:100vh;width:100%;position:fixed;top:0;left:0;background-color:rgba(0,0,0,.4588235294);padding:20px;display:flex;align-items:center;justify-content:center;opacity:0;z-index:-1;transition:all .3s}.modal-overlay.active{opacity:1;z-index:99}.modal-overlay .modal-content{max-width:500px;min-width:400px;background-color:#fff;padding:30px 20px;border-radius:15px;position:relative;box-shadow:0 0 5px hsla(0,0%,100%,.3411764706),0 0 10px hsla(0,0%,100%,.3411764706)}.modal-overlay .modal-content .modal-close{position:absolute;right:10px;top:10px;font-size:28px;background-color:rgba(0,0,0,0);border:none;width:30px;height:30px;border-radius:50%;cursor:pointer}.modal-overlay .modal-content .modal-close:hover{background-color:#e5e7eb}.modal-overlay .modal-content .test-confirmation-modal h2,.modal-overlay .modal-content .test-confirmation-modal p{text-align:center}.modal-overlay .modal-content .test-confirmation-modal p{margin-top:10px}.modal-overlay .modal-content .test-confirmation-modal .test-details span{color:#ff8907;font-weight:500}.modal-overlay .modal-content .modal-actions{width:100%;justify-content:center;gap:20px;display:flex;margin-top:20px}.modal-overlay .modal-content .modal-actions button{padding:10px 15px;border-radius:12px;background-color:rgba(0,0,0,0);font-size:16px;font-family:Poppins;cursor:pointer;min-width:125px}.modal-overlay .modal-content .modal-actions button.cancel-button{border:solid red;border-width:2px 2px 4px;color:red;transition:all .2s}.modal-overlay .modal-content .modal-actions button.cancel-button:active{border-bottom-width:2px;transform:translateY(2px)}.modal-overlay .modal-content .modal-actions button#st,.modal-overlay .modal-content .modal-actions button.start-button{border:solid #ff8a00;border-width:2px 2px 4px;color:#ff8a00;transition:all .2s}.modal-overlay .modal-content .modal-actions button#st:active,.modal-overlay .modal-content .modal-actions button.start-button:active{border-bottom-width:2px;transform:translateY(2px)}@keyframes shimmer{0%{background-position:-468px 0}to{background-position:468px 0}}.skeleton,.skeleton-menu .skeleton-category,.skeleton-tests .skeleton-footer .skeleton-line,.skeleton-tests .skeleton-image,.skeleton-tests .skeleton-text .skeleton-line{background:linear-gradient(90deg,#f0f0f0 8%,#e0e0e0 18%,#f0f0f0 33%);background-size:800px 104px;animation:shimmer 1.5s linear infinite;border-radius:4px}.skeleton-menu{display:flex;gap:10px;margin-bottom:20px;flex-wrap:wrap}.skeleton-menu .skeleton-category{width:100px;height:40px;border-radius:20px}.skeleton-tests{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));grid-gap:20px;gap:20px}.skeleton-tests .skeleton-test-card{background:#fff;border-radius:8px;overflow:hidden;box-shadow:0 2px 8px rgba(0,0,0,.1);height:300px}.skeleton-tests .skeleton-image{height:150px;width:100%}.skeleton-tests .skeleton-text{padding:15px}.skeleton-tests .skeleton-text .skeleton-line{height:12px;margin-bottom:8px}.skeleton-tests .skeleton-text .skeleton-line:first-child{width:80%}.skeleton-tests .skeleton-text .skeleton-line:last-child{width:60%}.skeleton-tests .skeleton-footer{padding:0 15px 15px}.skeleton-tests .skeleton-footer .skeleton-line{height:12px;width:40%}@media screen and (max-width:500px){.tests-page{padding:20px}.tests-page .page-title{font-size:24px}.tests-page .menu{flex-wrap:wrap}.tests-page .menu button{font-size:14px}.tests-page .tests-content{grid-template-columns:repeat(1,1fr)}.modal-overlay .modal-content{width:100%;max-width:unset;min-width:unset}}