:root { color-scheme: dark; font-family: Poppins, sans-serif; --bg: #202123; --panel: #282a2d; --line: #3a3c3f; --yellow: #f7ca28; --muted: #b8b9bb; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: #f8f8f7; }
button, input, textarea { font: inherit; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }
:focus-visible { outline: 2px solid var(--yellow); outline-offset: 3px; }
.careers-header { position: relative; z-index: 3; display: flex; align-items: center; gap: 40px; min-height: 92px; padding: 18px max(4.8vw, 24px); border-bottom: 1px solid #35373a; background: #202123; }
.careers-brand { display: block; width: 182px; flex: 0 0 182px; }
.careers-brand img, .careers-footer img { display: block; width: 100%; height: auto; }
.careers-header nav { display: flex; align-items: center; gap: clamp(16px, 2.4vw, 36px); }
.careers-header nav a { color: #e0e0df; font-size: 13px; font-weight: 700; transition: color .16s ease; }
.careers-header nav a:hover, .careers-header nav a[aria-current="page"] { color: var(--yellow); }
.careers-nav-apply { display: inline-flex; align-items: center; gap: 14px; min-height: 45px; margin-left: auto; padding: 0 19px; border-radius: 5px; background: var(--yellow); color: #1d1e20; font-size: 12px; font-weight: 800; white-space: nowrap; }
.careers-nav-apply svg, .careers-primary svg { width: 16px; height: 16px; }
.careers-menu { display: none; }
.careers-banner { position: relative; isolation: isolate; display: flex; align-items: flex-end; min-height: 300px; overflow: hidden; background: #151b28; }
.careers-banner-image { position: absolute; z-index: -2; inset: 0; background-image: url('/assets/images/hero-flight-3.jpg'); background-position: 50% 50%; background-size: cover; }
.careers-banner::before { position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg, rgba(16,19,25,.94), rgba(16,19,25,.5) 52%, rgba(16,19,25,.02)); content: ""; }
.careers-banner-inner { width: min(100%, 1560px); margin: 0 auto; padding: 39px max(4.8vw, 24px); }
.careers-banner-inner > span, .careers-section-heading span, .careers-form-head > span, .careers-kicker { color: var(--yellow); font-size: 11px; font-weight: 800; }
.careers-banner h1 { margin: 8px 0 4px; font-size: clamp(45px, 5.6vw, 72px); line-height: 1; font-weight: 800; }
.careers-banner p { max-width: 600px; margin: 0; color: #eeeeed; font-size: clamp(15px, 1.5vw, 20px); line-height: 1.5; }
.careers-openings { width: min(100%, 1560px); margin: 0 auto; padding: 46px max(4.8vw, 24px) 92px; }
.careers-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 25px; }
.careers-section-heading h2 { margin: 5px 0 0; font-size: clamp(27px, 3vw, 39px); line-height: 1.15; }
.careers-section-heading p { margin: 0 0 3px; color: var(--muted); font-size: 12px; }
.careers-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.careers-card { display: flex; flex-direction: column; min-width: 0; min-height: 230px; padding: 22px; border: 1px solid #414246; border-radius: 6px; background: #282a2d; animation: careers-arrive .35s both; transition: border-color .18s, background .18s, transform .18s; }
.careers-card:hover { border-color: #e8c23e; background: #303133; transform: translateY(-3px); }
.careers-card-top, .careers-card-bottom { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.careers-card-top { color: #d2d2d1; font-size: 11px; font-weight: 600; }
.careers-card-top span:last-child { color: var(--yellow); text-align: right; white-space: nowrap; }
.careers-card-body { display: grid; gap: 10px; margin: 23px 0 auto; }
.careers-card-body strong { color: #fff; font-size: clamp(18px, 1.65vw, 24px); line-height: 1.25; }
.careers-card-body > span { color: #c1c2c4; font-size: 12px; line-height: 1.6; }
.careers-card-bottom { margin-top: 28px; padding-top: 13px; border-top: 1px solid #45474a; color: var(--yellow); font-size: 11px; font-weight: 800; }
.careers-card-bottom svg { width: 17px; height: 17px; }
.careers-empty { display: grid; justify-items: center; gap: 10px; padding: 80px 20px; color: #c5c6c7; text-align: center; }
.careers-empty svg { width: 30px; height: 30px; color: var(--yellow); }
.careers-empty h1, .careers-empty h3 { margin: 4px 0; color: #f2f2f1; font-size: 20px; }
.careers-empty p { max-width: 450px; margin: 0; font-size: 13px; line-height: 1.7; }
.careers-role-page { min-height: calc(100vh - 220px); }
.careers-page-inner { width: min(100%, 1440px); margin: 0 auto; padding: 0 max(4.8vw, 24px); }
.careers-back { display: inline-flex; align-items: center; gap: 9px; color: #cacbcd; font-size: 12px; font-weight: 700; }
.careers-back:hover { color: var(--yellow); }
.careers-back svg { width: 16px; height: 16px; }
.careers-role-hero { position: relative; isolation: isolate; min-height: 450px; overflow: hidden; background: #16202d url('/assets/images/hero-flight-3.jpg') center 43% / cover no-repeat; }
.careers-role-hero::before { position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg, rgba(16,19,25,.98) 0%, rgba(16,19,25,.91) 28%, rgba(16,19,25,.48) 58%, rgba(16,19,25,.1) 100%); content: ""; }
.careers-role-hero::after { position: absolute; z-index: -1; inset: auto 0 0; height: 80px; background: linear-gradient(0deg, rgba(17,20,24,.35), transparent); content: ""; }
.careers-role-hero-inner { display: flex; flex-direction: column; justify-content: space-between; width: min(100%, 1440px); min-height: 450px; margin: 0 auto; padding: 27px max(4.8vw, 24px) 42px; }
.careers-role-title { max-width: 760px; }
.careers-live-dot { display: inline-block; width: 7px; height: 7px; margin-right: 7px; border-radius: 50%; background: #58d69b; box-shadow: 0 0 0 4px rgba(88,214,155,.13); vertical-align: 1px; }
.careers-role-hero h1 { max-width: 800px; margin: 10px 0 15px; color: #fff; font-size: clamp(43px, 5vw, 72px); line-height: 1.06; font-weight: 700; }
.careers-role-hero p { max-width: 660px; margin: 0 0 24px; color: #f0f0ef; font-size: clamp(15px, 1.3vw, 18px); line-height: 1.62; }
.careers-primary { display: inline-flex; align-items: center; justify-content: center; gap: 18px; min-height: 47px; padding: 0 19px; border: 0; border-radius: 5px; background: var(--yellow); color: #1d1e20; font-size: 12px; font-weight: 800; }
.careers-primary:hover, .careers-nav-apply:hover { background: #ffe066; }
.careers-primary:disabled, .careers-primary:disabled:hover { background: #686b70; color: #e7e8e8; cursor: not-allowed; }
.careers-role-layout { display: grid; grid-template-columns: minmax(0, 1fr) 270px; gap: clamp(40px, 8vw, 130px); padding: 55px 0 74px; }
.careers-role-copy { display: grid; gap: 52px; min-width: 0; }
.careers-role-section { padding-bottom: 47px; border-bottom: 1px solid var(--line); }
.careers-role-section-heading > span { color: var(--yellow); font-size: 10px; font-weight: 800; }
.careers-role-section h2 { margin: 5px 0 23px; font-size: clamp(26px, 2.4vw, 34px); line-height: 1.2; }
.careers-role-copy :is(ol, ul) { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.careers-role-copy ol li { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 18px; padding: 17px 0; border-top: 1px solid #373a3d; }
.careers-role-copy ol li > span { color: var(--yellow); font-size: 12px; font-weight: 800; }
.careers-role-copy ol p { margin: 0; color: #e2e2e1; font-size: 15px; line-height: 1.6; }
.careers-role-copy ul { gap: 15px; }
.careers-role-copy ul li { display: flex; align-items: flex-start; gap: 14px; color: #d0d1d2; font-size: 14px; line-height: 1.65; }
.careers-role-copy ul svg { width: 19px; height: 19px; flex: 0 0 19px; margin-top: 2px; color: var(--yellow); }
.careers-role-aside { position: sticky; top: 28px; display: flex; flex-direction: column; align-self: start; padding-left: 25px; border-left: 1px solid #5a5b5c; }
.careers-aside-eyebrow { margin-bottom: 13px; color: var(--yellow); font-size: 10px; font-weight: 800; }
.careers-role-aside > div { display: grid; grid-template-columns: 22px 1fr; gap: 1px 12px; padding: 15px 0; border-bottom: 1px solid var(--line); }
.careers-role-aside svg { grid-row: span 2; width: 19px; height: 19px; color: var(--yellow); }
.careers-role-aside > div span { color: #aeb0b2; font-size: 11px; }
.careers-role-aside strong { font-size: 13px; font-weight: 700; }
.careers-role-aside p { margin: 20px 0 0; color: #bfc1c2; font-size: 12px; line-height: 1.65; }
.careers-role-aside > a { display: inline-flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 25px; color: var(--yellow); font-size: 12px; font-weight: 800; }
.careers-role-aside > a svg { width: 16px; height: 16px; }
.careers-application-section { padding: 0 0 92px; border-top: 1px solid var(--line); background: #25272a; }
.careers-application-intro { display: flex; align-items: center; gap: 12px; padding-top: 48px; color: var(--yellow); font-size: 10px; font-weight: 800; }
.careers-application-intro svg { width: 19px; height: 19px; }
.careers-form { max-width: 900px; padding: 11px 0 0; scroll-margin-top: 24px; }
.careers-discord-gate { max-width: 900px; padding: 11px 0 0; scroll-margin-top: 24px; }
.careers-discord-gate > span { color: var(--yellow); font-size: 11px; font-weight: 800; }
.careers-discord-gate h2 { margin: 6px 0 13px; font-size: clamp(30px, 3vw, 40px); }
.careers-discord-gate > p { max-width: 700px; margin: 0 0 22px; color: #c5c7c9; font-size: 14px; line-height: 1.7; }
.careers-discord-gate > .careers-error { color: #ff9b9b; }
.careers-discord-button { display: inline-flex; align-items: center; justify-content: center; gap: 11px; min-height: 50px; padding: 0 19px; border-radius: 5px; background: #5865f2; color: #fff; font-size: 13px; font-weight: 800; transition: background .16s ease, transform .16s ease; }
.careers-discord-button:hover { background: #4752c4; transform: translateY(-1px); }
.careers-discord-button svg { width: 20px; height: 20px; }
.careers-discord-button svg:last-child { width: 15px; height: 15px; margin-left: 8px; }
.careers-form-head { margin-bottom: 29px; }
.careers-form-head h2 { margin: 5px 0 7px; font-size: clamp(30px, 3vw, 40px); }
.careers-form-head p { margin: 0; color: #bec0c2; font-size: 14px; line-height: 1.6; }
.careers-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 19px; }
.careers-fields label { display: grid; gap: 7px; color: #e7e7e6; font-size: 11px; font-weight: 700; }
.careers-fields label.is-wide { grid-column: 1 / -1; }
.careers-field-title { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.careers-locked-label { display: inline-flex; align-items: center; gap: 4px; color: #8cdbad; font-size: 10px; font-weight: 600; }
.careers-locked-label svg { width: 11px; height: 11px; }
.careers-fields :is(input:not([type="checkbox"]), textarea) { width: 100%; min-width: 0; padding: 11px 12px; border: 1px solid #55575a; border-radius: 5px; outline: 0; background: #292b2d; color: #fff; font-size: 13px; font-weight: 400; }
.careers-fields input[readonly] { border-color: #426b59; background: #27362e; color: #d9f5e5; cursor: default; }
.careers-fields textarea { resize: vertical; line-height: 1.6; }
.careers-fields :is(input, textarea):focus { border-color: var(--yellow); }
.careers-fields .careers-consent { display: flex; align-items: flex-start; gap: 10px; margin: 4px 0; color: #c5c6c7; font-weight: 400; line-height: 1.5; }
.careers-consent input { width: 18px; height: 18px; flex: 0 0 18px; margin: 1px 0 0; accent-color: var(--yellow); }
.careers-honeypot { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.careers-form > .careers-primary { margin-top: 24px; }
.careers-error { color: #ff9b9b; font-size: 12px; }
.careers-success { display: flex; gap: 14px; max-width: 760px; margin: 50px 0; padding: 24px; border-left: 3px solid #64c892; background: #26362e; }
.careers-success svg { width: 21px; flex: 0 0 21px; color: #64c892; }
.careers-success strong { font-size: 16px; }
.careers-success p { margin: 7px 0 13px; color: #c9d4cd; font-size: 12px; line-height: 1.6; }
.careers-success a { display: inline-flex; align-items: center; gap: 6px; color: #fff; font-size: 11px; font-weight: 700; }
.careers-success a svg { width: 13px; }
.careers-footer { display: flex; align-items: center; gap: 30px; min-height: 130px; padding: 28px max(4.8vw, 24px); border-top: 1px solid var(--line); background: #1b1c1e; }
.careers-footer a { width: 170px; flex: 0 0 170px; }
.careers-footer span { max-width: 720px; color: #a8aaae; font-size: 11px; line-height: 1.6; }
@keyframes careers-arrive { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 1050px) { .careers-header { gap: 20px; }.careers-header nav { gap: 15px; }.careers-header nav a { font-size: 11px; }.careers-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 780px) { .careers-header { min-height: 75px; }.careers-brand { width: 154px; flex-basis: 154px; }.careers-menu { display: grid; width: 38px; height: 38px; margin-left: auto; place-items: center; border: 1px solid var(--line); border-radius: 5px; background: transparent; color: #fff; }.careers-menu svg { width: 18px; }.careers-header nav { position: absolute; top: 100%; right: 0; left: 0; display: none; flex-direction: column; align-items: stretch; gap: 0; padding: 10px 24px 18px; border-bottom: 1px solid var(--line); background: #202123; }.careers-header nav.is-open { display: flex; }.careers-header nav a { padding: 12px 0; font-size: 13px; }.careers-nav-apply { min-height: 38px; margin: 0; padding: 0 11px; font-size: 10px; }.careers-nav-apply svg { display: none; }.careers-role-hero, .careers-role-hero-inner { min-height: 490px; }.careers-role-hero { background-position: 63% center; }.careers-role-hero::before { background: linear-gradient(90deg, rgba(16,19,25,.96), rgba(16,19,25,.77) 48%, rgba(16,19,25,.3)); }.careers-role-layout { grid-template-columns: 1fr; gap: 30px; }.careers-role-aside { position: static; max-width: none; } }
@media (max-width: 530px) { .careers-header { gap: 8px; padding-inline: 16px; }.careers-brand { width: 132px; flex-basis: 132px; }.careers-menu { order: 3; }.careers-nav-apply { order: 2; margin-left: auto; }.careers-banner { min-height: 220px; }.careers-banner::before { background: linear-gradient(0deg, rgba(16,19,25,.92), rgba(16,19,25,.22)); }.careers-banner-inner { padding: 30px 20px; }.careers-banner h1 { font-size: 48px; }.careers-openings { padding: 36px 20px 65px; }.careers-section-heading { align-items: flex-start; flex-direction: column; gap: 7px; }.careers-card-grid { grid-template-columns: 1fr; gap: 12px; }.careers-card { min-height: 190px; }.careers-page-inner { padding-inline: 20px; }.careers-role-hero, .careers-role-hero-inner { min-height: 530px; }.careers-role-hero { background-position: 64% center; }.careers-role-hero::before { background: linear-gradient(0deg, rgba(16,19,25,.96), rgba(16,19,25,.8) 63%, rgba(16,19,25,.36)); }.careers-role-hero-inner { padding: 21px 20px 35px; }.careers-role-hero h1 { font-size: clamp(38px, 10vw, 48px); }.careers-role-hero p { font-size: 14px; }.careers-role-layout { padding: 38px 0 50px; }.careers-role-copy { gap: 35px; }.careers-role-section { padding-bottom: 34px; }.careers-role-copy ol li { gap: 9px; }.careers-application-section { padding-bottom: 65px; }.careers-application-intro { padding-top: 37px; }.careers-fields { grid-template-columns: 1fr; }.careers-form { padding-top: 9px; }.careers-footer { align-items: flex-start; flex-direction: column; gap: 19px; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; }.careers-card { animation: none; transition: none; } }
