/* QCMS PRO CARD SEARCH STYLE */


.search-page {

    padding:60px;

    text-align:center;

}



.search-page h1 {

    font-size:55px;

    margin-bottom:20px;

}



.search-page > p {

    color:#999;

    font-size:20px;

    margin-bottom:50px;

}





.search-container {

    display:flex;

    justify-content:center;

    gap:15px;

    margin-bottom:60px;

}



.search-container input {


    width:600px;

    padding:20px;

    border-radius:15px;

    background:#0b0b0b;

    border:1px solid #333;

    color:white;

    font-size:18px;


}



.search-container button {


    padding:20px 40px;

    border:none;

    border-radius:15px;

    background:#00ff88;

    color:#000;

    font-weight:bold;

    cursor:pointer;


}





.search-result {


    max-width:900px;

    margin:auto;

}



.result-card {


    display:flex;

    gap:40px;

    align-items:center;


    background:rgba(255,255,255,.05);

    border:1px solid rgba(255,255,255,.12);

    border-radius:25px;

    padding:35px;

    text-align:left;

    backdrop-filter:blur(15px);


}




.result-card img {


    width:220px;

    height:320px;

    object-fit:contain;

    border-radius:20px;

    background:#080808;


}




.result-info h2 {


    font-size:30px;

    margin-bottom:25px;


}



.result-info p {


    color:#aaa;

    margin:15px 0;


}



.score {


    color:#00ff88;


}



.result-info a {


    display:inline-block;

    margin-top:25px;

    padding:15px 25px;

    background:#00ff88;

    color:#000;

    text-decoration:none;

    border-radius:12px;

    font-weight:bold;


}




.result-card:hover {


    transform:translateY(-8px);

    border-color:#00ff88;


}





@media(max-width:900px){


.search-page {

padding:25px;

}



.search-page h1 {

font-size:38px;

}



.search-container {


flex-direction:column;


}



.search-container input {


width:100%;


}



.result-card {


flex-direction:column;

text-align:center;


}



}