/* ---------- WAVES ---------- */


.waves{
    position:fixed;
    inset:0;
    z-index:0;
    opacity:.14;
}


.waves svg{
    width:100%;
    height:100%;
}


.wave{
    fill:none;
    stroke:#3fbaeb;
    stroke-width:.5;
}


.wave1{
    animation:
    drift 20s ease-in-out infinite alternate;
}


.wave2{
    animation:
    drift 30s ease-in-out infinite alternate-reverse;
}


.wave3{
    animation:
    drift 35s ease-in-out infinite alternate;
}



@keyframes drift{

from{
    transform:translateX(-30px);
}

to{
    transform:translateX(30px);
}

}



/* ---------- HERO ---------- */


.logo{
    height:130px;
    margin:auto;
    margin-bottom:25px;
}


.statement{
    font-size:1.3rem;
    line-height:1.7;
    font-weight:300;
    color:#f5f7fa;
}


.highlight{
    color:#3fbaeb;
}



.subtext{
    max-width:700px;
    margin:30px auto 0;

    color:#8aa9b8;

    line-height:1.8;
    font-size:1rem;
}



/* ---------- PAGES ---------- */


.page-content h1{

    font-size:2.4rem;
    font-weight:400;

    margin-bottom:30px;

    color:#f5f7fa;
}



.page-content p{

    color:#8aa9b8;

    font-size:1.05rem;
    line-height:1.9;

    margin-bottom:20px;
}



.page-content ul{

    margin:25px 0;

}



.page-content li{

    color:#8aa9b8;

    margin:12px 0;

    font-size:1rem;
}




/* ---------- FOOTER ---------- */


footer{

    position:absolute;

    bottom:10px;
    left:0;

    width:100%;

    text-align:center;

    z-index:20;

    color:#607b89;

    font-size:.8rem;
}



.disclaimer{

    max-width:900px;

    margin:auto;

    padding:0 20px;

    margin-bottom:15px;

    line-height:1.6;

    font-size:.75rem;

}






/* ==========================
   RESEARCH PAGE
========================== */


.research-page{

position:absolute;
inset:0;
z-index:5;
padding:
135px 60px 100px;
display:flex;
flex-direction:column;
align-items:center;
overflow:auto;
}

.research-header{
max-width:900px;
text-align:center;
margin-bottom:55px;
}

.research-header h1{
font-size:2.5rem;
font-weight:400;
color:#f5f7fa;
margin-bottom:20px;
}



.research-header p{
color:#8aa9b8;
line-height:1.8;
font-size:1rem;

}





.research-grid{
width:100%;
max-width:1100px;
display:grid;
grid-template-columns:
repeat(2,1fr);
gap:30px;
}

.research-card{
min-height:260px;
padding:35px;
display:flex;
flex-direction:column;
justify-content:space-between;

border:

0.3px solid rgba(63,186,235,.25);

border-radius:20px;


backdrop-filter:blur(12px);
transition:.25s;
}

.research-card:hover{
transform:
translateY(-6px);
border-color:#3fbaeb;
box-shadow:
0 20px 40px rgba(0,0,0,.35);
}




.research-card h2{
font-size:1.25rem;
font-weight:400;
color:#f5f7fa;
margin-bottom:15px;
}



.research-card p{
color:#8aa9b8;
font-size:.9rem;
line-height:1.7;
}




.research-card a{
margin-top:25px;
color:#3fbaeb;
font-size:.9rem;
transition:.3s;
}



.research-card a:hover{
letter-spacing:.3px;

}

/* ==========================
   CAREERS ORIGINAL STYLE
========================== */

.careers{
    position:absolute;
    inset:0;
    z-index:5;
    padding:130px 80px 100px;
    overflow:auto;
}

.careers-intro{
    max-width:850px;
    margin-bottom:70px;
}

.eyebrow{
    color:#3fbaeb;
    letter-spacing:3px;
    font-size:.75rem;
    margin-bottom:20px;
}

