/* Scoped to .page so the rule can't reach any other h1 on the site
   (defense-in-depth; the chrome doesn't use h1 today). */
.page h1 {
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.15;
  color: var(--cream);
  margin-bottom: 2rem;
}

.problem-block { border-left: 2px solid var(--border); padding-left: 1.5rem; margin-bottom: 2rem; }
.problem-block h2 { font-size: 1rem; font-weight: 700; color: var(--cream); margin-bottom: 0.5rem; letter-spacing: -0.01em; }
.problem-block p { font-size: 0.95rem; color: var(--muted); font-weight: 300; }
.solution { background: var(--surface); border: 1px solid var(--border); border-radius: 12px; padding: 2rem; margin: 3rem 0; }
.solution h2 { font-size: 1.15rem; font-weight: 700; color: var(--cream); margin-bottom: 1rem; }
.solution p { font-size: 0.95rem; color: var(--muted); font-weight: 300; margin-bottom: 0.75rem; }
.solution p:last-child { margin-bottom: 0; }
.open-source { margin-top: 3rem; padding-top: 2rem; border-top: 1px solid var(--border); font-size: 0.9rem; color: var(--muted); font-weight: 300; }
.open-source a { color: var(--cream); text-decoration: underline; text-underline-offset: 3px; }
.author { margin-top: 3rem; padding-top: 2rem; border-top: 1px solid var(--border); display: flex; gap: 1.5rem; align-items: flex-start; }
.author-avatar { flex-shrink: 0; width: 52px; height: 52px; border-radius: 50%; background: var(--surface); border: 1px solid var(--border); display: flex; align-items: center; justify-content: center; font-size: 1.4rem; }
.author-meta { font-size: 0.65rem; font-family: 'DM Mono', monospace; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); margin-bottom: 0.5rem; }
.author-name { font-size: 1rem; font-weight: 700; color: var(--cream); margin-bottom: 0.6rem; }
.author-bio { font-size: 0.9rem; color: var(--muted); font-weight: 300; line-height: 1.7; }
.author-bio + .author-bio { margin-top: 0.75rem; }
.back {
  display: inline-block;
  margin-top: 3rem;
  font-family: 'DM Mono', monospace;
  font-size: 0.75rem;
  color: var(--muted);
  letter-spacing: 0.05em;
}
.back:hover { color: var(--text); }
