/* ============================================================================
   next.css — THE NEXT HOME PAGE. A layer over styles.css and viewfinder.css.
   Built 2026-09-29 as a side-by-side copy of website/ (folder website-next/), so Flor can
   compare it with the live page. Nothing in website/ was touched.

   WHAT STAYS EXACTLY AS IT WAS, on Flor's word:
     · the scene (#plate, plate.js): the wash, the blooms, the flower
     · the buttons: .btn, .btn.primary, .btn.big and the accent wipe (styles.css, untouched)
     · the viewfinder frame, the slate lines, the tone ramp, the hero headline and Flor's lines

   WHAT IS NEW:
     · the multiviewer (#what): twelve rooms as a wall of monitors, a lower third for each
     · the assistant band (#sidekick): capabilities with their limits, a deal card that stages
       and waits, and a brain switch that draws where the thinking happens
     · the crew list (#lanes), the connection ledger (#privacy), the receipt (#pricing), the FAQ

   ⚠ THE RACK AND ITS SCREENS RE-DECLARE THE DARK RAMP (the .desk-frame idiom): they are
   devices, so they stay dark on the paper ground.
   ⚠ Every moving part is finite (no infinite animation) and stills under reduced motion.
   ============================================================================ */

/* ---------------------------------------------------------------------------
   0 · the tone ramp for the two new acts, and a few utilities
   --------------------------------------------------------------------------- */
.cam--home #lanes { --tone: #BD53B0; }
.cam--home #faq   { --tone: #9259E9; }

.vh {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.nx-textbtn {
  appearance: none; background: none; border: 0; padding: 8px 4px; cursor: pointer;
  font: 700 11.5px/1 var(--font-label); letter-spacing: .16em; text-transform: uppercase;
  color: var(--text-3); text-decoration: underline; text-underline-offset: 5px;
  text-decoration-color: color-mix(in srgb, var(--text-3) 45%, transparent);
  transition: color .2s var(--ease-out), text-decoration-color .2s var(--ease-out);
}
.nx-textbtn:hover, .nx-textbtn:focus-visible { color: var(--text); text-decoration-color: currentColor; }
.nx-textbtn[hidden] { display: none; }

/* ---------------------------------------------------------------------------
   1 · HERO — the same lockup, breathed a little; the small print reads as a sentence
   --------------------------------------------------------------------------- */
.cam .hero h1 { letter-spacing: -0.046em; }
.cam .hero .microcopy { font-size: 14.5px; line-height: 1.55; color: var(--text-2); max-width: 46ch; }
.cam .hero .microcopy b { color: var(--text); font-weight: 600; }
.cam .hero .reqline { color: var(--text-3); }

/* ---------------------------------------------------------------------------
   2 · THE DEMO — a heading, and three things worth pressing
   --------------------------------------------------------------------------- */
.nx-demohead {
  display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 72px);
  align-items: end; margin-bottom: clamp(30px, 3.6vw, 48px);
}
.cam #demo .nx-demohead .shead { margin-bottom: 0; }
.cam #demo .nx-demohead .shead h2 { font-size: clamp(38px, 4.9vw, 74px); max-width: 12ch; margin-bottom: 0; }
.nx-demohead__side p {
  margin: 0 0 20px; font-size: clamp(16.5px, 1.35vw, 19px); line-height: 1.55; color: var(--text-2); max-width: 44ch;
  text-shadow: 0 0 10px rgba(var(--bg-rgb), .9), 0 0 24px rgba(var(--bg-rgb), .6);
}
.nx-try { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0; }
.nx-try__k {
  font: 700 10.5px/1 var(--font-label); letter-spacing: var(--track-wide); text-transform: uppercase;
  color: var(--tone-text); width: 100%; display: inline-flex; align-items: center; gap: 10px;
}
.nx-try__k::before { content: ""; width: 26px; height: 2px; background: var(--tone); }
.nx-try__b {
  appearance: none; cursor: pointer; background: rgba(var(--bg-rgb), .55);
  border: 1px solid var(--border-strong); color: var(--text);
  font: 600 14px/1 var(--font-body); padding: 12px 16px; letter-spacing: 0;
  transition: border-color .2s var(--ease-out), background .2s var(--ease-out), transform .2s var(--ease-out);
}
.nx-try__b::after { content: " →"; color: var(--tone-text); }
.nx-try__b:hover, .nx-try__b:focus-visible { border-color: var(--tone); background: rgba(var(--bg-rgb), .85); transform: translateY(-1px); }
.nx-try__b:active { transform: none; }
@media (max-width: 900px) { .nx-demohead { grid-template-columns: 1fr; align-items: start; } }

/* ---------------------------------------------------------------------------
   3 · THE MULTIVIEWER — twelve monitors on one wall
   --------------------------------------------------------------------------- */
.mv {
  --mv-bg: #0b0a0e;
  --mv-line: rgba(255, 255, 255, .12);
  --mv-line2: rgba(255, 255, 255, .26);
  --mv-ink: #F7F4F6; --mv-ink2: #B6AFBA; --mv-ink3: #8E8792;
  --mv-g: #34E07E; --mv-a: #F5A623; --mv-r: #FF4655; --mv-v: #A78BFA; --mv-b: #7C9AB5;
  --mv-paper: #FBF7F0; --mv-paper-ink: #14100D;
  position: relative; background: var(--mv-bg); color: var(--mv-ink);
  border: 1px solid var(--mv-line2);
  padding: clamp(12px, 1.5vw, 20px);
  box-shadow: 0 60px 140px -60px rgba(0, 0, 0, .9), inset 0 1px 0 rgba(255, 255, 255, .05);
}
.mv::before {
  content: ""; position: absolute; left: -1px; right: -1px; top: -1px; height: 3px;
  background: linear-gradient(90deg, var(--accent), var(--violet) 70%, transparent);
}
.mv__bar {
  display: flex; justify-content: space-between; align-items: center; gap: 12px 24px; flex-wrap: wrap;
  padding: 4px 2px 14px;
  font: 700 10.5px/1 var(--font-label); letter-spacing: .2em; text-transform: uppercase; color: var(--mv-ink3);
}
.mv__src { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 4px 10px; }
.mv__src i { width: 8px; height: 8px; background: var(--mv-g); }
.mv__src b { color: var(--mv-ink); font-weight: 700; }
.mv__src em { font-style: normal; font-weight: 500; letter-spacing: .04em; text-transform: none; font-size: 12.5px; }
.mv__key { display: inline-flex; gap: 20px; }
.mv__k { display: inline-flex; align-items: center; gap: 8px; }
.mv__k i { width: 8px; height: 8px; }
.mv__k--pgm i { background: var(--mv-r); }
.mv__k--pvw i { background: var(--mv-g); }

/* the wall on the left, the program panel held on the right while any of the wall is on screen */
.mv__body {
  display: grid; grid-template-columns: minmax(0, 1fr) clamp(340px, 30vw, 412px);
  gap: clamp(16px, 2vw, 28px); align-items: start;
}
.mv__wall {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(10px, 1.1vw, 16px);
}
.mv__cell { margin: 0; min-width: 0; }
.mv__tile {
  appearance: none; background: none; border: 0; padding: 0; margin: 0; width: 100%;
  display: block; text-align: left; color: inherit; font: inherit; cursor: pointer;
  container-type: inline-size;
}
.mv__frame {
  display: block; position: relative; background: #000; border: 1px solid var(--mv-line);
  transition: border-color .25s var(--ease-out), box-shadow .4s var(--ease-out), transform .4s var(--ease-out);
}
.mv__screen {
  display: block; position: relative; overflow: hidden; aspect-ratio: 16 / 10.6;
  background: #0d0c11; color: var(--mv-ink2);
  font: 500 3.5cqw/1.3 var(--font-num); letter-spacing: 0; text-transform: none; font-variant-numeric: tabular-nums; }
