:root {
    --ink: #17233a;
    --muted: #60708a;
    --brand: #173d73;
    --brand-dark: #0e274b;
    --line: #dbe3ee;
    --surface: #ffffff;
    --background: #f3f6fa;
    --danger: #a61b1b;
    --success: #1b6b47;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
body { margin: 0; background: var(--background); color: var(--ink); }
a { color: var(--brand); }
.shell { width: min(1080px, calc(100% - 32px)); margin: 0 auto; }

.hero {
    position: relative;
    min-height: 390px;
    display: flex;
    align-items: center;
    color: #fff;
    background: linear-gradient(135deg, #173d73, #0c203e);
}
.hero__image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .18; }
.hero__overlay { position: absolute; inset: 0; background: linear-gradient(135deg, rgba(17, 48, 92, .96), rgba(9, 25, 48, .9)), radial-gradient(circle at 15% 10%, rgba(255,255,255,.12), transparent 35%); }
.hero__content { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(280px, .75fr); gap: 48px; padding: 64px 0; align-items: center; }
.hero h1 { margin: 12px 0 16px; max-width: 760px; font-size: clamp(2rem, 5vw, 3.65rem); line-height: 1.04; }
.hero p { max-width: 720px; font-size: 1.05rem; line-height: 1.65; color: rgba(255,255,255,.88); }
.badge { display: inline-flex; padding: 7px 11px; border: 1px solid rgba(255,255,255,.35); border-radius: 999px; background: rgba(255,255,255,.1); font-size: .8rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.hero__checklist { padding: 0; margin: 22px 0 0; list-style: none; display: grid; gap: 9px; }
.hero__checklist li::before { content: "✓"; margin-right: 9px; font-weight: 900; }
.hero__card { padding: 24px; border: 1px solid rgba(255,255,255,.22); border-radius: 18px; background: rgba(255,255,255,.1); backdrop-filter: blur(8px); box-shadow: 0 18px 60px rgba(0,0,0,.16); }
.hero__card strong { font-size: 1.08rem; }
.hero__card p { margin: 10px 0; font-size: .95rem; }
.hero__card a { color: #fff; font-weight: 700; }

.main-content { padding: 42px 0 72px; }
.application-form { display: grid; gap: 22px; }
.wizard-progress { margin-bottom: 22px; padding: 18px 22px; border: 1px solid var(--line); border-radius: 16px; background: #fff; box-shadow: 0 8px 28px rgba(29, 55, 90, .05); }
.wizard-progress__summary { margin-bottom: 18px; }
.wizard-progress__summary p { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin: 0 0 9px; }
.wizard-progress__summary p > span { color: var(--muted); font-size: .8rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
.wizard-progress__summary p > strong { color: var(--brand-dark); font-size: .95rem; }
.wizard-progress__bar { height: 7px; overflow: hidden; border-radius: 999px; background: #e4ebf3; }
.wizard-progress__bar span { display: block; width: 0; height: 100%; border-radius: inherit; background: var(--brand); transition: width .2s ease; }
.wizard-progress ol { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; margin: 0; padding: 0; list-style: none; }
.wizard-progress li { position: relative; min-width: 0; flex: 1; color: #8694a8; text-align: center; }
.wizard-progress li:not(:last-child)::after { position: absolute; top: 15px; left: calc(50% + 22px); width: calc(100% - 44px); height: 2px; background: #dce4ee; content: ""; }
.wizard-progress li button { position: relative; z-index: 1; display: flex; width: 100%; min-width: 0; flex-direction: column; align-items: center; gap: 7px; border: 0; background: transparent; color: inherit; font: inherit; cursor: pointer; }
.wizard-progress li button:disabled { cursor: default; }
.wizard-progress li button:not(:disabled):hover strong { text-decoration: underline; }
.wizard-progress li button:focus-visible { border-radius: 8px; outline: 3px solid rgba(71, 120, 181, .3); outline-offset: 3px; }
.wizard-progress li span { position: relative; z-index: 1; display: grid; width: 32px; height: 32px; place-items: center; border: 2px solid #d4deea; border-radius: 50%; background: #fff; font-size: .78rem; font-weight: 900; }
.wizard-progress li strong { font-size: .75rem; line-height: 1.3; }
.wizard-progress li.is-active { color: var(--brand); }
.wizard-progress li.is-active span { border-color: var(--brand); box-shadow: 0 0 0 4px rgba(23, 61, 115, .1); }
.wizard-progress li.is-complete { color: var(--success); }
.wizard-progress li.is-complete span { border-color: var(--success); background: var(--success); color: #fff; }
.wizard-progress li.is-complete:not(:last-child)::after { background: #8fc7ae; }
.wizard-progress__hint { margin: 14px 0 0; color: var(--muted); font-size: .78rem; text-align: center; }
.wizard-step[hidden] { display: none !important; }
.form-required-note { margin: 0; color: var(--muted); font-size: .82rem; text-align: right; }
.form-required-note span, .required-mark { color: var(--danger); font-weight: 900; }
.panel { background: var(--surface); border: 1px solid var(--line); border-radius: 18px; padding: clamp(20px, 4vw, 34px); box-shadow: 0 10px 36px rgba(29, 55, 90, .06); }
.section-heading { display: flex; gap: 15px; align-items: flex-start; margin-bottom: 24px; }
.section-heading > span { flex: 0 0 36px; height: 36px; display: grid; place-items: center; border-radius: 11px; background: #eaf0f8; color: var(--brand); font-weight: 900; }
.section-heading h2 { margin: 1px 0 5px; font-size: 1.35rem; }
.section-heading p { margin: 0; color: var(--muted); line-height: 1.5; }
.grid { display: grid; gap: 18px; }
.grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-span-2 { grid-column: 1 / -1; }
.field { min-width: 0; margin-top: 18px; }
.grid .field { margin-top: 0; }
.field label, .field legend { display: block; margin-bottom: 7px; color: #25334b; font-size: .93rem; font-weight: 750; }
.form-control, .field input:not([type="radio"]), .field select, .field textarea {
    width: 100%; min-height: 46px; border: 1px solid #cbd6e4; border-radius: 10px; background: #fff; padding: 10px 12px; color: var(--ink); font: inherit; outline: none;
}
.field select {
    -webkit-appearance: none;
    appearance: none;
    padding-right: 44px;
    background-color: #fff;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%23173d73' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.75'/%3E%3C/svg%3E");
    background-position: right 14px center;
    background-repeat: no-repeat;
    background-size: 16px;
    cursor: pointer;
}
.field select:hover { border-color: #9fb2c9; }
.field select:disabled { background-color: #f1f4f8; color: var(--muted); cursor: not-allowed; }
.field textarea { min-height: 96px; resize: vertical; }
.form-control:focus, .field input:focus, .field select:focus, .field textarea:focus { border-color: #4778b5; box-shadow: 0 0 0 3px rgba(71, 120, 181, .14); }
.field small { display: block; margin-top: 7px; color: var(--muted); line-height: 1.45; }
.errorlist { margin: 7px 0 0; padding: 0; color: var(--danger); list-style: none; font-size: .88rem; font-weight: 650; }
.conditional { display: none; }
.conditional.is-visible { display: block; }
.form-subsection + .form-subsection { margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--line); }
.form-subsection h3 { margin: 0 0 14px; color: var(--brand-dark); font-size: 1.05rem; }
.form-subsection > p { margin: -7px 0 16px; color: var(--muted); font-size: .88rem; }
.application-document-group { margin-top: 18px; padding: 20px; border: 1px solid #dce5ef; border-radius: 14px; background: #f8fafc; }
.application-document-group h3 { margin: 0 0 4px; color: var(--brand-dark); font-size: 1.02rem; }
.application-document-group h3 i { margin-right: .45rem; color: var(--brand); }
.application-document-group > p { margin: 0 0 16px; color: var(--muted); font-size: .84rem; }
.application-document-group .field label:not(:first-child) { margin-top: 14px; }
.application-response-group { margin-top: 16px; padding: 18px; border: 1px solid #dce5ef; border-radius: 14px; background: #fbfcfe; }
.application-response-group:first-of-type { margin-top: 0; }
.application-response-group__heading { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 16px; }
.application-response-group__heading > span { display: grid; width: 38px; aspect-ratio: 1; flex: 0 0 auto; place-items: center; border-radius: 10px; background: #e8f0f8; color: var(--brand); }
.application-response-group__heading h3 { margin: 1px 0 3px; color: var(--brand-dark); font-size: 1rem; }
.application-response-group__heading p { margin: 0; color: var(--muted); font-size: .82rem; line-height: 1.4; }
.academic-response-choice > .field:first-child { margin-top: 0; }
.academic-response-choice .conditional.is-visible { margin-top: 14px; }
.application-response-group--consent { display: grid; grid-template-columns: minmax(260px, .85fr) minmax(340px, 1.15fr); align-items: center; gap: 20px; }
.application-response-group--consent .application-response-group__heading,
.application-response-group--consent .field { margin: 0; }
.formation-row { margin-top: 14px; padding: 18px; border: 1px solid #dce5ef; border-radius: 12px; background: #f8fafc; }
.delete-field { display: flex; grid-column: 1 / -1; align-items: center; gap: 8px; }
.delete-field input { width: auto !important; min-height: auto !important; }
.delete-field label { margin: 0; }
.profile-save-notice { display: flex; gap: .55rem; margin: 22px 0 0; padding: 12px 14px; border-radius: 10px; background: #edf4fb; color: #50657e; font-size: .88rem; }
.profile-form-section + .profile-form-section { margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--line); }
.profile-form-section h3 { margin: 0 0 14px; color: var(--brand-dark); font-size: 1.05rem; }
.profile-form-section > p { color: var(--muted); font-size: .88rem; }
.identity-section-heading { display: flex; align-items: flex-start; gap: 13px; margin-bottom: 20px; }
.identity-section-heading__icon { display: grid; width: 43px; aspect-ratio: 1; flex: 0 0 auto; place-items: center; border-radius: 12px; background: #e8f0f8; color: var(--brand); font-size: 1.15rem; }
.identity-section-heading h3 { margin: 2px 0 3px; }
.identity-section-heading p { margin: 0; color: var(--muted); font-size: .82rem; }
.profile-fields-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.profile-fields-grid__wide { grid-column: 1 / -1; }
.formation-document { margin-top: 4px; padding: 16px; border: 1px solid #cfe0f1; border-radius: 12px; background: #f5f9fd; }
.formation-document__heading { display: flex; align-items: flex-start; gap: 12px; }
.formation-document__heading > span { display: grid; width: 38px; aspect-ratio: 1; flex: 0 0 auto; place-items: center; border-radius: 10px; background: #dfeefa; color: var(--brand); }
.formation-document__heading strong, .formation-document__heading small { display: block; }
.formation-document__heading small { margin-top: 3px; color: var(--muted); font-size: .78rem; }
.formation-document__current { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 14px; padding: 11px 13px; border-radius: 9px; background: #e6f5ef; color: #176b54; font-size: .8rem; }
.formation-document__current a { margin-left: auto; font-weight: 800; }
.formation-document__options { margin-top: 16px; }
.formation-document-upload { padding: 7px !important; }
.formation-document-upload::file-selector-button { margin: -7px 12px -7px -7px; padding: 11px 13px; border: 0; border-right: 1px solid #cbd6e4; background: #e8f0f8; color: var(--brand-dark); font: inherit; font-weight: 700; cursor: pointer; }
.education-document-link, .education-document-missing { align-self: flex-start; margin-top: 7px; font-size: .76rem; font-weight: 800; }
.education-document-link { display: inline-flex; align-items: center; gap: 5px; text-decoration: none; }
.education-document-missing { color: #9a5a13; }
.saved-document-card { padding: 12px 16px; border: 1px solid #b9e4d7; border-radius: 10px; background: #eaf8f3; color: #16715a; font-size: .84rem; }
.saved-document-card strong { color: #0d4b3b; font-size: .86rem; }
.saved-document-card .doc-filename { color: #3b5d52; font-size: .78rem; word-break: break-all; }
.btn-replace-toggle { border: 1px solid #a3d9c8; background: #fff; color: #16715a; font-size: .76rem; font-weight: 700; padding: 4px 10px; border-radius: 6px; cursor: pointer; transition: .15s ease; }
.btn-replace-toggle:hover { background: #16715a; color: #fff; border-color: #16715a; }
.file-replace-container { margin-top: 10px; padding: 12px; border: 1px dashed #cbd8e6; border-radius: 8px; background: #fff; }
.profile-review-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin-top: 22px; }
.account-email-link { display: inline-flex; align-items: center; gap: .45rem; font-size: .88rem; font-weight: 800; text-decoration: none; }
.account-email-notice { display: flex; gap: .7rem; margin-bottom: 24px; padding: 13px 15px; border: 1px solid #cfe0f1; border-radius: 10px; background: #f1f6fb; color: #526a84; font-size: .88rem; line-height: 1.5; }
.person-summary__header { display: flex; align-items: center; gap: 16px; padding-bottom: 22px; border-bottom: 1px solid var(--line); }
.person-summary__avatar { display: grid; width: 56px; aspect-ratio: 1; flex: 0 0 auto; place-items: center; border-radius: 50%; background: var(--brand); color: #fff; font-weight: 900; }
.person-summary__header h3 { margin: 0 0 4px; color: var(--brand-dark); font-size: 1.3rem; }
.person-summary__header p { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; margin: 0; }
.verified-email { color: var(--success); font-size: .78rem; font-weight: 800; }
.person-summary__sections { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; padding: 24px 0; }
.person-summary h4 { margin: 0 0 12px; color: var(--brand-dark); font-size: .78rem; font-weight: 900; letter-spacing: .05em; text-transform: uppercase; }
.person-summary dl { display: grid; gap: 10px; margin: 0; }
.person-summary dl div { display: grid; grid-template-columns: minmax(105px, .8fr) 1.2fr; gap: 10px; }
.person-summary dt { color: var(--muted); font-size: .76rem; font-weight: 650; }
.person-summary dd { margin: 0; font-size: .84rem; font-weight: 750; overflow-wrap: anywhere; }
.person-summary__education { padding-top: 20px; border-top: 1px solid var(--line); }
.person-summary__education ul { display: grid; gap: 9px; margin: 0; padding: 0; list-style: none; }
.person-summary__education li { display: flex; flex-direction: column; padding: 11px 13px; border-radius: 9px; background: #f5f8fc; }
.person-summary__education li span, .person-summary__education p { color: var(--muted); font-size: .8rem; }
.phone-field .iti { width: 100%; }
.phone-field .iti input { width: 100%; min-height: 46px; }
.identity-live-field input[aria-invalid="false"] { border-color: #63b79f; }
.identity-live-field input[aria-invalid="true"] { border-color: #d8736b; }
.field-live-status { display: flex; align-items: center; gap: 6px; min-height: 20px; margin-top: 6px; color: var(--muted); font-size: .76rem; font-weight: 700; }
.field-live-status--valid { color: var(--success); }
.field-live-status--invalid { color: var(--danger); }
.wizard-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--line); }
.wizard-next i { margin-right: 0; margin-left: .5rem; }
.radio-field { min-width: 0; border: 0; padding: 0; }
.radio-field > div,
.radio-field > ul { display: flex; flex-wrap: wrap; gap: 9px; margin: 0; padding: 0; list-style: none; }
.radio-field > div > div,
.radio-field > ul > li { margin: 0; }
.radio-field > div > div label,
.radio-field > ul > li label { display: flex; min-width: 88px; align-items: center; justify-content: center; gap: 8px; margin: 0; padding: 10px 16px; border: 1px solid var(--line); border-radius: 10px; background: #fff; cursor: pointer; font-weight: 700; transition: border-color .15s ease, background-color .15s ease, box-shadow .15s ease; }
.radio-field > div > div label:hover,
.radio-field > ul > li label:hover { border-color: #9fb2c9; background: #f5f8fc; }
.radio-field label:has(input:checked) { border-color: var(--brand); background: #eaf1fa; color: var(--brand-dark); box-shadow: 0 0 0 2px rgba(23, 61, 115, .08); }
.radio-field input { width: auto; min-height: auto; accent-color: var(--brand); }
.recommendations { margin-top: 24px; padding-top: 22px; border-top: 1px solid var(--line); }
.recommendations h3 { margin: 0 0 6px; }
.recommendations > p { margin: 0 0 18px; color: var(--muted); }
.alert { padding: 14px 16px; border-radius: 12px; }
.alert p { margin: 0; }
.alert--error { border: 1px solid #efb3b3; background: #fff1f1; color: #821919; }
.preview-notice { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 24px; padding: 16px 18px; border: 1px solid #9fc4ed; border-radius: 14px; background: #eef6ff; color: #173f70; }
.preview-notice > i { margin-top: 1px; font-size: 1.2rem; }
.preview-notice div { display: flex; flex-direction: column; gap: 3px; }
.preview-notice span { color: #486887; font-size: .92rem; line-height: 1.45; }
[data-wizard-read-only="true"] input:disabled,
[data-wizard-read-only="true"] select:disabled,
[data-wizard-read-only="true"] textarea:disabled { border-color: #d5dee8; background-color: #f1f4f7; color: #536579; cursor: not-allowed; opacity: 1; }
.hidden { display: none !important; }

.submit-panel { text-align: center; padding: 18px 0 0; }
.button { display: inline-flex; justify-content: center; align-items: center; border: 0; border-radius: 11px; background: var(--brand); color: #fff; padding: 12px 20px; text-decoration: none; font: inherit; font-weight: 800; cursor: pointer; }
.button:hover { background: var(--brand-dark); }
.button i { margin-right: .5rem; }
.button--secondary { border: 1px solid #c7d5e5; background: #fff; color: var(--brand); }
.button--secondary:hover { border-color: #9db6d1; background: #eef4fa; color: var(--brand-dark); }
.button:disabled { opacity: .6; cursor: wait; }
.button--large { width: min(100%, 560px); min-height: 54px; font-size: 1.05rem; }
.submit-panel small { display: block; max-width: 700px; margin: 12px auto 0; color: var(--muted); }
#submit-status { min-height: 24px; margin: 10px 0 0; color: var(--muted); font-weight: 650; }
.closed-panel { max-width: 760px; margin: 0 auto; text-align: center; }

.review-panel { border-color: #b9cae0; background: linear-gradient(180deg, #fff, #f8fbfe); }
.review-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.review-summary__section { min-width: 0; padding: 20px; border: 1px solid #dce5ef; border-radius: 14px; background: #fff; }
.review-summary h3 { margin: 0 0 16px; color: var(--brand-dark); font-size: 1rem; }
.review-summary h3 i { margin-right: .45rem; color: var(--brand); }
.review-profile, .review-responses { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 18px; margin: 0; }
.review-profile div, .review-responses div { min-width: 0; }
.review-profile dt, .review-responses dt { margin-bottom: 3px; color: var(--muted); font-size: .72rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.review-profile dd, .review-responses dd { margin: 0; color: var(--ink); font-size: .9rem; font-weight: 650; line-height: 1.45; overflow-wrap: anywhere; }
.review-responses { grid-template-columns: 1fr; gap: 13px; }
.review-responses div { padding-bottom: 13px; border-bottom: 1px solid #eef2f6; }
.review-responses div:last-child { padding-bottom: 0; border-bottom: 0; }
.review-summary__notice { display: flex; gap: .55rem; margin: 18px 0 0; padding: 12px 14px; border-radius: 10px; background: #edf4fb; color: #50657e; font-size: .88rem; line-height: 1.45; }
.review-summary__notice i { color: var(--brand); }
.review-actions { display: flex; justify-content: flex-end; gap: 12px; margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--line); }
.review-actions .button--large { width: auto; min-width: 275px; }
.thanks-actions { display: flex; justify-content: center; gap: 12px; margin-top: 26px; }

.iti, .country-select { width: 100%; }
.country-select .country-list { color: var(--ink); }

.thanks-page { min-height: 100vh; display: grid; place-items: center; background: radial-gradient(circle at top left, #e7eef8, transparent 42%), var(--background); }
.thanks-shell { padding: 40px 0; }
.thanks-card { max-width: 720px; margin: 0 auto; text-align: center; }
.thanks-card h1 { margin: 10px 0 18px; font-size: clamp(2rem, 5vw, 3rem); }
.thanks-card p { color: var(--muted); line-height: 1.65; }
.success-mark { width: 64px; height: 64px; margin: 0 auto 16px; display: grid; place-items: center; border-radius: 50%; background: #e3f5eb; color: var(--success); font-size: 2rem; font-weight: 900; }
.eyebrow { margin: 0; text-transform: uppercase; letter-spacing: .08em; font-size: .78rem; font-weight: 900; color: var(--brand) !important; }

@media (max-width: 820px) {
    .hero__content { grid-template-columns: 1fr; gap: 24px; padding: 46px 0; }
    .hero { min-height: 0; }
    .grid--2 { grid-template-columns: 1fr; }
    .review-summary { grid-template-columns: 1fr; }
    .wizard-progress { padding: 16px; }
    .wizard-progress li strong { display: none; }
    .wizard-progress li:not(:last-child)::after { left: calc(50% + 18px); width: calc(100% - 36px); }
    .person-summary__sections, .profile-fields-grid { grid-template-columns: 1fr; }
    .profile-fields-grid__wide { grid-column: auto; }
    .application-response-group--consent { grid-template-columns: 1fr; gap: 14px; }
}

@media (max-width: 520px) {
    .shell { width: min(100% - 22px, 1080px); }
    .main-content { padding-top: 22px; }
    .panel { border-radius: 14px; padding: 20px 16px; }
    .hero h1 { font-size: 2.15rem; }
    .review-profile { grid-template-columns: 1fr; }
    .review-actions, .thanks-actions { flex-direction: column-reverse; }
    .wizard-actions { align-items: stretch; flex-direction: column-reverse; }
    .wizard-actions .button { width: 100%; }
    .review-actions .button--large { width: 100%; min-width: 0; }
    .thanks-actions .button { width: 100%; }
    .person-summary dl div { grid-template-columns: 1fr; gap: 2px; }
}
