.footer-bg { 
    --preto: #fff;
    --branco: #131313;
}

footer .footer-bg .footer form input {
    background: var(--preto);
    color: var(--branco);
}

footer .footer-bg .footer form input,
footer .footer-bg .footer form textarea[name=mensagem] { transition: box-shadow 0.25s ease, transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1), background 0.25s ease; position: relative; border: 2px solid #F5C8CA; }
footer .footer-bg .footer form input:hover,
footer .footer-bg .footer form textarea[name=mensagem]:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(0, 0, 0, 0.10), 0 0 0 2px rgba(var(--cor1-rgb, 0, 0, 0), 0.12); background: var(--preto); }
footer .footer-bg .footer form input:focus,
footer .footer-bg .footer form textarea[name=mensagem]:focus { transform: translateY(-3px); box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12), 0 0 0 2.5px var(--cor1); background: #fff; outline: none; }
footer .footer-bg .footer form input:focus::placeholder,
footer .footer-bg .footer form textarea[name=mensagem]:focus::placeholder { opacity: 0.4; transform: translateX(4px); transition: opacity 0.2s ease, transform 0.2s ease; }
footer .footer-bg .footer form input::placeholder,
footer .footer-bg .footer form textarea[name=mensagem]::placeholder { transition: opacity 0.2s ease, transform 0.2s ease; }
footer .footer-bg .footer form:focus-within input:not(:focus),
footer .footer-bg .footer form:focus-within textarea:not(:focus) { opacity: 0.6; transform: scale(0.99); transition: opacity 0.3s ease, transform 0.3s ease, box-shadow 0.25s ease, background 0.25s ease; }
footer .footer-bg .footer form:focus-within input:focus,
footer .footer-bg .footer form:focus-within textarea:focus { opacity: 1; transform: translateY(-3px) scale(1);  } 
footer .footer-bg .footer form input::placeholder,
footer .footer-bg .footer form textarea[name=mensagem]::placeholder { color: var(--branco); }
footer .footer-bg .footer form textarea[name=mensagem] { background: var(--preto); }
footer .footer-bg .footer form button { color: var(--preto); }