@font-face {
  font-family: 'Geist';
  src: url('fonts/Geist-Variable.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Geist Mono';
  src: url('fonts/GeistMono-Variable.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; font-family: 'Geist', -apple-system, 'Segoe UI', sans-serif; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; background: #FCFCFD; color: #16181D; }
a { text-decoration: none; color: inherit; }
.lnk:hover { color: #16181D; }
.navcta:hover { background: #21356f; }
.ghost:hover { background: #F2F3F6; }
.fcard { transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.fcard:hover { border-color: #D9DBE0 !important; box-shadow: 0 1px 2px rgba(16,18,27,.04), 0 16px 38px -22px rgba(16,18,27,.18); transform: translateY(-2px); }
.ph { background-color: #F4F5F7; background-image: repeating-linear-gradient(135deg, #ECEEF1 0 10px, #F4F5F7 10px 20px); }
.mono { font-family: 'Geist Mono', monospace; }

.prose-page { max-width: 760px; margin: 0 auto; padding: 64px 24px 96px; }
.prose-page h1 { font-size: 38px; font-weight: 700; letter-spacing: -.03em; line-height: 1.1; margin: 0 0 10px; }
.prose-page .meta { font-family: 'Geist Mono', monospace; font-size: 12.5px; color: #9AA0A8; margin: 0 0 52px; }
.prose-page h2 { font-size: 20px; font-weight: 600; letter-spacing: -.01em; color: #16181D; margin: 44px 0 10px; }
.prose-page p { font-size: 16px; line-height: 1.75; color: #52575F; margin: 0 0 16px; }
.prose-page ul, .prose-page ol { padding-left: 22px; margin: 0 0 16px; }
.prose-page li { font-size: 16px; line-height: 1.7; color: #52575F; margin-bottom: 6px; }
.prose-page a { color: #2C53D4; }
.prose-page a:hover { text-decoration: underline; }
.prose-page strong { color: #16181D; font-weight: 600; }
.prose-page .divider { height: 1px; background: #EDEEF1; margin: 48px 0; }

@media (max-width: 920px) {
  .hide-sm { display: none !important; }
  .hero-grid { grid-template-columns: 1fr !important; }
  .two-col { grid-template-columns: 1fr !important; }
  .feat-grid { grid-template-columns: 1fr !important; }
  .price-grid { grid-template-columns: 1fr !important; }
  .h1big { font-size: 46px !important; }
  .footer-grid { grid-template-columns: 1fr 1fr !important; }
  .prose-page h1 { font-size: 28px; }
}