/* ============================================================
   Verifyco · /pitch — the investor deck as a page.
   Builds on site.css tokens (bg, cream, bronze, ink, type helpers).
   The deck's own language: numbered mono labels, serif italic accents,
   hairline cards on the espresso field, one idea per screen.
   ============================================================ */

.pitch-page { background: var(--bg); }
.pitch-page .skip-link {
  position: absolute; left: 16px; top: -48px; z-index: 3000;
  padding: 10px 14px; border-radius: 10px; background: var(--card); color: var(--cream);
  font-size: 13px; transition: top 160ms ease;
}
.pitch-page .skip-link:focus { top: 12px; }

/* Serif italic accent used across headings */
.pt-em, .pt-h1 em {
  font-family: var(--f-serif);
  font-style: italic;
  font-weight: 400;
  letter-spacing: -0.01em;
  color: var(--bronze-2);
}

/* ── Hero ────────────────────────────────────────────────── */
.pt-hero {
  position: relative;
  padding: calc(var(--nav-h) + clamp(56px, 8vw, 120px)) 0 clamp(40px, 6vw, 72px);
  overflow: hidden;
}
.pt-hero-glow {
  position: absolute; inset: -20% -10% auto -10%; height: 90%;
  background:
    radial-gradient(60% 55% at 72% 38%, rgba(214, 172, 134, 0.16) 0%, rgba(214, 172, 134, 0) 70%),
    radial-gradient(40% 40% at 20% 20%, rgba(188, 142, 100, 0.08) 0%, rgba(188, 142, 100, 0) 70%);
  pointer-events: none;
}
.pt-hero-in {
  position: relative; z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  gap: clamp(28px, 4vw, 56px);
  align-items: center;
}
.pt-hero-copy { display: grid; gap: 24px; justify-items: start; }
.pt-h1 { font-size: clamp(42px, 6.2vw, 84px); max-width: 11ch; }
.pt-ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 4px; }
.pt-byline {
  font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--ink-3);
}
.pt-byline a { color: var(--ink-2); }
.pt-byline a:hover { color: var(--cream); }
.pt-hero-art { margin: 0; position: relative; }
.pt-hero-art img { width: 100%; height: auto; display: block; filter: drop-shadow(0 40px 80px rgba(0, 0, 0, 0.55)); }

/* Section index strip under the hero (the deck's table of contents) */
.pt-sections {
  position: relative; z-index: 1;
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 8px;
  margin-top: clamp(40px, 6vw, 72px);
  padding-top: 22px;
  border-top: 1px solid var(--line);
}
.pt-sections a {
  display: grid; gap: 6px;
  font-size: 13px; color: var(--ink-2);
  padding: 10px 0;
  border-top: 1px solid transparent;
  transition: color 200ms ease, border-color 200ms ease;
}
.pt-sections a b { font-family: var(--f-mono); font-weight: 500; font-size: 11px; letter-spacing: 0.2em; color: var(--bronze); }
.pt-sections a:hover { color: var(--cream); border-top-color: var(--line-2); }

/* ── Shared blocks ───────────────────────────────────────── */
.pt-sec { padding-top: clamp(80px, 10vw, 136px); }
.pt-sec .sec-head { margin-bottom: clamp(36px, 5vw, 56px); }

.pt-card {
  position: relative;
  display: grid; gap: 12px; align-content: start;
  padding: 26px 26px 28px;
  border-radius: var(--rad);
  background: linear-gradient(160deg, rgba(214, 172, 134, 0.05), rgba(214, 172, 134, 0.012)), var(--card);
  border: 1px solid var(--line);
}
.pt-card h3 { font-size: 19px; font-weight: 600; letter-spacing: -0.015em; color: var(--ink); text-wrap: balance; }
.pt-card p { font-size: 15px; line-height: 1.6; color: var(--ink-2); text-wrap: pretty; }
.pt-num { font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.2em; color: var(--bronze-2); }

.pt-cols3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.pt-cols2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 28px; }
.pt-cols2--wide { margin-top: 0; grid-template-columns: repeat(4, minmax(0, 1fr)); }

