/* ============================= TOKENS ============================= */
:root{
  --ink:#0A0A0A;
  --ink-2:#111111;
  --char:#1C1C1E;
  --char-2:#242427;
  --paper:#FFFFFF;
  --paper-2:#F7F6F4;
  --paper-3:#EFEDE9;
  --line:#E6E4E0;
  --line-dark:rgba(255,255,255,.10);
  --muted:#6E6B66;
  --muted-dark:rgba(255,255,255,.52);
  --gold:#C4973A;
  --gold-soft:rgba(196,151,58,.30);
  --red:#ef4444;
  --green:#22c55e;

  --serif:'Playfair Display',Georgia,serif;
  --sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --mono-wide:'Montserrat','Inter',sans-serif;

  --nav-h:76px;
  --gut:clamp(20px,5vw,72px);
  --maxw:1360px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
}

/* ============================= RESET ============================= */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--sans);font-weight:300;font-size:16px;line-height:1.65;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}
body.no-scroll{overflow:hidden;}
img,video,svg{display:block;max-width:100%;}
button,input,select,textarea{font:inherit;color:inherit;}
button{cursor:pointer;background:none;border:0;padding:0;}
a{color:inherit;text-decoration:none;}
h1,h2,h3,h4,p{margin:0;}
::selection{background:var(--ink);color:var(--paper);}

/* ============================= TYPE SYSTEM ============================= */
.d1{font-family:var(--serif);font-weight:400;font-size:clamp(38px,6.4vw,86px);line-height:1.03;letter-spacing:-.02em;}
.d2{font-family:var(--serif);font-weight:400;font-size:clamp(30px,4.4vw,58px);line-height:1.10;letter-spacing:-.015em;}
.d3{font-family:var(--serif);font-weight:400;font-size:clamp(23px,2.6vw,34px);line-height:1.20;letter-spacing:-.01em;}
.eyebrow{
  font-size:11px;font-weight:500;letter-spacing:.32em;text-transform:uppercase;
  color:var(--muted);
}
.eyebrow.on-dark{color:rgba(255,255,255,.46);}
.eyebrow .dash{display:inline-block;width:26px;height:1px;background:var(--gold);
  vertical-align:middle;margin-right:14px;margin-bottom:3px;}
.lede{font-size:clamp(16px,1.35vw,19px);line-height:1.72;color:var(--muted);font-weight:300;max-width:56ch;}
.lede.on-dark{color:var(--muted-dark);}
.small{font-size:13.5px;line-height:1.7;color:var(--muted);}
.gold{color:var(--gold);}
em.it{font-style:italic;}

/* ============================= LAYOUT ============================= */
.wrap{max-width:var(--maxw);margin:0 auto;padding-left:var(--gut);padding-right:var(--gut);}
.sec{padding:clamp(88px,11vw,156px) 0;position:relative;}
.sec.tight{padding:clamp(64px,8vw,104px) 0;}
.sec-dark{background:var(--ink);color:var(--paper);}
.sec-char{background:var(--char);color:var(--paper);}
.sec-paper{background:var(--paper-2);}
.rule{height:1px;background:var(--line);border:0;margin:0;}
.rule.on-dark{background:var(--line-dark);}

/* ============================= REVEAL ENGINE ============================= */
[data-rv]{opacity:0;transform:translateY(26px);
  transition:opacity 1.05s var(--ease-out),transform 1.05s var(--ease-out);
  will-change:opacity,transform;}
[data-rv="fade"]{transform:none;}
[data-rv="left"]{transform:translateX(-28px);}
[data-rv="right"]{transform:translateX(28px);}
[data-rv="scale"]{transform:scale(.965);}
[data-rv].rv-in{opacity:1;transform:none;}
.rv-line{display:block;overflow:hidden;}
.rv-line > span{display:block;transform:translateY(105%);
  transition:transform 1.15s var(--ease-out);}
.rv-in .rv-line > span,.rv-line.rv-in > span{transform:none;}

/* ============================= BUTTONS ============================= */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:11px;
  height:52px;padding:0 32px;border-radius:2px;
  font-size:11.5px;font-weight:500;letter-spacing:.20em;text-transform:uppercase;
  transition:background .5s var(--ease),color .5s var(--ease),
             border-color .5s var(--ease),transform .5s var(--ease);
  border:1px solid transparent;white-space:nowrap;
}
.btn .arw{transition:transform .5s var(--ease);}
.btn:hover .arw{transform:translateX(5px);}
.btn-solid{background:var(--ink);color:var(--paper);border-color:var(--ink);}
.btn-solid:hover{background:var(--gold);border-color:var(--gold);color:#fff;}
.btn-line{border-color:var(--ink);color:var(--ink);}
.btn-line:hover{background:var(--ink);color:var(--paper);}
.btn-light{background:var(--paper);color:var(--ink);border-color:var(--paper);}
.btn-light:hover{background:transparent;color:var(--paper);}
.btn-ghost{border-color:rgba(255,255,255,.34);color:var(--paper);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);}
.btn-ghost:hover{background:var(--paper);color:var(--ink);border-color:var(--paper);}
.btn-sm{height:44px;padding:0 24px;font-size:10.5px;}
.txt-link{
  display:inline-flex;align-items:center;gap:10px;
  font-size:11.5px;font-weight:500;letter-spacing:.20em;text-transform:uppercase;
  padding-bottom:5px;border-bottom:1px solid var(--line);
  transition:border-color .5s var(--ease),color .5s var(--ease);
}
.txt-link .arw{transition:transform .5s var(--ease);}
.txt-link:hover{border-color:var(--gold);color:var(--gold);}
.txt-link:hover .arw{transform:translateX(5px);}
.txt-link.on-dark{border-color:rgba(255,255,255,.20);}

/* ============================= NAV ============================= */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:900;height:var(--nav-h);
  display:flex;align-items:center;
  transition:background .55s var(--ease),box-shadow .55s var(--ease),
             height .55s var(--ease),border-color .55s var(--ease);
  border-bottom:1px solid transparent;
}
.nav-in{width:100%;max-width:var(--maxw);margin:0 auto;
  padding:0 var(--gut);display:flex;align-items:center;gap:26px;}
.brand{display:flex;align-items:center;gap:11px;margin-right:auto;}
.brand-mark{width:19px;height:19px;flex:none;transition:transform .6s var(--ease);}
.brand:hover .brand-mark{transform:translate(3px,-3px);}
.brand-txt{font-family:var(--mono-wide);font-weight:300;font-size:14.5px;
  letter-spacing:.30em;color:var(--paper);transition:color .55s var(--ease);
  white-space:nowrap;}
.nav-links{display:flex;align-items:center;gap:2px;}
.nav-links a{
  position:relative;padding:9px 15px;font-size:11.5px;font-weight:400;
  letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.80);
  transition:color .4s var(--ease);
}
.nav-links a::after{
  content:'';position:absolute;left:15px;right:15px;bottom:2px;height:1px;
  background:var(--gold);transform:scaleX(0);transform-origin:left;
  transition:transform .55s var(--ease);
}
.nav-links a:hover{color:var(--paper);}
.nav-links a:hover::after{transform:scaleX(1);}
.nav-cta{margin-left:12px;}
.nav-burger{display:none;width:40px;height:40px;align-items:center;justify-content:center;margin-left:8px;}
.nav-burger span{display:block;width:20px;height:1px;background:var(--paper);
  position:relative;transition:background .4s var(--ease);}
.nav-burger span::before,.nav-burger span::after{
  content:'';position:absolute;left:0;width:20px;height:1px;background:inherit;
  transition:transform .45s var(--ease);}
.nav-burger span::before{top:-6px;}
.nav-burger span::after{top:6px;}

/* scrolled state */
.nav.solid{background:rgba(255,255,255,.94);
  -webkit-backdrop-filter:saturate(180%) blur(18px);backdrop-filter:saturate(180%) blur(18px);
  border-bottom-color:var(--line);height:66px;}
