.contacto{padding:40px 0;font-size:16px}.content-contacto{width:90%;max-width:var(--width-principal);margin:0 auto}.contacto .body-contacto .data{justify-self:center}.contacto .body-contacto .data li{margin-bottom:10px}.contacto .body-contacto .data li a{align-items:center;gap:8px;display:flex}.contacto .body-contacto{grid-template-columns:1fr 1.1fr;justify-content:center;align-items:center;gap:20px;display:grid}.contacto .form-contacto{flex-direction:column;align-items:stretch;gap:14px;display:flex}.form-contacto .doble-campo{flex:1;gap:20px;display:flex}.form-contacto .doble-campo div{flex:1}.form-contacto label{margin-bottom:4px}.form-contacto label,.form-contacto input{display:block}.form-contacto input,.form-contacto textarea{width:100%;font-size:16px;font-family:var(--font-poppins);border:1px solid var(--color-charcoal);border-radius:8px;flex-grow:1;padding:10px 12px;font-size:.95em;font-weight:400}.form-contacto textarea{resize:none;height:100px}.form-contacto input::placeholder{color:#62656c;font-weight:300}.form-contacto input:focus,.form-contacto textarea:focus{background-color:#fff;border-color:#1e88e5;outline:none;transition:border-color .2s,box-shadow .2s;box-shadow:0 2px 8px #1e88e51f}.form-contacto .submit-contacto{background-color:var(--color-morado);color:#000;cursor:pointer;border:none;border-radius:6px;padding:.6em 1.4em;font-size:.95em;font-weight:600;transition:box-shadow .2s,background-color .2s;display:block}.form-contacto .submit-contacto:hover,.form-contacto .submit-contacto:focus{box-shadow:0 4px 16px #3c3c3c40}.estado-form{text-align:center;border-radius:6px;margin-top:20px;padding:12px 16px;font-size:1em;font-weight:500;animation:.3s fadeIn}.estado-form.success{color:#1e7d34;background-color:#e6f4ea;border:1px solid #b7dfc1}.estado-form.error{color:#a60000;background-color:#fdeaea;border:1px solid #f5b5b5}.estado-form.error button{color:#fff;cursor:pointer;background-color:#a60000;border:none;border-radius:6px;margin-top:10px;padding:.5em 1.2em;font-weight:600;transition:background-color .2s}.estado-form.error button:hover{background-color:#c00}@keyframes fadeIn{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}.contacto .footer-contacto p{text-align:center;margin-top:30px;font-size:1.2em}@media screen and (max-width:800px){.contacto{font-size:14px}.contacto .body-contacto{grid-template-columns:1fr 1.8fr}}@media screen and (max-width:600px){.contacto .body-contacto{grid-template-columns:1fr}.form-contacto .submit-contacto{margin-left:auto}}