.pt-sources, .pt-note {
  margin-top: 26px;
  font-family: var(--f-mono); font-size: 11.5px; line-height: 1.7; letter-spacing: 0.04em;
  color: var(--ink-3); max-width: 90ch;
}

/* ── Thesis ──────────────────────────────────────────────── */
.pt-thesis { display: grid; gap: 22px; max-width: 980px; }
.pt-thesis-h { font-size: clamp(28px, 3.8vw, 50px); }
.pt-thesis-p { max-width: 72ch; }
.pt-pillars {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0;
  margin-top: clamp(36px, 5vw, 56px);
  border-top: 1px solid var(--line);
}
.pt-pillar { display: grid; gap: 10px; padding: 24px 22px 6px 0; border-right: 1px solid var(--line); margin-right: 22px; }
.pt-pillar:last-child { border-right: 0; margin-right: 0; }
.pt-pillar b { font-size: 16.5px; font-weight: 600; color: var(--cream); letter-spacing: -0.01em; }
.pt-pillar span { font-size: 14.5px; line-height: 1.6; color: var(--ink-2); }

/* ── Timeline ────────────────────────────────────────────── */
.pt-timeline {
  display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 10px;
  margin: 0 0 28px; padding: 0; list-style: none;
  counter-reset: none;
}
.pt-timeline li {
  position: relative;
  display: grid; gap: 10px; align-content: start;
  padding: 22px 0 0;
  border-top: 1px solid var(--line-2);
}
.pt-timeline li::before {
  content: ""; position: absolute; top: -4px; left: 0;
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--bronze); box-shadow: 0 0 0 4px var(--bg);
}
.pt-timeline time { font-family: var(--f-mono); font-size: 11.5px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--bronze-2); }
.pt-timeline span { font-size: 14px; line-height: 1.5; color: var(--ink-2); text-wrap: pretty; }
.pt-timeline li.is-hot { padding: 18px 16px 18px; margin-top: 4px; border: 1px solid var(--line-2); border-radius: 14px; background: var(--bronze-soft); }
.pt-timeline li.is-hot::before { display: none; }
.pt-timeline li.is-hot time { color: var(--cream); }
.pt-timeline li.is-hot span { color: var(--ink); }

/* ── Product ─────────────────────────────────────────────── */
.pt-product {
  display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: clamp(28px, 4vw, 64px); align-items: center;
}
.pt-feats { display: grid; gap: 0; }
.pt-feat { display: grid; gap: 6px; padding: 18px 0; border-top: 1px solid var(--line); }
.pt-feat:first-child { border-top: 0; padding-top: 0; }
.pt-feat b { font-size: 17px; font-weight: 600; color: var(--cream); letter-spacing: -0.01em; }
.pt-feat span { font-size: 14.5px; line-height: 1.6; color: var(--ink-2); }
.pt-chips { display: flex; flex-wrap: wrap; gap: 8px; padding-top: 20px; }
.pt-chips span {
  font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--ink-2); padding: 7px 11px; border-radius: 999px;
  border: 1px solid var(--line); background: rgba(188, 142, 100, 0.05);
}
.pt-chips--engine { padding-top: 26px; }

.pt-phones { display: flex; justify-content: center; align-items: flex-end; gap: clamp(10px, 2vw, 22px); perspective: 1400px; }
.pt-ph { --phw: clamp(140px, 15vw, 210px); margin: 0; display: grid; gap: 12px; justify-items: center; }
.pt-ph .ph-scr { aspect-ratio: 760 / 1647; }
.pt-ph--mid { --phw: clamp(160px, 17vw, 236px); transform: translateY(-18px); }
.pt-ph figcaption { font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--ink-3); }