.nav.solid .brand-txt{color:var(--ink);}
.nav.solid .brand-mark path{fill:var(--ink);}
.nav.solid .nav-links a{color:var(--muted);}
.nav.solid .nav-links a:hover{color:var(--ink);}
.nav.solid .btn-ghost{border-color:var(--ink);color:var(--ink);}
.nav.solid .btn-ghost:hover{background:var(--ink);color:var(--paper);}
.nav.solid .nav-burger span{background:var(--ink);}
.nav.hide{transform:translateY(-100%);transition:transform .5s var(--ease),background .55s var(--ease);}

/* mobile drawer */
.drawer{
  position:fixed;inset:0;z-index:899;background:var(--ink);color:var(--paper);
  padding:calc(var(--nav-h) + 30px) var(--gut) 40px;
  display:flex;flex-direction:column;
  opacity:0;visibility:hidden;transform:translateY(-14px);
  transition:opacity .5s var(--ease),transform .5s var(--ease),visibility .5s;
}
.drawer.open{opacity:1;visibility:visible;transform:none;}
.drawer a.dl{
  font-family:var(--serif);font-size:clamp(26px,7vw,38px);font-weight:400;
  padding:13px 0;border-bottom:1px solid rgba(255,255,255,.08);
  display:flex;align-items:baseline;justify-content:space-between;
}
.drawer a.dl .dl-note{font-family:var(--sans);font-size:10.5px;letter-spacing:.18em;
  text-transform:uppercase;color:rgba(255,255,255,.38);}
.drawer-foot{margin-top:auto;padding-top:28px;display:flex;flex-direction:column;gap:12px;}

/* ============================= FOOTER ============================= */
.foot{background:var(--ink);color:var(--paper);padding:clamp(64px,8vw,104px) 0 34px;}
.foot-top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:44px;
  padding-bottom:52px;border-bottom:1px solid var(--line-dark);}
.foot h4{font-size:10.5px;font-weight:500;letter-spacing:.26em;text-transform:uppercase;
  color:rgba(255,255,255,.40);margin-bottom:20px;}
.foot ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px;}
.foot ul a{font-size:14px;color:rgba(255,255,255,.72);transition:color .4s var(--ease);}
.foot ul a:hover{color:var(--gold);}
.foot-brand .brand-txt{color:var(--paper);font-size:16px;}
.foot-bot{padding-top:26px;display:flex;flex-wrap:wrap;gap:16px;
  align-items:center;justify-content:space-between;
  font-size:12px;color:rgba(255,255,255,.34);}
.foot-bot .fb-links{display:flex;gap:22px;}
.foot-bot a:hover{color:rgba(255,255,255,.7);}

@media(max-width:980px){
  .foot-top{grid-template-columns:1fr 1fr;gap:36px;}
}
@media(max-width:900px){
  .nav-links,.nav-cta{display:none;}
  .nav-burger{display:flex;}
}
@media(max-width:560px){
  .foot-top{grid-template-columns:1fr;gap:30px;}
}

/* ============================= REDUCED MOTION ============================= */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:.001s!important;transition-duration:.001s!important;}
  [data-rv]{opacity:1!important;transform:none!important;}
  .rv-line > span{transform:none!important;}
}
/* ---------------- REQUEST FORMS ---------------- */
.req-form-wrap{background:var(--paper);padding:clamp(72px,9vw,132px) var(--gut);}
.req-form-in{max-width:760px;margin:0 auto;}
.req-form-in .eyebrow{margin-bottom:20px;}
.req-form-in .sec-h{font-family:var(--serif);font-weight:400;
  font-size:clamp(30px,4.4vw,56px);line-height:1.08;letter-spacing:-.015em;margin-bottom:14px;}
.req-form-in > p{font-size:15px;line-height:1.7;color:var(--muted);
  max-width:52ch;margin-left:auto;margin-right:auto;}

.rf-form{margin-top:clamp(32px,4vw,48px);position:relative;}
.rf-row{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:20px;}
.rf-toggle{display:inline-flex;border:1px solid var(--line);margin:0 auto 30px;
  width:fit-content;}
.rf-toggle button{padding:11px 26px;border:0;background:none;color:var(--muted);
  font-size:10.5px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;
  cursor:pointer;font-family:inherit;transition:background .45s var(--ease),color .45s var(--ease);}
.rf-toggle button.active{background:var(--ink);color:var(--paper);}
.rf-form > .rf-toggle{display:flex;}
.rf-f{display:flex;flex-direction:column;gap:9px;}
.rf-f label{font-size:9.5px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;
  color:var(--muted);}
.rf-f input,.rf-f select,.rf-f textarea{
  background:transparent;border:0;border-bottom:1px solid var(--line);
  border-radius:0;padding:9px 0;font-size:15px;color:var(--ink);font-family:inherit;
  font-weight:300;outline:none;width:100%;
  transition:border-color .45s var(--ease);}
.rf-f textarea{resize:vertical;}
.rf-f input::placeholder,.rf-f textarea::placeholder{color:#B8B4AE;}
.rf-f input:focus,.rf-f select:focus,.rf-f textarea:focus{border-bottom-color:var(--gold);}
.rf-f select{appearance:none;-webkit-appearance:none;cursor:pointer;
  background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),
                   linear-gradient(135deg,var(--muted) 50%,transparent 50%);
  background-position:calc(100% - 9px) 18px,calc(100% - 4px) 18px;
  background-size:5px 5px,5px 5px;background-repeat:no-repeat;padding-right:22px;}
.rf-full{grid-column:1/-1;}
.rf-actions{display:flex;gap:13px;margin-top:34px;flex-wrap:wrap;align-items:center;}
.rf-send{flex:1;min-width:220px;height:56px;padding:0 34px;
  background:var(--ink);color:var(--paper);border:1px solid var(--ink);border-radius:2px;
  font-size:11.5px;font-weight:500;letter-spacing:.20em;text-transform:uppercase;
  font-family:inherit;cursor:pointer;
  transition:background .5s var(--ease),color .5s var(--ease),border-color .5s var(--ease);}
.rf-send:hover{background:var(--gold);border-color:var(--gold);color:#fff;}
.rf-send:disabled{opacity:.55;cursor:default;}
.rf-alt{height:56px;padding:0 26px;background:none;border:1px solid var(--line);
  border-radius:2px;font-size:11.5px;font-weight:500;letter-spacing:.20em;
  text-transform:uppercase;font-family:inherit;cursor:pointer;color:var(--muted);
  transition:border-color .5s var(--ease),color .5s var(--ease);white-space:nowrap;}
.rf-alt:hover{border-color:var(--ink);color:var(--ink);}
.rf-ok{display:none;text-align:center;padding:30px 0 0;font-size:14.5px;
  line-height:1.7;color:var(--muted);}

/* dark variant (Buy a Jet) */
.req-form-wrap.dark{background:var(--ink);color:var(--paper);}
.req-form-wrap.dark .req-form-in > p{color:var(--muted-dark);}
.req-form-wrap.dark .rf-f label{color:rgba(255,255,255,.42)!important;}
.req-form-wrap.dark .rf-f input,
.req-form-wrap.dark .rf-f select,
.req-form-wrap.dark .rf-f textarea{color:var(--paper);border-bottom-color:var(--line-dark);}
.req-form-wrap.dark .rf-f input::placeholder,
.req-form-wrap.dark .rf-f textarea::placeholder{color:rgba(255,255,255,.28);}
.req-form-wrap.dark .rf-f select option{color:var(--ink);}
.req-form-wrap.dark .rf-f input:focus,
.req-form-wrap.dark .rf-f select:focus,
.req-form-wrap.dark .rf-f textarea:focus{border-bottom-color:var(--gold);}
.req-form-wrap.dark .rf-send{background:var(--paper)!important;color:var(--ink)!important;
  border-color:var(--paper);}
.req-form-wrap.dark .rf-send:hover{background:var(--gold)!important;
  border-color:var(--gold);color:#fff!important;}
.req-form-wrap.dark .rf-ok{color:var(--muted-dark);}

/* ---------------- MODALS ---------------- */
#memAppModal,#contactModal{display:none;position:fixed;inset:0;z-index:9000;
  background:rgba(8,8,8,.72);-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);
  overflow-y:auto;padding:24px;}
