<style>
/* ========== 1) SUPER CHIPS embebida (Base64 WOFF2) ========== */
@font-face {
  font-family: "SuperChips";
  src: url("data:font/woff2;base64,d09GMgABAAAAAHwcABIAAAABjkgAAHuyAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAP0ZGVE0cGlQbzlIcg1gG...<TRUNCADO POR BREVEDAD>...AAAA=") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

/* Reset global (usa SuperChips) */
html, body {
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
  font-family: "SuperChips", sans-serif;
  font-weight: 400;
}

/* Sección contenedora */
.seccion-contacto {
  display: flex;
  flex-wrap: wrap;
  padding: 0 !important;
  margin: 0 auto !important;
  width: 100%;
  box-sizing: border-box;
}

/* Columnas */
.contacto-izq, .contacto-der {
  width: 100%;
  padding: 0 !important;
  margin: 0 !important;
  background-color: #f2f1f0; /* <- color de fondo actualizado */
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  font-family: "SuperChips", sans-serif; /* asegura herencia en toda la columna */
  font-weight: 400;
}

/* Imagen */
.img-contacto,
.seccion-contacto img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 0 !important;
}

/* Contenedor del formulario */
.contacto-der > * {
  width: 100%;
  max-width: 500px;
  padding: 20px;
  box-sizing: border-box;
}

/* Formularios dentro de HubSpot */
.contacto-der form {
  width: 100%;
  box-sizing: border-box;
  font-family: "SuperChips", sans-serif;
  font-weight: 400;
}

/* Campos */
.contacto-der input,
.contacto-der textarea,
.contacto-der select {
  background-color: transparent !important;
  color: #000000 !important;
  border: 1px solid #71655B !important;
  padding: 8px 12px !important;
  font-family: "SuperChips", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.3;
  min-height: 36px;
  box-sizing: border-box;
  border-radius: 0 !important;
  appearance: none;
}

/* Placeholders */
.contacto-der input::placeholder,
.contacto-der textarea::placeholder {
  font-family: "SuperChips", sans-serif;
  font-weight: 400;
  color: #71655B;
  opacity: 0.9;
}

/* Etiquetas */
.contacto-der label {
  color: #71655B !important;
  font-family: "SuperChips", sans-serif;
  font-weight: 400;
  font-size: 15px;
  display: block;
  margin-bottom: 5px;
}

/* Mensajes de ayuda / error */
.contacto-der .hs-error-msg,
.contacto-der .hs-form-required,
.contacto-der .hs-richtext {
  color: #71655B !important;
  font-family: "SuperChips", sans-serif;
  font-weight: 400;
  font-size: 13px;
}

/* Botones HubSpot (si aplica) */
.contacto-der .hs-button,
.contacto-der input[type="submit"],
.contacto-der button[type="submit"] {
  font-family: "SuperChips", sans-serif;
  font-weight: 400;
  letter-spacing: .02em;
}

/* Layout en pantallas grandes (mitad y mitad) */
@media (min-width: 768px) {
  .contacto-izq, .contacto-der {
    width: 50%;
    height: auto;
  }
}
</style>