/* =========================================================
   NEWSLETTER — SECCIÓN
   ========================================================= */

.newsletter{
  text-align: center;
  background: var(--bg-2, #f6f6f2);
  padding: 5em 6%;
}

.newsletter .seccion_container{
  max-width: 760px;
  margin: 0 auto;
}

.newsletter .seccion_container .text-top{
  color: var(--header-orange, #d9722c);
  font-weight: 700;
  font-size: .8em;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.newsletter .seccion_container h2{
  font-family: "Playfair Display", "Poppins", serif;
  font-weight: 800;
  color: var(--header-maroon, #711c2e);
  text-transform: none;
  font-size: 2em;
  margin: .3em 0 .9em;
}

.newsletter .seccion_container > p{
  opacity: .75;
  margin-bottom: 2em;
}

/* =========================================================
   FORMULARIO
   ========================================================= */

.uform{
  font-family: "Poppins", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  background: #fff;
  padding: 2.4em 2.6em;
  border-radius: 18px;
  box-shadow: 0 20px 50px rgba(0,0,0,.08);
  border: 1px solid rgba(0,0,0,.06);
  text-align: left;
}

/* =========================================================
   FILAS Y GRILLAS
   ========================================================= */

.uform__row{
  display: grid;
  gap: 22px;
  margin-bottom: 22px;
}

.uform__row--2{
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

/* =========================================================
   LABELS
   ========================================================= */

.uform__label{
  display: block;
  font-size: .78em;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: #444;
  margin-bottom: .6em;
}

.uform__req{
  color: var(--header-maroon, #711c2e);
  margin-left: 2px;
}

/* =========================================================
   INPUTS
   ========================================================= */

.uform__input{
  width: 100%;
  outline: none;
  box-sizing: border-box;

  font-size: 15px;
  padding: .85em 1em;
  color: #1c1c1c;

  background: #faf9f7;
  border: 1px solid rgba(0,0,0,.14);
  border-radius: 8px;

  transition: background-color .2s ease, border-color .2s ease, box-shadow .2s ease;
  -webkit-tap-highlight-color: transparent;
}

.uform__input::placeholder{
  color: rgba(0,0,0,.35);
}

.uform__input:hover{
  border-color: rgba(113,28,46,.4);
}

.uform__input:focus{
  background: #fff;
  border-color: var(--header-maroon, #711c2e);
  box-shadow: 0 0 0 3px rgba(113,28,46,.12);
}

/* =========================================================
   BOTÓN
   ========================================================= */

.uform .btn_[type="submit"]{
  border-radius: 999px !important;
  margin: 0 !important;
}
.uform .btn__primary{
  background: linear-gradient(to bottom, var(--header-maroon, #711c2e), var(--header-maroon-dark, #3a0f18)) !important;
  border-color: var(--header-maroon, #711c2e) !important;
}
.uform .btn__primary::after{
  background: linear-gradient(to bottom, var(--header-maroon-dark, #3a0f18), var(--header-maroon, #711c2e)) !important;
}

/* =========================================================
   RESPONSIVE — FORMULARIO
   ========================================================= */

@media (max-width: 720px){

  .uform{
    padding: 1.6em 1.4em;
  }

  .uform__row--2{
    grid-template-columns: 1fr;
  }
}
