/*
 * JerryAir — immersive public layout.
 *
 * Values are transcribed from the "B · Website" design reference: its inline
 * styles became the classes below, its <helmet> rules are kept under the names
 * it gave them (ji-, jx-, jd-), and the colours of every surface come from the
 * time-of-day palettes at the top, switched by js/day.js.
 */

/* ---------- Design-system tokens used here ---------- */
:root {
    --action-primary: #003875;
    --action-primary-hover: #0B4A94;
    --on-primary: #FFFFFF;
    --action-accent: #F58932;
    --action-accent-hover: #E57A22;
    --on-accent: #141250;
    --space-2: 8px;
    --space-4: 16px;
    --space-5: 24px;
    --radius-sm: 4px;
    --control-height: 44px;
    --control-height-sm: 36px;
    --font-sans: Poppins, "Segoe UI", system-ui, -apple-system, sans-serif;
}

/* ---------- Time-of-day palettes ---------- */
.ji-root {
    --t-ink: #FFFFFF; --t-ink2: #E6EDF5; --t-muted: #C9D6E8; --t-faint: #8FA6C4; --t-hint: rgba(201, 214, 232, 0.8);
    --t-accent: #F58932; --t-accent2: #FFB273;
    --t-panel: rgba(5, 24, 48, 0.86); --t-panelsolid: #0A2448; --t-glass: rgba(5, 24, 48, 0.72); --t-card: rgba(5, 22, 46, 0.8);
    --t-line: rgba(255, 255, 255, 0.14); --t-line2: rgba(255, 255, 255, 0.12); --t-line3: rgba(255, 255, 255, 0.24);
    --t-tile: rgba(255, 255, 255, 0.05); --t-tile2: rgba(255, 255, 255, 0.12); --t-tileline: rgba(255, 255, 255, 0.09);
    --t-track: rgba(255, 255, 255, 0.12); --t-foot: rgba(255, 255, 255, 0.03); --t-dash: rgba(201, 214, 232, 0.45); --t-dash2: #C9D6E8; --t-res: rgba(201, 214, 232, 0.35);
    --t-good: #8BE0AE; --t-warn: #FFB273; --t-bad: #FF8A7A;
    --t-scroll: rgba(255, 255, 255, 0.22); --t-scroll-hover: #F58932;
    --t-strip: rgba(0, 18, 42, 0.78); --t-navbg: rgba(4, 18, 40, 0.5); --t-navline: rgba(255, 255, 255, 0.16);
    --t-navink: #E6EDF5; --t-navon: #FFFFFF; --t-navonink: #141250; --t-deck: #010916; --t-cool: #7FB0E8; --t-headbg: #04142E;
    --t-scrim: rgba(2, 10, 24, 0.64); --t-menubg: rgba(3, 14, 34, 0.95); --t-navonacc: #A4520E; --t-navonsub: #4E5672;
    --t-btnline: rgba(255, 255, 255, 0.85); --t-specgap: rgba(255, 255, 255, 0.12);
    --t-board: rgba(2, 10, 26, 0.5); --t-passbg: rgba(5, 24, 48, 0.62); --t-passsel: rgba(60, 34, 20, 0.62);
    --t-trail: rgba(255, 255, 255, 0.5); --t-partner: rgba(255, 255, 255, 0.06);
    --t-ui: 0; --t-dark: 1;
    /* Orange reads on the night palette; on the day one it falls under 3:1, so navy takes over. */
    --t-focus: #F58932;
}

html[data-ji-ui="light"] .ji-root {
    --t-ink: #0E2A4F; --t-ink2: #1E3A60; --t-muted: #3F5878; --t-faint: #5E7697; --t-hint: rgba(30, 58, 96, 0.72);
    /* The design's #C2590C is 4.44:1 on white and 4.08:1 on the pale veil; its own accent2 clears 4.5:1 on both. */
    --t-accent: #B4540C; --t-accent2: #B4540C;
    --t-panel: rgba(255, 255, 255, 0.86); --t-panelsolid: #FFFFFF; --t-glass: rgba(255, 255, 255, 0.80); --t-card: rgba(255, 255, 255, 0.82);
    --t-line: rgba(14, 42, 79, 0.14); --t-line2: rgba(14, 42, 79, 0.10); --t-line3: rgba(14, 42, 79, 0.22);
    --t-tile: rgba(14, 42, 79, 0.04); --t-tile2: rgba(14, 42, 79, 0.08); --t-tileline: rgba(14, 42, 79, 0.10);
    --t-track: rgba(14, 42, 79, 0.12); --t-foot: rgba(14, 42, 79, 0.03); --t-dash: rgba(14, 42, 79, 0.32); --t-dash2: #3F5878; --t-res: rgba(14, 42, 79, 0.22);
    --t-good: #1D7044; --t-warn: #A4520E; --t-bad: #B42318;
    --t-scroll: rgba(14, 42, 79, 0.22); --t-scroll-hover: #B4540C;
    --t-strip: rgba(255, 255, 255, 0.72); --t-navbg: rgba(255, 255, 255, 0.66); --t-navline: rgba(14, 42, 79, 0.14);
    --t-navink: #1E3A60; --t-navon: #0E2A4F; --t-navonink: #FFFFFF; --t-deck: #AFC3DC; --t-cool: #2F6DB0; --t-headbg: #EEF3F9;
    --t-scrim: rgba(14, 42, 79, 0.34); --t-menubg: rgba(240, 246, 252, 0.96); --t-navonacc: #FFB273; --t-navonsub: rgba(230, 237, 245, 0.82);
    --t-btnline: rgba(14, 42, 79, 0.5); --t-specgap: rgba(14, 42, 79, 0.10);
    --t-board: rgba(255, 255, 255, 0.72); --t-passbg: rgba(255, 255, 255, 0.78); --t-passsel: rgba(255, 244, 234, 0.92);
    --t-trail: rgba(14, 42, 79, 0.16); --t-partner: rgba(14, 42, 79, 0.05);
    --t-ui: 1; --t-dark: 0;
    --t-focus: #0E2A4F;
}

/* ---------- Base ---------- */
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: #003875; }
.ja { font-family: var(--font-sans); -webkit-font-smoothing: antialiased; }
.ja *, .ja *::before, .ja *::after { box-sizing: border-box; }
.ja :focus-visible { outline: 2px solid var(--t-focus); outline-offset: 2px; }
:where(.ja) a { color: inherit; }

.jx-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.ji-skip {
    position: fixed; z-index: 100; left: 16px; top: -64px;
    display: inline-flex; align-items: center; height: 44px; padding: 0 18px; border-radius: 4px;
    background: #F58932; color: #141250 !important; font: 600 15px/20px var(--font-sans); text-decoration: none;
    transition: top .2s ease;
}
.ji-skip:focus { top: 12px; }

/* ---------- Buttons ---------- */
.ja-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2);
    height: var(--control-height); padding: 0 var(--space-5);
    font: 500 15px/20px var(--font-sans); letter-spacing: .1px; text-decoration: none; white-space: nowrap;
    border: 1px solid transparent; border-radius: var(--radius-sm); cursor: pointer;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}
.ja-btn--primary, .ja-btn--primary:hover { color: var(--on-primary); }
.ja-btn--primary { background: var(--action-primary); }
.ja-btn--primary:hover { background: var(--action-primary-hover); }
.ja-btn--accent, .ja-btn--accent:hover { color: var(--on-accent); }
.ja-btn--accent { background: var(--action-accent); font-weight: 600; }
.ja-btn--accent:hover { background: var(--action-accent-hover); }
.ja-btn--inverse, .ja-btn--inverse:hover { color: var(--t-ink); }
.ja-btn--inverse { background: transparent; border-color: var(--t-btnline); }
.ja-btn--inverse:hover { background: var(--t-tile2); }
.ja-btn--sm { height: var(--control-height-sm); padding: 0 var(--space-4); font-size: 14px; }
.ja-btn svg { width: 18px; height: 18px; flex: none; transition: transform .25s ease; }
.ja-btn:hover svg { transform: translateX(4px); }
.ja-btn:active { transform: translateY(1px); }
.ja-btn--icon:hover svg { transform: none; }

/* ---------- Root, slides and the motion layer ---------- */
/* The legal footer (legal.css) takes --ji-fh off the bottom of the slides on wide screens. */
@media (min-width: 901px) { .ji-root { --ji-fh: 32px; } }
.ji-root {
    position: relative; height: 100vh; min-height: calc(780px + var(--ji-fh, 0px)); overflow: hidden;
    background: var(--t-deck); color: var(--t-ink);
    font-family: Poppins, 'Segoe UI', system-ui, sans-serif;
}
.ji-fading, .ji-fading * { transition: background-color .9s ease, border-color .9s ease, color .9s ease, box-shadow .9s ease; }

.ji-track:focus { outline: none; }
/* a heading takes focus only to move the reading position; it is no control to outline */
.ja h1[tabindex="-1"]:focus { outline: none; }
.ji-track {
    height: calc(100% - var(--ji-fh, 0px)); display: grid; grid-auto-flow: column; grid-auto-columns: 100%;
    transform: translateX(0); transition: transform .85s cubic-bezier(.77, 0, .18, 1);
}
.ji-slide {
    position: relative; overflow: hidden; background: #003875; display: flex; flex-direction: column;
    transition: transform .85s cubic-bezier(.77, 0, .18, 1), filter .85s ease, border-radius .85s ease;
}
.ji-slide[aria-hidden="true"] { transform: scale(.9); filter: brightness(.6) saturate(.85); border-radius: 28px; }

@keyframes jxRise { from { opacity: 0; translate: 0 26px; } }
@keyframes jxSide { from { opacity: 0; translate: 48px 0; } }
@keyframes jxReveal {
    from { clip-path: inset(-.3em -.2em 100% -.2em); translate: 0 .4em; }
    to { clip-path: inset(-.3em -.2em -.3em -.2em); translate: 0 0; }
}
@keyframes jxOdo { from { transform: translateY(0); } }
.ji-slide[aria-hidden="false"] .jx-r { animation: jxRise .9s cubic-bezier(.2, .8, .2, 1) .3s backwards; }
.ji-slide[aria-hidden="false"] .jx-p { animation: jxSide 1s cubic-bezier(.2, .8, .2, 1) .45s backwards; }
.ji-slide[aria-hidden="false"] .jx-h { animation: jxReveal 1.05s cubic-bezier(.2, .8, .2, 1) .3s backwards; }
.ji-slide[aria-hidden="false"] .jx-1 { animation-delay: .3s; }
.ji-slide[aria-hidden="false"] .jx-2 { animation-delay: .4s; }
.ji-slide[aria-hidden="false"] .jx-3 { animation-delay: .5s; }
.ji-slide[aria-hidden="false"] .jx-4 { animation-delay: .6s; }
.ji-slide[aria-hidden="false"] .jx-5 { animation-delay: .7s; }
.ji-slide[aria-hidden="false"] .jx-6 { animation-delay: .8s; }
.ji-slide[aria-hidden="false"] .jx-7 { animation-delay: .9s; }

/* pointer parallax on photo backdrops */
.jx-par {
    transform: translate3d(calc(var(--px, 0) * -18px), calc(var(--py, 0) * -12px), 0) scale(1.06);
    transition: transform 1.4s cubic-bezier(.2, .8, .2, 1);
}

/* cursor spotlight */
.jx-g { position: relative; }
.jx-g::before {
    content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; z-index: 3;
    background: radial-gradient(380px circle at var(--gx, 50%) var(--gy, -400px), rgba(245, 137, 50, .10), transparent 60%);
    opacity: 0; transition: opacity .4s ease;
}
.jx-g::after {
    content: ""; position: absolute; inset: -1px; border-radius: inherit; pointer-events: none; z-index: 3; padding: 1px;
    background: radial-gradient(220px circle at var(--gx, 50%) var(--gy, -400px), rgba(245, 137, 50, .9), transparent 70%);
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor;
    mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
    opacity: 0; transition: opacity .4s ease;
}
.jx-g:hover::before, .jx-g:hover::after { opacity: 1; }

/* ---------- Rolling digits ---------- */
.jx-num { display: inline-flex; align-items: baseline; white-space: nowrap; font-variant-numeric: tabular-nums; }
.jx-c { position: relative; display: block; height: 1.15em; line-height: 1.15em; overflow: hidden; overflow: clip; }
.jx-w { visibility: hidden; white-space: pre; }
.jx-s {
    position: absolute; left: 0; right: 0; top: 0; display: block; white-space: pre; text-align: center;
    line-height: 1.15em; transition: transform 1.1s cubic-bezier(.2, .8, .2, 1);
}
.jx-x .jx-s { transition: none; }
.jx-s[data-d="1"] { transform: translateY(-1.15em); }
.jx-s[data-d="2"] { transform: translateY(-2.30em); }
.jx-s[data-d="3"] { transform: translateY(-3.45em); }
.jx-s[data-d="4"] { transform: translateY(-4.60em); }
.jx-s[data-d="5"] { transform: translateY(-5.75em); }
.jx-s[data-d="6"] { transform: translateY(-6.90em); }
.jx-s[data-d="7"] { transform: translateY(-8.05em); }
.jx-s[data-d="8"] { transform: translateY(-9.20em); }
.jx-s[data-d="9"] { transform: translateY(-10.35em); }
.ji-slide[aria-hidden="false"] .jx-d .jx-s { animation: jxOdo 1.7s cubic-bezier(.16, .84, .24, 1) .45s backwards; }
.ji-slide[aria-hidden="false"] .jx-c:nth-child(2) .jx-s { animation-delay: .52s; }
.ji-slide[aria-hidden="false"] .jx-c:nth-child(3) .jx-s { animation-delay: .59s; }
.ji-slide[aria-hidden="false"] .jx-c:nth-child(4) .jx-s { animation-delay: .66s; }
.ji-slide[aria-hidden="false"] .jx-c:nth-child(5) .jx-s { animation-delay: .73s; }
.ji-slide[aria-hidden="false"] .jx-c:nth-child(n+6) .jx-s { animation-delay: .8s; }
/* A figure still on its way spins like a counter until it lands. */
@keyframes jxRoll { from { transform: translateY(0); } to { transform: translateY(-10.35em); } }
.jx-num[data-loading] .jx-s { animation: jxRoll .9s linear infinite !important; }

/* ---------- Chrome: contact strip, world time, header ---------- */
.ji-chrome { position: absolute; z-index: 10; top: 0; left: 0; right: 0; }

.ji-strip {
    background: var(--t-strip); border-bottom: 1px solid var(--t-line2);
    -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
}
.ji-strip-in {
    padding: 0 clamp(20px, 4vw, 56px); min-height: 42px;
    display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 24px; font-size: 13px;
}
.ji-contact { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 22px; padding: 8px 0; color: var(--t-ink2); }
.ji-contact > * { display: inline-flex; align-items: center; gap: 8px; }
.ji-contact a { color: var(--t-ink2); text-decoration: none; }
.ji-contact a:hover { text-decoration: underline; }
.ji-contact svg { flex: none; }
.ji-strip-r { display: flex; flex-wrap: wrap; align-items: center; font-variant-numeric: tabular-nums; }

.jd-chip {
    appearance: none; margin: 0 10px 0 0; cursor: pointer; font: inherit;
    display: inline-flex; align-items: center; gap: 7px; height: 28px; padding: 0 11px 0 8px; border-radius: 999px;
    background: var(--t-tile2); border: 1px solid var(--t-line); color: var(--t-ink);
    font-size: 12px; font-weight: 600; white-space: nowrap;
}
.jd-chip:hover { border-color: rgba(245, 137, 50, 0.7); }
.jd-chip-note { font-weight: 500; color: var(--t-faint); }
.jd-chip [data-icon] { display: none; }
.jd-chip[data-lux="day"] [data-icon="sun"], .jd-chip[data-lux="night"] [data-icon="moon"] { display: block; }

.ji-clocks { display: flex; flex-wrap: wrap; align-items: center; }
.ji-clock { display: inline-flex; align-items: baseline; gap: 8px; padding: 8px 16px; border-left: 1px solid var(--t-line); }
.ji-clock-city { font-size: 11px; font-weight: 600; letter-spacing: 1.2px; text-transform: uppercase; color: var(--t-faint); }
.ji-clock-time { font-size: 14px; font-weight: 600; color: var(--t-ink); }
.ji-clock-off { font-size: 11px; color: var(--t-faint); }

.ji-header {
    padding: 18px clamp(20px, 4vw, 56px) 14px;
    display: flex; align-items: center; justify-content: space-between; gap: 24px;
}
.ji-logo { display: flex; flex: none; text-decoration: none; }
.ji-logo-in { position: relative; display: block; }
.ji-logo img { height: clamp(56px, 5.6vw, 84px); width: auto; display: block; transition: opacity .9s ease; }
.ji-logo-dark { opacity: var(--t-dark); }
.ji-logo-light { position: absolute; left: 0; top: 0; opacity: var(--t-ui); }

.ji-links {
    position: relative; display: flex; align-items: center; gap: 2px; padding: 4px; border-radius: 8px;
    background: var(--t-navbg); border: 1px solid var(--t-navline);
    -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); font-size: 14px; font-weight: 500;
}
.ji-nav {
    position: relative; z-index: 1; margin: 0; padding: 9px 16px; border-radius: 6px;
    background: rgba(255, 255, 255, 0); color: var(--t-navink); text-decoration: none; line-height: 19px;
    transition: background-color .35s ease, color .35s ease;
}
.ji-nav:hover { background: var(--t-tile2); color: var(--t-navink); }
.ji-nav[aria-current="page"], .ji-nav[aria-current="page"]:hover { background: var(--t-navon); color: var(--t-navonink); }
.ji-nav--live { display: inline-flex; align-items: center; gap: 8px; padding: 9px 12px 9px 16px; }
.ji-badge {
    display: inline-grid; place-items: center; min-width: 22px; height: 20px; padding: 0 6px; border-radius: 4px;
    background: #5CC48A; color: #0A2416; font-size: 12px; font-weight: 700; line-height: 1;
}
.ji-badge[data-loading] { color: transparent; background: rgba(92, 196, 138, .55); animation: jiPulse 1.2s ease-in-out infinite; }
@keyframes jiPulse { 50% { opacity: .45; } }

/* sliding nav pill */
.jx-pill {
    position: absolute; left: 0; top: 4px; bottom: 4px; width: 0; border-radius: 6px;
    background: var(--t-navon); box-shadow: 0 6px 18px rgba(0, 8, 24, .18); opacity: 0; pointer-events: none;
}
.ji-links.jx-ready .jx-pill {
    opacity: 1;
    transition: transform .6s cubic-bezier(.65, 0, .2, 1), width .6s cubic-bezier(.65, 0, .2, 1), opacity .3s ease, background-color .35s ease;
}
.ji-links.jx-ready .ji-nav[aria-current="page"], .ji-links.jx-ready .ji-nav[aria-current="page"]:hover { background: transparent; }

.ji-hright { display: flex; align-items: center; gap: 16px; }
.ji-langsw { display: inline-flex; gap: 2px; font-size: 13px; font-weight: 600; }
.ji-langsw a { padding: 6px 8px; border-radius: 4px; color: var(--t-muted); text-decoration: none; }
.ji-langsw a:hover { color: var(--t-ink); }
.ji-langsw a[aria-current="true"] { background: var(--t-tile2); color: var(--t-ink); }
.ji-menu { display: none; padding: 0 8px; }

