:root{--color-navy: #2F4156;--color-teal: #597C8D;--color-skyblue: #C9D6E6;--color-beige: #F5EEEB;--color-pure: #FFFFFF;--color-primary-600: #475569;--color-primary-700: #334155;--color-success: #10B981;--color-warning: #F59E0B;--color-danger: #EF4444;--font-outfit: var(--font-outfit);--transition: all .3s cubic-bezier(.25, .46, .45, .94);--shadow: 0 10px 30px rgba(0, 0, 0, .1);--shadow-hover: 0 20px 40px rgba(0, 0, 0, .15)}.contacto-section{position:relative;min-height:100vh;padding:8rem 0 4rem;background:linear-gradient(135deg,var(--color-beige) 0%,rgba(245,238,235,.8) 50%,rgba(252,251,250,.9) 100%);overflow:hidden;font-family:var(--font-outfit)}.contacto-background{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1}.bg-gradient{position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at 30% 20%,rgba(47,65,86,.05),transparent 60%)}.floating-elements{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.particle{position:absolute;background:#597c8d1a;border-radius:50%;animation:floatParticle 8s ease-in-out infinite}.particle-1{width:60px;height:60px;top:20%;left:10%;animation-delay:0s}.particle-2{width:40px;height:40px;top:60%;right:15%;animation-delay:2s}.particle-3{width:80px;height:80px;bottom:30%;left:20%;animation-delay:4s}.particle-4{width:50px;height:50px;top:40%;right:25%;animation-delay:6s}@keyframes floatParticle{0%,to{transform:translateY(0) rotate(0);opacity:.3}50%{transform:translateY(-30px) rotate(180deg);opacity:.6}}.contacto-container{position:relative;z-index:10;max-width:1200px;margin:0 auto;padding:0 2rem}.contacto-header{text-align:center;margin-bottom:4rem}.contacto-title{font-size:clamp(3rem,6vw,4.5rem);font-weight:var(--font-black);color:var(--color-navy);margin:0 0 1rem;line-height:1.1}.title-accent{display:block;color:var(--color-teal)}.contacto-subtitle{font-size:1.25rem;color:var(--color-primary-600);max-width:600px;margin:0 auto;line-height:1.6}.contacto-content{display:grid;grid-template-columns:1.2fr .8fr;gap:4rem;align-items:start}.contacto-form-section{background:var(--color-pure);border-radius:1.5rem;padding:2.5rem;box-shadow:var(--shadow);border:1px solid rgba(47,65,86,.1)}.form-title{font-size:1.5rem;font-weight:var(--font-bold);color:var(--color-navy);margin:0 0 2rem}.contacto-form{display:flex;flex-direction:column;gap:1.5rem}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.form-group{display:flex;flex-direction:column;gap:.5rem}.form-group label{font-weight:var(--font-medium);color:var(--color-navy);font-size:.875rem}.form-group input,.form-group select,.form-group textarea{padding:.875rem 1rem;border:2px solid rgba(89,124,141,.2);border-radius:.75rem;font-size:1rem;font-family:var(--font-outfit);transition:var(--transition);background:var(--color-pure);color:var(--color-navy)}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:var(--color-teal);box-shadow:0 0 0 3px #597c8d1a;transform:translateY(-2px)}.form-group textarea{resize:vertical;min-height:100px}.submit-button{display:flex;align-items:center;justify-content:center;gap:.75rem;padding:1rem 2rem;background:linear-gradient(135deg,var(--color-navy),var(--color-teal));color:var(--color-pure);border:none;border-radius:.75rem;font-size:1rem;font-weight:var(--font-semibold);font-family:var(--font-outfit);cursor:pointer;transition:var(--transition);margin-top:1rem}.submit-button:hover{transform:translateY(-3px);box-shadow:var(--shadow-hover)}.submit-button svg{width:20px;height:20px}.contacto-info-section{display:flex;flex-direction:column;gap:1.5rem}.info-card{background:var(--color-pure);border-radius:1rem;padding:1.5rem;box-shadow:var(--shadow);border:1px solid rgba(47,65,86,.1);transition:var(--transition)}.info-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-hover)}.info-title{font-size:1.125rem;font-weight:var(--font-bold);color:var(--color-navy);margin:0 0 1rem}.info-title.emergency{color:var(--color-danger)}.contact-methods{display:flex;flex-direction:column;gap:1rem}.contact-method{display:flex;align-items:center;gap:1rem;padding:1rem;background:#c9d6e61a;border-radius:.75rem;border:1px solid rgba(201,214,230,.3);transition:var(--transition)}.contact-method:hover{background:#c9d6e633;transform:translate(5px)}.method-icon{width:50px;height:50px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.5rem}.method-icon.whatsapp{background:var(--color-success);color:var(--color-pure)}.method-icon.phone{background:var(--color-warning);color:var(--color-pure)}.method-icon.email{background:var(--color-teal);color:var(--color-pure)}.method-info h4{font-size:1rem;font-weight:var(--font-semibold);color:var(--color-navy);margin:0 0 .25rem}.method-info p{color:var(--color-primary-600);margin:0 0 .5rem;font-size:.875rem}.method-info a{color:var(--color-teal);text-decoration:none;font-size:.875rem;font-weight:var(--font-medium)}.method-info a:hover{text-decoration:underline}.location-details{display:flex;flex-direction:column;gap:1rem;margin-bottom:1.5rem}.location-item{display:flex;align-items:flex-start;gap:.75rem}.location-icon{font-size:1.25rem;margin-top:.125rem}.location-item p{margin:0 0 .25rem;color:var(--color-primary-600);line-height:1.4}.location-item strong{color:var(--color-navy)}.map-container{margin:1.5rem 0;border-radius:.75rem;overflow:hidden;box-shadow:0 4px 20px #0000001a;border:2px solid rgba(89,124,141,.1);transition:var(--transition)}.map-container:hover{box-shadow:0 8px 30px #00000026;transform:translateY(-2px)}.google-map{width:100%;height:300px;border:none;display:block}.location-button{display:inline-flex;align-items:center;justify-content:center;padding:.75rem 1.5rem;background:var(--color-navy);color:var(--color-pure);text-decoration:none;border-radius:.5rem;font-weight:var(--font-medium);transition:var(--transition);width:100%;text-align:center}.location-button:hover{background:var(--color-primary-700);transform:translateY(-2px)}.emergency-info p{color:var(--color-primary-600);margin:0 0 1rem;line-height:1.5}.emergency-contacts{display:flex;flex-direction:column;gap:.5rem}.emergency-contact{display:flex;align-items:center;gap:.5rem;padding:.75rem;background:#ef44441a;color:var(--color-danger);text-decoration:none;border-radius:.5rem;font-weight:var(--font-medium);transition:var(--transition);border:1px solid rgba(239,68,68,.2)}.emergency-contact:hover{background:#ef444433;transform:scale(1.02)}.fade-up{opacity:0;transform:translateY(30px);animation:fadeUp .8s ease-out forwards}.fade-left{opacity:0;transform:translate(-30px);animation:fadeLeft .8s ease-out .2s forwards}.fade-right{opacity:0;transform:translate(30px);animation:fadeRight .8s ease-out .4s forwards}@keyframes fadeUp{to{opacity:1;transform:translateY(0)}}@keyframes fadeLeft{to{opacity:1;transform:translate(0)}}@keyframes fadeRight{to{opacity:1;transform:translate(0)}}@media (max-width: 1024px){.contacto-content{grid-template-columns:1fr;gap:2rem}.contacto-section{padding:6rem 0 3rem}.google-map{height:250px}}@media (max-width: 768px){.contacto-container{padding:0 1rem}.contacto-form-section{padding:1.5rem}.form-row{grid-template-columns:1fr}.contacto-title{font-size:2.5rem}.contacto-subtitle{font-size:1rem}.particle{display:none}.google-map{height:200px}}@media (max-width: 480px){.contacto-section{padding:5rem 0 2rem}.contacto-header{margin-bottom:2rem}.contact-method{flex-direction:column;text-align:center;gap:.75rem}.submit-button{padding:.875rem 1.5rem}.google-map{height:180px}}.form-group input.error,.form-group select.error,.form-group textarea.error{border-color:var(--color-danger);background-color:#ef44440d}.form-group input.success,.form-group select.success,.form-group textarea.success{border-color:var(--color-success);background-color:#10b9810d}.submit-button.loading{pointer-events:none;opacity:.7}.submit-button.loading:after{content:"";width:16px;height:16px;border:2px solid transparent;border-top:2px solid currentColor;border-radius:50%;animation:spin 1s linear infinite;margin-left:.5rem}@keyframes spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.particle{animation:none}}.submit-button:focus,.location-button:focus,.emergency-contact:focus,.method-info a:focus{outline:2px solid var(--color-teal);outline-offset:2px}
