/* tekimax.ai - Transcript Vault landing. Static, no deps, on-brand
   (black/white, sharp corners - matches the app). */
* { box-sizing: border-box; border-radius: 0; margin: 0; padding: 0; }
:root {
  --ink: #000; --bg: #efefef; --surface: #fff; --muted: #5e5e5e;
  --line: #e4e4e4; --ok: #1a7f37;
}
body {
  font: 15px/1.55 -apple-system, BlinkMacSystemFont, "Helvetica Neue",
    system-ui, sans-serif;
  color: var(--ink); background: var(--bg);
  -webkit-font-smoothing: antialiased;
}
.wrap { max-width: 760px; margin: 0 auto; padding: 0 24px; }
header {
  background: #000; color: #fff; padding: 18px 0;
}
header .wrap { display: flex; align-items: center; gap: 14px; }
header img { height: 26px; filter: brightness(0) invert(1); }
header .tag { font-size: 12px; color: #9a9a9a; }
.hero { padding: 64px 0 40px; text-align: center; }
.hero h1 {
  font-size: 40px; font-weight: 700; letter-spacing: -0.02em;
  line-height: 1.15; margin-bottom: 16px;
}
.hero p { font-size: 17px; color: var(--muted); max-width: 56ch;
  margin: 0 auto 32px; }
.cta { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.btn {
  display: inline-block; font-size: 15px; font-weight: 600;
  padding: 14px 28px; border: 1px solid #000; cursor: pointer;
  text-decoration: none; transition: background .12s, color .12s;
}
.btn.primary { background: #000; color: #fff; }
.btn.primary:hover { background: #282828; }
.btn.ghost { background: var(--surface); color: #000; }
.btn.ghost:hover { background: #fff; border-color: var(--muted); }
.note { font-size: 13px; color: var(--muted); margin-top: 14px; }
section.card {
  background: var(--surface); border: 1px solid var(--line);
  padding: 28px; margin: 28px 0;
}
section.card h2 {
  font-size: 13px; text-transform: uppercase; letter-spacing: .08em;
  color: var(--muted); margin-bottom: 16px;
}
ol.flow { list-style: none; counter-reset: s; }
ol.flow li {
  counter-increment: s; padding: 10px 0 10px 40px; position: relative;
  border-bottom: 1px solid var(--line); font-size: 14px;
}
ol.flow li:last-child { border-bottom: none; }
ol.flow li::before {
  content: counter(s); position: absolute; left: 0; top: 10px;
  width: 24px; height: 24px; background: #000; color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 700;
}
.price { font-size: 15px; }
.price strong { font-size: 22px; }
footer {
  background: #000; color: #9a9a9a; font-size: 12px;
  padding: 20px 0; margin-top: 48px; text-align: center;
}
.big-ok {
  width: 56px; height: 56px; margin: 0 auto 20px; background: var(--ok);
  display: flex; align-items: center; justify-content: center;
}
.big-ok svg { width: 28px; height: 28px; }