/* wiseDo Blog typography — restores article formatting */
/* The production CSS has no Tailwind Typography (.prose) rules and resets all */
/* margins to 0, so we define readable article styling here. Scoped to .prose. */

.prose {
  color: #e6e4dc;
  font-size: 1.125rem;
  line-height: 1.8;
  font-family: Inter, system-ui, sans-serif;
}

/* Headings: serif, bold, with breathing room */
.prose h2 {
  font-family: var(--app-font-display) !important;
  font-size: 1.875rem !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  color: #f5f5f7 !important;
  margin-top: 2.5rem !important;
  margin-bottom: 1rem !important;
}

.prose h3 {
  font-family: var(--app-font-display) !important;
  font-size: 1.375rem !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  color: #f5f5f7 !important;
  margin-top: 2rem !important;
  margin-bottom: 0.75rem !important;
}

/* Paragraphs */
.prose p {
  margin-top: 0 !important;
  margin-bottom: 1.5rem !important;
}

/* Strong / emphasis */
.prose strong {
  color: #f5f5f7 !important;
  font-weight: 700 !important;
}

.prose em {
  font-style: italic !important;
}

/* Lists */
.prose ul,
.prose ol {
  margin-top: 0 !important;
  margin-bottom: 1.5rem !important;
  padding-left: 1.5rem !important;
}

.prose ul {
  list-style-type: disc !important;
}

.prose ol {
  list-style-type: decimal !important;
}

.prose li {
  margin-bottom: 0.5rem !important;
  padding-left: 0.25rem !important;
}

.prose li::marker {
  color: #d5d8dd !important;
}

/* Links */
.prose a {
  color: #d5d8dd !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
}

.prose a:hover {
  color: #3968b5 !important;
}

/* Horizontal rule */
.prose hr {
  border: 0 !important;
  border-top: 1px solid rgba(20, 26, 38, 0.12) !important;
  margin: 2.5rem 0 !important;
}

/* Blockquote (if used) */
.prose blockquote {
  border-left: 3px solid #d5d8dd !important;
  padding-left: 1rem !important;
  margin: 1.5rem 0 !important;
  color: #b3b1a7 !important;
  font-style: italic !important;
}

/* First heading shouldn't have a big top gap */
.prose > h2:first-child {
  margin-top: 0 !important;
}


/* Diagrams: break out of the prose measure and render large enough to read */
.diagram-fig { margin: 2.75rem auto; }
@media (min-width: 900px) {
  .diagram-fig { width: min(960px, calc(100vw - 4rem)); margin-left: 50%; transform: translateX(-50%); }
}
.diagram-fig svg { max-width: 100% !important; width: 100%; height: auto; display: block; margin: 0 auto;
  text-rendering: geometricPrecision; -webkit-font-smoothing: antialiased; }
.diagram-fig svg text { paint-order: stroke; }


/* Fixed header: keep it legible over article text while scrolling */
header.fixed { background: rgba(0,0,0,.88); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-bottom: 1px solid rgba(36,49,77,.6); }

.bloghero{margin:2rem 0 2.6rem}
.bloghero img{width:100%;aspect-ratio:21/9;object-fit:cover;border-radius:14px;border:1px solid #313136;display:block}