/* style.css */

body{

    background:#07111f;
    color:white;
    font-family:Arial, sans-serif;
    margin:0;
    padding:0;

}

/* this keeps the page neat */

.page-space{

    width:90%;
    margin:auto;

}

/* this is the top menu */

.glass-top{

    background:rgba(10,15,30,0.8);
    backdrop-filter:blur(10px);
    padding:15px 0;
    position:sticky;
    top:0;
    z-index:1000;

}

.site-word{

    color:white;
    text-decoration:none;
    font-size:30px;
    font-weight:bold;

}

.site-word span{

    color:#60a5fa;

}

.top-word{

    color:white;
    text-decoration:none;
    margin-left:20px;
    font-size:16px;

}

.top-word:hover{

    color:#60a5fa;

}

.burger-icon{

    border:none;
    color:white;

}

/* this is the hero section */

.welcome-side{

    min-height:100vh;

    background:
    radial-gradient(circle at top left,#2563eb 0%,transparent 35%),
    radial-gradient(circle at bottom right,#9333ea 0%,transparent 35%),
    #07111f;

    display:flex;
    align-items:center;
    padding:80px 0;

}

.main-line{

    font-size:65px;
    font-weight:bold;
    line-height:1.2;
    margin-bottom:20px;

}

.small-line{

    color:#cbd5e1;
    font-size:18px;
    line-height:1.8;
    margin-bottom:30px;

}

/* hero buttons */

.blue-side{

    background:linear-gradient(to right,#2563eb,#7c3aed);
    color:white;
    border:none;
    padding:14px 28px;
    border-radius:12px;
    margin-right:10px;
    font-size:16px;

}

.blue-side:hover{

    opacity:0.9;

}

.clear-side{

    background:transparent;
    border:2px solid #60a5fa;
    color:#60a5fa;
    padding:12px 26px;
    border-radius:12px;

}

.clear-side:hover{

    background:#60a5fa;
    color:white;

}

/* this is the image side */

.picture-space{

    position:relative;

}

.student-pic{

    width:100%;
    border-radius:25px;
    box-shadow:0px 10px 40px rgba(0,0,0,0.4);

}

/* floating card */

.pop-card{

    position:absolute;
    bottom:20px;
    left:-20px;

    background:#111827;

    padding:18px;

    border-radius:18px;

    display:flex;
    align-items:center;
    gap:15px;

    box-shadow:0px 10px 30px rgba(0,0,0,0.4);

}

.pop-card i{

    font-size:35px;
    color:#60a5fa;

}

.pop-card h5{

    margin:0;
    font-size:18px;

}

.pop-card p{

    margin:0;
    color:#9ca3af;

}

/* this is the quick cards */

.quick-side{

    padding:90px 0;

}

.soft-box{

    background:#111827;

    padding:35px;

    border-radius:25px;

    text-align:center;

    height:100%;

    transition:0.3s;

    border:1px solid rgba(255,255,255,0.05);

}

.soft-box:hover{

    transform:translateY(-10px);

}

.soft-box i{

    width:80px;
    height:80px;

    background:linear-gradient(to right,#2563eb,#9333ea);

    border-radius:50%;

    display:flex;
    align-items:center;
    justify-content:center;

    margin:auto;
    margin-bottom:20px;

    font-size:30px;

}

.soft-box h3{

    margin-bottom:15px;

}

.soft-box p{

    color:#cbd5e1;
    line-height:1.7;

}

/* section titles */

.title-side{

    text-align:center;
    margin-bottom:50px;

}

.title-side h2{

    font-size:45px;
    font-weight:bold;

}

.title-side p{

    color:#9ca3af;

}

/* bursary section */

.money-side{

    padding:90px 0;

}

.finder-box{

    background:#111827;

    padding:30px;

    border-radius:25px;

    margin-bottom:40px;

}

/* form look */

.dark-look{

    background:#1f2937 !important;

    border:none !important;

    color:white !important;

    padding:14px !important;

}

.dark-look:focus{

    box-shadow:none !important;

}

/* search button */

.find-btn{

    width:100%;

    background:linear-gradient(to right,#2563eb,#9333ea);

    border:none;

    color:white;

    padding:14px;

    border-radius:12px;

    font-size:16px;

}

.find-btn:hover{

    opacity:0.9;

}

/* results card */

.answer-box{

    background:#111827;

    padding:25px;

    border-radius:20px;

    margin-bottom:20px;

}

.answer-box h3{

    margin-bottom:15px;

}

.answer-box p{

    color:#cbd5e1;

}

/* tags */

.small-tag{

    display:inline-block;

    background:#1e3a8a;

    padding:6px 14px;

    border-radius:20px;

    margin-right:8px;

    font-size:13px;

}

/* university area */

.campus-side{

    padding:90px 0;

}

.campus-box{

    background:#111827;

    border-radius:20px;

    overflow:hidden;

    transition:0.3s;

}

.campus-box:hover{

    transform:translateY(-8px);

}

.campus-pic{

    width:100%;

    height:250px;

    object-fit:cover;

}

.campus-text{

    padding:20px;

}

.campus-text p{

    color:#cbd5e1;

}

/* footer */

.end-side{

    background:#030712;

    padding:70px 0 20px;

}

.end-side h3,
.end-side h4{

    margin-bottom:20px;

}

.end-side p{

    color:#9ca3af;

}

.end-side a{

    display:block;

    color:#9ca3af;

    text-decoration:none;

    margin-bottom:10px;

}

.end-side a:hover{

    color:#60a5fa;

}

/* copyright text */

.tiny-text{

    text-align:center;

    margin-top:40px;

    border-top:1px solid rgba(255,255,255,0.1);

    padding-top:20px;

    color:#6b7280;

}

/* mobile design */

@media(max-width:768px){

    .main-line{

        font-size:42px;
        text-align:center;

    }

    .small-line{

        text-align:center;

    }

    .welcome-side{

        text-align:center;

    }

    .student-pic{

        margin-top:40px;

    }

    .pop-card{

        left:10px;
        bottom:10px;

    }

    .blue-side,
    .clear-side{

        width:100%;
        margin-bottom:15px;

    }

}