/* ==========================================================================
   Pro Aviation Care — design system
   Original visual identity: deep navy ground, silver structure, white type,
   electric blue reserved for state and data. Instrument-panel detailing
   (hairlines, crop ticks, monospaced indices) throughout.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1 · Tokens
   -------------------------------------------------------------------------- */
:root {
  /* Navy */
  --navy-900: #040b14;
  --navy-850: #06101c;
  --navy-800: #071320;
  --navy-700: #0b1a2a;
  --navy-600: #112436;
  --navy-500: #1a3145;

  /* Silver / neutral */
  --steel:     #3a4b5e;
  --silver-500:#7d8fa2;
  --silver-400:#8fa1b3;
  --silver-300:#b9c6d2;
  --silver-200:#d8e0e7;
  --paper:     #eef2f5;
  --paper-2:   #e4eaef;
  --white:     #ffffff;

  /* Ink (type on light) */
  --ink:       #0a1522;
  --ink-2:     #253243;
  --ink-muted: #5a6673;

  /* Electric blue */
  --blue-700: #085aad;
  --blue-600: #0a63c2;
  --blue-500: #1f8fff;
  --blue-400: #4fadff;
  --blue-300: #8cd2ff;

  --ok: #46d39a;

  /* Structure */
  --gutter: clamp(20px, 4vw, 56px);
  --shell: min(1320px, 100% - (var(--gutter) * 2));
  --pad-y: clamp(76px, 8.5vw, 142px);
  --radius: 2px;
  --radius-lg: 4px;
  --ring: 0 0 0 2px var(--navy-900), 0 0 0 4px var(--blue-400);
  --ring-light: 0 0 0 2px var(--paper), 0 0 0 4px var(--blue-600);

  --ease: cubic-bezier(.22, .68, .24, 1);
  --shadow-lg: 0 34px 90px -30px rgba(4, 11, 20, .45);
  --shadow-md: 0 18px 44px -22px rgba(4, 11, 20, .38);

  /* Theme-flippable component tokens (light default) */
  --fg: var(--ink);
  --fg-2: var(--ink-2);
  --fg-muted: var(--ink-muted);
  --hair: rgba(10, 21, 34, .14);
  --hair-strong: rgba(10, 21, 34, .26);
  --surface: var(--white);
  --surface-2: var(--paper-2);
  --accent: var(--blue-600);
  --focus-ring: var(--ring-light);
}

/* --------------------------------------------------------------------------
   2 · Reset
   -------------------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 96px; }

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: "DM Sans", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}
body.is-locked { overflow: hidden; }

h1, h2, h3, h4 { margin: 0; font-family: Manrope, "Helvetica Neue", Arial, sans-serif; font-weight: 500; }
p { margin: 0 0 1.1em; }
p:last-child { margin-bottom: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
a { color: inherit; text-decoration: none; }
img, svg, video { display: block; max-width: 100%; }
img { height: auto; }
button, input, select, textarea { font: inherit; color: inherit; }
button { -webkit-tap-highlight-color: transparent; }
table { border-collapse: collapse; width: 100%; }
[hidden] { display: none !important; }
figure { margin: 0; }
blockquote { margin: 0; }
code { font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: .92em; }

:focus-visible { outline: none; box-shadow: var(--focus-ring); border-radius: var(--radius); }

.sr-only {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
}
.skip-link {
  position: fixed; z-index: 400; top: 10px; left: 10px;
  padding: 12px 18px; background: var(--blue-500); color: var(--navy-900);
  font-weight: 700; font-size: 13px; transform: translateY(-200%);
  transition: transform .2s var(--ease);
}
.skip-link:focus { transform: translateY(0); }

/* --------------------------------------------------------------------------
   3 · Layout primitives
   -------------------------------------------------------------------------- */
.shell { width: var(--shell); margin-inline: auto; }

.section { position: relative; padding-block: var(--pad-y); background: var(--paper); color: var(--fg); }
.section + .section { padding-top: 0; }
.section-dark + .section-dark { padding-top: var(--pad-y); }
.section-dark {
  --fg: var(--white);
  --fg-2: var(--silver-200);
  --fg-muted: var(--silver-400);
  --hair: rgba(255, 255, 255, .13);
  --hair-strong: rgba(255, 255, 255, .28);
  --surface: var(--navy-700);
  --surface-2: var(--navy-600);
  --accent: var(--blue-300);
  --focus-ring: var(--ring);
  background: var(--navy-900);
  color: var(--fg);
}
.section-dark + .section:not(.section-dark),
.section:not(.section-dark) + .section-dark { padding-top: var(--pad-y); }

/* Dark surfaces that are NOT `.section-dark` — a navy panel sitting inside a
   light section still needs the dark token set, or the accent and hairlines
   fall below contrast. */
.hero, .page-hero, .cta-band, .nf-section, .dispatch-hero,
.limits-card, .site-footer, .aside-card-dark,
.ac-stage, .map-stage, .cls-wrap, .prog-card {
  --fg: var(--white);
  --fg-2: var(--silver-200);
  --fg-muted: var(--silver-400);
  --hair: rgba(255, 255, 255, .13);
  --hair-strong: rgba(255, 255, 255, .28);
  --surface: var(--navy-700);
  --surface-2: var(--navy-600);
  --accent: var(--blue-300);
  --focus-ring: var(--ring);
}

.scroll-progress {
  position: fixed; inset: 0 0 auto; z-index: 120; height: 2px; pointer-events: none;
}
.scroll-progress i {
  display: block; height: 100%; width: 0;
  background: linear-gradient(90deg, var(--blue-600), var(--blue-400));
  box-shadow: 0 0 14px rgba(31, 143, 255, .7);
}

/* --------------------------------------------------------------------------
   4 · Typography
   -------------------------------------------------------------------------- */
h1, .h1 { font-size: clamp(44px, 6.4vw, 96px); line-height: .97; letter-spacing: -.045em; }
h2, .h2 { font-size: clamp(34px, 4.4vw, 68px); line-height: 1.0; letter-spacing: -.04em; }
h3 { font-size: clamp(19px, 1.5vw, 24px); line-height: 1.25; letter-spacing: -.02em; font-weight: 600; }

h1 em, h2 em, h3 em, blockquote em { font-style: normal; color: var(--accent); }

.lead { font-size: clamp(16px, 1.25vw, 19px); line-height: 1.62; color: var(--fg-2); }
.section p { color: var(--fg-muted); }
.section .lead { color: var(--fg-2); }

.mono-label {
  margin: 0 0 14px;
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 11px; font-weight: 500; letter-spacing: .17em; text-transform: uppercase;
  color: var(--fg-muted);
}
.mono-label.accent { color: var(--accent); }

.eyebrow {
  display: flex; align-items: center; gap: 12px; margin: 0 0 20px;
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 11px; letter-spacing: .15em; text-transform: uppercase; color: var(--accent);
}
.eyebrow i { width: 26px; height: 1px; background: currentColor; flex: none; }

.section-marker {
  display: flex; align-items: center; gap: 14px; margin: 0 0 26px;
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 11px; letter-spacing: .17em; text-transform: uppercase; color: var(--fg-muted);
}
.marker-num {
  display: inline-grid; place-items: center; width: 34px; height: 34px;
  border: 1px solid var(--hair-strong); border-radius: 50%;
  color: var(--accent); font-size: 10px; letter-spacing: .04em;
}

.section-head { margin-bottom: clamp(40px, 5vw, 72px); }
.section-head-split {
  display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, .7fr);
  gap: clamp(28px, 5vw, 88px); align-items: end;
}
.section-head-center { text-align: center; }
.section-head-center .section-marker { justify-content: center; }
.section-blurb { max-width: 46ch; margin: 0; color: var(--fg-muted); font-size: 15px; }

/* --------------------------------------------------------------------------
   5 · Buttons, links, lists
   -------------------------------------------------------------------------- */
.button {
  display: inline-flex; align-items: center; justify-content: center; gap: 18px;
  min-height: 54px; padding: 0 26px; border: 1px solid transparent; border-radius: var(--radius);
  font-size: 13px; font-weight: 700; letter-spacing: .01em; cursor: pointer;
  white-space: nowrap;
  transition: background .25s var(--ease), color .25s var(--ease),
              border-color .25s var(--ease), transform .25s var(--ease);
}
.button span { transition: transform .25s var(--ease); }
.button:hover span { transform: translate(3px, -3px); }
.arrow-icon {
  display: inline-block; width: 13px; height: 13px; flex: none; overflow: visible;
  fill: none; stroke: currentColor; stroke-width: 1.25;
  stroke-linecap: square; stroke-linejoin: miter;
}
.button .arrow-icon, .text-link .arrow-icon, .svc-go .arrow-icon {
  transition: transform .25s var(--ease);
}
.button:hover .arrow-icon, .text-link:hover .arrow-icon,
.svc-card:hover .svc-go .arrow-icon { transform: translate(3px, -3px); }
.button-small { min-height: 42px; padding: 0 18px; font-size: 12px; gap: 12px; }
.button-full { width: 100%; }

.button-primary { background: var(--blue-500); border-color: var(--blue-500); color: var(--navy-900); }
.button-primary:hover { background: var(--blue-400); border-color: var(--blue-400); }

.button-outline { background: transparent; border-color: var(--hair-strong); color: var(--fg); }
.button-outline:hover { border-color: var(--blue-500); color: var(--accent); }

.button-outline-dark { background: transparent; border-color: rgba(10, 21, 34, .3); color: var(--ink); }
.button-outline-dark:hover { border-color: var(--blue-600); color: var(--blue-600); }

.text-link {
  display: inline-flex; align-items: center; gap: 20px;
  padding-bottom: 8px; border-bottom: 1px solid var(--hair-strong);
  background: none; border-top: 0; border-left: 0; border-right: 0; cursor: pointer;
  font-size: 13px; font-weight: 700; color: var(--fg);
  transition: border-color .25s var(--ease), color .25s var(--ease);
}
.text-link span { transition: transform .25s var(--ease); }
.text-link:hover { color: var(--accent); border-color: var(--accent); }
.text-link:hover span { transform: translate(3px, -3px); }
.text-link-light { color: var(--white); border-color: rgba(255, 255, 255, .3); }
.text-link-light:hover { color: var(--blue-300); border-color: var(--blue-300); }

.hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: clamp(20px, 3vw, 38px); margin-top: 36px; }

.rule-list { margin: 26px 0 0; border-top: 1px solid var(--hair); }
.rule-list li {
  display: grid; grid-template-columns: 22px 1fr; gap: 12px; align-items: start;
  padding: 13px 0; border-bottom: 1px solid var(--hair);
  color: var(--fg-2); font-size: 14px; line-height: 1.55;
}
.tick { position: relative; margin-top: 8px; width: 12px; height: 12px; }
.tick::before, .tick::after { content: ""; position: absolute; background: var(--accent); }
.tick::before { left: 0; top: 5px; width: 12px; height: 1px; }
.tick::after { left: 5px; top: 0; width: 1px; height: 12px; }
.rule-list-light li { color: var(--silver-300); }

.spec-table { margin: 0; border-top: 1px solid var(--hair); }
.spec-row {
  display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 18px;
  padding: 14px 0; border-bottom: 1px solid var(--hair);
}
.spec-row dt {
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--fg-muted);
  padding-top: 3px;
}
.spec-row dd { margin: 0; font-size: 14px; line-height: 1.5; color: var(--fg-2); }
.spec-caption { margin: 16px 0 0; font-size: 12px; color: var(--fg-muted); }

/* --------------------------------------------------------------------------
   6 · Header + navigation
   -------------------------------------------------------------------------- */
.site-header {
  position: fixed; inset: 0 0 auto; z-index: 100; height: 88px;
  color: var(--white); border-top: 2px solid var(--blue-500);
  border-bottom: 1px solid rgba(255, 255, 255, .1);
  background: rgba(4, 11, 20, .94);
  -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px);
  transition: height .3s var(--ease), background .3s var(--ease),
              border-color .3s var(--ease), transform .35s var(--ease);
}
.site-header::after {
  content: ""; position: absolute; left: 0; bottom: -1px; width: 22%; height: 1px;
  pointer-events: none; opacity: .8;
  background: linear-gradient(90deg, transparent, var(--blue-400), transparent);
  animation: headerScan 7s linear infinite;
}
@keyframes headerScan { from { transform: translateX(-110%); } to { transform: translateX(560%); } }
.site-header.is-scrolled {
  height: 70px; background: rgba(4, 11, 20, .9);
  border-bottom-color: rgba(255, 255, 255, .1);
  -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px);
}
.site-header.is-hidden { transform: translateY(-100%); }
.site-header.is-open { background: var(--navy-900); }

.nav-wrap { height: 100%; display: flex; align-items: center; gap: clamp(16px, 3vw, 46px); }
.brand { flex: none; display: inline-flex; align-items: center; }
.brand-logo { width: 208px; height: auto; }
.brand-logo-lg { width: 236px; }

.desktop-nav {
  display: flex; align-items: center; gap: 0; margin-left: auto;
  border: 1px solid rgba(255, 255, 255, .1); background: rgba(255, 255, 255, .025);
}
.nav-item { position: relative; border-right: 1px solid rgba(255, 255, 255, .08); }
.nav-item:last-child { border-right: 0; }
.nav-link {
  display: inline-flex; align-items: center; gap: 7px;
  min-height: 42px; padding: 7px 9px; border: 0; background: none; cursor: pointer;
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 9px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase;
  color: rgba(255, 255, 255, .76);
  transition: color .2s var(--ease), background .2s var(--ease);
}
.nav-link:hover, .nav-link[aria-expanded="true"] { color: var(--white); background: rgba(31, 143, 255, .08); }
.nav-link[aria-current="page"] { color: var(--white); background: rgba(31, 143, 255, .06); }
.nav-link[aria-current="page"]::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px;
  background: var(--blue-500);
}
.nav-index {
  position: relative; display: inline-grid; place-items: center; width: 27px; height: 24px;
  overflow: hidden; border: 1px solid rgba(140, 210, 255, .24);
  background: #071320; color: var(--blue-300); line-height: 1;
  box-shadow: inset 0 -1px rgba(255, 255, 255, .08);
}
.nav-index::before {
  content: ""; position: absolute; z-index: 2; inset: 50% 0 auto; height: 1px;
  background: rgba(4, 11, 20, .82); box-shadow: 0 1px rgba(255, 255, 255, .05);
}
.nav-index::after {
  content: attr(data-index); position: absolute; inset: 0; display: grid; place-items: center;
  transform: translateY(-105%); transition: transform .36s var(--ease);
}
.nav-index > span { transition: transform .36s var(--ease); }
.nav-link:hover .nav-index > span,
.nav-link[aria-expanded="true"] .nav-index > span { transform: translateY(105%); }
.nav-link:hover .nav-index::after,
.nav-link[aria-expanded="true"] .nav-index::after { transform: translateY(0); }
.nav-label { white-space: nowrap; }
.nav-caret {
  width: 6px; height: 6px; border-right: 1px solid currentColor; border-bottom: 1px solid currentColor;
  transform: rotate(45deg) translate(-2px, -2px); transition: transform .25s var(--ease);
}
.nav-link[aria-expanded="true"] .nav-caret { transform: rotate(-135deg) translate(-3px, -3px); }

.mega {
  position: absolute; z-index: 10; top: calc(100% + 10px); left: 50%;
  width: min(760px, calc(100vw - 48px)); transform: translateX(-50%);
  background: rgba(6, 16, 28, .97); border: 1px solid rgba(255, 255, 255, .12);
  -webkit-backdrop-filter: blur(22px); backdrop-filter: blur(22px);
  box-shadow: var(--shadow-lg);
  animation: megaIn .22s var(--ease) both;
}
.nav-item:last-child .mega { left: auto; right: 0; transform: none; }
@keyframes megaIn { from { opacity: 0; transform: translateX(-50%) translateY(-8px); } }
.nav-item:last-child .mega { animation-name: megaInRight; }
@keyframes megaInRight { from { opacity: 0; transform: translateY(-8px); } }

.mega-inner { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.6fr); }
.mega-intro { padding: 30px 28px; border-right: 1px solid rgba(255, 255, 255, .1); }
.mega-intro .mono-label { color: var(--blue-300); }
.mega-blurb { color: var(--silver-400); font-size: 13px; line-height: 1.55; margin-bottom: 22px; }
.mega-links { padding: 10px; display: grid; }
.mega-link {
  display: grid; grid-template-columns: 30px 1fr 20px; align-items: center; gap: 12px;
  padding: 12px 14px; border-radius: var(--radius);
  transition: background .2s var(--ease);
}
.mega-link:hover, .mega-link.is-current { background: rgba(31, 143, 255, .12); }
.mega-index {
  font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: 10px;
  letter-spacing: .1em; color: var(--silver-500);
}
.mega-link:hover .mega-index, .mega-link.is-current .mega-index { color: var(--blue-300); }
.mega-body { display: block; }
.mega-body strong { display: block; font-family: Manrope, sans-serif; font-size: 15px; font-weight: 600; color: var(--white); }
.mega-body small { display: block; margin-top: 2px; font-size: 12.5px; line-height: 1.4; color: var(--silver-500); }
.mega-arrow { color: var(--blue-300); opacity: 0; transform: translateX(-6px); transition: .2s var(--ease); }
.mega-link:hover .mega-arrow { opacity: 1; transform: translateX(0); }

.nav-actions { display: flex; align-items: center; gap: 14px; margin-left: auto; }
.desktop-nav + .nav-actions { margin-left: 0; }
.nav-clock {
  display: flex; align-items: center; gap: 7px; flex: none;
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 7px; letter-spacing: .13em; text-transform: uppercase; color: var(--silver-500);
}
.nav-clock time { display: flex; align-items: center; gap: 2px; }
.clock-digit {
  position: relative; display: grid; place-items: center; width: 15px; height: 22px;
  border: 1px solid rgba(255, 255, 255, .13); background: #071320;
  color: var(--white); font-size: 9px; letter-spacing: 0;
  animation: clockDrop .5s var(--ease) both;
}
.clock-digit::after { content: ""; position: absolute; inset: 50% 0 auto; height: 1px; background: rgba(4, 11, 20, .8); }
.clock-colon { color: var(--blue-400); font-size: 9px; }
@keyframes clockDrop { from { opacity: 0; transform: rotateX(-80deg); } }