.mam-box{background:var(--paper);border-radius:3px;padding:clamp(28px,3.6vw,42px);
  max-width:520px;margin:56px auto;color:var(--ink);
  box-shadow:0 40px 100px rgba(0,0,0,.42);
  animation:mamIn .55s cubic-bezier(.16,1,.3,1) both;}
@keyframes mamIn{from{opacity:0;transform:translateY(22px) scale(.985);}to{opacity:1;transform:none;}}
.mam-hdr{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:10px;}
.mam-ttl{font-family:var(--serif);font-size:29px;font-weight:400;letter-spacing:-.015em;
  line-height:1.15;}
.mam-cls{background:none;border:0;font-size:26px;color:var(--muted);cursor:pointer;
  line-height:1;padding:0 0 0 16px;font-family:inherit;
  transition:color .4s var(--ease);}
.mam-cls:hover{color:var(--ink);}
.mam-sub{font-size:13.5px;color:var(--muted);line-height:1.72;margin-bottom:30px;}
.mam-f{margin-bottom:18px;display:flex;flex-direction:column;gap:8px;}
.mam-f label{font-size:9.5px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;
  color:var(--muted);}
.mam-f input,.mam-f select,.mam-f textarea{
  background:transparent;border:0;border-bottom:1px solid var(--line);border-radius:0;
  padding:9px 0;font-size:15px;font-weight:300;color:var(--ink);font-family:inherit;
  outline:none;width:100%;transition:border-color .45s var(--ease);}
.mam-f textarea{resize:vertical;}
.mam-f input::placeholder,.mam-f textarea::placeholder{color:#B8B4AE;}
.mam-f input:focus,.mam-f select:focus,.mam-f textarea:focus{border-bottom-color:var(--gold);}
.mam-f select{appearance:none;-webkit-appearance:none;cursor:pointer;
  background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),
                   linear-gradient(135deg,var(--muted) 50%,transparent 50%);
  background-position:calc(100% - 9px) 18px,calc(100% - 4px) 18px;
  background-size:5px 5px,5px 5px;background-repeat:no-repeat;padding-right:22px;}
.mam-submit{width:100%;height:54px;background:var(--ink);color:var(--paper);
  border:1px solid var(--ink);border-radius:2px;
  font-size:11.5px;font-weight:500;letter-spacing:.20em;text-transform:uppercase;
  font-family:inherit;cursor:pointer;margin-top:18px;
  transition:background .5s var(--ease),border-color .5s var(--ease),color .5s var(--ease);}
.mam-submit:hover{background:var(--gold);border-color:var(--gold);color:#fff;}
.mam-submit:disabled{opacity:.55;cursor:default;}
.mam-success{display:none;text-align:center;padding:34px 0;}
.mam-success-ico{margin-bottom:18px;line-height:0;display:flex;justify-content:center;}
.mam-success-ico svg{width:52px;height:52px;stroke:var(--gold);fill:none;
  stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round;}

/* ---------------- TOAST ---------------- */
#toast{position:fixed;bottom:30px;left:50%;transform:translate(-50%,10px);
  background:var(--ink);color:var(--paper);padding:14px 26px;border-radius:2px;
  font-size:11.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;
  z-index:9999;opacity:0;pointer-events:none;white-space:nowrap;
  box-shadow:0 18px 46px rgba(0,0,0,.34);
  transition:opacity .4s var(--ease),transform .4s var(--ease);}
#toast.on{opacity:1;transform:translate(-50%,0);}

@media(max-width:640px){
  .rf-row{grid-template-columns:1fr;}
  .rf-actions{flex-direction:column;align-items:stretch;}
  .rf-alt{width:100%;}
  .mam-box{margin:24px auto;}
}

/* ===================== NAV — CENTRED WORDMARK =====================
   Three tracks. minmax(0,1fr) on the outer two is what actually centres the
   wordmark: a plain 1fr floors at min-content, so the heavier right-hand
   group (links + phone + button) would widen its track and shove the brand
   left. Columns are also assigned explicitly, because hiding the link groups
   on mobile with display:none takes them out of grid flow and the brand would
   otherwise fall back into column 1 instead of staying over the burger. */
/* The wordmark is centred on the BAR, not on a grid track. A symmetric
   three-column grid only centres it when both sides weigh the same, and they
   do not: the right side carries two link groups plus the phone number plus
   the CTA (~590px) against ~225px on the left, so an equal 1fr track overflows
   on the right and the groups ran into the wordmark. Taking the brand out of
   flow lets each side size to its own content while the mark stays on the true
   centre line. */
.nav-in{display:flex;align-items:center;justify-content:space-between;
  gap:20px;position:relative;}
/* Scoped to .nav-in. A bare `.brand` also matches the footer wordmark, and
   because the footer's copy then became absolutely positioned with no
   positioned ancestor of its own it escaped its container and rendered in the
   middle of the hero. */
.nav-in .brand{margin-right:0;position:absolute;left:50%;top:50%;
  transform:translate(-50%,-50%);pointer-events:auto;}
.nav-l{display:flex;align-items:center;justify-content:flex-start;gap:14px;
  margin-left:-15px;}
.nav-r{display:flex;align-items:center;justify-content:flex-end;gap:14px;}
/* Neither side may grow past the point where it would reach the wordmark. */
.nav-l,.nav-r{max-width:calc(50% - 110px);}
.nav-side{flex-wrap:nowrap;}
.nav-side a{white-space:nowrap;}
.nav-tel{font-size:11.5px;letter-spacing:.13em;color:rgba(255,255,255,.72);
  white-space:nowrap;transition:color .4s var(--ease);}
.nav-tel:hover{color:var(--paper);}
.nav.solid .nav-tel{color:var(--muted);}
.nav.solid .nav-tel:hover{color:var(--ink);}
.drawer-tel{font-size:12px;letter-spacing:.16em;color:rgba(255,255,255,.52);
  margin-bottom:4px;}
@media(max-width:1180px){
  .nav-side a{padding:9px 11px;letter-spacing:.12em;}
  .nav-side a::after{left:11px;right:11px;}
  .nav-r{gap:10px;}
}
@media(max-width:1280px){
  .nav-side a{padding:9px 10px;letter-spacing:.10em;font-size:11px;}
  .nav-side a::after{left:10px;right:10px;}
}
@media(max-width:1180px){ .nav-tel{display:none;} }
/* Between 1180 and the burger breakpoint the two link groups plus the CTA no
   longer clear the wordmark on their own. Because .nav-r is capped at half the
   bar minus the mark, anything wider than that cap overflows to the LEFT (flex
   overflows past the start edge under justify-content:flex-end) and lands on
   top of the wordmark. So the content is tightened rather than clipped. */
@media(max-width:1180px){
  .nav-side a{padding:9px 7px;letter-spacing:.07em;font-size:10.5px;}
  .nav-side a::after{left:7px;right:7px;}
  .nav-r{gap:8px;}
  .nav-cta{margin-left:4px;padding:0 15px;font-size:9.5px;letter-spacing:.13em;}
}
/* 960, not 900: below ~960 the two link groups can no longer clear the
   wordmark even at the tightened sizing above, so the burger takes over one
   step earlier rather than shipping a nav that collides on small laptops. */
