:root{--color-primary:24 18 47;--color-secondary:217 166 160}.contact-main-grid{align-items:start;display:grid;gap:3rem;grid-template-columns:1fr}@media(min-width:1024px){.contact-main-grid{gap:4rem;grid-template-columns:1fr 1fr}}.form-field{position:relative;width:100%}.form-field .input-icon,.form-field .pi{font-size:18px;margin-left:6px}.form-field__footer{align-items:flex-start;display:flex;gap:1rem;justify-content:space-between;margin-top:.5rem}.contact-input,.contact-textarea{background:#fff;border:1px solid rgba(229,231,235,.8);border-radius:.75rem;color:#6b7280;font-family:Open Sans,sans-serif;font-size:1rem;outline:none;padding:1.3rem 1.25rem 1.3rem 3rem;transition:border-color .2s ease;width:100%}.contact-input::-moz-placeholder,.contact-textarea::-moz-placeholder{color:#697183;font-weight:400}.contact-input::placeholder,.contact-textarea::placeholder{color:#697183;font-weight:400}.contact-input:hover,.contact-textarea:hover{border-color:#18122f4d}.contact-input:focus,.contact-textarea:focus{background:transparent;border-color:#18122f}.contact-input:disabled,.contact-textarea:disabled{cursor:not-allowed;opacity:.5}.contact-input.is-error,.contact-input.is-error:focus,.contact-textarea.is-error,.contact-textarea.is-error:focus{border-color:#ef4444}.contact-textarea{line-height:1.75;min-height:100px;resize:vertical}.field-error{color:#ef4444;display:block;font-size:.875rem;line-height:1.5;margin-top:.5rem}.char-count{color:#697183;flex-shrink:0;font-size:.75rem;margin-left:auto}.char-count.is-near-limit{color:#f59e0b}.form-note{color:#697183;font-size:.875rem;margin-top:.5rem}.alert{align-items:center;border-radius:.5rem;display:flex;font-size:.95rem;font-weight:500;gap:.75rem;padding:14px 1rem}.alert i{flex-shrink:0;font-size:1.125rem}.alert-success{background:#22c55e1a;border:1px solid rgba(34,197,94,.2);color:#16a34a}.alert-error{background:#ef44441a;border:1px solid rgba(239,68,68,.2);color:#dc2626}.fade-enter-active,.fade-leave-active{transition:opacity .3s ease,transform .3s ease}.fade-enter-from,.fade-leave-to{opacity:0;transform:translateY(-8px)}.contact-hero-image,.contact-image-wrap{height:auto;width:100%}.contact-hero-image{border-radius:2rem;display:block;-o-object-fit:cover;object-fit:cover}@media(prefers-reduced-motion:reduce){.alert,.contact-input,.contact-textarea,.fade-enter-active,.fade-leave-active{transition:none}}