.menu-toggle {
  display: none; width: 46px; height: 46px; padding: 0;
  border: 1px solid rgba(255, 255, 255, .22); background: transparent; border-radius: var(--radius);
  cursor: pointer;
}
.menu-bars { display: grid; gap: 6px; place-items: center; }
.menu-bars i { display: block; width: 18px; height: 1.5px; background: var(--white); transition: transform .28s var(--ease), opacity .2s; }
.menu-toggle[aria-expanded="true"] .menu-bars i:first-child { transform: translateY(3.75px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] .menu-bars i:last-child { transform: translateY(-3.75px) rotate(-45deg); }

/* Mobile navigation */
.mobile-nav {
  position: fixed; inset: 70px 0 0; z-index: 99; overflow-y: auto;
  background: var(--navy-900); -webkit-overflow-scrolling: touch;
  animation: mnavIn .28s var(--ease) both;
}
@keyframes mnavIn { from { opacity: 0; transform: translateY(-12px); } }
.mobile-nav-inner { width: var(--shell); margin-inline: auto; padding: 26px 0 60px; }
.m-link, .m-trigger {
  display: grid; grid-template-columns: 46px 1fr auto; align-items: center; width: 100%;
  padding: 20px 2px; border: 0; border-bottom: 1px solid rgba(255, 255, 255, .12);
  background: none; text-align: left; cursor: pointer;
  font-family: Manrope, sans-serif; font-size: 20px; font-weight: 500; color: var(--white);
}
.m-index {
  display: grid; place-items: center; width: 34px; height: 30px;
  border: 1px solid rgba(140, 210, 255, .3); background: var(--navy-800);
  font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: 10px;
  letter-spacing: .08em; color: var(--blue-300);
  box-shadow: inset 0 -1px rgba(255, 255, 255, .08);
}
.m-label { min-width: 0; }
.m-link[aria-current="page"] { color: var(--blue-300); }
.m-caret {
  width: 9px; height: 9px; flex: none;
  border-right: 1.5px solid var(--silver-400); border-bottom: 1.5px solid var(--silver-400);
  transform: rotate(45deg); transition: transform .25s var(--ease);
}
.m-trigger[aria-expanded="true"] .m-caret { transform: rotate(-135deg); }
.m-panel { padding: 6px 0 16px; display: grid; }
.m-panel a {
  padding: 12px 2px 12px 18px; border-left: 1px solid rgba(255, 255, 255, .14);
  font-size: 15px; color: var(--silver-300);
}
.m-panel a[aria-current="page"] { color: var(--blue-300); border-left-color: var(--blue-500); }
.m-hub { color: var(--blue-300) !important; font-weight: 700; font-size: 13px !important; }
.mobile-nav .button { margin-top: 30px; }
.mobile-foot { margin: 26px 0 0; text-align: center; }

/* --------------------------------------------------------------------------
   7 · Home hero
   -------------------------------------------------------------------------- */
.hero {
  position: relative; display: flex; flex-direction: column; justify-content: flex-end;
  /* When the content is taller than the box, plain flex-end overflows the TOP,
     pushing the copy and the status card under the fixed header where overflow
     hidden then clips them. "safe" falls back to start-alignment in exactly that
     case; the unprefixed value above stays as the fallback for older engines.
     padding-top reserves the header's height so the fallback lands clear of it. */
  justify-content: safe flex-end;
  padding-top: 96px;
  min-height: 640px; height: 100svh; max-height: 1080px;
  --fg: var(--ink); --fg-2: var(--ink-2); --fg-muted: var(--ink-muted);
  --hair: rgba(10, 21, 34, .16); --hair-strong: rgba(10, 21, 34, .3);
  --accent: var(--blue-600); --focus-ring: var(--ring-light);
  background: #dce6ed; color: var(--ink); overflow: hidden;
}
.hero-media { position: absolute; inset: -1.5%; }
.hero-media img, .hero-media video {
  width: 100%; height: 100%; object-fit: cover; object-position: 57% center;
  filter: brightness(1.07) contrast(1.08) saturate(.9);
}
.hero-media video { position: absolute; inset: 0; opacity: 0; transition: opacity 1.1s var(--ease); }
.hero-media video.is-ready { opacity: 1; }
.hero-media video.is-ready {
  animation: hangarPowerOn 2.1s var(--ease) both,
             videoDrift 11s 2.1s ease-in-out infinite alternate;
}
.hero-media-clean .hero-still {
  animation: hangarPowerOn 2.1s var(--ease) both,
             videoDrift 11s 2.1s ease-in-out infinite alternate;
}
.hero-still { animation: heroPush 2.4s var(--ease) both; }
@keyframes heroPush { from { transform: scale(1.06); opacity: .3; } to { transform: scale(1); opacity: 1; } }
@keyframes hangarPowerOn {
  0% { filter: brightness(.42) contrast(1.22) saturate(.65); }
  32% { filter: brightness(.68) contrast(1.16) saturate(.76); }
  44% { filter: brightness(.58) contrast(1.2) saturate(.7); }
  68% { filter: brightness(.95) contrast(1.1) saturate(.86); }
  100% { filter: brightness(1.07) contrast(1.08) saturate(.9); }
}
@keyframes videoDrift {
  from { transform: scale(1.015) translate3d(.4%, 0, 0); }
  to { transform: scale(1.065) translate3d(-1.2%, -.35%, 0); }
}

.hero-video-toggle {
  position: absolute; z-index: 4; top: 104px; right: var(--gutter);
  display: inline-flex; align-items: center; gap: 9px; min-height: 36px;
  padding: 8px 11px; border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 2px; background: rgba(4, 11, 20, .48); color: var(--silver-200);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: 9px;
  letter-spacing: .12em; text-transform: uppercase; cursor: pointer;
}
.hero-video-toggle:hover { border-color: var(--blue-400); color: var(--white); }
.hero-video-icon { position: relative; width: 10px; height: 10px; }
.hero-video-icon::before, .hero-video-icon::after {
  content: ""; position: absolute; top: 1px; width: 2px; height: 8px; background: var(--blue-300);
}
.hero-video-icon::before { left: 2px; }
.hero-video-icon::after { right: 2px; }
.hero-video-toggle[aria-pressed="true"] .hero-video-icon::before {
  left: 2px; top: 0; width: 0; height: 0; border-top: 5px solid transparent;
  border-bottom: 5px solid transparent; border-left: 8px solid var(--blue-300); background: transparent;
}
.hero-video-toggle[aria-pressed="true"] .hero-video-icon::after { display: none; }

.hero-scrim {
  position: absolute; inset: 0;
  background:
    linear-gradient(96deg, rgba(235, 242, 247, .9) 0%, rgba(235, 242, 247, .62) 28%,
                    rgba(235, 242, 247, .16) 48%, rgba(235, 242, 247, 0) 62%),
    linear-gradient(0deg, rgba(4, 11, 20, .3) 0%, rgba(4, 11, 20, 0) 38%);
}
.hero-mesh {
  position: absolute; inset: 0; opacity: .24;
  background-image:
    linear-gradient(rgba(10, 21, 34, .1) 1px, transparent 1px),
    linear-gradient(90deg, rgba(10, 21, 34, .1) 1px, transparent 1px);
  background-size: 96px 96px;
  -webkit-mask-image: radial-gradient(120% 90% at 8% 40%, #000 0%, transparent 62%);
  mask-image: radial-gradient(120% 90% at 8% 40%, #000 0%, transparent 62%);
}
.hero-light-sweep {
  position: absolute; z-index: 1; top: 88px; bottom: 0; left: -30%; width: 18%;
  pointer-events: none; opacity: 0;
  background: linear-gradient(90deg, transparent, rgba(31, 143, 255, .28), rgba(255, 255, 255, .58), transparent);
  filter: blur(9px); transform: skewX(-12deg); mix-blend-mode: screen;
  animation: heroSweep 7.5s 2.1s var(--ease) infinite;
}
@keyframes heroSweep {
  0%, 18% { left: -30%; opacity: 0; }
  28% { opacity: .8; }
  70% { opacity: .5; }
  84%, 100% { left: 112%; opacity: 0; }
}
.hero-hangar-lights {
  position: absolute; z-index: 1; inset: 88px 0 auto auto; width: 58%; height: 29%;
  overflow: hidden; pointer-events: none;
}
.hero-hangar-lights i {
  position: absolute; right: -4%; width: 68%; height: 2px;
  transform: rotate(-7deg) scaleX(0); transform-origin: right center;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .92) 24%, var(--blue-300) 62%, transparent);
  box-shadow: 0 0 18px rgba(79, 173, 255, .7);
  animation: hangarLightOn .8s var(--ease) both;
}
.hero-hangar-lights i:nth-child(1) { top: 16%; animation-delay: .55s; }
.hero-hangar-lights i:nth-child(2) { top: 47%; right: -13%; width: 60%; animation-delay: .82s; }
.hero-hangar-lights i:nth-child(3) { top: 78%; right: -20%; width: 51%; animation-delay: 1.08s; }
@keyframes hangarLightOn {
  0%, 28% { opacity: 0; transform: rotate(-7deg) scaleX(0); }
  38% { opacity: .35; }
  48% { opacity: 0; }
  62% { opacity: .72; }
  100% { opacity: .48; transform: rotate(-7deg) scaleX(1); }
}
.hero-beacons { position: absolute; z-index: 1; inset: 88px 0 92px; pointer-events: none; }
.hero-beacon {
  position: absolute; width: 5px; height: 5px; border-radius: 50%;
  background: #eaf8ff; opacity: 0;
  box-shadow: 0 0 7px 2px #fff, 0 0 23px 8px rgba(31, 143, 255, .86), 0 0 58px 18px rgba(31, 143, 255, .34);
  animation: aircraftBeacon 3.8s ease-in-out infinite;
}
.hero-beacon-nose { left: 51%; top: 64%; animation-delay: 1.35s; }
.hero-beacon-wing { right: 8%; top: 57%; animation-delay: 2.1s; }
.hero-beacon-floor { left: 60%; bottom: 7%; animation-delay: 2.7s; }
@keyframes aircraftBeacon {
  0%, 12%, 100% { opacity: 0; transform: scale(.65); }
  18% { opacity: 1; transform: scale(1); }
  27% { opacity: .28; transform: scale(.82); }
  34% { opacity: .95; transform: scale(1.08); }
  48% { opacity: 0; transform: scale(.7); }
}

.hero-inner {
  position: relative; z-index: 2; flex: 1;
  display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center;
  gap: 48px; padding-top: 110px; padding-bottom: 40px;
}
.hero-copy {
  position: relative; max-width: 700px; padding: clamp(30px, 3.2vw, 48px);
  overflow: hidden; border: 1px solid rgba(10, 21, 34, .18);
  background: rgba(247, 250, 252, .86);
  box-shadow: 0 28px 80px -42px rgba(4, 11, 20, .68);
  -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
}
.hero-copy::before {
  content: ""; position: absolute; inset: 0 auto auto 0; width: 38%; height: 2px;
  background: linear-gradient(90deg, var(--blue-600), var(--blue-300), transparent);
}
.hero-copy::after {
  content: ""; position: absolute; right: 12px; bottom: 12px; width: 16px; height: 16px;
  border-right: 1px solid var(--blue-600); border-bottom: 1px solid var(--blue-600);
}
.has-js .hero-copy { animation: heroPanelIn .85s .08s var(--ease) both; }
@keyframes heroPanelIn {
  from { opacity: 0; transform: translateX(-28px); clip-path: inset(0 100% 0 0); }
  to { opacity: 1; transform: translateX(0); clip-path: inset(0); }
}
.hero-kicker { margin-bottom: 22px; }
.hero h1 { max-width: 12ch; font-size: clamp(52px, 5.4vw, 82px); }
.hero h1 em { color: var(--blue-600); }
.hero-line { display: block; overflow: hidden; padding-bottom: .06em; margin-bottom: -.06em; }
.hero-line > span { display: block; }
.has-js .hero-line > span { animation: heroLineIn .95s var(--ease) both; }
.has-js .hero-line-accent > span { animation-delay: .13s; }
@keyframes heroLineIn { from { opacity: 0; transform: translateY(112%) rotate(.8deg); } }
.hero .lead { max-width: 52ch; margin-top: 26px; color: var(--ink-2); }
.has-js .hero-kicker,
.has-js .hero .lead,
.has-js .hero-actions { animation: heroCopyIn .8s var(--ease) both; }
.has-js .hero-kicker { animation-delay: .05s; }
.has-js .hero .lead { animation-delay: .35s; }
.has-js .hero-actions { animation-delay: .48s; }
@keyframes heroCopyIn { from { opacity: 0; transform: translateY(18px); } }
.hero .text-link { color: var(--ink); border-color: rgba(10, 21, 34, .3); }
.hero .text-link:hover { color: var(--blue-700); border-color: var(--blue-600); }

.hero-card {
  position: relative; width: 300px; padding: 26px 24px;
  overflow: hidden; border: 1px solid rgba(140, 210, 255, .24); background: rgba(4, 11, 20, .82);
  color: var(--white); box-shadow: 0 26px 78px -34px rgba(4, 11, 20, .82);
  -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px);
}
.has-js .hero-card { animation: heroCardIn .9s .72s var(--ease) both; }
.hero-card::after {
  content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 1px;
  background: linear-gradient(90deg, transparent, var(--blue-500), transparent);
  animation: cardScan 4.2s 1.4s ease-in-out infinite;
}
@keyframes heroCardIn { from { opacity: 0; transform: translateX(24px); } }
@keyframes cardScan { 0%, 100% { transform: translateX(-100%); } 50% { transform: translateX(100%); } }
.hero-card-head {
  display: flex; align-items: center; gap: 10px; margin: 0 0 18px; padding-bottom: 16px;
  border-bottom: 1px solid rgba(255, 255, 255, .14);
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 10.5px; letter-spacing: .13em; text-transform: uppercase; color: var(--white);
}
.live-dot { position: relative; width: 7px; height: 7px; flex: none; border-radius: 50%; background: var(--ok); }
.live-dot::after {
  content: ""; position: absolute; inset: -5px; border: 1px solid var(--ok); border-radius: 50%;
  animation: ping 2.4s var(--ease) infinite;
}
@keyframes ping { 0% { opacity: .8; transform: scale(.6); } 100% { opacity: 0; transform: scale(1.5); } }
.hero-card dl { margin: 0; display: grid; gap: 12px; }
.hero-card dl > div { display: flex; justify-content: space-between; gap: 14px; align-items: baseline; }
.hero-card dt {
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--silver-400);
}
.hero-card dd { margin: 0; font-size: 12.5px; font-weight: 500; color: var(--silver-200); text-align: right; }
.hero-card-link {
  display: inline-flex; gap: 10px; margin-top: 20px; padding-top: 16px;
  border-top: 1px solid rgba(255, 255, 255, .14);
  font-size: 12px; font-weight: 700; color: var(--blue-300);
}

.hero-rail {
  position: relative; z-index: 2;
  border-top: 1px solid rgba(140, 210, 255, .2);
  background: rgba(4, 11, 20, .9); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
}
.hero-rail::before {
  content: ""; position: absolute; inset: 0 auto auto 0; width: 24%; height: 1px;
  background: linear-gradient(90deg, transparent, var(--blue-400), transparent);
  animation: railSweep 6s linear infinite;
}
@keyframes railSweep { from { transform: translateX(-110%); } to { transform: translateX(520%); } }
.hero-rail-inner {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) auto; align-items: center;
  min-height: 92px;
}
.rail-item {
  display: flex; align-items: center; gap: 16px; height: 100%; padding: 16px 26px;
  border-right: 1px solid rgba(255, 255, 255, .1);
}
.rail-item:first-child { padding-left: 0; }
.rail-item .mono-label {
  position: relative; display: grid; place-items: center; flex: none;
  width: 34px; height: 28px; margin: 0; overflow: hidden;
  border: 1px solid rgba(10, 21, 34, .16); background: var(--navy-800); color: var(--blue-300);
  box-shadow: inset 0 -1px rgba(255, 255, 255, .1);
}
.rail-item .mono-label::after { content: ""; position: absolute; inset: 50% 0 auto; height: 1px; background: #02070d; }
.has-js .rail-item .mono-label { animation: boardFlip .58s var(--ease) both; }
.has-js .rail-item:nth-child(2) .mono-label { animation-delay: .14s; }
.has-js .rail-item:nth-child(3) .mono-label { animation-delay: .28s; }
@keyframes boardFlip { from { opacity: 0; transform: rotateX(-86deg); } }
.rail-item p { margin: 0; font-size: 12.5px; color: rgba(255, 255, 255, .72); line-height: 1.4; }
.rail-scroll {
  display: flex; align-items: center; gap: 12px; padding-left: 26px;
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 10px; letter-spacing: .16em; text-transform: uppercase; color: var(--silver-400);
}
.rail-scroll i {
  width: 1px; height: 26px; background: linear-gradient(var(--blue-400), transparent);
  animation: railDrop 2.2s var(--ease) infinite;
}
@keyframes railDrop { 0%, 100% { transform: scaleY(.4); opacity: .4; } 50% { transform: scaleY(1); opacity: 1; } }

/* --------------------------------------------------------------------------
   8 · Interior page hero
   -------------------------------------------------------------------------- */
.page-hero {
  position: relative; display: flex; align-items: flex-end;
  min-height: min(680px, 82svh); padding-top: 120px; padding-bottom: clamp(48px, 6vw, 92px);
  background: var(--navy-900); color: var(--white); overflow: hidden;
}
.page-hero-media { position: absolute; inset: 0; }
.page-hero-media img { width: 100%; height: 100%; object-fit: cover; object-position: center 45%; }
.page-hero-scrim {
  position: absolute; inset: 0;
  background:
    linear-gradient(94deg, rgba(4, 11, 20, .96) 0%, rgba(4, 11, 20, .78) 40%, rgba(4, 11, 20, .3) 100%),
    linear-gradient(0deg, rgba(4, 11, 20, .9), rgba(4, 11, 20, 0) 58%);
}
.page-hero-inner { position: relative; z-index: 2; width: var(--shell); }
.page-hero-grid { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 48px; align-items: end; }
.page-hero h1 { max-width: 14ch; }
.page-hero h1 em { color: var(--blue-300); }
.page-hero .lead { max-width: 56ch; margin-top: 24px; color: rgba(255, 255, 255, .76); }
.page-hero .mono-label { color: var(--blue-300); }
.page-hero-aside { text-align: right; }
.hero-aside-mono {
  margin: 0; font-family: Manrope, sans-serif; font-size: clamp(64px, 8vw, 128px); font-weight: 800;
  line-height: .8; letter-spacing: -.06em; color: transparent;
  -webkit-text-stroke: 1px rgba(140, 210, 255, .45);
}
.page-hero-aside .mono-label { margin: 14px 0 0; }

.crumbs { margin-bottom: clamp(34px, 5vw, 64px); }
.crumbs ol { display: flex; flex-wrap: wrap; gap: 10px; }
.crumbs li {
  display: flex; align-items: center; gap: 10px;
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--silver-400);
}
.crumbs li + li::before { content: "/"; color: rgba(255, 255, 255, .3); }
.crumbs a { color: var(--silver-400); transition: color .2s; }
.crumbs a:hover { color: var(--blue-300); }
.crumbs [aria-current] { color: var(--white); }

