/* Blog posts and legal pages (generated by tools/build-cms.py).
   Typography and colors follow the site's own tokens: Geist display, Inter body,
   #0a0a0a ink, #6f6f6f muted, #f5f5f5 surfaces, 20px radii. */
.bt-page {
  --ink: #0a0a0a; --muted: #6f6f6f; --line: #e7e7e7; --surface: #f5f5f5; --accent: #3654ff;
  --display: "Geist", "Geist Placeholder", sans-serif;
  --text: "Inter", "Inter Placeholder", "Inter Display", sans-serif;
  display: block; width: 100%; padding: 56px 0 96px; color: var(--ink); font-family: var(--text);
  -webkit-font-smoothing: antialiased;
}
.bt-wrap { width: 100%; max-width: 760px; margin: 0 auto; padding: 0 20px; box-sizing: border-box; }
.bt-wide { width: 100%; max-width: 1200px; margin-left: auto; margin-right: auto; padding: 0 20px; box-sizing: border-box; }
.bt-page h1, .bt-page h2, .bt-page h3 { font-family: var(--display); font-weight: 500; color: var(--ink); text-wrap: balance; }

/* Post header */
.bt-crumbs { display: flex; gap: 8px; font: 500 15px/1.4 var(--text); color: var(--muted); }
.bt-crumbs a { color: var(--muted); text-decoration: none; }
.bt-crumbs a:hover { color: var(--ink); }
.bt-crumbs span { color: var(--ink); }
.bt-meta { display: inline-flex; align-items: center; gap: 8px; font: 400 14px/1.4 var(--text); color: var(--muted); }
.bt-meta i { font-style: normal; opacity: .6; }
.bt-meta-top { margin-top: 28px; }
.bt-tag { display: inline-flex; align-items: center; height: 28px; padding: 0 12px; margin-right: 6px; border-radius: 999px; background: var(--surface); color: var(--ink); font-weight: 500; }
.bt-post h1 { margin: 18px 0 0; font-size: clamp(36px, 6vw, 60px); line-height: 1.05; letter-spacing: -0.045em; }
.bt-sub { margin: 18px 0 0; max-width: 60ch; font: 400 18px/1.55 var(--text); color: var(--muted); }
.bt-author { display: flex; align-items: center; gap: 12px; margin-top: 28px; }
.bt-author strong { display: block; font: 600 15px/1.3 var(--text); }
.bt-author em { display: block; font: 400 14px/1.3 var(--text); font-style: normal; color: var(--muted); }
.bt-avatar { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 999px; background: var(--surface); font: 600 14px/1 var(--display); letter-spacing: -0.02em; }
.bt-hero { margin-top: 40px; margin-bottom: 0; }
.bt-hero img { display: block; width: 100%; aspect-ratio: 16 / 7; object-fit: cover; border-radius: 20px; background: var(--surface); }

/* Article body */
.bt-prose { margin-top: 48px; font: 400 18px/1.7 var(--text); color: #2b2b2b; }
.bt-prose > :first-child { margin-top: 0; }
.bt-prose p { margin: 0 0 20px; }
.bt-prose h2 { margin: 48px 0 16px; font-size: clamp(26px, 3.4vw, 34px); line-height: 1.15; letter-spacing: -0.035em; }
.bt-prose h3 { margin: 36px 0 12px; font-size: clamp(21px, 2.6vw, 25px); line-height: 1.25; letter-spacing: -0.025em; scroll-margin-top: 110px; }
.bt-prose ul, .bt-prose ol { margin: 0 0 24px; padding-left: 1.25em; }
.bt-prose li { margin: 0 0 10px; padding-left: 4px; }
.bt-prose li::marker { color: var(--muted); }
.bt-prose strong { color: var(--ink); font-weight: 600; }
.bt-prose a { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }
.bt-gallery { display: grid; gap: 12px; margin: 32px 0; }
.bt-gallery figure { margin: 0; }
.bt-gallery img { display: block; width: 100%; height: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 16px; background: var(--surface); }
.bt-gallery.n1 img { aspect-ratio: 16 / 10; }

/* Related articles */
.bt-related { margin-top: 96px; }
.bt-related h2 { margin: 0 0 28px; font-size: clamp(30px, 4vw, 44px); letter-spacing: -0.045em; }
.bt-cards { display: grid; gap: 24px; }
.bt-card { display: flex; flex-direction: column; gap: 10px; color: var(--ink); text-decoration: none; }
.bt-card-img { display: block; overflow: hidden; border-radius: 16px; background: var(--surface); }
.bt-card-img img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .5s cubic-bezier(.22,1,.36,1); }
.bt-card:hover .bt-card-img img { transform: scale(1.03); }
.bt-card .bt-meta { margin-top: 6px; }
.bt-card-title { font: 500 22px/1.2 var(--display); letter-spacing: -0.03em; }
.bt-card-desc { font: 400 15px/1.5 var(--text); color: var(--muted); }

/* Legal pages */
.bt-legal-head h1 { margin: 0; font-size: clamp(40px, 7vw, 64px); line-height: 1.02; letter-spacing: -0.05em; }
.bt-legal-head .bt-sub { max-width: 52ch; font-size: 16px; }
.bt-legal-grid { display: grid; gap: 40px; margin-top: 48px; padding-top: 40px; border-top: 1px solid var(--line); }
.bt-toc p { margin: 0 0 12px; font: 500 15px/1.4 var(--text); color: var(--muted); }
.bt-toc ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.bt-toc a { font: 400 15px/1.4 var(--text); color: var(--ink); text-decoration: none; }
.bt-toc a:hover { color: var(--accent); }
.bt-legal .bt-prose { margin-top: 0; font-size: 16px; line-height: 1.7; }
.bt-legal .bt-prose h3 { font-size: 22px; }

@media (min-width: 640px) {
  .bt-gallery.n2 { grid-template-columns: 1fr 1fr; }
  .bt-gallery.n3 { grid-template-columns: 1fr 1fr 1fr; }
  .bt-cards { grid-template-columns: repeat(3, 1fr); }
}
@media (min-width: 810px) {
  .bt-page { padding: 80px 0 120px; }
  .bt-wrap, .bt-wide { padding: 0 32px; }
}
@media (min-width: 1000px) {
  .bt-legal-grid { grid-template-columns: 280px 1fr; gap: 64px; }
  .bt-toc { position: sticky; top: 120px; align-self: start; }
}
@media (prefers-reduced-motion: reduce) { .bt-card-img img { transition: none; } }