/* Enquiry: the same purple-blue palette as the learning panels. */
#contact{background:radial-gradient(ellipse at 45% 0%,#3d4052 0%,#303342 65%,#282b39 100%);color:#f5eee2;--ink:#f5eee2;--muted:#e5dfd4;--accent:#ead1ad;--section-heading-size:clamp(48px,6.4vw,110px);min-height:100svh;padding:16svh 7.5% 3svh;display:flex;flex-direction:column;align-items:stretch}
#contact .contact-grid{width:100%;grid-template-columns:1.18fr 1fr;gap:12%;align-items:start}
#contact .contact-grid>div{padding-top:7svh}
#contact h2{margin:0 0 6svh}
#contact .contact-invitation{color:inherit;margin:0}
#contact form{min-width:0}
#contact label{font:400 clamp(15px,1.15vw,19px)/1.4 var(--serif);margin-bottom:clamp(24px,5.2svh,48px)}
#contact input,#contact select,#contact textarea{color:inherit;font:400 var(--section-body-size)/1.3 var(--serif);border-bottom:1px solid #d4dbe0;padding:10px 0;background:transparent}
#contact select:invalid{color:#aeb9c2}
#contact option{background:#303342;color:#f5eee2}
#contact textarea{min-height:60px;height:clamp(60px,9vh,100px)}
#contact .button{width:100%;text-align:left;font:400 var(--section-body-size)/1.4 var(--serif);padding:10px 0 12px}
#contact .button:hover{color:#ead1ad}
#contact .form-note{font:12px/1.4 Arial,sans-serif;color:#c2c9ce;margin:12px 0 0}
#contact output:not(:empty){border-color:#6d8190}
#contact .contact-back-top{align-self:center;margin-top:auto;padding-top:28px;font:13px/1.4 var(--serif);text-decoration:none;color:#d4dbe0}
#contact .contact-back-top:hover{color:#ead1ad}
@media(max-width:760px){
 #contact{min-height:0;padding:64px 7% 24px;--section-heading-size:clamp(43px,8.5vw,60px)}
 #contact .contact-grid{grid-template-columns:1fr;gap:40px}
 #contact .contact-grid>div{padding-top:0}
 #contact h2{margin-bottom:24px}
 #contact label{margin-bottom:24px}
}
#contact .button{color:#f4f0ea;border-color:#d4dbe0}
#contact .button:focus-visible{outline:2px solid #ead1ad;outline-offset:5px}
