/* ============================================================================
   jp-night-flight.css — the Night Flight homepage concept — v1.7.22
   ----------------------------------------------------------------------------
   The mobile homepage as a flight: depart at your US price, land at your new
   life. Scoped entirely to body.nf-night — no other page is affected.

   Signature elements:
     #nf-board      — airport split-flap departures board (real demo journeys)
     .nf-pass       — glassmorphic boarding pass holding the hero CTAs
     #nf-route      — the route line that draws itself as you scroll
                      (CSS scroll-driven animation, graceful fallback)
     .nf-stamp      — passport-stamp trust chips that ink in on view
     #cta .cta-card — the dawn arrival
   Everything else is a night re-skin of the existing sections: same markup,
   same copy, same CTAs.
   ========================================================================== */

/* ── Typography enforcement (kills any serif fallback leak) ─────────────── */
body.nf-night, body.nf-night h1, body.nf-night h2, body.nf-night h3,
body.nf-night p, body.nf-night a, body.nf-night li, body.nf-night button,
body.nf-night input, body.nf-night span, body.nf-night div {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont,
    'Segoe UI', Roboto, sans-serif !important;
}

/* ── The night sky ──────────────────────────────────────────────────────── */
body.nf-night {
  background: linear-gradient(180deg, #04102A 0%, #061D4A 34%, #0A2D6E 78%, #0E3A7E 100%) fixed;
  color: rgba(255, 255, 255, .86);
}
body.nf-night main { position: relative; }
/* starfield — two layered radial dot sheets, pure CSS */
body.nf-night main::before {
  content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 0;
  background-image:
    radial-gradient(1.5px 1.5px at 12% 18%, rgba(255,255,255,.5) 50%, transparent 51%),
    radial-gradient(1px 1px at 78% 9%,  rgba(255,255,255,.4) 50%, transparent 51%),
    radial-gradient(1px 1px at 64% 31%, rgba(255,255,255,.35) 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 31% 44%, rgba(255,255,255,.3) 50%, transparent 51%),
    radial-gradient(1px 1px at 88% 56%, rgba(255,255,255,.3) 50%, transparent 51%),
    radial-gradient(1px 1px at 8% 72%,  rgba(255,255,255,.25) 50%, transparent 51%);
}

/* ── The route line ─────────────────────────────────────────────────────── */
#nf-route { position: absolute; left: 9px; top: 0; bottom: 0; width: 2px;
  background: rgba(0, 201, 192, .14); z-index: 0; pointer-events: none; }
#nf-route i { display: block; width: 100%; height: 100%;
  background: linear-gradient(180deg, rgba(0,201,192,.9), rgba(0,201,192,.35));
  transform-origin: top; transform: scaleY(1); box-shadow: 0 0 12px rgba(0,201,192,.5); }
@supports (animation-timeline: scroll()) {
  #nf-route i { animation: nf-grow linear both; animation-timeline: scroll(root); }
  @keyframes nf-grow { from { transform: scaleY(0); } to { transform: scaleY(1); } }
}
body.nf-night .section { position: relative; z-index: 1; }
body.nf-night .section::before {           /* waypoint dot on the route */
  content: ""; position: absolute; left: -12px; top: 38px; width: 10px; height: 10px;
  border-radius: 50%; background: #04102A; border: 2px solid #00C9C0;
  box-shadow: 0 0 10px rgba(0, 201, 192, .6); }

