.modal-overlay {
 position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.7); display: flex; justify-content: center; align-items: center; z-index: 9999; opacity: 0; visibility: hidden; transition: opacity 0.3s ease, visibility 0.3s ease; 
}

.modal-overlay.active {
  opacity: 1; visibility: visible;
}

.modal-content {
 background-color: white; padding: 50px; border-radius: 10px; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3); width: 600px; max-width: 90%; position: relative; box-sizing: border-box; max-height: 90vh; overflow-y: auto; color: #2c3e50; 
}

.modal-content h3 {
 font-size: 30px; margin-bottom: 30px; text-align: center; color: #2c3e50; 
}

.close-button {
 position: absolute; top: 20px; right: 20px; font-size: 30px; cursor: pointer; color: #777; transition: color 0.3s ease; 
}

.close-button:hover {
  color: #333;
}

.modal-content form p { 
    margin-bottom: 15px;
}
.modal-content form label {
 display: block; margin-bottom: 5px; font-weight: normal; font-size: 0.8rem; 
}
.modal-content form input[type="text"],
.modal-content form input[type="email"],
.modal-content form input[type="tel"],
.modal-content form textarea {
 width: 100%; padding: 10px; border: 1px solid #ccc; border-radius: 5px; box-sizing: border-box; font-size: 1rem; 
}
.modal-content form textarea {
    resize: vertical; min-height: 100px;
}
.modal-content form input[type="submit"],
.modal-content form button[type="submit"] {
 background-color: #27ae60; color: white; padding: 12px 20px; border: none; border-radius: 8px; font-size: 1.1rem; cursor: pointer; transition: background-color 0.3s ease; width: 100%; margin-top: 20px; 
}
.modal-content form input[type="submit"]:hover,
.modal-content form button[type="submit"]:hover {
    background-color: #219150;
}

@media (max-width: 768px) {
 .modal-content { padding: 30px; } 
 .modal-content h3 { font-size: 24px; } 
 .close-button { font-size: 26px; top: 15px; right: 15px; } 
}

@media (max-width: 480px) {
 .modal-content { padding: 20px; } 
 .modal-content h3 { font-size: 20px; } 
 .close-button { font-size: 24px; top: 10px; right: 10px; } 
}