/* Contact Section */
.contact {
    overflow: hidden;
}

.contact__description {
    line-height: 1.7;
}

.contact__description p {
    margin-bottom: 1rem;
}

.contact__form {
    border-radius: 12px;
}

@media (min-width: 768px) {
    .contact__form {
        border-radius: 16px;
    }
}

@media (min-width: 1024px) {
    .contact__form {
        border-radius: 20px;
    }
}

.contact__form label{
    color: var(--white-color);
    font-family: 'RobotoMedium';
    display: block;
    margin-bottom: 0.5rem;
    font-size: 0.9rem;
}

@media (min-width: 768px) {
    .contact__form label {
        font-size: 1rem;
    }
}

.contact__form input, 
.contact__form textarea {
    border: none;
    outline: none;
    width: 100%;
    padding: 0.75rem 1rem;
    border-radius: 8px;
    font-size: 0.9rem;
    transition: box-shadow 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94),
                transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

@media (min-width: 768px) {
    .contact__form input, 
    .contact__form textarea {
        padding: 0.875rem 1.25rem;
        font-size: 1rem;
    }
}

.contact__form textarea {
    min-height: 120px;
    resize: vertical;
}

@media (min-width: 768px) {
    .contact__form textarea {
        min-height: 150px;
    }
}

.contact__form input:focus, 
.contact__form textarea:focus {
    box-shadow: 0 0 0 3px rgba(187, 154, 101, 0.3);
    transform: translateY(-2px);
}

.contact__form button {
    background-color: var(--secondary-color-100) !important;
    color: var(--white-color) !important;
    font-family: 'RobotoMedium';
    font-size: 0.95rem !important;
    padding: 12px 24px !important;
    border-radius: 8px !important;
    border: none !important;
    outline: none !important;
    cursor: pointer !important;
    width: 100% !important;
    position: relative;
    overflow: hidden;
    transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94),
                box-shadow 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94),
                background-color 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}

@media (min-width: 768px) {
    .contact__form button {
        font-size: 1rem !important;
        padding: 14px 28px !important;
    }
}

.contact__form button:hover {
    background-color: var(--primary-color-100) !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 10px 25px rgba(187, 154, 101, 0.35) !important;
}

.contact__form button:active {
    transform: translateY(-1px) !important;
}

/* Shine effect on button */
.contact__form button::after {
    content: '';
    position: absolute;
    top: -50%;
    left: -75%;
    width: 50%;
    height: 200%;
    background: linear-gradient(
        to right,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0.25) 50%,
        rgba(255, 255, 255, 0) 100%
    );
    transform: skewX(-25deg);
    transition: left 0.6s;
}

.contact__form button:hover::after {
    left: 125%;
}

/* Form field animations on focus */
.contact__form-wrapper > div,
.contact__form-wrapper .wpcf7-form-control-wrap {
    margin-bottom: 1rem;
}

@media (min-width: 768px) {
    .contact__form-wrapper > div,
    .contact__form-wrapper .wpcf7-form-control-wrap {
        margin-bottom: 1.25rem;
    }
}

/* Reduced motion preference */
@media (prefers-reduced-motion: reduce) {
    .contact__form input, 
    .contact__form textarea,
    .contact__form button {
        transition: none !important;
    }
    
    .contact__form input:focus, 
    .contact__form textarea:focus,
    .contact__form button:hover {
        transform: none !important;
    }
    
    .contact__form button::after {
        transition: none;
    }
}