/* ==========================
        HERO SECTION
========================== */

.hero{

    position:relative;

    width:100%;

    min-height:85vh;

    background:url("../home/school.jpeg") center center/cover no-repeat;

    display:flex;

    justify-content:center;

    align-items:center;

    text-align:center;

    overflow:hidden;
}

/* Dark overlay */

.overlay{

    position:absolute;

    top:0;
    left:0;

    width:100%;
    height:100%;

    background:rgba(0,0,0,0.55);

    z-index:1;
}

/* Content */

.hero-content{

    position:relative;

    z-index:2;

    max-width:850px;

    padding:20px;

    color:#fff;
}

.hero-content h1{

    font-size:3.5rem;

    margin-bottom:20px;

    font-weight:700;

    line-height:1.2;
}



/* ==========================
        TABLET
========================== */

@media (max-width:992px){

.hero{

    min-height:75vh;
}

.hero-content h1{

    font-size:2.8rem;
}


}

/* ==========================
        MOBILE
========================== */

@media (max-width:768px){

.hero{

    min-height:65vh;

    padding:80px 20px;
}

.hero-content h1{

    font-size:2rem;
}



}





/* admission form */

/* ==========================
      ADMISSION HEADER
========================== */

.admission-header{

    max-width:800px;

    margin:70px auto 35px;

    text-align:center;

    padding:0 20px;
}

.admission-header h1{

    font-size:2.8rem;

    color:#0F4C81;

    margin-bottom:15px;

    font-weight:700;
}

.admission-header p{

    color:#666;

    font-size:1.1rem;

    line-height:1.7;
}

/* ==========================
      FORM
========================== */

.form-container{

    max-width:700px;

    margin:0 auto 80px;

    padding:45px;

    background:#ffffff;

    border-radius:20px;

    box-shadow:0 15px 40px rgba(0,0,0,.12);

    border-top:8px solid #E91568;
}

.admission-form{

    display:flex;

    flex-direction:column;

    gap:22px;
}

.form-group{

    display:flex;

    flex-direction:column;
}

.form-group label{

    margin-bottom:8px;

    font-weight:600;

    color:#0F4C81;

    font-size:1rem;
}

.form-group input,
.form-group select{

    width:100%;

    padding:15px 18px;

    font-size:1rem;

    border:2px solid #ddd;

    border-radius:10px;

    outline:none;

    transition:.3s;

    background:#fafafa;
}

.form-group input:focus,
.form-group select:focus{

    border-color:#E91568;

    background:#fff;

    box-shadow:0 0 10px rgba(233,21,104,.18);
}

.submit-btn{

    margin-top:15px;

    padding:16px;

    border:none;

    border-radius:10px;

    background:#E91568;

    color:#fff;

    font-size:1.1rem;

    font-weight:600;

    cursor:pointer;

    transition:.3s;
}

.submit-btn:hover{

    background:#0F4C81;

    transform:translateY(-3px);

    box-shadow:0 10px 25px rgba(15,76,129,.35);
}

/* ==========================
      MOBILE
========================== */

@media(max-width:768px){

.form-container{

    margin:0 20px 60px;

    padding:30px 22px;
}

.admission-header{

    margin:50px auto 25px;
}

.admission-header h1{

    font-size:2rem;
}

.admission-header p{

    font-size:1rem;
}

.submit-btn{

    width:100%;
}

}