/* ════════════════════════════════════════════════════════════
   heyLooAI — Article / review reading experience (Medium-grade)
   ════════════════════════════════════════════════════════════ */

body.single-post.hl-article-reading {
  --hl-read-max: 680px;
  --hl-read-ink: #ece9f8;
  --hl-read-muted: #b9b3d4;
  --hl-read-accent: #a78bfa;
}

body.single-post.hl-article-reading .entry-content {
  max-width: var(--hl-read-max) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: clamp(12px, 3vw, 24px) clamp(18px, 4vw, 28px) 4rem !important;
  font-family: "Schibsted Grotesk", "Source Sans 3", Georgia, "Times New Roman", serif !important;
  font-size: clamp(1.0625rem, 2.2vw, 1.1875rem) !important;
  line-height: 1.82 !important;
  letter-spacing: 0.012em !important;
  color: var(--hl-read-ink) !important;
  font-weight: 450 !important;
}

body.single-post.hl-article-reading .entry-content > *:first-child {
  margin-top: 0 !important;
}

body.single-post.hl-article-reading .entry-content p {
  margin: 0 0 1.5rem !important;
  max-width: none !important;
  color: var(--hl-read-ink) !important;
}

body.single-post.hl-article-reading .entry-content h2 {
  font-family: "Bricolage Grotesque", "Sora", ui-sans-serif, system-ui, sans-serif !important;
  font-size: clamp(1.4rem, 4vw, 1.75rem) !important;
  font-weight: 750 !important;
  letter-spacing: -0.03em !important;
  line-height: 1.25 !important;
  color: #fff !important;
  margin: 2.75rem 0 1rem !important;
  padding-top: 0.25rem !important;
}

body.single-post.hl-article-reading .entry-content h3 {
  font-family: "Bricolage Grotesque", ui-sans-serif, system-ui, sans-serif !important;
  font-size: clamp(1.15rem, 3vw, 1.35rem) !important;
  font-weight: 700 !important;
  color: #fff !important;
  margin: 2rem 0 0.75rem !important;
  line-height: 1.35 !important;
}

body.single-post.hl-article-reading .entry-content strong {
  color: #fff !important;
  font-weight: 650 !important;
}

body.single-post.hl-article-reading .entry-content a {
  color: var(--hl-read-accent) !important;
  font-weight: 550 !important;
  text-decoration: underline !important;
  text-decoration-color: rgba(167, 139, 250, 0.45) !important;
  text-underline-offset: 3px !important;
}

body.single-post.hl-article-reading .entry-content a:hover {
  color: #fff !important;
  text-decoration-color: var(--hl-read-accent) !important;
}

body.single-post.hl-article-reading .entry-content ul,
body.single-post.hl-article-reading .entry-content ol {
  margin: 0 0 1.5rem !important;
  padding-left: 1.4rem !important;
}

body.single-post.hl-article-reading .entry-content li {
  margin-bottom: 0.65rem !important;
  color: var(--hl-read-ink) !important;
  padding-left: 0.2rem !important;
}

body.single-post.hl-article-reading .entry-content li::marker {
  color: var(--hl-read-accent) !important;
}

body.single-post.hl-article-reading .entry-content blockquote {
  margin: 2rem 0 !important;
  padding: 1rem 0 1rem 1.15rem !important;
  border-left: 3px solid var(--hl-read-accent) !important;
  border-radius: 0 !important;
  background: transparent !important;
  font-size: 1.05rem !important;
  font-style: italic !important;
  line-height: 1.7 !important;
  color: var(--hl-read-muted) !important;
}

body.single-post.hl-article-reading .entry-content hr {
  border: none !important;
  height: 1px !important;
  background: rgba(255, 255, 255, 0.1) !important;
  margin: 2.75rem 0 !important;
}

body.single-post.hl-article-reading .entry-content img {
  max-width: 100% !important;
  height: auto !important;
  border-radius: 12px !important;
  margin: 1.75rem 0 !important;
}

body.single-post.hl-article-reading .entry-content pre {
  background: rgba(8, 7, 13, 0.85) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 12px !important;
  padding: 1rem 1.15rem !important;
  font-size: 0.88em !important;
  line-height: 1.55 !important;
  overflow-x: auto !important;
  color: #e2e8f0 !important;
}

body.single-post.hl-article-reading .entry-content code {
  font-family: "JetBrains Mono", ui-monospace, monospace !important;
  font-size: 0.88em !important;
  background: rgba(139, 92, 246, 0.12) !important;
  padding: 0.12em 0.35em !important;
  border-radius: 4px !important;
  color: #ddd2ff !important;
}

body.single-post.hl-article-reading .entry-content pre code {
  background: transparent !important;
  padding: 0 !important;
  color: inherit !important;
}

body.single-post.hl-article-reading .hl-article-hero,
body.single-post.hl-article-reading .hl-article-figure {
  max-width: min(920px, 100%) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

body.single-post.hl-article-reading .hl-table-scroll {
  border-radius: 12px !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  background: rgba(255, 255, 255, 0.02) !important;
}

body.single-post.hl-article-reading .entry-content table th {
  color: #fff !important;
  background: rgba(139, 92, 246, 0.12) !important;
}

body.single-post.hl-article-reading .entry-content table td {
  color: var(--hl-read-ink) !important;
}

@media (max-width: 768px) {
  body.single-post.hl-article-reading .entry-content {
    font-size: 1.0625rem !important;
    line-height: 1.78 !important;
  }
}