@media(max-width:960px){
  .nav-side,.nav-tel{display:none;}
  /* Stay absolutely centred here too. Letting the brand back into flow puts it
     midway between an empty left side and the burger, which reads ~24px left
     of the true centre — visible against a full-bleed hero. */
  .nav-in{gap:0;}
  .nav-l,.nav-r{max-width:none;}
}
/* The drawer now carries every destination, so it has to scroll on short
   handsets rather than pushing the call-to-action off the bottom. */
.drawer{overflow-y:auto;-webkit-overflow-scrolling:touch;}
.drawer a.dl{font-size:clamp(19px,4.4vw,25px);padding:8px 0;}
.dgh{margin:22px 0 6px;font-size:10px;letter-spacing:.26em;text-transform:uppercase;
  color:rgba(255,255,255,.38);}
.dgh:first-child{margin-top:0;}

/* ===================== NAV DROPDOWNS =====================
   Four top-level groups instead of nine flat links. Opening is driven by
   :hover and :focus-within so it works with a mouse and with a keyboard
   without any script; the pointer:coarse block below swaps to a tap toggle,
   because on a touch device :hover latches after the first tap and the group
   would open and immediately navigate. */
.nvg{position:relative;}
.nvm{position:absolute;top:100%;left:-14px;z-index:60;
  /* the padding is a deliberate bridge: without it the pointer crosses a dead
     gap between the trigger and the panel and the menu closes mid-travel */
  padding-top:10px;opacity:0;visibility:hidden;transform:translateY(-6px);
  pointer-events:none;transition:opacity .26s var(--ease),
  transform .26s var(--ease),visibility .26s;}
.nvm-r{left:auto;right:-14px;}
.nvg:hover .nvm,.nvg:focus-within .nvm,.nvg.open .nvm{
  opacity:1;visibility:visible;transform:none;pointer-events:auto;}
.nvm-in{min-width:274px;background:#FFFFFF;border:1px solid var(--line);
  border-radius:18px;padding:10px;
  box-shadow:0 30px 70px -34px rgba(10,10,12,.40);}
.nvm-in a{display:block;padding:11px 14px;border-radius:12px;
  font-size:13.5px;letter-spacing:0;text-transform:none;font-weight:500;
  color:var(--ink);white-space:nowrap;
  transition:background .24s var(--ease);}
.nvm-in a::after{display:none;}
.nvm-in a:hover{background:var(--paper-2);color:var(--ink);}
.nvm-in a em{display:block;margin-top:3px;font-style:normal;font-size:11.5px;
  font-weight:300;letter-spacing:0;text-transform:none;color:var(--muted);}
.nav-side a[aria-haspopup]::before{content:"";display:inline-block;
  width:5px;height:5px;margin:0 0 2px 7px;vertical-align:middle;
  border-right:1.4px solid currentColor;border-bottom:1.4px solid currentColor;
  transform:rotate(45deg) translateY(-1px);opacity:.55;
  transition:transform .3s var(--ease);}
.nvg:hover a[aria-haspopup]::before,.nvg.open a[aria-haspopup]::before{
  transform:rotate(225deg) translateY(-3px);}
@media(hover:none){
  .nvg:hover .nvm{opacity:0;visibility:hidden;pointer-events:none;}
  .nvg.open .nvm{opacity:1;visibility:visible;pointer-events:auto;}
}
/* aria-current is white so it reads on the transparent nav over the hero;
   once the nav goes solid the page is white behind it and it has to flip */
.nav.solid .nav-links a[aria-current="page"]{color:var(--ink);}

/* ===================== INTERIOR PAGE HERO ===================== */
.phero{position:relative;min-height:clamp(380px,54vh,560px);display:flex;align-items:flex-end;
  overflow:hidden;background:var(--ink);color:var(--paper);
  padding:calc(var(--nav-h) + 40px) 0 clamp(44px,6vw,76px);}
.phero-bg{position:absolute;inset:0;}
.phero-bg img{width:100%;height:100%;object-fit:cover;transform:scale(1.05);}
.phero-veil{position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.62) 0%,rgba(0,0,0,.28) 42%,rgba(0,0,0,.80) 100%);}
.phero-in{position:relative;width:100%;max-width:var(--maxw);margin:0 auto;padding:0 var(--gut);}
.phero-eye{font-size:11px;letter-spacing:.30em;text-transform:uppercase;
  color:rgba(255,255,255,.50);font-weight:400;}
.phero-h{font-family:var(--serif);font-weight:400;font-size:clamp(40px,6.2vw,82px);
  line-height:1.02;letter-spacing:-.015em;margin:12px 0 16px;}
.phero-sub{max-width:54ch;color:rgba(255,255,255,.60);font-weight:300;
  font-size:clamp(15px,1.1vw,17px);line-height:1.65;}
.nav-links a[aria-current="page"]{color:var(--paper);}
.nav-links a[aria-current="page"]::after{transform:scaleX(1);}

/* ===================== EXPLORE GRID (home) ===================== */
/* The hairlines are the container background showing through a 1px gap, so an
   incomplete final row renders as a grey block rather than empty space. Ten
   destinations therefore get explicit column counts that divide ten — 5, 2,
   1 — instead of auto-fit, which lands on 4 at desktop and leaves the hole. */
.xg{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;
  background:var(--line);border:1px solid var(--line);margin-top:clamp(36px,4vw,56px);}
@media(max-width:1240px){ .xg{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media(max-width:620px){ .xg{grid-template-columns:1fr;} }
.xg a{background:var(--paper);padding:clamp(22px,2vw,30px);text-decoration:none;color:inherit;
  display:flex;flex-direction:column;gap:8px;transition:background .5s var(--ease);}
.xg a:hover{background:var(--paper-2);}
.xg-n{font-size:10.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--muted);}
.xg-t{font-family:var(--serif);font-size:clamp(21px,1.8vw,27px);font-weight:400;}
.xg-d{font-size:13.5px;color:var(--muted);line-height:1.6;font-weight:300;}
.xg-go{margin-top:6px;font-size:12px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink);opacity:.55;transition:opacity .4s var(--ease);}
.xg a:hover .xg-go{opacity:1;}

/* ===================== EMPTY LEGS ===================== */

/* ===================== LEADERSHIP ===================== */
.team{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));
  gap:clamp(20px,2.4vw,34px);margin-top:clamp(34px,4vw,52px);}
.tm-ph{aspect-ratio:4/5;background:var(--paper-3);overflow:hidden;position:relative;}
.tm-ph img{width:100%;height:100%;object-fit:cover;
  transition:transform 1.1s var(--ease-out);filter:grayscale(1) contrast(1.03);}
