/* by: Codex. Prospect form within the personal portfolio's existing identity. */
.contact-layout{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:64px;align-items:start}
.contact-intro h2{font-size:clamp(30px,3.3vw,46px);line-height:1.2}.contact-intro .closing-note{margin-top:26px;font-size:17px;line-height:1.7;max-width:35ch}.contact-person{margin:38px 0 25px;color:#b7bec5;font-size:14px;line-height:1.7}.contact-person strong{display:block;margin-top:14px;color:#f5efe3;font-size:17px;font-weight:600}.contact-person span{display:block;font-size:13px}
.prospect-form{position:relative;padding:34px;background:#111820f5;border:1px solid #ffffff30;box-shadow:0 20px 70px #0004;border-top:2px solid #f5a524}.form-heading{padding-bottom:26px;border-bottom:1px solid #ffffff20;margin-bottom:25px}.form-heading h3{font:400 23px/1.35 var(--display);letter-spacing:-.015em;color:#f5efe3}.form-heading p{margin-top:10px;font-size:14px;line-height:1.6;color:#b7bec5}.contact-fields{display:grid;grid-template-columns:1fr 1fr;gap:20px}.contact-field{min-width:0;margin-bottom:22px}.contact-field label{display:flex;align-items:baseline;justify-content:space-between;gap:10px;font-size:14px;font-weight:600;line-height:1.5;margin-bottom:9px;color:#eeeae2}.contact-field label span{font-size:12px;font-weight:400;color:#aeb8c1}.contact-field input,.contact-field textarea{display:block;box-sizing:border-box;width:100%;border:1px solid #59636d;background:#0b1015;color:#f5efe3;border-radius:3px;padding:13px 14px;min-height:49px;font:400 16px/1.5 var(--sans);transition:border-color .15s,box-shadow .15s}.contact-field textarea{resize:vertical;min-height:142px}.contact-field textarea::placeholder{color:#939fa9;opacity:1}.contact-field input:hover,.contact-field textarea:hover{border-color:#919ca5}.contact-field input:focus,.contact-field textarea:focus{outline:2px solid #f5a524;outline-offset:3px;border-color:#f5a524}.contact-field input:user-invalid,.contact-field textarea:user-invalid{border-color:#f2aa99}.prospect-form .field-hint{font-size:12px;line-height:1.6;color:#b7bec5;margin-top:10px}.form-footer{display:flex;flex-direction:column;gap:22px}.form-footer p{color:#b7bec5;font-size:12px;line-height:1.7;max-width:48ch}.form-footer a,.contact-status a{color:#f5c168;text-decoration:underline;text-underline-offset:3px}.form-footer .button{display:flex;align-items:center;justify-content:space-between;width:100%;border:0;cursor:pointer;padding:16px 20px;color:#111820;font:600 15px/1.4 var(--sans);min-height:54px}.form-footer .button:disabled{cursor:wait;opacity:.75;transform:none}.prospect-form[data-sent="true"] .button{cursor:default;background:#d1dfd5}.contact-status{font-size:14px;line-height:1.7;color:#f5efe3;margin-top:0;overflow-wrap:anywhere}.contact-status:not(:empty){margin-top:23px;padding-top:20px;border-top:1px solid #ffffff25}.prospect-form[data-state="error"] .contact-status{color:#f5c7b9}.contact-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
@media(max-width:1000px){.contact-layout{gap:36px}.prospect-form{padding:26px}.contact-fields{grid-template-columns:1fr;gap:0}}
@media(max-width:760px){.contact-layout{grid-template-columns:1fr;gap:32px}.contact-intro h2{font-size:34px}.contact-intro .closing-note{max-width:48ch;font-size:16px}.contact-person{margin:24px 0 18px}.prospect-form{padding:24px 20px}.form-heading h3{font-size:22px}.contact-field label{font-size:14px}.form-footer .button{font-size:15px}.contact-fields{grid-template-columns:1fr}}
