/* ==========================================================================
   INARS Consulting - article typography
   --------------------------------------------------------------------------
   The theme sets h2:44px and h3:30px, which are display sizes intended for
   landing sections. Against 17px body copy that is a 2.6x jump, so every
   heading in an article reads like a billboard and the hierarchy collapses.

   This file rescopes headings, measure and rhythm for long-form reading and
   applies ONLY inside article.type-post .entry-content, so landing pages keep their display type.

   Scale: 1.25 ratio from a 17px base   17 -> 21 -> 27
   Rhythm: 8pt grid
   ========================================================================== */

.type-post .entry-content {
  --art-measure: 68ch;
  --art-body: clamp(16.5px, 16px + 0.15vw, 17.5px);
  --art-h2: clamp(23px, 20px + 0.85vw, 28px);
  --art-h3: clamp(19px, 17.5px + 0.4vw, 21px);
  --art-h4: clamp(17px, 16.5px + 0.2vw, 18px);
  --art-lead: clamp(18px, 17px + 0.35vw, 19.5px);

  --art-ink: var(--themeht-title-color, #14181d);
  --art-body-ink: var(--themeht-body-color, #55606b);
  --art-accent: var(--themeht-primary-color, #ff5c00);
  --art-rule: rgba(20, 24, 29, .10);
  --art-soft: rgba(20, 24, 29, .035);

  font-size: var(--art-body);
  line-height: 1.75;
}

/* ---------- measure ---------------------------------------------------- */
.type-post .entry-content p,
.type-post .entry-content ul,
.type-post .entry-content ol,
.type-post .entry-content blockquote,
.type-post .entry-content h2,
.type-post .entry-content h3,
.type-post .entry-content h4 {
  max-width: var(--art-measure);
}

/* ---------- headings --------------------------------------------------- */
.type-post .entry-content h2,
.type-post .entry-content h3,
.type-post .entry-content h4 {
  color: var(--art-ink);
  text-wrap: balance;
  letter-spacing: -.012em;
}

.type-post .entry-content h2 {
  font-size: var(--art-h2);
  line-height: 1.28;
  font-weight: 650;
  margin: 48px 0 12px;
  padding-top: 16px;
  border-top: 1px solid var(--art-rule);
}
.type-post .entry-content h2:first-child { margin-top: 0; padding-top: 0; border-top: 0; }

.type-post .entry-content h3 {
  font-size: var(--art-h3);
  line-height: 1.4;
  font-weight: 640;
  margin: 32px 0 8px;
}

.type-post .entry-content h4 {
  font-size: var(--art-h4);
  line-height: 1.45;
  font-weight: 640;
  margin: 24px 0 8px;
}

/* ---------- body copy -------------------------------------------------- */
.type-post .entry-content p {
  margin: 0 0 20px;
  color: var(--art-body-ink);
  text-wrap: pretty;
  overflow-wrap: break-word;
}

/* opening paragraph carries slightly more presence */
.type-post .entry-content > p:first-of-type,
.type-post .entry-content .elementor-widget-container > p:first-child {
  font-size: var(--art-lead);
  line-height: 1.68;
}

.type-post .entry-content strong { font-weight: 640; color: var(--art-ink); }
.type-post .entry-content em { font-style: italic; }

/* ---------- links in prose --------------------------------------------- */
.type-post .entry-content p > a,
.type-post .entry-content li > a {
  color: var(--art-accent);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  text-decoration-color: rgba(255, 92, 0, .38);
  transition: text-decoration-color .15s ease;
}
.type-post .entry-content p > a:hover,
.type-post .entry-content li > a:hover { text-decoration-color: currentColor; }

/* ---------- lists ------------------------------------------------------ */
.type-post .entry-content ul,
.type-post .entry-content ol {
  margin: 0 0 22px;
  padding-left: 22px;
}
.type-post .entry-content li {
  margin-bottom: 10px;
  color: var(--art-body-ink);
  padding-left: 4px;
}
.type-post .entry-content li:last-child { margin-bottom: 0; }
.type-post .entry-content li > strong:first-child { color: var(--art-ink); }

.type-post .entry-content ul > li::marker { color: var(--art-accent); }
.type-post .entry-content ol > li::marker { color: var(--art-accent); font-weight: 650; }

/* nested lists tighten up */
.type-post .entry-content li > ul,
.type-post .entry-content li > ol { margin: 10px 0 0; }

/* ---------- blockquote ------------------------------------------------- */
.type-post .entry-content blockquote {
  margin: 28px 0;
  padding: 4px 0 4px 20px;
  border-left: 3px solid var(--art-accent);
  font-size: var(--art-lead);
  line-height: 1.6;
  color: var(--art-ink);
}
.type-post .entry-content blockquote p:last-child { margin-bottom: 0; }

/* ---------- tables ----------------------------------------------------- */
.type-post .entry-content .table-wrap { overflow-x: auto; margin: 24px 0; }
.type-post .entry-content table {
  border-collapse: collapse;
  width: 100%;
  font-size: 15.5px;
  margin: 24px 0;
}
.type-post .entry-content th,
.type-post .entry-content td {
  text-align: left;
  padding: 10px 14px;
  border-bottom: 1px solid var(--art-rule);
  vertical-align: top;
}
.type-post .entry-content thead th {
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--art-body-ink);
  background: var(--art-soft);
}

/* ---------- figures & images ------------------------------------------- */
.type-post .entry-content img { max-width: 100%; height: auto; border-radius: 10px; }
.type-post .entry-content figure { margin: 28px 0; }
.type-post .entry-content figcaption {
  font-size: 14px;
  color: var(--art-body-ink);
  margin-top: 8px;
}

/* ---------- code ------------------------------------------------------- */
.type-post .entry-content code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .88em;
  background: var(--art-soft);
  border: 1px solid var(--art-rule);
  border-radius: 4px;
  padding: 1px 5px;
}

/* ---------- drop cap ----------------------------------------------------
   The theme styles .ht-first-letter::first-letter on the wrapper div. Any
   ::first-letter rule on the inner <p> supersedes it for that letter, so the
   full treatment is restated here rather than partially overridden - tuned
   down from the theme's 65px to sit against the new 17px body scale.        */
.type-post .entry-content .ht-first-letter > .elementor-widget-container > p:first-child::first-letter {
  font-size: 52px;
  line-height: .92;
  display: inline-block;
  float: left;
  font-weight: 650;
  margin: 4px 10px 0 0;
  color: var(--art-accent);
  font-family: var(--themeht-typography-secondary-font-family, inherit);
}

/* ---------- small screens ---------------------------------------------- */
@media (max-width: 767px) {
  .type-post .entry-content h2 { margin-top: 36px; padding-top: 14px; }
  .type-post .entry-content h3 { margin-top: 26px; }
  .type-post .entry-content p  { margin-bottom: 18px; }
}