.tm:hover .tm-ph img{transform:scale(1.045);}
.tm-ph.blank::after{content:'';position:absolute;inset:0;
  background:linear-gradient(155deg,#1b1b1b 0%,#0b0b0b 100%);}
.tm-n{font-family:var(--serif);font-size:clamp(18px,1.5vw,22px);margin-top:16px;}
.tm-r{font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-top:6px;}
.tm-b{font-size:13.5px;color:var(--muted);line-height:1.65;margin-top:10px;font-weight:300;}

/* ===================== AIRCRAFT HUB =====================
   Deliberately not a card grid. Each category is a full-bleed editorial band
   with the photograph on one side and the fleet as spec rows on the other,
   alternating sides down the page so the eye has somewhere to travel. */
.ac-tabs{position:sticky;top:var(--navh,64px);z-index:40;
  background:rgba(255,255,255,.86);backdrop-filter:saturate(160%) blur(16px);
  -webkit-backdrop-filter:saturate(140%) blur(14px);
  border-bottom:1px solid var(--line);}
.ac-tw{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;
  -webkit-overflow-scrolling:touch;}
.ac-tw::-webkit-scrollbar{display:none;}
.ac-tabs a{flex:0 0 auto;padding:16px 16px 14px;font-size:10.5px;
  letter-spacing:.19em;text-transform:uppercase;color:var(--muted);
  text-decoration:none;white-space:nowrap;border-bottom:1px solid transparent;
  transition:color .35s var(--ease),border-color .35s var(--ease);}
.ac-tabs a:hover{color:var(--fg);border-bottom-color:var(--gold);}

.ac-cat{padding:clamp(60px,7vw,104px) 0;border-bottom:1px solid var(--line);
  scroll-margin-top:120px;}
/* keyed off .alt, not :nth-child — the categories share <main> with the hero,
   the tab bar and the footnote, so child parity does not track category parity */
.ac-cat.alt{background:var(--surface-2);}
.ac-in{display:grid;grid-template-columns:minmax(0,0.86fr) minmax(0,1.14fr);
  gap:clamp(30px,4.4vw,72px);align-items:start;}
/* Mirroring the block has to mirror the track widths too, or the alternating
   rows hand the narrow track to the text and the five spec chips wrap. */
.ac-cat.alt .ac-in{grid-template-columns:minmax(0,1.14fr) minmax(0,0.86fr);}
.ac-cat.alt .ac-media{order:2;}
.ac-media{position:relative;overflow:hidden;aspect-ratio:4/5;
  background:var(--surface-3);}
.ac-media img{width:100%;height:100%;object-fit:cover;display:block;
  transition:transform 1.2s var(--ease);}
.ac-media:hover img{transform:scale(1.03);}
.ac-n{font-family:var(--serif);font-size:13px;letter-spacing:.2em;
  color:var(--gold);margin-bottom:14px;}
.ac-h{font-family:var(--serif);font-weight:600;line-height:1.04;
  font-size:clamp(30px,3.5vw,48px);letter-spacing:-.032em;}
.ac-d{color:var(--muted);font-weight:300;line-height:1.72;max-width:46ch;
  margin-top:16px;font-size:15px;}
.ac-rows{margin-top:clamp(26px,3vw,40px);border-top:1px solid var(--line);}
.ac-row{padding:20px 0;border-bottom:1px solid var(--line);}
.ac-id{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;}
.ac-mk{font-size:10px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--gold);}
.ac-md{font-family:var(--serif);font-size:clamp(19px,1.9vw,24px);
  font-weight:600;letter-spacing:-.024em;}
/* auto-fit rather than a fixed count: five chips sit in one line on a wide
   screen and reflow to two or three without a breakpoint for every step */
.ac-specs{margin-top:14px;display:grid;gap:10px 18px;
  grid-template-columns:repeat(auto-fit,minmax(96px,1fr));}
.ac-s{display:flex;flex-direction:column;gap:3px;}
.ac-sv{font-size:14.5px;font-weight:400;letter-spacing:.01em;}
.ac-sl{font-size:9.5px;letter-spacing:.17em;text-transform:uppercase;
  color:var(--muted);}
.ac-cta{margin-top:clamp(24px,2.6vw,34px);}
.ac-note{text-align:center;}
.ac-note p{color:var(--muted);font-weight:300;font-size:14px;line-height:1.75;
  max-width:62ch;margin:0 auto;}
.ac-note p+p{margin-top:18px;}
.ac-link{color:var(--gold);text-decoration:none;
  border-bottom:1px solid var(--gold-soft);padding-bottom:2px;
  transition:border-color .4s var(--ease);}
.ac-link:hover{border-bottom-color:var(--gold);}
@media(max-width:900px){
  .ac-in,.ac-cat.alt .ac-in{grid-template-columns:1fr;gap:26px;}
  .ac-cat.alt .ac-media{order:0;}
  .ac-media{aspect-ratio:16/10;}
}

/* ===================== WHY DANIAL ===================== */
/* Principles. minmax(0,1fr) rather than 1fr: a plain 1fr track floors at
   min-content, so the longest headline would silently widen its column and
   break the rhythm across the row. */
.wx{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr));
  gap:1px;background:var(--line);border:1px solid var(--line);
  border-radius:var(--r);overflow:hidden;margin-top:clamp(36px,4vw,54px);}
.wx-i{background:var(--surface);padding:clamp(26px,2.8vw,36px);
  transition:background .4s var(--ease);}
.wx-i:hover{background:var(--surface-2);}
.wx-n{display:block;font-size:11px;letter-spacing:.2em;color:var(--gold);
  margin-bottom:16px;font-weight:500;}
.wx-i h3{font-size:clamp(17px,1.7vw,20px);font-weight:600;letter-spacing:-.022em;
  line-height:1.28;margin-bottom:11px;}
.wx-i p{color:var(--muted);font-size:14px;line-height:1.72;}

/* Steps. The number is a fixed 44px column so every step's copy starts on the
   same left edge no matter how tall the block above it is. */
.wh{list-style:none;counter-reset:none;margin-top:clamp(36px,4vw,54px);
  display:grid;gap:0;max-width:820px;}
.wh li{display:grid;grid-template-columns:44px minmax(0,1fr);
  gap:clamp(18px,2.4vw,30px);padding:clamp(24px,2.8vw,34px) 0;
  border-top:1px solid var(--line);}
.wh li:last-child{border-bottom:1px solid var(--line);}
.wh-n{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;
  background:#0A0A0A;color:#fff;font-size:14px;font-weight:500;line-height:1;}
.wh li h3{font-size:clamp(18px,2vw,23px);font-weight:600;letter-spacing:-.026em;
  margin-bottom:9px;}
.wh li p{color:var(--muted);font-size:14.5px;line-height:1.75;max-width:56ch;}
.wh-t{display:inline-block;margin-top:13px;font-style:normal;font-size:10.5px;
  letter-spacing:.17em;text-transform:uppercase;color:var(--gold);
  font-weight:500;}

/* ===================== THE APP ===================== */
.ap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.78fr);
  gap:clamp(36px,5vw,90px);align-items:center;}
.ap-list{list-style:none;margin-top:clamp(26px,3vw,36px);}
.ap-list li{padding:14px 0;border-top:1px solid var(--line);}
.ap-list li:last-child{border-bottom:1px solid var(--line);}
.ap-list b{display:block;font-weight:500;font-size:15px;letter-spacing:-.014em;}
.ap-list span{display:block;margin-top:4px;color:var(--muted);font-size:13.5px;
  line-height:1.6;}
.ap-cta{display:inline-flex;align-items:center;gap:12px;margin-top:clamp(26px,3vw,34px);
  padding:12px 24px 12px 20px;border-radius:999px;background:#0A0A0A;color:#fff;
  text-decoration:none;transition:transform .35s var(--ease),
    box-shadow .35s var(--ease);}
.ap-cta:hover{transform:translateY(-2px);
  box-shadow:0 20px 40px -22px rgba(10,10,12,.6);}
.ap-cta span{display:block;line-height:1.15;}
.ap-cta em{display:block;font-style:normal;font-size:9.5px;letter-spacing:.13em;
  text-transform:uppercase;color:rgba(255,255,255,.62);}
.ap-cta b{display:block;font-size:16px;font-weight:500;letter-spacing:-.014em;}
.ap-note{margin-top:16px;color:var(--muted);font-size:12.5px;line-height:1.7;
  max-width:42ch;}
.ap-note b{color:var(--fg);font-weight:500;}

/* The two screenshots. The back one is rotated and pushed down-left so the
   pair overlaps into a single object; the phone bezel is already in the
   image, so the frame here is only a shadow and a matching corner radius.
   aspect-ratio on the figure means the reserved space is correct before the
   images decode, so the section does not jump on load. */
.ap-shots{position:relative;justify-self:center;width:min(100%,340px);
  aspect-ratio:340/540;}