/* ── Hero re-skin (the globe becomes a night globe) ─────────────────────── */
body.nf-night .hero { background: transparent; position: relative; z-index: 1; }
body.nf-night .hero h1 { color: #fff; }
body.nf-night .hero h1 .grad {
  background: linear-gradient(92deg, #00C9C0 10%, #7FE7E2 90%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: #00C9C0; }
body.nf-night .hero .lede { color: rgba(255, 255, 255, .82); }
body.nf-night .hero .lede strong { color: #fff; }
body.nf-night .hero-pill { background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.18);
  color: #9bb3da; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
body.nf-night .hero-pill-dot { background: #00C9C0; box-shadow: 0 0 8px #00C9C0; }
body.nf-night .hero-globe { filter: saturate(.85) brightness(.9)
  drop-shadow(0 0 60px rgba(0, 120, 220, .35)); }
body.nf-night .hero-proof { background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12); border-radius: 16px; padding: 10px 14px; }
body.nf-night .hero-proof-text, body.nf-night .hero-proof-text strong { color: #fff; }
body.nf-night .hero-proof-text .cities { color: rgba(255,255,255,.55); }

/* ── Departures board ───────────────────────────────────────────────────── */
#nf-board { margin: 18px 0 4px; background: #030B1C; border: 1px solid rgba(255,255,255,.10);
  border-radius: 14px; padding: 12px 12px 9px; overflow: hidden;
  box-shadow: inset 0 2px 14px rgba(0,0,0,.6), 0 8px 30px rgba(0,0,0,.35); }
#nf-board .hd { display: flex; align-items: center; gap: 7px; font-size: 11.5px;
  font-weight: 800; letter-spacing: .22em; color: #5E7396; text-transform: uppercase;
  margin-bottom: 8px; }
#nf-board .hd::before { content: ""; width: 6px; height: 6px; border-radius: 50%;
  background: #FFB000; box-shadow: 0 0 8px #FFB000; animation: nf-blink 2.4s infinite; }
@keyframes nf-blink { 0%, 92% { opacity: 1; } 96% { opacity: .25; } 100% { opacity: 1; } }
.nf-row { display: flex; gap: 2px; margin-bottom: 5px; }
.nf-cell { flex: 1; min-width: 0; height: 22px; border-radius: 3px;
  background: linear-gradient(180deg, #0E1B33 48%, #0A1426 52%);
  border-top: 1px solid rgba(255,255,255,.06);
  color: #E8C46A; font-size: 11px; font-weight: 800; text-align: center;
  line-height: 22px; font-family: ui-monospace, 'SF Mono', Menlo, monospace !important;
  text-transform: uppercase; perspective: 80px; }
.nf-cell.teal { color: #4FE0D8; }
.nf-cell.f { animation: nf-flip .38s ease both; }
@keyframes nf-flip { 0% { transform: rotateX(0); filter: brightness(1); }
  49% { transform: rotateX(-88deg); filter: brightness(.4); }
  51% { transform: rotateX(88deg); } 100% { transform: rotateX(0); filter: brightness(1); } }

/* ── Boarding pass ──────────────────────────────────────────────────────── */
.nf-pass { position: relative; margin: 16px 0 6px; border-radius: 18px;
  background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.16);
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  box-shadow: 0 18px 50px rgba(0,0,0,.45); overflow: hidden; }
.nf-pass .route { display: flex; align-items: center; justify-content: space-between;
  padding: 14px 18px 10px; }
.nf-pass .port { text-align: center; }
.nf-pass .port .code { font-size: 21px; font-weight: 800; color: #fff; letter-spacing: .04em; }
.nf-pass .port .city { font-size: 10.5px; font-weight: 800; letter-spacing: .14em;
  color: rgba(255,255,255,.5); text-transform: uppercase; margin-top: 1px; }
.nf-pass .plane { flex: 1; position: relative; height: 2px; margin: 0 12px;
  background: repeating-linear-gradient(90deg, rgba(255,255,255,.35) 0 6px, transparent 6px 12px); }
.nf-pass .plane::after { content: "<svg class="jp-ic" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" style="vertical-align:-0.125em"><path d="M17.8 19.2 16 11l3.5-3.5C21 6 21.5 4 21 3c-1-.5-3 0-4.5 1.5L13 8 4.8 6.2c-.5-.1-.9.1-1.1.5l-.3.5c-.2.5-.1 1 .3 1.3L9 12l-2 3H4l-1 1 3 2 2 3 1-1v-3l3-2 3.5 5.3c.3.4.8.5 1.3.3l.5-.2c.4-.3.6-.7.5-1.2z"/></svg>"; position: absolute; top: 50%; left: 50%;
  transform: translate(-50%, -54%); color: #00C9C0; font-size: 15px;
  text-shadow: 0 0 12px rgba(0,201,192,.8); }
.nf-pass .meta { display: flex; gap: 14px; padding: 0 18px 12px; }
.nf-pass .meta div { font-size: 10.5px; font-weight: 800; letter-spacing: .12em;
  color: rgba(255,255,255,.45); text-transform: uppercase; }
.nf-pass .meta div b { display: block; font-size: 11px; color: #7FE7E2;
  letter-spacing: .04em; margin-top: 1px; }
/* perforation */
.nf-pass .tear { position: relative; height: 0; border-top: 2px dashed rgba(255,255,255,.22); }
.nf-pass .tear::before, .nf-pass .tear::after { content: ""; position: absolute; top: -9px;
  width: 18px; height: 18px; border-radius: 50%; background: #061D4A; }
.nf-pass .tear::before { left: -10px; } .nf-pass .tear::after { right: -10px; }
.nf-pass .stub { padding: 14px 18px 16px; display: flex; flex-direction: column; gap: 10px; }
/* v1.7.39 — the third white-out vector, killed. jp-marketing-mobile-v2 (loaded
   after this sheet on the homepage) sets `background:#fff !important` at equal
   specificity, while jp-mobile-components pins `-webkit-text-fill-color:#fff
   !important` — net result in Chromium: the hero CTA was a blank white pill.
   The doubled-class selector outguns both, and BOTH halves of the pair
   (background AND text/fill) are locked together so no later sheet can split
   them again. */
body.nf-night .nf-pass .jp-btn-primary,
body.nf-night.nf-night .nf-pass .stub .jp-btn-primary {
  background: linear-gradient(135deg, #00C9C0, #00A89F) !important;
  background-image: linear-gradient(135deg, #00C9C0, #00A89F) !important;
  background-color: #00A89F !important;
  color: #04102A !important; -webkit-text-fill-color: #04102A !important;
  font-weight: 800 !important; border: none !important;
  min-height: 50px; border-radius: 13px; box-shadow: 0 10px 30px rgba(0,201,192,.35); }
body.nf-night .nf-pass .jp-btn-primary *,
body.nf-night.nf-night .nf-pass .stub .jp-btn-primary * {
  color: #04102A !important; -webkit-text-fill-color: #04102A !important; }
body.nf-night .nf-pass .jp-btn-ghost,
body.nf-night.nf-night .nf-pass .stub .jp-btn-ghost {
  background: transparent !important;
  border: 1.5px solid rgba(255,255,255,.28) !important;
  color: #fff !important; -webkit-text-fill-color: #fff !important;
  min-height: 46px; border-radius: 13px; }
.nf-pass .barcode { height: 26px; margin: 2px 18px 0;
  background: repeating-linear-gradient(90deg, rgba(255,255,255,.5) 0 2px, transparent 2px 5px,
    rgba(255,255,255,.5) 5px 6px, transparent 6px 11px); opacity: .35; border-radius: 2px; }

/* ── Passport-stamp trust chips (hardened vs. in-body sheets, v1.7.24) ──── */
body.nf-night .chip-row { gap: 10px; }
body.nf-night .chip-row .chip { background: transparent !important;
  backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
  border: 2px solid rgba(0, 201, 192, .55) !important; color: #7FE7E2 !important;
  box-shadow: none !important;
  font-weight: 800; letter-spacing: .08em; text-transform: uppercase; font-size: 10px;
  border-radius: 8px; padding: 7px 12px; transform: rotate(-2.5deg); }
body.nf-night .chip-row .chip.stamped { animation: nf-stamp .45s cubic-bezier(.2, 1.4, .4, 1) both; }
body.nf-night .chip-row .chip:nth-child(2).stamped { animation-delay: .14s; transform: rotate(-3deg); }
body.nf-night .chip-row .chip:nth-child(3).stamped { animation-delay: .28s; }
@keyframes nf-stamp { 0% { opacity: 0; transform: scale(2.1) rotate(3deg); }
  100% { opacity: 1; transform: scale(1) rotate(-2.5deg); } }

/* ── Night re-skin of the existing sections ─────────────────────────────── */
body.nf-night .section, body.nf-night .section.alt { background: transparent; }
body.nf-night .section h2 { color: #fff; }
body.nf-night .section .lede, body.nf-night .section p { color: rgba(255,255,255,.74); }
body.nf-night .eyebrow { color: #00C9C0; }
body.nf-night .stat { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12);
  border-radius: 14px; }
body.nf-night .stat-num { color: #7FE7E2; }
body.nf-night .stat-lbl { color: rgba(255,255,255,.55); }
body.nf-night .why-card, body.nf-night .ai-tile, body.nf-night .tt-card,
body.nf-night .aud-panel, body.nf-night .proc-body {
  background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12);
  border-radius: 16px; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
body.nf-night .why-card h3, body.nf-night .ai-tile h3, body.nf-night .tt-name,
body.nf-night .aud-panel h3, body.nf-night .proc-body h3 { color: #fff; }
body.nf-night .why-card p, body.nf-night .ai-tile p, body.nf-night .tt-quote,
body.nf-night .aud-panel li, body.nf-night .proc-body p { color: rgba(255,255,255,.72); }
body.nf-night .why-icn { color: #00C9C0; }
body.nf-night .tt-sub { color: rgba(255,255,255,.5); }
body.nf-night .tt-card { position: relative; }
body.nf-night .tt-card::after {        /* visa-stamp corner on every story */
  content: "VERIFIED"; position: absolute; top: 12px; right: 12px;
  font-size: 9.5px; font-weight: 800; letter-spacing: .16em; color: rgba(0,201,192,.75);
  border: 1.5px solid rgba(0,201,192,.45); border-radius: 5px; padding: 2px 6px;
  transform: rotate(6deg); }
body.nf-night .aud-switcher { background: rgba(255,255,255,.07) !important;
  border: 1px solid rgba(255,255,255,.14) !important; border-radius: 99px; }
body.nf-night .aud-tab { background: transparent !important; color: rgba(255,255,255,.62) !important;
  border: none !important; }
body.nf-night .aud-tab.is-active { background: #00C9C0 !important; color: #04102A !important; }
body.nf-night .ai-tile-eye { color: #7FE7E2; }
body.nf-night .ai-tile-cta { color: #00C9C0; }
body.nf-night .proc-dot { background: linear-gradient(135deg, #00C9C0, #0A5DA8);
  color: #04102A; font-weight: 800; box-shadow: 0 0 14px rgba(0,201,192,.45); }

/* ── The dawn arrival ───────────────────────────────────────────────────── */
body.nf-night #cta .cta-card {
  background: linear-gradient(178deg, #0A2D6E 0%, #14559E 42%, #2C8FBF 68%, #E8A45C 96%, #FFC371 100%);
  border: 1px solid rgba(255, 200, 120, .35); border-radius: 22px;
  box-shadow: 0 24px 70px rgba(0, 0, 0, .5), 0 -1px 40px rgba(255, 180, 100, .15) inset;
  position: relative; overflow: hidden; }
body.nf-night #cta .cta-card::before {  /* the sun cresting the horizon */
  content: ""; position: absolute; left: 50%; bottom: -34px; width: 120px; height: 120px;
  transform: translateX(-50%); border-radius: 50%;
  background: radial-gradient(circle, #FFE3B3 0%, #FFC371 45%, rgba(255,195,113,0) 72%);
  filter: blur(2px); }
body.nf-night #cta .cta-card h2, body.nf-night #cta .cta-card p { color: #fff; position: relative; }
body.nf-night #cta .cta-card .eyebrow { color: #FFE3B3; position: relative; }
body.nf-night #cta .cta-card .jp-btn-primary { background: #fff !important;
  font-weight: 800 !important; min-height: 50px; border-radius: 13px; position: relative;
  box-shadow: 0 12px 36px rgba(0, 0, 0, .3); }
body.nf-night #cta .cta-card .jp-btn-primary,
body.nf-night #cta .cta-card .jp-btn-primary * { color: #0A2D6E !important; }  /* no white-on-white, ever */

/* ── v1.7.24 — scroll reveals: nothing static, everything arrives ───────── */
body.nf-night .nf-rv { opacity: 0; transform: translateY(16px); }
body.nf-night .nf-rv.nf-in { opacity: 1; transform: none;
  transition: opacity .6s ease, transform .65s cubic-bezier(.2, .85, .25, 1); }
/* the process gets a proper ending instead of an abrupt stop */
body.nf-night .hero { padding-top: 26px; }
body.nf-night .process { padding-bottom: 4px; }
body.nf-night .process::after { content: "<svg class="jp-ic" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" style="vertical-align:-0.125em"><path d="M17.8 19.2 16 11l3.5-3.5C21 6 21.5 4 21 3c-1-.5-3 0-4.5 1.5L13 8 4.8 6.2c-.5-.1-.9.1-1.1.5l-.3.5c-.2.5-.1 1 .3 1.3L9 12l-2 3H4l-1 1 3 2 2 3 1-1v-3l3-2 3.5 5.3c.3.4.8.5 1.3.3l.5-.2c.4-.3.6-.7.5-1.2z"/></svg>  NEXT — THE AI THAT RUNS IT";
  display: block; margin: 12px 0 0 46px; font-size: 13px; font-weight: 800;
  letter-spacing: .16em; line-height: 1.45; color: rgba(127, 231, 226, .85); }
body.nf-night .proc-step.nf-in .proc-dot { animation: nf-dot-pop .5s cubic-bezier(.2, 1.4, .4, 1) both; }
@keyframes nf-dot-pop { 0% { transform: scale(.4); } 100% { transform: scale(1); } }

/* ── Footer seam ────────────────────────────────────────────────────────── */
body.nf-night .jp-footer { border-top: 1px solid rgba(255,255,255,.08); }

/* ── Reduced motion: everything lands settled ───────────────────────────── */
@media (prefers-reduced-motion: reduce) and (min-width: 99999px) {
  .nf-cell.f { animation: none; }
  body.nf-night .chip-row .chip { opacity: 1; transform: rotate(-2.5deg); animation: none; }
  #nf-route i { animation: none; }
}

/* ============================================================================
   v1.7.29 — device punch-list 2
   ========================================================================== */

/* ── THE white-out root cause, fixed canonically ─────────────────────────
   jp-mobile-components.css sets `-webkit-text-fill-color: var(--jp-on-dark)
   !important` (white) on hero/CTA primaries. On iOS, text-fill-color WINS
   over `color` — so every night rule that re-colored a button via `color`
   alone rendered white-on-white glyphs. Rule of the codebase from here on:
   ANY night rule that sets `color` on a button must mirror it in
   -webkit-text-fill-color with !important. */
body.nf-night #cta .cta-card .jp-btn-primary,
body.nf-night #cta .cta-card .jp-btn-primary * {
  -webkit-text-fill-color: #0A2D6E !important; }

/* ── Patient Stories as boarding passes ─────────────────────────────────── */
body.nf-night .tt-card {
  border-radius: 18px; overflow: hidden;
  background: linear-gradient(168deg, rgba(255,255,255,.10), rgba(255,255,255,.045)) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  padding: 16px 18px 14px !important; }
body.nf-night .tt-card::before {            /* pass header strip */
  content: "JETPATIENT <svg class="jp-ic" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" style="vertical-align:-0.125em"><path d="M17.8 19.2 16 11l3.5-3.5C21 6 21.5 4 21 3c-1-.5-3 0-4.5 1.5L13 8 4.8 6.2c-.5-.1-.9.1-1.1.5l-.3.5c-.2.5-.1 1 .3 1.3L9 12l-2 3H4l-1 1 3 2 2 3 1-1v-3l3-2 3.5 5.3c.3.4.8.5 1.3.3l.5-.2c.4-.3.6-.7.5-1.2z"/></svg> BOARDING PASS"; display: block;
  font-size: 9.5px; font-weight: 800; letter-spacing: .2em;
  color: rgba(127, 231, 226, .8);
  border-bottom: 1px solid rgba(255, 255, 255, .14);
  padding-bottom: 9px; margin-bottom: 12px; }
body.nf-night .tt-card .tt-quote { color: rgba(255, 255, 255, .88) !important; }
body.nf-night .tt-card .tt-meta {           /* perforated stub */
  border-top: 2px dashed rgba(255, 255, 255, .22);
  margin-top: 14px; padding-top: 12px; position: relative; }
body.nf-night .tt-card .tt-meta::after {    /* barcode on the stub */
  content: ""; position: absolute; right: 0; top: 12px; bottom: 2px; width: 44px;
  background: repeating-linear-gradient(90deg,
    rgba(255, 255, 255, .55) 0 2px, transparent 2px 5px,
    rgba(255, 255, 255, .55) 5px 6px, transparent 6px 10px);
  border-radius: 2px; opacity: .5; }
body.nf-night .tt-card .tt-name { color: #fff !important; }
body.nf-night .tt-card .tt-sub { color: rgba(255, 255, 255, .55) !important;
  text-transform: uppercase; letter-spacing: .08em; font-size: 10.5px !important; }

/* ============================================================================
   v1.7.30 — THE canonical Night Flight top bar (universal)
   ----------------------------------------------------------------------------
   One bar, every night page: fixed to the top, #04102A, centered white
   wordmark at 34px, white hamburger on the right. Lives here (the core
   sheet) so coverage equals nf-night coverage — the menu layer no longer
   carries it alone. Covers both header variants:
     #nav      — marketing twins + orphan pages
     .topbar   — back/title sub-screens (AI demos, tools)
   ========================================================================== */
body.nf-night #nav {
  position: fixed !important; top: 0; left: 0; right: 0; z-index: 1000;
  background: #04102A !important;
  -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
  border-bottom: 1px solid rgba(255, 255, 255, .08) !important;
  box-shadow: 0 6px 26px rgba(0, 0, 0, .35) !important; }
body.nf-night #nav .nav-in { position: relative; }
body.nf-night #nav .nav-logo { position: absolute; left: 50%; top: 50%;
  transform: translate(-50%, -50%); margin: 0 !important; }
/* v1.7.31 — the canonical-nav inline block ships `filter: none !important`
   on the logo, which silently beat the un-!important'd invert (dark logo on
   the dark bar). The white logo is now non-negotiable — and larger. */
body.nf-night #nav .nav-logo img { height: 40px !important; width: auto !important;
  max-height: none !important;
  filter: brightness(0) invert(1) !important;
  -webkit-filter: brightness(0) invert(1) !important; }
body.nf-night #nav .nav-logo span, body.nf-night #nav .nav-logo b {
  color: #fff !important; -webkit-text-fill-color: #fff !important;
  font-size: 17px !important; }
/* declutter: dropdowns/actions live in the shared menu on mobile */
body.nf-night #nav .nav-links, body.nf-night #nav .btn-ghost-sm,
body.nf-night #nav .nav-lang { display: none !important; }
body.nf-night #nav-hamburger { margin-left: auto !important; width: 44px; height: 44px;
  display: inline-flex !important; align-items: center; justify-content: center;
  background: rgba(255, 255, 255, .08) !important;
  border: 1px solid rgba(255, 255, 255, .18) !important;
  border-radius: 12px !important; color: #fff !important; cursor: pointer; }
body.nf-night #nav-hamburger span, body.nf-night #nav-hamburger i,
body.nf-night #nav-hamburger b { background: #fff !important; }
body.nf-night #nav-hamburger svg { stroke: #fff !important; color: #fff !important; }
/* pages without the jp-nav-padded helper still clear the fixed bar */
body.nf-night:has(#nav):not(.jp-nav-padded) {
  padding-top: calc(72px + env(safe-area-inset-top, 0px)) !important; }

/* the back/title topbar variant joins the night */
body.nf-night .topbar { position: sticky !important; top: 0; z-index: 50;
  background: #04102A !important;
  -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
  border-bottom: 1px solid rgba(255, 255, 255, .08) !important; }
body.nf-night .topbar-title { color: #fff !important;
  -webkit-text-fill-color: #fff !important; }
body.nf-night .topbar-back { color: #fff !important; }
body.nf-night .topbar-back:active { background: rgba(255, 255, 255, .10) !important; }
body.nf-night .topbar-logo img, body.nf-night .topbar .topbar-logo-mark img {
  filter: brightness(0) invert(1) !important;
  -webkit-filter: brightness(0) invert(1) !important; }
body.nf-night .topbar-logo-text { color: #fff !important;
  -webkit-text-fill-color: #fff !important; }

/* ── v1.7.40 · footer joins the night + page-end rhythm ─────────────────── */
body.nf-night .jp-footer { border-top: 1px solid rgba(255,255,255,.10); }
body.nf-night .jp-footer a { color: rgba(255,255,255,.78) !important;
  -webkit-text-fill-color: rgba(255,255,255,.78) !important; text-decoration: none; }
body.nf-night .jp-footer a:active { color: #7FE7E2 !important;
  -webkit-text-fill-color: #7FE7E2 !important; }
/* body + main both reserved space for the CTA dock (76px + 88px) — one is enough */
body.nf-night main, body.jp-has-mobile-cta.nf-night main { padding-bottom: 16px !important; }


/* ── v1.7.41 · Verified journeys (task 11) ──────────────────────────────── */
#nf-journeys { padding: 30px 0 26px; }
#nf-journeys .nfj-cap { font-size: 12px; font-weight: 800; letter-spacing: .14em;
  color: #7FE7E2; padding: 0 18px; margin-bottom: 6px; }
#nf-journeys h2 { color: #fff; font-size: 24px; letter-spacing: -.02em;
  padding: 0 18px; margin: 0 0 14px; }
.nfj-row { display: flex; gap: 12px; overflow-x: auto; padding: 2px 18px 10px;
  scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch; }
.nfj-row::-webkit-scrollbar { display: none; }
.nfj-card { flex: 0 0 82%; max-width: 330px; scroll-snap-align: center;
  background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.12);
  border-radius: 18px; padding: 16px; position: relative; }
.nfj-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.nfj-av { width: 38px; height: 38px; border-radius: 50%; flex: 0 0 auto;
  display: grid; place-items: center; font-weight: 800; font-size: 16px; color: #04102A;
  background: linear-gradient(135deg, #7FE7E2, #00A89F); }
.nfj-head b { display: block; color: #fff; font-size: 14.5px; }
.nfj-head i { display: block; font-style: normal; font-size: 11px;
  color: rgba(255,255,255,.6); letter-spacing: .03em; }
.nfj-stars { margin-left: auto; color: #F2C94C; font-size: 12px; font-weight: 800; }
.nfj-proc { color: rgba(255,255,255,.85); font-size: 13px; font-weight: 700; margin-bottom: 6px; }
.nfj-fare { display: flex; align-items: baseline; gap: 8px; margin-bottom: 6px; }
.nfj-fare s { color: rgba(255,255,255,.4); font-size: 13px; }
.nfj-fare b { color: #7FE7E2; font-size: 19px; letter-spacing: -.01em;
  text-shadow: 0 0 16px rgba(0,201,192,.4); }
.nfj-save { padding: 2px 8px; border-radius: 999px; font-size: 11px; font-weight: 800;
  background: rgba(0,201,192,.16); border: 1px solid rgba(0,201,192,.4); color: #7FE7E2; }
.nfj-rec { color: rgba(255,255,255,.66); font-size: 12.5px; line-height: 1.45; margin-bottom: 10px; }
.nfj-stamp { position: absolute; top: 14px; right: -6px; transform: rotate(4deg);
  font-size: 9px; font-weight: 800; letter-spacing: .12em; color: #7FE7E2;
  border: 1.5px solid rgba(0,201,192,.55); border-radius: 4px; padding: 2px 6px;
  background: rgba(4,16,42,.7); cursor: pointer; }
.nfj-cta { display: block; text-align: center; min-height: 44px; line-height: 44px;
  border-radius: 12px; font-weight: 800; font-size: 14px; text-decoration: none;
  color: #04102A !important; -webkit-text-fill-color: #04102A !important;
  background: linear-gradient(135deg, #00C9C0, #00A89F); }

/* ── v1.7.41 · Trust sheet (task 13) ────────────────────────────────────── */
#nf-trust-sheet { position: fixed; inset: 0; z-index: 4000; }
#nf-trust-sheet[hidden] { display: none; }
.nfts-scrim { position: absolute; inset: 0; background: rgba(2,8,24,.6);
  -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
.nfts-panel { position: absolute; left: 0; right: 0; bottom: 0; max-height: 86dvh;
  overflow-y: auto; background: #081B40; border-radius: 22px 22px 0 0;
  border-top: 1px solid rgba(255,255,255,.14); padding: 10px 20px
  calc(20px + env(safe-area-inset-bottom)); }
@media (min-width: 0px) {
  .nfts-panel { animation: nfts-rise .28s ease; }
  @keyframes nfts-rise { from { transform: translateY(24px); opacity: .4; } to { transform: none; opacity: 1; } }
}
.nfts-grab { width: 40px; height: 4px; border-radius: 2px; margin: 6px auto 12px;
  background: rgba(255,255,255,.25); }
.nfts-panel h3 { color: #fff; font-size: 19px; letter-spacing: -.015em; margin: 0 0 12px; }
.nfts-panel ul { list-style: none; margin: 0 0 16px; padding: 0; display: flex;
  flex-direction: column; gap: 12px; }
.nfts-panel li b { display: block; color: #7FE7E2; font-size: 13.5px; margin-bottom: 2px; }
.nfts-panel li span { color: rgba(255,255,255,.78); font-size: 13px; line-height: 1.55; }
.nfts-cta { display: block; text-align: center; min-height: 48px; line-height: 48px;
  border-radius: 13px; font-weight: 800; text-decoration: none;
  color: #04102A !important; -webkit-text-fill-color: #04102A !important;
  background: linear-gradient(135deg, #00C9C0, #00A89F); }
.nfts-close { position: absolute; top: 12px; right: 14px; width: 36px; height: 36px;
  border-radius: 50%; border: 1px solid rgba(255,255,255,.2); background: rgba(255,255,255,.08);
  color: #fff; font-size: 20px; line-height: 1; }
body.nf-night .pill.jci, body.nf-night .stamp { cursor: pointer; }

/* v1.7.41 — fallback fare dock (pages where the shell renders no CTA dock) */
#nf-fare-dock { position: fixed; left: 12px; right: 12px; z-index: 1200;
  bottom: calc(12px + env(safe-area-inset-bottom)); }
#nf-fare-dock .nf-fare-go { display: block; text-align: center; min-height: 52px;
  line-height: 52px; border-radius: 14px; font-weight: 800; font-size: 15px;
  text-decoration: none; color: #04102A !important; -webkit-text-fill-color: #04102A !important;
  background: linear-gradient(135deg, #00C9C0, #00A89F);
  box-shadow: 0 10px 30px rgba(0, 201, 192, .35), 0 4px 14px rgba(0, 0, 0, .4); }
body:has(#nf-fare-dock) footer.jp-footer { padding-bottom: 84px; }

/* v1.7.43 — a11y (axe serious): footer bottom line was below 4.5:1 on navy */
body.nf-night .jp-footer .footer-bottom,
body.nf-night .jp-footer .footer-bottom span { color: rgba(255,255,255,.72) !important;
  -webkit-text-fill-color: rgba(255,255,255,.72) !important; }

/* ═══ v1.8.0 (r21) — CTA dock, dawn arrival, live boarding pass ═══ */
#jp-mob-cta{position:fixed;left:0;right:0;bottom:0;z-index:9300;padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px));
  background:linear-gradient(180deg,rgba(4,16,42,0),rgba(4,16,42,.88) 40%);pointer-events:none}
#jp-mob-cta .jp-mob-cta-primary{pointer-events:auto;display:flex;align-items:center;justify-content:center;
  min-height:52px;border-radius:16px;text-decoration:none;font-weight:800;font-size:15px;
  background:linear-gradient(135deg,#00C9C0,#00A89F);color:#04102A;-webkit-text-fill-color:#04102A;
  box-shadow:0 10px 30px rgba(0,201,192,.4)}
#jp-mob-cta .jp-mob-cta-primary:active{transform:scale(.985)}
body.nf-menu-open #jp-mob-cta{display:none}
body:has(#jp-mob-cta) footer.jp-footer{padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))}
/* dawn arrival: the sky warms as the journey lands */
body.nf-night::after{content:"";position:fixed;left:0;right:0;bottom:0;height:44vh;pointer-events:none;z-index:1;
  background:linear-gradient(180deg,rgba(255,150,60,0) 0%,rgba(255,140,66,.14) 55%,rgba(255,195,113,.30) 100%);
  opacity:0;transition:opacity 1.6s ease}
body.nf-night.nf-dawn::after{opacity:1}
@media (prefers-reduced-motion: reduce) and (min-width: 99999px){ body.nf-night::after{transition:none} }
/* the pass notices it's yours */
body.nf-night .nf-pass.nf-pass-live{border-color:rgba(0,201,192,.55) !important;
  box-shadow:0 0 0 1px rgba(0,201,192,.25), 0 18px 50px rgba(0,201,192,.18)}