/* Article-specific styles for Design Patterns guide */
.article-page .content {
  line-height: 1.65;
  font-size: 1rem;
}
.article-page pre,
.article-page pre code,
.article-page code {
  background: var(--color-bg-card);
  color: var(--color-text-primary);
  padding: 12px;
  overflow: auto;
  border-radius: 6px;
  font-family: Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 0.95rem;
  border: 1px solid rgba(255,255,255,0.03);
  box-shadow: 0 6px 18px rgba(0,0,0,0.35);
}
.article-page pre code { display:block; white-space:pre-wrap; }
.article-page .cta{margin-top:1.2rem;font-weight:600}

/* Make headings readable on narrow screens */
.article-page h1{font-size:1.6rem}
.article-page h2{font-size:1.25rem}
.article-page h3{font-size:1.05rem}

@media (max-width:720px){
  .article-page .container{padding:0 16px}
  .article-page pre{font-size:0.9rem}
}