/* --------------------------------------------------------------------------
   9 · Home — principles
   -------------------------------------------------------------------------- */
.principles-grid {
  display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
  gap: clamp(40px, 6vw, 110px);
}
.principles-copy h2 { margin-bottom: 24px; }
.principles-copy .text-link { margin-top: 30px; }
.principles-list { border-top: 1px solid var(--hair); }
.principles-list li {
  display: grid; grid-template-columns: 54px 1fr; gap: 20px;
  padding: 30px 0; border-bottom: 1px solid var(--hair);
}
.p-num { margin: 0; padding-top: 4px; color: var(--accent); }
.principles-list h3 { margin-bottom: 10px; }
.principles-list p { margin: 0; font-size: 14.5px; color: var(--fg-muted); }

/* --------------------------------------------------------------------------
   10 · Aircraft care map
   -------------------------------------------------------------------------- */
.ac-section { overflow: clip; }
.ac-wrap { position: relative; }
.ac-stage {
  position: relative; isolation: isolate;
  padding: clamp(22px, 3vw, 42px);
  border: 1px solid var(--hair);
  background:
    radial-gradient(70% 60% at 50% 45%, rgba(31, 143, 255, .14), transparent 70%),
    linear-gradient(rgba(140, 210, 255, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(140, 210, 255, .035) 1px, transparent 1px),
    var(--navy-850);
  background-size: auto, 72px 72px, 72px 72px, auto;
}
.ac-service-layout {
  position: relative; z-index: 1;
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(320px, 440px) minmax(220px, 1fr);
  gap: clamp(24px, 3vw, 52px); align-items: center;
  min-height: clamp(740px, 64vw, 920px);
}
.ac-service-column { position: relative; z-index: 4; display: flex; flex-direction: column; gap: clamp(18px, 2.1vw, 30px); }
.hotspot {
  position: relative; display: grid; grid-template-columns: auto 1fr auto;
  align-items: center; gap: 14px; width: 100%; min-height: 70px;
  padding: 14px 18px; border: 1px solid rgba(140, 210, 255, .2);
  border-radius: 2px; background: rgba(7, 19, 32, .82); color: var(--white);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  cursor: pointer; text-align: left; text-decoration: none; overflow: hidden;
  box-shadow: inset 3px 0 0 rgba(79, 173, 255, .35);
  transition: border-color .3s var(--ease), background .3s var(--ease),
              transform .3s var(--ease), box-shadow .3s var(--ease);
}
.ac-service-right .hotspot { box-shadow: inset -3px 0 0 rgba(79, 173, 255, .35); }
.hotspot:hover { border-color: rgba(140, 210, 255, .62); transform: translateY(-2px); }
.hotspot[aria-current="true"] {
  border-color: var(--blue-400); background: rgba(31, 143, 255, .16);
  box-shadow: inset 4px 0 0 var(--blue-400), 0 14px 40px -24px rgba(79, 173, 255, .9);
}
.ac-service-right .hotspot[aria-current="true"] { box-shadow: inset -4px 0 0 var(--blue-400), 0 14px 40px -24px rgba(79, 173, 255, .9); }
.hs-num {
  font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: 10px; letter-spacing: .1em;
  color: var(--silver-500);
}
.hotspot[aria-current="true"] .hs-num { color: var(--blue-300); }
.hs-label { font-size: clamp(12px, 1vw, 14px); font-weight: 600; letter-spacing: .01em; color: rgba(255, 255, 255, .9); }
.hs-arrow { color: var(--blue-300); opacity: .46; transition: transform .25s var(--ease), opacity .25s; }
.hotspot:hover .hs-arrow, .hotspot[aria-current="true"] .hs-arrow { opacity: 1; transform: translate(2px, -2px); }
.hs-description {
  grid-column: 1 / -1; display: block; max-height: 0; margin: -8px 0 0;
  overflow: hidden; opacity: 0; transform: translateY(-5px);
  color: var(--silver-400); font-size: 12px; line-height: 1.6;
  transition: max-height .36s var(--ease), margin .3s var(--ease),
              opacity .26s var(--ease), transform .3s var(--ease);
}
.hs-read-more {
  grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between;
  max-height: 0; overflow: hidden; opacity: 0; color: var(--blue-300);
  font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: 9px;
  letter-spacing: .12em; text-transform: uppercase;
  transition: max-height .3s var(--ease), opacity .25s var(--ease);
}
.hotspot:hover .hs-description,
.hotspot:focus-visible .hs-description,
.hotspot[aria-current="true"] .hs-description {
  max-height: 150px; margin-top: 0; opacity: 1; transform: none;
}
.hotspot:hover .hs-read-more,
.hotspot:focus-visible .hs-read-more,
.hotspot[aria-current="true"] .hs-read-more { max-height: 24px; opacity: 1; }

.ac-airframe {
  position: relative; display: grid; place-items: center; align-self: stretch;
  min-height: 720px; perspective: 1000px;
}
.ac-airframe-media {
  position: relative; z-index: 2; width: min(100%, 426px);
  transform-origin: 50% 55%;
}
.ac-cutaway-img {
  position: relative; z-index: 2; display: block; width: 100%; height: auto;
  object-fit: contain; filter: drop-shadow(0 30px 38px rgba(0, 0, 0, .52));
}
.ac-zone-overlay {
  position: absolute; z-index: 4; inset: 0; width: 100%; height: 100%;
  overflow: visible; pointer-events: none;
}
.ac-zone-shape {
  opacity: 0; filter: drop-shadow(0 0 8px rgba(70, 176, 255, .85));
  transition: opacity .3s var(--ease);
}
.ac-zone-fill {
  fill: rgba(31, 143, 255, .24); stroke: rgba(150, 222, 255, .96);
  stroke-width: 3; vector-effect: non-scaling-stroke;
}
.ac-zone-detail {
  fill: rgba(145, 220, 255, .32); stroke: rgba(202, 240, 255, .9);
  stroke-width: 2; vector-effect: non-scaling-stroke;
}
.ac-zone-line {
  fill: none; stroke: rgba(136, 216, 255, .98); stroke-width: 5;
  stroke-linecap: round; vector-effect: non-scaling-stroke;
}
.ac-zone-line-wide { stroke-width: 9; }
.ac-stage[data-zone="fuselage"] .ac-zone-shape[data-zone="fuselage"],
.ac-stage[data-zone="wings"] .ac-zone-shape[data-zone="wings"],
.ac-stage[data-zone="windows"] .ac-zone-shape[data-zone="windows"],
.ac-stage[data-zone="boots"] .ac-zone-shape[data-zone="boots"],
.ac-stage[data-zone="cabin"] .ac-zone-shape[data-zone="cabin"],
.ac-stage[data-zone="carpet"] .ac-zone-shape[data-zone="carpet"],
.ac-stage[data-zone="galley"] .ac-zone-shape[data-zone="galley"],
.ac-stage[data-zone="lav"] .ac-zone-shape[data-zone="lav"] {
  opacity: 1; animation: acZonePulse 2.2s ease-in-out infinite;
}
.ac-airframe figcaption {
  position: absolute; z-index: 5; left: 50%; bottom: 4%; margin: 0;
  transform: translateX(-50%); white-space: nowrap; color: rgba(185, 198, 210, .72);
}
.ac-orbit {
  position: absolute; z-index: 0; left: 50%; top: 50%; border: 1px solid rgba(140, 210, 255, .14);
  border-radius: 50%; transform: translate(-50%, -50%) rotate(-18deg); pointer-events: none;
}
.ac-orbit-a { width: 112%; aspect-ratio: 1; }
.ac-orbit-b { width: 82%; aspect-ratio: 1; transform: translate(-50%, -50%) rotate(24deg); }
.ac-scan {
  position: absolute; z-index: 3; left: 4%; right: 4%; top: 18%; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(140, 210, 255, .85), transparent);
  box-shadow: 0 0 22px rgba(79, 173, 255, .8); opacity: .5; pointer-events: none;
  animation: acScan 6.5s ease-in-out infinite;
}

.has-js .ac-stage:not(.is-in) .ac-airframe-media { opacity: 0; transform: translateY(110px) scale(.94); }
.has-js .ac-stage.is-in .ac-airframe-media {
  opacity: 1; transform: translateY(0) scale(1);
  transition: opacity 1s var(--ease) .12s, transform 1.25s var(--ease) .12s;
  animation: acFloat 7s ease-in-out 1.5s infinite;
}
.has-js .ac-stage:not(.is-in) .hotspot { opacity: 0; }
.has-js .ac-stage:not(.is-in) .hotspot[data-side="left"] { transform: translateX(-64px); }
.has-js .ac-stage:not(.is-in) .hotspot[data-side="right"] { transform: translateX(64px); }
.has-js .ac-stage.is-in .hotspot {
  opacity: 1; transform: translateX(0);
  transition: opacity .72s var(--ease), transform .82s var(--ease),
              border-color .3s var(--ease), background .3s var(--ease), box-shadow .3s var(--ease);
  transition-delay: calc(.18s + (var(--order) * 70ms));
}
@keyframes acFloat {
  0%, 100% { transform: translateY(0) rotateX(0deg); }
  50% { transform: translateY(-10px) rotateX(1.1deg); }
}
@keyframes acScan {
  0%, 100% { top: 19%; opacity: .12; }
  50% { top: 80%; opacity: .58; }
}
@keyframes acZonePulse {
  0%, 100% { opacity: .68; }
  50% { opacity: 1; }
}

.map-svg text { -webkit-user-select: none; user-select: none; }

.ac-readout {
  position: relative; z-index: 5; color: var(--white); margin-top: 6px;
  border-top: 1px solid rgba(140, 210, 255, .2); background: rgba(4, 11, 20, .58);
}
.zone-panel {
  display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  gap: clamp(34px, 6vw, 92px); align-items: start; padding: clamp(26px, 3vw, 42px);
  animation: zoneIn .4s var(--ease) both;
}
.ac-readout h3 { margin: 6px 0 14px; font-size: clamp(22px, 2vw, 30px); }
.ac-readout p { color: var(--silver-400); font-size: 14.5px; max-width: 56ch; }
.ac-readout .rule-list { --hair: rgba(255, 255, 255, .13); }
.ac-readout .text-link { margin-top: 22px; }
@keyframes zoneIn { from { opacity: 0; transform: translateY(10px); } }

.ac-note { margin: 22px 0 0; font-size: 12px; color: var(--fg-muted); }

/* --------------------------------------------------------------------------
   11 · Service cards
   -------------------------------------------------------------------------- */
.svc-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr));
  gap: 1px; background: var(--hair); border: 1px solid var(--hair);
}
.svc-card {
  display: flex; flex-direction: column; background: var(--surface);
  transition: background .3s var(--ease);
}
.svc-card:hover { background: var(--surface-2); }
.svc-media { overflow: hidden; aspect-ratio: 3 / 2; }
.svc-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--ease); }
.svc-card:hover .svc-media img { transform: scale(1.05); }
.svc-body { flex: 1; display: flex; flex-direction: column; padding: 28px 26px 26px; }
.svc-body .mono-label { margin-bottom: 12px; }
.svc-body h3 { margin-bottom: 12px; }
.svc-body p { font-size: 14px; color: var(--fg-muted); }
.svc-go {
  display: inline-flex; align-items: center; gap: 10px; margin-top: auto; padding-top: 20px;
  font-size: 12px; font-weight: 700; color: var(--accent);
}
.svc-go i { font-style: normal; transition: transform .25s var(--ease); }
.svc-card:hover .svc-go i { transform: translate(3px, -3px); }
.svc-card-cta { justify-content: center; background: var(--surface-2); }
.svc-card-cta .svc-body { padding-block: clamp(34px, 4vw, 52px); }
.svc-card-cta h3 { margin-bottom: 14px; }
.svc-grid-3 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); }
@media (min-width: 1025px) { .svc-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.related-more { margin-top: 40px; }
.section-head-center + .svc-grid { margin-top: 0; }
.related-section .section-head { text-align: center; }
.related-section .related-more { display: flex; justify-content: center; }

/* --------------------------------------------------------------------------
   12 · Before / after comparison
   -------------------------------------------------------------------------- */
.compare { position: relative; }
.compare-frame {
  position: relative; aspect-ratio: 4 / 3; overflow: hidden;
  border: 1px solid var(--hair); background: var(--navy-800);
  touch-action: pan-y; cursor: ew-resize; --split: 50%;
}
.compare-pane { position: absolute; inset: 0; }
.compare-pane img { width: 100%; height: 100%; object-fit: cover; }
/* "After" is the base layer; "Before" is clipped over it from the left edge,
   so the divider reads left = before, right = after. */
.compare-b img { filter: saturate(1.06) contrast(1.06); }
.compare-a { z-index: 2; clip-path: inset(0 calc(100% - var(--split)) 0 0); }
.compare-a img { filter: saturate(.42) contrast(.82) brightness(.72) blur(.6px); }
.compare-tag {
  position: absolute; top: 16px; left: 16px; z-index: 3;
  padding: 6px 11px; background: rgba(4, 11, 20, .72);
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 9.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--white);
}
.compare-tag-b { left: auto; right: 16px; color: var(--blue-300); }
.compare-handle {
  position: absolute; top: 0; bottom: 0; left: var(--split); z-index: 4;
  width: 2px; margin-left: -1px; background: var(--white); pointer-events: none;
  box-shadow: 0 0 20px rgba(4, 11, 20, .6);
}
.compare-handle i {
  position: absolute; z-index: 2; top: 50%; left: 50%; width: 0; height: 0;
  border-block: 6px solid transparent;
}
.compare-handle i:first-child { transform: translate(-24px, -50%); border-right: 8px solid var(--white); }
.compare-handle i:last-child { transform: translate(16px, -50%); border-left: 8px solid var(--white); }
.compare-handle::after {
  content: ""; position: absolute; z-index: 1; top: 50%; left: 50%; width: 54px; height: 54px;
  transform: translate(-50%, -50%); border: 1px solid rgba(255, 255, 255, .7); border-radius: 50%;
  background: rgba(4, 11, 20, .5); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.compare-range {
  position: absolute; inset: 0; z-index: 5; width: 100%; height: 100%;
  margin: 0; opacity: 0; cursor: ew-resize; -webkit-appearance: none; appearance: none; background: none;
}
.compare-range:focus-visible { box-shadow: none; }
.compare-frame:has(.compare-range:focus-visible) { outline: 2px solid var(--blue-400); outline-offset: 3px; }
.compare figcaption { margin-top: 14px; font-size: 12px; line-height: 1.55; color: var(--fg-muted); }

.surface-grid {
  display: grid; grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
  gap: clamp(36px, 5vw, 90px); align-items: center;
}
.surface-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 26px; margin-top: 34px; }

/* --------------------------------------------------------------------------
   13 · Programs
   -------------------------------------------------------------------------- */
