/* Shared by every inner page (product, results, reports, research, teams, get): the site's theme outside the 3D home page.
   Black, bone, Jost for headings, Geist for text, Geist Mono for data; red only where Malphas acted. */
:root { --display: "Jost", system-ui, sans-serif; --text: "Geist", system-ui, sans-serif; --mono: "Geist Mono", ui-monospace, monospace;
  --fg: #edede8; --fg2: rgba(237,237,232,.64); --fg3: rgba(237,237,232,.42); --hair: rgba(237,237,232,.12); --red: #e8283f; --ease: cubic-bezier(.16,1,.3,1); }
html, body { margin: 0; background: #000; color: var(--fg); font-family: var(--text); -webkit-font-smoothing: antialiased; }
::selection { background: rgba(237,237,232,.22); color: #fff; }
nav.nav { font-family: var(--text); }
nav.nav .brand span { font-family: var(--display); font-weight: 400; letter-spacing: .44em; }
nav.nav .panel em::before { background: var(--red); }

.pg { width: min(1180px, calc(100vw - 48px)); margin: 0 auto; padding: 180px 0 120px; }
.pg-narrow { width: min(820px, calc(100vw - 48px)); }
.pg-lab { display: flex; align-items: center; gap: 14px; font-family: var(--display); font-size: 12px; letter-spacing: .32em; color: var(--fg3); }
.pg-lab i { width: 28px; height: 1px; background: rgba(237,237,232,.35); }
.pg h1 { margin: 22px 0 0; font-family: var(--display); font-weight: 300; font-size: clamp(42px, 5.2vw, 80px); line-height: 1.02; letter-spacing: -.01em; }
.pg h1 em { display: block; font-style: normal; color: rgba(237,237,232,.48); }
.pg-lead { margin: 26px 0 0; max-width: 36em; font-size: 18px; line-height: 1.65; color: var(--fg2); }
.pg-sec { margin-top: 110px; }
.pg-sec > h2 { margin: 0 0 12px; font-family: var(--display); font-weight: 300; font-size: clamp(28px, 2.8vw, 42px); letter-spacing: -.005em; }
.pg-sec > p { margin: 0; max-width: 40em; font-size: 16.5px; line-height: 1.65; color: var(--fg2); }
.pg-btn { display: inline-flex; align-items: center; height: 48px; padding: 0 24px; border-radius: 999px; border: 1px solid rgba(237,237,232,.3); color: var(--fg);
  font: inherit; font-size: 15px; text-decoration: none; background: none; cursor: pointer; transition: border-color .3s, background .3s; }
.pg-btn:hover { border-color: var(--fg); background: rgba(237,237,232,.05); }
.pg-btn.pri { background: var(--fg); color: #070708; border-color: var(--fg); font-weight: 500; }
.pg-btn.pri:hover { background: #fff; }
.pg-tag { display: inline-flex; align-items: center; padding: 4px 11px; border-radius: 999px; border: 1px solid rgba(237,237,232,.3); font-size: 12px; color: rgba(237,237,232,.8); }
.pg-tag.soon { background: var(--fg); color: #070708; border-color: var(--fg); }
.pg-demo { font-family: var(--mono); font-size: 11px; letter-spacing: .12em; color: var(--fg3); padding: 3px 10px; border: 1px dashed rgba(237,237,232,.22); border-radius: 4px; }

/* forms (teams, get) */
.pg-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; max-width: 640px; margin-top: 36px; }
.pg-form label { display: flex; flex-direction: column; gap: 8px; font-size: 13.5px; color: var(--fg2); }
.pg-form label.wide { grid-column: 1 / -1; }
.pg-form input, .pg-form select, .pg-form textarea { font: inherit; font-size: 15.5px; color: var(--fg); background: rgba(237,237,232,.03); border: 1px solid var(--hair);
  border-radius: 10px; padding: 13px 14px; outline: none; transition: border-color .3s; }
.pg-form textarea { min-height: 120px; resize: vertical; }
.pg-form input:focus, .pg-form select:focus, .pg-form textarea:focus { border-color: rgba(237,237,232,.45); }
.pg-form select option { background: #0b0b0c; }
.pg-form .row { grid-column: 1 / -1; display: flex; align-items: center; gap: 18px; flex-wrap: wrap; margin-top: 6px; }
.pg-form .fine { font-size: 13px; color: var(--fg3); }
.pg-form .fine a { color: var(--fg2); text-underline-offset: 3px; }
/* the bot trap: off screen, never seen or tabbed to by people */
.pg-form .hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.pg-form.sending button { opacity: .6; cursor: progress; }
.pg-form .code-lead, .pg-form p.wide { grid-column: 1 / -1; margin: 0; font-size: 15.5px; line-height: 1.6; color: var(--fg2); }
.pg-form .code-lead b { font-weight: 500; color: var(--fg); word-break: break-all; }
.pg-form .code-in { font-family: 'Geist Mono', 'Cascadia Mono', Consolas, monospace; font-size: 24px; letter-spacing: .5em; padding-left: 18px; max-width: 260px; }
.pg-form .linkish { font: inherit; color: var(--fg2); background: none; border: 0; padding: 0; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.pg-form .linkish:hover { color: var(--fg); }
.pg-form .form-err { grid-column: 1 / -1; margin: 0; font-size: 14px; color: #ff6b7d; }
.form-done { max-width: 520px; margin-top: 36px; padding: 18px 22px; border-radius: 14px; border: 1px solid var(--hair); background: rgba(237,237,232,.04);
  font-size: 16px; line-height: 1.55; color: var(--fg); animation: form-in .5s var(--ease) both; }
@keyframes form-in { from { opacity: 0; transform: translateY(6px); } }
.pg-privacy { max-width: 520px; margin: 22px 0 0; font-size: 13px; line-height: 1.6; color: var(--fg3); }
.pg-privacy b { font-weight: 500; color: var(--fg2); } .pg-privacy a { color: var(--fg2); text-decoration: underline; text-underline-offset: 3px; }
.pg-done { display: none; margin-top: 30px; padding: 22px 24px; border-radius: 14px; border: 1px solid var(--hair); background: rgba(237,237,232,.03); max-width: 640px; }
.pg-done.on { display: block; }
@media (max-width: 760px) { .pg-form { grid-template-columns: 1fr; } }