.ap-shot{position:absolute;border-radius:26px;overflow:hidden;
  background:#000;transition:transform .6s var(--ease);}
.ap-shot img{display:block;width:100%;height:auto;}
.ap-shot-a{width:62%;left:0;top:0;z-index:2;transform:rotate(-3deg);
  box-shadow:0 40px 70px -34px rgba(10,10,12,.55),
    0 0 0 1px rgba(10,10,12,.09);}
.ap-shot-b{width:58%;right:0;top:16%;z-index:1;transform:rotate(4deg);
  box-shadow:0 34px 60px -34px rgba(10,10,12,.42),
    0 0 0 1px rgba(10,10,12,.07);}
.ap-shots:hover .ap-shot-a{transform:rotate(-4deg) translateY(-6px);}
.ap-shots:hover .ap-shot-b{transform:rotate(5deg) translateY(4px);}
@media(prefers-reduced-motion:reduce){
  .ap-shots:hover .ap-shot-a,.ap-shots:hover .ap-shot-b{transform:none;}
}
@media(max-width:900px){
  .ap{grid-template-columns:1fr;}
  .ap-shots{order:-1;width:min(100%,320px);}
}
@media(max-width:560px){
  .wh li{grid-template-columns:1fr;gap:14px;}
}

/* ===================== RANGE EXPLORER ===================== */
.rx-lead{color:var(--muted);line-height:1.75;max-width:60ch;
  margin-top:18px;font-size:15.5px;}

/* Controls. The swap button sits between the two fields as its own grid
   column so it stays on the axis between them; below 720px the grid folds to
   one column and the button rotates a quarter turn to keep pointing at the
   two fields it swaps. */
.rx-ctl{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  align-items:end;gap:14px;margin-top:clamp(28px,3.4vw,42px);max-width:820px;}
.rx-f{display:flex;flex-direction:column;gap:9px;min-width:0;}
.rx-f label{font-size:10px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--muted);font-weight:500;}
.rx-f label em{font-style:normal;letter-spacing:.14em;opacity:.6;
  text-transform:none;font-size:10.5px;}
.rx-ac{position:relative;}
.rx-ac input{width:100%;box-sizing:border-box;background:var(--surface);
  color:var(--fg);border:1px solid var(--line);border-radius:var(--r-sm);
  padding:15px 40px 15px 16px;font:inherit;font-size:15px;
  transition:border-color .3s var(--ease),box-shadow .3s var(--ease);}
