.input {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.input__label {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--text-secondary);
}

.input__control {
  width: 100%;
  min-height: 46px;
  padding: 0.7rem 0.9rem;
  font-family: inherit;
  font-size: 14px;
  font-weight: 400;
  color: var(--text-primary);
  background: var(--surface);
  border: 1.5px solid var(--border);
  border-radius: 11px;
  outline: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
  appearance: none;
  -webkit-appearance: none;
}

.input__control:focus {
  border-color: var(--crimson);
  box-shadow: 0 0 0 3px rgba(155, 35, 53, 0.1);
}

.input__control::placeholder {
  color: var(--text-muted);
}

.input__control--textarea {
  min-height: 96px;
  font-family: inherit;
  resize: vertical;
}

select.input__control {
  background-image: linear-gradient(45deg, transparent 50%, var(--text-secondary) 50%),
                    linear-gradient(135deg, var(--text-secondary) 50%, transparent 50%);
  background-position: calc(100% - 18px) 50%, calc(100% - 13px) 50%;
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
  padding-right: 2rem;
}