/* [study_abroad_contact_form] — uses the shared form styles (form.css), plus the "I am a…" choice cards. */
.sa-contact { max-width: 760px; margin: 0 auto; }
.sa-contact__roles { margin: 0 0 24px; padding: 0; border: 0; min-width: 0; }
.sa-contact__roles legend { margin: 0 0 10px; padding: 0; font-size: 15px; }
.sa-contact__role-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.sa-contact__role { position: relative; display: block; cursor: pointer; }
.sa-contact__role input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.sa-contact__role-box { display: flex; flex-direction: column; gap: 4px; height: 100%; box-sizing: border-box; padding: 14px 16px 14px 44px; border: 1px solid var(--sa-line); background: #fff; position: relative; transition: border-color .15s, background-color .15s; }
.sa-contact__role-box::before { content: ""; position: absolute; left: 16px; top: 16px; width: 16px; height: 16px; border: 2px solid #9a9a9a; border-radius: 50%; box-sizing: border-box; background: #fff; }
.sa-contact__role-box strong { font-size: 16px; font-weight: 600; }
.sa-contact__role-box span { font-size: 13px; line-height: 1.4; color: var(--sa-muted); }
.sa-contact__role:hover .sa-contact__role-box { border-color: #9a9a9a; }
.sa-contact__role input:checked + .sa-contact__role-box { border-color: #2e7d16; background: #f1f9ec; box-shadow: inset 0 0 0 1px #2e7d16; }
.sa-contact__role input:checked + .sa-contact__role-box::before { border-color: #2e7d16; background: radial-gradient(circle, #2e7d16 0 4px, #fff 5px); }
.sa-contact__role input:focus-visible + .sa-contact__role-box { outline: 2px solid #2e7d16; outline-offset: 2px; }
.sa-contact__note { margin: 16px 0 20px; font-size: 13px; color: var(--sa-muted); }
.sa-contact__send { background: #6bcb3d; color: #141010; font-weight: 600; }
.sa-contact__send:hover, .sa-contact__send:focus-visible { background: #58b52d; }
.sa-contact__done { padding: 40px 28px; text-align: center; background: #f1f9ec; border-top: 6px solid #6bcb3d; }
.sa-contact__done h3 { margin: 0 0 8px; font-size: 22px; }
.sa-contact__done p { margin: 0; color: #444; }
.sa-contact__done-icon { display: inline-flex; width: 52px; height: 52px; margin-bottom: 14px; border-radius: 50%; background: #2e7d16; align-items: center; justify-content: center; }
.sa-contact__done-icon::before { content: "✓"; color: #fff; font-size: 26px; font-weight: 700; }
@media (max-width: 700px) {
	.sa-contact__role-grid { grid-template-columns: minmax(0, 1fr); gap: 8px; }
	.sa-contact__send { width: 100%; justify-content: space-between; }
}
.sa-contact__captcha { margin-top: 20px; max-width: 360px; }
.sa-contact__captcha.has-error input { border-color: var(--sa-accent); background: #fff; }
/* Image captcha */
.sa-contact__captcha { max-width: 420px; }
.sa-contact__cap-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.sa-contact__cap-img { display: block; width: 240px; max-width: 100%; height: auto; border: 1px solid var(--sa-line); background: #f4f4f4; }
.sa-contact__cap-new { padding: 10px 14px; font-size: 14px; }
.sa-contact__captcha input[name="sa_cap"] { max-width: 240px; letter-spacing: .25em; text-transform: uppercase; font-weight: 600; }
.sa-contact__captcha.has-error input[name="sa_cap"] { border-color: var(--sa-accent); background: #fff; }