.vhf-wrap {
width: 100%;
max-width: 860px;
margin: 0 auto;
}
.vhf-form {
width: 100%;
} .vhf-row {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 12px 20px;
} .vhf-field {
display: flex;
flex-direction: column;
margin-bottom: 14px;
}
.vhf-field.vhf-full {
grid-column: span 2;
} .vhf-field label,
.vhf-privacidad label {
color: #ffffff;
font-size: 13px;
font-weight: 500;
margin-bottom: 5px;
display: block;
} .vhf-field input[type="text"],
.vhf-field input[type="email"],
.vhf-field select,
.vhf-field textarea {
background: transparent !important;
border: 1px solid rgba(255, 255, 255, 0.55) !important;
border-radius: 3px;
color: #ffffff !important;
font-size: 14px;
padding: 10px 12px;
width: 100%;
box-sizing: border-box;
transition: border-color 0.2s;
-webkit-appearance: none;
font-family: inherit;
caret-color: #ffffff;
}
.vhf-field input:focus,
.vhf-field select:focus,
.vhf-field textarea:focus {
color: #ffffff !important;
background: transparent !important;
outline: none;
border-color: rgba(255, 255, 255, 0.9) !important;
} .vhf-field input:-webkit-autofill,
.vhf-field input:-webkit-autofill:hover,
.vhf-field input:-webkit-autofill:focus {
-webkit-text-fill-color: #ffffff !important;
-webkit-box-shadow: 0 0 0px 1000px transparent inset !important;
caret-color: #ffffff;
transition: background-color 5000s ease-in-out 0s;
}
.vhf-field input::placeholder,
.vhf-field textarea::placeholder {
color: rgba(255, 255, 255, 0.4);
}
.vhf-field input:focus,
.vhf-field select:focus,
.vhf-field textarea:focus {
outline: none;
border-color: rgba(255, 255, 255, 0.9);
} .vhf-field select option {
background: #1a3a2a;
color: #ffffff;
}
.vhf-field select {
cursor: pointer;
} .vhf-field textarea {
resize: vertical;
min-height: 120px;
} .vhf-invalid .vhf-field input,
.vhf-invalid .vhf-field select,
.vhf-invalid .vhf-field textarea,
.vhf-field.vhf-invalid input,
.vhf-field.vhf-invalid select,
.vhf-field.vhf-invalid textarea {
border-color: #ff6b6b !important;
}
.vhf-invalid label {
color: #ff6b6b !important;
} .vhf-privacidad {
margin: 10px 0;
}
.vhf-privacidad label {
display: flex;
align-items: flex-start;
gap: 8px;
cursor: pointer;
font-size: 13px;
}
.vhf-privacidad input[type="checkbox"] {
margin-top: 2px;
flex-shrink: 0;
accent-color: #4caf50;
}
.vhf-privacidad a {
color: #a8d5b5;
text-decoration: underline;
} .vhf-honeypot {
display: none !important;
visibility: hidden;
height: 0;
overflow: hidden;
} .vhf-actions {
margin-top: 18px;
}
.vhf-btn {
background: transparent;
border: 2px solid #ffffff;
color: #ffffff;
cursor: pointer;
font-size: 13px;
font-weight: 700;
letter-spacing: 2px;
padding: 12px 40px;
text-transform: uppercase;
transition: background 0.2s, color 0.2s;
border-radius: 3px;
font-family: inherit;
}
.vhf-btn:hover {
background: rgba(255, 255, 255, 0.15);
}
.vhf-btn:disabled {
opacity: 0.6;
cursor: not-allowed;
} .vhf-msg {
border-radius: 4px;
font-size: 14px;
margin-top: 16px;
padding: 14px 18px;
line-height: 1.5;
}
.vhf-msg.vhf-success {
background: rgba(76, 175, 80, 0.2);
border: 1px solid rgba(76, 175, 80, 0.6);
color: #c8e6c9;
}
.vhf-msg.vhf-error {
background: rgba(244, 67, 54, 0.2);
border: 1px solid rgba(244, 67, 54, 0.5);
color: #ffcdd2;
} @media (max-width: 640px) {
.vhf-row {
grid-template-columns: 1fr;
}
.vhf-field.vhf-full {
grid-column: 1;
}
.vhf-btn {
width: 100%;
padding: 14px;
}
}