.careers-intro h1{
    font-size:3rem;
    font-weight:300;
    line-height:1.2;
    color:#f5f7fa;
    margin-bottom:25px;
}

.careers-intro p:not(.eyebrow){
    color:#8aa9b8;
    max-width:650px;
    line-height:1.8;
}

.roles{
    max-width:1100px;
}

.role{
    display:grid;
    grid-template-columns:90px 1fr 120px;
    align-items:center;
    padding:35px 0;
    border-top:1px solid rgba(63,186,235,.25);
    transition:.3s;
}

.role:last-child{
    border-bottom:1px solid rgba(63,186,235,.25);
}

.role:hover{
    padding-left:20px;
}

.role-number{
    font-size:2rem;
    color:#3fbaeb;
    font-weight:300;
}

.role-content h2{
    color:#f5f7fa;
    font-size:1.35rem;
    font-weight:400;
    margin-bottom:10px;
}

.role-content p{
    color:#8aa9b8;
    line-height:1.7;
    font-size:.95rem;
    max-width:650px;
}

.role a{
    color:#3fbaeb;
    text-align:right;
    font-size:.9rem;
    position:relative;
    display:inline-block;
    transition:color .25s ease;
}



.role a:hover{
    color:#7dd8ff;
}

.role a:hover::after{
    width:100%;
}

.careers-footer{
    margin-top:60px;
    color:#8aa9b8;
    font-size:1rem;
}

.careers-footer span{
    color:#3fbaeb;
    margin-left:10px;
}




/* ==========================
CONTACT
========================== */


.contact-page{

position:absolute;
inset:0;

z-index:5;

padding:130px 30px 100px;

display:flex;
flex-direction:column;
align-items:center;

overflow:auto;

}



.contact-intro{

text-align:center;

max-width:700px;

margin-bottom:45px;

}



.contact-intro span{

color:#3fbaeb;

letter-spacing:3px;

font-size:.75rem;

}



.contact-intro h1{

font-size:3rem;

font-weight:300;

color:#f5f7fa;

margin:20px 0;

}



.contact-intro p{

color:#8aa9b8;

}



.contact-form{

width:100%;

max-width:850px;

padding:40px;


border:

1px solid rgba(63,186,235,.30);


border-radius:20px;







.input-grid{

display:grid;

grid-template-columns:1fr 1fr;

gap:25px;

}



.field{

display:flex;

flex-direction:column;

margin-bottom:25px;

}



.field label{

color:#f5f7fa;

font-size:.85rem;

margin-bottom:8px;

}



.field input,
.field textarea,
.verify input{


background:transparent;


border:

1px solid rgba(138,169,184,.25);


border-radius:10px;


padding:14px;


color:#fff;


font-family:'Poppins',sans-serif;


outline:none;


}



.field textarea{

height:140px;

resize:none;

}




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

border-color:#3fbaeb;

}







.verify{

padding:25px;

margin-bottom:25px;


border-radius:15px;


background:

rgba(63,186,235,.03);


border:

1px solid rgba(63,186,235,.15);

}



.verify h3{

font-weight:400;

}



.verify p{

color:#8aa9b8;

font-size:.85rem;

margin:10px 0 20px;

}



.verify-row{

display:flex;

align-items:center;

gap:20px;

}



.verify strong{

color:#fff;
font-weight: 400;
font-size:1.0rem;

}





.submit-btn{


padding:14px 35px;


border-radius:10px;


background:transparent;


border:0.1px solid #205677;


color:#8aa9b8;


cursor:pointer;


transition:.3s;

}



.submit-btn:hover{

background:#38a0ca;

color:#081B26;

}




.status{

margin-top:20px;

color:#8aa9b8;

font-size:.85rem;

}



input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button{
    -webkit-appearance:none;
    margin:0;
}

input[type="number"]{
    -moz-appearance:textfield;
    appearance:textfield;
}


.careers-footer a{

color:#3fbaeb;

text-decoration:none;

}


.careers-footer a:hover{

color:#7dd8ff;

}