.temporary-contact { position:relative; min-height:100vh; overflow:hidden; padding:clamp(7rem,10vw,9rem) 0 clamp(5rem,10vw,8rem); background:#060d19; }
.temporary-contact::before { content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(circle at 82% 28%,rgba(11,126,230,.22),transparent 32%); }
.temporary-contact-layout { position:relative; display:grid; grid-template-columns:minmax(0,.9fr) minmax(320px,.75fr); grid-template-areas:"copy form" "details form"; column-gap:clamp(3rem,8vw,8rem); row-gap:0; align-items:start; }
.temporary-contact-copy { grid-area:copy; }
.temporary-contact-copy h1,.temporary-contact-copy h2 { max-width:15ch; margin:1.1rem 0 1.5rem; color:#f3f8ff; font-size:clamp(2.4rem,5vw,4.4rem); line-height:.98; letter-spacing:-.035em; }
.temporary-contact-copy h1 em,.temporary-contact-copy h2 em { color:var(--cyan); font-style:normal; }
.contact-title-line,.temporary-contact-copy h1 > em { display:block; }
.contact-title-line { white-space:nowrap; }
.temporary-contact-copy > p:not(.eyebrow) { max-width:52ch; color:#b7c9dd; font-size:1.08rem; line-height:1.75; }
.temporary-contact-details { grid-area:details; display:grid; gap:1.1rem; margin-top:2.2rem; }
.temporary-contact-details a { color:#f4f8fe; font-size:1.1rem; font-weight:700; }
.temporary-contact-details a:hover { color:var(--cyan); }
.temporary-contact-details address { color:#f4f8fe; font-size:1.1rem; font-style:normal; line-height:1.55; }
.temporary-contact-details address strong { display:block; font-weight:700; }
.temporary-contact-details span { display:block; margin-bottom:.25rem; color:var(--cyan); font-family:var(--mono); font-size:.68rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.temporary-contact-form { grid-area:form; padding:clamp(1.5rem,4vw,2.5rem); border:1px solid rgba(123,192,255,.2); border-radius:10px; background:rgba(6,17,34,.82); box-shadow:0 22px 60px rgba(0,0,0,.25); }
.temporary-contact-form .form-row { margin-bottom:1.1rem; }
.temporary-contact-form label { display:block; margin-bottom:.48rem; color:#eaf3ff; font-size:.86rem; font-weight:700; }
.temporary-contact-form label small { color:#8ca2bc; font-weight:400; }
.temporary-contact-form input,.temporary-contact-form textarea { width:100%; padding:.85rem .95rem; border:1px solid rgba(142,186,228,.27); border-radius:4px; outline:none; background:rgba(2,9,20,.72); color:#fff; font:inherit; }
.temporary-contact-form input[type="file"] { padding:.65rem; color:#a6c1dc; font-size:.8rem; }
.temporary-contact-form input[type="file"]::file-selector-button { margin-right:.75rem; padding:.45rem .65rem; border:0; border-radius:3px; background:#167ad7; color:#fff; font:inherit; font-weight:700; cursor:pointer; }
.temporary-contact-form .form-row:has(input[type="file"]) { position:relative; padding-right:84px; }
.contact-photo-preview { position:absolute; right:0; bottom:0; width:68px; height:68px; border:1px solid rgba(103,222,255,.75); border-radius:4px; background:#07101d; box-shadow:0 5px 18px rgba(0,0,0,.35); object-fit:cover; }
.temporary-contact-form textarea { resize:vertical; min-height:7.5rem; }
.temporary-contact-form input:focus,.temporary-contact-form textarea:focus { border-color:var(--cyan); box-shadow:0 0 0 3px rgba(78,203,255,.12); }
.temporary-contact-form .button { width:100%; justify-content:center; margin-top:.4rem; }
.temporary-contact-form .button:disabled { cursor:wait; opacity:.65; }
.form-feedback { min-height:1.5rem; margin:1rem 0 0; color:#a6c1dc; font-size:.9rem; line-height:1.5; }
.form-feedback.is-success { color:#72f2bb; }.form-feedback.is-error { color:#ffafaa; }
@media(max-width:800px){.temporary-contact{padding:6.5rem 0 4.5rem}.temporary-contact-layout{grid-template-columns:1fr;grid-template-areas:"copy" "form" "details";gap:2.6rem}.temporary-contact-details{margin-top:0}.temporary-contact-copy h1{max-width:none;font-size:clamp(1.6rem,8vw,2.4rem)}.temporary-contact-copy h2{max-width:12ch}}
@media(max-width:420px){.temporary-contact .container{width:min(100% - 2rem,1120px)}}

/* Keep a successful submission at the top and show only its confirmation. */
.contact-success-page{position:relative;display:grid;min-height:100vh;overflow:hidden;padding:clamp(7rem,12vw,10rem) 1.5rem clamp(4rem,8vw,7rem);place-items:center;background:#060d19}
.contact-success-page::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 72% 28%,rgba(11,126,230,.24),transparent 36%)}
.contact-confirmation{position:relative;z-index:1;width:min(100%,620px);padding:clamp(2rem,5vw,4rem);border:1px solid rgba(123,192,255,.2);border-radius:10px;background:rgba(6,17,34,.84);box-shadow:0 22px 60px rgba(0,0,0,.25);text-align:center;outline:none}
.contact-confirmation-icon{display:grid;width:58px;height:58px;margin:0 auto 1.4rem;place-items:center;border:1px solid rgba(88,215,255,.62);border-radius:50%;background:rgba(37,157,255,.12);box-shadow:0 0 32px rgba(37,157,255,.15);color:var(--cyan);font-size:1.5rem;font-weight:800}
.contact-confirmation-label{margin:0 0 .7rem;color:var(--cyan);font:500 .68rem var(--mono);letter-spacing:.14em;text-transform:uppercase}
.contact-confirmation h2{margin:0;color:#f3f8ff;font-size:clamp(1.8rem,4vw,2.8rem);line-height:1.08}
.contact-confirmation-message{max-width:480px;margin:1.2rem auto 0;color:#c9d9ea;font-size:clamp(.95rem,1.6vw,1.08rem);line-height:1.7}
@media(max-width:800px){.contact-success-page{padding:6rem 1rem 3rem}.contact-confirmation{padding:2.25rem 1.25rem}}
