/* ===========================
   NOVA ADMISSION FORM
=========================== */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{
    font-family:Arial,Helvetica,sans-serif;
    background:#f5f7fb;
}

.nova-form{
    width:100%;
}

.nova-wrapper{

    max-width:1250px;

    margin:40px auto;

    background:#fff;

    border-radius:15px;

    padding:35px;

    box-shadow:0 10px 35px rgba(0,0,0,.08);

}

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

.nova-header{

    display:flex;

    align-items:center;

    gap:30px;

    margin-bottom:35px;

}

.logo-area{

    width:170px;

    text-align:center;

}

.logo-area img{

    width:150px;

}

.title-area{

    flex:1;

    text-align:center;

}

.title-area h1{

    font-size:62px;

    color:#07285d;

    font-weight:800;

    line-height:1;

}

.title-area h2{

    color:#1d64c7;

    font-size:52px;

    line-height:1.1;

    margin-bottom:18px;

    font-weight:700;

}

.course-title{

    display:inline-block;

    background:#07285d;

    color:#fff;

    padding:12px 45px;

    border-radius:8px;

    font-size:28px;

    font-weight:bold;

    letter-spacing:1px;

}

.title-area p{

    margin-top:22px;

    color:#555;

    font-size:18px;

    line-height:1.7;

}

/*======================
GRID
======================*/

.nova-grid{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:30px;

}

.left-column,
.right-column{

    display:flex;

    flex-direction:column;

    gap:25px;

}

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

.section{

    border:2px solid #0d4ea2;

    border-radius:15px;

    padding:55px 25px 25px;

    background:#fff;

    position:relative;

}

.full-width{

    grid-column:1/-1;

}

.section-title{

    position:absolute;

    left:18px;

    top:-18px;

    background:#0b4ea2;

    color:#fff;

    padding:10px 22px;

    border-radius:8px;

    font-size:22px;

    font-weight:bold;

    display:flex;

    align-items:center;

    gap:12px;

}

.section-title{

    position:relative;

    top:0;

    left:0;

    width:100%;

    margin-bottom:20px;

    border-radius:10px;

    font-size:18px;

}

.section-title span{

    background:#fff;

    color:#0b4ea2;

    width:34px;

    height:34px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    font-weight:bold;

}

/*======================
FIELDS
======================*/

.field{

    margin-top:20px;

}

.field label{

    display:block;

    margin-bottom:8px;

    font-size:17px;

    color:#222;

    font-weight:600;

}

.field span{

    color:#e60000;

}

.field input[type=text],
.field input[type=email],
.field input[type=password],
.field input[type=number],
.field textarea{

    width:100%;

    border:1px solid #c8d4e6;

    border-radius:8px;

    padding:13px 15px;

    font-size:16px;

    transition:.3s;

    outline:none;

}

.field textarea{

    resize:vertical;

    min-height:120px;

}

.field input:focus,
.field textarea:focus{

    border-color:#0d4ea2;

    box-shadow:0 0 0 3px rgba(13,78,162,.15);

}

/*=====================
RADIOS
=====================*/

.radio-group{

    display:flex;

    flex-direction:column;

    gap:10px;

}

.radio-inline{

    display:flex;

    gap:40px;

    flex-wrap:wrap;

}

.radio-group label,
.radio-inline label{

    display:flex;

    align-items:center;

    gap:8px;

    cursor:pointer;

    font-size:16px;

}

input[type=radio]{

    width:18px;

    height:18px;

}

/*======================
UPLOAD
======================*/

input[type=file]{

    width:100%;

    padding:14px;

    border:2px dashed #0d4ea2;

    border-radius:10px;

    background:#f8fbff;

}

/*====================================
DECLARATION
====================================*/

.declaration{

    margin-top:35px;

    border:2px solid #d8d8d8;

    border-radius:12px;

    padding:22px;

    background:#fff;

}

.declaration label{

    display:flex;

    align-items:flex-start;

    gap:15px;

    font-size:17px;

    color:#222;

    line-height:28px;

}

.declaration input{

    width:22px;

    height:22px;

    margin-top:3px;

}


/*====================================
SUBMIT BUTTON
====================================*/

.submit-area{

    text-align:center;

    margin-top:35px;

}

.submit-btn{

    background:#07285d;

    color:#fff;

    border:none;

    border-radius:10px;

    padding:18px 70px;

    font-size:26px;

    font-weight:700;

    cursor:pointer;

    transition:.3s;

    letter-spacing:.5px;

    box-shadow:0 12px 25px rgba(7,40,93,.25);

}

.submit-btn:hover{

    background:#0b4ea2;

    transform:translateY(-2px);

}


/*====================================
SMALL TEXT
====================================*/

small{

    display:block;

    color:#666;

    margin-top:8px;

    font-size:14px;

}


/*====================================
PLACEHOLDER
====================================*/

::placeholder{

    color:#9aa4b3;

}


/*====================================
INPUT HOVER
====================================*/

input:hover,
textarea:hover{

    border-color:#0b4ea2;

}


/*====================================
FILE BUTTON
====================================*/

input[type=file]::file-selector-button{

    background:#0b4ea2;

    color:#fff;

    border:none;

    padding:10px 18px;

    border-radius:6px;

    margin-right:15px;

    cursor:pointer;

}


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

@media(max-width:991px){

.nova-grid{

grid-template-columns:1fr;

}

.nova-header{

flex-direction:column;

text-align:center;

}

.logo-area{

width:100%;

}

.title-area h1{

font-size:42px;

}

.title-area h2{

font-size:34px;

}

.course-title{

font-size:20px;

padding:10px 25px;

}

.section{

padding:18px;

}

.section-title{

font-size:18px;

}

.radio-inline{

gap:18px;

}

.submit-btn{

width:100%;

font-size:20px;

padding:16px;

}

}


/*====================================
PHONE
====================================*/

@media(max-width:576px){

.nova-wrapper{

padding:15px;

margin:15px;

}

.title-area h1{

font-size:30px;

}

.title-area h2{

font-size:24px;

}

.title-area p{

font-size:14px;

}

.field label{

font-size:15px;

}

.field input,
.field textarea{

font-size:15px;

}

.section-title{

left:10px;

}

}

/* ==================================
SECTION ICON
================================== */

.section-title i{

    font-size:18px;

    color:#fff;

    margin-right:2px;

}

.section-title{

    display:flex;

    align-items:center;

    gap:10px;

}

/* ==================================
NUMBER CIRCLE
================================== */

.section-title span{

    width:36px;

    height:36px;

    border-radius:50%;

    background:#fff;

    color:#0b4ea2;

    display:flex;

    align-items:center;

    justify-content:center;

    font-weight:700;

    font-size:17px;

    flex-shrink:0;

}

/* ==================================
INPUT LOOK
================================== */

.field input,
.field textarea{

    background:#fff;

}

.field input[type=text],
.field input[type=email],
.field input[type=password],
.field input[type=number],
.field textarea{

    border:1px solid #d8dfe9;

}

.field input:focus,
.field textarea:focus{

    border-color:#0b4ea2;

}

/* ==================================
RADIOS
================================== */

input[type=radio]{

    accent-color:#0b4ea2;

}