/* glass: a soft reflection and a faint line structure, like a real monitor */
.mv__screen::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 3;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .065), transparent 38%),
    repeating-linear-gradient(0deg, rgba(255, 255, 255, .02) 0 1px, transparent 1px 3px);
}
.mv__cap {
  display: flex; align-items: center; gap: 9px; padding: 10px 2px 0;
  font: 700 11px/1 var(--font-label); letter-spacing: .16em; text-transform: uppercase; color: var(--mv-ink2);
  transition: color .25s var(--ease-out);
}
.mv__tally { width: 8px; height: 8px; flex: none; background: #3a3641; transition: background .25s var(--ease-out), box-shadow .25s var(--ease-out); }

.mv__tile:hover .mv__frame, .mv__tile:focus-visible .mv__frame { border-color: var(--mv-g); transform: translateY(-2px); }
.mv__tile:hover .mv__tally, .mv__tile:focus-visible .mv__tally { background: var(--mv-g); box-shadow: 0 0 10px var(--mv-g); }
.mv__tile:hover .mv__cap, .mv__tile:focus-visible .mv__cap { color: var(--mv-ink); }
.mv__tile:focus-visible { outline: 2px solid var(--accent); outline-offset: 5px; }
.mv__tile[aria-pressed="true"] .mv__frame {
  border-color: var(--mv-r);
  box-shadow: 0 0 0 1px var(--mv-r), 0 0 46px -10px rgba(var(--accent-rgb), .6);
}
.mv__tile[aria-pressed="true"] .mv__tally { background: var(--mv-r); box-shadow: 0 0 10px var(--mv-r); }
.mv__tile[aria-pressed="true"] .mv__cap { color: var(--mv-ink); }

/* power on, once, room by room (finite; still under reduced motion and with JS off) */
@keyframes mv-on {
  0%   { opacity: 0; filter: brightness(3.2) saturate(0); }
  28%  { opacity: 1; filter: brightness(2) saturate(.4); }
  100% { opacity: 1; filter: none; }
}
.js .mv:not(.is-on) .mv__screen > .sc { opacity: 0; }
.js .mv.is-on .mv__screen > .sc { animation: mv-on .8s var(--ease-out) both; animation-delay: calc(var(--i, 0) * 70ms); }
.mv__cell { --i: 0; }
.mv__cell .mv__screen > .sc { --i: inherit; }

/* ---- what is drawn on the screens -------------------------------------------- */
.sc { display: block; position: absolute; inset: 0; padding: 1.1em 1.25em; }
.sc-h {
  display: flex; justify-content: space-between; align-items: baseline; gap: .8em;
  margin: 0 0 .8em; font: 700 1em/1 var(--font-body); letter-spacing: 0; text-transform: none; color: var(--mv-ink);
}
.sc-h em { font: 500 .82em/1 var(--font-num); font-style: normal; color: var(--mv-ink3); white-space: nowrap; font-variant-numeric: tabular-nums; }
.sc-r {
  display: flex; align-items: center; gap: .7em; padding: .52em 0;
  border-top: 1px solid rgba(255, 255, 255, .08);
}
.sc-r > span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--mv-ink); }
.sc-r > i { font-style: normal; color: var(--mv-ink2); white-space: nowrap; }
.sc-t {
  font-style: normal; font-weight: 700; font-size: .74em; line-height: 1; letter-spacing: .06em; text-transform: uppercase;
  padding: .28em .55em; border: 1px solid currentColor; white-space: nowrap; flex: none;
}
.sc-t.g { color: var(--mv-g); } .sc-t.r { color: var(--mv-r); } .sc-t.a { color: var(--mv-a); } .sc-t.b { color: var(--mv-b); }
.sc-av {
  flex: none; width: 1.7em; height: 1.7em; display: grid; place-items: center;
  background: rgba(255, 255, 255, .08); color: var(--mv-ink); font: 700 .82em/1 var(--font-body); font-style: normal;
}
.sc-age { display: flex; gap: 2px; height: .6em; margin-top: .8em; }
.sc-age i { display: block; height: 100%; }
.sc-age .g { background: var(--mv-g); } .sc-age .r { background: var(--mv-r); }

.sc--kan { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .8em; align-content: start; padding-top: 1.3em; }
.sc-col b { display: block; margin-bottom: .7em; font: 700 .78em/1 var(--font-body); letter-spacing: .1em; text-transform: uppercase; color: var(--mv-ink3); }
.sc-col::after { content: ""; display: block; height: 3.2em; margin-top: .6em; border: 1px dashed rgba(255, 255, 255, .11); }
.sc-card { display: block; background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .1); padding: .75em .65em; }
.sc-card u { display: block; text-decoration: none; color: var(--mv-ink); font-size: .96em; line-height: 1.2; margin-bottom: .8em; }
.sc-card i { display: block; position: relative; height: .38em; background: rgba(255, 255, 255, .1); }
.sc-card i::before { content: ""; position: absolute; inset: 0; width: var(--w); background: var(--accent); }
.sc-card.is-done i::before { background: var(--mv-g); }

