.contact-wrap {
  margin: 0 auto; 
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
} 


.field { 
  margin-bottom: 14px; 
}

.field input,
.field textarea {
  width: 94%;
  max-width: 100%;
  padding: 12px 14px;
  border: 1px solid #ccc;
  border-radius: 4px;
  font-size: 14px;
  font-family: Arial, sans-serif;
  color: #333;
  background: #fff;
  outline: none;
  transition: border-color .2s;
}

.field input:focus,
.field textarea:focus { 
  border-color: #1a73e8; 
}

.field textarea { 
  height: 50px; 
  resize: vertical; 
}

.field input::placeholder,
.field textarea::placeholder { 
  color: #aaa; 
}

.field input.invalid,
.field textarea.invalid { 
  border-color: #e53935; 
}

.field-error {
  display: none;
  color: #e53935;
  font-size: 12px;
  margin-top: 4px;
  margin-bottom: 2px;
}

.captcha-box {
   
  width: 100%;
  padding: 1px;
  margin-bottom: 18px;
}

.captcha-label {
  font-size: 13px;
  font-weight: 600;
  color: #333;
  margin-bottom: 12px;
}

.captcha-label span { 
  color: #e53935; 
}

.captcha-img-wrap {
  background: #f9f9f9;
  
  padding: 1px;
  text-align: center;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1px;
  flex-wrap: wrap;
}

.captcha-img-wrap img {
  max-width: 100%;
  height: auto;
  width: auto;
  min-width: 0;
  border-radius: 3px;
  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;
}

.captcha-refresh {
  font-size: 22px;
  cursor: pointer;
  color: #1a73e8;
  user-select: none;
  background: none;
  border: none;
  line-height: 1;
  flex-shrink: 0;
}

.captcha-refresh:hover { 
  color: #0d47a1; 
}

.captcha-input {
  width: 100%;color:#000;
  max-width: 100%;
  padding: 11px 14px;
  border: 1px solid #ccc;
  border-radius: 4px;
  font-size: 14px;
  font-family: Arial, sans-serif;
  text-align: center;
  letter-spacing: 3px;
  outline: none;
}

.captcha-input:focus { 
  border-color: #a7b2c9; 
}

.captcha-input::placeholder { 
  letter-spacing: 0; 
  color: #aaa; 
}

.captcha-error {
  display: none;
  color: #e53935;
  font-size: 12px;
  margin-top: 6px;
}

.btn-send {
  width: 100%;
  padding: 14px;
  background: #a7b2c9;
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  font-family: Arial, sans-serif;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  transition: background .2s;
  letter-spacing: .3px;
}

.btn-send:hover { 
  background: #a7b2c9; 
}

.btn-send.loading { 
  opacity: .65; 
  cursor: default; 
  pointer-events: none; 
}

.response-box { 
  margin-top: 16px; 
  font-size: 13px; 
}

.vpb_success {
  background: #e8f5e9;
  color: #2e7d32;
  padding: 13px 16px;
  border-radius: 4px;
  border-left: 4px solid #2e7d32;
}

.vpb_error {
  background: #ffebee;
  color: #c62828;
  padding: 13px 16px;
  border-radius: 4px;
  border-left: 4px solid #e53935;
}

/* RESPONSIVE */
@media (max-width: 768px) {

  .captcha-box {
    padding: 14px 12px;
  }

  .captcha-img-wrap {
    flex-direction: column;
    gap: 10px;
  }

  .captcha-img-wrap img {
    width: 100%;
    max-width: 260px;
  }

  .captcha-input,
  .field input,
  .field textarea,
  .btn-send {
    font-size: 16px;
  }
}

@media (max-width: 480px) {

  .field input,
  .field textarea,
  .captcha-input,
  .btn-send {
    padding: 12px;
  }

  .captcha-img-wrap {
    padding: 10px;
  }

  .captcha-img-wrap img {
    max-width: 100%;
  }

  .captcha-refresh {
    font-size: 20px;
  }
}