/* Signed-out landing — screens 4A and 7A of design_handoff_homepage.
 *
 * Tokens are the handoff's, verbatim, and are the SAME set overview.css already
 * carries (the two handoffs were drawn against one palette). They are declared on
 * .lz rather than :root for the same reason: this page owns its look without
 * reaching into an app that runs on a different (oklch) scale.
 *
 * Light only, deliberately. This is the page a visitor sees before they have an
 * account, so there is no stored theme preference to honour and no toggle to
 * respect — the dark-mode re-point that overview.css needs has nothing to attach to
 * here. A visitor with a dark OS still gets the page as drawn, which is what every
 * other marketing front door does.
 */

.lz{
  --bg:#faf8f4; --card:#fff;
  --ink:#1b1a17; --ink-2:#33302a; --body:#4a453e; --body-2:#4d4a44;
  --muted:#6f6a62; --muted-2:#7c766d; --faint:#928c82; --faint-2:#a8a29a;
  --line:#e7e2d8; --line-2:#e2ddd2; --line-3:#ddd7cb;
  --hair:#efece4; --hair-2:#f2efe8; --hair-3:#f4f1ea;
  --tok:#f1eee6; --dotted:#cfc8ba;
  --green:#146b52; --green-dark:#0e4d3a; --green-1:#9dc9b8; --green-2:#c3ded3;
  --green-3:#f2f8f5; --red:#b02a20;
  --serif:Spectral,Georgia,serif;
  --mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  --ui:'Helvetica Neue',Helvetica,Arial,system-ui,sans-serif;
  font-family:var(--ui); color:var(--ink); background:var(--bg);
  -webkit-font-smoothing:antialiased;
}
html,body{margin:0;padding:0;background:#faf8f4}
.lz *{box-sizing:border-box}
.lz a{color:var(--green);text-decoration:none}
.lz a:hover{color:var(--green-dark)}
.lz button{font-family:inherit;cursor:pointer}
.lz .lz-k{font-family:var(--mono);font-size:10px;letter-spacing:.12em;color:var(--faint)}
.lz .up{color:var(--green)} .lz .dn{color:var(--red)} .lz .nu{color:var(--muted)}

/* ── header ─────────────────────────────────────────────────────────────────── */
.lz-top{display:flex;align-items:center;gap:22px;padding:14px 34px;
  border-bottom:1px solid var(--line);max-width:1180px;margin:0 auto}
.lz-mark{font-weight:700;font-size:17px;letter-spacing:-.2px;color:var(--ink)!important}
.lz-navs{margin-left:auto;display:flex;align-items:center;gap:20px;font-size:13.5px}
.lz-nav{color:var(--body-2)!important}
.lz-nav:hover{color:var(--ink)!important}
.lz-btn{border-radius:7px;padding:8px 14px;font-size:13.5px;white-space:nowrap}
.lz-btn.ghost{border:1px solid var(--line-3);color:var(--body-2)!important}
.lz-btn.ghost:hover{border-color:var(--ink);color:var(--ink)!important}
.lz-btn.solid{background:var(--ink);color:var(--bg)!important}
.lz-btn.solid:hover{background:#000}

/* ── page ───────────────────────────────────────────────────────────────────── */
.lz-page{max-width:1180px;margin:0 auto;padding:0 34px 32px}
.lz-hero{padding:32px 0 0}
.lz-h1{font-family:var(--serif);font-size:38px;font-weight:600;line-height:1.12;
  letter-spacing:-.3px;max-width:760px;margin:0;text-wrap:pretty}
.lz-grid{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:24px;
  align-items:start;padding-top:22px}
/* The two columns are meant to finish level. The rail sticks rather than the table
   being padded to match it: row count varies with the chip and with how many
   companies were entered, so any padding that balanced one state would break the
   other. */
.lz-rail{display:flex;flex-direction:column;gap:14px;position:sticky;top:18px}

/* ── holdings box ───────────────────────────────────────────────────────────── */
.lz-box{background:var(--card);border:2px solid var(--ink);border-radius:14px;
  padding:22px 24px;position:relative}
.lz-boxt{font-family:var(--serif);font-size:22px;font-weight:600}
.lz-inrow{display:flex;gap:8px;margin-top:12px}
.lz-field{flex:1 1 auto;background:var(--card);border:1px solid var(--line-3);
  border-radius:9px;padding:8px 10px;display:flex;align-items:center;gap:7px;
  flex-wrap:wrap;min-height:46px;cursor:text}
.lz-field:focus-within{border-color:var(--ink)}
.lz-tok{background:var(--tok);border-radius:5px;padding:6px 8px 6px 10px;font-size:13.5px;
  display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.lz-x{background:none;border:none;color:var(--faint);font-size:14px;line-height:1;
  padding:0 2px}
.lz-x:hover{color:var(--ink)}
.lz-in{flex:1 1 120px;min-width:120px;border:none;outline:none;font-size:14px;
  font-family:inherit;color:var(--ink);background:transparent;padding:4px 0}
.lz-in::placeholder{color:var(--faint-2)}
.lz-go{background:var(--ink);color:var(--bg);border:none;border-radius:9px;
  padding:0 28px;font-size:15px;font-weight:600;flex:none}
.lz-go:hover{background:#000}
.lz-boxf{display:flex;align-items:center;gap:16px;margin-top:12px;font-size:13px;
  flex-wrap:wrap}
.lz-pipe{color:var(--line-3)}
.lz-nonote{margin-left:auto;color:var(--muted-2)}
/* The CSV upload. A button, because it opens a file picker rather than navigating —
   styled as the link it replaced so the two doors in this row read as a pair. */
.lz-up{background:none;border:none;padding:0;font:inherit;color:var(--green);
  cursor:pointer;text-decoration:none}
.lz-up:hover{color:var(--green-dark);text-decoration:underline}
.lz-upmsg{flex-basis:100%;margin-top:2px;font-size:12.5px;color:var(--muted)}
.lz-upmsg.err{color:var(--red)}
.lz-upmsg.ok{color:var(--green-dark)}

/* typeahead */
.lz-sug{position:absolute;left:24px;right:24px;top:calc(100% - 46px);z-index:40;
  background:var(--card);border:1px solid var(--line-3);border-radius:10px;
  box-shadow:0 16px 40px rgba(27,26,23,.16);overflow:hidden;max-height:280px;
  overflow-y:auto}
.lz-sg{display:flex;align-items:baseline;gap:9px;padding:10px 13px;cursor:pointer;
  border-bottom:1px solid var(--hair-3)}
.lz-sg:last-child{border-bottom:none}
.lz-sg:hover,.lz-sg.on{background:var(--bg)}
.lz-sg b{font-size:13.5px;font-weight:600}
.lz-sg i{font-family:var(--mono);font-size:10.5px;color:var(--faint);font-style:normal;
  margin-left:auto}

/* ── chips ──────────────────────────────────────────────────────────────────── */
.lz-chips{display:flex;gap:7px;align-items:center;flex-wrap:wrap;margin-top:18px}
.lz-chip{border:1px solid var(--line-3);background:transparent;color:var(--body-2);
  border-radius:16px;padding:6px 12px;font-size:12px}
.lz-chip:hover{border-color:var(--ink);color:var(--ink)}
.lz-chip.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}

/* ── table card ─────────────────────────────────────────────────────────────── */
.lz-card{margin-top:14px}
.lz-tbl{background:var(--card);border:1px solid var(--line);border-radius:12px;
  overflow:clip}
.lz-head,.lz-row{display:grid;grid-template-columns:150px minmax(0,1fr) 92px;gap:14px;
  padding:13px 18px}
.lz-head{padding:10px 18px;border-bottom:1px solid var(--hair);font-family:var(--mono);
  font-size:9.5px;letter-spacing:.1em;color:var(--faint)}
.lz-head .r{text-align:right}
.lz-row{border-bottom:1px solid var(--hair-3);align-items:center;color:inherit}
.lz-row:last-of-type{border-bottom:none}
a.lz-row:hover{background:var(--bg)}
a.lz-row:hover .lz-co b{color:var(--green-dark)}
.lz-row.tall{align-items:start;padding-top:22px;padding-bottom:22px}
.lz-co b{display:block;font-size:14px;font-weight:600;color:var(--ink);line-height:1.25}
.lz-meta{display:block;font-family:var(--mono);font-size:10.5px;color:var(--faint);
  font-style:normal;margin-top:2px}
.lz-ev{display:block;font-family:var(--mono);font-size:10px;color:var(--muted);
  font-style:normal;margin-top:6px}
.lz-ev.hot{color:var(--red)}
.lz-read{font-family:var(--serif);font-size:15.5px;color:var(--ink-2);line-height:1.5;
  display:block}
.lz-mid{display:block}
.lz-cta{display:inline-block;font-family:var(--mono);font-size:10px;color:var(--green);
  font-weight:600;margin-top:7px;letter-spacing:.02em}
.lz-vs{text-align:right;font-family:var(--mono);font-size:14px}
.lz-vs.rv{font-size:11px;color:var(--muted)}
.lz-vd{text-align:right;font-family:var(--mono);font-size:11px;font-weight:600;
  letter-spacing:.04em}
.lz-vd.up{color:var(--green)} .lz-vd.dn{color:var(--red)}
.lz-vd.nu,.lz-vd.rv{color:var(--muted)}
.lz-foot{padding:12px 18px;background:var(--bg);border-top:1px solid var(--hair);
  display:flex;align-items:center;gap:12px;font-size:13px;color:var(--muted)}
.lz-more{margin-left:auto;font-family:var(--mono);font-size:10.5px}
.lz-more.wide{font-family:var(--ui);font-size:13px}
.lz-none{background:var(--card);border:1px solid var(--line);border-radius:12px;
  padding:34px 22px;text-align:center;color:var(--body);font-size:14px}

/* The gate, visually. There is no text under these — the server sends block glyphs
   (landing._redact), so this is a texture, not a cover over readable content. The
   screen-reader line beside it is the honest version of the same statement. */
.lz-imp.blur,.lz-vd.blur,.lz-read.blur,.lz-vs.blur{filter:blur(4px);user-select:none;
  color:var(--body-2)}
.lz-vd.blur{color:var(--muted)}
/* The withheld thesis. Lighter and smaller than the prose it stands in for: at the
   reading size and a 4px blur it was a slab of dark grey that outweighed every row
   that actually says something. It only has to read as "a sentence is here". */
.lz-read.blur{filter:blur(2.5px);font-size:13px;line-height:1.35;color:var(--faint);
  opacity:.65;display:block;max-width:60ch}
/* The shop window's verdict column. Same texture as the 7A gate — the figure itself
   never leaves the server (landing._gate_shopfront) — but set in the column's own mono
   so the blur is the width of a real number rather than a smudge. */
.lz-vs.blur{color:var(--muted);pointer-events:none}
/* The verdict cell is a link when it is locked, so the obvious thing to click does
   the obvious thing. Hovering lifts the blur slightly — enough to read as "this
   responds to me", not enough to read the text, of which there is none anyway. */
a.lz-vd.blur{display:block;cursor:pointer}
a.lz-vd.blur:hover{filter:blur(3px);color:var(--ink-2)}
.lz-cta.lock{color:var(--ink-2)}
.lz-cta.lock:hover{color:var(--green-dark)}
.lz-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);
  white-space:nowrap}

/* ── rail cards ─────────────────────────────────────────────────────────────── */
.lz-rc{background:var(--card);border:1px solid var(--line);border-radius:12px;
  padding:18px 20px}
.lz-rct{font-family:var(--serif);font-size:19px;font-weight:600;line-height:1.3}
.lz-q{width:100%;border:1px solid var(--line-2);border-radius:8px;padding:11px 12px;
  margin-top:10px;font-family:var(--serif);font-size:14.5px;color:var(--ink-2);
  background:var(--card);outline:none}
.lz-q:focus{border-color:var(--ink)}
.lz-ask{width:100%;margin-top:8px;background:var(--green);color:#fff;border:none;
  border-radius:8px;padding:11px;font-size:13px;font-weight:600}
.lz-ask:hover{background:var(--green-dark)}
.lz-asksub{margin-top:9px;font-family:var(--ui);font-size:11.5px;line-height:1.45;
  color:var(--muted)}

/* ── the analyst conversation ───────────────────────────────────────────────────
   A panel over the page rather than a route of its own: the visitor is mid-thought
   about the table behind it, and sending them to a separate page would throw away
   the list they just typed. Right-hand drawer on a desktop, the whole screen on a
   phone, where a 420px column beside nothing is just a small page. */
.lz-chat{position:fixed;inset:0;z-index:60;display:flex;justify-content:flex-end}
.lz-chat[hidden]{display:none}
.lz-chat-scrim{position:absolute;inset:0;background:rgba(27,26,23,.34)}
.lz-chat-p{position:relative;display:flex;flex-direction:column;width:min(560px,100%);
  height:100%;background:var(--card);border-left:1px solid var(--line);
  box-shadow:-18px 0 48px rgba(27,26,23,.13)}
.lz-chat-hd{display:flex;align-items:flex-start;gap:12px;padding:16px 20px 13px;
  border-bottom:1px solid var(--hair)}
.lz-chat-hdt{flex:1 1 auto;min-width:0}
.lz-chat-t{font-family:var(--serif);font-size:20px;font-weight:600;line-height:1.25;
  margin-top:3px}
/* Which companies it is answering about. Named in full: "your portfolio" is exactly
   the ambiguity that made the analyst ask which seven the visitor meant. */
.lz-chat-on{margin-top:5px;font-family:var(--mono);font-size:10.5px;line-height:1.5;
  color:var(--faint);word-break:break-word}
.lz-chat-x{background:none;border:none;font-size:24px;line-height:1;color:var(--faint);
  padding:0 2px;cursor:pointer}
.lz-chat-x:hover{color:var(--ink)}
.lz-chat-body{flex:1 1 auto;overflow-y:auto;padding:18px 20px;display:flex;
  flex-direction:column;gap:14px}
.lz-msg{max-width:100%}
.lz-msg .who{font-family:var(--mono);font-size:9.5px;letter-spacing:.11em;
  color:var(--faint);margin-bottom:5px}
.lz-msg.you .bd{background:var(--tok);border-radius:10px;padding:10px 13px;
  font-family:var(--serif);font-size:15px;line-height:1.5;color:var(--ink-2);
  margin-left:auto;max-width:88%;width:fit-content}
.lz-msg.you{display:flex;flex-direction:column;align-items:flex-end}
.lz-msg.ai .bd{font-family:var(--serif);font-size:15.5px;line-height:1.6;
  color:var(--ink-2)}
.lz-msg.ai .bd p{margin:0 0 10px}
.lz-msg.ai .bd p:last-child{margin-bottom:0}
.lz-msg.ai .bd ul,.lz-msg.ai .bd ol{margin:0 0 10px;padding-left:20px}
.lz-msg.ai .bd li{margin-bottom:5px}
.lz-msg.ai .bd strong{font-weight:600;color:var(--ink)}
.lz-msg.ai .bd code{font-family:var(--mono);font-size:12.5px;background:var(--hair-3);
  border-radius:4px;padding:1px 4px}
/* What it is doing while it works its tools — the bulk of the wait, and replaced
   wholesale by the first real token. */
.lz-chat-st{font-family:var(--mono);font-size:11px;color:var(--faint);
  animation:lzpulse 1.6s ease-in-out infinite}
@keyframes lzpulse{0%,100%{opacity:.45}50%{opacity:1}}
.lz-chat-ft{border-top:1px solid var(--hair);padding:12px 20px 16px;background:var(--card)}
/* flex-end so the Ask button stays on the last line as the box grows. */
.lz-chat-form{display:flex;gap:8px;align-items:flex-end}
/* The ask box WRAPS — sized to its content by landing.js, scrolling vertically past
   ~6 lines rather than swallowing the conversation above it. resize:none because the
   drag handle would fight the auto-sizing. */
.lz-chat-in{flex:1 1 auto;min-width:0;border:1px solid var(--line-2);border-radius:8px;
  padding:11px 12px;font-family:var(--serif);font-size:14.5px;color:var(--ink-2);
  background:var(--card);outline:none;line-height:1.5;resize:none;overflow-y:auto;
  max-height:9em;display:block}
.lz-chat-in:focus{border-color:var(--ink)}
.lz-chat-in:disabled{background:var(--hair-3);color:var(--faint)}
.lz-chat-go{background:var(--green);color:#fff;border:none;border-radius:8px;
  padding:11px 18px;font-size:13px;font-weight:600;cursor:pointer}
.lz-chat-go:hover{background:var(--green-dark)}
.lz-chat-go:disabled{background:var(--line-3);cursor:default}
.lz-chat-n{margin-top:8px;font-family:var(--ui);font-size:11.5px;line-height:1.5;
  color:var(--muted)}
.lz-chat-n a{text-decoration:underline;text-underline-offset:2px}
@media (max-width:640px){
  .lz-chat-p{width:100%;border-left:none}
  .lz-chat-body{padding:14px 16px}
  .lz-chat-ft{padding:10px 16px 14px}
}

.lz-pp{display:flex;align-items:baseline;gap:7px}
.lz-pp span{font-family:var(--serif);font-size:27px;font-weight:700;letter-spacing:-.5px}
.lz-pp em{font-style:normal;color:var(--green)}
.lz-tm{font-family:var(--mono);font-size:9px;color:var(--faint);align-self:flex-start;
  margin-top:4px}
.lz-pps{font-family:var(--serif);font-size:16px;color:var(--body);line-height:1.45;
  margin-top:6px}
.lz-ppv{border-top:1px solid var(--hair-2);margin-top:12px;padding-top:12px}
.lz-ppt{font-family:var(--serif);font-size:15.5px;font-weight:600;line-height:1.35;
  margin-top:5px}
.lz-ppn{display:flex;align-items:baseline;gap:7px;margin-top:7px;font-size:13.5px;
  flex-wrap:wrap}
.lz-ppn b{font-weight:600}
.lz-ppn b.blur{filter:blur(3.5px);user-select:none}
.lz-dot{color:var(--dotted)}
.lz-cta2{display:block;width:100%;margin-top:12px;background:var(--ink);
  color:var(--bg)!important;border-radius:8px;padding:11px;font-size:13px;
  font-weight:600;text-align:center}
.lz-cta2:hover{background:#000;color:var(--bg)!important}

.lz-bh{font-family:var(--serif);font-size:16.5px;font-weight:600;line-height:1.3;
  margin-top:6px}
.lz-bb{font-family:var(--serif);font-size:14.5px;color:var(--body);line-height:1.5;
  margin-top:5px}
.lz-ticks{display:flex;gap:14px;align-items:baseline;margin-top:10px;
  border-top:1px solid var(--hair-2);padding-top:10px;font-family:var(--mono);
  font-size:10.5px;flex-wrap:wrap}
.lz-ticks i{font-style:normal}
.lz-read2{margin-left:auto;font-weight:600;font-size:11px;letter-spacing:.04em}

.lz-rc.green{background:var(--green);border:none;color:var(--green-3)}
.lz-k.g{color:var(--green-1)}
.lz-gt{font-family:var(--serif);font-size:21px;font-weight:600;line-height:1.25;
  margin-top:6px;color:var(--green-3)}
.lz-gb{font-size:13px;color:var(--green-2);line-height:1.5;margin-top:5px}
.lz-cta3{display:block;width:100%;margin-top:12px;background:var(--green-3);
  color:var(--green-dark)!important;border-radius:8px;padding:11px;font-size:13.5px;
  font-weight:600;text-align:center}
.lz-cta3:hover{background:#fff;color:var(--green-dark)!important}

/* ── single-column page (the PrimePicks placeholder) ────────────────────────── */
.lz-solo{max-width:620px;margin:0 auto;padding:72px 0 90px;text-align:center}
.lz-pp.big{justify-content:center}
.lz-pp.big span{font-size:44px}
.lz-solo-lead{font-family:var(--serif);font-size:19px;color:var(--body);line-height:1.5;
  margin:10px 0 0}
.lz-solo-badge{display:inline-block;margin-top:26px;background:var(--green);
  color:var(--green-3);border-radius:999px;padding:10px 22px;font-family:var(--mono);
  font-size:12px;letter-spacing:.1em;text-transform:uppercase;font-weight:600}
.lz-solo-note{font-family:var(--serif);font-size:15.5px;color:var(--ink-2);
  line-height:1.6;margin:26px auto 0;max-width:520px}
.lz-solo-cta{display:flex;gap:10px;justify-content:center;margin-top:30px;flex-wrap:wrap}

/* The unlock chooser. Two options side by side and the same visual weight — this is a
   choice, not an upsell with a decoy. */
.lz-solo.wide{max-width:860px;text-align:left}
.lz-solo.wide .lz-h1{font-size:32px}
.lz-opts{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:30px}
.lz-opt{background:var(--card);border:1px solid var(--line);border-radius:14px;
  padding:22px 24px;display:flex;flex-direction:column}
.lz-opt.best{border-color:var(--ink)}
.lz-opt-h{font-family:var(--serif);font-size:21px;font-weight:600;margin-top:7px;
  line-height:1.25}
.lz-opt-b{font-family:var(--serif);font-size:14.5px;color:var(--body);line-height:1.55;
  margin:10px 0 20px}
.lz-opt .lz-cta2{margin-top:auto}
.lz-opt-n{font-size:12.5px;color:var(--red);margin-top:9px;line-height:1.45}
button.lz-cta2{border:none;font:inherit;font-size:13px;font-weight:600;cursor:pointer}
button.lz-cta2:disabled{opacity:.6;cursor:default}
@media (max-width:768px){ .lz-opts{grid-template-columns:1fr} }

/* ── responsive ─────────────────────────────────────────────────────────────── */
/* 768–1100: the rail drops under the table as a 2×2 grid, per the handoff. */
@media (max-width:1100px){
  .lz-grid{grid-template-columns:minmax(0,1fr)}
  .lz-rail{position:static;display:grid;grid-template-columns:1fr 1fr;gap:14px}
  .lz-h1{font-size:32px}
}
@media (max-width:768px){
  .lz-top{padding:12px 18px;gap:12px}
  /* The nav links go; the two account actions stay. On a phone the job of this bar
     is to let someone sign in or start, not to offer four destinations. */
  .lz-nav{display:none}
  .lz-page{padding:0 18px 28px}
  .lz-h1{font-size:27px}
  .lz-box{padding:18px 16px}
  .lz-inrow{flex-direction:column}
  .lz-go{padding:13px 28px}
  .lz-sug{left:16px;right:16px}
  .lz-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;
    margin-left:-18px;margin-right:-18px;padding:0 18px}
  .lz-chips::-webkit-scrollbar{display:none}
  .lz-chip{flex:none}
  .lz-rail{grid-template-columns:1fr}
  /* Rows reflow to stacked blocks: name and verdict on one line, the read beneath. */
  .lz-head{display:none}
  .lz-row,.lz-row.tall{grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;
    padding:16px 16px;align-items:baseline}
  .lz-mid,.lz-read{grid-column:1 / -1}
  .lz-vs,.lz-vd{text-align:right}
  .lz-foot{flex-wrap:wrap;gap:8px}
  .lz-more{margin-left:0}
}


/* Price and timing on the unlock chooser. The timing line is not fine print: buying
   something that is written and buying something that will take three hours are
   different purchases, and the difference belongs next to the button. */
.lz-opt-p{font-family:var(--mono);font-size:26px;font-weight:600;margin-top:8px}
.lz-opt-w{font-family:var(--ui);font-size:13px;line-height:1.5;margin:10px 0 0;
  color:var(--body-2);background:var(--tok);border-radius:8px;padding:9px 11px}
.lz-opt-w.ready{color:var(--green-dark);background:var(--green-3)}

/* Page footer. The landing had none — every other page in the app carries the licence
   line and "not investment advice", so the one page written for people who have agreed
   to nothing was the page that stated none of it. Also the last place a visitor who has
   read the whole page looks for the price. Wraps rather than scrolls on a phone: a
   footer that needs a horizontal drag is a footer nobody reads the end of. */
.lz-pagefoot{max-width:1180px;margin:56px auto 0;padding:18px 22px 40px;
  border-top:1px solid var(--hair);display:flex;align-items:baseline;gap:10px 16px;
  flex-wrap:wrap;font-family:var(--ui);font-size:11.5px;color:var(--muted)}
.lz-pagefoot nav{display:flex;gap:14px;flex-wrap:wrap}
.lz-pagefoot a{color:var(--body-2);text-decoration:underline;text-underline-offset:2px}
.lz-pagefoot a:hover{color:var(--ink)}
.lz-pagefoot-n{flex:1 1 100%;color:var(--muted)}
@media (max-width:640px){ .lz-pagefoot{margin-top:34px;padding:16px 18px 30px} }

/* --- Premium, offered beside a single-company purchase (/unlock) ------------------- */
/* The green is the brand's, and it is used here to say "this is the way in" — the
   a-la-carte button stays ink so the two do not compete for the same emphasis. */
.lz-cta2.green{background:var(--green);color:#fff!important}
.lz-cta2.green:hover{background:var(--green-dark);color:#fff!important}
.lz-seg-row{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.lz-seg{display:inline-flex;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.lz-seg a{font-family:var(--ui);font-size:12px;font-weight:600;padding:5px 11px;
  color:var(--muted);background:var(--card)}
.lz-seg a+a{border-left:1px solid var(--line)}
.lz-seg a[aria-current]{background:var(--green-3);color:var(--green-dark)}
.lz-opt-per{font-size:14px;font-weight:500;color:var(--muted);margin-left:2px}
.lz-opt-feats{list-style:none;padding:0;margin:14px 0 0;font-family:var(--serif);
  font-size:14px;line-height:1.5;color:var(--body)}
.lz-opt-feats li{position:relative;padding-left:18px;margin-bottom:7px}
.lz-opt-feats li:before{content:"";position:absolute;left:0;top:8px;width:7px;height:7px;
  border-radius:50%;background:var(--green-1)}
.lz-opt-b.flash{background:var(--green-3);color:var(--green-dark);border-radius:8px;
  padding:9px 11px}