/* ---------- Time of day ---------- */
.jd-panel {
    position: absolute; z-index: 30; top: 50px; right: clamp(16px, 4vw, 56px);
    width: 380px; max-width: calc(100vw - 32px); padding: 16px 18px 18px; border-radius: 12px;
    background: var(--t-panel); border: 1px solid var(--t-line); box-shadow: 0 24px 60px rgba(0, 8, 24, 0.4);
    color: var(--t-ink); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
}
.jd-panel[hidden] { display: none; }
.jd-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.jd-title { margin: 0; font-size: 11px; font-weight: 600; letter-spacing: 1.6px; text-transform: uppercase; color: var(--t-accent); }
.jd-x {
    appearance: none; margin: 0; padding: 0; cursor: pointer; display: grid; place-items: center;
    width: 28px; height: 28px; border-radius: 6px; background: transparent; border: 0; color: var(--t-muted);
}
.jd-x:hover { color: var(--t-ink); background: var(--t-tile2); }
.jd-now { margin-top: 6px; display: flex; align-items: baseline; gap: 10px; }
.jd-time { font-size: 34px; line-height: 40px; font-weight: 600; letter-spacing: -0.6px; font-variant-numeric: tabular-nums; }
.jd-name { font-size: 15px; font-weight: 600; color: var(--t-accent2); }
.jd-mode {
    margin-left: auto; display: inline-flex; align-items: center; gap: 6px; height: 22px; padding: 0 9px; border-radius: 999px;
    background: var(--t-tile2); font-size: 11px; font-weight: 600; color: var(--t-muted); white-space: nowrap;
}
.jd-mode::before { content: ""; width: 6px; height: 6px; border-radius: 999px; background: #5CC48A; }
.jd-mode[data-mode="manual"]::before { background: #F58932; }
.jd-desc { margin: 4px 0 0; font-size: 13px; line-height: 19px; color: var(--t-muted); }
.jd-range {
    -webkit-appearance: none; appearance: none; width: 100%; height: 10px; margin: 16px 0 0; border-radius: 999px; outline: none; cursor: pointer;
    background: linear-gradient(90deg, #0B1B3A 0%, #0B1B3A 17.7%, #5B4A8E 21.9%, #E9A46A 25%, #9CC9EE 31%, #CFE6FB 50%, #9CC9EE 62.5%, #F58932 71.9%, #5B4A8E 77%, #0B1B3A 82.3%, #0B1B3A 100%);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18);
}
.jd-range::-webkit-slider-thumb {
    -webkit-appearance: none; appearance: none; width: 22px; height: 22px; border-radius: 999px;
    background: #FFFFFF; border: 3px solid #F58932; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.35);
}
.jd-range::-moz-range-thumb {
    width: 16px; height: 16px; border-radius: 999px; background: #FFFFFF; border: 3px solid #F58932; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.35);
}
.ja .jd-range:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(245, 137, 50, 0.5); }
.jd-ticks {
    margin-top: 6px; display: flex; justify-content: space-between; font-size: 10px; font-weight: 600;
    letter-spacing: 0.6px; color: var(--t-faint); font-variant-numeric: tabular-nums;
}
.jd-stops { margin-top: 14px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.jd-stop {
    appearance: none; margin: 0; cursor: pointer; font: inherit;
    display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 9px 4px 8px; border-radius: 8px;
    background: var(--t-tile); border: 1px solid var(--t-tileline); color: var(--t-ink);
}
.jd-stop[aria-pressed="true"] { background: rgba(245, 137, 50, 0.14); border-color: #F58932; }
.jd-stop:hover { border-color: rgba(245, 137, 50, 0.7); }
.jd-stop-l { font-size: 12px; font-weight: 600; white-space: nowrap; }
.jd-stop-s { font-size: 10.5px; color: var(--t-faint); white-space: nowrap; }

/* ---------- Mobile menu ---------- */
@keyframes jxMenuIn { from { opacity: 0; } }
@keyframes jxMenuItem { from { opacity: 0; translate: 0 22px; } }
.jx-menu {
    position: fixed; inset: 0; z-index: 45; width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; border: 0;
    display: flex; flex-direction: column; padding: 20px clamp(20px, 4vw, 56px) 26px; overflow-y: auto;
    background: var(--t-menubg); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); color: var(--t-ink);
    animation: jxMenuIn .35s ease;
}
.jx-menu:not([open]) { display: none; }
.jx-menu::backdrop { background: transparent; }
.jx-mtop { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.jx-kicker {
    margin: 0; display: flex; align-items: center; gap: 12px; font-size: 12px; font-weight: 600;
    letter-spacing: 2px; text-transform: uppercase; color: var(--t-accent);
}
.jx-kicker::before { content: ""; flex: none; width: 32px; height: 2px; background: #F58932; }
.jx-mclose {
    appearance: none; margin: 0; cursor: pointer; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 999px;
    border: 1px solid var(--t-line3); background: var(--t-tile); color: var(--t-ink);
}
.jx-mnav { margin-top: 22px; display: flex; flex-direction: column; gap: 4px; }
.jx-mi {
    width: 100%; display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; align-items: center; gap: 10px;
    padding: 12px 14px; border-radius: 12px; border: 1px solid transparent; background: transparent;
    color: var(--t-ink); text-decoration: none; transition: background-color 0.25s ease;
    animation: jxMenuItem .6s cubic-bezier(.2, .8, .2, 1) backwards;
}
.jx-mi:nth-child(1) { animation-delay: .05s; } .jx-mi:nth-child(2) { animation-delay: .1s; } .jx-mi:nth-child(3) { animation-delay: .15s; }
.jx-mi:nth-child(4) { animation-delay: .2s; } .jx-mi:nth-child(5) { animation-delay: .25s; } .jx-mi:nth-child(6) { animation-delay: .3s; }
.jx-mi:hover { background: var(--t-tile2); color: var(--t-ink); }
.jx-mi[aria-current="page"] { background: rgba(245, 137, 50, 0.12); border-color: rgba(245, 137, 50, 0.6); }
.jx-mi-num { font-size: 12px; font-weight: 700; letter-spacing: 1px; color: var(--t-faint); font-variant-numeric: tabular-nums; }
.jx-mi[aria-current="page"] .jx-mi-num { color: var(--t-accent); }
.jx-mi-t { min-width: 0; display: flex; flex-direction: column; }
.jx-mi-l { font-size: clamp(26px, 7vw, 34px); line-height: 1.1; font-weight: 600; letter-spacing: -0.03em; }
.jx-mi-s { margin-top: 2px; font-size: 13px; color: var(--t-faint); }
.jx-mi-arrow {
    display: grid; place-items: center; width: 34px; height: 34px; border-radius: 999px; background: #F58932; color: #141250;
    opacity: 0; transform: translateX(-8px); transition: opacity 0.25s ease, transform 0.25s ease;
}
.jx-mi:hover .jx-mi-arrow, .jx-mi[aria-current="page"] .jx-mi-arrow, .jx-mi:focus-visible .jx-mi-arrow { opacity: 1; transform: translateX(0); }
.jx-mspace { flex: 1; min-height: 20px; }
.jx-mfoot {
    display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px;
    padding-top: 18px; border-top: 1px solid var(--t-line3);
    animation: jxMenuItem .6s cubic-bezier(.2, .8, .2, 1) .35s backwards;
}
.jx-mfoot .ja-btn { height: 46px; padding: 0 22px; }
.jx-mfoot .ji-langsw a { padding: 8px 10px; border-radius: 6px; }
.jx-mmail { width: 100%; font-size: 13px; color: var(--t-faint); text-decoration: none; }
.jx-mmail:hover { color: var(--t-ink2); text-decoration: underline; }

/* ---------- Home ---------- */
.ji-sky { position: absolute; inset: 0; z-index: 0; isolation: isolate; overflow: hidden; }
.ji-sky img {
    position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 58% 50%;
    opacity: 0; z-index: 0; transition: opacity 1.4s linear;
}
.ji-veil { position: absolute; inset: 0; transition: opacity 0.9s ease; }
.ji-veil--light {
    opacity: var(--t-ui);
    background:
        linear-gradient(0deg, rgba(240, 246, 252, 0.92) 0%, rgba(240, 246, 252, 0.52) 36%, rgba(240, 246, 252, 0.04) 66%),
        linear-gradient(90deg, rgba(240, 246, 252, 0.74) 0%, rgba(240, 246, 252, 0.32) 40%, rgba(240, 246, 252, 0) 60%),
        linear-gradient(180deg, rgba(240, 246, 252, 0.74) 0%, rgba(240, 246, 252, 0) 22%);
}
.ji-veil--dark {
    opacity: var(--t-dark);
    background:
        linear-gradient(0deg, rgba(0, 24, 56, 0.92) 0%, rgba(0, 24, 56, 0.55) 40%, rgba(0, 24, 56, 0.1) 70%),
        linear-gradient(90deg, rgba(0, 24, 56, 0.6) 0%, rgba(0, 24, 56, 0.3) 40%, rgba(0, 24, 56, 0) 62%),
        linear-gradient(180deg, rgba(0, 24, 56, 0.7) 0%, rgba(0, 24, 56, 0) 26%);
}

/* departing aircraft over the apron

   The photo is cropped by object-fit: cover, differently on every screen, so a
   path in vw/vh lands in open sky on one and across a tail fin on another.
   The scene box is laid out exactly as the cover-fitted photo is — same aspect
   ratio, same 58% 50% anchor, same parallax — so inside it cqw and cqh are
   percent of the photo. The path is set there, and the photo's matte (the sky
   alone) masks it: where the path crosses the aircraft on an extreme crop, it
   passes behind it. Another photo needs only its own matte, ratio and points. */
@keyframes jxFly {
    0% { transform: translate(var(--fly-x0), var(--fly-y0)) scale(1); opacity: 0; }
    5% { opacity: 1; }
    64% { opacity: 1; }
    70% { transform: translate(var(--fly-x1), var(--fly-y1)) scale(.6); opacity: 0; }
    100% { transform: translate(var(--fly-x1), var(--fly-y1)) scale(.6); opacity: 0; }
}
@keyframes jxTrailW { 0% { width: 0; } 70% { width: var(--fly-trail); } 100% { width: var(--fly-trail); } }
@keyframes jxStrobe { 0%, 100% { opacity: 0; } 3%, 7% { opacity: 1; } 5% { opacity: .2; } }
.jx-scene { position: absolute; inset: 0; overflow: hidden; pointer-events: none; container-type: size; }
.jx-scene-box {
    --ar: 1.8083; /* 2000 × 1106 */
    --fly-x0: 40cqw; --fly-y0: 30cqh; --fly-x1: 106cqw; --fly-y1: 8cqh; --fly-trail: 30cqw;
    position: absolute; container-type: size;
    width: max(100cqw, 100cqh * var(--ar)); height: max(100cqh, 100cqw / var(--ar));
    left: calc((100cqw - max(100cqw, 100cqh * var(--ar))) * .58); top: calc((100cqh - max(100cqh, 100cqw / var(--ar))) * .5);
    -webkit-mask: url(../img/sky-mask.svg) 0 0 / 100% 100% no-repeat; mask: url(../img/sky-mask.svg) 0 0 / 100% 100% no-repeat;
}
/* Without container units the path falls back to the screen, as it always was. */
@supports not (width: 1cqw) {
    .jx-scene-box { inset: 0; width: auto; height: auto; -webkit-mask: none; mask: none; --fly-x0: 37vw; --fly-y0: 22.5vh; --fly-x1: 106vw; --fly-y1: 14vh; --fly-trail: 30vw; }
}
.jx-fly { position: absolute; left: 0; top: 0; z-index: 0; pointer-events: none; animation: jxFly 54s linear -8s infinite; }
/* Traffic placed by site.js: its own path, level and heading, and fainter the higher it flies. */
.jx-fly--js { animation: none; }
.jx-fly--js .jx-fly-trail { animation: none; opacity: calc((.35 + .55 * var(--t-lux, 0)) * var(--fly-fade, 1)); }
.jx-fly--js .jx-fly-plane { opacity: var(--fly-fade, 1); }
.jx-fly-in { position: relative; width: 18px; height: 18px; transform: rotate(-4deg); }
.jx-fly-plane { display: block; transform: rotate(90deg); color: rgba(38, 58, 90, calc(.15 + .65 * var(--t-lux, 0))); }
.jx-fly-trail {
    position: absolute; right: 12px; top: 50%; height: 5px; margin-top: -2.5px; width: 0;
    animation: jxTrailW 54s linear -8s infinite; opacity: calc(.35 + .55 * var(--t-lux, 0));
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .95)) 0 0 / 100% 1.5px no-repeat,
        linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .95)) 0 100% / 100% 1.5px no-repeat;
    filter: drop-shadow(0 0 1px rgba(14, 42, 79, .25));
}
.jx-fly-light { position: absolute; width: 3px; height: 3px; border-radius: 50%; opacity: var(--t-dark); }
.jx-strobe { left: 7.5px; top: 7.5px; background: #FFFFFF; box-shadow: 0 0 6px 2px rgba(255, 255, 255, .9); animation: jxStrobe 1.3s linear infinite; }

.ji-homein {
    position: relative; z-index: 1; flex: 1;
    padding: calc(74px + clamp(56px, 5.6vw, 84px)) clamp(20px, 4vw, 56px) 28px;
    display: flex; flex-direction: column;
}
.ji-homespace { flex: 1; min-height: 24px; }
.ji-hrow { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 32px 56px; }
.ji-hero { flex: 1 1 560px; min-width: 0; display: flex; flex-direction: column; gap: 24px; }
.ji-eyebrow {
    margin: 0; display: flex; align-items: center; gap: 12px; font-size: 13px; font-weight: 600;
    letter-spacing: 2px; text-transform: uppercase; color: var(--t-accent);
}
.ji-eyebrow::before { content: ""; flex: none; width: 40px; height: 2px; background: #F58932; }
.ji-h1 { margin: 0; font-size: clamp(56px, min(7.8vw, 12.5vh), 124px); line-height: 0.9; letter-spacing: -0.05em; font-weight: 600; color: var(--t-ink); }
.ji-h1 > span { display: inline-block; }
.ji-lede { margin: 0; max-width: 580px; font-size: 18px; line-height: 30px; color: var(--t-ink2); }

.ji-feats { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 16px 0; max-width: 760px; margin-left: -20px; }
.ji-feat {
    display: flex; flex-direction: column; gap: 6px; padding: 2px 20px; min-width: 0;
    border-left: 1px solid var(--t-line3); text-decoration: none;
}
.ji-feat:first-child { border-left-color: transparent; }
.ji-featd { font-size: 13px; line-height: 19px; color: var(--t-muted); }

.ji-ctas { display: flex; flex-wrap: wrap; gap: 12px; }
.ji-ctas .ja-btn { height: 52px; padding: 0 28px; font-size: 16px; }

/* live flights card */
.ji-livecard {
    flex: 0 1 400px; min-width: 0; background: #FFFFFF; color: #141250; border-radius: 10px;
    box-shadow: 0 24px 60px rgba(0, 12, 32, 0.35); overflow: hidden;
}
.ji-live-head {
    padding: 18px 20px 14px; display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
    border-bottom: 1px solid #DDE3EA;
}
.ji-live-over { margin: 0; font-size: 11px; font-weight: 600; letter-spacing: 1.6px; text-transform: uppercase; color: #A4520E; }
.ji-livet { margin: 4px 0 0; font-size: 20px; line-height: 26px; font-weight: 600; }
.ji-live-badge {
    display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 10px; border-radius: 4px;
    background: #E8F4EC; color: #1D7044; font-size: 12px; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap;
}
.ji-live-badge::before { content: ""; width: 7px; height: 7px; border-radius: 999px; background: #1D7044; }
.ji-live-rows { display: flex; flex-direction: column; }
.ji-row {
    display: flex; flex-direction: column; gap: 8px; padding: 12px 20px; border-bottom: 1px solid #DDE3EA;
    text-decoration: none; color: #141250;
}
a.ji-row:hover { background: #F3F5F7; color: #141250; }
.ja a.ji-row:focus-visible { outline-color: #003875; outline-offset: -2px; }
.ji-row-l1 {
    display: grid; grid-template-columns: 72px minmax(0, 1fr) auto; gap: 8px; align-items: center;
    font-size: 14px; font-variant-numeric: tabular-nums;
}
.ji-row-cs { font-weight: 700; color: #003875; }
.ji-row-rt { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ji-row-arrow { color: #A4520E; }
.ji-row-ac { color: #636B86; font-size: 12px; }
.ji-row-ph { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; color: #4E5672; }
.ji-dot { flex: none; width: 7px; height: 7px; border-radius: 999px; background: var(--dot, #636B86); }
.ji-row-l2 { display: flex; align-items: center; gap: 10px; }
.ji-row-bar { position: relative; flex: 1; height: 4px; border-radius: 2px; background: #E6EDF5; }
.ji-row-fill { position: absolute; left: 0; top: 0; bottom: 0; width: var(--pct, 0%); border-radius: 2px; background: #003875; }
.ji-row-plane { position: absolute; top: -6px; left: var(--pct, 0%); width: 16px; height: 16px; margin-left: -8px; color: #F58932; }
.ji-row-plane svg { display: block; transform: rotate(90deg); }
.ji-row-eta { font-size: 12px; color: #636B86; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ji-row--note { padding: 22px 20px; font-size: 14px; line-height: 21px; color: #4E5672; }
.ji-live-foot {
    padding: 14px 20px; display: flex; align-items: center; justify-content: space-between; gap: 12px; background: #FBFCFD;
}
.ji-live-more { font-size: 12px; color: #636B86; text-align: right; }

@keyframes jiShine { 0% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } }
.ji-skel {
    display: block; height: 12px; border-radius: 3px;
    background: linear-gradient(90deg, #EEF2F6 25%, #F8FAFC 37%, #EEF2F6 63%); background-size: 400% 100%;
    animation: jiShine 1.4s ease infinite;
}
.ji-row--skel .ji-row-l1 .ji-skel:nth-child(1) { width: 58px; }
.ji-row--skel .ji-row-l1 .ji-skel:nth-child(2) { width: 75%; }
.ji-row--skel .ji-row-l1 .ji-skel:nth-child(3) { width: 52px; }
.ji-row--skel .ji-row-bar { background: none; }
.ji-row--skel .ji-row-bar .ji-skel { height: 4px; }
.ji-row--skel .ji-row-eta .ji-skel { width: 64px; }

/* data rail */
.ji-rail {
    margin-top: 32px; padding-top: 20px; border-top: 1px solid var(--t-line3);
    display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 20px 40px;
}
.ji-stats { margin: 0; display: flex; flex-wrap: wrap; gap: 20px 48px; font-variant-numeric: tabular-nums; }
.ji-stat { display: flex; flex-direction: column-reverse; }
.ji-stat dd { margin: 0; font-size: 28px; line-height: 32px; font-weight: 600; }
.ji-stat dt { margin: 2px 0 0; font-size: 13px; color: var(--t-muted); }
.ji-railhubs { display: flex; align-items: center; gap: 12px; }
.ji-railhubs-l { font-size: 13px; color: var(--t-muted); }
.ji-hubbtn {
    display: inline-flex; align-items: center; height: 36px; padding: 0 14px; background: transparent;
    border: 1px solid var(--t-btnline); border-radius: 4px; font-size: 13px; font-weight: 600; letter-spacing: 0.8px;
    color: var(--t-ink); text-decoration: none; transition: border-color .2s ease, background-color .2s ease;
}
.ji-hubbtn:first-of-type { border-color: #F58932; }
.ji-hubbtn:hover { border-color: var(--t-line3); background: var(--t-tile2); color: var(--t-ink); }

/* ---------- Crew Center sign-in ---------- */
@keyframes jxLgIn { from { opacity: 0; transform: translateY(26px) scale(.98); } }
@keyframes jxLgOut { to { opacity: 0; } }
@keyframes jxKen { from { transform: scale(1.12); } to { transform: scale(1.02); } }
@keyframes jxSpin { to { transform: rotate(360deg); } }
@keyframes jxShake {
    10%, 90% { transform: translateX(-1px); } 20%, 80% { transform: translateX(2px); }
    30%, 50%, 70% { transform: translateX(-5px); } 40%, 60% { transform: translateX(5px); }
}
@keyframes jxDraw { from { stroke-dashoffset: 30; } }
@keyframes jxPop { from { transform: scale(.4); opacity: 0; } }
@keyframes jlPulse {
    0% { box-shadow: 0 0 0 0 rgba(92, 196, 138, .7); } 70% { box-shadow: 0 0 0 7px rgba(92, 196, 138, 0); }
    100% { box-shadow: 0 0 0 0 rgba(92, 196, 138, 0); }
}

.jx-lg {
    position: fixed; inset: 0; z-index: 60; width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; border: 0;
    display: grid; place-items: center; padding: 24px; overflow: hidden;
    background: var(--t-scrim); color: var(--t-ink);
    -webkit-backdrop-filter: blur(12px) saturate(1.1); backdrop-filter: blur(12px) saturate(1.1);
    animation: jxMenuIn .3s ease;
}
.jx-lg:not([open]) { display: none; }
.jx-lg::backdrop { background: transparent; }
.jx-lg[data-closing="true"] { animation: jxLgOut .22s ease forwards; }
.jx-lg-scrim { position: absolute; inset: 0; appearance: none; margin: 0; padding: 0; border: 0; background: transparent; cursor: default; }
.jx-lgp {
    position: relative; width: min(1080px, 100%); height: min(660px, 100%);
    display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr); border-radius: 22px; overflow: hidden;
    background: var(--t-panelsolid); color: var(--t-ink); border: 1px solid var(--t-line); box-shadow: 0 50px 120px rgba(0, 8, 24, 0.55);
    animation: jxLgIn .6s cubic-bezier(.2, .8, .2, 1);
}

.jx-lgv { position: relative; overflow: hidden; color: #FFFFFF; background: #04142E; }
.jx-lgsky { position: absolute; inset: 0; isolation: isolate; animation: jxKen 16s cubic-bezier(.2, .6, .2, 1) forwards; }
.jx-lgsky img {
    position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 62% 50%;
    opacity: 0; transition: opacity 1.4s linear;
}
.jx-lgshade {
    position: absolute; inset: 0;
    background: linear-gradient(180deg, rgba(3, 14, 34, 0.6) 0%, rgba(3, 14, 34, 0.05) 26%, rgba(3, 14, 34, 0.2) 48%, rgba(3, 14, 34, 0.93) 100%);
}
.jx-lglogo { position: absolute; left: 36px; top: 30px; height: 46px; width: auto; display: block; }
.jx-lgvc { position: absolute; left: 36px; right: 36px; bottom: 32px; }
.jx-lgvc > * { animation: jxRise .7s cubic-bezier(.2, .8, .2, 1) backwards; }
.jx-lgvc > :nth-child(1) { animation-delay: .25s; } .jx-lgvc > :nth-child(2) { animation-delay: .33s; }
.jx-lgvc > :nth-child(3) { animation-delay: .41s; } .jx-lgvc > :nth-child(4) { animation-delay: .49s; }
.jx-lgvc .jx-kicker { color: #FFB273; }
.jx-lgvh { margin: 12px 0 0; font-size: clamp(30px, 2.8vw, 40px); line-height: 1.02; letter-spacing: -0.04em; font-weight: 600; }
.jx-lgvp { margin: 12px 0 0; max-width: 420px; font-size: 14.5px; line-height: 22px; color: #E6EDF5; }
.jx-lglive { margin-top: 20px; padding-top: 16px; border-top: 1px solid rgba(255, 255, 255, 0.2); }
.jx-lglive-h {
    margin: 0; display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 600;
    letter-spacing: 0.4px; color: #FFFFFF; font-variant-numeric: tabular-nums;
}
.jl-pulse { flex: none; width: 7px; height: 7px; border-radius: 999px; background: #5CC48A; animation: jlPulse 1.8s infinite; }
.jx-lgticks { margin-top: 10px; display: flex; flex-direction: column; gap: 6px; }
.jx-lgtick {
    margin: 0; display: grid; grid-template-columns: 64px minmax(0, 1fr) auto; gap: 10px; align-items: center;
    font-size: 12.5px; color: #E6EDF5; font-variant-numeric: tabular-nums;
}
.jx-lgtick b { color: #FFB273; font-weight: 700; }
.jx-lgtick > span:nth-child(2) { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.jx-lgtick > span:nth-child(3) { display: inline-flex; align-items: center; gap: 6px; color: #C9D6E8; }
.jx-lgtick .ji-dot { width: 6px; height: 6px; }

.jx-lgx {
    position: absolute; right: 18px; top: 18px; z-index: 5; appearance: none; margin: 0; padding: 0; cursor: pointer;
    display: grid; place-items: center; width: 38px; height: 38px; border-radius: 999px;
    border: 1px solid var(--t-line3); background: var(--t-panelsolid); color: var(--t-ink2);
    transition: background-color 0.2s ease, transform 0.2s ease;
}
.jx-lgx:hover { background: var(--t-tile2); transform: rotate(90deg); }

.jx-lgf {
    position: relative; min-width: 0; min-height: 0; overflow-y: auto;
    padding: 34px clamp(28px, 3.4vw, 48px) 24px; display: flex; flex-direction: column;
}
.jx-lgform, .jx-lgdone { display: flex; flex-direction: column; }
.jx-lgform { margin: 0 0 auto; }
.jx-lgdone { margin: auto 0; }
.jx-lgform[hidden], .jx-lgdone[hidden] { display: none; }
.jx-lgdone { align-items: flex-start; }
.jx-lgi { animation: jxRise .6s cubic-bezier(.2, .8, .2, 1) backwards; }
.jx-lgform > :nth-child(1) { animation-delay: .12s; } .jx-lgform > :nth-child(2) { animation-delay: .17s; }
.jx-lgform > :nth-child(3) { animation-delay: .22s; } .jx-lgform > :nth-child(4) { animation-delay: .27s; }
.jx-lgform > :nth-child(5) { animation-delay: .32s; } .jx-lgform > :nth-child(6) { animation-delay: .37s; }
.jx-lgform > :nth-child(7) { animation-delay: .42s; } .jx-lgform > :nth-child(8) { animation-delay: .47s; }
.jx-lgdone > :nth-child(2) { animation-delay: .18s; } .jx-lgdone > :nth-child(3) { animation-delay: .24s; }
.jx-lgdone > :nth-child(4) { animation-delay: .3s; } .jx-lgdone > :nth-child(5) { animation-delay: .36s; }
.jx-lgdone > :nth-child(6) { animation-delay: .42s; } .jx-lgdone > :nth-child(7) { animation-delay: .48s; }
.jx-lgh {
    margin: 12px 0 0; font-size: clamp(30px, 2.6vw, 38px); line-height: 1.05; letter-spacing: -0.035em; font-weight: 600;
}
.jx-lgintro { margin: 8px 0 0; font-size: 14.5px; line-height: 22px; color: var(--t-muted); }
.jx-lggroup--id { margin-top: 26px; }
.jx-lggroup--pw { margin-top: 8px; }
.jx-lglabel { display: block; font-size: 13px; font-weight: 600; color: var(--t-ink2); }
.jx-lgrow { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.jx-lglink {
    appearance: none; margin: 0; padding: 0; border: 0; background: transparent; cursor: pointer;
    font: inherit; font-size: 13px; font-weight: 600; color: var(--t-accent); text-decoration: none; text-underline-offset: 3px;
}
.jx-lglink:hover { color: var(--t-accent); text-decoration: underline; }
.jx-lglink:focus-visible { outline: 2px solid #F58932; outline-offset: 2px; border-radius: 6px; }
.jx-lgjoin .jx-lglink, .jx-lgresent .jx-lglink { font-size: 13.5px; }
.jx-lggroup--mail { margin-top: 26px; }
.jx-lgreset .jx-lgsubmit { margin-top: 14px; }
.jx-lghelpbox {
    margin-top: 28px; display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 12px; align-items: center;
    padding: 14px 16px; border-radius: 12px; background: var(--t-tile); border: 1px solid var(--t-tileline);
    font-size: 13px; line-height: 19px; color: var(--t-muted);
}
.jx-lghelpbox a { font-weight: 600; color: var(--t-ink); text-decoration: none; }
.jx-lghelpbox a:hover { text-decoration: underline; }
.jx-lghelpico { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: rgba(245, 137, 50, .12); color: var(--t-accent); }
.jx-lgdone.jx-lgsent .jx-kicker { color: var(--t-accent); }
.jx-lgsent .jx-lgok { background: rgba(245, 137, 50, .16); color: var(--t-accent); box-shadow: 0 0 0 8px rgba(245, 137, 50, .07); }
.jx-lgsent b { color: var(--t-ink); font-weight: 600; overflow-wrap: anywhere; }
.jx-lgresend { font-variant-numeric: tabular-nums; }
.jx-lgresend[aria-disabled="true"] { opacity: .55; cursor: default; }
.jx-lgresend[aria-disabled="true"]:hover { background: transparent; }
.jx-lgresent { margin: 14px 0 0; font-size: 13.5px; color: var(--t-muted); }
.jx-fld { position: relative; margin-top: 8px; }
.jx-fld > svg { position: absolute; left: 16px; top: 17px; color: var(--t-faint); transition: color 0.2s ease; pointer-events: none; }
.jx-fld:focus-within > svg { color: #F58932; }
.jx-in2 {
    appearance: none; display: block; width: 100%; height: 52px; margin: 0; padding: 0 16px 0 46px; border-radius: 12px;
    border: 1px solid var(--t-line3); background: var(--t-tile); color: var(--t-ink); font: inherit; font-size: 15px; outline: none;
    transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}
.jx-in2::placeholder { color: var(--t-faint); opacity: .85; }
.jx-in2:hover { border-color: var(--t-dash); }
.ja .jx-in2:focus, .ja .jx-in2:focus-visible {
    outline: none; border-color: #F58932; box-shadow: 0 0 0 4px rgba(245, 137, 50, .18); background: var(--t-tile2);
}
.jx-fld[data-err="true"] .jx-in2 { border-color: var(--t-bad); box-shadow: 0 0 0 4px rgba(255, 138, 122, .14); }
.jx-fld[data-err="true"] { animation: jxShake .45s ease; }
.jx-in2--id[data-chip] { padding-right: 170px; }
.jx-in2--pw { padding-right: 54px; }
.jx-lgchip {
    position: absolute; right: 8px; top: 9px; display: none; align-items: center; gap: 8px; height: 34px; max-width: 58%;
    padding: 0 12px 0 4px; border-radius: 999px; background: var(--t-tile2); font-size: 12.5px; font-weight: 600; color: var(--t-ink);
    pointer-events: none;
}
.jx-lgchip:not([hidden]) { display: inline-flex; }
.jx-lgav {
    flex: none; display: grid; place-items: center; width: 26px; height: 26px; border-radius: 999px;
    background: var(--t-faint); color: #FFFFFF; font-size: 10px; font-weight: 700;
}
.jx-lgchip-n { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.jx-lghelp { margin: 7px 0 0; min-height: 17px; font-size: 12.5px; line-height: 17px; color: var(--t-faint); }
.jx-lghelp[data-tone="bad"] { color: var(--t-bad); }
.jx-lghelp[data-tone="warn"] { color: var(--t-warn); }
.jx-eye {
    position: absolute; right: 6px; top: 6px; appearance: none; margin: 0; padding: 0; cursor: pointer;
    display: grid; place-items: center; width: 40px; height: 40px; border-radius: 10px; border: 0;
    background: transparent; color: var(--t-faint); transition: color 0.2s ease, background-color 0.2s ease;
}
.jx-eye:hover { color: var(--t-ink); background: var(--t-tile2); }
.jx-eye [data-icon="hide"], .jx-eye[aria-pressed="true"] [data-icon="show"] { display: none; }
.jx-eye[aria-pressed="true"] [data-icon="hide"] { display: block; }
.jx-lgremember { margin-top: 6px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.jx-chk { position: relative; display: inline-flex; align-items: center; gap: 10px; font-size: 14px; color: var(--t-ink2); cursor: pointer; }
.jx-chk input { position: absolute; inset: 0; width: 20px; height: 20px; margin: 0; opacity: 0; cursor: pointer; }
.jx-chk-box {
    display: grid; place-items: center; width: 20px; height: 20px; border-radius: 6px;
    border: 1.5px solid var(--t-line3); background: transparent; color: #141250;
    transition: background-color 0.2s ease, border-color 0.2s ease;
}
.jx-chk-box svg { opacity: 0; transition: opacity 0.2s ease; }
.jx-chk:hover .jx-chk-box { border-color: #F58932; }
.jx-chk input:checked + .jx-chk-box { border-color: #F58932; background: #F58932; }
.jx-chk input:checked + .jx-chk-box svg { opacity: 1; }
.jx-chk input:focus-visible + .jx-chk-box { outline: 2px solid var(--t-focus); outline-offset: 2px; }
.jx-lgnote { font-size: 12px; color: var(--t-faint); }
.jx-lgsubmit { margin-top: 22px; width: 100%; height: 54px; justify-content: center; font-size: 16px; font-family: inherit; }
.jx-spin {
    display: none; width: 16px; height: 16px; margin-right: 10px; border-radius: 999px;
    border: 2px solid rgba(20, 18, 80, .25); border-top-color: #141250; animation: jxSpin .8s linear infinite;
}
.jx-lgform[data-busy="true"] .jx-spin { display: inline-block; }
.jx-lgform[data-busy="true"] .jx-lgsubmit svg { display: none; }
.jx-lgform[data-busy="true"] .jx-in2, .jx-lgform[data-busy="true"] .jx-eye, .jx-lgform[data-busy="true"] .jx-chk { pointer-events: none; opacity: .6; }
.jx-lgform[data-busy="true"] .jx-lgsubmit { pointer-events: none; }
.jx-lgjoin { margin: 18px 0 0; text-align: center; font-size: 13.5px; color: var(--t-muted); }
.jx-lgjoin a { font-weight: 600; color: var(--t-accent); text-decoration: none; }
.jx-lgjoin a:hover { color: var(--t-accent); text-decoration: underline; }

.jx-lgok {
    display: grid; place-items: center; width: 68px; height: 68px; border-radius: 999px;
    background: rgba(92, 196, 138, 0.16); color: var(--t-good); box-shadow: 0 0 0 8px rgba(92, 196, 138, 0.07);
    animation: jxPop .5s cubic-bezier(.2, 1.4, .4, 1) backwards;
}
.jx-lgok path { stroke-dasharray: 30; animation: jxDraw .5s .25s ease backwards; }
.jx-lgdone .jx-kicker { margin-top: 24px; color: var(--t-good); }
.jx-lgdone p.jx-lgintro { margin-top: 10px; line-height: 23px; }
.jx-lgdone-b { margin-top: 24px; display: flex; flex-wrap: wrap; gap: 10px; }
.jx-lgdone-b .ja-btn { height: 50px; padding: 0 22px; font-size: 15px; font-family: inherit; }

.jx-lgfoot {
    margin-top: 22px; padding-top: 16px; border-top: 1px solid var(--t-line2);
    display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; font-size: 12px; color: var(--t-faint);
}
.jx-lgfoot-s { display: inline-flex; align-items: center; gap: 7px; }
.jx-lgfoot .ji-langsw { font-size: 12px; }
.jx-lgfoot .ji-langsw a { padding: 4px 8px; }

/* ---------- Flash notices ---------- */
.ji-flash {
    position: absolute; z-index: 20; top: calc(74px + clamp(56px, 5.6vw, 84px)); left: 0; right: 0;
    display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 0 16px; pointer-events: none;
}
.ji-flash-item {
    pointer-events: auto; display: flex; align-items: flex-start; gap: 12px; width: min(560px, 100%); padding: 12px 12px 12px 16px;
    border-radius: 10px; border: 1px solid var(--t-line); border-left: 3px solid #5CC48A;
    background: var(--t-panel); color: var(--t-ink); box-shadow: 0 24px 60px rgba(0, 8, 24, .35); font-size: 14px; line-height: 21px;
    -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
}
.ji-flash-item[data-level="danger"] { border-left-color: var(--t-bad); }
.ji-flash-item[data-level="warning"] { border-left-color: #F58932; }
.ji-flash-item[data-level="info"] { border-left-color: var(--t-cool); }
.ji-flash-text { flex: 1; min-width: 0; }
.ji-flash-x {
    appearance: none; flex: none; margin: 0; padding: 0; cursor: pointer; display: grid; place-items: center;
    width: 28px; height: 28px; border-radius: 6px; border: 0; background: transparent; color: var(--t-muted);
}
.ji-flash-x:hover { background: var(--t-tile2); color: var(--t-ink); }

/* ---------- News on the home page ---------- */
.ji-nav { white-space: nowrap; }
.ji-navdot {
    display: inline-block; width: 6px; height: 6px; margin-left: 6px; border-radius: 999px; background: #F58932;
    vertical-align: middle; transform: translateY(-1px); box-shadow: 0 0 0 2px rgba(245, 137, 50, .25);
}
.ji-navdot[hidden] { display: none; }
.ji-news { max-width: 800px; }
.ji-news-head { display: flex; align-items: center; gap: 14px; margin-bottom: 12px; }
.ji-news-h { margin: 0; font-size: 12px; font-weight: 600; letter-spacing: 2px; text-transform: uppercase; color: var(--t-ink2); }
.ji-news-rule { flex: 1; height: 1px; background: var(--t-line3); }
.ji-newsall, .ji-newsall:hover {
    display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600;
    color: var(--t-accent); text-decoration: none; white-space: nowrap;
}
.ji-newsall svg { transition: transform .25s ease; }
.ji-newsall:hover svg { transform: translateX(4px); }
.ji-feats.ji-news-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px 0; max-width: none; }
.ji-newsi { gap: 5px; }
.ji-newsm {
    display: flex; flex-wrap: wrap; align-items: center; gap: 3px 8px; min-width: 0; font-size: 11px; font-weight: 700; letter-spacing: 1.2px;
    text-transform: uppercase; color: var(--t-accent); white-space: nowrap;
}
.ji-newsw { font-weight: 600; letter-spacing: .3px; text-transform: none; color: var(--t-faint); }
.jn-new {
    display: inline-flex; align-items: center; height: 16px; padding: 0 6px; border-radius: 4px; background: #F58932; color: #141250;
    font-size: 9.5px; font-weight: 700; letter-spacing: .8px; text-transform: uppercase;
}
.ji-newst { font-size: 15px; line-height: 20px; font-weight: 600; color: var(--t-ink); transition: color .2s ease; }
.ji-newsi:hover .ji-newst { color: #F58932; }
.ji-newsl { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* ---------- About ---------- */
.ji-slide.jx-about { color: var(--t-ink); background: #04142E; }
.jx-absky {
    position: absolute; inset: -48px; z-index: 0; isolation: isolate; overflow: hidden;
    filter: blur(16px) saturate(1.1); transform: scale(1.04);
}
.jx-absky img {
    position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 58% 40%;
    opacity: 0; transition: opacity 1.4s linear;
}
.jx-abveil { position: absolute; inset: 0; z-index: 0; transition: opacity .9s ease; }
.jx-abveil--dark {
    opacity: var(--t-dark);
    background: linear-gradient(90deg, rgba(3, 14, 34, .94) 0%, rgba(3, 14, 34, .82) 42%, rgba(3, 14, 34, .62) 100%), linear-gradient(0deg, rgba(3, 14, 34, .7) 0%, rgba(3, 14, 34, 0) 40%);
}
.jx-abveil--light {
    opacity: var(--t-ui);
    background: linear-gradient(90deg, rgba(240, 246, 252, .95) 0%, rgba(240, 246, 252, .84) 42%, rgba(240, 246, 252, .66) 100%), linear-gradient(0deg, rgba(240, 246, 252, .7) 0%, rgba(240, 246, 252, 0) 40%);
}
.jx-abtrails { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; opacity: .45; }
@keyframes jbTrail { from { transform: translateX(-40vw) rotate(-12deg); } to { transform: translateX(140vw) rotate(-12deg); } }
.jb-trail {
    position: absolute; left: 0; height: 2px; width: 38vw; border-radius: 2px;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0), var(--t-trail)); animation: jbTrail linear infinite;
}

/* chapters: stacked pages, one in view */
.jx-chs { position: absolute; inset: 0; z-index: 1; transition: transform .95s cubic-bezier(.77, 0, .18, 1); }
@media (min-width: 901px) {
    .jx-about[data-chapter="1"] .jx-chs { transform: translateY(-100%); }
    .jx-about[data-chapter="2"] .jx-chs { transform: translateY(-200%); }
}
.jx-ch {
    position: absolute; left: 0; right: 0; height: 100%;
    transition: transform .95s cubic-bezier(.77, 0, .18, 1), filter .95s ease, opacity .95s ease, visibility 0s linear 0s;
}
.jx-ch1 { top: 0; }
.jx-ch2 { top: 100%; }
.jx-ch3 { top: 200%; }
.jx-ch[data-on="false"] {
    transform: scale(.94); filter: brightness(.55); opacity: .5; visibility: hidden;
    transition: transform .95s cubic-bezier(.77, 0, .18, 1), filter .95s ease, opacity .95s ease, visibility 0s linear .95s;
}
.jx-chin { position: absolute; inset: 0; padding: calc(94px + clamp(56px, 5.6vw, 84px)) clamp(20px, 4vw, 56px) 92px; }
@keyframes jxProg { from { width: 0; } to { width: 100%; } }
@keyframes jxGrow { from { transform: scaleX(0); } }
.ji-slide[aria-hidden="false"] .jx-ch[data-on="true"] .jx-cr { animation: jxRise .85s cubic-bezier(.2, .8, .2, 1) .3s backwards; }
.ji-slide[aria-hidden="false"] .jx-ch[data-on="true"] .jx-cp { animation: jxSide .95s cubic-bezier(.2, .8, .2, 1) .4s backwards; }
.ji-slide[aria-hidden="false"] .jx-ch[data-on="true"] .jx-chh { animation: jxReveal 1s cubic-bezier(.2, .8, .2, 1) .3s backwards; }
.ji-slide[aria-hidden="false"] .jx-ch[data-on="true"] .jx-d1 { animation-delay: .3s; }
.ji-slide[aria-hidden="false"] .jx-ch[data-on="true"] .jx-d2 { animation-delay: .4s; }
.ji-slide[aria-hidden="false"] .jx-ch[data-on="true"] .jx-d3 { animation-delay: .5s; }
.ji-slide[aria-hidden="false"] .jx-ch[data-on="true"] .jx-d4 { animation-delay: .6s; }
.ji-slide[aria-hidden="false"] .jx-ch[data-on="true"] .jx-d5 { animation-delay: .7s; }
.ji-slide[aria-hidden="false"] .jx-ch[data-on="true"] .jx-d6 { animation-delay: .8s; }
.ji-slide[aria-hidden="false"] .jx-ch[data-on="true"] .jx-dc .jx-s { animation: jxOdo 1.7s cubic-bezier(.16, .84, .24, 1) .55s backwards; }
.ji-slide[aria-hidden="false"] .jx-ch[data-on="true"] .jx-dc:nth-child(2) .jx-s { animation-delay: .62s; }
.ji-slide[aria-hidden="false"] .jx-ch[data-on="true"] .jx-dc:nth-child(3) .jx-s { animation-delay: .69s; }
.ji-slide[aria-hidden="false"] .jx-ch[data-on="true"] .jx-dc:nth-child(4) .jx-s { animation-delay: .76s; }
.ji-slide[aria-hidden="false"] .jx-ch[data-on="true"] .jx-dc:nth-child(n+5) .jx-s { animation-delay: .83s; }

.jx-ebrow {
    margin: 0; display: flex; align-items: center; gap: 12px; font-size: 13px; font-weight: 600;
    letter-spacing: 2px; text-transform: uppercase; color: var(--t-accent);
}
.jx-ebrow::before { content: ""; flex: none; width: 40px; height: 2px; background: #F58932; }
.jx-ebdot { color: var(--t-faint); }
.jx-acc { color: var(--t-accent); }
.jx-acc-ic { display: inline-flex; color: #F58932; }
.jx-grow { flex: 1; min-height: 16px; }

/* 01 · our story */
.jx-ch1in { display: grid; grid-template-columns: minmax(0, 600px) minmax(0, 1fr); gap: clamp(32px, 6vw, 104px); }
.jx-c1l, .jx-c1r { min-width: 0; min-height: 0; display: flex; flex-direction: column; }
.jx-h1a { margin: 18px 0 0; font-size: clamp(44px, 4.8vw, 68px); line-height: .95; letter-spacing: -.05em; font-weight: 600; }
.jx-ch1p { margin: 20px 0 0; max-width: 600px; font-size: clamp(15px, 1.15vw, 16.5px); line-height: 1.65; color: var(--t-ink2); }
.jx-ch1stats {
    margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding-top: 18px;
    border-top: 1px solid var(--t-line3); font-variant-numeric: tabular-nums;
}
.jx-fig { min-width: 0; display: flex; flex-direction: column-reverse; }
.jx-fig dd { margin: 0; font-size: clamp(28px, 2.4vw, 34px); line-height: 1.12; font-weight: 600; letter-spacing: -.5px; }
.jx-fig dt { margin: 2px 0 0; font-size: 12.5px; color: var(--t-muted); }
.jx-histhead { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 14px; padding-left: 116px; }
.jx-histt { margin: 0; font-size: 11px; font-weight: 700; letter-spacing: 1.6px; text-transform: uppercase; color: var(--t-accent); }
.jx-histhead p { margin: 0; font-size: 12px; color: var(--t-faint); }
.jx-hist { margin: 0; padding: 0; list-style: none; min-height: 0; overflow-y: auto; scrollbar-width: none; }
.jx-hist::-webkit-scrollbar { display: none; }
.jx-hist[data-fade="top"] { -webkit-mask-image: linear-gradient(to bottom, transparent, #000 56px); mask-image: linear-gradient(to bottom, transparent, #000 56px); }
.jx-hist[data-fade="bottom"] { -webkit-mask-image: linear-gradient(to top, transparent, #000 56px); mask-image: linear-gradient(to top, transparent, #000 56px); }
.jx-hist[data-fade="both"] {
    -webkit-mask-image: linear-gradient(to bottom, transparent, #000 56px, #000 calc(100% - 56px), transparent);
    mask-image: linear-gradient(to bottom, transparent, #000 56px, #000 calc(100% - 56px), transparent);
}
.jx-hrow {
    appearance: none; margin: 0; border: 0; background: transparent; font: inherit; color: inherit; cursor: pointer;
    display: grid; grid-template-columns: 104px 22px minmax(0, 1fr); gap: 12px; width: 100%; min-height: 52px; padding: 0; text-align: left;
}
.jx-hdate {
    padding-top: 1px; font-size: 12px; font-weight: 600; text-align: right; color: var(--t-faint);
    font-variant-numeric: tabular-nums; transition: color .25s ease;
}
.jx-hrail { position: relative; display: block; align-self: stretch; }
.jx-hdot {
    position: absolute; left: 6px; top: 4px; width: 10px; height: 10px; border-radius: 999px; border: 2px solid #F58932;
    background: var(--t-panelsolid); transition: background-color .3s ease, box-shadow .3s ease;
}
.jx-hline { position: absolute; left: 10px; top: 18px; bottom: -2px; width: 2px; background: rgba(245, 137, 50, .35); }
.jx-hist li:last-child .jx-hline { display: none; }
.jx-hbody { min-width: 0; display: block; padding-bottom: 12px; }
.jx-htitle { display: block; font-size: 15px; font-weight: 600; transition: color .2s ease; }
.jx-hlatest {
    display: inline-flex; align-items: center; margin-left: 8px; height: 18px; padding: 0 7px; vertical-align: 2px; border-radius: 999px;
    background: #F58932; color: #141250; font-size: 10px; font-weight: 700; text-transform: uppercase;
}
.jx-htext {
    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; margin-top: 2px;
    font-size: 12.5px; line-height: 18px; color: var(--t-faint); transition: color .25s ease;
}
.jx-hrow[aria-expanded="true"] .jx-hdate { color: var(--t-accent2); }
.jx-hrow[aria-expanded="true"] .jx-hdot, .jx-hrow[data-latest] .jx-hdot { background: #F58932; }
.jx-hrow[aria-expanded="true"] .jx-hdot { box-shadow: 0 0 0 5px rgba(245, 137, 50, .22); }
.jx-hrow[aria-expanded="true"] .jx-htext { -webkit-line-clamp: unset; color: var(--t-ink2); }
.jx-hrow:hover .jx-htitle, .jx-hrow:focus-visible .jx-htitle { color: var(--t-accent); }

/* 02 · leadership */
.jx-vtog {
    position: absolute; z-index: 3; right: clamp(20px, 4vw, 56px); top: calc(86px + clamp(56px, 5.6vw, 84px));
    display: inline-flex; gap: 3px; padding: 4px; border-radius: 999px; background: var(--t-glass); border: 1px solid var(--t-line);
    -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
}
.jf-modebtn {
    appearance: none; margin: 0; border: 0; cursor: pointer; font: inherit; font-size: 13px; font-weight: 600; padding: 8px 14px;
    border-radius: 999px; background: rgba(255, 255, 255, 0); color: var(--t-navink); transition: background-color .25s ease, color .25s ease;
}
.jf-modebtn[aria-selected="true"] { background: var(--t-navon); color: var(--t-navonink); }
.jf-modebtn[aria-selected="false"]:hover { background: var(--t-tile2); }
.jx-ch2[data-view="spot"] .jx-lgrid, .jx-ch2[data-view="grid"] .jx-spot { display: none; }

.jx-spot { position: absolute; inset: 0; }
.jx-portraits { position: absolute; left: 0; top: 0; bottom: 0; width: 44%; overflow: hidden; }
.jx-portrait { position: absolute; inset: 0; overflow: hidden; opacity: 0; transition: opacity .9s ease; }
.jx-portrait[data-on="true"] { opacity: 1; }
.jx-pbig {
    position: absolute; left: 50%; top: 54%; width: 600px; height: 600px; margin: -300px 0 0 -300px; display: grid; place-items: center;
    font-size: 560px; line-height: 1; font-weight: 700; letter-spacing: -.08em; color: rgba(255, 255, 255, .15); transition: transform 7s linear;
}
.jx-portrait[data-on="true"] .jx-pbig { transform: scale(1.06); }
.jx-pring {
    position: absolute; left: 50%; top: 54%; width: clamp(150px, 16vw, 230px); height: clamp(150px, 16vw, 230px); transform: translate(-50%, -50%);
    display: grid; place-items: center; border-radius: 999px; background: rgba(255, 255, 255, .14); border: 2px solid rgba(255, 255, 255, .42);
    color: #FFFFFF; font-size: clamp(60px, 6.6vw, 96px); font-weight: 700; letter-spacing: -.04em; box-shadow: 0 30px 80px rgba(0, 8, 24, .35);
}
.jx-portrait img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.jx-pphoto { object-position: 50% 22%; }
.jx-pshade { position: absolute; inset: 0; transition: opacity .9s ease; }
.jx-pshade--dark {
    opacity: var(--t-dark);
    background: linear-gradient(180deg, rgba(3, 14, 34, .8) 0%, rgba(3, 14, 34, 0) 30%, rgba(3, 14, 34, 0) 66%, rgba(3, 14, 34, .75) 100%), linear-gradient(90deg, rgba(3, 14, 34, 0) 70%, rgba(3, 14, 34, .85) 100%);
}
.jx-pshade--light {
    opacity: var(--t-ui);
    background: linear-gradient(180deg, rgba(240, 246, 252, .94) 0%, rgba(240, 246, 252, 0) 30%, rgba(240, 246, 252, 0) 66%, rgba(240, 246, 252, .7) 100%), linear-gradient(90deg, rgba(240, 246, 252, 0) 70%, rgba(240, 246, 252, .92) 100%);
}
.jx-pid {
    position: absolute; left: clamp(20px, 4vw, 56px); bottom: 92px; margin: 0; font-size: 12.5px; font-weight: 700;
    letter-spacing: 2px; text-transform: uppercase; color: var(--t-ink);
}
.jx-spottext {
    position: absolute; left: calc(44% + clamp(32px, 4.5vw, 72px)); right: clamp(20px, 4vw, 56px);
    top: calc(94px + clamp(56px, 5.6vw, 84px)); bottom: 92px; display: flex; flex-direction: column;
}
.jx-spotstack { position: relative; flex: 1; min-height: 0; margin-top: 22px; }
.jx-spotc {
    position: absolute; left: 0; right: 0; top: 0;
    opacity: 0; transform: translateY(16px); visibility: hidden; pointer-events: none;
    transition: opacity .35s ease, transform .45s ease, visibility 0s linear .35s;
}
.jx-spotc[data-on="true"] {
    opacity: 1; transform: none; visibility: visible; pointer-events: auto;
    transition: opacity .5s ease .2s, transform .7s cubic-bezier(.2, .8, .2, 1) .2s, visibility 0s linear 0s;
}
.jx-spotrole { margin: 0; font-size: 13px; font-weight: 700; letter-spacing: 1.6px; text-transform: uppercase; color: var(--t-accent); }
.jx-spotname { margin: 6px 0 0; font-size: clamp(54px, 5.8vw, 84px); line-height: .95; letter-spacing: -.05em; font-weight: 600; }
.jx-spotbio { margin: 16px 0 0; max-width: 600px; font-size: clamp(15px, 1.2vw, 17px); line-height: 1.65; color: var(--t-ink2); }
.jx-spottags { margin: 20px 0 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 12px 22px; }
.jx-spottags li { display: flex; align-items: center; gap: 10px; font-size: 15px; font-weight: 600; }
.jx-spottn {
    display: grid; place-items: center; width: 32px; height: 32px; border-radius: 10px; background: rgba(245, 137, 50, .14);
    color: var(--t-accent); font-size: 12.5px; font-weight: 700;
}
.jx-spotquote { margin: 22px 0 0; max-width: 600px; padding-left: 16px; border-left: 3px solid #F58932; }
.jx-spotquote blockquote { margin: 0; font-size: 15px; line-height: 23px; font-style: italic; color: var(--t-muted); }
.jx-thumbs { position: relative; display: flex; align-items: flex-start; gap: 6px; padding-top: 14px; overflow-x: auto; scrollbar-width: none; }
.jx-thumbs::-webkit-scrollbar { display: none; }
.jx-fadex[data-more="true"] { -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 48px), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 48px), transparent); }
.jx-th {
    appearance: none; margin: 0; padding: 4px 0 0; border: 0; background: transparent; cursor: pointer; font: inherit; color: inherit;
    flex: none; width: 74px; text-align: center; text-decoration: none; opacity: .7; transition: opacity .25s ease;
}
.jx-th:hover, .jx-th[data-on="true"] { opacity: 1; color: inherit; }
.jx-thav {
    display: grid; place-items: center; width: 56px; height: 56px; margin: 0 auto; border-radius: 16px; overflow: hidden; color: #FFFFFF; font-size: 21px; font-weight: 700;
    box-shadow: 0 0 0 1px var(--t-line); transition: box-shadow .3s ease, transform .3s ease;
}
.jx-thav img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; }
.jx-th--instr .jx-thav { outline: 2px solid rgba(127, 176, 232, .55); outline-offset: 2px; }
.jx-th:hover .jx-thav { transform: translateY(-2px); }
.jx-th[data-on="true"] .jx-thav { box-shadow: 0 0 0 3px #F58932; transform: translateY(-2px); }
.jx-thname { display: block; margin-top: 8px; font-size: 12.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.jx-thsub { display: block; margin-top: 1px; font-size: 10.5px; color: var(--t-faint); white-space: nowrap; }
.jx-th--instr .jx-thsub { color: var(--t-cool); }
.jx-thbar { display: block; height: 2px; margin: 7px 10px 0; border-radius: 2px; background: var(--t-track); overflow: hidden; opacity: 0; transition: opacity .3s ease; }
.jx-th[data-on="true"] .jx-thbar { opacity: 1; }
.jx-thbar i { display: block; height: 100%; width: 0; background: #F58932; }
.jx-spot[data-hold="true"] .jx-th[data-on="true"] .jx-thbar i { width: 100%; opacity: .5; }
.ji-slide[aria-hidden="false"] .jx-ch[data-on="true"] .jx-spot[data-hold="false"] .jx-th[data-on="true"] .jx-thbar i { animation: jxProg 7s linear forwards; }
.jx-thsep { flex: none; width: 1px; align-self: stretch; margin: 4px 6px 0; background: var(--t-line); }
.jx-thplus {
    display: grid; place-items: center; width: 56px; height: 56px; margin: 0 auto; border-radius: 16px;
    border: 1.5px dashed rgba(245, 137, 50, .75); color: var(--t-accent); font-size: 24px;
}
.jx-th--open { opacity: 1; }
.jx-th--open .jx-thsub { color: var(--t-accent); }
/* The spotlight moves on by itself, so it can be stopped; the control shows when reached by keyboard. */
.jx-spotpause {
    position: absolute; left: 0; top: 0; z-index: 2; height: 28px; padding: 0 12px; border-radius: 999px; border: 1px solid #F58932;
    background: var(--t-panelsolid); color: var(--t-ink); font: inherit; font-size: 12px; font-weight: 600; cursor: pointer;
}
.jx-spotpause:not(:focus) { width: 1px; height: 1px; padding: 0; border: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.jx-lgrid {
    position: absolute; inset: 0; padding: calc(94px + clamp(56px, 5.6vw, 84px)) clamp(20px, 4vw, 56px) 92px;
    display: flex; flex-direction: column; gap: clamp(14px, 2.2vh, 22px);
}
.jx-lgridhead { padding-right: 260px; }
.jx-h2g { margin: 14px 0 0; font-size: clamp(36px, 3.5vw, 50px); line-height: 1; letter-spacing: -.045em; font-weight: 600; }
.jx-lcards { flex: 1; min-height: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(12px, 1.4vw, 20px); }
.jx-lc {
    position: relative; cursor: pointer; min-height: 0;
    display: flex; flex-direction: column; border-radius: 18px; overflow: hidden; background: var(--t-panel); border: 1px solid var(--t-line);
    box-shadow: 0 30px 70px rgba(0, 8, 24, .28); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
    transition: transform .3s cubic-bezier(.2, .8, .2, 1), border-color .3s ease, box-shadow .3s ease;
}
.jx-lc:hover, .jx-lc:has(.jx-lcbtn:focus-visible) { transform: translateY(-6px); border-color: rgba(245, 137, 50, .7); box-shadow: 0 30px 70px rgba(0, 8, 24, .4); }
.jx-lc:has(.jx-lcbtn:focus-visible) { outline: 2px solid #F58932; outline-offset: 3px; }
.ja .jx-lcbtn {
    appearance: none; margin: 0; padding: 0; border: 0; background: none; font: inherit; color: inherit; letter-spacing: inherit;
    text-align: left; cursor: pointer;
}
.ja .jx-lcbtn:focus-visible { outline: none; }
.jx-lcbtn::after { content: ''; position: absolute; inset: 0; z-index: 2; border-radius: inherit; }
.jx-lcimg { position: relative; flex: none; display: grid; place-items: center; height: clamp(104px, 19vh, 196px); overflow: hidden; }
.jx-lcini { font-size: clamp(68px, 9vh, 120px); line-height: 1; font-weight: 700; letter-spacing: -.06em; color: rgba(255, 255, 255, .92); transform: translateY(8%); }
.jx-lcimg img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; }
.jx-lcfade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0, 0, 0, 0) 50%, rgba(4, 18, 40, .5)); }
.jx-lcid {
    position: absolute; left: 14px; top: 14px; height: 22px; padding: 0 8px; display: inline-flex; align-items: center; border-radius: 5px;
    background: rgba(4, 18, 40, .55); color: #FFFFFF; font-size: 10.5px; font-weight: 700; letter-spacing: 1px;
}
.jx-lcbody { flex: 1; min-height: 0; display: flex; flex-direction: column; padding: 16px 18px; }
.jx-lcrole { font-size: 11px; font-weight: 700; letter-spacing: 1.4px; text-transform: uppercase; color: var(--t-accent); }
.jx-lcname { margin: 6px 0 0; font-size: clamp(22px, 2vw, 28px); line-height: 1.1; letter-spacing: -.02em; font-weight: 600; }
.jx-lcbio {
    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden; margin-top: 10px;
    font-size: 13.5px; line-height: 21px; color: var(--t-muted);
}
.jx-lctags { margin-top: auto; padding-top: 12px; display: flex; flex-wrap: wrap; gap: 6px; }
.jx-lctags span {
    height: 24px; padding: 0 9px; display: inline-flex; align-items: center; border-radius: 999px; background: var(--t-tile);
    border: 1px solid var(--t-tileline); font-size: 11.5px; font-weight: 600; color: var(--t-ink2);
}
.jx-lcmore { margin-top: 12px; display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--t-ink2); transition: color .2s ease; }
.jx-lc:hover .jx-lcmore, .jx-lc:has(.jx-lcbtn:focus-visible) .jx-lcmore { color: var(--t-accent); }
.jx-team {
    flex: none; min-height: 60px; padding: 10px 20px; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 28px;
    border-radius: 14px; background: var(--t-tile); border: 1px solid var(--t-tileline);
}
.jx-teamt { margin: 0; font-size: 11px; font-weight: 700; letter-spacing: 1.6px; text-transform: uppercase; color: var(--t-cool); }
.jx-teamp {
    appearance: none; margin: 0; padding: 0; border: 0; background: transparent; cursor: pointer; font: inherit; color: inherit;
    display: inline-flex; align-items: center; gap: 10px; text-align: left;
}
.jx-teamav {
    display: grid; place-items: center; width: 34px; height: 34px; border-radius: 999px; color: #FFFFFF; font-size: 13px; font-weight: 700;
    outline: 2px solid rgba(127, 176, 232, .5); outline-offset: 2px;
}
.jx-teamn { display: block; font-size: 13.5px; font-weight: 600; }
.jx-teams { display: block; font-size: 11.5px; color: var(--t-cool); }
.jx-teamopen, .jx-teamopen:hover { font-size: 13px; color: var(--t-muted); text-decoration: none; }
.jx-teamopen b { color: var(--t-ink); }
.jx-teamopen span { color: var(--t-accent); font-weight: 600; }

/* 03 · the pilots */
.jx-ch3in { display: grid; grid-template-columns: minmax(0, 380px) minmax(0, 1fr); gap: clamp(28px, 4.4vw, 64px); }
.jx-c3l { min-width: 0; min-height: 0; display: flex; flex-direction: column; }
.jx-h2p { margin: 14px 0 0; font-size: clamp(36px, 3.4vw, 48px); line-height: 1; letter-spacing: -.045em; font-weight: 600; }
.jx-ch3p { margin: 14px 0 0; font-size: 14.5px; line-height: 23px; color: var(--t-muted); }
.jx-pstats { margin: 18px 0 0; }
.jx-pstat { padding: 11px 0; border-top: 1px solid var(--t-line); display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.jx-pstat dt { font-size: 13px; color: var(--t-muted); }
.jx-pstat dd { margin: 0; font-size: 22px; font-weight: 600; font-variant-numeric: tabular-nums; }
.jx-plinks { margin-top: 14px; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.jx-plinks a, .jx-plinks a:hover { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; color: var(--t-ink); text-decoration: none; }
.jx-plinks a:hover { text-decoration: underline; text-underline-offset: 3px; }
.jx-dir {
    position: relative; align-self: start; max-height: 100%; min-width: 0; min-height: 0; display: flex; flex-direction: column;
    padding: 14px 14px 10px; border-radius: 18px; background: var(--t-panel); border: 1px solid var(--t-line);
    -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
}
.jx-dirbar { position: relative; z-index: 3; flex: none; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 0 0 12px; }
.jx-dirs { position: relative; flex: 1 1 220px; min-width: 0; }
.jx-dirs > svg { position: absolute; left: 15px; top: 12px; color: var(--t-faint); pointer-events: none; transition: color .2s ease; }
.jx-dirs:focus-within > svg { color: #F58932; }
.jx-in2.jx-dirq { height: 40px; padding: 0 14px 0 40px; border-radius: 999px; font-size: 14px; }
.jx-dirq::-webkit-search-cancel-button { cursor: pointer; }
.jx-dd { position: relative; flex: none; }
@keyframes jxDdIn { from { opacity: 0; transform: translateY(-4px) scale(.98); } }
.jx-ddbtn {
    appearance: none; margin: 0; cursor: pointer; display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 14px 0 16px;
    border-radius: 999px; border: 1px solid var(--t-line3); background: var(--t-tile); color: var(--t-ink);
    font: inherit; font-size: 13px; font-weight: 600; white-space: nowrap; transition: border-color .2s ease, background-color .2s ease;
}
.jx-ddbtn:hover { border-color: rgba(245, 137, 50, .65); }
.jx-ddbtn[data-active] { border-color: #F58932; background: rgba(245, 137, 50, .14); color: var(--t-accent); }
.jx-ddbtn svg { transition: transform .2s ease; }
.jx-ddbtn[aria-expanded="true"] svg { transform: rotate(180deg); }
.jx-ddmenu {
    position: absolute; left: 0; top: calc(100% + 6px); z-index: 6; min-width: 230px; padding: 6px; border-radius: 14px;
    background: var(--t-panelsolid); border: 1px solid var(--t-line); box-shadow: 0 24px 60px rgba(0, 8, 24, .45);
    animation: jxDdIn .18s ease; transform-origin: top center;
}
.jx-ddmenu--end { left: auto; right: 0; }
.jx-ddmenu[hidden] { display: none; }
.jx-ddopt {
    appearance: none; margin: 0; width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 9px 12px;
    border: 0; border-radius: 9px; background: transparent; color: var(--t-ink); cursor: pointer; font: inherit; font-size: 13.5px;
    font-weight: 600; text-align: left; white-space: nowrap;
}
.jx-ddopt:hover { background: var(--t-tile2); }
/* A shade off the brand orange: the design's own fell just short of 4.5:1 on the menu. */
.jx-ddopt[aria-selected="true"] { background: var(--t-tile2); color: #FA9D52; }
html[data-ji-ui="light"] .jx-ddopt[aria-selected="true"] { color: #A04A0B; }
.jx-ddopt:hover .jx-ddn, .jx-ddopt[aria-selected="true"] .jx-ddn { color: var(--t-muted); }
.jx-ddn { font-size: 12px; font-weight: 500; color: var(--t-faint); font-variant-numeric: tabular-nums; }
.ja .jx-ddbtn:focus-visible, .ja .jx-ddopt:focus-visible, .ja .jx-pg:focus-visible { outline: 2px solid #F58932; outline-offset: 2px; }
@keyframes jxCardIn { from { opacity: 0; transform: translateY(14px); } }
.jx-dirgrid {
    position: relative; z-index: 1; flex: 1 1 auto; min-height: 0; margin: 0; padding: 0; list-style: none; overflow-y: auto; scrollbar-width: thin;
    display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: min-content; align-content: start; gap: 8px;
}
.jx-dirgrid[hidden] { display: none; }
.jx-pcard {
    position: relative; min-width: 0; display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 12px; align-items: center; padding: 12px;
    border-radius: 14px; background: var(--t-tile); border: 1px solid var(--t-tileline); transition: border-color .2s ease, background-color .2s ease;
}
.jx-pcard[hidden] { display: none; }
.jx-pcard:hover { border-color: rgba(245, 137, 50, .5); background: var(--t-tile2); }
.ji-slide[aria-hidden="false"] .jx-ch[data-on="true"] .jx-dirgrid[data-fx="true"] .jx-pcard { animation: jxCardIn .55s cubic-bezier(.2, .8, .2, 1) .45s backwards; }
.jx-pcav { position: relative; overflow: hidden; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 999px; color: #FFFFFF; font-size: 13px; font-weight: 700; letter-spacing: .3px; }
.jx-pcav img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.jx-pcard--instr .jx-pcav { box-shadow: 0 0 0 2px var(--t-panelsolid), 0 0 0 3.5px rgba(127, 176, 232, .7); }
.jx-pcbody { min-width: 0; display: block; line-height: 1.25; }
.jx-pcname { display: block; font-size: 14px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.jx-pcrank { display: flex; align-items: center; gap: 7px; margin-top: 3px; font-size: 12px; color: var(--t-muted); white-space: nowrap; min-width: 0; }
.jx-pcard--instr .jx-pcrank { color: var(--t-cool); }
.jx-pcrankn { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.jx-stripes { flex: none; display: inline-flex; gap: 2px; align-items: center; height: 13px; padding: 0 3px; border-radius: 3px; background: #0B1F3D; }
.jx-stripes span { width: 2px; height: 7px; border-radius: 1px; background: #E9B44C; }
.jx-stripes span.is-white { background: #FFFFFF; }
.jx-pcard--instr .jx-stripes span { background: #7FB0E8; }
.jx-pcid, .jx-pcstat {
    display: block; margin-top: 3px; font-size: 11.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    font-variant-numeric: tabular-nums;
}
.jx-pcid { letter-spacing: .4px; color: var(--t-faint); }
.jx-pcstat { display: none; color: var(--t-accent2); }
.jx-pcard:hover .jx-pcid { display: none; }
.jx-pcard:hover .jx-pcstat { display: block; }
.jx-dirempty { min-height: 260px; padding: 24px 12px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.jx-dirempty[hidden] { display: none; }
.jx-diremptyic {
    display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 999px;
    background: var(--t-tile); border: 1px solid var(--t-tileline); color: var(--t-faint);
}
.jx-diremptyt { margin: 14px 0 0; font-size: 15px; font-weight: 600; }
.jx-diremptys { margin: 6px 0 0; font-size: 13px; color: var(--t-faint); }
.jx-diremptys button, .jx-dirclear {
    appearance: none; margin: 0; padding: 0; border: 0; background: transparent; cursor: pointer; font: inherit; font-weight: 600; color: var(--t-accent);
}
.jx-dirclear[hidden] { display: none; }
.jx-dirfoot {
    position: relative; z-index: 1; flex: none; display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 30px;
    margin-top: 10px; padding: 10px 4px 0; border-top: 1px solid var(--t-tileline); font-size: 12.5px; color: var(--t-faint);
}
.jx-dirinfo { display: inline-flex; align-items: center; gap: 12px; font-variant-numeric: tabular-nums; }
.jx-pager { display: inline-flex; align-items: center; gap: 8px; }
.jx-pager[hidden] { display: none; }
.jx-pglabel { min-width: 44px; text-align: center; font-variant-numeric: tabular-nums; }
.jx-pg {
    appearance: none; margin: 0; padding: 0; cursor: pointer; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 999px;
    border: 1px solid var(--t-line3); background: transparent; color: var(--t-ink2); transition: border-color .2s ease, opacity .2s ease;
}
.jx-pg:hover { border-color: #F58932; }
.jx-pg[aria-disabled="true"] { opacity: .35; cursor: default; border-color: var(--t-line3); }

/* chapter bar */
.jx-chbar {
    position: absolute; z-index: 4; left: clamp(20px, 4vw, 56px); right: clamp(20px, 4vw, 56px); bottom: 20px;
    display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; pointer-events: none;
}
.jx-chnav { display: grid; grid-template-columns: repeat(4, minmax(110px, 170px)); gap: 18px; pointer-events: auto; }
.jx-chb, .jx-chb:hover { padding: 6px 0 0; color: inherit; text-align: left; min-width: 0; text-decoration: none; }
.jx-chbline { display: block; height: 2px; border-radius: 2px; background: var(--t-line3); transition: background-color .4s ease; }
.jx-chb[data-done] .jx-chbline { background: rgba(245, 137, 50, .45); }
.jx-chb[aria-current="step"] .jx-chbline { background: #F58932; }
.jx-chbl { display: block; margin-top: 8px; font-size: 12.5px; font-weight: 600; color: var(--t-faint); white-space: nowrap; transition: color .3s ease; }
.jx-chb[aria-current="step"] .jx-chbl, .jx-chb:hover .jx-chbl { color: var(--t-ink); }
.jx-chbn { margin-right: 8px; color: var(--t-faint); font-variant-numeric: tabular-nums; }
.jx-chb[aria-current="step"] .jx-chbn { color: var(--t-accent); }
.jx-chhint { pointer-events: auto; display: inline-flex; align-items: center; gap: 8px; font-size: 12px; color: var(--t-faint); }
.jx-chhint[hidden] { display: none; }
.jx-key {
    display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 5px; border: 1px solid var(--t-line3);
    font-size: 11px; color: var(--t-ink2);
}
.jx-chhint--end, .jx-chhint--end:hover { gap: 6px; font-size: 12.5px; font-weight: 600; color: var(--t-ink2); text-decoration: none; }
.jx-chhint--end svg { transition: transform .25s ease; }
.jx-chhint--end:hover svg { transform: translateX(4px); }

.jx-abtrails .jb-trail:nth-child(1) { top: 24%; animation-duration: 17s; animation-delay: -3s; }
.jx-abtrails .jb-trail:nth-child(2) { top: 58%; width: 26vw; animation-duration: 23s; animation-delay: -11s; opacity: .7; }
.jx-abtrails .jb-trail:nth-child(3) { top: 82%; width: 32vw; animation-duration: 29s; animation-delay: -19s; opacity: .5; }

/* Leadership without scripts: the whole team at once. */
html:not(.ji-js) .jx-vtog, html:not(.ji-js) .jx-spot, html:not(.ji-js) .jx-dirbar, html:not(.ji-js) .jx-dirfoot, html:not(.ji-js) .jx-chbar { display: none; }
html:not(.ji-js) .jx-ch2[data-view] .jx-lgrid { display: flex; }
html:not(.ji-js) .jx-about { overflow-y: auto; }

html:not(.ji-js) .jx-about .jx-chs { position: relative; inset: auto; transform: none; }
html:not(.ji-js) .jx-about .jx-ch { position: relative; top: auto; height: auto; visibility: visible; transform: none; filter: none; opacity: 1; }
html:not(.ji-js) .jx-about .jx-chbar { display: none; }
html:not(.ji-js) .jx-about .jx-chin { position: relative; inset: auto; display: flex; flex-direction: column; gap: 28px; }
html:not(.ji-js) .jx-about .jx-ch2 .jx-chin, html:not(.ji-js) .jx-about .jx-ch3 .jx-chin { padding-top: 56px; }
html:not(.ji-js) .jx-about .jx-ch3in { padding-bottom: 56px; }
html:not(.ji-js) .jx-about .jx-ch1in { padding-bottom: 8px; }
html:not(.ji-js) .jx-about .jx-histhead { padding-left: 0; }
html:not(.ji-js) .jx-about .jx-histhead p { display: none; }
html:not(.ji-js) .jx-about .jx-hist { overflow: visible; }
html:not(.ji-js) .jx-about .jx-vtog { position: relative; right: auto; top: auto; margin: 56px 20px 0; }
html:not(.ji-js) .jx-about .jx-spot, html:not(.ji-js) .jx-about .jx-lgrid { position: relative; inset: auto; }
html:not(.ji-js) .jx-about .jx-portraits { position: relative; width: auto; height: 380px; margin-top: 20px; }
html:not(.ji-js) .jx-about .jx-pid { bottom: 20px; }
html:not(.ji-js) .jx-about .jx-spottext { position: relative; left: auto; right: auto; top: auto; bottom: auto; padding: 24px 20px 8px; }
html:not(.ji-js) .jx-about .jx-spotstack { flex: none; }
html:not(.ji-js) .jx-about .jx-spotc { position: relative; display: none; }
html:not(.ji-js) .jx-about .jx-spotc[data-on="true"] { display: block; }
html:not(.ji-js) .jx-about .jx-lgrid { padding-top: 24px; padding-bottom: 8px; }
html:not(.ji-js) .jx-about .jx-lgridhead { padding-right: 0; }
html:not(.ji-js) .jx-about .jx-lcards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
html:not(.ji-js) .jx-about .jx-dir { align-self: stretch; max-height: none; }
html:not(.ji-js) .jx-about .jx-dirgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); overflow: visible; min-height: 0; }

/* ---------- About · 04 Training & VATSIM ---------- */
.jx-ch4 { top: 300%; }
@media (min-width: 901px) {
    .jx-about[data-chapter="3"] .jx-chs { transform: translateY(-300%); }
}
.jx-ch4in {
    display: grid; grid-template-columns: minmax(0, 1.62fr) minmax(0, 1fr); grid-template-rows: auto minmax(0, max-content);
    align-content: start; gap: 22px clamp(20px, 2.4vw, 32px);
}
.jx-ch4head { grid-column: 1 / -1; min-width: 0; }
.jx-h2t { margin: 14px 0 0; font-size: clamp(32px, 3.2vw, 46px); line-height: 1; letter-spacing: -.045em; font-weight: 600; }
.jx-tr, .jx-vs {
    position: relative; min-width: 0; min-height: 0; box-sizing: border-box; display: flex; flex-direction: column;
    border-radius: 18px; background: var(--t-panel); border: 1px solid var(--t-line);
    -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); overflow-y: auto; scrollbar-width: none;
}
.jx-tr { padding: 22px 26px; }
.jx-vs { padding: 22px 24px; overflow-x: hidden; }
.jx-trtop { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.jx-trhead { min-width: 0; }
.jx-trk { margin: 0; display: flex; align-items: center; gap: 10px; font-size: 11.5px; font-weight: 700; letter-spacing: 1.6px; text-transform: uppercase; color: var(--t-accent); }
.jx-trh { margin: 6px 0 0; font-size: 24px; line-height: 1.15; letter-spacing: -.02em; font-weight: 600; }
.jx-trintro { margin: 8px 0 0; max-width: 560px; font-size: 14px; line-height: 22px; color: var(--t-muted); }
.jx-trstats { flex: none; display: flex; gap: 8px; }
.jx-trplane svg { display: block; transform: rotate(90deg); }
.jx-trroute .jx-trdot { background: var(--t-panelsolid); border-color: var(--t-line3); }
.jx-trstop[data-past] .jx-trdot { background: #F58932; border-color: #F58932; }
.jx-trcard[hidden] { display: none; }
.jx-trcopy { min-width: 0; }
.jx-trof { margin: 0; font-size: 11px; font-weight: 700; letter-spacing: 1.4px; text-transform: uppercase; color: var(--t-faint); }
.jx-trcard h4 { margin: 4px 0 0; font-size: 20px; line-height: 1.2; font-weight: 600; }
.jx-trtext { margin: 6px 0 0; font-size: 14px; line-height: 22px; color: var(--t-muted); }
.jx-trcta { margin-top: auto; padding-top: 16px; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 22px; }
.jx-trcta .ja-btn { height: 46px; padding: 0 20px; font-size: 15px; }
.jx-trlink { text-decoration: none; }
.jx-trar { color: #F58932; }
.jx-vshead { display: flex; align-items: center; gap: 18px; }
.jx-vsseal svg { position: absolute; inset: 0; overflow: visible; }
.jx-vsh { margin: 6px 0 0; font-size: 22px; line-height: 1.15; letter-spacing: -.02em; font-weight: 600; }
.jx-vsintro { margin: 14px 0 0; font-size: 14px; line-height: 22px; color: var(--t-muted); }
.jx-vslist { list-style: none; margin: 16px 0 0; padding: 0; display: grid; gap: 10px; }
.jx-vslist li { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 12px; align-items: start; }
.jx-vsc { min-width: 0; }
.jx-vst { display: block; font-size: 14px; font-weight: 600; line-height: 19px; }
.jx-vsd { display: block; margin-top: 1px; font-size: 12.5px; line-height: 18px; color: var(--t-faint); }
.jx-vscta { margin-top: auto; padding-top: 16px; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 20px; }
.jx-vscta .ja-btn { height: 44px; padding: 0 18px; font-size: 14px; }
/* the design's own rules for the chapter, value for value */
.jx-trstat{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:66px;height:58px;box-sizing:border-box;padding:0 10px;border-radius:12px;background:var(--t-tile,rgba(255,255,255,.05));border:1px solid var(--t-tileline,rgba(255,255,255,.09));font-size:11px;color:var(--t-faint,#8FA6C4)}
.jx-trstat b{font-size:20px;line-height:22px;font-weight:600;color:var(--t-ink,#FFFFFF)}
.jx-trroute{position:relative;flex:none;height:74px;margin-top:24px}
.jx-trline{position:absolute;left:4%;right:4%;top:17px;height:2px;background:repeating-linear-gradient(90deg,var(--t-line3,rgba(255,255,255,.3)) 0 6px,transparent 6px 12px)}
.jx-trdone{position:absolute;left:4%;top:17px;height:2px;border-radius:2px;background:linear-gradient(90deg,#C2590C,#F58932);transition:width .8s cubic-bezier(.2,.8,.2,1)}
.jx-trplane{position:absolute;z-index:2;top:7px;width:22px;height:22px;margin-left:-11px;color:#F58932;pointer-events:none;filter:drop-shadow(0 0 8px rgba(245,137,50,.65));transition:left .8s cubic-bezier(.2,.8,.2,1)}
.jx-trstop{appearance:none;margin:0;padding:0;border:0;background:transparent;cursor:pointer;font:inherit;color:inherit;position:absolute;z-index:1;top:0;width:108px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center}
.jx-trdot{display:block;width:12px;height:12px;margin-top:12px;box-sizing:border-box;border-radius:999px;border:2px solid;transition:background-color .3s ease,border-color .3s ease,transform .3s ease}
.jx-trstop[aria-selected="true"] .jx-trdot{transform:scale(0)}
.jx-trn{margin-top:8px;font-size:10.5px;font-weight:700;letter-spacing:1.2px;color:var(--t-faint,#8FA6C4);font-variant-numeric:tabular-nums}
.jx-trname{margin-top:2px;font-size:13px;font-weight:600;white-space:nowrap;color:var(--t-ink2,#E6EDF5);transition:color .2s ease}
.jx-trstop:hover .jx-trname{color:var(--t-ink,#FFFFFF)}
.jx-trstop:hover .jx-trdot{transform:scale(1.25)}
.jx-trstop[aria-selected="true"] .jx-trname,.jx-trstop[aria-selected="true"] .jx-trn{color:var(--t-accent,#F58932)}
.jx-trstop:focus-visible,.jx-trep:focus-visible,.jx-trlink:focus-visible{outline:2px solid #F58932;outline-offset:3px;border-radius:8px}
.jx-trcard{margin-top:12px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:22px;padding:18px 20px;border-radius:14px;background:var(--t-tile,rgba(255,255,255,.04));border:1px solid var(--t-tileline,rgba(255,255,255,.09))}
@keyframes jxTrA{from{opacity:0;transform:translateY(8px)}}
@keyframes jxTrB{from{opacity:0;transform:translateY(8px)}}
.jx-trina{animation:jxTrA .5s cubic-bezier(.2,.8,.2,1)}
.jx-trinb{animation:jxTrB .5s cubic-bezier(.2,.8,.2,1)}
.jx-treps{display:flex;flex-direction:column;gap:6px;min-width:0}
.jx-trep{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;background:var(--t-tile,rgba(255,255,255,.05));border:1px solid var(--t-tileline,rgba(255,255,255,.09));color:var(--t-ink,#FFFFFF);text-decoration:none;transition:border-color .2s ease,background-color .2s ease,transform .2s ease}
.jx-trep:hover{border-color:rgba(245,137,50,.6);background:var(--t-tile2,rgba(255,255,255,.08));transform:translateX(2px)}
.jx-trepn{font-size:11px;font-weight:700;letter-spacing:1px;color:var(--t-accent,#F58932);font-variant-numeric:tabular-nums}
.jx-trept{font-size:13.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jx-trepgo{color:var(--t-faint,#8FA6C4);transition:color .2s ease}
.jx-trep:hover .jx-trepgo{color:#F58932}
.jx-trlink{appearance:none;margin:0;padding:0;border:0;background:transparent;cursor:pointer;font:inherit;font-size:14px;font-weight:600;color:var(--t-ink,#FFFFFF);text-decoration:none;display:inline-flex;align-items:center;gap:6px;transition:color .2s ease}
.jx-trlink:hover{color:#F58932}
.jx-vsseal{position:relative;flex:none;width:104px;height:104px;color:var(--t-ink,#FFFFFF)}
.jx-vsradar{position:absolute;inset:4px;border-radius:999px;background:conic-gradient(from 0deg,rgba(245,137,50,0) 0deg,rgba(245,137,50,0) 270deg,rgba(245,137,50,.42) 360deg);animation:jxSpin 4.5s linear infinite}
.jx-vsspin{transform-origin:60px 60px;animation:jxSpin 48s linear infinite}
.jx-vsico{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:rgba(245,137,50,.12);border:1px solid rgba(245,137,50,.32);color:var(--t-accent,#F58932)}
@media (min-width:901px) and (max-width:1180px){.jx-ch4in{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) !important}.jx-trstats{display:none !important}.jx-trstop{width:96px}.jx-trname{font-size:12px}.jx-trcard{grid-template-columns:minmax(0,1fr) !important;gap:12px}.jx-trtext,.jx-trof{display:none}.jx-trcard h4{margin-top:0 !important}.jx-trroute{height:66px;margin-top:16px}.jx-treps{flex-direction:row !important;flex-wrap:wrap}.jx-trep{padding:7px 10px;gap:8px;max-width:100%;box-sizing:border-box}.jx-vsd{display:none !important}.jx-tr,.jx-vs{overflow-y:auto;scrollbar-width:none}}
@media (min-width:901px) and (max-height:931px){.jx-trintro{display:none}}
@media (min-width:901px) and (max-height:892px){.jx-trintro,.jx-vsintro{display:none}.jx-trroute{height:66px;margin-top:14px}.jx-trep{padding:8px 12px}.jx-trcard{padding:14px 16px}.jx-tr,.jx-vs{padding-top:18px !important;padding-bottom:18px !important;overflow-y:auto;scrollbar-width:none}.jx-vsseal{width:88px;height:88px}.jx-vsseal svg{width:88px;height:88px}}
@media (max-width:900px){.jx-ch4 .jx-chin{padding-top:56px !important}.jx-ch4in{padding-bottom:56px !important;gap:20px !important}.jx-trtop{flex-direction:column}.jx-trroute{height:auto !important;display:grid !important;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:18px !important}.jx-trline,.jx-trdone,.jx-trplane{display:none !important}.jx-trstop{position:relative !important;left:auto !important;transform:none !important;width:auto !important;flex-direction:row !important;justify-content:flex-start;gap:8px;height:42px;padding:0 12px !important;border-radius:10px !important;border:1px solid var(--t-tileline,rgba(255,255,255,.1)) !important;background:var(--t-tile,rgba(255,255,255,.05)) !important}.jx-trstop[aria-selected="true"]{border-color:#F58932 !important;background:rgba(245,137,50,.12) !important}.jx-trdot{display:none !important}.jx-trn,.jx-trname{margin-top:0 !important}.jx-trcard{grid-template-columns:minmax(0,1fr) !important;gap:14px !important}}
@media (max-width:480px){.jx-trroute{grid-template-columns:repeat(2,minmax(0,1fr)) !important}.jx-ch2 .jx-ebp,.jx-ch3 .jx-ebp,.jx-ch4 .jx-ebp{display:none !important}}

/* ---------- Narrower and shorter screens ---------- */
@media (min-width: 901px) {
    .ji-homein { min-height: 0; overflow-y: auto; overflow-x: hidden; scrollbar-width: thin; }
}
@media (max-width: 1560px) {
    .ji-clock-off { display: none; }
    .ji-clock { padding: 8px 12px; }
}
@media (max-width: 1340px) {
    .ji-contact-hours { display: none !important; }
}
@media (min-width: 901px) and (max-width: 1180px) {
    .ji-hrow { flex-wrap: nowrap; gap: 28px 32px; }
    .ji-hero { flex: 1 1 auto; }
    .ji-livecard { flex: 0 0 352px; }
    .ji-livet { font-size: 18px; white-space: nowrap; }
}
@media (min-width: 901px) and (max-width: 1180px) and (max-height: 932px) {
    .ji-featd { display: none; }
}
/* Home on shorter screens: the stats rail kept clear of the footer. */
@media (min-width: 901px) and (max-height: 931px) {
    .ji-homespace { min-height: 8px; }
    .ji-rail { margin-top: 24px; }
}
@media (min-width: 901px) and (max-height: 899px) {
    .ji-hero { gap: 18px; }
    .ji-featd { display: none; }
    .ji-rail { margin-top: 20px; padding-top: 16px; }
}
@media (max-width: 1380px) {
    .ji-links .ji-nav { padding-left: 13px; padding-right: 13px; }
}
@media (max-width: 1240px) {
    .ji-links { display: none; }
    .ji-menu { display: inline-flex; }
    .ji-clock:nth-child(n+4) { display: none; }
    .ji-contact-place { display: none !important; }
}
@media (max-width: 900px) {
    .ji-root { height: auto; min-height: 100vh; }
    .ji-track { height: auto; align-items: start; }
    .ji-slide { min-height: 100vh; }
    .ji-slide[aria-hidden="true"] { max-height: 100vh; overflow: hidden; }
    .jx-fly { display: none; }
}
@media (max-width: 760px) {
    .ji-feats { grid-template-columns: minmax(0, 1fr); }
    .ji-feat { border-left-color: transparent; }
    .ji-contact-hours { display: none !important; }

    .jx-lg { padding: 0; }
    .jx-lgp {
        width: 100%; height: 100%; border-radius: 0; border: 0;
        grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr); overflow-y: auto;
    }
    .jx-lgv { height: 200px; }
    .jx-lgvp, .jx-lglive, .jx-lgvc > .jx-kicker { display: none; }
    .jx-lgvc { left: 20px; right: 20px; bottom: 18px; }
    .jx-lgvh { font-size: 28px; }
    .jx-lglogo { left: 20px; top: 18px; height: 36px; }
    .jx-lgf { overflow: visible; padding: 26px 20px 22px; }
}
@media (min-width: 761px) and (max-height: 720px) {
    .jx-lglive { display: none; }
}
@media (max-width: 640px) {
    .ji-clock:nth-child(n+3) { display: none; }
    .ji-contact { display: none; }
    .ji-crewbtn, .ji-header .ji-langsw { display: none; }
    .ji-homein { padding-top: calc(84px + clamp(56px, 5.6vw, 84px)); }
}
@media (max-width: 420px) {
    .jd-chip-note { display: none; }
    .jd-chip { margin-right: 6px; }
    .ji-clock { padding: 8px 8px; }
}
@media (max-width: 360px) {
    .ji-clock:nth-child(1) { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    .ji-track, .ji-slide { transition: none !important; }
    .ji-slide[aria-hidden="true"] { transform: none; filter: none; }
    .jx-r, .jx-p, .jx-h, .jx-s, .jx-fly, .jx-fly-trail, .jx-strobe { animation: none !important; }
    .jx-s { transition: none !important; }
    .jx-fly { display: none; }
    .jx-par { transform: scale(1.03); transition: none; }
    .jx-pill { transition: none !important; }
    .jx-menu, .jx-mi, .jx-mfoot { animation: none !important; }
    .jx-lg, .jx-lgp, .jx-lgsky, .jx-lgvc > *, .jx-lgi, .jx-lgok, .jx-lgok path, .jx-fld[data-err="true"] { animation: none !important; }
    .ji-skel, .ji-badge[data-loading], .jl-pulse, .jx-num[data-loading] .jx-s { animation: none !important; }
}

/* About on narrower and shorter screens */
@media (min-height: 893px) { .jx-dirgrid { min-height: 328px; } }
@media (min-width: 1700px) { .jx-dirgrid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 1700px) and (min-height: 893px) { .jx-dirgrid { min-height: 248px; } }
@media (min-width: 901px) and (max-width: 1180px) {
    .jx-dirgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .jx-ebp { display: none; }
    .jx-ch1in { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    .jx-histhead p { display: none; }
    .jx-ch2[data-view="spot"] .jx-vtog { right: auto; left: calc(44% - 196px); }
    .jx-ch3in { grid-template-columns: minmax(0, 300px) minmax(0, 1fr); }
    .jx-th { width: 62px; }
    .jx-thsub { display: none; }
    .jx-lctags { display: none; }
    .jx-histhead { padding-left: 0; }
    .jx-hrow { grid-template-columns: 86px 22px minmax(0, 1fr); }
}
@media (min-width: 901px) and (max-height: 892px) {
    .jx-hrow { min-height: 40px; }
    .jx-hbody { padding-bottom: 6px; }
    .jx-htitle { font-size: 14px; }
    .jx-htext { line-height: 16px; }
    .jx-spotquote { display: none; }
    .jx-lcbio { -webkit-line-clamp: 3; }
    .jx-ch3p { display: none; }
    .jx-lcmore { display: none; }
}
@media (min-width: 901px) and (max-width: 1280px) {
    .ji-news3 { display: none; }
    .ji-news .ji-feats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
    .jx-about .jx-chs { position: relative; inset: auto; transform: none; }
    .jx-about .jx-ch { position: relative; top: auto; height: auto; visibility: visible; transform: none; filter: none; opacity: 1; }
    .jx-about .jx-chbar { display: none; }
    .jx-about .jx-chin { position: relative; inset: auto; display: flex; flex-direction: column; gap: 28px; }
    .jx-about .jx-ch2 .jx-chin, .jx-about .jx-ch3 .jx-chin { padding-top: 56px; }
    .jx-about .jx-ch3in { padding-bottom: 56px; }
    .jx-about .jx-ch1in { padding-bottom: 8px; }
    .jx-about .jx-histhead { padding-left: 0; }
    .jx-about .jx-histhead p { display: none; }
    .jx-about .jx-hist { overflow: visible; }
    .jx-about .jx-vtog { position: relative; right: auto; top: auto; margin: 56px 20px 0; }
    .jx-about .jx-spot, .jx-about .jx-lgrid { position: relative; inset: auto; }
    .jx-about .jx-spot { display: flex; flex-direction: column; }
    .jx-about .jx-portraits { position: relative; width: auto; height: 380px; margin-top: 20px; }
    .jx-about .jx-pid { bottom: 20px; }
    .jx-about .jx-spottext { position: relative; left: auto; right: auto; top: auto; bottom: auto; padding: 24px 20px 8px; }
    .jx-about .jx-spotstack { flex: none; }
    .jx-about .jx-spotc { position: relative; display: none; }
    .jx-about .jx-spotc[data-on="true"] { display: block; }
    .jx-about .jx-lgrid { padding-top: 24px; padding-bottom: 8px; }
    .jx-about .jx-lgridhead { padding-right: 0; }
    .jx-about .jx-lcards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .jx-about .jx-dir { align-self: stretch; max-height: none; }
    .jx-about .jx-dirgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); overflow: visible; min-height: 0; }
}
@media (max-width: 760px) {
    .ji-feats.ji-news-grid { grid-template-columns: minmax(0, 1fr); }
    .ji-news .ji-featd { display: none; }
}
@media (max-width: 640px) {
    .jx-ch1in { padding-top: calc(84px + clamp(56px, 5.6vw, 84px)); }
    .jx-lcards, .jx-about .jx-lcards { grid-template-columns: minmax(0, 1fr); }
    .jx-hrow { grid-template-columns: 78px 22px minmax(0, 1fr); }
    .jx-portraits { height: 320px; }
}
@media (max-width: 600px) {
    .jx-dirgrid, .jx-about .jx-dirgrid { grid-template-columns: minmax(0, 1fr); }
    .jx-dirs { flex: 1 1 100%; }
    .jx-dirbar .jx-dd { flex: 1 1 0; min-width: 0; }
    .jx-ddbtn { width: 100%; justify-content: space-between; }
    .jx-ddmenu { min-width: 0; width: max(100%, 210px); }
}
@media (hover: none) {
    .jx-pcard:hover .jx-pcid { display: block; }
    .jx-pcard:hover .jx-pcstat { display: none; }
}
@media (prefers-reduced-motion: reduce) {
    .jx-ch, .jx-chs { transition: none !important; }
    .jx-cr, .jx-cp, .jx-chh, .jx-pcard, .jx-ddmenu, .jx-thbar i, .jb-trail { animation: none !important; }
    .jx-pbig { transition: none !important; }
}

/* ---------- Network ---------- */
.ji-slide.jn-net { color: var(--t-ink); background: radial-gradient(ellipse 70% 85% at 64% 58%, #0C2E5A 0%, #05183A 48%, #020C1E 100%); }
.jn-netsky { position: absolute; inset: 0; pointer-events: none; transition: opacity 1.4s linear; }
.jn-netsky--day { opacity: var(--t-lux, 0); background: radial-gradient(ellipse 70% 85% at 64% 58%, #F7FBFF 0%, #DDEBF8 48%, #B9D3EE 100%); }
.jn-netsky--warm {
    opacity: var(--t-warm, 0);
    background: radial-gradient(ellipse 60% 70% at 88% 6%, rgba(255, 150, 80, .42) 0%, rgba(245, 120, 60, .12) 45%, rgba(245, 120, 60, 0) 72%);
}
.ji-globe { position: absolute; inset: 0; width: 100%; height: 100%; display: block; touch-action: none; cursor: grab; }

.ji-netlegend {
    position: absolute; right: clamp(20px, 4vw, 56px); top: calc(94px + clamp(56px, 5.6vw, 84px)); display: flex; align-items: center; gap: 16px;
    height: 36px; padding: 0 14px; background: var(--t-glass); border: 1px solid var(--t-line); border-radius: 6px;
    font-size: 12px; color: var(--t-muted); pointer-events: none;
}
.ji-netlegend > span { display: inline-flex; align-items: center; gap: 7px; }
.ji-lg-hub { width: 10px; height: 10px; border-radius: 999px; background: #F58932; box-shadow: 0 0 0 3px rgba(245, 137, 50, .3); }
/* Ringed like the dots on the globe, so the key still shows on the white day panel. */
.ji-lg-dest { width: 7px; height: 7px; border-radius: 999px; background: #FFFFFF; box-shadow: 0 0 0 1.5px #0A2A52; }
.ji-lg-route { width: 18px; height: 2px; border-radius: 2px; background: #F58932; }

.ji-gctl { position: absolute; z-index: 2; right: clamp(20px, 4vw, 56px); bottom: 28px; display: flex; flex-direction: column; gap: 6px; }
.ji-gctl[hidden] { display: none; }
.ja .ji-gctl button {
    appearance: none; margin: 0; padding: 0; cursor: pointer; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 6px;
    background: var(--t-glass); border: 1px solid var(--t-line); color: var(--t-ink);
    transition: border-color .2s ease, background-color .2s ease, transform .15s ease;
}
.ja .ji-gctl button:hover { border-color: #F58932; }
.ja .ji-gctl button:active { transform: scale(.94); }
.ja .ji-gctl button:focus-visible { outline: 2px solid var(--t-focus); outline-offset: 2px; }
.ji-nethint {
    position: absolute; left: calc(50% + 210px); bottom: 34px; transform: translateX(-50%); margin: 0; font-size: 12px; letter-spacing: .3px;
    color: var(--t-hint); white-space: nowrap; pointer-events: none;
}

.ji-netpanel {
    position: absolute; z-index: 2; left: clamp(16px, 3vw, 40px); top: calc(94px + clamp(56px, 5.6vw, 84px)); width: 380px;
    max-height: calc(100% - 122px - clamp(56px, 5.6vw, 84px)); box-sizing: border-box; display: flex; flex-direction: column;
    background: var(--t-panel); border: 1px solid var(--t-line); border-radius: 10px; box-shadow: 0 24px 60px rgba(0, 0, 0, .35); overflow: hidden; color: var(--t-ink);
}
.ji-nethead { flex: none; padding: 22px 22px 16px; border-bottom: 1px solid var(--t-line2); }
.ji-neteb { margin: 0; font-size: 11px; font-weight: 600; letter-spacing: 1.6px; text-transform: uppercase; color: var(--t-accent); }
.ji-neth { margin: 6px 0 0; font-size: 30px; line-height: 36px; font-weight: 600; letter-spacing: -.6px; color: var(--t-ink); }
.ji-netintro { margin: 6px 0 0; font-size: 14px; line-height: 22px; color: var(--t-muted); }
.ji-netempty { margin: 0; padding: 18px 22px 22px; font-size: 14px; line-height: 22px; color: var(--t-muted); }
.ji-nethubs { flex: none; padding: 14px 16px 6px; display: flex; flex-direction: column; gap: 8px; }
.ji-nethub, .ji-nethub:hover {
    display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 10px; box-sizing: border-box;
    background: var(--t-tile); color: var(--t-ink); border: 1.5px solid var(--t-line2); border-radius: 6px; text-decoration: none;
}
.ji-nethub:hover { border-color: var(--t-line3); background: var(--t-tile2); }
.ji-nethub[aria-current="true"] { background: rgba(245, 137, 50, .12); border-color: #F58932; }
.ji-nethub:focus-visible { outline: 2px solid var(--t-focus); outline-offset: 2px; }
.ji-nethub-id {
    display: grid; place-items: center; width: 52px; height: 44px; border-radius: 4px; background: var(--t-tile2); color: var(--t-ink);
    font-size: 13px; font-weight: 600; letter-spacing: .8px;
}
.ji-nethub[aria-current="true"] .ji-nethub-id { background: #F58932; color: #141250; font-weight: 700; }
.ji-nethub-t { display: flex; flex-direction: column; min-width: 0; }
.ji-nethub-c { font-size: 15px; line-height: 20px; font-weight: 600; }
.ji-nethub-k { font-size: 12px; line-height: 17px; color: var(--t-faint); }
.ji-nethub[aria-current="true"] .ji-nethub-k { color: var(--t-muted); }
.ji-nethub-n { font-size: 14px; font-weight: 600; color: var(--t-faint); font-variant-numeric: tabular-nums; }
.ji-nethub[aria-current="true"] .ji-nethub-n { font-weight: 700; color: var(--t-accent2); }
/* A season with more hubs than the permanent three keeps its destinations in view. */
.ji-nethubs:is([data-count="4"], [data-count="5"], [data-count="6"]) { gap: 6px; }
.ji-nethubs:is([data-count="4"], [data-count="5"], [data-count="6"]) .ji-nethub { padding: 6px 10px; }
.ji-nethubs:is([data-count="4"], [data-count="5"], [data-count="6"]) .ji-nethub-id { height: 34px; }
.ji-netseasons {
    flex: none; margin: 14px 16px 0; padding: 4px; display: grid; grid-template-columns: 1fr 1fr; gap: 4px;
    background: var(--t-tile); border: 1px solid var(--t-line2); border-radius: 8px;
}
.ji-netseasons a, .ji-netseasons a:hover {
    display: flex; flex-direction: column; align-items: center; gap: 1px; padding: 7px 8px; border-radius: 5px; text-decoration: none;
    font-size: 13px; line-height: 17px; font-weight: 600; color: var(--t-muted); text-align: center; transition: background-color .2s ease, color .2s ease;
}
.ji-netseasons a:hover { background: var(--t-tile2); color: var(--t-ink); }
.ji-netseasons a span { font-size: 11px; line-height: 14px; font-weight: 500; color: var(--t-faint); }
.ji-netseasons a[aria-current="true"] { background: #F58932; color: #141250; }
.ji-netseasons a[aria-current="true"] span { color: rgba(20, 18, 80, .72); }
.ji-netseasons a:focus-visible { outline: 2px solid var(--t-focus); outline-offset: 2px; }
.ji-netseason { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.ji-netseason[hidden] { display: none; }
.ji-netsel { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.ji-netsel[hidden] { display: none; }
.ji-netcount { flex: none; padding: 12px 22px 8px; display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.ji-netcount p { margin: 0; font-size: 14px; font-weight: 600; color: var(--t-ink); }
.ji-netcount-s { font-size: 12px; color: var(--t-faint); white-space: nowrap; }
.ji-dests {
    flex: 1; min-height: 80px; margin: 0; padding: 0 16px 12px; list-style: none; overflow-y: auto; scrollbar-width: thin;
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-content: start; gap: 6px;
}
.ji-dests:focus-visible { outline: 2px solid var(--t-focus); outline-offset: -2px; }

/* The panels' long lists scroll in place: a slim pill in the theme's ink that
   turns to the accent under the pointer, in a gutter kept open so nothing
   shifts when it appears, and holding the scroll so the page does not move
   on beneath the list. */
.ji-dests {
    scrollbar-width: thin; scrollbar-color: var(--t-scroll) transparent; scrollbar-gutter: stable; overscroll-behavior: contain;
}
.ji-dests:hover { scrollbar-color: var(--t-scroll-hover) transparent; }
.ji-dests::-webkit-scrollbar { width: 8px; }
.ji-dests::-webkit-scrollbar-track { background: transparent; margin-block: 6px; }
.ji-dests::-webkit-scrollbar-thumb {
    background: var(--t-scroll); background-clip: padding-box; border: 2px solid transparent; border-radius: 999px;
}
.ji-dests::-webkit-scrollbar-thumb:hover,
.ji-dests::-webkit-scrollbar-thumb:active {
    background-color: var(--t-scroll-hover);
}
.jx-fade[data-more="true"] {
    -webkit-mask-image: linear-gradient(180deg, #000 calc(100% - 40px), transparent); mask-image: linear-gradient(180deg, #000 calc(100% - 40px), transparent);
}
.ji-chip {
    display: flex; align-items: center; gap: 8px; min-width: 0; padding: 7px 10px; background: var(--t-tile); border: 1px solid var(--t-tileline);
    border-radius: 4px; font-size: 12px; line-height: 16px; cursor: default;
}
.ji-chip:hover { border-color: rgba(245, 137, 50, .6); background: rgba(245, 137, 50, .10); }
.ji-chip-id { font-weight: 700; color: var(--t-accent2); letter-spacing: .4px; }
.ji-chip-c { color: var(--t-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ji-netfoot {
    flex: none; padding: 12px 22px; border-top: 1px solid var(--t-line2); display: flex; align-items: center; justify-content: space-between; gap: 12px;
    background: var(--t-foot);
}
.ji-netfoot a, .ji-netfoot a:hover { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; color: var(--t-ink); text-decoration: none; white-space: nowrap; }
.ji-netfoot a svg { transition: transform .25s ease; }
.ji-netfoot a:hover svg { transform: translateX(4px); }
.ji-netfoot span { font-size: 11px; color: var(--t-faint); text-align: right; }

.ji-netfail {
    position: absolute; z-index: 1; left: calc(460px + (100% - 460px) / 2); top: 50%; transform: translate(-50%, -50%); width: min(360px, 80%);
    margin: 0; padding: 14px 18px; border-radius: 8px; background: var(--t-glass); border: 1px solid var(--t-line);
    font-size: 14px; line-height: 22px; color: var(--t-muted); text-align: center;
}
.ji-netfail[hidden] { display: none; }
.jn-net--noglobe .ji-globe, .jn-net--noglobe .ji-netlegend, .jn-net--noglobe .ji-nethint { visibility: hidden; }

/* The globe needs scripts; without them the panel tells the whole story. */
html:not(.ji-js) .ji-globe, html:not(.ji-js) .ji-netlegend, html:not(.ji-js) .ji-nethint { display: none; }

@media (max-width: 1240px) {
    .ji-nethint { display: none; }
}
@media (max-width: 900px) {
    .ji-globe { position: relative; height: 560px; touch-action: pan-y; }
    .ji-netlegend { display: none; }
    .ji-gctl { top: 412px; bottom: auto; right: 16px; }
    .ji-netfail { left: 50%; top: 320px; }
    .ji-netpanel { position: relative; left: auto; top: auto; width: auto; max-height: none; margin: 4px 16px 16px; }
    /* Stacked under the globe the panel has no height of its own to keep its
       lists to, so each holds itself to most of a screen and scrolls within. */
    .ji-dests { flex: none; max-height: min(60vh, 520px); max-height: min(60svh, 520px); }
    html:not(.ji-js) .ji-netpanel { margin-top: calc(84px + clamp(56px, 5.6vw, 84px)); }
}

/* ---------- Fleet ---------- */
.ji-slide.jf { color: var(--t-ink); background: #04142E; }
.jf-canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.jf-layer {
    position: absolute; inset: 0; box-sizing: border-box; padding: calc(94px + clamp(56px, 5.6vw, 84px)) clamp(20px, 4vw, 56px) 28px;
    display: grid; grid-template-columns: minmax(0, 520px) minmax(0, 1fr) minmax(0, 460px); grid-template-rows: auto minmax(0, 1fr) auto; pointer-events: none;
}
.jf-tl { grid-column: 1; grid-row: 1; align-self: start; min-width: 0; display: flex; flex-direction: column; }
.jf-eb { margin: 0; display: flex; align-items: center; gap: 12px; font-size: 13px; font-weight: 600; letter-spacing: 2px; text-transform: uppercase; color: var(--t-accent); }
.jf-eb > span { width: 40px; height: 2px; background: #F58932; }
.jf-maker { margin: 12px 0 0; font-size: 20px; line-height: 26px; font-weight: 500; color: var(--t-muted); }
.jf-h1 { margin: 2px 0 0; font-size: clamp(48px, 5.7vw, 88px); line-height: .92; letter-spacing: -.045em; font-weight: 600; color: var(--t-ink); white-space: nowrap; }
.jf-tagline { margin: 12px 0 0; font-size: 19px; line-height: 26px; font-weight: 500; color: var(--t-ink); }
.jf-desc { margin: 6px 0 0; max-width: 470px; font-size: 14px; line-height: 22px; color: var(--t-muted); }

/* the split-flap board */
.jx-flap { display: inline-flex; align-items: baseline; white-space: nowrap; }
.jx-fc { position: relative; display: block; height: 1.3em; line-height: 1.3em; overflow: hidden; overflow-x: visible; overflow-y: clip; }
.jx-fw { visibility: hidden; white-space: pre; }
.jx-fx {
    position: absolute; left: 0; right: 0; top: 0; display: block; white-space: pre; text-align: center; line-height: 1.3em;
    transition: transform 1s cubic-bezier(.3, .65, .2, 1);
}
.jx-fc:nth-child(2) .jx-fx { transition-delay: .04s; }
.jx-fc:nth-child(3) .jx-fx { transition-delay: .08s; }
.jx-fc:nth-child(4) .jx-fx { transition-delay: .12s; }
.jx-fc:nth-child(5) .jx-fx { transition-delay: .16s; }
.jx-fc:nth-child(6) .jx-fx { transition-delay: .2s; }
.jx-fc:nth-child(7) .jx-fx { transition-delay: .24s; }
.jx-fc:nth-child(n+8) .jx-fx { transition-delay: .28s; }
.jf-h1 .jx-fc, .jf-h1 .jx-fx { height: .92em; line-height: .92em; }
.jf-h1 .jx-fx { height: auto; }
.ji-slide[aria-hidden="false"] .jx-fc .jx-fx { animation: jxOdo 1.5s cubic-bezier(.3, .65, .2, 1) .45s backwards; }
.ji-slide[aria-hidden="false"] .jx-fc:nth-child(2) .jx-fx { animation-delay: .5s; }
.ji-slide[aria-hidden="false"] .jx-fc:nth-child(3) .jx-fx { animation-delay: .55s; }
.ji-slide[aria-hidden="false"] .jx-fc:nth-child(4) .jx-fx { animation-delay: .6s; }
.ji-slide[aria-hidden="false"] .jx-fc:nth-child(5) .jx-fx { animation-delay: .65s; }
.ji-slide[aria-hidden="false"] .jx-fc:nth-child(6) .jx-fx { animation-delay: .7s; }
.ji-slide[aria-hidden="false"] .jx-fc:nth-child(n+7) .jx-fx { animation-delay: .75s; }

.jf-tr { grid-column: 3; grid-row: 1; align-self: start; min-width: 0; display: flex; flex-direction: column; gap: 12px; pointer-events: auto; }
.jf-tabs {
    display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; padding: 4px; border-radius: 10px;
    background: var(--t-glass); border: 1px solid var(--t-line); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
}
.jf-tab, .jf-tab:hover {
    display: block; min-width: 0; padding: 8px 10px 9px; border-radius: 7px; background: rgba(255, 255, 255, 0); color: var(--t-ink);
    text-decoration: none; transition: background-color .25s ease;
}
.jf-tab[aria-selected="false"]:hover { background: var(--t-tile2); }
.jf-tab[aria-selected="true"] { background: var(--t-navon); color: var(--t-navonink); box-shadow: 0 6px 18px rgba(0, 0, 0, .25); }
.jf-tab:focus-visible { outline: 2px solid var(--t-focus); outline-offset: 2px; }
.jf-tabicao { display: block; font-size: 11px; line-height: 14px; font-weight: 700; letter-spacing: 1.2px; color: var(--t-faint); }
.jf-tab[aria-selected="true"] .jf-tabicao { color: var(--t-navonacc); }
.jf-tabname { display: block; margin-top: 2px; font-size: 15px; line-height: 20px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.jf-tabseats { display: block; font-size: 12px; line-height: 16px; color: var(--t-faint); }
.jf-tab[aria-selected="true"] .jf-tabseats { color: var(--t-navonsub); }

.jf-specscard {
    border-radius: 10px; overflow: hidden; border: 1px solid var(--t-line); background: var(--t-specgap);
    -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); box-shadow: 0 24px 60px rgba(0, 0, 0, .3);
    transition: opacity .35s ease, visibility .35s ease;
}
.jf[data-view="cabin"] .jf-specscard { visibility: hidden; opacity: 0; }
.jf-specs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; }
.jf-spec { min-width: 0; padding: 12px 14px 13px; background: var(--t-card); }
.jf-specl { margin: 0; font-size: 11px; line-height: 14px; font-weight: 600; letter-spacing: 1.2px; text-transform: uppercase; color: var(--t-faint); }
.jf-specv {
    margin: 5px 0 0; font-size: 19px; line-height: 24px; font-weight: 600; letter-spacing: -.2px; color: var(--t-ink);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.jf-specsub { margin: 1px 0 0; font-size: 12px; line-height: 16px; color: var(--t-faint); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.jf-legend {
    display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; padding: 10px 14px; background: var(--t-card);
    border-top: 1px solid var(--t-line2); font-size: 12px; line-height: 16px; color: var(--t-muted);
}
.jf-legend > span { display: inline-flex; align-items: center; gap: 7px; }
.jf-legend > span[hidden] { display: none; }
.jf-legend > span > span { flex: none; width: 9px; height: 11px; border-radius: 2px; }
.jf-lg-j { gap: 6px; }
.jf-lg-j > span { background: #3A2E7A; box-shadow: inset -3px 0 0 #211A52; }
.jf-lg-seat > span { background: #1D5AA6; box-shadow: inset -3px 0 0 #0B3A75; }
.jf-lg-xl > span { background: #F58932; box-shadow: inset -3px 0 0 #C96A1C; }
.jf-legend .jf-lg-exit > span { width: 12px; height: 4px; background: #FFB273; }
.jf-legend .jf-lg-galley > span { width: 11px; height: 11px; background: repeating-linear-gradient(135deg, #C3CEDB 0 2px, #9EAEC2 2px 4px); }
.jf-legend .jf-lg-lav > span { width: 11px; height: 11px; background: #DCE4EE; box-shadow: inset 0 0 0 1px #9EAEC2; }

.jf-bl { grid-column: 1; grid-row: 3; align-self: end; min-width: 0; pointer-events: auto; }
.jf-ghead { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.jf-ghead p { margin: 0; font-size: 11px; font-weight: 600; letter-spacing: 1.6px; text-transform: uppercase; color: var(--t-accent); }
.jf-gnote { font-size: 12px; color: var(--t-faint); }
/* by day both sit on the pale page, where the accent and the faint ink fall just short of 4.5:1 */
html[data-ji-ui="light"] .jf-ghead p { color: #A04A0B; }
html[data-ji-ui="light"] .jf-gnote { color: var(--t-muted); }
.jf-gallery { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.jf-gallery[hidden] { display: none; }
.jf-tile {
    position: relative; display: block; width: 100%; aspect-ratio: 4 / 3; border-radius: 8px; overflow: hidden; cursor: zoom-in;
    border: 1px solid var(--t-line3); background: #0B2D59; box-shadow: 0 14px 30px rgba(0, 0, 0, .35); transition: transform .25s ease, border-color .25s ease;
}
.jf-tile:hover { transform: translateY(-3px); border-color: rgba(245, 137, 50, .85); }
.jf-tile:focus-visible { outline: 2px solid var(--t-focus); outline-offset: 2px; }
.jf-tile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.jf-tilecap {
    position: absolute; left: 0; right: 0; bottom: 0; padding: 18px 8px 6px; background: linear-gradient(0deg, rgba(2, 12, 30, .85), rgba(2, 12, 30, 0));
    font: 500 11px/14px Arial, sans-serif; color: #FFFFFF; text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

.jf-brwrap { grid-column: 3; grid-row: 3; align-self: end; min-width: 0; display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
.jf-mode {
    display: inline-flex; gap: 3px; padding: 4px; border-radius: 999px; background: var(--t-glass); border: 1px solid var(--t-line);
    -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); box-shadow: 0 14px 36px rgba(0, 0, 0, .35); pointer-events: auto; max-width: 100%;
}
.jf-mode .jf-modebtn { line-height: 18px; white-space: nowrap; transition: background-color .3s ease, color .3s ease; }
.jf-mode .jf-modebtn:focus-visible { outline: 2px solid var(--t-focus); outline-offset: 2px; }
.jf-vshort { display: none; }
.jf-br {
    width: 100%; min-width: 0; pointer-events: auto; box-sizing: border-box; padding: 16px 18px 18px; border-radius: 10px; background: var(--t-card);
    border: 1px solid var(--t-line); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); box-shadow: 0 24px 60px rgba(0, 0, 0, .3);
}
.jf-brhead { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.jf-brhead p { margin: 0; font-size: 11px; font-weight: 600; letter-spacing: 1.6px; text-transform: uppercase; color: var(--t-accent); }
.jf-brhead a, .jf-brhead a:hover { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 600; color: var(--t-ink); text-decoration: none; white-space: nowrap; }
.jf-onboard { list-style: none; margin: 12px 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px 14px; }
.jf-onboard li { display: flex; align-items: flex-start; gap: 9px; min-width: 0; font-size: 13px; line-height: 18px; color: var(--t-ink2); }
.jf-onboard li > span:last-child { min-width: 0; }
.jf-tick { flex: none; display: grid; place-items: center; width: 18px; height: 18px; border-radius: 999px; background: rgba(245, 137, 50, .18); }

.jf-lb {
    position: fixed; inset: 0; z-index: 40; width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; border: 0; box-sizing: border-box;
    padding: 64px clamp(16px, 7vw, 110px); background: rgba(2, 10, 26, .92); color: #FFFFFF;
}
.jf-lb[open] { display: flex; align-items: center; justify-content: center; }
.jf-lb::backdrop { background: transparent; }
.jf-lb figure { margin: 0; max-width: 100%; display: flex; flex-direction: column; gap: 12px; }
.jf-lb img { display: block; max-width: 100%; max-height: calc(100vh - 170px); object-fit: contain; border-radius: 8px; box-shadow: 0 30px 80px rgba(0, 0, 0, .5); }
.jf-lb figcaption { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; font-size: 14px; color: #C9D6E8; }
.jf-lb figcaption > span:first-child { color: #FFFFFF; font-weight: 500; }
.jf-lbpos { font-variant-numeric: tabular-nums; }
.ja .jf-lbbtn {
    appearance: none; margin: 0; padding: 0; cursor: pointer; position: absolute; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 999px;
    background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .22); color: #FFFFFF;
}
.ja .jf-lbbtn:focus-visible { outline: 2px solid #F58932; outline-offset: 2px; }
.jf-lbprev { left: clamp(8px, 2vw, 32px); top: 50%; transform: translateY(-50%); }
.jf-lbnext { right: clamp(8px, 2vw, 32px); top: 50%; transform: translateY(-50%); }
.ja .jf-lbclose { right: clamp(8px, 2vw, 32px); top: 16px; width: 44px; height: 44px; }

/* The drawing needs scripts; without them the words and photos are the page. */
html:not(.ji-js) .jf-canvas, html:not(.ji-js) .jf-mode { display: none; }

@media (max-width: 1280px) {
    .jf-layer { grid-template-columns: minmax(0, 430px) minmax(0, 1fr) minmax(0, 430px); }
    .jf-desc { display: none; }
}
@media (min-width: 901px) and (max-width: 1180px) {
    .jf-gnote { display: none; }
}
@media (min-width: 901px) and (max-height: 872px) {
    .jf-desc { display: none; }
}
@media (max-width: 900px) {
    .ji-slide.jf { display: flex; flex-direction: column; background: var(--t-headbg); transition: background-color .9s ease; }
    .jf-layer { display: contents; }
    .jf-tl { order: 1; padding: calc(84px + clamp(56px, 5.6vw, 84px)) 20px 0; }
    .jf-tr { order: 2; padding: 20px 16px 0; }
    .jf-canvas { order: 4; position: relative; flex: none; height: 420px; margin-top: 4px; }
    .jf-canvas.jf-tall { height: 920px; }
    .jf-brwrap { display: contents; }
    .jf-mode { order: 3; align-self: center; margin: 18px 0 0; }
    .jf-br { order: 5; margin: 0 16px; width: auto; }
    .jf-bl { order: 6; padding: 20px 16px 32px; }
    .jf[data-view="cabin"] .jf-specscard { display: none; }
    .jf-tl, .jf-tr, .jf-bl, .jf-br { align-self: stretch; }
}
@media (max-width: 560px) {
    .jf-specs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .jf-onboard { grid-template-columns: minmax(0, 1fr); }
    .jf-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .jf-h1 { font-size: 48px; }
    .jf-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .jf-vlong { display: none; }
    .jf-vshort { display: inline; }
}
@media (prefers-reduced-motion: reduce) {
    .jx-fx { transition: none !important; animation: none !important; }
}

/* ---------- Careers: two doors ---------- */
@keyframes jxOPulse { 0% { box-shadow: 0 0 0 0 rgba(245, 137, 50, .7); } 70% { box-shadow: 0 0 0 7px rgba(245, 137, 50, 0); } 100% { box-shadow: 0 0 0 0 rgba(245, 137, 50, 0); } }
.jx-opulse { animation: jxOPulse 1.8s infinite; }

.jx-doors { color: var(--t-ink); background: #04142E; }
.jx-drow { position: absolute; inset: 0; display: flex; }
.jx-door { position: relative; flex: none; width: 37.5%; overflow: hidden; cursor: pointer; transition: width .75s cubic-bezier(.65, 0, .2, 1); }
.jx-door[data-open="true"] { width: 62.5%; cursor: default; }
.jx-door .jx-par { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transform: scale(1.06); transition: none; }
.jx-dshade { position: absolute; inset: 0; transition: opacity .9s ease; }
.jx-dshade--dark { opacity: var(--t-dark); }
.jx-dshade--light {
    opacity: var(--t-ui);
    background: linear-gradient(180deg, rgba(240, 246, 252, .9) 0%, rgba(240, 246, 252, .45) 30%, rgba(240, 246, 252, .62) 48%, rgba(240, 246, 252, .97) 76%), linear-gradient(90deg, rgba(240, 246, 252, .7) 0%, rgba(240, 246, 252, 0) 70%);
}
.jx-door[data-door="academy"] .jx-dshade--dark {
    background: linear-gradient(180deg, rgba(3, 14, 34, .82) 0%, rgba(3, 14, 34, .35) 30%, rgba(3, 14, 34, .55) 48%, rgba(3, 14, 34, .96) 76%), linear-gradient(90deg, rgba(3, 14, 34, .75) 0%, rgba(3, 14, 34, 0) 70%);
}
.jx-door[data-door="experienced"] .jx-dshade--dark {
    background: linear-gradient(180deg, rgba(3, 14, 34, .85) 0%, rgba(3, 14, 34, .45) 35%, rgba(3, 14, 34, .95) 80%), linear-gradient(0deg, rgba(14, 52, 102, .25), rgba(14, 52, 102, .25));
}
.jx-dwarm { position: absolute; inset: 0; opacity: 0; transition: opacity .6s ease; background: linear-gradient(0deg, rgba(245, 137, 50, .16), rgba(245, 137, 50, 0) 45%); }
.jx-dtop { position: absolute; left: 0; right: 0; top: 0; height: 3px; background: #F58932; opacity: 0; transition: opacity .5s ease; }
.jx-door[data-open="true"] .jx-dwarm, .jx-door[data-open="true"] .jx-dtop { opacity: 1; }

.jx-dfull {
    position: absolute; left: 56px; right: 64px; bottom: 112px; opacity: 0; visibility: hidden; transform: translateY(18px);
    transition: opacity .5s ease 0s, transform .6s cubic-bezier(.2, .8, .2, 1) 0s, visibility 0s linear .5s;
}
.jx-door[data-door="experienced"] .jx-dfull { left: 48px; }
.jx-door[data-open="true"] .jx-dfull {
    opacity: 1; visibility: visible; transform: none;
    transition: opacity .5s ease .3s, transform .6s cubic-bezier(.2, .8, .2, 1) .3s, visibility 0s linear 0s;
}
.jx-dkick { margin: 0; display: inline-flex; align-items: center; gap: 10px; font-size: 12px; font-weight: 700; letter-spacing: 1.8px; text-transform: uppercase; color: var(--t-accent); }
.jx-dtag { height: 22px; padding: 0 9px; display: inline-flex; align-items: center; border-radius: 999px; background: #F58932; color: #141250; }
.jx-dkick--mini { color: var(--t-cool); }
.jx-dkick--mini .jx-dtag { background: none; color: inherit; border: 1px solid currentColor; }
.jx-dh { margin: 12px 0 0; font-size: clamp(38px, 3.8vw, 56px); line-height: 1; letter-spacing: -0.04em; font-weight: 600; white-space: nowrap; }
.jx-dtext { margin: 12px 0 0; max-width: 560px; font-size: 16px; line-height: 25px; color: var(--t-ink2); }
.jx-dpath { margin-top: 20px; display: flex; align-items: center; gap: 14px; max-width: 600px; }
.jx-dlab { margin: 0; font-size: 10px; font-weight: 700; letter-spacing: 1.3px; text-transform: uppercase; color: var(--t-faint); }
.jx-dval { margin: 2px 0 0; font-size: 18px; font-weight: 700; }
.jx-dval--entry { white-space: nowrap; }
.jx-droute { position: relative; flex: 1; min-width: 120px; max-width: 260px; display: flex; align-items: flex-start; justify-content: space-around; padding-top: 12px; }
.jx-droute-line { position: absolute; left: 0; right: 0; top: 16px; border-top: 2px dashed var(--t-line3); }
.jx-droute-plane { position: absolute; left: -4px; top: 6px; color: #F58932; }
.jx-droute-plane svg { display: block; transform: rotate(90deg); }
.jx-dstop { position: relative; display: flex; flex-direction: column; align-items: center; gap: 4px; }
.jx-dstop > span:first-child { width: 9px; height: 9px; border-radius: 999px; background: var(--t-panelsolid); border: 2px solid var(--t-dash2); }
.jx-dstop > span:last-child { font-size: 10px; font-weight: 700; letter-spacing: 1px; color: var(--t-faint); }
.jx-dperks { margin: 20px 0 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px 24px; max-width: 600px; }
.jx-dperks li { display: flex; align-items: center; gap: 9px; font-size: 14px; color: var(--t-ink2); }
.jx-dperks svg { flex: none; }
.jx-dcta { margin-top: 24px; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; }
.jx-dapply { height: 52px; padding: 0 26px; font-size: 16px; }
.jx-dresume { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; color: var(--t-ink); text-decoration: none; }
.jx-dresume > span { display: inline-flex; color: #F58932; transition: transform .25s ease; }
.jx-dresume:hover { color: var(--t-ink); }
.jx-dresume:hover > span { transform: translateX(3px); }
.jx-dclosed {
    margin: 0; display: inline-flex; align-items: center; height: 52px; padding: 0 20px; border-radius: 4px;
    border: 1px dashed var(--t-line3); font-size: 14px; font-weight: 600; color: var(--t-muted);
}

.jx-dmini {
    position: absolute; left: 40px; right: 40px; bottom: 112px;
    transition: opacity .4s ease .35s, transform .5s cubic-bezier(.2, .8, .2, 1) .35s, visibility 0s linear 0s;
}
.jx-door[data-open="true"] .jx-dmini {
    opacity: 0; visibility: hidden; transform: translateY(18px);
    transition: opacity .4s ease 0s, transform .5s cubic-bezier(.2, .8, .2, 1) 0s, visibility 0s linear .4s;
}
.jx-dmh { margin: 12px 0 0; font-size: clamp(28px, 2.5vw, 36px); line-height: 1.05; letter-spacing: -0.035em; font-weight: 600; }
.jx-dmp { margin: 10px 0 0; font-size: 14px; line-height: 22px; color: var(--t-muted); }
.jx-dmp b { color: var(--t-ink); }
.jx-dmrow { margin-top: 20px; display: flex; align-items: center; gap: 14px; }
.jx-dmrow > span { font-size: 13px; color: var(--t-faint); }
.jx-dbtn {
    appearance: none; margin: 0; padding: 0; cursor: pointer; display: grid; place-items: center; width: 52px; height: 52px; border-radius: 999px;
    border: 1.5px solid var(--t-btnline); background: transparent; color: var(--t-ink); transition: transform .25s ease, background-color .25s ease;
}
.jx-door:hover .jx-dbtn, .jx-dbtn:focus-visible { transform: translateX(4px); background: rgba(255, 255, 255, .08); }

.jx-seam {
    position: absolute; top: 0; bottom: 0; left: 62.5%; width: 2px; margin-left: -1px; pointer-events: none;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .35) 30%, rgba(255, 255, 255, .35) 70%, rgba(255, 255, 255, 0));
    transition: left .75s cubic-bezier(.65, 0, .2, 1);
}
.jx-doors[data-open="experienced"] .jx-seam { left: 37.5%; }
.jx-seam.jx-seamor {
    top: 330px; bottom: auto; width: 44px; height: 44px; margin-left: -22px; display: grid; place-items: center; border-radius: 999px;
    background: var(--t-panelsolid); border: 1.5px solid var(--t-line3); font-size: 12px; font-weight: 700; letter-spacing: 1px;
}

.jx-dhead { position: absolute; left: clamp(20px, 4vw, 56px); top: calc(94px + clamp(56px, 5.6vw, 84px)); pointer-events: none; }
.jx-dheb { margin: 0; display: flex; align-items: center; gap: 12px; font-size: 13px; font-weight: 600; letter-spacing: 2px; text-transform: uppercase; color: var(--t-accent); }
.jx-dheb > span { width: 40px; height: 2px; background: #F58932; }
.jx-dh1 { margin: 14px 0 0; font-size: clamp(44px, 4.4vw, 64px); line-height: .96; letter-spacing: -0.045em; font-weight: 600; white-space: nowrap; }
.jx-dh1 span { color: var(--t-accent); }
.jx-dhp { margin: 12px 0 0; font-size: 16px; color: var(--t-muted); }

.jx-dstrip {
    position: absolute; left: 0; right: 0; bottom: 0; min-height: 84px; padding: 12px clamp(20px, 4vw, 56px);
    display: flex; flex-wrap: wrap; align-items: center; gap: 12px 22px;
    background: var(--t-strip); border-top: 1px solid var(--t-line2); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
}
.jx-dlabel { margin: 0; flex: none; font-size: 11px; font-weight: 700; letter-spacing: 1.6px; text-transform: uppercase; color: var(--t-accent); }
.jx-dsteps { margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; }
.jx-dsteps li { display: flex; align-items: center; gap: 12px; }
.jx-dsn { flex: none; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 999px; background: #F58932; color: #141250; font-size: 14px; font-weight: 700; }
.jx-dst { display: block; font-size: 14px; font-weight: 600; }
.jx-dshort { display: block; font-size: 12px; color: var(--t-faint); }
.jx-dline { flex: none; width: 46px; margin-left: 6px; border-top: 2px dashed rgba(245, 137, 50, .5); }
.jx-dspacer { flex: 1; }
.jx-droles { display: flex; align-items: center; gap: 12px; min-width: 0; }
.jx-droledot { flex: none; width: 8px; height: 8px; border-radius: 999px; background: var(--t-faint); }
.jx-droledot.jx-opulse { background: #F58932; }
.jx-droletext { min-width: 0; line-height: 1.35; }
.jx-drolehead { display: block; font-size: 12px; color: var(--t-faint); white-space: nowrap; }
.jx-drolehead a { color: var(--t-ink2); font-weight: 600; text-decoration: none; }
.jx-drolehead a:hover { text-decoration: underline; }
.jx-drolelist { display: block; font-size: 13.5px; font-weight: 600; white-space: nowrap; }

/* the application */
.jx-lgp.jx-app { width: min(1120px, 100%); height: min(780px, 100%); grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); }
.jx-apphoto { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; animation: jxKen 16s cubic-bezier(.2, .6, .2, 1) forwards; }
.jx-apphoto[hidden] { display: none; }
.jx-apshade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(3, 14, 34, .62) 0%, rgba(3, 14, 34, .12) 24%, rgba(3, 14, 34, .5) 46%, rgba(3, 14, 34, .95) 78%); }
.jx-app .jx-lgvc { bottom: 30px; }
.jx-aph { margin: 12px 0 0; font-size: clamp(28px, 2.6vw, 38px); line-height: 1.04; letter-spacing: -0.04em; font-weight: 600; }
.jx-app .jx-lgvp { margin-top: 10px; font-size: 14px; line-height: 21px; }
.jx-aproute { margin-top: 18px; padding-top: 16px; border-top: 1px solid rgba(255, 255, 255, .2); }
.jx-apsteps { margin: 0; padding: 0; list-style: none; }
.jx-apsteps li { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 12px; min-height: 42px; }
.jx-apdot { position: relative; display: block; }
.jx-apdot > span {
    position: absolute; left: 4px; top: 3px; display: grid; place-items: center; width: 14px; height: 14px; border-radius: 999px;
    border: 2px solid rgba(201, 214, 232, .5); background: transparent; color: #141250; transition: background-color .4s ease, box-shadow .4s ease;
}
.jx-apdot svg { display: none; width: 8px; height: 8px; }
.jx-apdot::after { content: ""; position: absolute; left: 10px; top: 19px; bottom: 1px; width: 2px; background: rgba(201, 214, 232, .25); }
.jx-apsteps li:last-child .jx-apdot::after { display: none; }
.jx-apsteps li[data-state="done"] .jx-apdot > span { border-color: #F58932; background: #F58932; }
.jx-apsteps li[data-state="done"] .jx-apdot svg { display: block; }
.jx-apsteps li[data-state="done"] .jx-apdot::after { background: #F58932; }
.jx-apsteps li[data-state="cur"] .jx-apdot > span { border-color: #F58932; background: #FFFFFF; box-shadow: 0 0 0 5px rgba(245, 137, 50, .25); }
.jx-apsteps li > span:last-child { display: block; padding-bottom: 8px; }
.jx-apst { display: block; font-size: 13.5px; font-weight: 600; color: rgba(230, 237, 245, .75); }
.jx-apsteps li[data-state="done"] .jx-apst, .jx-apsteps li[data-state="cur"] .jx-apst { color: #FFFFFF; }
.jx-apn { margin-right: 6px; color: rgba(201, 214, 232, .6); font-variant-numeric: tabular-nums; }
.jx-apsteps li[data-state="done"] .jx-apn, .jx-apsteps li[data-state="cur"] .jx-apn { color: #FFB273; }
.jx-apss { display: block; margin-top: 1px; font-size: 12px; line-height: 16px; color: rgba(230, 237, 245, .72); }
.jx-aptemp { margin: 8px 0 0; display: flex; align-items: center; gap: 8px; font-size: 12px; color: #C9D6E8; }
.jx-aptemp svg { flex: none; }

.jx-lgf.jx-apf { --apx: clamp(26px, 3.2vw, 46px); padding: 30px var(--apx) 0; scrollbar-width: thin; }
.jx-apf .jx-lgh { margin-top: 10px; font-size: clamp(28px, 2.4vw, 36px); }
.jx-in2.jx-in3 { height: 48px; padding-left: 16px; }
.jx-in2.jx-in3.jx-in2--pw { padding-right: 48px; }
.jx-apf .jx-eye { right: 4px; top: 4px; }
.jx-apf .jx-fld { margin-top: 7px; }
.jx-apf .jx-lghelp { margin-top: 6px; min-height: 0; font-size: 12px; line-height: 16px; }
.jx-appath { margin-top: 14px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.jx-seg { display: inline-flex; gap: 3px; padding: 3px; border-radius: 999px; background: var(--t-tile); border: 1px solid var(--t-tileline); }
.jx-segopt { position: relative; display: block; }
.jx-segopt input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.jx-segopt span {
    display: block; padding: 6px 13px; border-radius: 999px; font-size: 12.5px; font-weight: 600; color: var(--t-navink); cursor: pointer;
    transition: background-color .25s ease, color .25s ease;
}
.jx-segopt input:checked + span { background: var(--t-navon); color: var(--t-navonink); }
.jx-segopt input:focus-visible + span { outline: 2px solid var(--t-focus); outline-offset: 2px; }
.jx-apentry { font-size: 12.5px; color: var(--t-faint); }
.jx-apentry b { color: var(--t-ink); }
.jx-ap2 { margin-top: 18px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 14px; }
.jx-apf .jx-aprow { margin-top: 8px; }
.jx-req { color: var(--t-accent); }
.jx-aphint { margin: 0; font-size: 12px; line-height: 16px; color: var(--t-faint); }
.jx-apchks { margin-top: 9px; display: flex; flex-wrap: wrap; gap: 6px; }
.jx-apchk {
    display: inline-flex; align-items: center; gap: 5px; height: 26px; padding: 0 10px 0 5px; border-radius: 999px; white-space: nowrap;
    font-size: 11.5px; font-weight: 600; background: var(--t-tile); color: var(--t-faint); border: 1px solid var(--t-tileline);
    transition: background-color .25s ease, color .25s ease, border-color .25s ease;
}
.jx-apchkdot { display: grid; place-items: center; width: 14px; height: 14px; border-radius: 999px; background: var(--t-line3); color: #0B2E1A; }
.jx-apchkdot svg { display: block; }
.jx-apchk[data-ok="true"] { background: rgba(92, 196, 138, .14); color: var(--t-good); border-color: rgba(92, 196, 138, .5); }
.jx-apchk[data-ok="true"] .jx-apchkdot { background: #5CC48A; }
/* by day the design's faint grey is 4.3:1 on the tile */
html[data-ji-ui="light"] .jx-apchk[data-ok="false"] { color: var(--t-muted); }
.jx-apcons { margin-top: 16px; display: flex; flex-direction: column; gap: 10px; }
.jx-cons { display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 10px; align-items: start; }
.jx-cons .jx-chk { width: 20px; height: 20px; }
.jx-cons input[aria-invalid="true"] + .jx-chk-box { border-color: var(--t-bad); }
.jx-constext { font-size: 13px; line-height: 19px; color: var(--t-ink2); }
.jx-constext a { color: var(--t-accent); font-weight: 600; text-decoration: none; }
.jx-constext a:hover { color: var(--t-accent); text-decoration: underline; }
.jx-apf .jx-conserr { display: block; min-height: 0; margin: 2px 0 0; }
.jx-apf .jx-conserr:empty { display: none; }
.jx-aphp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.jx-apfoot {
    position: sticky; bottom: 0; z-index: 3; margin: 22px calc(-1 * var(--apx)) 0; padding: 18px var(--apx) 22px;
    background: var(--t-panelsolid); border-top: 1px solid var(--t-tileline);
}
.jx-apbtns { display: flex; gap: 10px; }
.jx-apcancel { height: 52px; padding: 0 20px; font-size: 15px; font-family: inherit; }
.jx-apfoot .jx-lgsubmit { flex: 1; margin-top: 0; height: 52px; box-shadow: 0 10px 24px -12px rgba(245, 137, 50, .7); }
.jx-apf .jx-aperr { margin: 0 0 10px; min-height: 0; }
.jx-apf .jx-aperr:empty { display: none; }
.jx-apalt { margin: 12px 0 0; text-align: center; font-size: 13.5px; color: var(--t-muted); }
.jx-apalt button { appearance: none; margin: 0; padding: 0; border: 0; background: transparent; cursor: pointer; font: inherit; font-weight: 600; color: var(--t-accent); }
.jx-apalt--split { margin-top: 14px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; text-align: left; }
.jx-apalt--split a { font-weight: 600; color: var(--t-accent); text-decoration: none; }
.jx-apalt--split a:hover { color: var(--t-accent); text-decoration: underline; }
.jx-apalt--split button { color: var(--t-ink); }
.jx-apform--resume { padding-bottom: 26px; }
.jx-apform--resume .jx-lgintro { margin-top: 8px; }
.jx-apgap { margin-top: 20px; }
.jx-apform--resume .jx-lgsubmit { margin-top: 18px; height: 52px; }
.jx-apform--resume .jx-aperr { margin: 12px 0 0; }
.jx-apdone { padding-bottom: 26px; }
.jx-apdone .jx-lgok [data-icon] { display: none; }
.jx-apdone .jx-lgok[data-kind="apply"] [data-icon="mail"], .jx-apdone .jx-lgok[data-kind="resume"] [data-icon="ok"] { display: block; }
.jx-apdone .jx-lgok[data-kind="apply"] { background: rgba(245, 137, 50, .16); color: var(--t-accent); box-shadow: 0 0 0 8px rgba(245, 137, 50, .07); }
.jx-apdone[data-kind="apply"] .jx-kicker { color: var(--t-accent); }
.jx-apform > :nth-child(9) { animation-delay: .52s; } .jx-apform > :nth-child(10) { animation-delay: .57s; } .jx-apform > :nth-child(11) { animation-delay: .62s; }

@media (max-width: 1100px) {
    .jx-dline { display: none; }
}
@media (min-width: 901px) and (max-width: 1180px) {
    .jx-dlabel, .jx-dshort { display: none; }
}
@media (min-width: 901px) and (max-height: 852px) {
    .jx-dfull, .jx-dmini { bottom: 100px; }
    .jx-dtext { display: none; }
}
@media (max-width: 900px) {
    .jx-doors { display: flex; flex-direction: column; }
    .jx-drow { position: relative; inset: auto; order: 2; flex-direction: column; }
    .jx-door, .jx-door[data-open="true"] { width: auto; min-height: 620px; cursor: default; transition: none; }
    .jx-dfull, .jx-door[data-open] .jx-dfull { left: 20px; right: 20px; bottom: 36px; opacity: 1; visibility: visible; transform: none; transition: none; }
    .jx-dmini, .jx-seam { display: none; }
    .jx-dhead { position: relative; left: auto; top: auto; order: 1; padding: calc(84px + clamp(56px, 5.6vw, 84px)) 20px 24px; background: var(--t-headbg); }
    .jx-dh1, .jx-dh { white-space: normal; }
    .jx-dstrip { position: relative; order: 3; }
    /* by day the stacked page is pale: the strip loses its glass over the grey, and the accent darkens to 4.5:1 */
    html[data-ji-ui="light"] .jx-dstrip { background: var(--t-headbg); }
    html[data-ji-ui="light"] .jx-dheb, html[data-ji-ui="light"] .jx-dlabel { color: #A04A0B; }
    html[data-ji-ui="light"] .jx-dshort, html[data-ji-ui="light"] .jx-drolehead { color: var(--t-muted); }
}
@media (max-width: 760px) {
    .jx-lgp.jx-app { width: 100%; height: 100%; grid-template-columns: minmax(0, 1fr); }
    .jx-lgf.jx-apf { --apx: 20px; padding: 26px var(--apx) 0; }
    .jx-aproute { display: none; }
    .jx-ap2 { grid-template-columns: minmax(0, 1fr); }
    .jx-lgp.jx-app .jx-lgv { height: 190px; }
    .jx-app .jx-lgvc { bottom: 18px; }
    .jx-aph { font-size: 28px; }
}
@media (min-width: 761px) and (max-height: 800px) {
    .jx-apss { display: none; }
    .jx-apsteps li { min-height: 28px; }
}
@media (max-width: 640px) {
    .jx-dperks { grid-template-columns: minmax(0, 1fr); }
    .jx-door, .jx-door[data-open="true"] { min-height: 680px; }
}
@media (prefers-reduced-motion: reduce) {
    .jx-door, .jx-dfull, .jx-dmini, .jx-dshade, .jx-dwarm, .jx-dtop, .jx-seam, .jx-dbtn { transition: none !important; }
    .jx-opulse, .jx-apphoto { animation: none !important; }
}

/* ---------- News: the newsroom ---------- */
.jn { color: var(--t-ink); background: var(--t-headbg); }
.jn-bg { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
/* a small copy of the open story's photo, blurred and blown up into the backdrop */
.jn-bg img {
    position: absolute; left: 50%; top: 50%; width: 16vmax; height: 10vmax; margin: -5vmax 0 0 -8vmax; object-fit: cover;
    filter: blur(.5vmax) saturate(1.3); transform: scale(8); opacity: 1; transition: opacity 1.1s ease;
}
.jn-bg img[data-out] { opacity: 0; }
.jn-bgshade { position: absolute; inset: 0; transition: opacity .9s ease; }
.jn-bgshade--dark { opacity: var(--t-dark); background: linear-gradient(90deg, rgba(4, 18, 42, .95) 0%, rgba(4, 18, 42, .84) 40%, rgba(4, 18, 42, .64) 100%); }
.jn-bgshade--light { opacity: var(--t-ui); background: linear-gradient(90deg, rgba(238, 243, 249, .96) 0%, rgba(238, 243, 249, .86) 40%, rgba(238, 243, 249, .7) 100%); }
.jn-in {
    position: absolute; inset: 0; padding: calc(94px + clamp(56px, 5.6vw, 84px)) clamp(20px, 4vw, 56px) 28px;
    display: grid; grid-template-columns: minmax(0, 420px) minmax(0, 1fr); gap: clamp(24px, 3.6vw, 52px);
}
.jn-side { min-width: 0; min-height: 0; display: flex; flex-direction: column; }
.jn-eb { margin: 0; display: flex; align-items: center; gap: 12px; font-size: 13px; font-weight: 600; letter-spacing: 2px; text-transform: uppercase; color: var(--t-accent); }
.jn-eb > span { width: 40px; height: 2px; background: #F58932; }
.jn-h1 { margin: 14px 0 0; font-size: clamp(36px, 3.3vw, 48px); line-height: 1; letter-spacing: -0.045em; font-weight: 600; }
.jn-h1 span { color: var(--t-accent); }
.jn-intro { margin: 12px 0 0; font-size: 14.5px; line-height: 23px; color: var(--t-muted); }
.jn-chips { margin-top: 18px; display: flex; flex-wrap: wrap; gap: 6px; }
.jn-chip {
    appearance: none; margin: 0; cursor: pointer; display: inline-flex; align-items: center; gap: 7px; height: 32px; padding: 0 12px; border-radius: 999px;
    border: 1px solid var(--t-line3); background: var(--t-tile); color: var(--t-ink2); font: inherit; font-size: 12.5px; font-weight: 600; white-space: nowrap;
    transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}
.jn-chip:hover { border-color: rgba(245, 137, 50, .65); }
.jn-chip[aria-pressed="true"] { background: var(--t-navon); border-color: var(--t-navon); color: var(--t-navonink); }
.jn-chipn { font-size: 11px; opacity: .6; font-variant-numeric: tabular-nums; }
/* without scripts each post is still a link, but the topics cannot filter */
html:not(.ji-js) .jn-chips { display: none; }
.jn-list { margin-top: 10px; flex: 1; min-height: 0; overflow-y: auto; scrollbar-width: thin; padding: 0 4px 6px 0; }
.jn-list.jx-fade[data-more="true"] { -webkit-mask-image: linear-gradient(180deg, #000 calc(100% - 70px), transparent); mask-image: linear-gradient(180deg, #000 calc(100% - 70px), transparent); }
.jn-list > [hidden], .jn-year[hidden] { display: none; }
.jn-year { margin: 14px 0 6px; padding-left: 2px; font-size: 11px; font-weight: 700; letter-spacing: 1.6px; color: var(--t-faint); }
.jn-row {
    margin: 0 0 2px; width: 100%; display: grid; grid-template-columns: 50px minmax(0, 1fr); gap: 14px; align-items: center;
    padding: 9px 12px 9px 9px; border: 1px solid transparent; border-radius: 12px; background: transparent; color: inherit; text-decoration: none;
    transition: background-color .2s ease, border-color .2s ease;
}
.jn-row:hover { color: inherit; background: var(--t-tile); }
.jn-row:is([aria-current="true"], [aria-current="page"]) { background: var(--t-tile2); border-color: rgba(245, 137, 50, .55); }
.jn-row:focus-visible, .jn-chip:focus-visible, .jn-pbtn:focus-visible { outline: 2px solid #F58932; outline-offset: 2px; }
.jn-date {
    display: flex; flex-direction: column; align-items: center; justify-content: center; height: 50px; border-radius: 10px;
    background: var(--t-tile); border: 1px solid var(--t-tileline); font-variant-numeric: tabular-nums;
    transition: background-color .25s ease, border-color .25s ease, color .25s ease;
}
.jn-date b { font-size: 18px; line-height: 20px; font-weight: 600; }
.jn-date span { margin-top: 2px; font-size: 9.5px; font-weight: 700; letter-spacing: 1.2px; color: var(--t-faint); }
.jn-row:is([aria-current="true"], [aria-current="page"]) .jn-date { background: #F58932; border-color: #F58932; color: #141250; }
/* the design's 70% falls just short of 4.5:1 on the orange */
.jn-row:is([aria-current="true"], [aria-current="page"]) .jn-date span { color: rgba(20, 18, 80, .8); }
.jn-rowb { min-width: 0; display: block; }
.jn-meta { display: flex; align-items: center; gap: 8px; font-size: 10.5px; font-weight: 700; letter-spacing: 1.2px; text-transform: uppercase; color: var(--t-accent); }
.jn-new { display: inline-flex; align-items: center; height: 16px; padding: 0 6px; border-radius: 4px; background: #F58932; color: #141250; font-size: 9.5px; font-weight: 700; letter-spacing: .8px; text-transform: uppercase; }
.jn-title {
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin-top: 3px;
    font-size: 14px; line-height: 19px; font-weight: 600; color: var(--t-ink);
}
.jn-foot { margin: 10px 0 0; padding-top: 10px; border-top: 1px solid var(--t-line2); font-size: 12px; color: var(--t-faint); }
.jn-foot a { color: var(--t-accent); font-weight: 600; text-decoration: none; }
.jn-foot a:hover { text-decoration: underline; }

.jn-read {
    position: relative; min-width: 0; min-height: 0; display: flex; flex-direction: column; border-radius: 18px; overflow: hidden;
    background: var(--t-panel); border: 1px solid var(--t-line); box-shadow: 0 30px 80px rgba(0, 8, 24, .35);
    -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
}
.jn-hero { position: relative; flex: none; height: clamp(190px, 38%, 330px); overflow: hidden; background: #04142E; color: #FFFFFF; }
.jn-hero img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.jn-hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(3, 14, 34, .45) 0%, rgba(3, 14, 34, 0) 28%, rgba(3, 14, 34, .18) 52%, rgba(3, 14, 34, .9) 100%); }
.jn-herotop { position: absolute; z-index: 1; left: 22px; top: 20px; display: flex; gap: 6px; }
.jn-herotxt { position: absolute; z-index: 1; left: 28px; right: 28px; bottom: 22px; }
.jn-when { margin: 0; font-size: 12.5px; font-weight: 600; color: rgba(255, 255, 255, .82); }
.jn-herotxt h2 { margin: 6px 0 0; font-size: clamp(24px, 2.3vw, 34px); line-height: 1.08; letter-spacing: -0.03em; font-weight: 600; }
.jn-tag {
    display: inline-flex; align-items: center; height: 24px; padding: 0 10px; border-radius: 999px; background: rgba(3, 14, 34, .55); border: 1px solid rgba(255, 255, 255, .28);
    font-size: 10.5px; font-weight: 700; letter-spacing: 1.2px; text-transform: uppercase; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
}
.jn-tag--new { background: #F58932; border-color: #F58932; color: #141250; }
.jn-body { flex: 1; min-height: 0; overflow-y: auto; scrollbar-width: thin; padding: 24px 30px 26px; outline: none; }
.jn-body:focus-visible { box-shadow: inset 0 0 0 2px var(--t-focus); }
.jn-lead { margin: 0 0 14px; max-width: 680px; font-size: 17px; line-height: 27px; font-weight: 500; color: var(--t-ink2); }
.jn-content { max-width: 680px; font-size: 15px; line-height: 25px; color: var(--t-muted); }
.jn-content > :first-child { margin-top: 0; }
.jn-content p, .jn-content ul, .jn-content ol { margin: 14px 0 0; }
.jn-content ul, .jn-content ol { padding-left: 22px; }
.jn-content li + li { margin-top: 6px; }
.jn-content h2, .jn-content h3, .jn-content h4 { margin: 22px 0 0; font-size: 18px; line-height: 25px; font-weight: 600; color: var(--t-ink); }
.jn-content a { color: var(--t-accent); font-weight: 600; text-decoration: none; }
.jn-content a:hover { color: var(--t-accent); text-decoration: underline; }
.jn-content strong, .jn-content b { color: var(--t-ink2); }
.jn-content img { display: block; max-width: 100%; height: auto; margin: 18px 0 0; border-radius: 12px; }
.jn-content blockquote { margin: 20px 0 0; max-width: 640px; padding: 4px 0 4px 18px; border-left: 3px solid #F58932; font-size: 16.5px; line-height: 26px; font-style: italic; color: var(--t-ink2); }
.jn-content blockquote p { margin: 0; }
.jn-content table { margin: 18px 0 0; border-collapse: collapse; font-size: 14px; }
.jn-content th, .jn-content td { padding: 6px 10px; border: 1px solid var(--t-line2); text-align: left; }
.jn-pn { flex: none; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); border-top: 1px solid var(--t-line2); }
.jn-pbtn {
    display: flex; flex-direction: column; gap: 3px; min-width: 0; padding: 13px 24px 14px; color: inherit; text-decoration: none; text-align: left;
    transition: background-color .2s ease;
}
.jn-pbtn + .jn-pbtn { border-left: 1px solid var(--t-line2); text-align: right; align-items: flex-end; }
.jn-pbtn span { font-size: 10.5px; font-weight: 700; letter-spacing: 1.2px; text-transform: uppercase; color: var(--t-faint); }
.jn-pbtn b { max-width: 100%; font-size: 13.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: color .2s ease; }
.jn-pbtn:hover { color: inherit; background: var(--t-tile); }
.jn-pbtn:hover b { color: #F58932; }
.jn-pbtn[aria-disabled="true"] { cursor: default; background: transparent; }
.jn-pbtn[aria-disabled="true"] b { color: var(--t-faint); font-weight: 500; }
.jn-read--empty { display: grid; place-items: center; text-align: center; }
.jn-emptyin { padding: 40px; }
.jn-emptyin h2 { margin: 0; font-size: 26px; font-weight: 600; }
.jn-emptyin p { margin: 8px 0 0; font-size: 15px; color: var(--t-muted); }
/* the small print reads in the same pane, without a photo above it */
.jn-doctitle { margin: 0 0 12px; font-size: clamp(24px, 2.3vw, 34px); line-height: 1.08; letter-spacing: -0.03em; font-weight: 600; color: var(--t-ink); }

@keyframes jnInA { from { opacity: 0; transform: translateY(10px); } }
@keyframes jnImgA { from { opacity: 0; transform: scale(1.06); } }
.jn-anima { animation: jnInA .55s cubic-bezier(.2, .8, .2, 1) backwards; }
.jn-hero img.jn-anima { animation: jnImgA .9s ease backwards; }
.jn-herotxt.jn-anima, .jn-body.jn-anima { animation-delay: .08s; }

@media (min-width: 901px) and (max-width: 1180px) {
    .jn-in { grid-template-columns: minmax(0, 320px) minmax(0, 1fr); }
    .jn-intro { display: none; }
    .jn-body { padding: 20px 24px 22px; }
}
@media (min-width: 901px) and (max-height: 892px) {
    .jn-intro { display: none; }
    .jn-hero { height: clamp(170px, 34%, 260px); }
}
@media (max-width: 900px) {
    .jn-in { position: relative; inset: auto; display: flex; flex-direction: column; padding: calc(84px + clamp(56px, 5.6vw, 84px)) 16px 40px; gap: 0; }
    .jn-side { display: contents; }
    .jn-read { order: 5; margin-top: 20px; }
    .jn-list { order: 6; overflow: visible; margin-top: 18px; }
    .jn-list.jx-fade[data-more="true"] { -webkit-mask-image: none; mask-image: none; }
    .jn-foot { order: 7; }
    .jn-hero { height: 220px; }
    .jn-body { overflow: visible; padding: 20px 20px 22px; }
    .jn-body.jx-fade[data-more="true"] { -webkit-mask-image: none; mask-image: none; }
    .jn-bg img { display: none; }
    .jn-herotxt { left: 20px; right: 20px; bottom: 18px; }
}
@media (prefers-reduced-motion: reduce) {
    .jn-anima { animation: none !important; }
    .jn-bg img { transition: none; }
}

/* ---------- Live map ---------- */
.ji-slide.jl { color: var(--t-ink); background: radial-gradient(ellipse 70% 85% at 64% 58%, #0C2E5A 0%, #05183A 48%, #020C1E 100%); }
.ji-netlegend.jl-status { gap: 14px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ji-netlegend .jl-live { gap: 8px; font-weight: 600; color: var(--t-ink); }
.ja .jl .ji-gctl button { border-color: var(--t-line2); }
.ji-nethint.jl-hint { left: calc(50% + 220px); }

.ji-netpanel.jl-panel { width: 404px; line-height: normal; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
/* Without scripts the board is the page: no globe, no filters that cannot filter. */
html:not(.ji-js) .jl-filters, html:not(.ji-js) .jl-status { display: none; }

@media (max-width: 900px) {
    .ji-netpanel.jl-panel { width: auto; }
    /* As with Network's destinations: the board and an open flight hold to most of a screen. */
    .jl-rows, .jl-body { flex: none; max-height: min(60vh, 520px); max-height: min(60svh, 520px); }
}

/* About: the VATSIM logo leads the partner card's links. */
.jx-vslogo{height:44px;flex:1 0 100%;justify-content:flex-start}