/* ================================
POPUP OVERLAY
================================ */

#contact-popup-overlay{
display:none;
position:fixed;
top:0;
left:0;
width:100%;
height:100%;

padding:80px 20px;

background:rgba(3,12,25,0.75);
backdrop-filter:blur(6px);

z-index:9999;

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

overflow-y:auto;

animation:popupFade .35s ease;
}


/* ================================
POPUP CONTAINER
================================ */

.contact-popup{

width:720px;
max-width:92%;

padding:50px;

border-radius:20px;

background:linear-gradient(180deg,#000000 0%, #002A62 100%);

box-shadow:
0 15px 60px rgba(0,0,0,0.7),
0 0 35px rgba(0,140,255,0.25);

color:#fff;

position:relative;
margin:auto;

animation:popupScale .35s ease;

}


/* ================================
CLOSE BUTTON
================================ */

.popup-close{

position:absolute;
top:16px;
right:20px;

font-size:26px;
cursor:pointer;

opacity:.7;
transition:.2s;

color:#fff;

}

.popup-close:hover{
opacity:1;
transform:scale(1.15);
}


/* ================================
HEADINGS
================================ */

.contact-popup h3{
margin-bottom:10px;
font-size:32px;
font-weight:700;
text-align:center;
}

.contact-popup form p {
    border: none;
    line-height: 35px;
    margin-bottom: 10px;
}

.contact-popup p {
    font-size: 15px;
    opacity: .8;
    margin-bottom: 45px;
    text-align: center;
    border-bottom: 1px #ccc solid;
    line-height: 50px;
}


/* ================================
CONTACT FORM 7
================================ */

#contact-popup-overlay .wpcf7-form{
max-width:480px;
margin:0 auto;
text-align:left;
}


/* LABELS */

#contact-popup-overlay label{
display:block;
line-height: 0;
font-size:15px;
color:#cbd5e1;
text-align:left;
}


/* INPUT FIELDS */

#contact-popup-overlay input,
#contact-popup-overlay textarea{

width:100%;
padding:14px 16px;

border-radius:10px;
border:1px solid rgba(255,255,255,0.15);

background:rgba(255,255,255,0.05);

color:#fff;
font-size:15px;

margin-bottom:20px;

transition:all .2s ease;

}


/* FOCUS */

#contact-popup-overlay input:focus,
#contact-popup-overlay textarea:focus{

outline:none;
border-color:#1ea7ff;
box-shadow:0 0 10px rgba(30,167,255,.5);

}


/* TEXTAREA */

#contact-popup-overlay textarea{
min-height:160px;
resize:none;
}


/* SUBMIT BUTTON */

#contact-popup-overlay .wpcf7-submit{

display:block;

margin:10px auto 0;

padding:14px 50px;

border-radius:40px;

border:2px solid rgba(255,255,255,.6);

background:linear-gradient(90deg,#0e5bd3,#18a0d8);

color:#fff;

font-size:18px;
font-weight:600;

cursor:pointer;

transition:.3s ease;

}


/* HOVER */

#contact-popup-overlay .wpcf7-submit:hover{

transform:translateY(-2px);

box-shadow:0 10px 25px rgba(0,115,255,0.35);

}


/* ================================
ANIMATIONS
================================ */

@keyframes popupFade{
from{opacity:0;}
to{opacity:1;}
}

@keyframes popupScale{
from{
opacity:0;
transform:scale(.9);
}
to{
opacity:1;
transform:scale(1);
}
}


/* ================================
RESPONSIVE
================================ */

@media (max-width:768px){

.contact-popup{
width:95%;
padding:35px 25px;
}

.contact-popup h3{
font-size:24px;
}

#contact-popup-overlay .wpcf7-submit{
width:100%;
}

}