.programs-teaser { background: var(--paper-2); }
.prog-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
  gap: 1px; background: rgba(255, 255, 255, .12);
  border: 1px solid rgba(255, 255, 255, .12);
}
.prog-card {
  position: relative; display: flex; flex-direction: column;
  min-height: 520px; padding: 0; overflow: hidden;
  background: var(--navy-800); color: var(--white);
}
.prog-card::before {
  content: ""; position: absolute; inset: 0; opacity: 0;
  background: radial-gradient(90% 60% at 50% 0%, rgba(31, 143, 255, .22), transparent 65%);
  transition: opacity .45s var(--ease);
}
.prog-card:hover::before { opacity: 1; }
.prog-card-feature { background: linear-gradient(155deg, #10283f, #071320); }
.prog-media {
  position: relative; z-index: 1; overflow: hidden; flex: none; aspect-ratio: 3 / 1.72;
  background: var(--navy-900);
}
.prog-media::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(180deg, transparent 38%, rgba(4, 11, 20, .82));
}
.prog-media img {
  width: 100%; height: 100%; object-fit: cover;
  filter: saturate(.8) contrast(1.06) brightness(.86);
  transition: transform .8s var(--ease), filter .45s var(--ease);
}
.prog-card:hover .prog-media img { transform: scale(1.045); filter: saturate(.94) contrast(1.04) brightness(.95); }
.prog-media-code {
  position: absolute; z-index: 2; right: 20px; bottom: 14px;
  font-family: Manrope, sans-serif; font-size: 26px; font-weight: 700;
  letter-spacing: -.04em; color: rgba(140, 210, 255, .9);
}
.prog-card-copy {
  position: relative; z-index: 1; display: flex; flex: 1; flex-direction: column;
  padding: 26px 28px 30px;
}
.prog-top { position: relative; margin: 0; }
.prog-top .mono-label { margin: 0; color: var(--silver-500); }
.prog-mono {
  position: relative; margin: 0; flex: 1;
  display: flex; align-items: center; justify-content: center;
  font-family: Manrope, sans-serif; font-size: clamp(72px, 8vw, 124px); font-weight: 800;
  letter-spacing: -.07em; color: transparent;
  -webkit-text-stroke: 1px rgba(140, 210, 255, .32);
  transition: -webkit-text-stroke-color .4s var(--ease), transform .5s var(--ease);
}
.prog-card:hover .prog-mono { -webkit-text-stroke-color: rgba(140, 210, 255, .75); transform: scale(1.04); }
.prog-card h3 { position: relative; margin-bottom: 12px; font-size: 26px; }
.prog-card p { position: relative; margin-bottom: 24px; font-size: 14px; color: var(--silver-400); }
.prog-card .text-link { position: relative; align-self: flex-start; margin-top: auto; }

.choose-grid, .prio-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
  gap: 1px; background: var(--hair); border: 1px solid var(--hair);
}
.choose-card { display: flex; flex-direction: column; background: var(--surface); }
.choose-card > :not(.choose-media) { margin-inline: 28px; }
.choose-card > .mono-label { margin-top: 26px; }
.choose-card > .text-link { margin-bottom: 30px; }
.choose-media { overflow: hidden; aspect-ratio: 3 / 2; }
.choose-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--ease); }
.choose-card:hover .choose-media img { transform: scale(1.04); }
.prio-card { padding: 30px 28px; background: var(--surface); }
.choose-card h3, .prio-card h3 { margin-bottom: 12px; }
.choose-card p, .prio-card p { font-size: 14px; color: var(--fg-muted); }
.choose-card .text-link { margin-top: 22px; }

.table-scroll {
  overflow-x: auto; max-width: 100%; contain: paint;
  border: 1px solid var(--hair); -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
}
.table-hint { display: none; margin: 12px 0 0; font-size: 12px; color: var(--fg-muted); }
.prog-table { min-width: 720px; font-size: 14px; }
.prog-table th, .prog-table td { padding: 16px 18px; text-align: left; border-bottom: 1px solid var(--hair); }
.prog-table thead th {
  vertical-align: bottom; background: var(--surface);
  font-family: Manrope, sans-serif; font-size: 17px; font-weight: 600; color: var(--fg);
}
.prog-table thead .mono-label { display: block; margin-bottom: 6px; }
.prog-table tbody th { font-weight: 500; color: var(--fg-2); }
.prog-table tbody tr:nth-child(odd) { background: rgba(255, 255, 255, .03); }
.prog-table td { text-align: center; width: 20%; }
.cell { font-size: 16px; line-height: 1; }
.cell-yes { color: var(--blue-300); }
.cell-opt { color: var(--silver-400); }
.cell-no { color: var(--steel); }
.table-key {
  display: flex; flex-wrap: wrap; gap: 10px 26px; margin-top: 20px;
  font-size: 12px; color: var(--fg-muted);
}
.table-key li { display: flex; align-items: center; gap: 8px; }

/* --------------------------------------------------------------------------
   14 · Aircraft class selector
   -------------------------------------------------------------------------- */
.cls-wrap {
  display: grid; grid-template-columns: minmax(0, .42fr) minmax(0, 1.58fr);
  border: 1px solid var(--hair); background: var(--navy-850);
}
.cls-tabs { display: flex; flex-direction: column; border-right: 1px solid var(--hair); }
.cls-tab {
  flex: 1; display: block; padding: 24px 24px; border: 0;
  border-bottom: 1px solid var(--hair); background: none; text-align: left; cursor: pointer;
  transition: background .25s var(--ease);
  position: relative;
}
.cls-tab:last-child { border-bottom: 0; }
.cls-tab::before {
  content: ""; position: absolute; inset: 0 auto 0 0; width: 2px;
  background: var(--blue-500); transform: scaleY(0); transition: transform .3s var(--ease);
}
.cls-tab:hover { background: rgba(31, 143, 255, .07); }
.cls-tab[aria-selected="true"] { background: rgba(31, 143, 255, .1); }
.cls-tab[aria-selected="true"]::before { transform: scaleY(1); }
.cls-tab .mono-label { margin: 0 0 8px; }
.cls-tab[aria-selected="true"] .mono-label { color: var(--blue-300); }
.cls-tab strong { display: block; font-family: Manrope, sans-serif; font-size: 17px; font-weight: 600; color: var(--white); }
.cls-tab small { display: block; margin-top: 4px; font-size: 12.5px; color: var(--silver-500); }

.cls-body {
  display: grid; grid-template-columns: minmax(0, .96fr) minmax(0, 1.04fr);
  gap: clamp(30px, 4vw, 64px); align-items: start;
  min-height: 620px; padding: clamp(26px, 3vw, 44px);
}
.cls-panel { animation: zoneIn .35s var(--ease) both; }
.cls-art { display: flex; flex-direction: column; gap: 16px; }
.cls-aircraft-stage {
  position: relative; isolation: isolate; overflow: hidden;
  width: 100%; min-height: 540px; border: 1px solid rgba(140, 210, 255, .16);
  background:
    linear-gradient(rgba(140, 210, 255, .045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(140, 210, 255, .045) 1px, transparent 1px),
    radial-gradient(circle at 50% 45%, rgba(31, 143, 255, .16), transparent 45%),
    #030912;
  background-size: 36px 36px, 36px 36px, auto, auto;
}
.cls-aircraft-stage::before,
.cls-aircraft-stage::after {
  content: ""; position: absolute; z-index: 2; width: 24px; height: 24px;
  border-color: var(--blue-400); opacity: .9;
}
.cls-aircraft-stage::before { inset: 14px auto auto 14px; border-top: 1px solid; border-left: 1px solid; }
.cls-aircraft-stage::after { inset: auto 14px 14px auto; border-right: 1px solid; border-bottom: 1px solid; }
.cls-aircraft-image {
  position: absolute; z-index: 1; top: 50%; left: 50%;
  width: min(94%, 500px); height: 94%; object-fit: contain;
  transform: translate(-50%, -50%); mix-blend-mode: screen;
  filter: drop-shadow(0 26px 32px rgba(0, 0, 0, .42));
  animation: aircraftIn .6s var(--ease) both;
}
.cls-aircraft-turboprop { width: min(98%, 530px); }
.cls-crosshair, .cls-range { position: absolute; z-index: 0; pointer-events: none; }
.cls-crosshair-x {
  top: 50%; left: 7%; right: 7%; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(140, 210, 255, .28) 16%, rgba(140, 210, 255, .28) 84%, transparent);
}
.cls-crosshair-y {
  left: 50%; top: 5%; bottom: 5%; width: 1px;
  background: linear-gradient(transparent, rgba(140, 210, 255, .28) 16%, rgba(140, 210, 255, .28) 84%, transparent);
}
.cls-range {
  border: 1px solid rgba(140, 210, 255, .13); border-radius: 50%;
  top: 50%; left: 50%; transform: translate(-50%, -50%);
}
.cls-range-a { width: 58%; aspect-ratio: 1; }
.cls-range-b { width: 86%; aspect-ratio: 1; border-style: dashed; }
.cls-stage-index, .cls-stage-bearing, .cls-stage-caption {
  position: absolute; z-index: 3; margin: 0; color: rgba(185, 198, 210, .72);
}
.cls-stage-index { top: 18px; left: 22px; }
.cls-stage-bearing { top: 18px; right: 22px; }
.cls-stage-caption {
  left: 22px; bottom: 18px; padding-left: 18px;
}
.cls-stage-caption::before {
  content: ""; position: absolute; left: 0; top: 50%; width: 8px; height: 1px;
  background: var(--blue-400);
}
@keyframes aircraftIn {
  from { opacity: 0; transform: translate(-50%, -47%) scale(.97); }
  to { opacity: 1; transform: translate(-50%, -50%) scale(1); }
}
/* --- 3D viewer ------------------------------------------------------------ */
.cls-canvas {
  position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%;
  display: block; opacity: 0; transition: opacity .5s var(--ease);
  touch-action: pan-y; cursor: grab;
}
.cls-canvas:active { cursor: grabbing; }
[data-viewer-mode="3d"] .cls-canvas { opacity: 1; }
[data-viewer-mode="3d"] .cls-aircraft-image { display: none; }
.cls-aircraft-stage:focus-visible { outline: 2px solid var(--blue-400); outline-offset: 3px; }

.cls-hotspots { position: absolute; inset: 0; z-index: 4; pointer-events: none; }
/* Marker first, label on demand — five labelled pills collide badly once the
   aircraft is small in a portrait stage. */
.cls-hotspot {
  position: absolute; left: var(--hx, 50%); top: var(--hy, 50%);
  transform: translate(-50%, -50%); pointer-events: auto;
  display: inline-flex; align-items: center; gap: 0;
  padding: 5px; border: 1px solid rgba(140, 210, 255, .34);
  border-radius: 999px; background: rgba(4, 11, 20, .82);
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  color: var(--silver-200); font-size: 11px; line-height: 1.1; white-space: nowrap;
  cursor: pointer; opacity: var(--h-fade, 1);
  transition: border-color .2s var(--ease), background .2s var(--ease),
              opacity .3s var(--ease), transform .2s var(--ease), gap .2s var(--ease);
}
.cls-hotspot-label {
  max-width: 0; overflow: hidden; opacity: 0;
  transition: max-width .26s var(--ease), opacity .2s var(--ease), padding .26s var(--ease);
}
.cls-hotspot:hover, .cls-hotspot:focus-visible, .cls-hotspot[aria-pressed="true"] {
  gap: 8px; padding-right: 11px; z-index: 5;
}
.cls-hotspot:hover .cls-hotspot-label,
.cls-hotspot:focus-visible .cls-hotspot-label,
.cls-hotspot[aria-pressed="true"] .cls-hotspot-label { max-width: 150px; opacity: 1; }
.cls-hotspot:hover { border-color: var(--blue-400); transform: translate(-50%, -50%) scale(1.05); }
.cls-hotspot[aria-pressed="true"] {
  border-color: var(--blue-400); background: rgba(31, 143, 255, .26); color: #fff;
}
.cls-hotspot.is-behind { z-index: 3; }
.cls-hotspot-dot {
  position: relative; width: 9px; height: 9px; flex: none; border-radius: 50%;
  border: 1px solid rgba(140, 210, 255, .7); background: rgba(140, 210, 255, .25);
  transition: background .2s var(--ease), box-shadow .2s var(--ease);
}
.cls-hotspot[aria-pressed="true"] .cls-hotspot-dot {
  background: var(--blue-300); box-shadow: 0 0 10px var(--blue-400);
}
/* Selected marker keeps a slow locator pulse so the lit zone is easy to find. */
.cls-hotspot[aria-pressed="true"] .cls-hotspot-dot::after {
  content: ""; position: absolute; inset: -4px;
  border: 1px solid var(--blue-400); border-radius: 50%;
  animation: hsPulse 2.4s var(--ease) infinite;
}
@keyframes hsPulse {
  0% { opacity: .85; transform: scale(.7); }
  100% { opacity: 0; transform: scale(1.9); }
}

.cls-viewer-bar {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 12px 18px;
}
.cls-viewer-hint { margin: 0; color: var(--silver-500); }
.cls-viewer-actions { display: flex; align-items: center; gap: 6px; }
.cls-nudge, .cls-reset {
  border: 1px solid rgba(255, 255, 255, .16); background: rgba(255, 255, 255, .03);
  color: var(--silver-200); cursor: pointer;
  transition: border-color .2s var(--ease), background .2s var(--ease), color .2s var(--ease);
}
.cls-nudge { width: 34px; height: 34px; display: grid; place-items: center; font-size: 10px; }
.cls-reset {
  height: 34px; padding: 0 14px;
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 11px; letter-spacing: .1em; text-transform: uppercase;
}
.cls-nudge:hover, .cls-reset:hover {
  border-color: var(--blue-400); background: rgba(31, 143, 255, .12); color: #fff;
}
/* Without a live 3D scene these controls have nothing to drive. */
[data-viewer-mode="image"] .cls-viewer-bar { display: none; }
[data-viewer-mode="image"] .cls-hotspot { cursor: pointer; }
/* Without WebGL there is no scene to orbit, so the fallback must read as an
   intentional illustrated profile rather than a broken viewer: drop the dead canvas
   (it would otherwise keep a grab cursor over the static render) and the instrument
   chrome that asserts a live 3D view. The control bar is already hidden above. */
[data-viewer-mode="image"] .cls-canvas,
[data-viewer-mode="image"] .cls-stage-bearing,
[data-viewer-mode="image"] .cls-crosshair,
[data-viewer-mode="image"] .cls-range { display: none; }
[data-viewer-mode="image"] .cls-aircraft-stage { cursor: default; }

.cls-zone-readout {
  margin-top: clamp(22px, 3vw, 32px); padding-top: clamp(20px, 2.4vw, 28px);
  border-top: 1px solid rgba(255, 255, 255, .13);
}
.cls-zone-panel { animation: zoneIn .3s var(--ease) both; }
.cls-zone-panel h3 { margin: 4px 0 10px; font-size: clamp(17px, 1.6vw, 21px); }
.cls-zone-panel p { font-size: 14px; color: var(--silver-400); }
.cls-zone-panel .text-link { margin-top: 16px; }
.cls-zone-default p:last-child { color: var(--silver-500); }

.cls-copy .lead { color: var(--silver-200); }
.cls-copy .rule-list { --hair: rgba(255, 255, 255, .13); }
.cls-typical {
  margin: 24px 0 0; padding-top: 18px; border-top: 1px solid rgba(255, 255, 255, .13);
  font-size: 14px; color: var(--silver-300);
}
.cls-typical .mono-label { display: block; margin-bottom: 6px; }

.acl-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
  gap: 1px; background: var(--hair); border: 1px solid var(--hair);
}
.acl-card { padding: 30px 28px; background: var(--surface); }
.acl-card h3 { margin-bottom: 6px; }
.acl-examples {
  margin-bottom: 16px; font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 11px; letter-spacing: .08em; color: var(--fg-muted);
}
.acl-card p { font-size: 14px; }
.acl-card .cls-typical { border-color: var(--hair); color: var(--fg-2); }

/* --------------------------------------------------------------------------
   15 · Coverage map
   -------------------------------------------------------------------------- */
.map-stage {
  display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, .7fr);
  gap: clamp(28px, 4vw, 60px); align-items: center;
  padding: clamp(20px, 3vw, 38px); border: 1px solid var(--hair);
  background: radial-gradient(100% 80% at 25% 30%, rgba(31, 143, 255, .08), transparent 62%), var(--navy-850);
}
.map-plate { position: relative; aspect-ratio: 1000 / 714; }
.map-svg { width: 100%; height: 100%; }
.map-water path { fill: rgba(31, 143, 255, .09); stroke: rgba(140, 210, 255, .22); stroke-width: 1; }
.map-river { fill: none !important; stroke: rgba(140, 210, 255, .3) !important; stroke-width: 2 !important; }
.map-ring { fill: none; stroke: rgba(143, 161, 179, .16); stroke-width: 1; }
.map-rings line { stroke: rgba(143, 161, 179, .3); stroke-width: 1; }
.map-city-label {
  fill: rgba(143, 161, 179, .75); font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 15px; letter-spacing: .2em;
}
.map-water-label {
  fill: rgba(140, 210, 255, .5); font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 14px; letter-spacing: .22em;
}
.map-note-label {
  fill: rgba(143, 161, 179, .45); font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 12px; letter-spacing: .18em;
}
.map-city-dot { fill: rgba(143, 161, 179, .5); }

.map-pins { position: absolute; inset: 0; }
.pin {
  position: absolute; left: var(--px); top: var(--py); transform: translate(-50%, -50%);
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  padding: 8px; border: 0; background: none; cursor: pointer;
}
.pin-mark {
  position: relative; width: 12px; height: 12px; border-radius: 50%;
  background: var(--silver-500); box-shadow: 0 0 0 3px rgba(4, 11, 20, .8);
  transition: background .25s var(--ease), box-shadow .25s var(--ease), transform .25s var(--ease);
}
.pin-code {
  font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: 11px; font-weight: 500;
  letter-spacing: .1em; color: var(--silver-400); transition: color .25s var(--ease);
}
.pin:hover .pin-mark { background: var(--blue-400); transform: scale(1.15); }
.pin:hover .pin-code { color: var(--white); }
.pin[aria-pressed="true"] .pin-mark {
  background: var(--blue-400); transform: scale(1.2);
  box-shadow: 0 0 0 3px rgba(4, 11, 20, .8), 0 0 0 10px rgba(31, 143, 255, .18);
}
.pin[aria-pressed="true"] .pin-mark::after {
  content: ""; position: absolute; inset: -8px; border: 1px solid var(--blue-400); border-radius: 50%;
  animation: ping 2.6s var(--ease) infinite;
}
.pin[aria-pressed="true"] .pin-code { color: var(--blue-300); }

