/* ── House register, inherited from viperai.co ──────────────────────────────
   Charter (serif) is the DISPLAY voice. System sans is the BODY voice.
   Depth is a RULE, never a shadow. 19px body is the floor.
   Divergence from the product site: green (#1F5A34) belongs to ViperAI and
   appears here ONLY where a product is named. The parent company reads in
   ink, so the hierarchy states parent → product, never the reverse.        */

:root {
  color-scheme: light;
  --serif: Charter,"Bitstream Charter","Charis SIL","Iowan Old Style",Georgia,"Times New Roman",serif;
  --sans: -apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
  --canvas:#FAFAF7; --line:#E6E8E1; --line2:#D8DBD0;
  --ink:#15211B; --body:#3E463F; --mute:#5A6158;
  --viper:#1F5A34;
}

* { margin:0; padding:0; box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
html { scroll-behavior:smooth; }
body {
  background:var(--canvas); color:var(--body);
  font:19px/1.6 var(--sans); -webkit-font-smoothing:antialiased;
}

/* Horizontal longhands only — vertical rhythm belongs to the sections
   themselves, and shorthand here would out-specify their element selectors. */
.wrap { max-width:680px; margin-left:auto; margin-right:auto; padding-left:24px; padding-right:24px; }

/* ── masthead ── */
header { border-bottom:1px solid var(--line); }
header .wrap {
  display:flex; align-items:center; justify-content:space-between;
  gap:20px; min-height:76px; flex-wrap:wrap;
}
.wordmark {
  font-family:var(--serif); font-size:23px; letter-spacing:-.015em;
  color:var(--ink); text-decoration:none; font-weight:400; white-space:nowrap;
}
.wordmark span { color:var(--mute); }
nav { display:flex; gap:4px; }
nav a {
  display:inline-flex; align-items:center; min-height:44px; padding:0 11px;
  color:var(--mute); text-decoration:none; font-size:16px; font-weight:500;
}
nav a:hover { color:var(--ink); }
nav a[aria-current="page"] { color:var(--ink); font-weight:600; }

/* ── page body ── */
main { padding-top:72px; }
h1 {
  font-family:var(--serif); font-weight:400;
  font-size:clamp(32px,5.4vw,46px); line-height:1.08; letter-spacing:-.022em;
  color:var(--ink); max-width:19ch; text-wrap:balance;
}
.lead { font-size:clamp(18px,2.1vw,21px); margin-top:20px; max-width:54ch; }

section { margin-top:64px; }
h2 {
  font:600 14px/1 var(--sans); letter-spacing:.13em; text-transform:uppercase;
  color:var(--mute); padding-bottom:14px; border-bottom:1px solid var(--line);
}
section > p { margin-top:20px; max-width:58ch; }
section > p + p { margin-top:16px; }

/* ── product entries — a rule and a name, no card chrome ── */
.product { margin-top:26px; }
.product + .product { border-top:1px solid var(--line); padding-top:26px; }
.phead { display:flex; align-items:baseline; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.product h3 {
  font-family:var(--serif); font-weight:400; font-size:25px;
  letter-spacing:-.012em; color:var(--ink);
}
.product h3 span { color:var(--viper); }
.status {
  font:600 12px/1 var(--sans); letter-spacing:.09em; text-transform:uppercase;
  color:var(--mute); white-space:nowrap;
}
.status.live { color:var(--viper); }
.product p { margin-top:10px; max-width:56ch; }
.product a.visit {
  display:inline-flex; align-items:center; min-height:44px;
  color:var(--viper); font-weight:600; font-size:17px;
  text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:4px;
}
.product a.visit:hover { color:#164026; }

/* Honest placeholder for work that exists but isn't announced. */
.pipeline {
  margin-top:26px; padding-top:26px; border-top:1px solid var(--line);
  color:var(--mute); font-size:17px; max-width:56ch;
}

/* ── principles ── */
.principle { margin-top:26px; }
.principle + .principle { border-top:1px solid var(--line); padding-top:26px; }
.principle h3 {
  font-family:var(--serif); font-weight:400; font-size:22px;
  letter-spacing:-.01em; color:var(--ink);
}
.principle p { margin-top:8px; max-width:58ch; }

/* ── definition lists (company facts, contact routes) ── */
dl { margin-top:22px; display:grid; grid-template-columns:max-content 1fr; gap:13px 30px; }
dt { color:var(--mute); font-size:16px; }
dd { color:var(--ink); font-size:17px; }
dd a { color:var(--viper); }
dd .note { display:block; color:var(--mute); font-size:15px; margin-top:3px; }

/* ── footer ── */
footer {
  margin-top:88px; padding-top:26px; padding-bottom:64px;
  border-top:1px solid var(--line); font-size:15px; color:var(--mute);
}
footer p { max-width:62ch; }
footer p + p { margin-top:10px; }
footer a { color:var(--mute); }

@media (max-width:560px) {
  header .wrap { min-height:0; padding-top:14px; padding-bottom:10px; }
  nav { margin-left:-11px; }
  main { padding-top:44px; }
  section { margin-top:48px; }
  dl { grid-template-columns:1fr; gap:4px 0; }
  dt { margin-top:14px; }
  .phead { gap:4px; }
}