/* CIRRUS — private aviation. Black / cloud white; colour only from the sky. */
:root {
  --bk: #07080a; --iv: #eef0f2; --wh: #fafafa; --g: #8a8d92; --ln: rgba(255,255,255,.16);
  --pad: clamp(16px, 2.4vw, 36px); --max: 1800px;
  --e: cubic-bezier(.16,1,.3,1); --io: cubic-bezier(.76,0,.24,1);
  --f: "Geist", "Helvetica Neue", Arial, sans-serif; --m: "Geist Mono", ui-monospace, Menlo, monospace;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-font-smoothing: antialiased; overflow-x: clip; }
body { margin: 0; overflow-x: clip; background: var(--bk); color: var(--wh); font-family: var(--f); font-size: 16px; line-height: 1.45; letter-spacing: -.01em; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; background: none; border: 0; padding: 0; }
h1, h2, h3, p, ul { margin: 0; } ul { padding: 0; list-style: none; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.wrap { width: 100%; max-width: var(--max); margin: 0 auto; padding: 0 var(--pad); }
.mono { font-family: var(--m); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; line-height: 1.4; }
.dim { color: var(--g); }
.lead { font-size: clamp(17px, 1.3vw, 21px); line-height: 1.45; }
.sec { padding: clamp(80px, 11vw, 170px) 0; position: relative; }
.iv { background: var(--iv); color: var(--bk); --g: #63676d; --ln: rgba(0,0,0,.14); }
.h2 { font-size: clamp(46px, 6.2vw, 124px); font-weight: 800; letter-spacing: -.06em; line-height: .9; }
.hd { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 16px 40px; margin-bottom: 50px; } .hd .mono { grid-column: 1 / -1; }
.btns { display: flex; gap: 8px; flex-wrap: wrap; }
:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
.btn { display: inline-flex; align-items: center; justify-content: space-between; gap: 18px; padding: 18px 26px; background: var(--bk); color: var(--wh); border: 1px solid var(--bk); font-size: 14px; font-weight: 650; transition: background .35s, color .35s; white-space: nowrap; }
.btn:hover { background: transparent; color: var(--bk); }
.btn--w { background: var(--wh); color: var(--bk); border-color: var(--wh); } .btn--w:hover { background: transparent; color: var(--wh); }
.btn--wg { background: transparent; color: var(--wh); border-color: rgba(255,255,255,.55); } .btn--wg:hover { background: var(--wh); color: var(--bk); }
.btn--k { background: var(--bk); color: #fff; border-color: var(--bk); } .btn--k:hover { background: transparent; color: var(--bk); }
.sec:not(.iv) .btn:not(.btn--w):not(.btn--wg) { background: var(--wh); color: var(--bk); border-color: var(--wh); }
.iv .btn--w { background: var(--bk); color: #fff; border-color: var(--bk); } .iv .btn--w:hover { background: transparent; color: var(--bk); }
.iv .btn--wg { color: var(--bk); border-color: var(--bk); }
.btn--full { width: 100%; } .btn--sm { padding: 12px 18px; font-size: 13px; }
.ch { display: flex; gap: 2px; flex-wrap: wrap; } .ch button { padding: 12px 18px; border: 1px solid currentColor; font-weight: 650; opacity: .6; transition: background .3s, color .3s, opacity .3s; } .ch button.on { background: var(--wh); color: var(--bk); border-color: var(--wh); opacity: 1; }
.iv .ch button.on { background: var(--bk); color: #fff; border-color: var(--bk); }

/* sliders: always visible */
input[type=range] { -webkit-appearance: none; appearance: none; width: 100%; height: 36px; background: transparent; cursor: pointer; color: #fafafa; --v: 50%; }
.iv input[type=range] { color: #07080a; }
input[type=range]::-webkit-slider-runnable-track { height: 6px; border-radius: 3px; background: linear-gradient(90deg, currentColor 0 var(--v), color-mix(in srgb, currentColor 24%, transparent) var(--v) 100%); }
input[type=range]::-moz-range-track { height: 6px; border-radius: 3px; background: color-mix(in srgb, currentColor 24%, transparent); } input[type=range]::-moz-range-progress { height: 6px; background: currentColor; border-radius: 3px; }
input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; width: 28px; height: 28px; margin-top: -11px; border-radius: 50%; background: currentColor; border: 6px solid #07080a; box-shadow: 0 0 0 1.5px currentColor; transition: transform .2s; }
input[type=range]::-moz-range-thumb { width: 16px; height: 16px; border-radius: 50%; background: currentColor; border: 6px solid #07080a; box-shadow: 0 0 0 1.5px currentColor; }
.iv input[type=range]::-webkit-slider-thumb { border-color: #eef0f2; } input[type=range]:hover::-webkit-slider-thumb { transform: scale(1.15); }

/* ---------- loader: altimeter ---------- */
.pre { position: fixed; inset: 0; z-index: 9999; background: #0b1726; display: grid; place-items: center; align-content: center; gap: 4px; overflow: hidden; }
html:not(.js) .pre { display: none; }
.pre__hz { position: absolute; left: -20%; right: -20%; top: 50%; height: 100%; background: linear-gradient(180deg, #2a2016, #07080a); border-top: 1.5px solid rgba(255,255,255,.6); transform: translateY(var(--hy, 0)) rotate(var(--hr, 0deg)); }
.pre > *:not(.pre__hz) { position: relative; }
.pre__n { font-size: clamp(90px, 16vw, 300px); font-weight: 800; letter-spacing: -.07em; line-height: .85; font-variant-numeric: tabular-nums; }
.pre__k, .pre__u { opacity: .7; }
body.ready .pre { clip-path: inset(0 0 100% 0); transition: clip-path .9s var(--io) .1s; }

/* ---------- transition: the window shade comes down ---------- */
.shade { position: fixed; inset: 0; z-index: 9000; display: grid; grid-template-rows: repeat(14, 1fr); pointer-events: none; visibility: hidden; clip-path: inset(0 0 100% 0); background: #e9ecef; }
.shade i { border-bottom: 1px solid rgba(0,0,0,.08); background: linear-gradient(180deg, #f3f5f7, #dfe3e7); }
.shade__t { position: absolute; inset: 0; display: grid; place-items: center; align-content: center; gap: 12px; color: var(--bk); text-align: center; padding: 0 var(--pad); }
.shade__t b { font-size: clamp(56px, 10vw, 200px); font-weight: 800; letter-spacing: -.06em; line-height: .86; text-transform: uppercase; }
body.leaving .shade, body.arriving .shade { visibility: visible; pointer-events: auto; }
body.leaving .shade { clip-path: inset(0 0 0 0); transition: clip-path .75s var(--io); }
body.arriving .shade { clip-path: inset(0); } body.arrived .shade { clip-path: inset(0 0 100% 0); transition: clip-path .9s var(--io); }
.shade__t > * { opacity: 0; transform: translateY(20px); } body.leaving .shade__t > * { opacity: 1; transform: none; transition: all .6s var(--e) .35s; } body.arriving .shade__t > * { opacity: 1; transform: none; } body.arrived .shade__t > * { opacity: 0; transition: opacity .3s; }

/* ---------- nav ---------- */
.nv { position: fixed; left: 0; right: 0; top: 0; z-index: 600; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 20px; padding: 18px var(--pad); color: #fff; mix-blend-mode: difference; }
.nv__lg { display: grid; gap: 2px; } .nv__lg b { font-size: 22px; font-weight: 800; letter-spacing: .3em; line-height: 1; } .nv__lg .mono { font-size: 9px; opacity: .75; }
.nv__alt { display: flex; align-items: center; gap: 8px; } .nv__alt b { font-weight: 500; font-variant-numeric: tabular-nums; min-width: 6ch; text-align: right; } .nv__alt b[data-tz] { min-width: 0; } .nv__alt i { width: 8px; height: 8px; border-radius: 50%; background: currentColor; animation: blink 1.2s steps(2) infinite; } @keyframes blink { 50% { opacity: .2; } }
.nv__r { justify-self: end; display: flex; align-items: center; gap: 22px; font-size: 14px; font-weight: 600; }
.nv__m { display: flex; align-items: center; gap: 10px; } .nv__m i { position: relative; width: 44px; height: 30px; border: 1.5px solid currentColor; border-radius: 15px; } .nv__m i::before { content: "✈"; position: absolute; inset: 0; display: grid; place-items: center; font-size: 14px; font-style: normal; transition: transform .6s var(--e); } .nv__m:hover i::before { transform: translateX(6px) rotate(-10deg); }

/* ---------- menu: boarding pass ---------- */
.bp { position: fixed; inset: 0; z-index: 800; background: rgba(7,8,10,.96); display: grid; place-items: center; padding: 70px var(--pad) 30px; visibility: hidden; opacity: 0; transition: opacity .4s, visibility 0s .9s; overflow: auto; }
.bp.open { visibility: visible; opacity: 1; transition: opacity .3s; }
body.menu-open { overflow: hidden; }
.bp__pass { display: grid; grid-template-columns: 1fr 230px; width: min(1180px, 100%); background: #f4f2ee; color: var(--bk); transform: translateY(-120%) rotate(-3deg); transition: transform .9s var(--e); box-shadow: 0 40px 100px rgba(0,0,0,.6); }
.bp.open .bp__pass { transform: none; }
.bp__main { padding: clamp(20px, 3vw, 44px); border-right: 2px dashed rgba(0,0,0,.3); position: relative; }
.bp__main::before, .bp__main::after { content: ""; position: absolute; right: -14px; width: 26px; height: 26px; border-radius: 50%; background: #07080a; } .bp__main::before { top: -13px; } .bp__main::after { bottom: -13px; }
.bp__h { display: flex; justify-content: space-between; align-items: baseline; padding-bottom: 14px; border-bottom: 1px solid rgba(0,0,0,.15); } .bp__h b { font-size: 22px; letter-spacing: .3em; }
.bp__route { display: grid; grid-template-columns: auto 1fr auto; align-items: end; gap: 20px; margin: 18px 0 10px; } .bp__route b { display: block; font-size: clamp(40px, 5vw, 86px); font-weight: 800; letter-spacing: -.05em; line-height: .9; } .bp__route svg { width: 100%; height: 40px; } .bp__route path { fill: none; stroke: currentColor; stroke-width: 1.2; stroke-dasharray: 3 4; }
.bp__rows { display: grid; }
.bp__r { display: grid; grid-template-columns: 54px auto 1fr auto; align-items: baseline; gap: 14px; padding: 5px 0; }
.bp__r b { font-size: clamp(24px, 2.8vw, 46px); font-weight: 800; letter-spacing: -.045em; line-height: 1.05; font-variation-settings: "wght" 800; transition: font-variation-settings .4s var(--e); }
.bp__r i { border-bottom: 2px dotted rgba(0,0,0,.25); transform: translateY(-.35em); } .bp__s { opacity: 0; transition: opacity .3s; }
.bp__r:hover b, .bp__r.on b { font-variation-settings: "wght" 200; } .bp__r:hover .bp__s { opacity: 1; }
.bp__stub { display: grid; align-content: start; gap: 6px; padding: clamp(20px, 3vw, 44px) 26px; } .bp__stub b { font-size: 46px; font-weight: 800; letter-spacing: -.05em; line-height: 1; margin-bottom: 10px; }
.bp__code { height: 90px; margin: 10px 0 20px; background: repeating-linear-gradient(90deg, #07080a 0 2px, transparent 2px 4px, #07080a 4px 7px, transparent 7px 9px, #07080a 9px 10px, transparent 10px 14px); }
.bp__x { position: fixed; right: var(--pad); top: 20px; color: #fff; padding: 10px 16px; border: 1px solid rgba(255,255,255,.4); font-weight: 650; font-size: 14px; }

/* ---------- 01 · HERO: Neon-Pulse curtain ---------- */
:root { --blue: #0b1a3d; --disp: "Big Shoulders Display", "Geist", sans-serif; }
.np { position: relative; height: 300vh; background: #fff; color: #07080a; }
.np__st { position: sticky; top: 0; height: 100vh; overflow: hidden; }
.np__c { position: relative; height: 100%; padding-top: 90px; display: flex; flex-direction: column; justify-content: space-between; max-width: none; }
.np__panel { height: 66%; display: flex; flex-direction: column; justify-content: center; align-items: flex-end; }
.np__x { display: flex; justify-content: flex-end; will-change: transform; }
.np__w { margin: 0; font-family: var(--disp); font-size: min(36vw, 64vh); font-weight: 900; line-height: .82; text-transform: uppercase; letter-spacing: -.01em; white-space: nowrap; font-variation-settings: "wght" 900; }
.np__grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 240px; gap: 30px; padding-bottom: 28px; align-items: end; }
.np__left { display: grid; justify-items: start; }
.np__big { font-size: clamp(26px, 3vw, 54px); font-weight: 450; letter-spacing: -.03em; line-height: 1.08; }
.np__lk { margin-top: 18px; font-size: 16px; font-weight: 600; border-bottom: 1.5px solid currentColor; padding-bottom: 3px; }
.np__rh { justify-self: end; text-align: right; }
.np__soc { display: block; line-height: 1.7; }
.pp { perspective: 2000px; perspective-origin: 50% 100%; }
.pl { opacity: 0; transform: translate3d(0, 60%, -3vw) rotateX(-100deg); transform-origin: 50% 100%; will-change: transform, opacity; }
.ready .pl { opacity: 1; transform: none; transition: transform .9s var(--e) var(--d, 0ms), opacity .9s var(--e) var(--d, 0ms); }
.np__ring { position: absolute; z-index: 3; right: var(--pad); bottom: 28px; display: grid; place-items: center; width: 190px; aspect-ratio: 1; color: #07080a; transition: color .4s; } .np__ring.on-blue { color: #fff; }
.np__ring svg { position: absolute; inset: 0; animation: spin 16s linear infinite; } @keyframes spin { to { transform: rotate(360deg); } }
.np__ring text { font: 600 14px var(--m); letter-spacing: .1em; fill: currentColor; } .np__ring i { font-style: normal; font-size: 30px; transition: transform .5s var(--e); } .np__ring:hover i { transform: translateY(6px) rotate(90deg); }
.np__cur { position: absolute; top: 0; left: 0; bottom: 0; z-index: 2; width: 0; overflow: hidden; background: var(--blue); color: #fff; isolation: isolate; }
.np__pic { position: absolute; bottom: 0; left: 20vw; z-index: -2; width: 60vw; height: 100vh; object-fit: cover; object-position: 50% 55%; will-change: transform; }
.np__grad { position: absolute; inset: auto 0 0; z-index: -1; height: 34vh; background: linear-gradient(to top, rgba(4,10,30,.8), rgba(4,10,30,0)); }
.np__cc { width: 100vw; height: 100%; }
@media (max-width: 1000px) { .np__w { font-size: 31vw; } .np__ring { width: 120px; bottom: auto; top: 44vh; } .np__grid { grid-template-columns: 1fr; } .np__rh { display: none; } .np__pic { width: 90vw; left: -15vw; } }

/* ---------- 01b · walk-around ---------- */
.hx { position: relative; height: 520vh; }
.hx__st { position: sticky; top: 0; height: 100vh; min-height: 620px; overflow: hidden; background: #07080a; color: #fff; }
.hx__cur { position: absolute; inset: 0; overflow: hidden; }
.hx__cam { position: absolute; left: 0; top: 0; width: 100%; height: 100%; transform-origin: 0 0; will-change: transform; }
.hx__cam img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 62%; filter: saturate(1.1); }
.hx__shd { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(0deg, rgba(7,8,10,.6), transparent 45%), linear-gradient(180deg, rgba(7,8,10,.35), transparent 25%); }
.hx__shd::after { content: ""; position: absolute; inset: 0; background: radial-gradient(circle 26vmax at var(--fx, 50%) var(--fy, 50%), transparent 40%, rgba(0,0,0,.55)); opacity: var(--fo, 0); }
.hx__ln { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 3; pointer-events: none; overflow: visible; } .hx__ln line { stroke: #fff; stroke-width: 1.5; opacity: var(--co, 0); }
.hx__dot { position: absolute; z-index: 3; left: 0; top: 0; width: 22px; height: 22px; margin: -11px; border-radius: 50%; border: 2px solid #fff; background: rgba(255,255,255,.25); opacity: var(--co, 0); pointer-events: none; }
.hx__dot::after { content: ""; position: absolute; inset: -10px; border-radius: 50%; border: 1px solid #fff; animation: ping 1.8s infinite; } @keyframes ping { to { transform: scale(2.2); opacity: 0; } }
.hx__cs { position: absolute; z-index: 4; right: var(--pad); top: 50%; transform: translateY(-50%); width: min(440px, 36vw); height: 300px; }
.hx__c { position: absolute; inset: 0; display: grid; align-content: center; gap: 12px; opacity: 0; transform: translateY(24px); transition: opacity .45s, transform .7s var(--e); pointer-events: none; text-shadow: 0 4px 30px rgba(0,0,0,.5); }
.hx__c.on { opacity: 1; transform: none; } .hx__c b { font-size: clamp(64px, 7vw, 140px); font-weight: 800; letter-spacing: -.07em; line-height: .85; } .hx__c p { font-size: 18px; max-width: 360px; }
.hx__n { position: absolute; z-index: 4; right: var(--pad); top: 96px; }
.hx__intro { position: absolute; left: 0; right: 0; bottom: 60px; z-index: 4; display: grid; gap: 14px; opacity: var(--io, 1); }
.hx__intro h2 { font-size: clamp(56px, 8vw, 160px); font-weight: 800; letter-spacing: -.07em; line-height: .84; } .hx__intro p:last-child { max-width: 420px; font-size: 18px; }
.hx__end { position: absolute; left: 0; right: 0; bottom: 60px; z-index: 5; display: flex; justify-content: space-between; align-items: end; gap: 30px; opacity: var(--e2, 0); transform: translateY(calc((1 - var(--e2, 0)) * 40px)); pointer-events: none; }
.hx__end.on { pointer-events: auto; } .hx__end h2 { font-size: clamp(56px, 8vw, 160px); font-weight: 800; letter-spacing: -.07em; line-height: .84; text-shadow: 0 10px 60px rgba(0,0,0,.35); }
@media (max-width: 1000px) { .hx__cs { left: var(--pad); right: var(--pad); width: auto; top: auto; bottom: 90px; transform: none; height: 240px; } .hx__c b { font-size: 16vw; } .hx__end { flex-direction: column; align-items: start; } }

/* ---------- 02 · flight plan ---------- */
.fp { position: relative; display: grid; grid-template-columns: 1.35fr 1fr; min-height: 100vh; background: #07080a; }
.fp__map { position: relative; border-right: 1px solid var(--ln); background: radial-gradient(circle, rgba(255,255,255,.13) 1px, transparent 1.4px) 0 0 / 14px 14px; }
.fp__map svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.fp__map .city circle { fill: #fafafa; } .fp__map .city text { fill: rgba(250,250,250,.65); font-family: var(--m); font-weight: 500; letter-spacing: .08em; } .fp__map svg { overflow: hidden; } .fp__map .city.on circle { fill: #fff; } .fp__map .city.on text { fill: #fff; } .fp__map .city { cursor: pointer; }
.fp__map .city .pulse { fill: none; stroke: #fff; stroke-width: 1; animation: pul 2s infinite; transform-box: fill-box; transform-origin: center; } @keyframes pul { from { transform: scale(1); opacity: .9; } to { transform: scale(4); opacity: 0; } }
.fp__map .route { fill: none; stroke: #fff; stroke-width: 2; stroke-dasharray: 6 6; vector-effect: non-scaling-stroke; } .fp__map .ring { fill: rgba(255,255,255,.05); stroke: rgba(255,255,255,.4); stroke-width: 1; stroke-dasharray: 3 5; vector-effect: non-scaling-stroke; } .fp__map .pulse { vector-effect: non-scaling-stroke; }
.fp__map .plane { font-size: 22px; fill: #fff; }
.fp__ui { display: grid; align-content: center; gap: 22px; padding: 110px clamp(24px, 4vw, 70px) 60px; }
.fp__sel { display: grid; grid-template-columns: 1fr auto 1fr; align-items: end; gap: 12px; }
.fp__sel label { display: grid; gap: 8px; } .fp__sel select { width: 100%; padding: 14px 0; background: transparent; border: 0; border-bottom: 1.5px solid #fff; font-size: clamp(18px, 1.6vw, 26px); font-weight: 700; letter-spacing: -.03em; outline: none; } .fp__sel option { color: #000; }
.fp__sw { width: 44px; height: 44px; border: 1px solid rgba(255,255,255,.4); border-radius: 50%; font-size: 18px; transition: transform .5s var(--e); } .fp__sw:hover { transform: rotate(180deg); }
.fp__pax { display: flex; align-items: center; gap: 16px; } .fp__pax button { width: 40px; height: 40px; border: 1px solid rgba(255,255,255,.4); border-radius: 50%; font-size: 18px; } .fp__pax b { font-size: 34px; letter-spacing: -.05em; min-width: 2ch; text-align: center; }
.fp__out { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--ln); } .fp__out div { display: grid; gap: 4px; padding-top: 16px; } .fp__out b { font-size: clamp(32px, 3.4vw, 64px); font-weight: 800; letter-spacing: -.06em; line-height: .9; font-variant-numeric: tabular-nums; }
.fp__jet { display: grid; grid-template-columns: 120px 1fr; gap: 16px; align-items: center; padding: 12px; border: 1px solid var(--ln); transition: background .3s; } .fp__jet:hover { background: rgba(255,255,255,.06); } .fp__jph { display: block; aspect-ratio: 16/10; overflow: hidden; } .fp__jph img { width: 100%; height: 100%; object-fit: cover; } .fp__jet > span:last-child { display: grid; gap: 4px; } .fp__jet b { font-size: 26px; letter-spacing: -.04em; }
.fp .btn { justify-self: start; }

/* ---------- 03 · hangar ---------- */
.hs { position: relative; background: var(--bk); }
.hs__st { position: sticky; top: 0; height: 100vh; overflow: hidden; display: grid; grid-template-rows: auto 1fr auto; padding: 96px 0 30px; }
.hs__head { display: flex; justify-content: space-between; margin-bottom: 22px; }
.hs__track { display: flex; gap: 2px; padding-left: var(--pad); height: 100%; will-change: transform; }
.hg { position: relative; flex: 0 0 auto; width: min(82vw, 1300px); height: 100%; overflow: hidden; background: #111316; color: #fff; }
.hg__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; transition: transform 1.4s var(--e); } .hg:hover .hg__bg { transform: scale(1.04); }
.hg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(7,8,10,.85), rgba(7,8,10,.35) 38%, transparent 60%); pointer-events: none; }
.hg__b { position: absolute; left: 0; top: 0; bottom: 0; z-index: 1; width: min(440px, 46%); display: grid; align-content: space-between; gap: 20px; padding: clamp(22px, 2.6vw, 44px); }
.hg__n { font-size: clamp(46px, 5vw, 100px); font-weight: 800; letter-spacing: -.065em; line-height: .86; }
.hg__sp { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid rgba(255,255,255,.3); padding-top: 16px; } .hg__sp span { display: grid; gap: 4px; } .hg__sp b { font-size: clamp(26px, 2.4vw, 44px); letter-spacing: -.05em; } .hg__sp i { font-style: normal; color: #c4c7cc; }
.hg__bar { display: block; height: 4px; background: rgba(255,255,255,.2); } .hg__bar i { display: block; height: 100%; width: calc(var(--r) * 100%); background: #fff; }
.hg--end { width: min(44vw, 640px); display: grid; align-content: end; padding: 44px; gap: 14px; background: var(--iv); color: var(--bk); } .hg--end::after { display: none; } .hg--end b { font-size: clamp(56px, 6vw, 120px); font-weight: 800; letter-spacing: -.07em; line-height: .86; }
.hs__bar { height: 2px; margin: 26px var(--pad) 0; background: rgba(255,255,255,.18); } .hs__bar i { display: block; height: 100%; background: #fff; transform-origin: left; transform: scaleX(0); }

/* ---------- 04 · climb ---------- */
.cb { position: relative; height: 340vh; }
.cb__st { position: sticky; top: 0; height: 100vh; overflow: hidden; }
.cb__l { position: absolute; inset: 0; opacity: var(--lo, 0); } .cb__l img { width: 100%; height: 100%; object-fit: cover; transform: scale(var(--ls, 1.1)); }
.cb__l[data-cbl="0"] { --lo: 1; }
.cb__st::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,0,0,.6), transparent 60%); pointer-events: none; }
.cb__t { position: absolute; inset: 0; z-index: 1; display: grid; align-content: center; gap: 16px; }
.cb__n { display: flex; align-items: baseline; gap: 12px; } .cb__n b { font-size: clamp(120px, 19vw, 380px); font-weight: 800; letter-spacing: -.075em; line-height: .78; font-variant-numeric: tabular-nums; } .cb__n i { font-style: normal; font-size: clamp(22px, 2vw, 40px); font-weight: 600; }
.cb__s { font-size: clamp(22px, 2vw, 34px); font-weight: 300; letter-spacing: -.03em; max-width: 520px; min-height: 2.4em; }
.cb__scale { position: absolute; right: var(--pad); top: 12vh; bottom: 12vh; width: 60px; z-index: 1; border-left: 1px solid rgba(255,255,255,.5); }
.cb__scale span { position: absolute; left: 0; bottom: calc(var(--y) * 100%); width: 12px; border-top: 1px solid #fff; } .cb__scale i { position: absolute; left: 18px; top: -7px; font-style: normal; }
.cb__scale b { position: absolute; left: -7px; bottom: calc(var(--k, 0) * 100%); width: 14px; height: 14px; margin-bottom: -7px; background: #fff; transform: rotate(45deg); }

/* ---------- 05 · walk the aisle ---------- */
.as { position: relative; height: 420vh; }
.as__st { position: sticky; top: 0; height: 100vh; overflow: hidden; background: #000; }
.as__f { position: absolute; inset: 0; margin: 0; opacity: var(--fo, 0); }
.as__f img { width: 100%; height: 100%; object-fit: cover; transform: scale(var(--fs, 1)); transform-origin: 50% 55%; }
.as__f::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0,0,0,.65), transparent 50%); }
.as__f figcaption { position: absolute; left: var(--pad); bottom: 60px; z-index: 1; display: grid; gap: 12px; max-width: 520px; transform: translateY(calc((1 - var(--fo, 0)) * 30px)); }
.as__f figcaption b { font-size: clamp(56px, 7.5vw, 150px); font-weight: 800; letter-spacing: -.07em; line-height: .84; } .as__f figcaption > span:last-child { font-size: 18px; }
.as__k { position: absolute; left: 0; right: 0; top: 96px; z-index: 2; display: flex; justify-content: space-between; }

/* ---------- 06 · portholes ---------- */
.pt__g { display: grid; grid-template-columns: repeat(4, 1fr); gap: 50px 3vw; } .pt__g--3 { grid-template-columns: repeat(3, 1fr); margin-top: 30px; }
.pt { display: grid; gap: 16px; justify-items: center; text-align: center; }
.pt__w { display: block; width: 100%; aspect-ratio: 3 / 4.2; border-radius: 42% / 30%; overflow: hidden; box-shadow: 0 0 0 10px #d9dde1, 0 0 0 12px #c3c8cd, 0 20px 40px rgba(0,0,0,.18); transition: border-radius .7s var(--e), box-shadow .7s var(--e); }
.pt__w img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.12); transition: transform 1.2s var(--e); }
.pt:hover .pt__w { border-radius: 8% / 6%; } .pt:hover .pt__w img { transform: scale(1); }
.pt__b { display: grid; gap: 6px; } .pt__b b { font-size: clamp(30px, 2.8vw, 54px); font-weight: 800; letter-spacing: -.055em; line-height: .9; }

/* ---------- 07 · empty legs ---------- */
.lg__l { display: grid; border-top: 1px solid var(--ln); }
.lg { display: grid; grid-template-columns: 1.3fr 1.4fr .8fr auto; align-items: center; gap: 24px; padding: 22px 0; border-bottom: 1px solid var(--ln); transition: padding .5s var(--e); } .lg:hover { padding-left: 14px; }
.lg--b { grid-template-columns: 1.3fr 1.4fr .8fr auto auto; }
.lg__r { display: flex; align-items: baseline; gap: 14px; } .lg__r b { font-size: clamp(40px, 5vw, 96px); font-weight: 800; letter-spacing: -.05em; line-height: .9; } .lg__r i { font-style: normal; font-size: clamp(22px, 2vw, 36px); opacity: .6; }
.lg__t { font-size: 14px; } .lg__p { display: grid; justify-items: end; } .lg__p s { opacity: .45; font-size: 15px; } .lg__p b { font-size: clamp(30px, 2.8vw, 52px); letter-spacing: -.05em; }
.lg__n { margin-top: 20px; }

/* ---------- 08 · jet card ---------- */
.jc { position: relative; padding: clamp(100px, 12vw, 180px) 0; overflow: hidden; }
.jc__bg { position: absolute; inset: 0; } .jc__bg img { width: 100%; height: 100%; object-fit: cover; filter: brightness(.45); }
.jc__g { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 6vw; align-items: center; } .jc__g > div:first-child { display: grid; gap: 22px; } .jc__l { max-width: 440px; font-size: 18px; }
.jc__calc { display: grid; gap: 20px; padding: clamp(22px, 3vw, 44px); background: rgba(7,8,10,.7); border: 1px solid rgba(255,255,255,.2); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.jc__r { display: grid; grid-template-columns: auto 1fr auto; gap: 18px; align-items: center; } .jc__r b { font-size: 34px; letter-spacing: -.05em; min-width: 3ch; text-align: right; }
.jc__p { display: grid; gap: 6px; } .jc__p b { font-size: clamp(60px, 6vw, 120px); font-weight: 800; letter-spacing: -.07em; line-height: .9; font-variant-numeric: tabular-nums; }
.jc .btn { justify-self: start; }

/* ---------- 09 · terminal ---------- */
.tt__g { display: grid; grid-template-columns: 1.2fr 1fr; gap: 5vw; align-items: center; } .tt__t { display: grid; gap: 22px; justify-items: start; }
.tt__ph { position: relative; aspect-ratio: 1.1 / 1; } .tt__ph > span { position: absolute; display: block; overflow: hidden; } .tt__ph img { width: 100%; height: 100%; object-fit: cover; }
.tt__a { left: 0; top: 0; width: 66%; height: 62%; } .tt__b { right: 0; top: 18%; width: 30%; height: 56%; } .tt__c { left: 18%; bottom: 0; width: 48%; height: 36%; box-shadow: 0 30px 60px rgba(0,0,0,.3); }

/* ---------- journal / band ---------- */
.jr__g { display: grid; grid-template-columns: 1.3fr 1fr; gap: 4vw; }
.jr__f, .jr__i { display: grid; gap: 10px; align-content: start; } .jr__f b { font-size: clamp(34px, 3.6vw, 66px); font-weight: 800; letter-spacing: -.055em; line-height: .95; }
.jr__ph { display: block; overflow: hidden; } .jr__ph img { width: 100%; aspect-ratio: 4/3; object-fit: cover; transition: transform 1.2s var(--e); } a:hover .jr__ph img { transform: scale(1.05); }
.jr__l { display: grid; gap: 40px; align-content: start; } .jr__i { grid-template-columns: 1fr 1.2fr; gap: 20px; } .jr__i b { display: block; margin-top: 8px; font-size: clamp(22px, 2vw, 34px); letter-spacing: -.045em; line-height: 1.02; } .jr__i .jr__ph img { aspect-ratio: 1; }
.rb { position: relative; height: 100vh; min-height: 620px; overflow: hidden; color: #fff; }
.rb__img { position: absolute; inset: 0; } .rb__img img { width: 100%; height: 100%; object-fit: cover; transform: scale(var(--rs, 1.15)); }
.rb::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0,0,0,.6), transparent 60%); }
.rb__t { position: absolute; inset: 0; z-index: 1; display: grid; align-content: end; justify-items: start; gap: 22px; padding-bottom: 80px; } .rb__h { font-size: clamp(60px, 8.6vw, 170px); font-weight: 800; letter-spacing: -.07em; line-height: .85; }

/* ---------- page head: a cabin window opens ---------- */
.ph { position: relative; height: 180vh; }
.ph__st { position: sticky; top: 0; height: 100vh; min-height: 600px; overflow: hidden; background: radial-gradient(70% 60% at 70% 45%, #24272b, #0b0c0e 80%); }
.ph__win { position: absolute; left: var(--px, 66%); top: 45%; width: var(--pw2, 28vmin); height: var(--ph2, 40vmin); transform: translate(-50%, -50%); border-radius: var(--pr, 14vmin); overflow: hidden; box-shadow: 0 0 0 calc(var(--fr, 1) * 14px) #1a1c1f, 0 0 0 calc(var(--fr, 1) * 16px) #33363a, 0 30px 80px rgba(0,0,0,.5); }
.ph__img { position: absolute; inset: 0; } .ph__img img { width: 100%; height: 100%; object-fit: cover; transform: scale(var(--s, 1.15)); }
.ph__img::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0,0,0,.6), transparent 55%); opacity: var(--sh, 0); }
.ph__t { position: absolute; left: 0; right: 0; bottom: 46px; z-index: 1; display: grid; gap: 18px; }
.ph__h { font-size: clamp(64px, 11vw, 220px); font-weight: 800; letter-spacing: -.07em; line-height: .84; font-variation-settings: "wght" var(--hw, 820); max-width: 13ch; }
.ph__row { display: flex; justify-content: space-between; align-items: end; gap: 30px; } .ph__l { max-width: 460px; font-size: 17px; }

/* ---------- fleet / jet / dest ---------- */
.fl { display: grid; grid-template-columns: 1.25fr 1fr; min-height: 92vh; } .fl--r { grid-template-columns: 1fr 1.25fr; } .fl--r .fl__ph { order: 2; } .fl:nth-child(even) { background: var(--iv); color: var(--bk); --g: #63676d; --ln: rgba(0,0,0,.14); }
.fl:nth-child(even) .btn--w { background: var(--bk); color: #fff; border-color: var(--bk); }
.fl__ph { position: relative; overflow: hidden; } .fl__ph img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s var(--e); } .fl:hover .fl__ph img { transform: scale(1.04); }
.fl__b { display: grid; align-content: center; justify-items: start; gap: 20px; padding: 60px clamp(24px, 4vw, 80px); } .fl__n { font-size: clamp(56px, 7vw, 140px); font-weight: 800; letter-spacing: -.07em; line-height: .86; }
.spec { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--ln); width: 100%; } .spec--3 { grid-template-columns: repeat(3, 1fr); } .spec div { display: grid; gap: 8px; padding: 22px 0; } .spec b { font-size: clamp(40px, 4.6vw, 96px); font-weight: 800; letter-spacing: -.07em; line-height: .9; font-variant-numeric: tabular-nums; }
.spec--3 b { font-size: clamp(32px, 3vw, 58px); }
.jt__cab { margin-top: 18px; }
.cmp { width: 100%; border-collapse: collapse; margin-top: 30px; } .cmp th, .cmp td { padding: 18px 10px; border-bottom: 1px solid var(--ln); text-align: right; font-size: 19px; } .cmp th:first-child { text-align: left; } .cmp tbody th { font-size: clamp(22px, 2.2vw, 40px); font-weight: 800; letter-spacing: -.05em; } .cmp thead th { font: 500 11px var(--m); letter-spacing: .1em; text-transform: uppercase; color: var(--g); }
.hw { position: relative; height: 90vh; overflow: hidden; } .hw__img, .hw__img img { width: 100%; height: 100%; object-fit: cover; } .hw__c { position: absolute; left: 0; right: 0; bottom: 24px; }
.rr__g { display: grid; grid-template-columns: 1fr 1.5fr; gap: 4vw; align-items: center; } .rr__g > div:first-child { display: grid; gap: 22px; }
.rr__map { aspect-ratio: 1000/560; overflow: hidden; background: radial-gradient(circle, rgba(255,255,255,.13) 1px, transparent 1.4px) 0 0 / 14px 14px; } .rr__map svg { width: 100%; height: 100%; }
.rr__map .ring { fill: rgba(255,255,255,.06); stroke: #fff; stroke-width: 1.5; stroke-dasharray: 4 5; } .rr__map .city circle { fill: #fff; } .rr__map .city.out circle { fill: rgba(255,255,255,.25); } .rr__map .city text { fill: rgba(255,255,255,.8); font: 500 17px var(--m); } .rr__map .city circle { r: 6px; }
.rr__l { display: grid; gap: 0; border-top: 1px solid var(--ln); } .rr__l li { display: flex; justify-content: space-between; padding: 10px 0; border-bottom: 1px solid var(--ln); font-size: 17px; } .rr__l li.out { opacity: .35; }
.ot { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px; margin-top: 30px; } .ot__i { display: grid; gap: 10px; } .ot__i img { width: 100%; aspect-ratio: 16/10; object-fit: cover; } .ot__i b { font-size: clamp(26px, 2.4vw, 46px); letter-spacing: -.055em; line-height: .95; }
.dd__g { display: grid; grid-template-columns: 1fr 1fr; gap: 5vw; align-items: center; } .dd__g > div:last-child { display: grid; gap: 22px; justify-items: start; }
.dd__ph { position: relative; aspect-ratio: 1; } .dd__ph span { position: absolute; display: block; overflow: hidden; } .dd__ph span:first-child { left: 0; top: 0; width: 72%; height: 78%; } .dd__ph span:last-child { right: 0; bottom: 0; width: 50%; height: 40%; box-shadow: 0 30px 60px rgba(0,0,0,.5); } .dd__ph img { width: 100%; height: 100%; object-fit: cover; }
.fp--page { min-height: 90vh; }

/* ---------- jet card page ---------- */
.cd { display: grid; grid-template-columns: 1fr 1fr; min-height: 80vh; align-items: center; gap: 5vw; padding: 80px var(--pad); } .cd--r .cd__card { order: 2; } .cd:nth-child(even) { background: var(--iv); color: var(--bk); --g: #63676d; }
.cd:nth-child(even) .btn--w { background: var(--bk); color: #fff; border-color: var(--bk); }
.cd__card { justify-self: center; width: min(520px, 100%); aspect-ratio: 1.586; padding: 30px; display: grid; align-content: space-between; color: #fff; background: linear-gradient(135deg, #2b2e33, #07080a 60%, #1b1d20); box-shadow: 0 40px 80px rgba(0,0,0,.45), inset 0 0 0 1px rgba(255,255,255,.15); transform: rotate(-4deg); transition: transform .8s var(--e); }
.cd:hover .cd__card { transform: rotate(0) translateY(-8px); } .cd__card b { font-size: clamp(50px, 5vw, 90px); font-weight: 800; letter-spacing: -.06em; line-height: .9; } .cd__h { font-size: 22px; font-weight: 300; }
.cd__b { display: grid; gap: 18px; justify-items: start; } .cd__n { font-size: clamp(60px, 8vw, 160px); font-weight: 800; letter-spacing: -.07em; line-height: .86; }

/* ---------- misc pages ---------- */
.sf { display: grid; grid-template-columns: repeat(4, 1fr); gap: 3vw; } .sf__i { display: grid; gap: 12px; align-content: start; border-top: 1px solid var(--ln); padding-top: 18px; } .sf__i b { font-size: clamp(56px, 6vw, 116px); font-weight: 800; letter-spacing: -.08em; line-height: .85; } .sf__i h3 { font-size: 22px; letter-spacing: -.03em; }
.ht { display: flex; gap: 2px; overflow-x: auto; cursor: grab; margin-top: 30px; scrollbar-width: none; user-select: none; } .ht::-webkit-scrollbar { display: none; }
.ht__i { flex: 0 0 min(420px, 80vw); display: grid; gap: 14px; align-content: start; padding: 30px; background: #fff; } .ht__i b { font-size: clamp(80px, 8vw, 150px); font-weight: 800; letter-spacing: -.08em; line-height: .85; } .ht__i h3 { font-size: 28px; letter-spacing: -.04em; }
.faq__g { display: grid; grid-template-columns: .8fr 1.2fr; gap: 6vw; }
.fq { border-top: 1px solid var(--ln); } .fq:last-child { border-bottom: 1px solid var(--ln); }
.fq summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: 50px 1fr 30px; align-items: center; gap: 10px; padding: 26px 0; font-size: clamp(20px, 1.7vw, 30px); font-weight: 650; letter-spacing: -.035em; } .fq summary::-webkit-details-marker { display: none; }
.fq summary i { position: relative; width: 22px; height: 22px; } .fq summary i::before, .fq summary i::after { content: ""; position: absolute; left: 0; right: 0; top: 10px; height: 2px; background: currentColor; transition: transform .4s var(--e); } .fq summary i::after { transform: rotate(90deg); } .fq[open] summary i::after { transform: none; }
.fq p { margin: 0 0 26px 60px; max-width: 620px; font-size: 17px; color: var(--g); }
.ar__g { display: grid; grid-template-columns: 1.5fr 1fr; gap: 6vw; } .ar__b p { font-size: clamp(20px, 1.6vw, 26px); line-height: 1.5; letter-spacing: -.02em; margin-bottom: 1.2em; } .ar__b p:first-child::first-letter { float: left; font-size: 5.2em; line-height: .8; font-weight: 800; margin: .04em .1em 0 0; }
.ar__s { display: grid; gap: 16px; align-content: start; position: sticky; top: 100px; }
.qt__g { display: grid; grid-template-columns: 1.4fr 1fr; gap: 5vw; align-items: start; }
.qt__f { display: grid; grid-template-columns: 1fr 1fr; gap: 26px 30px; } .qt__tabs, .qt__w, .qt__f .btn, .qt__ok { grid-column: 1 / -1; }
.qt__f label { display: grid; gap: 8px; } .qt__f input, .qt__f select, .qt__f textarea { width: 100%; padding: 14px 0; border: 0; border-bottom: 1.5px solid currentColor; background: transparent; font-size: 20px; outline: none; border-radius: 0; }
.qt__ok, .ft__ok { display: none; } .sent .qt__ok, .sent .ft__ok { display: block; }
.qt__side { display: grid; gap: 10px; align-content: start; position: sticky; top: 100px; } .qt__ph { aspect-ratio: 3/2; overflow: hidden; } .qt__ph img { width: 100%; height: 100%; object-fit: cover; } .qt__side > b { font-size: 34px; letter-spacing: -.05em; } .qt__side b[data-tz] { font-weight: 500; }
.nf { position: relative; height: 100vh; overflow: hidden; } .nf__img { position: absolute; inset: 0; } .nf__img img { width: 100%; height: 100%; object-fit: cover; filter: brightness(.55); }
.nf__t { position: absolute; inset: 0; display: grid; align-content: center; justify-items: start; gap: 20px; } .nf__h { font-size: clamp(64px, 9vw, 180px); font-weight: 800; letter-spacing: -.07em; line-height: .86; max-width: 12ch; }

/* ---------- footer: a jet flies across the word ---------- */
.ft { background: var(--bk); padding: clamp(80px, 9vw, 150px) 0 0; overflow: hidden; }
.ft__g { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 4vw; }
.ft__l { display: grid; gap: 20px; align-content: start; } .ft__h { font-size: clamp(26px, 2.4vw, 44px); font-weight: 750; letter-spacing: -.05em; line-height: 1.04; max-width: 18ch; }
.ft__form { display: flex; border-bottom: 1.5px solid #fff; max-width: 460px; } .ft__form input { flex: 1; background: none; border: 0; padding: 16px 0; font-size: 18px; outline: none; } .ft__form button { font-weight: 700; }
.ft__c { display: grid; gap: 10px; align-content: start; } .ft__c a { font-size: 15px; transition: opacity .3s; } .ft__c a:hover { opacity: .6; }
.ft__w { position: relative; margin-top: 70px; text-align: center; font-size: calc((min(100vw, var(--max)) - 2 * var(--pad)) / 4.15); font-weight: 900; letter-spacing: -.06em; line-height: .78; }
.ft__w span { display: block; color: transparent; -webkit-text-stroke: 1.5px rgba(255,255,255,.55); background: linear-gradient(90deg, #fff var(--fx, 0%), transparent var(--fx, 0%)); -webkit-background-clip: text; background-clip: text; }
.ft__jet { position: absolute; top: 40%; left: var(--fx, 0%); font-size: .14em; font-style: normal; transform: translate(-50%, -50%); letter-spacing: 0; }
.ft__b { display: flex; justify-content: space-between; gap: 20px; flex-wrap: wrap; padding-top: 30px; padding-bottom: 30px; color: var(--g); }

/* ---------- responsive ---------- */
@media (max-width: 1000px) {
  .nv__alt { display: none; } .nv { grid-template-columns: 1fr auto; } .nv__q { display: none; }
  .bp__pass { grid-template-columns: 1fr; } .bp__stub { display: none; } .bp__main { border-right: 0; } .bp__r { grid-template-columns: 44px auto 1fr; } .bp__s { display: none; }
  .hx__k p:last-child { display: none; } .hx__b { flex-direction: column; align-items: start; gap: 10px; } .hx__end { flex-direction: column; align-items: start; }
  .hx__w { font-size: 21vw; }
  .fp { grid-template-columns: 1fr; } .fp__map { min-height: 62vh; border-right: 0; border-bottom: 1px solid var(--ln); }
  .hg { width: 88vw; grid-template-columns: 1fr; grid-template-rows: 44% 1fr; } .hg--end { width: 70vw; }
  .cb__scale { display: none; }
  .pt__g { grid-template-columns: 1fr 1fr; gap: 40px 24px; } .pt__g--3 { grid-template-columns: 1fr 1fr; }
  .lg, .lg--b { grid-template-columns: 1fr auto; } .lg__c { grid-column: 1 / -1; grid-row: 2; } .lg__t { grid-row: 3; } .lg--b .btn { grid-column: 2; grid-row: 3; }
  .jc__g, .tt__g, .jr__g, .rr__g, .dd__g, .faq__g, .ar__g, .qt__g, .ft__g { grid-template-columns: 1fr; }
  .fl, .fl--r, .cd { grid-template-columns: 1fr; } .fl--r .fl__ph, .cd--r .cd__card { order: 0; } .fl__ph { min-height: 56vh; }
  .spec, .sf { grid-template-columns: 1fr 1fr; } .ot { grid-template-columns: 1fr; }
  .ar__s, .qt__side { position: static; } .hd { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .fp__out { grid-template-columns: 1fr 1fr; } .fp__sel { grid-template-columns: 1fr; } .fp__sw { justify-self: center; transform: rotate(90deg); }
  .qt__f { grid-template-columns: 1fr; } .cmp th, .cmp td { font-size: 13px; padding: 12px 4px; }
  .fq summary { grid-template-columns: 36px 1fr 26px; } .fq p { margin-left: 46px; }
  .ph__row { flex-direction: column; align-items: start; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; } }

/* fleet sections: full-bleed aircraft */
.fb { position: relative; min-height: 96vh; display: grid; align-items: center; overflow: hidden; color: #fff; }
.fb__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.6s var(--e); } .fb:hover .fb__bg { transform: scale(1.03); }
.fb::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(7,8,10,.85), rgba(7,8,10,.3) 45%, transparent 65%); }
.fb--r::after { background: linear-gradient(270deg, rgba(7,8,10,.85), rgba(7,8,10,.3) 45%, transparent 65%); }
.fb__b { position: relative; z-index: 1; width: min(560px, 100%); --g: #c4c7cc; --ln: rgba(255,255,255,.3); } .fb--r .fb__b { margin-left: auto; }
@media (max-width: 1000px) {
  .hx__b { flex-direction: column; align-items: start; } .hx__k p:last-child { display: none; } .hx__w { top: 16vh; }
  .hg { width: 88vw; } .hg::after { background: linear-gradient(0deg, rgba(7,8,10,.9), rgba(7,8,10,.4) 50%, transparent 75%); } .hg__b { top: auto; width: 100%; align-content: end; }
  .fb::after, .fb--r::after { background: linear-gradient(0deg, rgba(7,8,10,.9), rgba(7,8,10,.4) 55%, transparent 80%); } .fb { align-items: end; } .fb--r .fb__b { margin-left: 0; }
}
@media (min-width: 1001px) { .fb__bg { width: 74%; left: auto; right: 0; } .fb--r .fb__bg { left: 0; right: auto; } .fb { background: #0d0f12; } .fb::after { background: linear-gradient(90deg, #0d0f12 26%, rgba(13,15,18,.55) 38%, transparent 55%); } .fb--r::after { background: linear-gradient(270deg, #0d0f12 26%, rgba(13,15,18,.55) 38%, transparent 55%); } }



/* colour accents on the white hero */
.np__bub { position: absolute; z-index: 3; left: calc(var(--pad) - 1vw); top: 30vh; width: min(22vw, 36vh); aspect-ratio: 1; border-radius: 50%; overflow: hidden; transform: translate3d(var(--bx, 0), var(--by, 0), 0) scale(var(--bs, 1)); box-shadow: 0 30px 70px -20px rgba(11,26,61,.55); opacity: 0; animation: bubIn 1.4s var(--e) .6s forwards; transition: box-shadow .4s; }
.np__bub img { width: 100%; height: 100%; object-fit: cover; object-position: 38% 55%; transform: scale(1.15); transition: transform 1.2s var(--e); } .np__bub:hover img { transform: scale(1.3); }
.np__bub span { position: absolute; left: 50%; bottom: 14%; transform: translateX(-50%); white-space: nowrap; padding: 6px 10px; border-radius: 20px; background: rgba(11,26,61,.75); color: #fff; font-size: 9px; }
@keyframes bubIn { from { opacity: 0; clip-path: circle(0 at 50% 50%); } to { opacity: 1; clip-path: circle(50% at 50% 50%); } }
.np__ringph { position: absolute; inset: 22%; border-radius: 50%; background: url(../img/hero-sky.jpg) center / cover; box-shadow: inset 0 0 0 2px rgba(255,255,255,.4); }
.np__ring i { position: relative; z-index: 1; color: #fff; text-shadow: 0 2px 10px rgba(0,0,0,.5); }
@media (max-width: 1000px) { .np__bub { width: 34vw; left: auto; right: var(--pad); top: 14vh; } }