.rx-ac input::placeholder{color:#A3A3AC;}
.rx-ac input:hover{border-color:#D0D0D8;}
.rx-ac input:focus{outline:none;border-color:#0A0A0A;
  box-shadow:0 0 0 3px rgba(10,10,12,.07);}
.rx-x{position:absolute;top:50%;right:8px;transform:translateY(-50%);
  width:26px;height:26px;display:none;place-items:center;border:0;padding:0;
  border-radius:50%;background:var(--surface-3);color:#55555E;
  font-size:15px;line-height:1;cursor:pointer;
  transition:background .25s var(--ease),color .25s var(--ease);}
.rx-x.on{display:grid;}
.rx-x:hover{background:#0A0A0A;color:#fff;}
.rx-swap{width:44px;height:48px;flex:none;border:1px solid var(--line);
  border-radius:999px;background:var(--surface);color:var(--fg);
  font-size:17px;line-height:1;cursor:pointer;
  transition:background .3s var(--ease),color .3s var(--ease),
    border-color .3s var(--ease);}
.rx-swap:hover{background:#0A0A0A;color:#fff;border-color:#0A0A0A;}

/* Suggestions. Anchored to .rx-ac rather than the field itself so the panel
   still lines up once the clear button changes the input's padding. */
.rx-sug{position:absolute;z-index:40;top:calc(100% + 8px);left:0;right:0;
  list-style:none;margin:0;padding:6px;max-height:290px;overflow-y:auto;
  background:var(--surface);border:1px solid var(--line);border-radius:16px;
  box-shadow:0 30px 60px -34px rgba(10,10,12,.42);display:none;}
.rx-sug.on{display:block;}
.rx-sug li{display:grid;grid-template-columns:minmax(0,1fr) auto;
  align-items:baseline;gap:4px 12px;padding:10px 12px;border-radius:11px;
  cursor:pointer;transition:background .16s var(--ease);}
.rx-sug li b{font-weight:500;font-size:14.5px;letter-spacing:-.012em;}
.rx-sug li span{grid-column:1;font-size:12px;color:var(--muted);}
.rx-sug li i{grid-row:1/3;grid-column:2;font-style:normal;font-size:11px;
  letter-spacing:.09em;color:var(--muted);white-space:nowrap;}
.rx-sug li:hover,.rx-sug li.sel{background:var(--surface-2);}

/* Category strip. Horizontally scrollable on handsets instead of wrapping to
   three ragged rows. */
.rx-cats{display:flex;gap:8px;margin-top:clamp(22px,2.6vw,32px);
  overflow-x:auto;padding-bottom:4px;scrollbar-width:none;}
.rx-cats::-webkit-scrollbar{display:none;}
.rx-cat{flex:none;display:flex;flex-direction:column;gap:3px;text-align:left;
  padding:11px 17px;border:1px solid var(--line);border-radius:999px;
  background:var(--surface);color:var(--fg);cursor:pointer;font:inherit;
  transition:background .3s var(--ease),color .3s var(--ease),
    border-color .3s var(--ease);}
.rx-cat b{font-weight:500;font-size:13.5px;letter-spacing:-.01em;}
.rx-cat em{font-style:normal;font-size:11px;letter-spacing:.06em;
  color:var(--muted);transition:color .3s var(--ease);}
.rx-cat:hover{border-color:#C9C9D2;}
.rx-cat.on{background:#0A0A0A;color:#fff;border-color:#0A0A0A;}
.rx-cat.on em{color:rgba(255,255,255,.62);}

.rx-stage{position:relative;margin-top:clamp(24px,3vw,36px);
  border:1px solid var(--line);background:var(--surface-2);
  padding:clamp(10px,1.4vw,20px);}
#rxMap{width:100%;height:auto;display:block;}
.rx-cap{margin:10px 4px 2px;font-size:12.5px;color:var(--muted);
  line-height:1.6;}

/* Route summary */
.rx-sum{display:grid;grid-template-columns:minmax(0,1fr) auto;
  align-items:center;gap:22px 40px;margin-top:clamp(22px,2.6vw,32px);
  padding:22px clamp(18px,2.4vw,30px);background:var(--surface-2);
  border:1px solid var(--line);border-radius:var(--r);}
.rx-sum[hidden]{display:none;}
.rx-leg{display:flex;align-items:center;gap:14px;}
.rx-leg b{font-weight:600;font-size:clamp(19px,2.4vw,27px);
  letter-spacing:-.028em;}
.rx-leg i{flex:1;min-width:34px;height:1px;background:var(--line);
  position:relative;}
.rx-leg i::after{content:'';position:absolute;right:0;top:-2.5px;
  border-left:6px solid #B9B9C2;border-top:3px solid transparent;
  border-bottom:3px solid transparent;}
.rx-legc{margin-top:7px;font-size:13px;color:var(--muted);}
.rx-figs{display:flex;gap:clamp(24px,3vw,44px);}
.rx-fig span{display:block;font-weight:600;font-size:clamp(24px,3vw,34px);
  letter-spacing:-.03em;line-height:1;}
.rx-fig em{display:block;margin-top:7px;font-style:normal;font-size:10px;
  letter-spacing:.18em;text-transform:uppercase;color:var(--muted);}

/* Verdict table */
.rx-tbl-wrap{margin-top:clamp(26px,3vw,38px);overflow-x:auto;}
.rx-tbl{width:100%;border-collapse:collapse;font-size:14px;min-width:540px;}
.rx-tbl caption{text-align:left;font-size:10px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--muted);padding-bottom:12px;
  font-weight:500;}
.rx-tbl th{text-align:left;font-weight:500;font-size:10px;letter-spacing:.15em;
  text-transform:uppercase;color:var(--muted);padding:0 16px 11px 0;
  border-bottom:1px solid var(--line);}
.rx-tbl td{padding:14px 16px 14px 0;border-bottom:1px solid var(--line);
  color:var(--muted);}
.rx-tbl .rx-c{color:var(--fg);font-weight:500;}
.rx-tbl .rx-n{white-space:nowrap;}
.rx-tbl tr.on td{background:var(--surface-2);}
.rx-tbl tr.on .rx-c{box-shadow:inset 2px 0 0 #0A0A0A;padding-left:12px;}
.rx-tbl .rx-v{color:var(--fg);}
/* The verdict cell is a headline plus a qualifier. They are two elements so
   they need the gap declared; without it "60" and "of 134 airports" run
   together into one unreadable token. */
.rx-tbl .rx-v span{font-weight:500;}
.rx-tbl .rx-v span.no{color:var(--muted);}
.rx-tbl .rx-v em{font-style:normal;color:var(--muted);margin-left:9px;
  font-size:12.5px;}
.rx-empty-row{color:var(--muted);}

.rx-lists{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(28px,3.6vw,56px);margin-top:clamp(30px,3.6vw,46px);
  align-items:start;}
.rx-rh{font-size:10px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--fg);margin-bottom:12px;font-weight:500;}
.rx-rh2{color:var(--muted);}
.rx-list{list-style:none;display:grid;
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:0 26px;}
.rx-list li{display:flex;justify-content:space-between;align-items:baseline;
  gap:14px;padding:9px 0;border-bottom:1px solid var(--line);font-size:13.5px;}
.rx-list li em{font-style:normal;font-size:11px;letter-spacing:.06em;
  color:var(--muted);white-space:nowrap;}
.rx-list-out li{color:var(--muted);}
.rx-empty,.rx-more{border-bottom:none!important;color:var(--muted);}
.rx-foot{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;
  gap:26px;margin-top:clamp(28px,3vw,40px);padding-top:22px;
  border-top:1px solid var(--line);}
.rx-note{color:var(--muted);font-size:12.5px;line-height:1.7;max-width:62ch;}
@media(max-width:820px){
  .rx-lists{grid-template-columns:1fr;}
  .rx-sum{grid-template-columns:1fr;}
}
@media(max-width:720px){
  .rx-ctl{grid-template-columns:1fr;}
  .rx-swap{justify-self:start;transform:rotate(90deg);width:48px;height:40px;}
}

/* ===================== MODERN LIGHT =====================
   The source design is editorial: cream paper, hairline rules, Playfair
   headlines, square corners. The reference Eliot is working from reads as
   modern instead — near-white surfaces, generously rounded cards, tight
   heavy sans headlines, pill buttons. Everything below is that shift, and
   only that shift; the layout and copy are untouched. */
:root{
  /* Off-white rather than pure white for the page, so a white card has
     something to sit on. --paper stays #FFF: it also means "text on a dark
     panel", and the Jet Card, footer and map still rely on that. */
  --paper-2:#F5F5F7;
  --paper-3:#ECECEF;
  --line:#E4E4E8;
  --muted:#66666E;
  --fg:#0A0A0A;
  --surface:#FFFFFF;
  --surface-2:#F5F5F7;
  --surface-3:#ECECEF;
  /* One display family, not two. The serif was the single loudest signal of
     "editorial", so --serif is repointed rather than chased selector by
     selector — every .d1/.d2/.d3 and every accent italic follows it. */
  --serif:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --r:22px;                 /* cards and media wells */
  --r-sm:14px;              /* inputs and small tiles */
  /* --gold (#C4973A) was chosen against black, where it clears AA easily. On
     paper it measures 2.68:1, so every gold eyebrow and label on this site was
     failing WCAG AA for small text. --gold stays as-is because it is also the
     hover fill, the rule colour and the map's "in range" signal, none of which
     are text; --gold-ink is the darker cousin used wherever gold is the
     foreground of actual words. 4.95:1 on white. */
  --gold-ink:#8F6A17;
}
html{background:var(--surface);}
/* The page hero images are deliberately oversized so they can drift, and on a
   375px viewport that leaks a few pixels of sideways scroll. Clipped at the
   hero itself rather than on <html>: any overflow on the root element
   propagates to the viewport, which makes the root a scroll container and
   breaks position:sticky on the aircraft tab bar. */
.phero,.hero{overflow:hidden;}
/* The reveal engine parks [data-rv="right"] at translateX(28px) until the
   element scrolls into view. At 375px a .sec-head row already reaches the
   edge of the wrap, so those 28px hang past it and the document scrolls
   sideways before the element has even revealed. Offset vertically on
   handsets instead: same entrance, no horizontal displacement. */
@media(max-width:820px){
  [data-rv="right"],[data-rv="left"]{transform:translateY(26px);}
}

/* ---- type: tight, heavy, optically negative-tracked ---- */
.d1{font-weight:600;letter-spacing:-.035em;line-height:1.02;}
.d2{font-weight:600;letter-spacing:-.032em;line-height:1.06;}
.d3{font-weight:600;letter-spacing:-.026em;line-height:1.16;}
em.it{font-style:normal;color:var(--muted);}
.eyebrow{letter-spacing:.16em;font-weight:500;font-size:11.5px;}
.lede{color:var(--muted);}

/* ---- surfaces: rounded, layered, soft-edged ---- */
.cat-img,.intro-media,.rs-photo,.sl-hero,.sl-panel,.cc-tile,.ac-media,
.rx-stage,.gl-map,.leg,.mam-box,.jc-stage,.wm-svg{
  border-radius:var(--r);overflow:hidden;}
.leg{border:1px solid var(--line);background:var(--surface);}
.leg:hover{box-shadow:0 22px 50px -30px rgba(10,10,12,.34);border-color:#D3D3DA;}
.mam-box{background:var(--surface);border:1px solid var(--line);
  box-shadow:0 40px 90px -50px rgba(10,10,12,.45);}
#toast{border-radius:999px;}

/* ---- controls: pill buttons, rounded fields ---- */
.btn{border-radius:999px;}
.rf-f input,.rf-f select,.rf-f textarea,
.mam-f input,.mam-f select,.mam-f textarea{border-radius:var(--r-sm);}
.rf-toggle{border-radius:999px;overflow:hidden;}

/* ---- explore grid: gapped cards, not a hairline table ----
   The old grid drew its rules by letting a 1px gap show the container
   background through, which meant the card count had to divide the column
   count or the last row painted as a solid block. Real gaps have no such
   constraint, so the column count is free to be responsive again. */
.xg{display:grid;grid-template-columns:repeat(auto-fit,minmax(258px,1fr));
  gap:12px;background:none;border:0;margin-top:clamp(36px,4vw,56px);}
.xg a{background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r);transition:border-color .4s var(--ease),
  box-shadow .4s var(--ease),transform .4s var(--ease);}
.xg a:hover{background:var(--surface);border-color:#D3D3DA;transform:translateY(-2px);
  box-shadow:0 22px 44px -30px rgba(10,10,12,.32);}
.rs-benefits li:hover{background:var(--paper-2);}

/* ---- gold that is actually read ----
   Each of these paints words rather than decoration, and each sits on a light
   surface, so they take --gold-ink. Listed explicitly instead of a blanket
   [class] override because the same --gold also appears as text inside the
   dark panels (the Jet Card face, the footer, the global map legend), where
   the light value is the correct one and darkening it would bury it. */
.ac-n,.ac-mk,.ac-link,.wx-n,.wh-t,.tm-r{color:var(--gold-ink);}
.ac-link{border-bottom-color:rgba(143,106,23,.34);}
.ac-link:hover{border-bottom-color:var(--gold-ink);}
/* The membership tag is declared as `.vs-col .vs-tag` inside a <style> block in
   the body, so it beats this stylesheet twice over — higher specificity and
   later in document order. Matched with a leading `body` to outrank it rather
   than reaching for !important. */
body .vs-col .vs-tag{color:var(--gold-ink);}

/* ---- nav scrim ----
   Before it scrolls, the bar is transparent and its links are white. That was
   safe on the old build because every hero was a dark still. It is not safe
   now: the hero is video, and the fuselage-and-sky frames run bright enough
   that "CHARTER" and the phone number wash out completely. A gradient behind
   the bar guarantees the ground regardless of the frame underneath. It is
   drawn on a pseudo-element rather than as a background on .nav so that the
   scrolled .solid state can cross-fade it out against its own white fill. */
   Strength is set from the worst case, not the average frame: white text at
   80% over a sunlit fuselage measures 3.5:1, so the stops are sized to hold
   AA against pure white behind them and the links go to 92% opacity. */
.nav::before{content:'';position:absolute;left:0;right:0;top:0;height:210%;
  background:linear-gradient(to bottom,rgba(8,8,10,.72) 0%,
    rgba(8,8,10,.42) 46%,rgba(8,8,10,0) 100%);
  pointer-events:none;opacity:1;transition:opacity .55s var(--ease);}
.nav.solid::before{opacity:0;}
.nav-in{position:relative;z-index:1;}
.nav-links a,.nav-tel{color:rgba(255,255,255,.92);}

/* ---- hero: centred, all white ----
   The hero was bottom-left: headline against the left gutter, stats pinned
   bottom-right, everything below full white. Centred instead, and every piece
   of copy taken to solid #fff — the eyebrow was at 46% and the sub-head at
   68%, which is what made them read as grey against the video.
   Prefixed with `body` throughout: these properties are declared in a <style>
   block inside the document body, so an unprefixed rule in this stylesheet
   would lose on document order even at equal specificity. */
body .hero{align-items:center;}
/* Reserves the strip the stats row occupies. .hero-meta is absolutely
   positioned, so it contributes no height of its own; without this padding the
   centred copy settles straight on top of it and the sub-head and the stats
   print over each other. */
body .hero-in{padding-bottom:clamp(96px,12vh,150px);text-align:center;}
/* "Without" is an <em class="it">, and .it is the site's italic accent — a mid
   grey that is correct on the white sections but reads as a dead word against
   the video. Whitened inside the hero only, so the accent keeps its intended
   colour everywhere else on the site. */
body .hero h1 .it{color:#fff;}
/* The eyebrow said "— DANIAL JETS" directly above the headline, which is the
   third time the wordmark appears in the same viewport (nav, eyebrow, and the
   footer mark that used to leak in). Dropped: the reference hero is headline
   and button only. */
body .hero-eyebrow{display:none;}
body .hero h1{max-width:22ch;margin-left:auto;margin-right:auto;}
body .hero-sub{max-width:56ch;margin-left:auto;margin-right:auto;color:#fff;}
body .hero-cta{justify-content:center;}
/* The stats sat bottom-right, a left-over from the asymmetric layout. Laid out
   as a centred row along the bottom instead. It stays absolutely positioned:
   it is a flex SIBLING of .hero-in inside .hero, so returning it to flow would
   put it beside the copy rather than beneath it.
   Centred by spanning both gutters and using justify-content, NOT by a
   translateX(-50%): the block carries data-rv="right", and the reveal engine
   ends that animation with `transform:none`, which would wipe the centring the
   instant the section came into view. */
body .hero-meta{left:0;right:0;padding:0 var(--gut);
  bottom:clamp(46px,6vh,84px);
  flex-direction:row;justify-content:center;gap:clamp(30px,5vw,68px);
  text-align:center;}
body .hero-meta .hm{color:#fff;white-space:nowrap;}
/* The block still carries data-rv="right", whose start state is
   translateX(28px). On the old right-aligned layout that offset was invisible;
   on a centred row it reads as 28px off-centre for the whole of the reveal.
   Swapped for a vertical rise so the horizontal position is never a function of
   the animation. Specificity 0,2,1 clears the plain [data-rv="right"] at 0,1,0
   without reaching for !important. */
body .hero-meta[data-rv]{transform:translateY(18px);}
body .hero-meta[data-rv].rv-in{transform:none;}
/* The scrim was tuned against a golden-hour film that was already dark through
   the middle of frame, so its mid band sat at .10-.14 alpha. The current hero
   film is blue-sky and high-key — sunlit white fuselage and pale sky fill the
   band the sub-head and buttons sit in — and at that alpha white-on-white left
   the sub-head barely legible. Deepened through the middle only; the 0% and
   100% stops keep their original values so the fade under the nav and the
   hand-off into the next section are unchanged.
   The second layer is a soft ellipse centred on the copy rather than a flat
   wash: it holds contrast behind the headline block without greying out the
   corners of the frame, which is where the wing and the winglet read. */
body .hero-scrim{
  background:
    linear-gradient(180deg,rgba(10,10,10,.62) 0%,rgba(10,10,10,.34) 26%,
      rgba(10,10,10,.32) 46%,rgba(10,10,10,.74) 82%,rgba(10,10,10,.94) 100%),
    radial-gradient(78% 62% at 50% 46%,rgba(10,10,10,.42) 0%,
      rgba(10,10,10,0) 72%),
    radial-gradient(120% 80% at 50% 100%,rgba(10,10,10,.55) 0%,
      rgba(10,10,10,0) 62%);
}

/* ---- jet card section: white, to match the rest of the site ----
   The section shipped as a black band (`.jc{background:var(--ink)}`) with white
   copy on it, which made it the only dark stretch on an otherwise white site.
   Inverted to paper here rather than in the frozen snapshot, which is read-only.
   `body`-prefixed for the usual reason: these properties are declared in a
   <style> block inside the document body, so an unprefixed rule in this
   stylesheet would lose on document order at equal specificity.

   The CARD ITSELF STAYS BLACK. It is a matte black physical card and the
   product being sold — only the band behind it is inverted. */
body .jc{background:var(--paper);color:var(--ink);}
/* The backdrop photo was greyscaled and sat under a black gradient so it read
   as texture in a dark band. On white, both are wrong: the gradient painted a
   dark wash over paper, and greyscale left it muddy. Colour is restored and the
   overlay flipped to white, so the photo now reads as a pale wash the way the
   other light sections do. Opacity is dropped because a light image at .16 over
   white is nearly invisible — .30 gives roughly the same presence. */
body .jc-bg{opacity:.30;}
body .jc-bg img{filter:none;}
body .jc-bg::after{
  background:linear-gradient(180deg,var(--paper) 0%,rgba(255,255,255,.62) 34%,
    rgba(255,255,255,.72) 62%,var(--paper) 100%);}
/* Rules, keys and captions were all white-on-black alphas: invisible on paper.
   Repointed at the light-theme tokens the rest of the site uses. */
body .jc-terms{border-top-color:var(--line);}
body .jc-terms li{border-bottom-color:var(--line);}
body .jc-terms .tk{color:var(--muted);}
body .jc-terms .tv{color:var(--ink);}
body .jc-terms .tv small{color:var(--muted);}
body .jc-cap,body .jc-note{color:var(--muted);}
/* The eyebrow and lede carry `.on-dark`, which is a white alpha. The class is in
   the frozen markup so it cannot be dropped; it is re-pointed here instead. */
body .jc .eyebrow.on-dark{color:var(--muted);}
body .jc .lede.on-dark{color:var(--muted);}
/* Both buttons were the dark-background pair: `.btn-light` is a white pill and
   `.btn-ghost` is a white outline, so on paper the first lost its edges and the
   second vanished entirely. Mapped onto the light-background pair the rest of the
   site uses — `.btn-solid` and `.btn-line` — without touching those classes, since
   the nav uses `.btn-ghost` too and still sits over dark. */
body .jc .btn-light{background:var(--ink);color:var(--paper);border-color:var(--ink);}
body .jc .btn-light:hover{background:var(--gold);border-color:var(--gold);color:#fff;}
body .jc .btn-ghost{border-color:var(--ink);color:var(--ink);background:transparent;}
body .jc .btn-ghost:hover{background:var(--ink);color:var(--paper);border-color:var(--ink);}
