/* SKIES2 Staff Recruitment 1.0.0 — UI Guide 1.3.5. */
#sk-web .sw-nav .rc-nav-link { white-space: nowrap; }
#sk-web .sw-nav .rc-nav-link.is-open { background: var(--sk-brand-aviation); }
#sk-web .rc-nav-link.is-open:hover { background: var(--sk-text-link-hover, var(--sk-link-hover)); }
#sk-web .rc-nav-link[aria-current="page"] { box-shadow: inset 0 -3px var(--sk-brand-technical); }
#sk-web .rc-nav-count { display: inline-flex; justify-content: center; align-items: center; min-width: 20px; min-height: 20px; padding: 0 4px; border-radius: var(--sk-radius-pill); background: var(--sk-selection-bg); color: var(--sk-text-heading); font: 600 12px/16px var(--sk-font-heading); }
#sk-web #main.rc-page > section { min-height: 0; }
#sk-web .rc-page { background: var(--sk-bg-surface); font: 400 16px/24px var(--sk-font-body); overflow-wrap: anywhere; }
#sk-web .rc-page h1 { color: var(--sk-text-heading); font: 700 48px/56px var(--sk-font-heading); letter-spacing: -.02em; }
#sk-web .rc-page h2 { color: var(--sk-text-heading); font: 600 24px/32px var(--sk-font-heading); }
#sk-web .rc-page h3 { color: var(--sk-text-heading); font: 600 20px/28px var(--sk-font-heading); }
#sk-web .rc-hero { padding-block: 64px 48px; border-bottom: 1px solid var(--sk-border-subtle); }
#sk-web .rc-hero-grid { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); gap: 64px; align-items: center; }
#sk-web .rc-back { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; margin-bottom: 24px; font: 600 14px/20px var(--sk-font-heading); }
#sk-web .rc-hero h1 span { display: block; font: 600 28px/36px var(--sk-font-heading); color: var(--sk-brand-aviation); letter-spacing: 0; margin-top: 16px; }
#sk-web .rc-lead { color: var(--sk-text-secondary); max-width: 64ch; margin-top: 20px; }
#sk-web .rc-team-note { padding: 32px; background: var(--sk-neutral-25); border: 1px solid var(--sk-border-subtle); border-radius: var(--sk-radius-card); }
#sk-web .rc-note-icon { display: inline-flex; padding: 12px; background: var(--sk-selection-bg); color: var(--sk-brand-aviation); border-radius: var(--sk-radius-control); margin-bottom: 20px; }
#sk-web .rc-team-note p { margin-top: 12px; color: var(--sk-text-secondary); }
#sk-web .rc-note-meta { display: flex; align-items: center; gap: 8px; margin-top: 24px; font: 500 14px/20px var(--sk-font-body); color: var(--sk-brand-aviation); }
#sk-web .rc-list-section { padding-block: 48px 64px; background: var(--sk-bg-page); }
#sk-web .rc-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 28px; }
#sk-web .rc-section-heading p { color: var(--sk-text-secondary); margin-top: 8px; }
#sk-web .rc-search-form { display: flex; align-items: end; gap: 12px; margin-bottom: 20px; }
#sk-web .rc-search-form .sk-field { max-width: 560px; flex: 1; }
#sk-web .rc-filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px; }
#sk-web .rc-filters a { display: inline-flex; align-items: center; gap: 8px; padding: 11px 12px; min-height: 44px; color: var(--sk-link); border: 1px solid var(--sk-border-subtle); border-radius: var(--sk-radius-control); background: var(--sk-bg-surface); text-decoration: none; font: 600 14px/20px var(--sk-font-heading); }
#sk-web .rc-filters a:hover { color: var(--sk-link-hover); background: var(--sk-action-subtle-hover); }
#sk-web .rc-filters a:active { background: var(--sk-action-subtle-active); }
#sk-web .rc-filters a[aria-current] { color: var(--sk-selection-text); border-color: var(--sk-selection-border); background: var(--sk-selection-bg); box-shadow: inset 0 -2px var(--sk-selection-border); }
#sk-web .rc-filters a:focus-visible { outline: 3px solid var(--sk-focus-ring); outline-offset: 2px; }
#sk-web .rc-results-count { margin-bottom: 16px; color: var(--sk-text-secondary); font-size: 14px; }
#sk-web .rc-vacancy-list { display: grid; gap: 16px; }
#sk-web .rc-vacancy-card { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 32px; padding: 28px; border: 1px solid var(--sk-border-subtle); border-radius: var(--sk-radius-card); background: var(--sk-bg-surface); }
#sk-web .rc-card-top { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-bottom: 12px; }
#sk-web .rc-team-label { color: var(--sk-brand-aviation); font: 600 12px/16px var(--sk-font-heading); }
#sk-web .rc-vacancy-copy h3 { margin-bottom: 12px; }
#sk-web .rc-vacancy-copy h3 a { color: var(--sk-text-heading); text-decoration: none; }
#sk-web .rc-vacancy-copy h3 a:hover { text-decoration: underline; }
#sk-web .rc-vacancy-copy p { max-width: 72ch; color: var(--sk-text-secondary); }
#sk-web .rc-metadata { display: flex; flex-wrap: wrap; gap: 12px 24px; margin-top: 20px; padding: 0; list-style: none; color: var(--sk-text-secondary); font: 400 14px/20px var(--sk-font-body); }
#sk-web .rc-metadata li { display: flex; gap: 8px; align-items: center; }
#sk-web .rc-metadata svg { color: var(--sk-brand-aviation); }
#sk-web .rc-vacancy-action { display: flex; flex-direction: column; justify-content: center; align-items: flex-end; gap: 16px; max-width: 250px; }
#sk-web .rc-vacancy-action p { color: var(--sk-text-secondary); font: 400 12px/16px var(--sk-font-body); text-align: right; }
#sk-web .rc-empty { display: flex; flex-direction: column; align-items: center; gap: 16px; padding: 48px 24px; text-align: center; border: 1px solid var(--sk-border-subtle); border-radius: var(--sk-radius-card); background: var(--sk-bg-surface); }
#sk-web .rc-empty > svg { color: var(--sk-brand-aviation); width: 32px; height: 32px; }
#sk-web .rc-empty p { color: var(--sk-text-secondary); max-width: 56ch; }
#sk-web .rc-detail-wrap { padding-block: 32px 64px; }
#sk-web .rc-detail-heading { margin-bottom: 32px; }
#sk-web .rc-detail-heading h1 { margin-top: 12px; }
#sk-web .rc-detail-heading .sk-badge { margin-top: 20px; }
#sk-web .rc-detail-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, 340px); align-items: start; gap: 48px; }
#sk-web .rc-role-content > section { padding-block: 28px; border-top: 1px solid var(--sk-border-subtle); }
#sk-web .rc-bullet-list { padding-left: 24px; margin-top: 16px; display: grid; gap: 12px; }
#sk-web .rc-bullet-list li::marker { color: var(--sk-brand-aviation); }
#sk-web .rc-process ol { padding-left: 24px; display: grid; gap: 12px; margin-top: 16px; }
#sk-web .rc-role-facts { padding: 24px; border: 1px solid var(--sk-border-subtle); border-radius: var(--sk-radius-card); background: var(--sk-neutral-25); }
#sk-web .rc-role-facts h2 { font-size: 20px; line-height: 28px; }
#sk-web .rc-role-facts h3 { font-size: 16px; line-height: 24px; margin-top: 12px; }
#sk-web .rc-role-facts dl { display: grid; gap: 16px; margin: 24px 0; }
#sk-web .rc-role-facts dt { font: 400 12px/16px var(--sk-font-body); color: var(--sk-text-secondary); margin-bottom: 4px; }
#sk-web .rc-role-facts dd { margin: 0; font: 500 14px/20px var(--sk-font-body); }
#sk-web .rc-role-facts .sk-button { width: 100%; }
#sk-web .rc-small { color: var(--sk-text-secondary); font: 400 12px/18px var(--sk-font-body); }
#sk-web .rc-role-facts .rc-small { margin-top: 16px; }
#sk-web .rc-closed { margin-bottom: 16px; }
#sk-web .rc-application-form { display: grid; gap: 28px; border: 1px solid var(--sk-border-subtle); border-radius: var(--sk-radius-card); padding: 32px; }
#sk-web .rc-application-form fieldset { border: 0; padding: 0; margin: 0; min-width: 0; display: grid; gap: 20px; }
#sk-web .rc-application-form legend { font: 600 20px/28px var(--sk-font-heading); color: var(--sk-text-heading); margin-bottom: 20px; padding: 0; }
#sk-web .rc-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 20px; }
#sk-web .rc-form-grid > :first-child { grid-column: 1 / -1; }
#sk-web .rc-consent { display: flex; align-items: flex-start; gap: 12px; min-height: 44px; }
#sk-web .rc-consent input { margin-top: 4px; }
#sk-web .rc-consent label { font: 400 14px/22px var(--sk-font-body); cursor: pointer; }
#sk-web .rc-form-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
#sk-web .rc-honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
#sk-web .rc-confirmation { margin-inline: auto; padding: 48px 32px; max-width: 760px; text-align: center; display: grid; gap: 24px; justify-items: center; border: 1px solid var(--sk-border-subtle); border-radius: var(--sk-radius-card); }
#sk-web .rc-success-icon { display: inline-flex; padding: 16px; color: var(--sk-status-success-text); background: var(--sk-status-success-bg); border-radius: var(--sk-radius-pill); }
#sk-web .rc-success-icon svg { width: 32px; height: 32px; }
#sk-web .rc-reference { padding: 20px 32px; background: var(--sk-bg-page); border-radius: var(--sk-radius-control); display: grid; gap: 8px; }
#sk-web .rc-reference span { color: var(--sk-text-secondary); font-size: 12px; }
#sk-web .rc-reference strong { color: var(--sk-text-heading); font: 600 20px/28px var(--sk-font-heading); }
/* The additional destination needs more room than the previous five-link header. */
@container website (max-width: 1130px) {
  #sk-web .sw-nav { display: none; }
  #sk-web .sw-menu-button { display: inline-flex; }
  #sk-web .sw-header-join { margin-left: auto; }
}
@media (max-width: 860px) {
  #sk-web .rc-hero-grid { grid-template-columns: minmax(0,1fr); gap: 32px; }
  #sk-web .rc-team-note { padding: 24px; }
  #sk-web .rc-detail-grid { grid-template-columns: minmax(0,1fr); gap: 24px; }
  #sk-web .rc-role-aside { order: -1; }
  #sk-web .rc-role-facts dl { grid-template-columns: repeat(2,minmax(0,1fr)); }
  #sk-web .rc-vacancy-card { gap: 24px; }
}
@media (max-width: 639px) {
  #sk-web .rc-page h1 { font-size: 36px; line-height: 44px; }
  #sk-web .rc-hero h1 span { font-size: 24px; line-height: 32px; }
  #sk-web .rc-hero { padding-block: 32px; }
  #sk-web .rc-list-section { padding-block: 32px 48px; }
  #sk-web .rc-section-heading { align-items: flex-start; flex-direction: column; gap: 16px; }
  #sk-web .rc-vacancy-card { grid-template-columns: minmax(0,1fr); padding: 20px; }
  #sk-web .rc-vacancy-action { align-items: stretch; max-width: none; }
  #sk-web .rc-vacancy-action p { text-align: left; }
  #sk-web .rc-form-grid { grid-template-columns: minmax(0,1fr); }
  #sk-web .rc-application-form { padding: 20px; }
  #sk-web .rc-confirmation { padding: 32px 20px; }
  #sk-web .rc-reference { padding: 16px; width: 100%; }
  #sk-web .rc-form-actions .sk-button { width: 100%; }
  #sk-web .rc-search-form { flex-wrap: wrap; }
  #sk-web .rc-search-form .sk-field { flex-basis: 100%; }
}
/* VATSIM verification uses the same surfaces, states and type scale as the vacancy form. */
#sk-web .rc-verification { padding: 24px; border: 1px solid var(--sk-border-subtle); border-radius: var(--sk-radius-card); background: var(--sk-neutral-25); margin-bottom: 32px; }
#sk-web .rc-verification > .sk-alert { margin-bottom: 16px; }
#sk-web .rc-verified-identity { display: flex; gap: 8px; align-items: center; color: var(--sk-brand-aviation); font: 500 14px/20px var(--sk-font-body); }
#sk-web .rc-eligibility-metrics { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; margin: 24px 0; }
#sk-web .rc-eligibility-metrics > div { padding: 20px; border: 1px solid var(--sk-border-subtle); border-radius: var(--sk-radius-control); background: var(--sk-bg-surface); }
#sk-web .rc-eligibility-metrics dt { color: var(--sk-text-secondary); font: 400 14px/20px var(--sk-font-body); }
#sk-web .rc-eligibility-metrics dd { color: var(--sk-text-heading); font: 600 24px/32px var(--sk-font-heading); font-variant-numeric: tabular-nums; margin: 8px 0; }
#sk-web .rc-eligibility-metrics small { color: var(--sk-text-secondary); font: 400 12px/18px var(--sk-font-body); }
#sk-web .rc-verification-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
#sk-web .rc-verification-actions form { margin: 0; }
#sk-web .rc-verification-actions p { flex-basis: 100%; }
#sk-web .rc-gate-message { color: var(--sk-status-warning-text); margin-bottom: 20px; }
#sk-web .rc-role-eligibility p { margin-top: 16px; }
#sk-web .rc-card-eligibility { margin-top: 16px; }
/* Once eligible, keep only the verified measurements and account actions. */
#sk-web .rc-verification.rc-verification--compact { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--sk-space-4) var(--sk-space-6); padding: var(--sk-space-4) var(--sk-space-6); margin-bottom: var(--sk-space-6); }
#sk-web .rc-verification--compact .rc-eligibility-metrics { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sk-space-6); margin: 0; min-width: 0; }
#sk-web .rc-verification--compact .rc-eligibility-metrics > div { padding: 0; border: 0; border-radius: 0; background: transparent; min-width: 0; }
#sk-web .rc-verification--compact .rc-eligibility-metrics > div + div { border-inline-start: 1px solid var(--sk-border-subtle); padding-inline-start: var(--sk-space-6); }
#sk-web .rc-verification--compact .rc-eligibility-metrics dd { font-size: 20px; line-height: 28px; margin: var(--sk-space-1) 0 0; }
#sk-web .rc-verification--compact .rc-verification-actions { margin-inline-start: 0; }
#sk-web .rc-verification--compact .rc-requirements-met { flex-shrink: 0; margin-inline-start: auto; }
@media (max-width: 639px) {
 #sk-web .rc-verification { padding: 20px; }
 #sk-web .rc-eligibility-metrics { grid-template-columns: minmax(0,1fr); }
 #sk-web .rc-verification-actions :is(form,a) { width: 100%; }
 #sk-web .rc-verification-actions form button { width: 100%; }
 #sk-web .rc-verification.rc-verification--compact { padding: var(--sk-space-4); }
 #sk-web .rc-verification--compact .rc-eligibility-metrics { gap: var(--sk-space-4); }
 #sk-web .rc-verification--compact .rc-eligibility-metrics > div + div { padding-inline-start: var(--sk-space-4); }
 #sk-web .rc-verification--compact .rc-verification-actions { width: 100%; }
}