body{
font-family:Poppins,sans-serif;
}

.pef-container{
display:flex;
justify-content:center;
padding:20px;
}

.pef-card{
background:#1D3F8A;
padding:40px;
border-radius:30px;
max-width:900px;
width:100%;
box-shadow:0 20px 60px rgba(0,0,0,.4);
}

.pef-title{
text-align:center;
color:#fff;
font-size:40px;
margin-bottom:35px;
}

.pef-steps{
display:flex;
align-items:center;
justify-content:center;
gap:10px;
margin-bottom:40px;
flex-wrap:wrap;
}

.pef-step{
padding:14px 20px;
border-radius:15px;
background:#274faa;
color:#fff;
border:2px solid red;
font-weight:600;
}

.pef-step.active{
background:#00b140;
}

.pef-arrow{
color:#fff;
font-size:22px;
}

.pef-form-step{
display:none;
animation:slide .5s ease;
}

.pef-form-step.active{
display:block;
}

.pef-form-step input,
.pef-form-step textarea,
.pef-form-step select{
width:100%;
padding:18px;
margin-bottom:20px;
border-radius:15px;
border:2px solid red;
background:#16316d !important;
color:#fff !important;
font-size:16px;
outline:none;
}

.pef-form-step input:focus,
.pef-form-step textarea:focus,
.pef-form-step select:focus{
background:#16316d !important;
color:#fff !important;
}

.pef-btn,
.pay-now-after-btn{
width:100%;
padding:18px;
border:none;
border-radius:16px;
background:linear-gradient(45deg,#00b140,#00ff73);
color:#fff;
font-size:18px;
font-weight:700;
cursor:pointer;
transition:.4s;
animation:pulse 2s infinite;
margin-top:15px;
}

.pef-btn:hover,
.pay-now-after-btn:hover{
transform:translateY(-3px) scale(1.03);
}

.pef-payment-buttons{
display:flex;
gap:20px;
}

.pef-success{
display:none;
text-align:center;
padding:40px;
color:#fff;
}

.checkmark{
width:120px;
height:120px;
stroke:#00ff73;
stroke-width:3;
}

.checkmark-circle{
stroke-dasharray:166;
stroke-dashoffset:166;
stroke:#00ff73;
animation:stroke .6s forwards;
}

.checkmark-check{
stroke-dasharray:48;
stroke-dashoffset:48;
animation:stroke .3s .7s forwards;
}

@keyframes stroke{
100%{
stroke-dashoffset:0;
}
}

@keyframes slide{
from{
opacity:0;
transform:translateX(50px);
}
to{
opacity:1;
transform:translateX(0);
}
}

@keyframes pulse{
0%{
box-shadow:0 0 0 0 rgba(0,255,115,.7);
}
70%{
box-shadow:0 0 0 15px rgba(0,255,115,0);
}
100%{
box-shadow:0 0 0 0 rgba(0,255,115,0);
}
}

@media(max-width:768px){

.pef-title{
font-size:30px;
}

.pef-steps{
display:grid;
grid-template-columns:1fr 1fr;
}

.pef-step:nth-child(5){
grid-column:1/3;
text-align:center;
}

.pef-arrow{
display:none;
}

.pef-payment-buttons{
flex-direction:column;
}

.pef-card{
padding:25px;
}

}
