/* Soho Subscribe Styles */
.soho-subscribe {
  font-family: 'Manrope', sans-serif;
  max-width: 100%;
  box-sizing: border-box;
}
.soho-subscribe__wrap {
  display: flex;
  gap: 32px;
  align-items: center;
  justify-content: space-between;
  color: #fff;
  border-radius: 14px;
}
.soho-subscribe__left h3 { margin:0; font-size:20px; font-weight:700; }
.soho-subscribe__left p { margin:10px 0 0; opacity:0.95; }

.soho-subscribe__form { display:flex; flex-direction:column; gap:10px; }
.soho-subscribe__field {
  background:#fff;
  border-radius:999px;
  padding: 5px 10px 5px 24px;
  display:flex;
  align-items:center;
  gap:10px;
}
.soho-subscribe__field input {
  border:0;
  outline:0;
  flex:1;
  font-size:15px;
}
.soho-subscribe__btn {
  background:#000 !important;
  color:#fff !important;
  border:0 !important;
  border-radius:999px !important;
  padding:20px 30px !important;
  font-weight:600 !important;
  cursor:pointer !important;
}
.soho-subscribe__msg { font-size:13px; }
.soho-subscribe__msg--success { color:#dff7e6; }
.soho-subscribe__msg--error { color:#dff7e6; }

@media (max-width:768px){
  .soho-subscribe__wrap { flex-direction:column; gap:18px; }
  .soho-subscribe__form { width:100%; }
  .soho-subscribe__field { width:100%; }
}


/* Use Manrope site-wide for the subscribe component */
.soho-subscribe { font-family: 'Manrope', sans-serif; }

/* Small SVG icon in the input field */
.soho-subscribe__field svg {
  width: 18px;          /* adjust size as needed (e.g. 14px, 16px, 18px) */
  height: 18px;
  flex: 0 0 18px;       /* prevent SVG from stretching */
  display: block;
  vertical-align: middle;
}

/* Ensure the input doesn't overlap the icon on very small icon sizes */
.soho-subscribe__field input {
  /* optional: reduce left padding if needed, or keep as-is */
  font-size: 15px;
}

/* If button padding feels too large next to smaller icon, you can tweak it */
.soho-subscribe__btn {
  padding: 14px 22px !important; /* optional tweak */
}