.map-readout { color: var(--white); }
.map-panel { animation: zoneIn .35s var(--ease) both; }
.map-panel h3 { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; margin: 6px 0 4px; }
.map-code {
  font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: 30px; font-weight: 500;
  letter-spacing: .02em; color: var(--blue-300);
}
.map-city { margin-bottom: 14px !important; font-size: 12.5px; color: var(--silver-500) !important; }
.map-readout p { color: var(--silver-400); font-size: 14px; }
.map-readout .rule-list { --hair: rgba(255, 255, 255, .13); }

.cov-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr));
  gap: 1px; background: var(--hair); border: 1px solid var(--hair);
}
.cov-card { padding: 30px 28px; background: var(--surface); scroll-margin-top: 110px; }
.cov-card-head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; }
.cov-code {
  margin: 0; font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 34px; font-weight: 500; color: var(--accent); letter-spacing: .02em;
}
.cov-card-head .mono-label { margin: 0; text-align: right; }
.cov-card h3 { margin: 18px 0 4px; font-size: 19px; }
.cov-city { margin-bottom: 14px; font-size: 12.5px; color: var(--fg-muted); }
.cov-card p { font-size: 14px; }

/* --------------------------------------------------------------------------
   16 · Dispatch journey
   -------------------------------------------------------------------------- */
.jr-track {
  position: relative; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr));
  margin-bottom: clamp(36px, 4vw, 60px);
}
.jr-line {
  position: absolute; left: 0; right: 0; top: 14px; height: 1px; background: var(--hair-strong);
}
.jr-line i {
  display: block; height: 100%; width: 8.33%;
  background: var(--blue-500); box-shadow: 0 0 12px rgba(31, 143, 255, .6);
  transition: width .45s var(--ease);
}
.jr-step {
  position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 12px;
  padding: 0 16px 0 0; border: 0; background: none; text-align: left; cursor: pointer;
}
.jr-node {
  display: grid; place-items: center; width: 29px; height: 29px;
  border: 1px solid var(--hair-strong); border-radius: 50%; background: var(--paper);
  transition: border-color .3s var(--ease), background .3s var(--ease);
}
.section-dark .jr-node { background: var(--navy-900); }
.jr-node i {
  width: 7px; height: 7px; border-radius: 50%; background: var(--fg-muted);
  transition: background .3s var(--ease), transform .3s var(--ease);
}
.jr-step:hover .jr-node { border-color: var(--blue-400); }
.jr-step[aria-selected="true"] .jr-node { border-color: var(--blue-400); }
.jr-step[aria-selected="true"] .jr-node i { background: var(--blue-400); transform: scale(1.3); }
.jr-num { margin: 0; }
.jr-step[aria-selected="true"] .jr-num { color: var(--accent); }
.jr-name { font-size: 13.5px; font-weight: 500; line-height: 1.35; color: var(--fg-muted); transition: color .3s; }
.jr-step[aria-selected="true"] .jr-name { color: var(--fg); }

.jr-panel {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(24px, 4vw, 64px); align-items: start;
  padding-top: clamp(28px, 3vw, 44px); border-top: 1px solid var(--hair);
  animation: zoneIn .35s var(--ease) both;
}
.jr-panel h3 { margin: 6px 0 16px; font-size: clamp(24px, 2.6vw, 38px); font-weight: 500; letter-spacing: -.03em; }
.jr-panel .rule-list { margin-top: 0; }

/* --------------------------------------------------------------------------
   17 · Editorial blocks
   -------------------------------------------------------------------------- */
.svc-overview-grid {
  display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr);
  gap: clamp(36px, 5vw, 90px); align-items: start;
}
.svc-overview-grid h2 { margin-bottom: 22px; }
.svc-overview-grid > div > p { font-size: 15px; }
.svc-spec {
  padding: 30px 28px; border: 1px solid var(--hair); background: var(--surface);
  position: sticky; top: 108px;
}

.ps-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 290px), 1fr));
  gap: 1px; background: var(--hair); border: 1px solid var(--hair);
}
.ps-grid li { padding: 30px 28px 34px; background: var(--navy-800); }
.section:not(.section-dark) .ps-grid li { background: var(--surface); }
.ps-num { display: block; margin: 0 0 26px; color: var(--accent); }
.ps-grid h3 { margin-bottom: 10px; }
.ps-grid p { margin: 0; font-size: 14px; color: var(--fg-muted); }

.feat-stack { display: grid; gap: clamp(56px, 7vw, 120px); }
.feat-row {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(30px, 5vw, 80px); align-items: center;
}
.feat-row-flip .feat-media { order: 2; }
.feat-media { overflow: hidden; border: 1px solid var(--hair); }
.feat-media img { width: 100%; height: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.feat-copy h3 { margin-bottom: 16px; font-size: clamp(22px, 2.4vw, 32px); font-weight: 500; letter-spacing: -.03em; }
.feat-copy p { font-size: 15px; }

.limits-section { background: var(--paper); }
.limits-card {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(28px, 4vw, 64px); align-items: start;
  padding: clamp(30px, 4vw, 56px);
  background: var(--navy-900); color: var(--white);
  --fg: #fff; --fg-2: var(--silver-200); --fg-muted: var(--silver-400);
  --hair: rgba(255, 255, 255, .14); --accent: var(--blue-300);
  border-left: 2px solid var(--blue-500);
}
.limits-card h2 { margin-bottom: 16px; font-size: clamp(26px, 3vw, 42px); }
.limits-card .lead { color: var(--silver-300); }
.limits-card .rule-list { margin-top: 0; }

.split-cols {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr));
  gap: 1px; background: var(--hair); border: 1px solid var(--hair);
}
.split-col { padding: clamp(28px, 3vw, 44px); background: var(--navy-800); }
.split-cols-light .split-col { background: var(--surface); }
.split-col h3 { margin-bottom: 14px; font-size: clamp(20px, 2vw, 26px); }
.split-col p { font-size: 14.5px; }

.discretion-grid {
  display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: clamp(36px, 5vw, 90px); align-items: center;
}
.discretion-media { overflow: hidden; border: 1px solid var(--hair); }
.discretion-media img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.discretion-copy blockquote p {
  margin: 0 0 22px; font-family: Manrope, sans-serif;
  font-size: clamp(28px, 3.4vw, 50px); font-weight: 500; line-height: 1.12; letter-spacing: -.04em;
  color: var(--fg);
}
.discretion-copy .text-link { margin-top: 30px; }

/* --------------------------------------------------------------------------
   18 · FAQ
   -------------------------------------------------------------------------- */
.faq-layout {
  display: grid; grid-template-columns: minmax(0, .62fr) minmax(0, 1.38fr);
  gap: clamp(36px, 6vw, 110px); align-items: start;
}
.faq-side .section-head { margin-bottom: 0; position: sticky; top: 118px; }
.faq-list { border-top: 1px solid var(--hair); }
.faq-item { border-bottom: 1px solid var(--hair); }
.faq-q { margin: 0; font-size: inherit; font-weight: inherit; }
.faq-q button {
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
  width: 100%; min-height: 84px; padding: 20px 0; border: 0; background: none;
  text-align: left; cursor: pointer; color: var(--fg);
  transition: color .2s var(--ease);
}
.faq-q button:hover { color: var(--accent); }
.faq-q button span:first-child {
  font-family: Manrope, sans-serif; font-size: clamp(16px, 1.4vw, 19px); font-weight: 600;
  letter-spacing: -.015em; line-height: 1.35;
}
.faq-sign { position: relative; width: 18px; height: 18px; flex: none; }
.faq-sign::before, .faq-sign::after {
  content: ""; position: absolute; top: 50%; left: 0; width: 18px; height: 1.5px;
  background: currentColor; transition: transform .3s var(--ease);
}
.faq-sign::after { transform: rotate(90deg); }
.faq-q button[aria-expanded="true"] .faq-sign::after { transform: rotate(0); }
.faq-q button[aria-expanded="true"] { color: var(--accent); }
.faq-a-inner { padding: 0 12% 30px 0; }
.faq-a p { margin: 0; font-size: 15px; line-height: 1.68; color: var(--fg-muted); }
.faq-a.is-animating { overflow: hidden; }

/* --------------------------------------------------------------------------
   19 · CTA band + footer
   -------------------------------------------------------------------------- */
.cta-band {
  position: relative; display: flex; align-items: center;
  min-height: clamp(420px, 52vw, 620px); padding-block: 80px;
  background: var(--navy-900); color: var(--white); overflow: hidden;
}
/* Photograph-free by design — the band runs on all 20 pages, so any photo here
   would echo some page's hero. Built from the PAC palette instead. */
