.price_contact {
    position: relative;
    max-height: 100vh;
    height: 85vh;
    background: none;
    margin-top: 2%;
}

.price_contact::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url("/assets/img/shape6.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    opacity: 0.06;
    z-index: -1;
    max-height: 100vh;
}

.contact_card {
    width: 100%;
    background: white;
    position: relative;
    flex-direction: column;
    justify-content: space-between;
    padding: 40px;
    gap: 10px;
    border-radius: 40px;
    background-color: hsl(234.83deg 59.1% 81.9% / 0%);
    box-shadow: 17px 17px 34px 0px rgb(221 224 251), inset -8px -8px 16px 0px rgb(249 225 251 / 20%), inset 0px 14px 28px 0px hsl(120deg 20% 95% / 40%);

}

.contact_card .title {
    color: black;
    font-size: 2rem;
    font-weight: 600;
}

.contact_card .description {
    color: black;
    margin-top: 10px;
    margin-bottom: 20px;
}

.contact_card .prefs {
    color: blue;
    font-size: .8em;
    margin-bottom: 20px;
}

.contact_card .actions {
    margin-top: 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* .contact_card button {
    color: white;
    border: none;
    background: none;
    padding: 20px;
    border-radius: 15px;
    cursor: pointer;
    font-size: 1.2em;
    font-weight: bold;
} */

.contact_card .decline {
    color: rgb(255, 0, 0);
    box-shadow: 4px 4px 8px 0px rgb(134, 124, 124),
        inset -8px -8px 16px 0px rgba(92, 92, 92, 0.7),
        inset 0px 14px 28px 0px hsl(120deg 20% 95%);
}

.contact_card .valid {
    color: rgb(0, 156, 0);
    box-shadow: 4px 4px 8px 0px rgb(124, 134, 125),
        inset -8px -8px 16px 0px rgba(121, 121, 121, 0.7),
        inset 0px 14px 28px 0px hsl(120deg 20% 95%);
}

.contact_card .decline:hover {
    color: white;
    background-color: rgb(255, 0, 0);
    box-shadow: 4px 4px 8px 0px rgb(134, 124, 124),
        inset -8px -8px 16px 0px rgba(134, 20, 20, 0.7),
        inset 0px 14px 28px 0px hsl(120deg 20% 95%);
}

.contact_card .valid:hover {
    color: white;
    background-color: rgb(0, 156, 0);
    box-shadow: 4px 4px 8px 0px rgb(124, 134, 125),
        inset -8px -8px 16px 0px rgba(47, 134, 20, 0.7),
        inset 0px 14px 28px 0px hsl(120deg 20% 95%);
}

.contact_card h3 {
    font-size: 20px;
}

.contact_card p {
    font-size: 16px;
}


.contact_modal {

    box-shadow: 0px 187px 75px rgba(0, 0, 0, 0.01), 0px 105px 63px rgba(0, 0, 0, 0.05), 0px 47px 47px rgba(0, 0, 0, 0.09), 0px 12px 26px rgba(0, 0, 0, 0.1), 0px 0px 0px rgba(0, 0, 0, 0.1);
    border-radius: 16px;
    margin: 0 auto;
    padding: 6%;
}

.contact_img {
    width: 90%;
    height: 90%;
}

.title {
    font-weight: 700;
    font-size: 20px;
    line-height: 24px;
    text-align: center;
    color: #2B2B2F;
    margin-bottom: 15px;
}

.description {

    margin: auto;
    font-weight: 600;
    font-size: 16px;
    line-height: 18px;
    text-align: start;
    color: #5F5D6B;
    margin-bottom: 20px;
}

.contact-details {
    display: flex;
    flex-direction: column;
    gap: 15px;
    margin: 20px 0;
}

.contact-item {
    font-size: 14px;
    color: #2B2B2F;
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #ebebec;
    padding-bottom: 5px;
}

.contact-item strong {
    font-weight: 700;
}

.contact-item span {
    color: #5F5D6B;
}

.modal--footer {
    display: flex;
    justify-content: center;
    padding: 20px 0 0;
    border-top: 1px solid #ebebec;
}


.submit-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 150px;
    height: 40px;
    background: #0bdd12;
    box-shadow: 0px 0.5px 0.5px #EFEFEF, 0px 1px 0.5px rgba(239, 239, 239, 0.5);
    border-radius: 10px;
    border: 0;
    outline: none;
    color: #ffffff;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.3s cubic-bezier(0.15, 0.83, 0.66, 1);
}

.submit-btn:hover {
    background-color: #07b90d;
}

/* CSS */
.button-64 {
    align-items: center;
    background-image: linear-gradient(144deg, #AF40FF, #5B42F3 50%, #00DDEB);
    border: 0;
    border-radius: 8px;
    box-shadow: rgba(151, 65, 252, 0.2) 0 15px 30px -5px;
    box-sizing: border-box;
    color: #FFFFFF;
    display: flex;
    font-family: Phantomsans, sans-serif;
    font-size: 20px;
    justify-content: center;
    line-height: 1em;
    max-width: 100%;
    min-width: 140px;
    padding: 3px;
    text-decoration: none;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    white-space: nowrap;
    cursor: pointer;
}

.button-64:active,
.button-64:hover {
    outline: 0;
}

.button-64 span {
    background-color: rgb(5, 6, 45);
    padding: 16px 24px;
    border-radius: 6px;
    width: 100%;
    height: 100%;
    transition: 300ms;
}

.button-64:hover span {
    background: none;
}

@media screen and (min-width: 481px) and (max-width:768px) {
    .contact_side1 {
        display: none;
    }

    .vl {
        display: none;
    }

    .contact_side2 {
        width: 100%;
    }
}

@media (max-width: 480px) {
    .contact_side1 {
        display: none;
    }

    .vl {
        display: none;
    }

    .contact_side2 {
        width: 100%;
    }
}