/* ═══════════════════════════════════════════════════════════════
   JIFANA — inner templates (page, archive, 404)
   Loaded only when the front page is NOT being shown, so the homepage
   stylesheet stays exactly as audited.

   The homepage reset does two things that are right for a landing page and
   wrong for editorial content: `ul{list-style:none}` strips bullets, and
   `a{color:inherit;text-decoration:none}` makes body links invisible. Editors
   paste real prose into these templates, so both are restored here — scoped to
   .jf-prose, using the tokens already declared in jifana.css.
   ═══════════════════════════════════════════════════════════════ */

.jf-prose{ max-width:720px; color:var(--bone-muted); font-size:1.02rem; line-height:1.75; }

.jf-prose > * + *{ margin-top:1.15em; }

.jf-prose h2,
.jf-prose h3,
.jf-prose h4{
  font-family:var(--f-display); font-weight:400; color:var(--bone);
  line-height:1.12; letter-spacing:-.012em;
  margin-top:2em; margin-bottom:.5em;
}
.jf-prose h2{ font-size:clamp(1.7rem,2.4vw,2.2rem); }
.jf-prose h3{ font-size:clamp(1.3rem,1.7vw,1.55rem); }
.jf-prose h4{
  font-family:var(--f-ui); font-weight:600; font-size:1.02rem; letter-spacing:0;
}

.jf-prose a{
  color:var(--ember); text-decoration:underline; text-underline-offset:3px;
  text-decoration-thickness:1px; transition:color .2s var(--ease);
}
.jf-prose a:hover{ color:var(--ember-soft); }

.jf-prose strong{ color:var(--bone-dim); font-weight:600; }
.jf-prose em{ font-style:italic; }

.jf-prose ul,
.jf-prose ol{ padding-left:1.35em; }
.jf-prose ul{ list-style:disc; }
.jf-prose ol{ list-style:decimal; }
.jf-prose li{ margin-top:.45em; }
.jf-prose li::marker{ color:var(--ember); }

.jf-prose blockquote{
  border-left:2px solid var(--ember);
  padding:2px 0 2px 22px; margin-left:0;
  font-family:var(--f-display); font-size:1.28rem; line-height:1.45; color:var(--bone-dim);
}

.jf-prose code{
  font-family:var(--f-mono); font-size:.86em; color:var(--arcane);
  background:var(--ink-850); border:1px solid var(--ink-700);
  border-radius:6px; padding:2px 6px;
}
.jf-prose pre{
  background:var(--ink-850); border:1px solid var(--ink-700);
  border-radius:var(--r-md); padding:20px 22px; overflow-x:auto;
}
.jf-prose pre code{ background:none; border:none; padding:0; color:var(--bone-dim); }

.jf-prose img,
.jf-prose figure img{ border-radius:var(--r-md); border:1px solid var(--ink-700); }
.jf-prose figcaption{
  font-family:var(--f-mono); font-size:.66rem; letter-spacing:.1em;
  text-transform:uppercase; color:var(--ink-500); margin-top:10px;
}

.jf-prose hr{ border:none; border-top:1px solid var(--ink-700); margin:2.4em 0; }

.jf-prose table{ width:100%; border-collapse:collapse; font-size:.92rem; }
.jf-prose th,
.jf-prose td{ text-align:left; padding:11px 14px; border-bottom:1px solid var(--ink-800); }
.jf-prose th{
  font-family:var(--f-mono); font-size:.62rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--ink-500); font-weight:400;
}

/* An inner page has no hero, so the fixed header needs breathing room above
   the first heading. Matches the homepage's section rhythm rather than inventing one. */
.jf-inner{ padding-top:190px; }
@media (max-width:900px){ .jf-inner{ padding-top:140px; } }

/* Post list reuses the homepage's system-card component verbatim. */
.jf-post{ display:block; }
.jf-post b{ font-family:var(--f-display); font-weight:400; font-size:1.35rem;
  line-height:1.15; letter-spacing:-.01em; color:var(--bone); margin-bottom:8px; display:block; }
.jf-post i{ font-style:normal; font-family:var(--f-mono); font-size:.6rem;
  letter-spacing:.14em; text-transform:uppercase; color:var(--ember); display:block; margin-bottom:12px; }