/*=========================================================
    Rajat Adhikari
    Premium Contact Form 7
=========================================================*/

/* Form Container */

.contact-form{
    max-width:720px;
    margin:0 auto;
    padding:40px;
    background:#ffffff;
    border:1px solid #edf2f7;
    border-radius:20px;
    box-shadow:
        0 10px 35px rgba(15,23,42,.08),
        0 3px 10px rgba(15,23,42,.05);
}

/* Fields */

.contact-form p{
    margin-bottom:20px;
}

.contact-form label{
    display:block;
    margin-bottom:8px;
    font-size:15px;
    font-weight:600;
    color:#1e293b;
    letter-spacing:.2px;
}

/* Inputs */

.contact-form input[type=text],
.contact-form input[type=email],
.contact-form input[type=tel],
.contact-form select,
.contact-form textarea{

    width:100%;
    height:54px;

    padding:0 18px;

    border:2px solid #e2e8f0;

    border-radius:14px;

    background:#f8fafc;

    color:#0f172a;

    font-size:15px;

    transition:.35s ease;

    box-sizing:border-box;
}

/* Textarea */

.contact-form textarea{

    height:130px;

    padding:16px 18px;

    resize:none;

    line-height:1.7;
}

/* Placeholder */

.contact-form input::placeholder,
.contact-form textarea::placeholder{

    color:#94a3b8;
}

/* Hover */

.contact-form input:hover,
.contact-form textarea:hover,
.contact-form select:hover{

    border-color:#60a5fa;

    background:#ffffff;
}

/* Focus */

.contact-form input:focus,
.contact-form textarea:focus,
.contact-form select:focus{

    background:#ffffff;

    border-color:#2563eb;

    box-shadow:
        0 0 0 5px rgba(37,99,235,.12),
        0 8px 25px rgba(37,99,235,.10);

    transform:translateY(-2px) scale(1.01);

    outline:none;
}

/* Dropdown */

.contact-form select{

    appearance:none;

    cursor:pointer;

    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='%2364748b' viewBox='0 0 16 16'%3E%3Cpath d='M3.2 5.5L8 10.3l4.8-4.8' stroke='%2364748b' stroke-width='2' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");

    background-repeat:no-repeat;

    background-position:right 18px center;

    padding-right:55px;
}

/* Button */

.contact-form input[type=submit]{

    width:100%;

    height:58px;

    border:none;

    border-radius:14px;

    background:linear-gradient(135deg,#2563eb,#1d4ed8);

    color:#ffffff;

    font-size:17px;

    font-weight:700;

    letter-spacing:.4px;

    cursor:pointer;

    transition:.35s ease;

    box-shadow:
        0 12px 28px rgba(37,99,235,.28);
}

/* Button Hover */

.contact-form input[type=submit]:hover{

    transform:translateY(-3px);

    box-shadow:
        0 18px 38px rgba(37,99,235,.38);

    background:linear-gradient(135deg,#1d4ed8,#1e40af);
}

/* Button Click */

.contact-form input[type=submit]:active{

    transform:translateY(0);
}

/* Validation */

.wpcf7-not-valid{

    border-color:#ef4444 !important;
}

.wpcf7-not-valid-tip{

    margin-top:6px;

    font-size:13px;

    color:#ef4444;
}

/* Success Message */

.wpcf7-response-output{

    margin-top:25px !important;

    border-radius:14px;

    padding:15px 20px;

    font-size:15px;
}

/* Required */

.required{

    color:#ef4444;
}

/* Mobile */

@media(max-width:768px){

.contact-form{

    padding:25px;

    border-radius:18px;
}

.contact-form input,
.contact-form textarea,
.contact-form select{

    font-size:16px;
}

}