.cta-band {
  background:
    radial-gradient(130% 92% at 8% 6%, rgba(31, 143, 255, .17), transparent 58%),
    radial-gradient(95% 80% at 96% 96%, rgba(10, 99, 194, .16), transparent 62%),
    linear-gradient(180deg, #06111e 0%, #040c16 46%, #02070d 100%);
}
.cta-band-art { position: absolute; inset: 0; pointer-events: none; }

/* Instrument grid, dissolving toward the copy so the type stays clean. */
.cta-grid {
  position: absolute; inset: 0; opacity: .5;
  background-image:
    linear-gradient(rgba(140, 210, 255, .13) 1px, transparent 1px),
    linear-gradient(90deg, rgba(140, 210, 255, .13) 1px, transparent 1px);
  background-size: 74px 74px;
  -webkit-mask-image: radial-gradient(105% 90% at 88% 78%, #000 8%, transparent 72%);
  mask-image: radial-gradient(105% 90% at 88% 78%, #000 8%, transparent 72%);
}

/* Hangar-door horizon: a low band of light along the floor line. */
.cta-horizon {
  position: absolute; left: -6%; right: -6%; bottom: 16%; height: 1px;
  background: linear-gradient(90deg,
    transparent, rgba(140, 210, 255, .12) 12%, rgba(160, 220, 255, .68) 52%,
    rgba(140, 210, 255, .12) 88%, transparent);
  box-shadow: 0 0 26px 3px rgba(31, 143, 255, .3);
}
.cta-beam {
  position: absolute; left: 0; right: 0; bottom: 0; height: 34%;
  background: linear-gradient(0deg, rgba(31, 143, 255, .16), transparent 78%);
  -webkit-mask-image: radial-gradient(70% 100% at 52% 100%, #000, transparent 74%);
  mask-image: radial-gradient(70% 100% at 52% 100%, #000, transparent 74%);
}

/* Flight vector + approach ticks — original line work, not an icon set. */
.cta-vector { position: absolute; inset: 0; width: 100%; height: 100%; }
.cta-arc { fill: none; stroke: url(#ctaArc); stroke-width: 1.4; }
.cta-arc-soft { stroke-width: 1; opacity: .45; }
.cta-ticks path { fill: none; stroke: rgba(140, 210, 255, .3); stroke-width: 1.6; }

/* The mark itself, carried as a watermark rather than a second lockup — the
   footer logo sits only a few hundred pixels below this band. */
.cta-watermark {
  position: absolute; right: 4%; top: 50%; width: min(34vw, 500px); height: auto;
  transform: translateY(-52%); opacity: .12;
  /* Fade only the leading edge, so the mark stays whole rather than cropped. */
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 28%, #000 100%);
  mask-image: linear-gradient(90deg, transparent, #000 28%, #000 100%);
}

.cta-corner { position: absolute; width: 26px; height: 26px; border-color: rgba(140, 210, 255, .5); }
.cta-corner-tl { top: 26px; left: 26px; border-top: 1px solid; border-left: 1px solid; }
.cta-corner-br { bottom: 26px; right: 26px; border-bottom: 1px solid; border-right: 1px solid; }
.cta-band-inner { position: relative; z-index: 2; max-width: 760px; }
.cta-band .mono-label { color: var(--blue-300); }
.cta-band h2 { max-width: 16ch; }
.cta-band h2 em { color: var(--blue-300); }
.cta-band .lead { max-width: 52ch; margin-top: 22px; color: rgba(255, 255, 255, .76); }

.site-footer {
  padding: clamp(60px, 7vw, 100px) 0 28px;
  background: #030910; color: var(--white);
  --hair: rgba(255, 255, 255, .1);
}
.footer-top {
  display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 2.05fr);
  gap: clamp(36px, 5vw, 90px); padding-bottom: clamp(44px, 5vw, 72px);
  border-bottom: 1px solid var(--hair);
}
.footer-brand p { max-width: 42ch; margin: 24px 0 20px; font-size: 13.5px; color: var(--silver-400); }
.footer-contact {
  display: flex; flex-direction: column; align-items: flex-start; gap: 7px;
  max-width: 42ch; margin: 0 0 28px; font-style: normal;
  font-size: 12.5px; line-height: 1.55; color: var(--silver-500);
}
.footer-contact a { color: var(--silver-300); transition: color .2s var(--ease); }
.footer-contact a:hover { color: var(--blue-300); }
.footer-brand .button { border-color: rgba(255, 255, 255, .28); color: var(--white); }
.footer-brand .button:hover { border-color: var(--blue-400); color: var(--blue-300); }
.footer-cols {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr));
  gap: 30px;
}
.footer-col { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.footer-col .mono-label { margin: 0 0 8px; color: var(--silver-500); }
.footer-col a { font-size: 13px; color: var(--silver-300); transition: color .2s var(--ease); }
.footer-col a:hover { color: var(--blue-300); }

.footer-airports { padding: 34px 0; border-bottom: 1px solid var(--hair); }
.footer-airports .mono-label { color: var(--silver-500); }
.footer-airports ul { display: flex; flex-wrap: wrap; gap: 12px; }
.footer-airports a {
  display: flex; align-items: baseline; gap: 10px;
  padding: 10px 16px; border: 1px solid var(--hair);
  transition: border-color .25s var(--ease), background .25s var(--ease);
}
.footer-airports a:hover { border-color: var(--blue-500); background: rgba(31, 143, 255, .1); }
.footer-airports strong {
  font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: 14px; font-weight: 500;
  letter-spacing: .06em; color: var(--blue-300);
}
.footer-airports span { font-size: 12px; color: var(--silver-500); }

.footer-bottom {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 16px 34px; padding-top: 26px;
}
.footer-bottom p { margin: 0; font-size: 11.5px; color: var(--silver-500); }
.footer-bottom .mono-label { margin: 0; font-size: 10px; }
.footer-note { max-width: 52ch; flex: 1 1 320px; }
.footer-credit { flex: 1 1 100%; margin-top: 4px; }

/* --------------------------------------------------------------------------
   20 · Drawer + forms
   -------------------------------------------------------------------------- */
.drawer { position: fixed; inset: 0; z-index: 300; display: grid; grid-template-columns: 1fr min(620px, 100vw); }
.drawer-backdrop {
  background: rgba(2, 6, 12, .72); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
  opacity: 0; animation: fadeIn .35s var(--ease) forwards; border: 0;
}
@keyframes fadeIn { to { opacity: 1; } }
.drawer-panel {
  height: 100%; overflow-y: auto; padding: clamp(28px, 4vw, 52px);
  background: var(--paper); color: var(--ink);
  animation: drawerIn .4s var(--ease) both;
}
@keyframes drawerIn { from { transform: translateX(100%); } }
.drawer-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; margin-bottom: 34px; }
.drawer-head h2 { font-size: clamp(26px, 3vw, 36px); letter-spacing: -.035em; }
.drawer-close {
  flex: none; width: 44px; height: 44px; padding: 0; border-radius: 50%;
  border: 1px solid rgba(10, 21, 34, .2); background: none; cursor: pointer;
  font-size: 26px; line-height: 1; color: var(--ink-muted);
  transition: border-color .2s, color .2s;
}
.drawer-close:hover { border-color: var(--blue-600); color: var(--blue-600); }

.field-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 22px 20px; }
.field { margin: 0; display: flex; flex-direction: column; gap: 8px; }
.field-wide { grid-column: 1 / -1; }
.field label, .field > label {
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-muted);
}
.req { color: var(--blue-600); }
.opt { text-transform: none; letter-spacing: 0; color: #626c78; }
.field input, .field select, .field textarea {
  width: 100%; padding: 11px 2px 12px;
  border: 0; border-bottom: 1px solid rgba(10, 21, 34, .22); border-radius: 0;
  background: transparent; font-size: 15px; color: var(--ink);
  transition: border-color .2s var(--ease);
}
.field select { padding-right: 20px; }
.field textarea { resize: vertical; min-height: 90px; }
.field input:focus, .field select:focus, .field textarea:focus {
  outline: none; box-shadow: none; border-bottom-color: var(--blue-600); border-bottom-width: 2px;
  padding-bottom: 11px;
}
.field input[aria-invalid="true"], .field select[aria-invalid="true"] { border-bottom-color: #d4443a; }
.field-err { font-size: 12px; color: #b8352b; letter-spacing: 0; text-transform: none; font-family: inherit; }
.field-hint { margin-bottom: 18px; font-size: 13.5px; color: var(--ink-muted); }

.dispatch-form fieldset { margin: 0 0 42px; padding: 0; border: 0; }
.dispatch-form legend {
  display: flex; align-items: center; gap: 14px; width: 100%; margin-bottom: 24px; padding-bottom: 14px;
  border-bottom: 1px solid rgba(10, 21, 34, .14);
  font-family: Manrope, sans-serif; font-size: 19px; font-weight: 600; letter-spacing: -.02em;
}
.dispatch-form legend .mono-label { margin: 0; }

.check-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 10px; margin-bottom: 28px; }
.check {
  position: relative; display: flex; align-items: center; gap: 12px;
  padding: 13px 15px; border: 1px solid rgba(10, 21, 34, .14); cursor: pointer;
  transition: border-color .2s, background .2s;
}
.check:hover { border-color: var(--blue-600); }
/* The real input covers the whole label so the entire chip is the hit target. */
.check input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.check-box { flex: none; width: 17px; height: 17px; border: 1px solid rgba(10, 21, 34, .3); position: relative; transition: .2s var(--ease); }
.check-box::after {
  content: ""; position: absolute; inset: 3px; background: var(--blue-600);
  transform: scale(0); transition: transform .2s var(--ease);
}
.check input:checked + .check-box { border-color: var(--blue-600); }
.check input:checked + .check-box::after { transform: scale(1); }
.check input:focus-visible + .check-box { box-shadow: var(--ring-light); }
.check-text { font-size: 14px; }
.check:has(input:checked) { border-color: var(--blue-600); background: rgba(31, 143, 255, .06); }

/* Spam honeypot: off-screen rather than display:none, which bots detect. */
.hp-field {
  position: absolute; left: -9999px; top: auto;
  width: 1px; height: 1px; overflow: hidden;
}
.form-submit { padding-top: 8px; }
.form-note { margin: 16px 0 0; font-size: 12px; line-height: 1.55; color: var(--ink-muted); }
.form-note a { color: var(--blue-600); text-decoration: underline; }
.form-status { margin: 0 0 24px; font-size: 13.5px; color: #b8352b; }
.form-status:empty { display: none; }

.form-done { padding: 40px 0; text-align: center; }
.form-done-mark {
  width: 62px; height: 62px; margin: 0 auto 22px; display: grid; place-items: center;
  border-radius: 50%; background: var(--blue-500); color: var(--navy-900); font-size: 24px;
}
.form-done h2, .form-done h3 { margin-bottom: 14px; font-size: clamp(26px, 3vw, 38px); }
.form-done p { max-width: 52ch; margin-inline: auto; margin-bottom: 26px; color: var(--ink-muted); }
.form-done-page { padding: clamp(60px, 8vw, 110px) 0; background: var(--paper-2); }

.form-layout {
  display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(0, .55fr);
  gap: clamp(36px, 5vw, 80px); align-items: start;
}
.form-aside { display: grid; gap: 20px; position: sticky; top: 108px; }
.aside-card { padding: 26px 24px; border: 1px solid var(--hair); background: var(--surface); }
.aside-card .rule-list { margin-top: 0; }
.aside-card-dark {
  background: var(--navy-900); color: var(--white);
  --hair: rgba(255, 255, 255, .14); --fg-2: var(--silver-300); --accent: var(--blue-300);
}
.aside-card-dark p { color: var(--silver-400); font-size: 13.5px; }
.aside-codes { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px !important; }
.aside-codes span {
  padding: 5px 10px; border: 1px solid rgba(255, 255, 255, .18);
  font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: 11px; letter-spacing: .08em;
  color: var(--blue-300);
}

.dispatch-hero {
  padding-top: 150px; padding-bottom: clamp(50px, 6vw, 84px);
  background:
    radial-gradient(80% 100% at 80% 0%, rgba(31, 143, 255, .16), transparent 62%),
    var(--navy-900);
  color: var(--white);
  --fg: #fff; --fg-2: var(--silver-200); --fg-muted: var(--silver-400);
  --hair: rgba(255, 255, 255, .14); --accent: var(--blue-300);
}
.dispatch-hero-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: clamp(36px, 5vw, 84px); align-items: start; }
.dispatch-hero h1 em { color: var(--blue-300); }
.dispatch-hero .lead { max-width: 54ch; margin-top: 22px; color: rgba(255, 255, 255, .76); }
.dispatch-side { padding: 30px 28px; border: 1px solid rgba(255, 255, 255, .14); background: rgba(255, 255, 255, .03); }
.dispatch-steps { display: grid; gap: 18px; }
.dispatch-steps li { display: grid; grid-template-columns: 30px 1fr; gap: 14px; }
.dispatch-steps .mono-label { margin: 0; color: var(--blue-400); padding-top: 2px; }
.dispatch-steps strong { display: block; font-family: Manrope, sans-serif; font-size: 15px; font-weight: 600; }
.dispatch-steps p { margin: 2px 0 0; font-size: 13px; line-height: 1.5; color: var(--silver-400); }

/* --------------------------------------------------------------------------
   21 · 404
   -------------------------------------------------------------------------- */
.nf-section {
  display: flex; align-items: center; min-height: 100svh;
  padding: 150px 0 90px; background: var(--navy-900); color: var(--white);
}
.nf-inner h1 { margin-bottom: 24px; }
.nf-inner h1 em { color: var(--blue-300); }
.nf-inner .lead { color: var(--silver-300); }
.nf-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
  gap: 34px; margin: 44px 0;
  padding: 34px 0; border-top: 1px solid rgba(255, 255, 255, .14); border-bottom: 1px solid rgba(255, 255, 255, .14);
}
.nf-grid .mono-label { color: var(--silver-500); }
.nf-grid a { font-size: 14px; color: var(--silver-300); line-height: 2.1; }
.nf-grid a:hover { color: var(--blue-300); }

/* --------------------------------------------------------------------------
   22 · Reveal
   -------------------------------------------------------------------------- */
.has-js .reveal { opacity: 0; transform: translateY(22px); }
.has-js .reveal.is-in {
  opacity: 1; transform: none;
  transition: opacity .85s var(--ease), transform .85s var(--ease);
  transition-delay: var(--reveal-delay, 0ms);
}

/* --------------------------------------------------------------------------
   23 · Responsive
   -------------------------------------------------------------------------- */
@media (max-width: 1180px) {
  .brand-logo { width: 176px; }
  .nav-link { font-size: 8px; padding-inline: 7px; }
  .nav-clock { display: none; }
  .ac-service-layout { grid-template-columns: minmax(190px, 1fr) minmax(300px, 370px) minmax(190px, 1fr); }
  .form-layout { grid-template-columns: minmax(0, 1.3fr) minmax(0, .7fr); }
}

@media (max-width: 1024px) {
  html { scroll-padding-top: 84px; }
  .site-header { height: 70px; }
  .desktop-nav { display: none; }
  .menu-toggle { display: grid; place-items: center; }
  .nav-actions { margin-left: auto; }

  .hero-inner { grid-template-columns: minmax(0, 1fr); align-items: end; padding-bottom: 34px; }
  .hero-card { display: none; }
  .hero-rail-inner { grid-template-columns: repeat(2, minmax(0, 1fr)); min-height: 0; }
  .rail-item { padding: 14px 18px; }
  .rail-item:nth-child(3), .rail-scroll { display: none; }

  .page-hero-grid { grid-template-columns: minmax(0, 1fr); }
  .page-hero-aside { display: none; }

  .principles-grid, .surface-grid, .discretion-grid, .svc-overview-grid,
  .faq-layout, .form-layout, .dispatch-hero-grid, .section-head-split {
    grid-template-columns: minmax(0, 1fr);
  }
  .section-head-split { gap: 20px; align-items: start; }
  .svc-spec, .form-aside, .faq-side .section-head { position: static; }
  .faq-a-inner { padding-right: 0; }

  .map-stage { grid-template-columns: minmax(0, 1fr); }
  .map-plate { max-width: 720px; margin-inline: auto; width: 100%; }
  .ac-service-layout { grid-template-columns: repeat(2, minmax(0, 1fr)); min-height: 0; }
  .ac-airframe { grid-column: 1 / -1; grid-row: 1; min-height: 690px; }
  .ac-service-column { grid-row: 2; }
  .ac-service-left { grid-column: 1; }
  .ac-service-right { grid-column: 2; }
  .cls-wrap { grid-template-columns: minmax(0, 1fr); }
  .cls-tabs { flex-direction: row; overflow-x: auto; border-right: 0; border-bottom: 1px solid var(--hair); }
  .cls-tab { min-width: 190px; border-bottom: 0; border-right: 1px solid var(--hair); }
  .cls-tab::before { inset: auto 0 0 auto; width: 100%; height: 2px; transform: scaleX(0); }
  .cls-tab[aria-selected="true"]::before { transform: scaleX(1); }

  .jr-track { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 30px; }
  .jr-line { display: none; }
  .jr-panel { grid-template-columns: minmax(0, 1fr); }

  .feat-row, .limits-card, .cls-body { grid-template-columns: minmax(0, 1fr); }
  .cls-body { min-height: 0; }
  .cls-aircraft-stage { width: min(100%, 680px); min-height: 600px; margin-inline: auto; }
  .feat-row-flip .feat-media { order: 0; }
  .footer-top { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 780px) {
  :root { --pad-y: clamp(60px, 11vw, 84px); }
  .hero { min-height: 600px; }
  .hero-video-toggle { top: 84px; right: 20px; }
  .hero-media img, .hero-media video { object-position: 70% center; }
  .hero-scrim {
    background:
      linear-gradient(180deg, rgba(4, 11, 20, .04) 0%, rgba(238, 244, 248, .14) 28%, rgba(238, 244, 248, .92) 70%);
  }
  .hero-inner { padding-top: 96px; }
  .hero-hangar-lights { width: 76%; height: 24%; }
  .hero-beacon-nose { left: 44%; top: 43%; }
  .hero-beacon-wing, .hero-beacon-floor { display: none; }
  .hero-actions { flex-direction: column; align-items: stretch; gap: 18px; }
  .hero-actions .button { width: 100%; }
  .hero-actions .text-link { align-self: flex-start; }
  .page-hero { min-height: 520px; padding-top: 104px; }

  .ac-stage { padding: 16px; }
  .ac-service-layout { gap: 22px 14px; }
  .ac-airframe { min-height: 610px; }
  .ac-airframe-media { width: min(76vw, 360px); }
  .ac-service-column { gap: 10px; }
  .hotspot { min-height: 62px; padding: 12px 14px; }
  .zone-panel { grid-template-columns: minmax(0, 1fr); gap: 18px; }

  .map-pins .pin { padding: 6px; }
  .pin-code { font-size: 10px; }

  .cls-body { padding: 20px; gap: 34px; }
  .cls-aircraft-stage { min-height: 520px; }

  .jr-track { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .compare-frame { aspect-ratio: 3 / 2; }
  .cta-watermark {
    width: min(56vw, 300px); right: 5%; top: 4%; transform: none; opacity: .08;
    -webkit-mask-image: none; mask-image: none;
  }
  .cta-corner { width: 18px; height: 18px; top: 18px; left: 18px; }
  .cta-corner-br { top: auto; left: auto; bottom: 18px; right: 18px; }
  .cta-grid { background-size: 54px 54px; }
  .footer-bottom { flex-direction: column; align-items: flex-start; }
  .footer-note { flex: none; }
  .footer-credit { flex: none; margin-top: 0; }
  .drawer { grid-template-columns: 1fr; }
  .drawer-backdrop { display: none; }
  .prog-card { min-height: 400px; }
  .prog-mono { min-height: 150px; }
}

@media (max-width: 620px) {
  .nav-wrap { gap: 10px; }
  .nav-actions { gap: 8px; }
  .nav-actions .button-small { min-height: 38px; padding: 0 13px; font-size: 11px; gap: 8px; }
  .menu-toggle { width: 42px; height: 42px; }
  .ac-stage { padding: 14px; }
  .ac-service-layout { grid-template-columns: minmax(0, 1fr); gap: 10px; min-height: 0; }
  .ac-airframe { grid-column: 1; grid-row: 1; min-height: 0; padding: 18px 0 24px; }
  .ac-airframe-media { width: min(72vw, 280px); }
  /* Flatten the two desktop columns so mobile cards read 01–08 instead of
     stacking all odd-numbered items before all even-numbered items. */
  .ac-service-column { display: contents; }
  .ac-service-left, .ac-service-right { grid-column: auto; grid-row: auto; }
  .hotspot { grid-column: 1; grid-row: calc(var(--order) + 2); min-height: 60px; }
  .zone-panel { padding: 24px 18px; }
  .ac-airframe figcaption { bottom: 1%; font-size: 8px; }
  .prog-table thead td:first-child,
  .prog-table tbody th {
    position: sticky; left: 0; z-index: 2; background: var(--navy-900);
    box-shadow: 1px 0 rgba(255, 255, 255, .13);
  }
}

@media (max-width: 520px) {
  .brand-logo { width: 128px; }
  .brand-logo-lg { width: 190px; }
  .hero-video-toggle [data-hero-video-label] { display: none; }
  .hero-rail-inner { grid-template-columns: minmax(0, 1fr); }
  .rail-item:nth-child(2) { display: none; }
  .rail-item { border-right: 0; padding-left: 0; }
  .jr-track { grid-template-columns: minmax(0, 1fr); row-gap: 20px; }
  .jr-step { flex-direction: row; align-items: center; gap: 14px; padding: 0; }
  .footer-airports ul { flex-direction: column; }
  .footer-airports a { justify-content: space-between; }
  .cov-code { font-size: 28px; }
  .check-grid { grid-template-columns: minmax(0, 1fr); }
  .table-key { flex-direction: column; gap: 8px; }
  .table-hint { display: block; }
  .cls-aircraft-stage { min-height: 410px; }
  .cls-aircraft-image { width: 96%; height: 92%; }
  .cls-hotspot { padding: 4px 9px 4px 5px; font-size: 10px; gap: 6px; }
  .cls-viewer-bar { justify-content: center; }
  .cls-stage-bearing { display: none; }
}

@media (max-width: 360px) {
  /* The full header CTA crowds the logo and clips the menu on narrow phones.
     The same dispatch action remains first-class inside the opened menu. */
  .nav-actions > .button-small { display: none; }
  .nav-wrap { justify-content: space-between; }
  .nav-actions { margin-left: auto; }
  .mobile-nav-inner { padding-top: 18px; }
}

/* --------------------------------------------------------------------------
   24 · Motion + print preferences
   -------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------
   23b · Phone polish — entrance containment and touch targets
   Added after measuring 20 pages at 320 / 390 / 430 px.
   -------------------------------------------------------------------------- */
@media (max-width: 620px) {
  /* The desktop care-map entrance slides cards in from the flanking columns.
     In the single-column phone layout there are no flanks, so a +/-64px slide
     hangs each card off the screen edge for the length of the stagger. Fade
     them up instead, and shorten the stagger so the last card is not still
     arriving 1.5s after the section is in view. */
  .has-js .ac-stage:not(.is-in) .hotspot[data-side="left"],
  .has-js .ac-stage:not(.is-in) .hotspot[data-side="right"] { transform: translateY(14px); }
  .has-js .ac-stage.is-in .hotspot {
    transform: translateY(0);
    transition-delay: calc(.1s + (var(--order) * 42ms));
  }

  /* Touch targets. Links sitting in running prose keep their inline size --
     WCAG 2.5.8 exempts them and padding them would break the sentence. */
  .footer-col a,
  .footer-contact a,
  .crumbs a {
    display: inline-flex; align-items: center; min-height: 44px;
  }
  .footer-col li, .footer-contact p { margin: 0; }
  .text-link { min-height: 44px; padding-block: 6px; }

  /* Viewer control bar: these are ordinary flow buttons, so grow them. */
  .cls-nudge { width: 44px; height: 44px; }
  .cls-reset { min-height: 44px; }

  /* Map pins and viewer hotspots are absolutely positioned and centred with a
     translate, so their position must not change. Grow only the hit area, via
     a transparent pseudo-element that inherits their existing containing box. */
  .pin::after, .cls-hotspot::after {
    content: ""; position: absolute; left: 50%; top: 50%;
    width: 44px; height: 44px; transform: translate(-50%, -50%);
  }
  /* Viewer hotspots sit ~30px apart on a phone-sized aircraft, so only the
     deficient axis grows. Widening them too would overlap their neighbours
     and cause mis-taps. */
  .cls-hotspot::after { width: 100%; height: 38px; }
}

/* --------------------------------------------------------------------------
   23c · Intentional phone layout
   The desktop composition is deliberately expansive. On a phone, the same
   proportions created a very long page and made the navigation, aircraft map,
   card grids and footer feel like squeezed desktop sections. These overrides
   keep the visual identity while giving small screens their own rhythm.
   -------------------------------------------------------------------------- */
@media (max-width: 620px) {
  :root {
    --gutter: 20px;
    --pad-y: 56px;
  }

  body { line-height: 1.62; }
  h1, .h1 { font-size: clamp(39px, 12vw, 52px); line-height: .98; }
  h2, .h2 { font-size: clamp(31px, 9.5vw, 42px); line-height: 1.02; }
  h3 { font-size: clamp(18px, 5.4vw, 22px); }
  .lead { font-size: 16px; line-height: 1.58; }
  .section-head { margin-bottom: 30px; }
  .section-head-split { gap: 16px; }
  .section-marker { gap: 11px; margin-bottom: 18px; }
  .marker-num { width: 30px; height: 30px; }
  .eyebrow { margin-bottom: 16px; }

  /* A simple two-item header reads more cleanly than three competing actions.
     The dispatch action remains prominent in the hero and mobile menu. */
  html { scroll-padding-top: 72px; }
  .site-header, .site-header.is-scrolled { height: 64px; }
  .brand-logo { width: 148px; }
  .nav-actions > .button-small { display: none; }
  .nav-wrap { justify-content: space-between; }
  .nav-actions { margin-left: auto; }
  .menu-toggle { width: 44px; height: 44px; }
  .mobile-nav { top: 64px; }
  .mobile-nav-inner { padding-top: 20px; }

  /* Homepage and interior heroes no longer consume an oversized first screen. */
  .hero {
    height: auto; min-height: min(720px, 100svh); max-height: none;
  }
  .hero-inner { padding-top: 104px; padding-bottom: 42px; }
  .hero-copy { max-width: 34rem; }
  .hero-copy {
    width: 100%; padding: 24px 20px 28px;
    background: rgba(247, 250, 252, .9); border-color: rgba(10, 21, 34, .15);
  }
  .hero-kicker { margin-bottom: 16px; }
  .hero .lead { margin-top: 18px; }
  .hero-actions { margin-top: 26px; gap: 12px; }
  .hero-actions .button { min-height: 52px; }
  .hero-video-toggle { display: none !important; }
  .hero-rail { display: none; }

  .page-hero {
    min-height: min(470px, 72svh); padding-top: 98px; padding-bottom: 46px;
  }
  .page-hero .lead { margin-top: 18px; }
  .crumbs { margin-bottom: 24px; }

  /* Editorial sections use a shorter, more readable phone cadence. */
  .principles-grid { gap: 38px; }
  .principles-copy h2 { margin-bottom: 18px; }
  .principles-copy .text-link { margin-top: 22px; }
  .principles-list li {
    grid-template-columns: 36px 1fr; gap: 12px; padding: 22px 0;
  }
  .principles-list p { font-size: 14px; }
  .surface-grid, .discretion-grid { gap: 34px; }
  .discretion-media img { aspect-ratio: 16 / 10; object-position: center 58%; }
  .discretion-copy .text-link { margin-top: 22px; }

  /* The aircraft remains the hero of the care map, without delaying the
     interactive choices by an entire viewport. */
  .ac-stage { padding: 10px; }
  .ac-service-layout { gap: 8px; }
  .ac-airframe { padding: 8px 0 20px; }
  .ac-airframe-media { width: min(58vw, 220px); }
  .ac-airframe figcaption { bottom: 0; }
  .hotspot { min-height: 56px; padding: 10px 12px; gap: 10px; }
  .hs-label { font-size: 12.5px; }
  .hs-description { font-size: 11.5px; line-height: 1.55; }
  .zone-panel { gap: 20px; padding: 22px 16px; }
  .ac-readout h3 { margin-bottom: 10px; }
  .ac-readout p { font-size: 13.5px; }
  .ac-readout .rule-list { margin-top: 18px; }
  .ac-readout .text-link { margin-top: 16px; }

  /* Image-heavy card groups become swipeable decks. Showing a slice of the
     next card makes the interaction self-evident and removes several screens
     of repetitive vertical stacking. */
  .svc-grid, .prog-grid, .choose-grid {
    display: flex; gap: 12px; overflow-x: auto; overscroll-behavior-inline: contain;
    scroll-snap-type: x mandatory; scrollbar-width: none;
    margin-right: calc(var(--gutter) * -1); padding-right: var(--gutter);
    border: 0; background: transparent;
  }
  .svc-grid::-webkit-scrollbar,
  .prog-grid::-webkit-scrollbar,
  .choose-grid::-webkit-scrollbar { display: none; }
  .svc-card, .prog-card, .choose-card {
    flex: 0 0 min(82vw, 330px); scroll-snap-align: start;
    border: 1px solid var(--hair);
  }
  .svc-media, .choose-media { aspect-ratio: 16 / 10; }
  .svc-body { padding: 22px 20px 20px; }
  .svc-body p { font-size: 13.5px; }
  .svc-go { padding-top: 14px; }
  .prog-card { min-height: 456px; }
  .prog-media { aspect-ratio: 16 / 9; }
  .prog-card-copy { padding: 22px 20px 24px; }
  .prog-card h3 { font-size: 23px; }
  .prog-card p { margin-bottom: 18px; font-size: 13.5px; }
  .prog-mono { min-height: 126px; }

  /* Dense interactive components stay roomy enough to tap, but not desktop
     sized. */
  .map-stage, .cls-body, .limits-card, .svc-spec,
  .aside-card, .prio-card, .acl-card, .cov-card { padding: 22px 20px; }
  .map-stage { gap: 24px; }
  .cls-aircraft-stage { min-height: 370px; }
  .jr-track { row-gap: 14px; margin-bottom: 28px; }
  .jr-panel { padding-top: 24px; }
  .faq-q button { min-height: 68px; padding: 16px 0; }
  .faq-a-inner { padding-bottom: 24px; }

  .dispatch-hero { padding-top: 104px; padding-bottom: 44px; }
  .dispatch-side { display: none; }
  .drawer-panel { padding: 24px 20px; }
  .drawer-head { margin-bottom: 26px; }
  .field-grid { gap: 18px; }
  .dispatch-form fieldset { margin-bottom: 34px; }
  .dispatch-form legend { margin-bottom: 18px; }
  .form-submit .button { width: 100%; }

  .cta-band { min-height: 0; padding-block: 64px; }
  .cta-band .lead { margin-top: 18px; }

  /* The footer is reorganized for scanning instead of becoming another long
     page. All legal, contact and design-credit content stays visible. */
  .site-footer { padding: 48px 0 22px; }
  .footer-top { gap: 34px; padding-bottom: 36px; }
  .brand-logo-lg { width: 176px; }
  .footer-brand p { margin: 18px 0 14px; font-size: 13px; }
  .footer-contact { gap: 0; margin-bottom: 22px; }
  .footer-brand .button { width: 100%; }
  .footer-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 18px; }
  .footer-col { gap: 0; }
  .footer-col .mono-label { margin-bottom: 6px; }
  .footer-col a { width: 100%; font-size: 12.5px; line-height: 1.35; }
  .footer-airports { padding: 28px 0; }
  .footer-airports ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .footer-airports a {
    min-height: 58px; padding: 9px 10px; flex-direction: column;
    align-items: flex-start; justify-content: center; gap: 0;
  }
  .footer-airports span { font-size: 10.5px; line-height: 1.35; }
  .footer-bottom { gap: 12px; padding-top: 22px; }
  .footer-bottom p { font-size: 11px; line-height: 1.55; }
}

/* --------------------------------------------------------------------------
   25 · Blue-hour runway hero
   -------------------------------------------------------------------------- */
.hero-night {
  --fg: #f4f8fc; --fg-2: #d3deea; --fg-muted: #9baec1;
  --hair: rgba(140, 210, 255, .2); --hair-strong: rgba(140, 210, 255, .38);
  --accent: var(--blue-300);
  /* --focus-ring is consumed as a box-shadow by :focus-visible, so it must be a
     shadow value, not a bare colour. A bare colour makes the declaration invalid
     at computed-value time and the ring silently disappears. Two-tone so it stays
     visible over both the bright airframe and the dark sky. */
  --focus-ring: 0 0 0 2px rgba(2, 8, 20, .92), 0 0 0 5px var(--blue-300);
  background: #020814; color: var(--white);
}
.hero-night .hero-media img {
  object-position: 61% center;
  filter: brightness(.9) contrast(1.12) saturate(.94);
}
.hero-night .hero-media-clean .hero-still {
  animation: runwayPowerOn 2.25s var(--ease) both,
             videoDrift 12s 2.25s ease-in-out infinite alternate;
}
@keyframes runwayPowerOn {
  0% { filter: brightness(.24) contrast(1.3) saturate(.55); }
  30% { filter: brightness(.48) contrast(1.24) saturate(.7); }
  42% { filter: brightness(.38) contrast(1.28) saturate(.64); }
  68% { filter: brightness(.78) contrast(1.16) saturate(.87); }
  100% { filter: brightness(.9) contrast(1.12) saturate(.94); }
}
.hero-night .hero-scrim {
  background:
    linear-gradient(92deg, rgba(2, 8, 20, .94) 0%, rgba(2, 8, 20, .78) 31%,
                    rgba(2, 8, 20, .28) 55%, rgba(2, 8, 20, .02) 76%),
    linear-gradient(0deg, rgba(2, 8, 20, .7) 0%, rgba(2, 8, 20, 0) 46%);
}
.hero-night .hero-mesh {
  opacity: .2;
  background-image:
    linear-gradient(rgba(140, 210, 255, .09) 1px, transparent 1px),
    linear-gradient(90deg, rgba(140, 210, 255, .09) 1px, transparent 1px);
}
.hero-night .hero-inner { grid-template-columns: minmax(0, 650px) 1fr; }
.hero-night .hero-copy {
  max-width: 650px; color: var(--white);
  border-color: rgba(140, 210, 255, .25);
  background: linear-gradient(135deg, rgba(3, 13, 28, .78), rgba(3, 13, 28, .48));
  box-shadow: 0 30px 90px -38px rgba(0, 0, 0, .92), inset 0 1px rgba(255, 255, 255, .04);
  -webkit-backdrop-filter: blur(18px) saturate(1.08); backdrop-filter: blur(18px) saturate(1.08);
}
.hero-night .hero-copy::before {
  background: linear-gradient(90deg, var(--blue-300), #eaf8ff 52%, transparent);
}
.hero-night .hero-copy::after {
  border-right-color: var(--blue-300); border-bottom-color: var(--blue-300);
}
.hero-night h1 { color: var(--white); text-shadow: 0 8px 34px rgba(0, 0, 0, .28); }
.hero-night h1 em { color: var(--blue-300); }
.hero-night .lead { color: var(--silver-200); }
.hero-night .text-link { color: var(--white); border-color: rgba(255, 255, 255, .34); }
.hero-night .text-link:hover { color: var(--blue-200); border-color: var(--blue-300); }
.hero-night .hero-card { display: none; }

/* Turn the former ceiling-light layer into animated runway guide lights. */
.hero-night .hero-hangar-lights {
  inset: auto 0 92px; width: 100%; height: 150px; opacity: .68;
}
.hero-night .hero-hangar-lights i,
.hero-night .hero-hangar-lights i:nth-child(1),
.hero-night .hero-hangar-lights i:nth-child(2),
.hero-night .hero-hangar-lights i:nth-child(3) {
  left: -4%; right: auto; width: 108%; height: 18px; transform: none;
  background: radial-gradient(circle, rgba(238, 249, 255, .98) 0 1px,
              rgba(31, 143, 255, .86) 2px, transparent 4px) 0 50% / 92px 18px repeat-x;
  box-shadow: none; filter: drop-shadow(0 0 7px rgba(31, 143, 255, .86));
  animation: runwayGuideLights 3.8s ease-in-out infinite;
}
.hero-night .hero-hangar-lights i:nth-child(1) { top: 24%; animation-delay: 0s; }
.hero-night .hero-hangar-lights i:nth-child(2) { top: 56%; animation-delay: .38s; }
.hero-night .hero-hangar-lights i:nth-child(3) { top: 82%; animation-delay: .76s; }
@keyframes runwayGuideLights {
  0%, 100% { opacity: .16; background-position-x: 0; }
  50% { opacity: .72; background-position-x: 46px; }
}
.hero-night .hero-beacon-nose { left: 85%; top: 65%; }
.hero-night .hero-beacon-wing { right: 39%; top: 65%; }
.hero-night .hero-beacon-floor { left: 73%; bottom: 5%; }

@media (max-width: 1024px) {
  .hero-night .hero-inner { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 780px) {
  .hero-night { min-height: 820px; height: auto; }
  .hero-night .hero-media {
    inset: 64px 0 auto; height: 290px; background: #020814;
  }
  .hero-night .hero-media img { object-position: 76% center; }
  .hero-night .hero-scrim {
    inset: 64px 0 auto; height: 290px;
    background:
      linear-gradient(180deg, rgba(2, 8, 20, .02) 0%, rgba(2, 8, 20, .08) 55%,
                      rgba(2, 8, 20, .88) 100%),
      linear-gradient(90deg, rgba(2, 8, 20, .42), rgba(2, 8, 20, .04));
  }
  .hero-night .hero-mesh { inset: 64px 0 auto; height: 290px; }
  .hero-night .hero-light-sweep { top: 64px; bottom: auto; height: 290px; }
  .hero-night .hero-inner { align-items: end; padding-top: 285px; padding-bottom: 48px; }
  .hero-night .hero-copy {
    background: linear-gradient(180deg, rgba(3, 13, 28, .82), rgba(3, 13, 28, .96));
  }
  .hero-night .hero-hangar-lights { inset: 212px 0 auto; width: 100%; height: 78px; }
  .hero-night .hero-beacons { inset: 64px 0 auto; height: 290px; }
  .hero-night .hero-beacon-nose { left: 80%; top: 62%; }
}
@media (max-width: 360px) {
  .hero-night { min-height: 810px; }
  .hero-night .hero-inner { padding-top: 280px; }
  .hero-night .hero-copy {
    padding: 22px 18px 24px;
    background: linear-gradient(180deg, rgba(3, 13, 28, .7), rgba(3, 13, 28, .9));
    border-color: rgba(140, 210, 255, .2);
  }
}

/* --------------------------------------------------------------------------
   26 · Architectural hangar — spatial depth + time-based motion
   -------------------------------------------------------------------------- */
.hero-3d-hangar {
  --hero-x: 0; --hero-y: 0;
  perspective: 1500px; background: #050b13;
}
.hero-3d-hangar .hero-media {
  transform: translate3d(calc(var(--hero-x) * -10px), calc(var(--hero-y) * -6px), 0) scale(1.025);
  transition: transform .65s var(--ease);
}
.hero-3d-hangar .hero-media-clean .hero-still {
  object-position: 58% center;
  animation: hangar3DPowerOn 2.5s var(--ease) both,
             hangarCameraMove 13s 2.5s ease-in-out infinite alternate;
}
@keyframes hangar3DPowerOn {
  0% { filter: brightness(.22) contrast(1.28) saturate(.56); }
  22% { filter: brightness(.38) contrast(1.24) saturate(.67); }
  30% { filter: brightness(.27) contrast(1.3) saturate(.6); }
  46% { filter: brightness(.63) contrast(1.18) saturate(.8); }
  54% { filter: brightness(.48) contrast(1.24) saturate(.72); }
  74% { filter: brightness(.84) contrast(1.12) saturate(.9); }
  100% { filter: brightness(.94) contrast(1.09) saturate(.94); }
}
@keyframes hangarCameraMove {
  from { transform: scale(1.018) translate3d(.35%, .15%, 0); }
  to { transform: scale(1.07) translate3d(-1.25%, -.45%, 0); }
}
.hero-3d-hangar .hero-scrim {
  background:
    linear-gradient(92deg, rgba(3, 9, 17, .48) 0%, rgba(3, 9, 17, .22) 38%,
                    rgba(3, 9, 17, .03) 65%),
    linear-gradient(0deg, rgba(3, 9, 17, .66) 0%, rgba(3, 9, 17, 0) 45%);
}
.hero-3d-hangar .hero-inner { grid-template-columns: minmax(0, 590px) 1fr; }
.hero-3d-hangar .hero-copy {
  max-width: 570px; padding: 24px 0 24px 6px; overflow: visible;
  border: 0; background: none;
  box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none;
  transform-style: preserve-3d;
}
.has-js .hero-3d-hangar .hero-copy {
  animation: none;
  transform: perspective(1200px) rotateY(-7deg) rotateX(.6deg)
             translate3d(calc(var(--hero-x) * 8px), calc(var(--hero-y) * 5px), 34px);
  transition: transform .65s var(--ease);
}
.hero-3d-hangar .hero-copy::before { display: none; }
.hero-3d-hangar .hero-copy::after { display: none; }
.hero-3d-hangar .hero-kicker {
  color: var(--blue-200); text-shadow: 0 0 12px rgba(79, 173, 255, .52);
}
.hero-3d-hangar h1 {
  max-width: 11ch; font-size: clamp(46px, 4.5vw, 70px); line-height: .94;
  letter-spacing: -.052em; color: #edf5fb;
  text-shadow:
    0 1px 0 #fff,
    0 2px 0 #a7b7c5,
    0 3px 0 #748595,
    0 4px 0 #46596b,
    0 5px 0 #21364a,
    9px 15px 22px rgba(0, 0, 0, .66),
    -3px -2px 24px rgba(206, 238, 255, .14);
}
.hero-3d-hangar h1 em {
  color: var(--blue-300);
  text-shadow:
    0 1px 0 #bce7ff,
    0 2px 0 #4fa7ed,
    0 3px 0 #287cc4,
    0 4px 0 #17568d,
    0 5px 0 #0b345c,
    9px 15px 22px rgba(0, 0, 0, .68),
    0 0 30px rgba(79, 173, 255, .28);
}
.hero-3d-hangar .lead {
  max-width: 47ch; padding: 15px 0 0; border: 0;
  color: var(--silver-200); text-shadow: 0 3px 12px rgba(0, 0, 0, .84);
}
.hero-3d-hangar .lead strong {
  display: block; width: fit-content; margin-bottom: 9px; padding-bottom: 6px;
  border-bottom: 1px solid rgba(140, 210, 255, .5);
  color: var(--white); font-weight: 700; letter-spacing: .055em; text-transform: uppercase;
  text-shadow: 0 0 16px rgba(190, 232, 255, .2), 0 4px 12px rgba(0, 0, 0, .76);
}
.hero-3d-hangar .hero-actions {
  width: fit-content; padding: 12px 14px 12px 0; transform: translateZ(42px);
  border-top: 1px solid rgba(140, 210, 255, .2);
  border-bottom: 1px solid rgba(140, 210, 255, .12);
  background: linear-gradient(90deg, rgba(2, 9, 18, .4), transparent);
}

/* Perspective floor grid gives the hangar a separate foreground depth plane. */
.hero-3d-hangar .hero-mesh {
  inset: auto -12% 92px; width: 124%; height: 47%; opacity: .16;
  background-size: 76px 34px;
  transform: perspective(520px) rotateX(64deg) translateY(29%);
  transform-origin: center bottom;
  -webkit-mask-image: linear-gradient(0deg, #000, transparent 84%);
  mask-image: linear-gradient(0deg, #000, transparent 84%);
}

/* Sequential LED bars mirror the architectural lighting in the photograph. */
.hero-3d-hangar .hero-hangar-lights {
  inset: 88px 0 92px; width: 100%; height: auto; opacity: .82; overflow: visible;
}
.hero-3d-hangar .hero-hangar-lights i,
.hero-3d-hangar .hero-hangar-lights i:nth-child(1),
.hero-3d-hangar .hero-hangar-lights i:nth-child(2),
.hero-3d-hangar .hero-hangar-lights i:nth-child(3) {
  top: 0; right: auto; width: 2px; height: 54%; transform: scaleY(0);
  transform-origin: center top;
  background: linear-gradient(#fff, var(--blue-200) 72%, transparent);
  box-shadow: 0 0 10px #fff, 0 0 28px rgba(79, 173, 255, .72);
  filter: none; animation: hangarLEDStart 1.2s var(--ease) both;
}
.hero-3d-hangar .hero-hangar-lights i:nth-child(1) { left: 34%; animation-delay: .38s; }
.hero-3d-hangar .hero-hangar-lights i:nth-child(2) { left: 43%; height: 44%; animation-delay: .72s; }
.hero-3d-hangar .hero-hangar-lights i:nth-child(3) { left: 96%; height: 60%; animation-delay: 1.06s; }
@keyframes hangarLEDStart {
  0%, 24% { opacity: 0; transform: scaleY(0); }
  34% { opacity: .4; }
  43% { opacity: .08; }
  58% { opacity: 1; }
  100% { opacity: .55; transform: scaleY(1); }
}
.hero-3d-hangar .hero-beacon-nose { left: 57%; top: 59%; }
.hero-3d-hangar .hero-beacon-wing { right: 7%; top: 55%; }
.hero-3d-hangar .hero-beacon-floor { left: 61%; bottom: 17%; }

@media (max-width: 1024px) {
  .hero-3d-hangar .hero-inner { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 780px) {
  .hero-3d-hangar { min-height: 850px; }
  .hero-3d-hangar .hero-media { transform: none; height: 300px; }
  .hero-3d-hangar .hero-media-clean .hero-still { object-position: 69% center; }
  .hero-3d-hangar .hero-inner { padding-top: 300px; }
  .has-js .hero-3d-hangar .hero-copy,
  .hero-3d-hangar .hero-copy {
    padding: 28px 20px 30px; border: 1px solid rgba(140, 210, 255, .24);
    background: linear-gradient(180deg, rgba(3, 13, 28, .86), rgba(3, 13, 28, .97));
    transform: none; overflow: hidden;
  }
  .hero-3d-hangar h1 {
    font-size: clamp(43px, 13vw, 58px);
    text-shadow: 1px 1px 0 #61798f, 3px 6px 18px rgba(0, 0, 0, .65);
  }
  .hero-3d-hangar h1 em {
    text-shadow: 1px 1px 0 #17568d, 3px 6px 18px rgba(0, 0, 0, .65);
  }
  .hero-3d-hangar .hero-actions {
    width: 100%; padding: 0; border: 0; background: none; transform: none;
  }
  .hero-3d-hangar .hero-mesh { display: none; }
  .hero-3d-hangar .hero-hangar-lights { inset: 64px 0 auto; height: 300px; }
  .hero-3d-hangar .hero-hangar-lights i:nth-child(1) { left: 18%; }
  .hero-3d-hangar .hero-hangar-lights i:nth-child(2) { left: 38%; }
  .hero-3d-hangar .hero-hangar-lights i:nth-child(3) { left: 94%; }
}

/* Runway variant: retain the dimensional sign, but trade hangar bars for
   animated taxiway guides and wet-ramp light movement. */
.hero-3d-hangar.hero-3d-runway .hero-media-clean .hero-still {
  object-fit: cover;
  object-position: center;
  image-rendering: auto;
  backface-visibility: hidden;
  animation: runwayHDReveal 1.35s var(--ease) both;
}
.hero-3d-hangar.hero-3d-runway {
  /* Fill the viewport, but GROW instead of clipping when the copy needs more
     room than a short window can give. With a fixed height the overflow:hidden
     on .hero amputated the CTA at ~700px tall viewports. */
  height: auto;
  min-height: max(100svh, 700px);
  max-height: none;
}
.hero-3d-hangar.hero-3d-runway .hero-media {
  inset: 0;
  background: #020814;
  transform: none;
  transition: none;
  overflow: hidden;
}
.hero-3d-hangar.hero-3d-runway .hero-media::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: -7%;
  /* Blurred 28px behind the sharp photo, so the smallest rendition is
     visually identical here and saves ~282 kB on every page load. */
  background: url("assets/img/hero-runway-night-hd-640.webp") center / cover no-repeat;
  filter: blur(28px) brightness(.42) saturate(.82);
  transform: scale(1.08);
  opacity: .78;
}
.hero-3d-hangar.hero-3d-runway .hero-media::after {
  content: "";
  position: absolute;
  z-index: 2;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(90deg,
    rgba(2, 8, 20, .72) 0%, rgba(2, 8, 20, .08) 12%,
    rgba(2, 8, 20, 0) 84%, rgba(2, 8, 20, .46) 100%);
}
.hero-3d-hangar.hero-3d-runway .hero-media-clean .hero-still {
  position: relative;
  z-index: 1;
}
@keyframes runwayHDReveal {
  from { opacity: .38; filter: brightness(.62) contrast(1.04) saturate(.82); }
  to { opacity: 1; filter: brightness(.92) contrast(1.04) saturate(.96); }
}
.hero-3d-runway .hero-scrim {
  background:
    linear-gradient(92deg, rgba(2, 8, 20, .78) 0%, rgba(2, 8, 20, .48) 34%,
                    rgba(2, 8, 20, .12) 58%, rgba(2, 8, 20, .01) 78%),
    linear-gradient(0deg, rgba(2, 8, 20, .68) 0%, rgba(2, 8, 20, 0) 47%);
}
.has-js .hero-3d-hangar.hero-3d-runway .hero-copy {
  transform: perspective(1250px) rotateY(-4deg) rotateX(.4deg)
             translate3d(calc(var(--hero-x) * 8px), calc(var(--hero-y) * 5px), 38px);
}
.hero-3d-hangar.hero-3d-runway .hero-hangar-lights {
  inset: auto 0 92px; width: 100%; height: 150px; opacity: .32;
}
.hero-3d-hangar.hero-3d-runway .hero-hangar-lights i,
.hero-3d-hangar.hero-3d-runway .hero-hangar-lights i:nth-child(1),
.hero-3d-hangar.hero-3d-runway .hero-hangar-lights i:nth-child(2),
.hero-3d-hangar.hero-3d-runway .hero-hangar-lights i:nth-child(3) {
  left: -4%; right: auto; width: 108%; height: 18px; transform: none;
  transform-origin: center;
  background: radial-gradient(circle, rgba(238, 249, 255, .98) 0 1px,
              rgba(31, 143, 255, .86) 2px, transparent 4px) 0 50% / 92px 18px repeat-x;
  box-shadow: none;
  filter: drop-shadow(0 0 7px rgba(31, 143, 255, .86));
  animation: runwayGuideLights 3.8s ease-in-out infinite;
}
.hero-3d-hangar.hero-3d-runway .hero-hangar-lights i:nth-child(1) { top: 24%; animation-delay: 0s; }
.hero-3d-hangar.hero-3d-runway .hero-hangar-lights i:nth-child(2) { top: 56%; animation-delay: .38s; }
.hero-3d-hangar.hero-3d-runway .hero-hangar-lights i:nth-child(3) { top: 82%; animation-delay: .76s; }

/* Animated glows aligned to the tall white apron lamps in the photograph. */
.hero-ramp-lamps {
  display: none;
  position: absolute;
  z-index: 1;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}
.ramp-lamp {
  position: absolute;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #f4fbff;
  opacity: .12;
  box-shadow:
    0 0 5px 2px rgba(255, 255, 255, .95),
    0 0 18px 8px rgba(174, 224, 255, .72),
    0 0 48px 20px rgba(67, 160, 255, .28);
  transform: translate(-50%, -50%);
  animation: apronLampSwitch 5.2s steps(1, end) infinite;
}
.ramp-lamp::before,
.ramp-lamp::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  background: linear-gradient(90deg, transparent, rgba(235, 249, 255, .84), transparent);
  transform: translate(-50%, -50%);
}
.ramp-lamp::before { width: 48px; height: 1px; }
.ramp-lamp::after { width: 1px; height: 48px; }
.ramp-lamp-a { left: 16.7%; top: 69.4%; animation-delay: .2s; }
.ramp-lamp-b { left: 90.1%; top: 60.1%; animation-delay: 1.15s; }
.ramp-lamp-c { left: 94.1%; top: 63.3%; animation-delay: 2.1s; }
.ramp-lamp-d { left: 99.4%; top: 62.5%; animation-delay: 3.05s; }
@keyframes apronLampSwitch {
  0%, 14%, 48%, 64%, 100% { opacity: .1; }
  16%, 46%, 66%, 90% { opacity: 1; }
  91%, 94% { opacity: .24; }
}
@media (min-width: 1180px) {
  .hero-3d-runway .hero-ramp-lamps { display: block; }
}
.hero-3d-runway .hero-beacon-nose { left: 85%; top: 65%; }
.hero-3d-runway .hero-beacon-wing { right: 39%; top: 65%; }
.hero-3d-runway .hero-beacon-floor { left: 73%; bottom: 5%; }

@media (max-width: 780px) {
  .hero-3d-hangar.hero-3d-runway {
    height: auto;
    min-height: min(850px, 100svh);
  }
  .hero-3d-hangar.hero-3d-runway .hero-media {
    inset: 64px 0 auto;
    height: 300px;
  }
  .hero-3d-hangar.hero-3d-runway .hero-media-clean .hero-still {
    object-fit: cover;
    object-position: 68% center;
  }
  .has-js .hero-3d-hangar.hero-3d-runway .hero-copy { transform: none; }
  .hero-3d-hangar.hero-3d-runway .hero-hangar-lights {
    inset: 212px 0 auto; width: 100%; height: 78px;
  }
}

/* Final runway polish: moving metal sign, operational readout and atmospheric
   layers all travel at different depths. */
.hero-3d-runway h1 {
  max-width: 10ch;
  font-size: clamp(64px, 6.2vw, 104px);
  line-height: 1.02;
  color: #f4f8fc;
  background: none;
  -webkit-text-fill-color: #f4f8fc;
  animation: none;
  text-shadow: 0 1px 0 rgba(255, 255, 255, .16), 0 12px 30px rgba(0, 0, 0, .48);
}
.hero-3d-runway h1 .hero-line {
  /* The mask is overflow:hidden for the slide-up reveal. line-height:1 plus
     .08em left ~.06em too little below the baseline, so Manrope's 'g' and 'y'
     descenders were sliced flat. .22em clears them; the -.14em margin cancels
     the extra so the two-line rhythm is unchanged (1.22 - .14 + .08 = 1.16em,
     exactly as before). */
  padding-bottom: .22em;
  margin-bottom: -.14em;
  line-height: 1;
}
/* The deeper descender mask (.22em) sits below where translateY(112%) parks the
   line, which would leave a sliver of the next line visible before it slides in.
   Start it lower. Same duration, easing and end state, so the reveal is
   visually unchanged. */
.has-js .hero-3d-runway h1 .hero-line > span { animation-name: heroLineInDeep; }
@keyframes heroLineInDeep { from { opacity: 0; transform: translateY(140%) rotate(.8deg); } }

.hero-3d-runway h1 .hero-line + .hero-line {
  margin-top: .08em;
}
.hero-3d-runway h1 em {
  color: #77c9ff;
  background: none;
  -webkit-text-fill-color: #77c9ff;
  text-shadow: 0 1px 0 rgba(206, 240, 255, .2), 0 12px 30px rgba(0, 0, 0, .48);
}
@media (max-width: 780px) {
  .hero-3d-runway h1 {
    max-width: 11ch;
    font-size: clamp(46px, 13vw, 60px);
  }
}
@keyframes wallSignSheen {
  0%, 28%, 100% { background-position: 100% 50%; }
  52%, 68% { background-position: 0% 50%; }
}
.hero-wall-meta {
  display: grid; grid-template-columns: repeat(3, auto); width: fit-content;
  margin-top: 22px; border-top: 1px solid rgba(140, 210, 255, .24);
  border-bottom: 1px solid rgba(140, 210, 255, .14);
  background: linear-gradient(90deg, rgba(3, 12, 24, .58), rgba(3, 12, 24, .08));
  color: var(--silver-300); font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 8.5px; letter-spacing: .12em; text-transform: uppercase;
  box-shadow: 0 14px 32px -24px rgba(0, 0, 0, .85);
  transform: translateZ(30px);
}
.hero-wall-meta span {
  display: flex; align-items: center; min-height: 34px; padding: 8px 13px;
  border-right: 1px solid rgba(140, 210, 255, .15); white-space: nowrap;
}
.hero-wall-meta span:last-child { border-right: 0; }
.hero-wall-live { color: var(--blue-200); }
.hero-wall-live::before {
  content: ""; width: 5px; height: 5px; margin-right: 8px; flex: none;
  border-radius: 50%; background: #57e3b3;
  box-shadow: 0 0 0 4px rgba(87, 227, 179, .1), 0 0 12px rgba(87, 227, 179, .72);
  animation: wallStatusPulse 2.4s ease-in-out infinite;
}
@keyframes wallStatusPulse {
  0%, 100% { opacity: .55; transform: scale(.75); }
  48% { opacity: 1; transform: scale(1); }
}
.hero-3d-runway .hero-actions { margin-top: 20px; }

@media (min-width: 1180px) {
  .hero-3d-runway .hero-inner {
    grid-template-columns: minmax(0, 1fr);
  }
  .hero-3d-runway .hero-card {
    display: block;
    position: absolute;
    top: 108px;
    right: 0;
    width: min(356px, 31vw);
    padding: 16px 18px 14px;
    border-color: rgba(140, 210, 255, .32);
    background: linear-gradient(145deg, rgba(5, 20, 38, .88), rgba(2, 10, 22, .76));
    box-shadow: 0 30px 80px -30px rgba(0, 0, 0, .9),
                inset 0 1px rgba(210, 241, 255, .07);
  }
  .hero-3d-runway .hero-card-head {
    margin-bottom: 10px;
    padding-bottom: 10px;
    color: #e8f7ff;
  }
  .hero-3d-runway .hero-card dl {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px 18px;
  }
  .hero-3d-runway .hero-card dl > div {
    display: grid;
    gap: 2px;
  }
  .hero-3d-runway .hero-card dd {
    font-size: 11.5px;
    text-align: left;
  }
  .hero-3d-runway .hero-card-link {
    margin-top: 10px;
    padding-top: 10px;
  }
}

/* Photography-first polish: remove the synthetic beam/grid overlays that
   softened the aircraft and created visible bands on large displays. */
.hero-3d-runway .hero-light-sweep,
.hero-3d-runway .hero-mesh,
.hero-3d-runway .hero-atmosphere::before { display: none; }
.hero-3d-runway .hero-atmosphere::after { opacity: .16; filter: blur(24px); }
.hero-3d-runway .hero-beacons { opacity: .48; }

.hero-atmosphere {
  position: absolute; z-index: 1; inset: 88px 0 92px; overflow: hidden;
  pointer-events: none; transform: translate3d(calc(var(--hero-x) * -15px), calc(var(--hero-y) * -7px), 0);
  transition: transform .65s var(--ease); mix-blend-mode: screen;
}
.hero-atmosphere::before {
  content: ""; position: absolute; left: 35%; right: -8%; top: 59%; height: 2px;
  background: linear-gradient(90deg, transparent, rgba(74, 174, 255, .22) 22%,
              rgba(221, 246, 255, .75) 72%, transparent);
  box-shadow: 0 0 16px rgba(79, 173, 255, .42), 0 0 52px rgba(79, 173, 255, .16);
  animation: horizonLightBreath 5.8s ease-in-out infinite;
}
.hero-atmosphere::after {
  content: ""; position: absolute; right: -12%; bottom: -58px; width: 74%; height: 190px;
  background:
    radial-gradient(ellipse at 30% 60%, rgba(177, 224, 255, .17), transparent 47%),
    radial-gradient(ellipse at 72% 42%, rgba(117, 200, 255, .12), transparent 50%);
  filter: blur(18px); opacity: .52;
  animation: rampMistDrift 11s ease-in-out infinite alternate;
}
@keyframes horizonLightBreath {
  0%, 100% { opacity: .28; transform: scaleX(.94); }
  52% { opacity: .8; transform: scaleX(1.03); }
}
@keyframes rampMistDrift {
  from { transform: translate3d(7%, 4px, 0) scale(.96); opacity: .28; }
  to { transform: translate3d(-7%, -5px, 0) scale(1.07); opacity: .62; }
}

@media (max-width: 780px) {
  .hero-wall-meta {
    grid-template-columns: repeat(3, minmax(0, 1fr)); width: 100%; margin-top: 18px;
    font-size: 7px; letter-spacing: .06em; transform: none;
  }
  .hero-wall-meta span { justify-content: center; min-height: 32px; padding: 6px 5px; }
  .hero-wall-live::before { width: 4px; height: 4px; margin-right: 5px; }
  .hero-3d-runway .hero-actions { margin-top: 18px; }
  .hero-atmosphere { inset: 64px 0 auto; height: 300px; transform: none; }
  .hero-atmosphere::before { left: 24%; top: 66%; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .001ms !important; animation-iteration-count: 1 !important;
    transition-duration: .001ms !important; scroll-behavior: auto !important;
  }
  .reveal { opacity: 1; transform: none; }
  .hero-still { animation: none; }
  .hero-3d-hangar .hero-media, .hero-3d-hangar .hero-copy { transform: none; transition: none; }
  .hero-atmosphere { transform: none; transition: none; }
  .hero-light-sweep, .hero-hangar-lights, .hero-ramp-lamps, .hero-beacons { display: none; }
  .live-dot::after, .pin[aria-pressed="true"] .pin-mark::after, .rail-scroll i { animation: none; }
  .cls-canvas { transition: none; }
  .cls-hotspot[aria-pressed="true"] .cls-hotspot-dot::after { animation: none; opacity: 0; }
  .cls-zone-panel, .cls-panel { animation: none; }
}

@media print {
  .site-header, .mobile-nav, .drawer, .scroll-progress, .cta-band, .hero-rail { display: none !important; }
  body { background: #fff; color: #000; }
  .section, .section-dark { background: #fff !important; color: #000 !important; padding-block: 24px; }
  .reveal { opacity: 1 !important; transform: none !important; }
  a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 10px; }
}

@media (forced-colors: active) {
  .hotspot, .pin, .jr-node, .check-box, .button { forced-color-adjust: none; border: 1px solid ButtonText; }
}