body {
 font-family: Optima,Arial, Helvetica, sans-serif;
 background-color: #ad764d;
 color: #282828;
 display: flex;
 justify-content: center;
 align-items: center;
 min-height: 100vh;
 margin: 0;

}
.form-container {
 background: #f3e3d8fc;
 padding: 25px 30px;
 border-radius: 10px;
 box-shadow: 0 4px 10px rgba(0,0,0,0.1);
 max-width: 700px;
 width: 90%;
 border: 2px solid #836045;
}
h1 {
 text-align: center;
 color: #000000;
 margin-bottom: 20px;
}
label {
 font-weight: bold;
 display: block;
 margin: 15px 0 8px;
}
textarea {
 width: 100%;
 height: 90px;
 border: 1px solid #ccc;
 border-radius: 6px;
 padding: 10px;
 font-size: 14px;
 resize: vertical;
 transition: border-color 0.3s;
 border: 1px solid rgb(175, 98, 27);
 border-radius: 5px;
}
textarea:focus {
 outline: none;
 border-color: #4e3e28;
}
.button-group {
 display: flex;
 justify-content: center;
 gap: 15px;
 margin-top: 20px;
}
button {
 padding: 10px 18px;
 border: none;
 border-radius: 6px;
 cursor: pointer;
 font-size: 15px;
 transition: 0.3s ease;
}
.btn-enviar {
 background-color: #995d2d;
 color: white;
}
.btn-enviar:hover {
 background-color: #734222;
}
.btn-reset {
 background-color: #995d2d;
}
.btn-reset:hover {
 background-color: #734222;
 color: white;
}
.mensaje {
 text-align: center;
 margin-top: 15px;
 font-weight: bold;
 color: #282828;
 display: none;
}

.btn {
    font-size: 32px;
    font-weight: 700;
    color: rgb(63, 89, 79);
    border: 0;
    padding: 10px 80px;
    border-radius: 60px;
    cursor: pointer;
    background: linear-gradient(90deg, #4e7dff, #7ba3ff, #457dff);
    border: 6px solid rgb(24, 39, 106);
    box-shadow: 0px 10px 0px #000;
    transition: transform .15s ease-in-out;
}

.btn:hover {
    transform: translateY(-4px);
    box-shadow: 0px 14px 0px #000;
}

.btn:active {
    transform: translateY(4px);
    box-shadow: 0px 5px 0px #000;
}