#newsletter {background: var(--primary); padding: 40px 0;}
#newsletter label {color: #fff; font-size: 12px; font-weight: 500;}
#newsletter input {border-radius: 8px; color: #000; padding: 16px; font-size: 12px; border: 1px solid #D8D8D7; background: #fff; height: 48px;}
#newsletter input::placeholder {color: var(--text);}
#newsletter input:focus {background: #e1e1e1; border-color:#a9a9a9;}
#newsletter button {height: 100%; padding: 0 40px; font-weight: 600; border: 2px solid #fff; height: 48px; color: #fff; background: transparent;}
#newsletter button:hover {background: #fff; color: var(--text);}
#newsletter .newsletter-wrapper {display: flex; gap: 16px; align-items: end; justify-content: end;}
#newsletter .newsletter-field {flex: 1; max-width: 240px;}
#newsletter .newsletter-btn {flex: none;}
#newsletter .newsletter-title {font-size: 20px; font-weight: 700; margin-bottom: 4px; text-transform: none; color: #fff;}
#newsletter .newsletter-description {font-size: 13px; font-weight: 500; color: #fff;}
@media (max-width: 991px) {
	#newsletter .newsletter-wrapper {flex-direction: column; gap: 8px;}
	#newsletter input, #newsletter button {height: 50px; width: 100%;}
	#newsletter .newsletter-title {font-size: 22px;}
	#newsletter .newsletter-description {font-size: 14px; font-weight: 400;}
	#newsletter .newsletter-field {max-width: none; width: 100%;}
}