/* ── Split sections (web, who) ───────────────────────────── */
.pt-split {
  display: grid; grid-template-columns: minmax(0, 0.84fr) minmax(0, 1.16fr);
  gap: clamp(28px, 4vw, 64px); align-items: center;
}
.pt-split--rev .pt-split-copy { order: 2; }
.pt-split--rev .pt-split-art { order: 1; }
.pt-split-copy { display: grid; gap: 22px; }
.pt-split-copy .t-display { font-size: clamp(30px, 3.9vw, 50px); }
.pt-split-art { margin: 0; display: grid; gap: 14px; }
.pt-split-art img { width: 100%; height: auto; display: block; border-radius: 18px; }
.pt-list { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.pt-list li { display: grid; gap: 5px; padding: 16px 0; border-top: 1px solid var(--line); }
.pt-list li:first-child { border-top: 0; padding-top: 0; }
.pt-list b { font-size: 16.5px; font-weight: 600; color: var(--cream); letter-spacing: -0.01em; }
.pt-list span { font-size: 14.5px; line-height: 1.6; color: var(--ink-2); }

/* ── Engine ──────────────────────────────────────────────── */
.pt-engine {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.95fr) minmax(0, 0.95fr);
  gap: 16px; align-items: stretch;
}
.pt-families { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.pt-families li {
  display: grid; grid-template-columns: 34px 1fr; grid-template-rows: auto auto; column-gap: 12px;
  padding: 14px 16px; border-radius: 14px; border: 1px solid var(--line); background: var(--card);
}
.pt-families i { grid-row: 1 / span 2; font-style: normal; font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.16em; color: var(--bronze-2); padding-top: 3px; }
.pt-families b { font-size: 15.5px; font-weight: 600; color: var(--cream); }
.pt-families span { font-size: 13.5px; color: var(--ink-2); }
.pt-contract, .pt-report {
  display: grid; gap: 12px; align-content: start;
  padding: 26px 26px 28px; border-radius: var(--rad); border: 1px solid var(--line-2);
  background: linear-gradient(160deg, rgba(214, 172, 134, 0.09), rgba(214, 172, 134, 0.02)), var(--card);
}
.pt-contract h3, .pt-report h3 { font-size: 21px; font-weight: 600; letter-spacing: -0.015em; color: var(--ink); text-wrap: balance; }
.pt-contract p, .pt-report p { font-size: 15px; line-height: 1.6; color: var(--ink-2); }
.pt-report { border-color: var(--line); background: var(--card); }

/* ── Roadmap steps ───────────────────────────────────────── */
.pt-card--step ul { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.pt-card--step li { position: relative; padding-left: 18px; font-size: 14.5px; line-height: 1.55; color: var(--ink-2); }
.pt-card--step li::before { content: ""; position: absolute; left: 0; top: 10px; width: 6px; height: 6px; border-radius: 50%; background: var(--bronze); }
.pt-step { font-family: var(--f-mono); font-size: 11.5px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--bronze-2); }

/* ── Founder ─────────────────────────────────────────────── */
.pt-founder {
  display: grid; grid-template-columns: 180px minmax(0, 1fr);
  gap: clamp(24px, 4vw, 56px); align-items: start;
  padding: clamp(28px, 4vw, 48px); border-radius: 28px;
  border: 1px solid var(--line); background: var(--surface);
}
.pt-founder-mark {
  width: 180px; aspect-ratio: 1; border-radius: 28px;
  display: grid; place-items: center;
  background:
    radial-gradient(circle at 50% 38%, rgba(246, 227, 200, 0.95) 0%, rgba(214, 172, 134, 0.85) 40%, rgba(120, 84, 52, 0.6) 76%, rgba(60, 40, 24, 0.15) 100%);
  box-shadow: 0 0 60px 8px rgba(214, 172, 134, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.35);
}
.pt-founder-mark span { font-family: var(--f-serif); font-style: italic; font-size: 54px; color: #1A120A; letter-spacing: -0.02em; }
.pt-founder-copy { display: grid; gap: 18px; }
.pt-founder-copy .t-display { font-size: clamp(28px, 3.6vw, 46px); }
.pt-dl { display: grid; gap: 14px; margin: 6px 0 0; }
.pt-dl div { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 16px; padding-top: 14px; border-top: 1px solid var(--line); }
.pt-dl dt { font-family: var(--f-mono); font-size: 11.5px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--bronze-2); padding-top: 3px; }
.pt-dl dd { margin: 0; font-size: 15px; line-height: 1.6; color: var(--ink-2); }
.pt-founder-links { display: flex; flex-wrap: wrap; gap: 18px; font-family: var(--f-mono); font-size: 12.5px; letter-spacing: 0.06em; }
.pt-founder-links a { color: var(--ink-2); }
.pt-founder-links a:hover { color: var(--cream); }

/* ── Contact ─────────────────────────────────────────────── */
.pt-contact {
  display: grid; gap: 22px; justify-items: center; text-align: center;
  padding: clamp(40px, 6vw, 72px) clamp(20px, 4vw, 56px);
  border-radius: 28px; border: 1px solid var(--line-2);
  background:
    radial-gradient(70% 90% at 50% 0%, rgba(214, 172, 134, 0.16) 0%, rgba(214, 172, 134, 0) 70%),
    var(--card);
}
.pt-contact .t-display { font-size: clamp(32px, 4.4vw, 56px); max-width: 16ch; }
.pt-contact .sub { max-width: 52ch; }
.pt-contact .pt-ctas { justify-content: center; }
.pt-follow { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 22px; margin-top: 10px; font-size: 14px; }
.pt-follow a { color: var(--ink-2); }
.pt-follow a:hover { color: var(--cream); }
.pt-follow .mono-note { width: 100%; }

/* ── Responsive ──────────────────────────────────────────── */
@media (max-width: 1100px) {
  .pt-sections { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .pt-pillars { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 8px; }
  .pt-pillar:nth-child(2) { border-right: 0; margin-right: 0; }
  .pt-timeline { grid-template-columns: repeat(4, minmax(0, 1fr)); row-gap: 18px; }
  .pt-cols2--wide { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pt-engine { grid-template-columns: 1fr 1fr; }
  .pt-families { grid-column: 1 / -1; grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .pt-families li { grid-template-columns: 1fr; row-gap: 4px; }
  .pt-families i { grid-row: auto; }
}
@media (max-width: 860px) {
  .pt-hero { padding-top: calc(var(--nav-h) + 36px); }
  .pt-hero-in { grid-template-columns: 1fr; gap: 28px; }
  .pt-hero-copy { justify-items: start; }
  .pt-h1 { max-width: none; }
  .pt-product, .pt-split { grid-template-columns: 1fr; }
  .pt-split--rev .pt-split-copy { order: 1; }
  .pt-split--rev .pt-split-art { order: 2; }
  .pt-cols3 { grid-template-columns: 1fr; }
  .pt-phones { padding-top: 10px; }
  .pt-ph { --phw: clamp(96px, 27vw, 150px); }
  .pt-ph--mid { --phw: clamp(110px, 31vw, 170px); transform: translateY(-10px); }
  .pt-families { grid-template-columns: 1fr; }
  .pt-families li { grid-template-columns: 34px 1fr; }
  .pt-families i { grid-row: 1 / span 2; }
  .pt-engine { grid-template-columns: 1fr; }
  .pt-founder { grid-template-columns: 1fr; }
  .pt-founder-mark { width: 120px; }
  .pt-founder-mark span { font-size: 38px; }
  .pt-dl div { grid-template-columns: 1fr; gap: 6px; }
}
@media (max-width: 640px) {
  .pt-sections { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pt-pillars { grid-template-columns: 1fr; }
  .pt-pillar { border-right: 0; margin-right: 0; padding-right: 0; }
  .pt-timeline { grid-template-columns: 1fr 1fr; }
  .pt-cols2, .pt-cols2--wide { grid-template-columns: 1fr; }
  .pt-ph figcaption { font-size: 9.5px; letter-spacing: 0.14em; }
  .pt-ctas .btn { width: 100%; }
  .pt-chips span { font-size: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .pt-hero-art img { filter: none; }
}