.sc--cal .sc-h em { display: inline-flex; gap: .6em; align-items: center; }
.sc--cal .sc-h u { display: inline-block; width: .7em; height: .7em; margin: 0 .1em 0 .4em; text-decoration: none; }
.sc--cal .sc-h u.s { background: var(--accent); } .sc--cal .sc-h u.d { background: var(--mv-v); } .sc--cal .sc-h u.r { background: var(--mv-a); }
.sc-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: .3em; counter-reset: d -3; }
.sc-grid i { display: block; aspect-ratio: 1.55; background: rgba(255, 255, 255, .045); padding: .22em .3em; font-style: normal; font-size: .72em; line-height: 1; color: var(--mv-ink3); counter-increment: d; }
.sc-grid i::before { content: counter(d); }
.sc-grid i:nth-child(-n+3)::before, .sc-grid i:nth-child(n+35)::before { content: none; }
.sc-grid i:nth-child(-n+3), .sc-grid i:nth-child(n+35) { background: transparent; }
.sc-grid i:nth-child(12) { box-shadow: inset 0 0 0 1px var(--mv-ink3); color: var(--mv-ink); }
.sc-grid i:nth-child(19) { background: var(--accent); color: #fff; }
.sc-grid i:nth-child(22) { background: var(--mv-v); color: #14100D; }
.sc-grid i:nth-child(27) { background: var(--mv-a); color: #14100D; }

/* paper on the screens: the call sheet, the contract, the media kit */
.sc-paper {
  display: block; position: absolute; left: 1.5em; right: 1.5em; top: 1.1em; bottom: 0;
  background: var(--mv-paper); color: var(--mv-paper-ink); padding: .95em 1.1em;
  box-shadow: 0 .6em 1.6em rgba(0, 0, 0, .55);
}
.sc-paper > b { display: block; margin: 0 0 .55em; font: 800 1.28em/1 var(--font-voice); letter-spacing: -.025em; color: var(--mv-paper-ink); text-transform: none; }
.sc-ln { display: flex; justify-content: space-between; gap: 1em; padding: .3em 0; border-bottom: 1px solid rgba(20, 16, 13, .16); font-size: .92em; }
.sc-ln span { color: #6B6154; text-transform: uppercase; letter-spacing: .08em; font-size: .82em; align-self: center; }
.sc-ln em { font-style: normal; color: var(--mv-paper-ink); text-align: right; }
.sc-bar { display: block; height: .45em; margin-top: .75em; background: rgba(20, 16, 13, .15); }
.sc-bar--s { width: 62%; }
.sc-send {
  position: absolute; right: 1em; bottom: .9em; font: 700 .74em/1 var(--font-body); font-style: normal;
  letter-spacing: .12em; text-transform: uppercase; background: var(--mv-paper-ink); color: var(--mv-paper); padding: .6em .9em;
}
.sc-sign { display: flex; justify-content: space-between; align-items: flex-end; gap: 1em; margin-top: .9em; padding-right: 7em; }
.sc-sign u { text-decoration: none; font: 500 1.05em/1 var(--font-body); padding: 0 1em .18em 0; border-bottom: 1px solid var(--mv-paper-ink); color: var(--mv-paper-ink); }
.sc-paper .sc-t.g { color: #1E7A46; }

.sc-bars { display: block; }
.sc-br { display: grid; grid-template-columns: 8.4em minmax(0, 1fr) 3.3em; align-items: center; gap: .7em; padding: .42em 0; border-top: 1px solid rgba(255, 255, 255, .06); }
.sc-br span { color: var(--mv-ink2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sc-br i { display: block; position: relative; height: .6em; background: rgba(255, 255, 255, .08); }
.sc-br i::before { content: ""; position: absolute; inset: 0; width: var(--w); background: var(--accent); }
.sc-br em { font-style: normal; text-align: right; color: var(--mv-ink); }
.sc-snap {
  position: absolute; left: 1.25em; bottom: 1.1em; font: 700 .74em/1 var(--font-body); font-style: normal;
  letter-spacing: .12em; text-transform: uppercase; color: var(--mv-ink); border: 1px solid var(--mv-line2); padding: .6em .9em;
}
.sc-snap::before { content: "▣ "; color: var(--accent); }

/* 1.5's rooms: Jobs (one ink, red only when late), Footage, Hours, Gear */
.sc-job { display: grid; grid-template-columns: minmax(0, 1fr) 4.5em 5.6em; align-items: center; gap: .7em; padding: .55em 0; border-top: 1px solid rgba(255, 255, 255, .08); }
.sc-job span { color: var(--mv-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sc-job i { display: block; position: relative; height: .38em; background: rgba(255, 255, 255, .1); }
.sc-job i::before { content: ""; position: absolute; inset: 0; width: var(--w); background: var(--mv-ink2); }
.sc-job em { font-style: normal; font-size: .84em; text-align: right; color: var(--mv-ink2); white-space: nowrap; }
.sc-job em.is-late { color: var(--mv-r); }
.sc-ok {
  position: absolute; left: 1.25em; bottom: 1.1em; font: 700 .74em/1 var(--font-body); letter-spacing: .12em; text-transform: uppercase;
  color: var(--mv-ink); border: 1px solid var(--mv-ink2); padding: .6em .9em;
}
.sc-clock { display: flex; align-items: baseline; gap: .8em; margin: 0 0 .7em; }
.sc-clock b { font: 700 1.9em/1 var(--font-num); color: var(--mv-ink); font-variant-numeric: tabular-nums; }
.sc-clock em { font-style: normal; font-size: .84em; color: var(--mv-ink3); }
.sc-clock em::before { content: ""; display: inline-block; width: .55em; height: .55em; margin-right: .45em; background: var(--accent); border-radius: 50%; }
.sc-snap--doc::before { content: "⇣ "; }

.sc-flow { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .8em; margin: 0 0 1em; }
.sc-flow > span { display: block; padding-top: .7em; border-top: 2px solid var(--mv-v); }
.sc-flow > .is-owed { border-top-color: var(--mv-r); }
.sc-flow em { display: block; font-style: normal; font-size: .76em; letter-spacing: .08em; text-transform: uppercase; color: var(--mv-ink3); margin-bottom: .35em; white-space: nowrap; }
.sc-flow b { display: block; font: 700 1.25em/1 var(--font-num); color: var(--mv-ink); margin-bottom: .6em; font-variant-numeric: tabular-nums; }
.sc-flow i { display: block; height: .5em; width: var(--w); background: var(--mv-v); }
.sc-flow .is-owed i { background: var(--mv-r); }

.sc-seq { display: flex; align-items: center; margin: .5em .25em .35em; }
.sc-seq i { flex: none; width: 1.25em; height: 1.25em; border: 2px solid var(--mv-ink3); }
.sc-seq i.on { background: var(--accent); border-color: var(--accent); }
.sc-seq u { flex: 1; height: 2px; background: rgba(255, 255, 255, .16); }
.sc-seqk { display: flex; justify-content: space-between; margin-bottom: .9em; color: var(--mv-ink3); font-size: .82em; }
.sc-seqk em { font-style: normal; }

.sc-tri { display: grid; grid-template-columns: repeat(3, 1fr); gap: .6em; margin: .65em 0 .6em; }
.sc-tri > span { display: block; border: 1px solid rgba(20, 16, 13, .2); padding: .55em .6em .7em; }
.sc-tri em { display: block; font-style: normal; font-size: .76em; letter-spacing: .08em; text-transform: uppercase; color: #6B6154; }
.sc-tri i { display: block; height: .5em; margin-top: .55em; background: rgba(20, 16, 13, .17); }
.sc-src { display: block; font-size: .78em; line-height: 1.4; color: #6B6154; padding-right: 6em; }

.sc-net { display: flex; align-items: flex-end; gap: 1.8em; margin: .2em 0 1em; }
.sc-net em { display: block; font-style: normal; font-size: .76em; letter-spacing: .08em; text-transform: uppercase; color: var(--mv-ink3); margin-bottom: .45em; }
.sc-net b { display: block; font: 800 2.5em/1 var(--font-voice); letter-spacing: -.04em; color: var(--mv-ink); }
.sc-net span:first-child b { color: var(--mv-ink); }   /* money is ink (1.5.0); red only when late */
.sc-split { display: flex; gap: 2px; height: .75em; margin-bottom: .55em; }
.sc-split i { display: block; height: 100%; }
.sc-split .g { background: var(--mv-g); } .sc-split .r { background: var(--mv-r); }

/* ---- the program panel -------------------------------------------------------- */
.mv__info {
  position: sticky; top: 92px; align-self: start;
  display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px;
  padding: 0 0 clamp(18px, 2vw, 26px);
  background: rgba(255, 255, 255, .035); border: 1px solid var(--mv-line);
}
.mv__info > :not(.mv__prog) { margin-inline: clamp(18px, 2vw, 26px); }
.mv__prog { container-type: inline-size; margin: -1px -1px 4px; }
.mv__prog .mv__frame { border-color: var(--mv-r); transform: none; box-shadow: 0 0 0 1px var(--mv-r); }
.mv__info.is-preview .mv__prog .mv__frame { border-color: var(--mv-g); box-shadow: 0 0 0 1px var(--mv-g); }
.mv__prog .mv__screen { font-size: 3.4cqw; }
.mv__info::before { content: ""; position: absolute; left: -1px; top: -1px; bottom: -1px; width: 3px; background: var(--mv-r); transition: background .25s var(--ease-out); }
.mv__info.is-preview::before { background: var(--mv-g); }
.mv__pill { display: inline-flex; align-items: center; gap: 9px; font: 700 10.5px/1 var(--font-label); letter-spacing: .2em; text-transform: uppercase; color: var(--mv-ink3); }
.mv__pill i { width: 8px; height: 8px; background: var(--mv-r); transition: background .25s var(--ease-out); }
.mv__info.is-preview .mv__pill i { background: var(--mv-g); }
.mv__name {
  margin: 0; font: 800 clamp(30px, 2.8vw, 42px)/.98 var(--font-voice);
  letter-spacing: -.04em; text-transform: none; color: var(--mv-ink);
}
.mv__text { margin: 0; font-size: clamp(15.5px, 1.2vw, 17px); line-height: 1.62; color: var(--mv-ink2); max-width: 62ch; }
.mv__lawbox {
  margin: 0; padding: 2px 0 2px 16px; border-left: 2px solid var(--tone);
  font: 700 clamp(16px, 1.35vw, 19px)/1.35 var(--font-voice); letter-spacing: -.02em; color: var(--mv-ink);
}
@keyframes mv-cut { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: none; } }
.mv__info.is-cut .mv__name, .mv__info.is-cut .mv__text, .mv__info.is-cut .mv__lawbox { animation: mv-cut .42s var(--ease-out) both; }
.mv__info.is-cut .mv__text { animation-delay: .04s; } .mv__info.is-cut .mv__lawbox { animation-delay: .08s; }
.mv__cap-note { margin: 12px 0 0; font-size: 12.5px; line-height: 1.4; color: var(--text-3); }
.cam #what .what__foot { margin-top: clamp(34px, 4vw, 56px); }

/* JS off: every room keeps its own words under its screen and the lower third goes */
html:not(.js) .mv__info { display: none; }
html:not(.js) .mv__bar .mv__key { display: none; }
html:not(.js) .mv__cell { display: flex; flex-direction: column; }
html:not(.js) .mv__desc { padding: 14px 2px 10px; }
html:not(.js) .mv__desc h3 { font: 800 20px/1.1 var(--font-voice); letter-spacing: -.025em; text-transform: none; margin: 0 0 8px; color: var(--mv-ink); }
html:not(.js) .mv__desc p { margin: 0 0 8px; font-size: 14px; line-height: 1.55; color: var(--mv-ink2); }
html:not(.js) .mv__desc .mv__law { font-weight: 700; color: var(--mv-ink); }
.js .mv__desc { display: none; }

/* ---------------------------------------------------------------------------
   4 · THE SIDEKICK — capabilities with their limits, a deal that waits, a brain that moves
   --------------------------------------------------------------------------- */
.cam #sidekick .shead h2 { max-width: 14ch; }
.nx-aide {
  display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
  gap: clamp(32px, 5vw, 84px); align-items: start; margin-bottom: clamp(52px, 6vw, 92px);
}
.nx-aide__list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--border); }
.nx-cap { padding: clamp(24px, 2.6vw, 36px) 0; border-bottom: 1px solid var(--border); }
.nx-cap h3 {
  margin: 0 0 14px; font: 800 clamp(24px, 2.3vw, 34px)/1.05 var(--font-voice);
  letter-spacing: -.035em; text-transform: none; color: var(--text);
}
.nx-cap p {
  margin: 0; font-size: clamp(16px, 1.25vw, 18px); line-height: 1.62; color: var(--text-2); max-width: 56ch;
  text-shadow: 0 0 10px rgba(var(--bg-rgb), .9), 0 0 24px rgba(var(--bg-rgb), .6);
}
.nx-cap em { font-style: normal; color: var(--text); font-weight: 600; }
.nx-cap .nx-limit {
  display: flex; gap: 16px; align-items: baseline; margin-top: 18px; padding-top: 14px;
  border-top: 1px dashed var(--border-strong);
  font: 600 15.5px/1.45 var(--font-body); color: var(--text);
}
.nx-limit span {
  flex: none; font: 700 10.5px/1 var(--font-label); letter-spacing: .2em; text-transform: uppercase; color: var(--tone-text);
}

.nx-deal {
  position: sticky; top: 104px; --tone: #C551A6;
  background: rgba(var(--bg-rgb), .88); border: 1px solid var(--border-strong);
  padding: clamp(20px, 2.2vw, 30px); box-shadow: 0 40px 100px -50px rgba(0, 0, 0, .9);
}
.nx-deal::before { content: ""; position: absolute; left: -1px; right: -1px; top: -1px; height: 3px; background: linear-gradient(90deg, var(--accent), var(--violet) 70%, transparent); }
.nx-deal__top { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 16px; }
.nx-deal__top .k { color: var(--tone-text); }
.nx-deal__top em { font: 700 10.5px/1 var(--font-label); font-style: normal; letter-spacing: .2em; text-transform: uppercase; color: var(--text-3); border: 1px solid var(--border-strong); padding: 5px 8px; }
.nx-deal__say {
  margin: 0 0 18px; font: 600 clamp(19px, 1.7vw, 24px)/1.32 var(--font-voice); letter-spacing: -.02em; color: var(--text);
}
.nx-deal__stage { display: flex; align-items: center; gap: 12px; margin-bottom: 4px; font: 700 10.5px/1.3 var(--font-label); letter-spacing: .16em; text-transform: uppercase; color: var(--text-3); }
.nx-deal__stage i { flex: none; width: 8px; height: 8px; background: var(--amber); transition: background .3s var(--ease-out); }
.nx-deal[data-state="filed"] .nx-deal__stage i { background: var(--green); }
.nx-deal[data-state="discarded"] .nx-deal__stage i { background: var(--text-4); }
.nx-deal__rows { list-style: none; margin: 0 0 4px; padding: 0; }
.nx-deal__rows li {
  display: grid; grid-template-columns: 20px 96px minmax(0, 1fr) auto; gap: 12px; align-items: center;
  padding: 11px 0; border-top: 1px solid var(--border); font-size: 15px; line-height: 1.3; color: var(--text-2);
  transition: opacity .4s var(--ease-out);
}
.nx-deal__rows li:first-child { margin-top: 10px; }
.nx-deal__rows span { font: 700 10.5px/1.2 var(--font-label); letter-spacing: .14em; text-transform: uppercase; color: var(--text-3); }
.nx-deal__rows b { color: var(--text); font-weight: 600; }
.nx-deal__rows em { font-style: normal; font-size: 13px; color: var(--text-3); text-align: right; }
.nx-box {
  position: relative; width: 16px; height: 16px; box-sizing: border-box; border: 2px solid var(--text-3);
  transition: background .3s var(--ease-out), border-color .3s var(--ease-out);
  transition-delay: calc(var(--n, 0) * 110ms);
}
.nx-box::after {
  content: "✓"; position: absolute; inset: 0; display: grid; place-items: center; font: 800 11px/1 var(--font-body);
  color: var(--accent-ink); opacity: 0; transition: opacity .2s var(--ease-out); transition-delay: calc(var(--n, 0) * 110ms + .1s);
}
.nx-deal[data-state="filed"] .nx-box { background: var(--green); border-color: var(--green); }
.nx-deal[data-state="filed"] .nx-box::after { opacity: 1; color: #06210f; }
.nx-deal[data-state="discarded"] .nx-deal__rows li { opacity: .35; }
.nx-deal[data-state="discarded"] .nx-deal__rows li b { text-decoration: line-through; }
.nx-deal__ask {
  display: flex; gap: 12px; align-items: flex-start; margin: 12px 0 18px; padding: 12px 14px;
  border: 1px solid color-mix(in srgb, var(--amber) 50%, transparent); background: color-mix(in srgb, var(--amber) 8%, transparent);
  font-size: 14.5px; line-height: 1.45; color: var(--text);
}
.nx-deal__ask i { flex: none; width: 20px; height: 20px; display: grid; place-items: center; background: var(--amber); color: #14100D; font: 800 12px/1 var(--font-body); font-style: normal; }
.nx-deal__acts { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.nx-deal__acts .btn { min-height: 46px; padding: 13px 24px; }
.nx-deal__foot { margin: 18px 0 0; padding-top: 14px; border-top: 1px solid var(--border); font-size: 13px; line-height: 1.5; color: var(--text-3); }
html:not(.js) .nx-deal__acts { display: none; }

/* the brain switch */
.nx-brain { border: 0; margin: 0; padding: clamp(24px, 3vw, 40px) 0 0; border-top: 2px solid var(--tone); min-width: 0; position: relative; }
.nx-brain > legend { float: left; width: 100%; padding: 0; margin: 0 0 20px; color: var(--tone-text); }
.nx-brain__lead { clear: both; }
.nx-brain__lead p {
  margin: 0 0 24px; max-width: 70ch; font-size: clamp(16px, 1.25vw, 18px); line-height: 1.65; color: var(--text-2);
  text-shadow: 0 0 10px rgba(var(--bg-rgb), .9), 0 0 24px rgba(var(--bg-rgb), .6);
}
.nx-brain__lead b { color: var(--text); font-weight: 600; } .nx-brain__lead em { font-style: normal; color: var(--text); }
.nx-brain__in { position: absolute; opacity: 0; pointer-events: none; width: 1px; height: 1px; }
.nx-brain__opts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border: 1px solid var(--border-strong); max-width: 780px; }
.nx-brain__opts label {
  display: block; padding: 16px 18px 15px; cursor: pointer; position: relative;
  background: rgba(var(--bg-rgb), .5);
  transition: background .25s var(--ease-out);
}
.nx-brain__opts label + label { border-left: 1px solid var(--border-strong); }
.nx-brain__opts label b { display: block; font: 700 15.5px/1.2 var(--font-body); color: var(--text-2); transition: color .25s var(--ease-out); }
.nx-brain__opts label small { display: block; margin-top: 5px; font-size: 13px; line-height: 1.35; color: var(--text-3); }
.nx-brain__opts label::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 3px; background: var(--tone); transform: scaleX(0); transform-origin: left; transition: transform .45s var(--ease); }
.nx-brain__opts label:hover b { color: var(--text); }
.nx-brain:has(#brain-local:checked) label[for="brain-local"],
.nx-brain:has(#brain-chatgpt:checked) label[for="brain-chatgpt"],
.nx-brain:has(#brain-key:checked) label[for="brain-key"] { background: rgba(var(--bg-rgb), .92); }
.nx-brain:has(#brain-local:checked) label[for="brain-local"] b,
.nx-brain:has(#brain-chatgpt:checked) label[for="brain-chatgpt"] b,
.nx-brain:has(#brain-key:checked) label[for="brain-key"] b { color: var(--text); }
.nx-brain:has(#brain-local:checked) label[for="brain-local"]::after,
.nx-brain:has(#brain-chatgpt:checked) label[for="brain-chatgpt"]::after,
.nx-brain:has(#brain-key:checked) label[for="brain-key"]::after { transform: none; }
.nx-brain:has(#brain-local:focus-visible) label[for="brain-local"],
.nx-brain:has(#brain-chatgpt:focus-visible) label[for="brain-chatgpt"],
.nx-brain:has(#brain-key:focus-visible) label[for="brain-key"] { outline: 2px solid var(--accent); outline-offset: 3px; }

.nx-brain__map {
  --w: clamp(56px, 10vw, 150px);
  --edge: 100%;
  position: relative; display: grid; align-items: center;
  grid-template-columns: minmax(0, 1fr) var(--w) minmax(0, 1fr) var(--w) minmax(0, 1fr);
  margin: 78px 16px 34px; max-width: 900px;
}
.nx-brain:has(#brain-chatgpt:checked) .nx-brain__map,
.nx-brain:has(#brain-key:checked) .nx-brain__map { --edge: calc(66.667% + var(--w) / 6); }
.nx-brain__box {
  position: absolute; left: -16px; top: -34px; bottom: -16px; width: calc(var(--edge) + 32px);
  border: 1.5px dashed var(--border-strong); background: rgba(var(--bg-rgb), .35);
  transition: width .8s var(--ease);
}
.nx-brain__box span { position: absolute; left: 12px; top: -8px; padding: 0 8px; background: var(--bg); font: 700 10.5px/1 var(--font-label); letter-spacing: .2em; text-transform: uppercase; color: var(--text-3); }
.nx-node { position: relative; z-index: 1; padding: 14px 16px 15px; background: var(--bg-2); border: 1px solid var(--border-strong); }
.nx-node small { display: block; margin-bottom: 6px; font: 700 10px/1 var(--font-label); letter-spacing: .16em; text-transform: uppercase; color: var(--text-3); }
.nx-node b { display: block; font: 800 clamp(17px, 1.7vw, 24px)/1.05 var(--font-voice); letter-spacing: -.03em; text-transform: none; color: var(--text); }
.nx-node--brain { border-color: var(--green); transition: border-color .4s var(--ease-out); }
.nx-node--brain b { display: none; }
.nx-brain:has(#brain-local:checked) .nx-node--brain .b-local,
.nx-brain:has(#brain-chatgpt:checked) .nx-node--brain .b-chatgpt,
.nx-brain:has(#brain-key:checked) .nx-node--brain .b-key { display: block; }
.nx-brain:has(#brain-chatgpt:checked) .nx-node--brain,
.nx-brain:has(#brain-key:checked) .nx-node--brain { border-color: var(--amber); }
.nx-wire { position: relative; z-index: 0; height: 2px; background: var(--border-strong); }
.nx-wire--out { background: linear-gradient(90deg, var(--green) 0 100%); transition: background .4s var(--ease-out); }
.nx-wire--out em {
  position: absolute; left: 50%; bottom: 12px; transform: translateX(-50%); white-space: nowrap; opacity: 0;
  font: 700 10px/1 var(--font-label); font-style: normal; letter-spacing: .14em; text-transform: uppercase; color: var(--amber);
  transition: opacity .4s var(--ease-out) .25s;
}
.nx-brain:has(#brain-chatgpt:checked) .nx-wire--out,
.nx-brain:has(#brain-key:checked) .nx-wire--out {
  background: repeating-linear-gradient(90deg, var(--amber) 0 7px, transparent 7px 12px);
}
.nx-brain:has(#brain-chatgpt:checked) .nx-wire--out em,
.nx-brain:has(#brain-key:checked) .nx-wire--out em { opacity: 1; }
.nx-brain__says { min-height: 4.4em; max-width: 64ch; }
.nx-brain__says p {
  margin: 0; display: none; font-size: clamp(16px, 1.25vw, 18px); line-height: 1.62; color: var(--text);
  text-shadow: 0 0 10px rgba(var(--bg-rgb), .9), 0 0 24px rgba(var(--bg-rgb), .6);
}
.nx-brain__says .s-local { display: block; }
.nx-brain:has(#brain-chatgpt:checked) .nx-brain__says p, .nx-brain:has(#brain-key:checked) .nx-brain__says p { display: none; }
.nx-brain:has(#brain-chatgpt:checked) .nx-brain__says .s-chatgpt { display: block; }
.nx-brain:has(#brain-key:checked) .nx-brain__says .s-key { display: block; }


/* ---------------------------------------------------------------------------
   5 · THE CREW LIST — the eleven lanes as a call sheet's crew
   --------------------------------------------------------------------------- */
.cam #lanes .shead h2 { max-width: 15ch; }
.nx-crew { border-top: 2px solid var(--tone); }
.nx-crew__head {
  display: flex; justify-content: space-between; gap: 20px; padding: 12px 0;
  border-bottom: 1px solid var(--border-strong);
  font: 700 10.5px/1 var(--font-label); letter-spacing: .2em; text-transform: uppercase; color: var(--text-3);
}
.nx-crew__rows { list-style: none; margin: 0; padding: 0; }
.nx-crew__rows li {
  position: relative; display: flex; align-items: center; gap: 18px; padding: clamp(11px, 1.15vw, 15px) 0;
  border-bottom: 1px solid var(--border);
}
.nx-crew__rows li::before { content: ""; position: absolute; left: 0; bottom: -1px; height: 1px; width: 100%; background: var(--tone); transform: scaleX(0); transform-origin: left; transition: transform .7s var(--ease); }
.nx-crew__rows li:hover::before { transform: none; }
.nx-crew__rows h3 {
  flex: none; margin: 0; font: 800 clamp(21px, 2.2vw, 31px)/1.05 var(--font-voice); letter-spacing: -.035em;
  text-transform: none; color: var(--text); transition: transform .5s var(--ease), color .3s var(--ease-out);
}
.nx-crew__rows li:hover h3 { transform: translateX(10px); color: var(--tone-text); }
.nx-crew__rows i { flex: 1; min-width: 24px; align-self: flex-end; margin-bottom: 1.05em; border-bottom: 2px dotted var(--border-strong); }
.nx-crew__rows p {
  flex: none; width: min(46ch, 40%); margin: 0; font-size: 15px; line-height: 1.45; color: var(--text-2);
  text-shadow: 0 0 10px rgba(var(--bg-rgb), .9), 0 0 24px rgba(var(--bg-rgb), .6);
}

/* ---------------------------------------------------------------------------
   6 · THE LEDGER — every connection, what leaves, and when
   --------------------------------------------------------------------------- */
.cam #privacy .shead h2 { max-width: 15ch; }
.nx-ledger__intro { display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: 14px 40px; margin-bottom: 20px; }
.nx-ledger__intro p { margin: 0; max-width: 54ch; font-size: clamp(16px, 1.3vw, 18.5px); line-height: 1.55; color: var(--text); text-shadow: 0 0 10px rgba(var(--bg-rgb), .9), 0 0 24px rgba(var(--bg-rgb), .6); }
.nx-ledger__key { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 22px; font: 700 10.5px/1 var(--font-label); letter-spacing: .14em; text-transform: uppercase; color: var(--text-3); }
.nx-ledger__key li { display: inline-flex; align-items: center; gap: 8px; }
.nx-ledger__key i, .nx-st i { display: inline-block; width: 9px; height: 9px; flex: none; }
.nx-ledger__key .none, .nx-st.none i { background: var(--green); }
.nx-ledger__key .ask, .nx-st.ask i { background: var(--amber); }
.nx-ledger__key .off, .nx-st.off i { background: transparent; border: 1.5px solid var(--text-3); }
.nx-ledger__head, .nx-ledger__rows li {
  display: grid; grid-template-columns: 148px minmax(150px, .7fr) minmax(0, 1.1fr) minmax(0, 1.5fr);
  gap: 0 clamp(18px, 2.4vw, 36px); align-items: start;
}
.nx-ledger__head { padding: 12px 0; border-top: 2px solid var(--tone); border-bottom: 1px solid var(--border-strong); font: 700 10.5px/1 var(--font-label); letter-spacing: .2em; text-transform: uppercase; color: var(--text-3); }
.nx-ledger__rows { list-style: none; margin: 0 0 30px; padding: 0; }
.nx-ledger__rows li { position: relative; padding: 22px 0; border-bottom: 1px solid var(--border); transition: background-color .3s var(--ease-out); }
.nx-ledger__rows li:hover { background: rgba(var(--bg-rgb), .4); }
.nx-ledger__rows h3 { margin: 0; font: 800 clamp(19px, 1.6vw, 23px)/1.15 var(--font-voice); letter-spacing: -.025em; text-transform: none; color: var(--text); }
.nx-ledger__rows p { margin: 0; font-size: 15.5px; line-height: 1.6; color: var(--text-2); }
.nx-ledger__rows .sends { color: var(--text); }
.nx-st { display: inline-flex; align-items: center; gap: 9px; padding-top: 4px; font: 700 11px/1.2 var(--font-label); letter-spacing: .12em; text-transform: uppercase; color: var(--text-2); }
.nx-ledger__rows p, .nx-ledger__rows h3 { text-shadow: 0 0 10px rgba(var(--bg-rgb), .9), 0 0 24px rgba(var(--bg-rgb), .6); }

.nx-site { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 4vw, 64px); align-items: start; margin-top: clamp(44px, 5.4vw, 80px); }
.nx-site__words h3 { margin: 0 0 12px; font: 800 clamp(24px, 2.4vw, 34px)/1.08 var(--font-voice); letter-spacing: -.035em; text-transform: none; color: var(--text); }
.nx-site__words p { margin: 0; max-width: 54ch; font-size: clamp(16px, 1.25vw, 18px); line-height: 1.62; color: var(--text-2); text-shadow: 0 0 10px rgba(var(--bg-rgb), .9), 0 0 24px rgba(var(--bg-rgb), .6); }
.nx-site__words code { font-family: var(--font-num); font-size: .86em; color: var(--text); font-variant-numeric: tabular-nums; }
.nx-site .policy { position: static; }

/* ---------------------------------------------------------------------------
   7 · THE MAKER — the letter on the right, the heading held on the left
   --------------------------------------------------------------------------- */
.nx-maker { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(28px, 5vw, 96px); align-items: start; }
.nx-maker .shead { position: sticky; top: 110px; margin-bottom: 0; }
.nx-maker .shead h2 { max-width: 11ch; font-size: clamp(38px, 5.2vw, 80px); }   /* "videographer." is one unbreakable word, about 5.8em wide, and the heading's reveal mask clips 0.2em past its box: the box has to be wider than the word, and the word has to fit the 5fr column */
.cam .nx-maker .maker { max-width: 66ch; }

/* ---------------------------------------------------------------------------
   8 · THE ASK — the stack as a receipt, the license as a card
   --------------------------------------------------------------------------- */
.cam #pricing > .wrap { display: block; }
.cam #pricing .math.nx-ask {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(28px, 4.4vw, 72px); align-items: start;
}
.cam #pricing .nx-ask .tier--hero { grid-column: 2; grid-row: 1; position: sticky; top: 100px; }
.cam #pricing .nx-ask .nx-receipt-wrap { grid-column: 1; grid-row: 1; }
.cam #pricing .tiers { margin-top: clamp(26px, 3vw, 40px); }
.cam #pricing .plansnote { font-size: 15px; color: var(--text-2); }
.cam #pricing .plansnote a { color: var(--text); font-weight: 600; text-underline-offset: 3px; }

.nx-receipt-wrap { filter: drop-shadow(0 34px 44px rgba(0, 0, 0, .55)); transform: rotate(-.7deg); transform-origin: 50% 0; }
.cam .nx-receipt {
  --zz: 14px; --r-ink: #14100D; --r-ink2: #4A4239; --r-ink3: #6B6154; --r-line: rgba(20, 16, 13, .3);
  position: relative; background: #FBF7F0; color: var(--r-ink); border: 0; font-family: var(--font-num);
  padding: 40px clamp(22px, 2.8vw, 38px) 50px;
  -webkit-mask:
    conic-gradient(from 135deg at top, #0000, #000 1deg 89deg, #0000 90deg) top / var(--zz) 51% repeat-x,
    conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) bottom / var(--zz) 51% repeat-x;
          mask:
    conic-gradient(from 135deg at top, #0000, #000 1deg 89deg, #0000 90deg) top / var(--zz) 51% repeat-x,
    conic-gradient(from -45deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) bottom / var(--zz) 51% repeat-x; font-variant-numeric: tabular-nums; }
.nx-receipt__top { display: flex; justify-content: space-between; align-items: baseline; gap: 14px; flex-wrap: wrap; padding-bottom: 16px; border-bottom: 2px dashed var(--r-line); }
.nx-receipt__top b { font: 400 24px/1 var(--font-nav); letter-spacing: 0; color: var(--r-ink); }
.nx-receipt__top span { font: 500 11px/1.3 var(--font-num); letter-spacing: .08em; text-transform: uppercase; color: var(--r-ink3); font-variant-numeric: tabular-nums; }
.cam .nx-receipt .stack-cap { margin: 14px 0 2px; font: 700 10.5px/1.4 var(--font-label); letter-spacing: .14em; text-transform: uppercase; color: var(--r-ink3); border: 0; padding: 0; }
.cam .nx-receipt .srow {
  display: flex; justify-content: space-between; align-items: baseline; gap: 16px;
  padding: 15px 0; border: 0; border-bottom: 1px dashed var(--r-line); color: var(--r-ink);
}
.cam .nx-receipt .srow > span { font: 700 clamp(16px, 1.4vw, 18px)/1.2 var(--font-num); letter-spacing: 0; color: var(--r-ink); font-variant-numeric: tabular-nums; }
.cam .nx-receipt .srow small { display: block; margin-top: 4px; font: 400 11.5px/1.4 var(--font-num); letter-spacing: 0; text-transform: none; color: var(--r-ink3); font-variant-numeric: tabular-nums; }
.cam .nx-receipt .srow > i { font: 700 clamp(15px, 1.3vw, 17px)/1.2 var(--font-num); font-style: normal; white-space: nowrap; color: var(--r-ink); font-variant-numeric: tabular-nums; }
.cam .nx-receipt .srow::after, .cam .nx-receipt .stotal::after { left: -8px; right: -8px; top: 50%; height: 3px; margin-top: -1px; background: var(--accent); }
.cam .nx-receipt .stotal::after { top: 55%; }
.cam .nx-receipt .stotal {
  display: flex; justify-content: space-between; align-items: baseline; gap: 16px;
  padding: 22px 0 6px; margin: 0; border: 0; color: var(--r-ink);
}
.cam .nx-receipt .stotal > span { font: 700 12px/1.2 var(--font-num); letter-spacing: .14em; text-transform: uppercase; color: var(--r-ink); font-variant-numeric: tabular-nums; }
.cam .nx-receipt .stotal > i { font: 400 clamp(34px, 3.6vw, 48px)/1 var(--font-brand); font-style: normal; letter-spacing: -.02em; color: var(--r-ink); white-space: nowrap; }
.nx-receipt__code {
  display: block; height: 46px; margin: 24px 0 0;
  background:
    repeating-linear-gradient(90deg, #14100D 0 2px, transparent 2px 5px, #14100D 5px 6px, transparent 6px 9px, #14100D 9px 12px, transparent 12px 14px),
    repeating-linear-gradient(90deg, #14100D 0 1px, transparent 1px 3px);
  background-blend-mode: normal;
  -webkit-mask: repeating-linear-gradient(90deg, #000 0 11px, transparent 11px 13px, #000 13px 22px, transparent 22px 24px, #000 24px 27px, transparent 27px 30px);
          mask: repeating-linear-gradient(90deg, #000 0 11px, transparent 11px 13px, #000 13px 22px, transparent 22px 24px, #000 24px 27px, transparent 27px 30px);
  opacity: .82;
}
.cam .nx-receipt .mathnote { margin: 16px 0 0; font: 400 11px/1.55 var(--font-num); letter-spacing: 0; color: var(--r-ink3); text-shadow: none; font-variant-numeric: tabular-nums; }

.nx-license {
  --tone: #9959E2;
  position: relative; overflow: hidden; padding: clamp(24px, 2.6vw, 38px);
  background: linear-gradient(180deg, rgba(var(--bg-rgb), .94), rgba(var(--bg-rgb), .98)); border: 1px solid var(--border-strong);
  box-shadow: 0 50px 120px -50px rgba(0, 0, 0, .9);
}
.nx-license::before {
  content: ""; position: absolute; inset: 0 0 auto 0; height: 3px; z-index: 1;
  background: linear-gradient(90deg, var(--accent), var(--violet) 70%, transparent);
}
.nx-license::after {
  content: ""; position: absolute; right: -60px; top: -60px; width: 300px; height: 300px; pointer-events: none;
  background: url("assets/logo.svg") center / contain no-repeat; opacity: .07; filter: saturate(.8);
}
.nx-license > * { position: relative; z-index: 1; }
.nx-license .tier__amount { margin-top: 10px; }
.nx-license .tier__amount em { font-style: normal; margin-left: .12em; }   /* the suffix is set like the numeral (Flor's approved look, restored 2026-09-29): "$299 once" reads as one phrase */
.nx-license .tier__save { margin: 12px 0 2px; font-size: 16px; color: var(--text-2); font-weight: 500; }
.nx-license .tier__once { font-size: 16px; line-height: 1.5; color: var(--text); font-weight: 600; margin-bottom: 4px; }
.nx-license ul { margin: 20px 0 24px; padding: 20px 0 0; border-top: 1px solid var(--border); gap: 12px; }
.nx-license li { font-size: 15.5px; line-height: 1.5; }
.nx-license .stack-save { margin: 0 0 22px; padding: 12px 14px; font-size: 15px; color: var(--text-2); border: 1px solid var(--border); background: rgba(var(--accent-rgb), .06); }
.nx-license .stack-save b { color: var(--accent-soft); font-size: 1.35em; font-weight: 800; }
.nx-license .btn { margin-top: 0; width: 100%; }
.nx-license .fineprint { margin-top: 14px; color: var(--text-3); font-size: 12.5px; }
.nx-after { list-style: none; counter-reset: a; margin: 22px 0 0; padding: 16px 0 0; border-top: 1px solid var(--border); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.nx-after li { counter-increment: a; font: 600 13px/1.35 var(--font-body); color: var(--text-2); padding: 0; }
.nx-after li::before { content: counter(a); position: static; display: block; margin-bottom: 8px; font: 400 22px/1 var(--font-brand); color: var(--tone-text); }

/* ---------------------------------------------------------------------------
   9 · THE ANSWERS
   --------------------------------------------------------------------------- */
.nx-faq { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(28px, 5vw, 96px); align-items: start; }
.nx-faq .shead { position: sticky; top: 110px; margin-bottom: 0; }
.nx-faq .shead h2 { max-width: 8ch; }
.nx-faq .shead p a { color: var(--accent-soft); text-underline-offset: 3px; }
.nx-faq__list { border-top: 2px solid var(--tone); }
.nx-faq__list details { border-bottom: 1px solid var(--border); }
.nx-faq__list summary {
  position: relative; list-style: none; cursor: pointer;
  padding: clamp(18px, 2vw, 26px) 52px clamp(18px, 2vw, 26px) 0;
  font: 800 clamp(19px, 1.7vw, 25px)/1.2 var(--font-voice); letter-spacing: -.028em; text-transform: none; color: var(--text);
  transition: color .25s var(--ease-out);
}
.nx-faq__list summary::-webkit-details-marker { display: none; }
.nx-faq__list summary::before, .nx-faq__list summary::after {
  content: ""; position: absolute; right: 4px; top: 50%; width: 18px; height: 2px; margin-top: -1px; background: var(--tone-text);
  transition: transform .4s var(--ease);
}
.nx-faq__list summary::after { transform: rotate(90deg); }
.nx-faq__list details[open] summary::after { transform: rotate(0); }
.nx-faq__list summary:hover { color: var(--tone-text); }
.nx-faq__list summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.nx-faq__list .a { padding: 0 52px clamp(20px, 2.2vw, 28px) 0; }
.nx-faq__list .a p { margin: 0 0 12px; font-size: clamp(15.5px, 1.2vw, 17px); line-height: 1.65; color: var(--text-2); max-width: 64ch; text-shadow: 0 0 10px rgba(var(--bg-rgb), .9), 0 0 24px rgba(var(--bg-rgb), .6); }
.nx-faq__list .a b { color: var(--text); font-weight: 600; }
.nx-faq__list .a a { color: var(--accent-soft); text-underline-offset: 3px; }
@keyframes nx-open { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
.nx-faq__list details[open] .a { animation: nx-open .45s var(--ease-out); }

/* ---------------------------------------------------------------------------
   10 · THE CLOSE AND THE FOOT
   --------------------------------------------------------------------------- */
.cam .finalcta .closing p:not(.closing__get) { font-family: var(--font-voice); font-weight: 700; font-size: clamp(20px, 2vw, 30px); letter-spacing: -.03em; color: var(--text); }
.cam .foot { position: relative; overflow: hidden; padding-bottom: 0; }
.foot__mega {
  margin: clamp(10px, 2vw, 30px) 0 -.14em; text-align: center; white-space: nowrap; user-select: none; pointer-events: none;
  font: 400 clamp(90px, 21.5vw, 340px)/.8 var(--font-nav); letter-spacing: -.03em;
  color: transparent; -webkit-text-stroke: 1.5px var(--border-strong);
  background: linear-gradient(180deg, rgba(var(--accent-rgb), .22), transparent 70%); -webkit-background-clip: text; background-clip: text;
}
.foot__mega em { font-style: normal; }
.cam .foot .foot__bar { margin-bottom: 0; padding-bottom: 22px; }

/* ---------------------------------------------------------------------------
   11 · NARROW SCREENS
   --------------------------------------------------------------------------- */
@media (max-width: 1199px) {
  .mv__body { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(10px, 1.1vw, 16px); }
  .mv__wall { display: contents; }
  .mv__cell { order: calc(var(--i) * 2); }
  .mv__info { grid-column: 1 / -1; position: relative; top: 0; order: 1; padding-top: clamp(18px, 2.2vw, 26px); grid-template-columns: minmax(0, .8fr) minmax(0, 1.5fr) minmax(0, 1fr); align-items: start; gap: 12px clamp(20px, 3vw, 44px); }
  .mv__info > :not(.mv__prog) { margin-inline: clamp(18px, 2vw, 26px) 0; }
  .mv__info .mv__prog { display: none; }
  .mv__info .mv__pill { grid-column: 1 / -1; }
  .mv__info .mv__name { font-size: clamp(26px, 3.2vw, 38px); }
}
@media (max-width: 1100px) {
  .nx-aide { grid-template-columns: 1fr; }
  .nx-deal { position: relative; top: 0; }
  .nx-ledger__head { display: none; }
  .nx-ledger__rows li { grid-template-columns: 1fr; gap: 8px; padding: 20px 0; }
  .nx-ledger__rows .when::before, .nx-ledger__rows .sends::before {
    display: block; margin-bottom: 4px; font: 700 10px/1 var(--font-label); letter-spacing: .18em; text-transform: uppercase; color: var(--text-3);
  }
  .nx-ledger__rows .when::before { content: "When it runs"; }
  .nx-ledger__rows .sends::before { content: "What leaves your computer"; }
  .nx-site { grid-template-columns: 1fr; }
  .nx-maker, .nx-faq { grid-template-columns: 1fr; }
  .nx-maker .shead, .nx-faq .shead { position: static; margin-bottom: 30px; }
  .cam #pricing .math.nx-ask { grid-template-columns: 1fr; }
  .cam #pricing .nx-ask .tier--hero { grid-column: 1; grid-row: 2; position: relative; top: 0; }
  .cam #pricing .nx-ask .nx-receipt-wrap { max-width: 560px; }
}
@media (max-width: 900px) {
  .nx-crew__rows li { flex-wrap: wrap; gap: 8px 14px; }
  .nx-crew__rows i { display: none; }
  .nx-crew__rows p { width: 100%; }
  .nx-crew__head span:last-child { display: none; }
}
@media (max-width: 800px) {
  .mv__body { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mv__info { grid-template-columns: minmax(0, 1fr); }
  .mv__info > :not(.mv__prog) { margin-inline: clamp(16px, 4vw, 22px); }
}
@media (max-width: 700px) {
  .mv__cap { font-size: 10px; letter-spacing: .12em; }
  .nx-brain__opts { grid-template-columns: 1fr; }
  .nx-brain__opts label + label { border-left: 0; border-top: 1px solid var(--border-strong); }
  .nx-brain__map { margin-inline: 12px; grid-template-columns: minmax(0, 1fr) 38px minmax(0, 1fr) 38px minmax(0, 1fr); --w: 38px; }
  .nx-node { padding: 10px 9px 11px; } .nx-node small { font-size: 8.5px; letter-spacing: .1em; }
  .nx-node b { font-size: 15px; }
  .nx-wire--out em { display: none; }
  .nx-deal__rows li { grid-template-columns: 20px minmax(0, 1fr) auto; } .nx-deal__rows span { display: none; }
  .nx-after { grid-template-columns: 1fr; }
  .nx-receipt-wrap { transform: none; }
}

/* ---------------------------------------------------------------------------
   12 · THE MOTION KILL SWITCH
   --------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .js .mv:not(.is-on) .mv__screen > .sc { opacity: 1; }
  .js .mv.is-on .mv__screen > .sc, .mv__info.is-cut .mv__name, .mv__info.is-cut .mv__text, .mv__info.is-cut .mv__lawbox,
  .nx-faq__list details[open] .a { animation: none !important; }
  .nx-box, .nx-box::after, .nx-brain__box, .nx-crew__rows h3 { transition: none !important; }
  .nx-receipt-wrap { transform: none; }
}

/* the burn-down used to scale the saving box 4% when the last line was struck; inside the card
   that pushed it past the padding, so it answers with its border instead */
.cam .math.is-burnt .nx-license .stack-save { transform: none; border-color: color-mix(in srgb, var(--accent) 55%, var(--border)); }
.nx-license .stack-save { transition: border-color .8s var(--ease-out); }

/* the pinned stage leaves a long empty run under it; take some of it back */
.cam #tonight { padding-bottom: clamp(8px, 2vw, 28px); }
.cam #what { padding-top: clamp(28px, 4vw, 56px); }
@media (min-width: 1000px) and (min-height: 700px) and (prefers-reduced-motion: no-preference) {
  .cam .shift.is-pinned .shift__stage { padding-block: 40px 30px; }
}

/* JS off: the wall takes the whole width, since there is no panel beside it */
html:not(.js) .mv__body { grid-template-columns: minmax(0, 1fr); }
html:not(.js) .mv__wall { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1100px) { html:not(.js) .mv__wall { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 700px) { html:not(.js) .mv__wall { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ---------------------------------------------------------------------------
   13 · THE TIGHTENING PASS (2026-09-29) — less air between bands, and the spots that felt loose
   Kept last so each rule reads as an override of the band above it.
   --------------------------------------------------------------------------- */
.cam .act { padding-block: clamp(44px, 6.4vh, 72px); }
.cam .act--tight { padding-block: clamp(44px, 5vw, 72px); }
.cam .shead { margin-bottom: clamp(28px, 3.2vw, 44px); }
.cam #pricing .shead { margin-bottom: clamp(28px, 3.2vw, 44px); }

/* 21:50: the stage is a full screen tall with the table centred in it, which left ~200px of void
   above the table and ~150px below. Pull the stage over both edges (it is transparent), shorten the
   runway, and let the empty part of it ignore the pointer. */
@media (min-width: 1000px) and (min-height: 700px) and (prefers-reduced-motion: no-preference) {
  .cam .shift.is-pinned { height: 156vh; margin-block: calc(-1 * clamp(70px, 12vh, 120px)); }
  .cam .shift.is-pinned .shift__stage { pointer-events: none; }
}

/* the twelve rooms: the note under the wall and the closing line read as one footer */
.cam #what .what__foot { margin-top: clamp(20px, 2.4vw, 32px); }
.mv__cap-note { margin-top: 10px; }

/* the sidekick's brain switch */
.nx-brain__map { margin-top: 64px; margin-bottom: 40px; }
.nx-brain__says { min-height: 0; }
.nx-brain__lead p { margin-bottom: 0; }
.nx-brain__opts { margin-top: 12px; }

/* 21:50 ran to 1120px while every other band runs to the container's edge */
.cam .shift__table { max-width: none; }

/* the crew list: tighter rows, the right-hand header sits over the descriptions */
.nx-crew__rows li { padding-block: clamp(9px, .9vw, 12px); }
@media (min-width: 901px) {
  .nx-crew__head { padding-right: 0; }
  .nx-crew__head span:last-child { width: min(46ch, 40%); }
}

/* the ledger */
.nx-ledger__intro { margin-bottom: 26px; }
.nx-ledger__rows { margin-bottom: 8px; }
.nx-ledger__rows li { padding-block: 16px; }
.nx-ledger .morelink { margin-top: 18px; }
.nx-site { margin-top: clamp(36px, 4.4vw, 64px); }

/* the price card: the saving box lost its top border and top padding to styles.css's
   `.math .tier .stack-save` (0,3,0), so its text sat on the top edge and looked cut off.
   Restated at the same weight. */
.math .tier.nx-license .stack-save { margin: 0 0 22px; padding: 14px 16px; border: 1px solid var(--border); }
/* the price card: air above the saving box, so the last bullet does not sit on it */
.math .tier.nx-license ul { margin-bottom: 26px; }

/* the close: three lines of headline and one row of links, not a screen of padding */
.cam .finalcta { min-height: min(100svh, 640px); }
.cam .closing h2 em { display: block; text-wrap: balance; }
.cam .closing .closing__get { max-width: none; }

@media (max-width: 760px) {
  .cam .finalcta { min-height: 0; align-items: center; padding-bottom: 64px; }
  .cam .closing .closing__get { display: flex; flex-wrap: wrap; gap: 6px 16px; }
  .cam .closing .closing__get > span[aria-hidden] { display: none; }
  .nx-deal__top { flex-wrap: wrap; gap: 8px 12px; }
  .cam .shift__heads { margin-top: 24px; }
  .nx-ledger__intro { gap: 12px; }
  .nx-ledger__key { gap: 6px 18px; }
  .nx-ledger__rows li { padding-block: 14px; gap: 6px; }
  .cam #pricing .nx-ask { gap: 28px; }
  .nx-after { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  /* the foot: the brand and the © line take the full width, the link columns share the rest */
  .cam .foot .wrap > div:first-child, .cam .foot .wrap > .foot__bar { grid-column: 1 / -1; }
  .cam .foot .foot__note { max-width: none; }
}

/* ---------------------------------------------------------------------------
   14 · THE WORDMARK THREAD (2026-09-29)
   The foot's big outlined "flor.cam" bleeds off the bottom edge on purpose. A faint copy of it
   now rides the bottom of the window all the way down the page, sunk so only the tops of the
   letters show. When the foot's own word rises to the same spot the two are one word (same
   font, same size, same crop), the ghost steps out, and the real one keeps rising into full
   view, its outline and crimson fill coming up with it (--wm runs 0 to 1). next.js does the
   hand-off; with it blocked the foot's word is simply there, as before.
   ⚠ `body > *:not(#plate)` is (1,0,1) and would turn this fixed layer into a relative one,
   so the ghost's selector is (1,1,1). z-index 0 puts it over the scene and under the content.
   --------------------------------------------------------------------------- */
body > #wm.nx-ghost {
  position: fixed; left: 0; right: 0; top: auto; bottom: -.14em; z-index: 0; margin: 0;
  pointer-events: none; user-select: none;
  font: 400 clamp(90px, 21.5vw, 340px)/.8 var(--font-nav); letter-spacing: -.03em;
  white-space: nowrap; text-align: center;
  color: transparent; -webkit-text-stroke: 2px color-mix(in srgb, var(--text) 30%, transparent);
  background-image: linear-gradient(180deg, rgba(var(--accent-rgb), .10), rgba(var(--accent-rgb), .02) 75%, transparent);
  -webkit-background-clip: text; background-clip: text;
  transform: translateY(22%); opacity: 0;
}
.nx-ghost em { font-style: normal; }
html:not(.js) .nx-ghost { display: none; }
.foot__mega {
  /* at --wm 0 the foot's word must look like the ghost did a moment ago, seen through the foot's
     60% veil (40% of the ghost's 30% stroke and .10 fill); it comes up to full as the word rises */
  -webkit-text-stroke-color: color-mix(in srgb, var(--border-strong) calc(46% + var(--wm, 1) * 54%), transparent);
  background-image: linear-gradient(180deg, rgba(var(--accent-rgb), calc(.04 + var(--wm, 1) * .18)), transparent 70%);
}
.foot__mega.is-held { opacity: 0; }

/* ---------------------------------------------------------------------------
   15 · THE SHORTER PAGE (2026-09-29, Flor: "get the point across without the user having to scroll
   an infinite bunch"). The standing ceiling is 13,500px at rest; each cut below keeps the fact and
   drops the repeat, or moves the detail one link away to where it already lives.
   --------------------------------------------------------------------------- */

/* the trades: the eleven names, in a grid. What the desk does for each is on product.html#for */
.nx-crew__rows { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: clamp(20px, 3vw, 44px); }
.nx-crew__rows li { display: block; padding: clamp(14px, 1.4vw, 20px) 0; }
.nx-crew__rows h3 { font-size: clamp(18px, 1.55vw, 23px); line-height: 1.15; }
.nx-crew__rows li:hover h3 { transform: translateX(6px); }
.nx-crew .morelink { margin-top: clamp(20px, 2.4vw, 32px); }
@media (max-width: 1000px) { .nx-crew__rows { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .nx-crew__rows { grid-template-columns: minmax(0, 1fr); } }

/* the brain switch: the tabs and their words on the left, the diagram beside them.
   ⚠ the legend above is a full-width float, so the wrapper has to clear it or it shrinks to nothing beside it */
.nx-brain__grid { clear: both; }
@media (min-width: 1101px) {
  .nx-brain__grid { clear: both; display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); column-gap: clamp(32px, 4vw, 64px); align-items: center; }
  .nx-brain__lead { grid-column: 1; grid-row: 1; }
  .nx-brain__opts { grid-column: 1; grid-row: 2; }
  .nx-brain__says { grid-column: 1; grid-row: 3; margin-top: 22px; }
  .nx-brain__map { grid-column: 2; grid-row: 1 / span 3; --w: clamp(36px, 4.4vw, 68px); margin: 52px 16px 20px; max-width: none; }
}

/* 21:50: a shorter runway, and the stage pulls further over the empty space around the table */
@media (min-width: 1000px) and (min-height: 700px) and (prefers-reduced-motion: no-preference) {
  .cam .shift.is-pinned { height: 138vh; margin-block: calc(-1 * clamp(90px, 16vh, 150px)); }
}

/* the ledger and the close */
.nx-ledger__rows li { padding-block: 12px; }
.nx-site { margin-top: clamp(28px, 3vw, 44px); }
.cam .finalcta { min-height: 0; padding-block: clamp(48px, 7vh, 72px) clamp(40px, 5vh, 56px); }
.cam .closing h2 { font-size: clamp(44px, 7.2vw, 120px); }
@media (max-width: 760px) { .cam .finalcta { padding-block: 64px; } }

/* every band's air, one notch tighter again (58px to about 43px at a 900px window), and the head-to-content gap with it */
.cam .act { padding-block: clamp(36px, 4.8vh, 56px); }
.cam .act--tight { padding-block: clamp(36px, 4vw, 56px); }
.cam .shead { margin-bottom: clamp(24px, 2.8vw, 40px); }
.cam #pricing .shead { margin-bottom: clamp(24px, 2.8vw, 40px); }
.cam #finalcta { padding-top: clamp(40px, 6vh, 60px); }   /* #finalcta carries its own 8.5vw of top padding in styles.css */
.nx-cap { padding-block: clamp(18px, 1.8vw, 26px); }
.cam .foot { padding-top: 40px; }

/* ---------------------------------------------------------------------------
   16 · THE PHONE, SHORTER (2026-09-29, Flor: "everything looks good for the desktop, now lets do the phone").
   Same rule as the desktop: keep the fact, drop the repeat, and stop stacking what fits side by side.
   --------------------------------------------------------------------------- */
@media (max-width: 700px) {
  /* the rooms wall: three monitors across, not two (a pressed room's panel still opens full width under its row) */
  .mv__body { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .mv__cap { font-size: 9px; letter-spacing: .06em; gap: 5px; }

  /* the demo's three home stats sit side by side, as they do at a desk */
  .demo-kpis.demo-lead3 { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 0; }
  .demo-kpis.demo-lead3 > .demo-kpi { padding-left: 10px; border-left: 1px solid var(--hairline); }
  .demo-kpis.demo-lead3 > .demo-kpi:first-child { padding-left: 0; border-left: 0; }
  .demo-kpis.demo-lead3 .demo-kpi label { letter-spacing: .06em; }

  /* 21:50: tighter pairs */
  .cam .shift__row { padding-block: 12px; }

  /* the trades: two names across */
  .nx-crew__rows { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  /* the brain switch: the three tiers in one row; their words are in the line under them */
  .nx-brain__opts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .nx-brain__opts label { padding: 12px 10px; }
  .nx-brain__opts label + label { border-top: 0; border-left: 1px solid var(--border-strong); }
  .nx-brain__opts label b { font-size: 13px; }
  .nx-brain__opts label small { display: none; }

  /* the ledger: the two labels run in line with their sentences instead of standing on their own rows */
  .nx-ledger__rows li { gap: 4px; padding-block: 10px; }
  .nx-ledger__rows .when::before, .nx-ledger__rows .sends::before {
    display: inline; margin: 0 6px 0 0; font-size: 10px; letter-spacing: .12em; color: var(--tone-text);
  }
  .nx-ledger__rows .when::before { content: "When it runs:"; }
  .nx-ledger__rows .sends::before { content: "What leaves:"; }
  .nx-ledger__rows p { font-size: 14.5px; line-height: 1.5; }
  .nx-ledger__rows .when { color: var(--text-3); }

  /* the receipt loses its barcode; the card and the lines stay */
  .nx-receipt__code { display: none; }

  /* the maker and the answers: the heading sits closer to what it heads */
  .nx-maker { gap: 0; }
  .nx-maker .shead, .nx-faq .shead { margin-bottom: 18px; }
  .nx-faq { gap: 0; }
}
@media (max-width: 700px) {
  /* the ledger: each connection's status chip shares a line with its name */
  .nx-ledger__rows li { grid-template-columns: minmax(0, 1fr) auto; column-gap: 12px; }
  .nx-ledger__rows li > h3 { grid-column: 1; grid-row: 1; }
  .nx-ledger__rows li > .nx-st { grid-column: 2; grid-row: 1; align-self: center; padding-top: 0; }
  .nx-ledger__rows li > .when, .nx-ledger__rows li > .sends { grid-column: 1 / -1; }
}
@media (max-width: 700px) {
  /* every band, a little less air on a small screen */
  .cam .act { padding-block: 34px; }
  .cam .act--tight { padding-block: 34px; }
  .cam .shead { margin-bottom: 20px; }
  .cam #pricing .shead { margin-bottom: 20px; }
  .cam #what { padding-top: 24px; }

  /* the foot: the three link columns side by side */
  .cam .foot .wrap { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px 14px; }
  .cam .foot .wrap > div:first-child, .cam .foot .wrap > .foot__bar { grid-column: 1 / -1; }
  .cam .foot a { font-size: 13px; }
  .cam .foot ul { gap: 7px; }

  /* the answers: a little less between rows */
  .nx-faq__list summary { padding-block: 13px; }
}