/* ============================================================
   nourredine.tech — reader
   Long-form reading surface for the book section.
   Serif body, one column, nothing that competes with the text.
   ============================================================ */

:root{
  --serif:"Source Serif 4","Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;
  --read-measure:68ch;
}

.reader-shell{padding:38px 0 0}
.reader-shell .wrap{max-width:940px}

.chapter-head{margin:34px 0 0;padding-bottom:26px;border-bottom:1px solid var(--line)}
.chapter-head .part{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--cyan);margin-bottom:14px;display:block;
}
.chapter-head h1{
  font-family:var(--font);font-size:clamp(1.7rem,3.4vw,2.45rem);line-height:1.12;
  letter-spacing:-.035em;margin:0;max-width:26ch;font-weight:750;
}
.chapter-head .meta{
  display:flex;gap:16px;flex-wrap:wrap;margin-top:16px;
  font-family:var(--mono);font-size:11.5px;color:var(--text-4);
}

.read-body{
  font-family:var(--serif);
  font-size:19.5px;
  line-height:1.78;
  color:#d3dae8;
  max-width:var(--read-measure);
  margin:34px 0 0;
  text-rendering:optimizeLegibility;
  hyphens:auto;
}
.read-body > p{margin:0 0 1.05em}
.read-body > p + p{margin-top:0}
.read-body h2,.read-body h3{
  font-family:var(--font);letter-spacing:-.02em;color:#fff;
  margin:2.1em 0 .55em;line-height:1.25;
}
.read-body h2{font-size:1.35rem;font-weight:700}
.read-body h3{font-size:1.1rem;font-weight:650;color:var(--text)}

/* first paragraph of a chapter: editorial drop cap */
.read-body > p:first-of-type::first-letter{
  float:left;font-size:3.5em;line-height:.86;padding:.06em .12em 0 0;
  font-weight:600;color:var(--cyan);
}

.read-body blockquote{
  margin:1.6em 0;padding:.2em 0 .2em 1.2em;border-left:2px solid rgba(65,224,208,.5);
  font-style:italic;color:#c9d2e2;background:none;border-radius:0;
}
.read-body blockquote p{margin:0}
.read-body em{font-style:italic}
.read-body strong{font-weight:650;color:#fff}
.read-body a{color:var(--cyan);border-bottom:1px solid rgba(65,224,208,.3)}

.read-body figure{margin:2em 0}
.read-body figure img{
  border-radius:4px;border:1px solid var(--line);background:#0a0d14;width:100%;height:auto;
}
.read-body figcaption{
  font-family:var(--font);font-size:12.5px;color:var(--text-4);margin-top:9px;
  padding-left:0;border-left:0;line-height:1.5;
}

/* scene break inside a chapter */
.read-body hr{border:0;height:1.6em;margin:1.6em 0;background:none;position:relative}
.read-body hr::after{
  content:"· · ·";position:absolute;left:0;right:0;top:0;text-align:center;
  color:var(--text-4);letter-spacing:.4em;font-size:14px;
}

/* reading progress */
#read-progress{position:fixed;top:0;left:0;height:2px;background:var(--grad);width:0;z-index:99}

.chapter-foot{
  margin:56px 0 0;padding-top:28px;border-top:1px solid var(--line);
  display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;align-items:center;
}
.chapter-foot .next-chapter{
  display:flex;flex-direction:column;gap:3px;padding:16px 20px;border-radius:var(--r-sm);
  border:1px solid var(--line);background:rgba(255,255,255,.025);transition:.18s;min-width:230px;
}
.chapter-foot .next-chapter:hover{border-color:var(--line-strong);background:rgba(255,255,255,.06)}
.chapter-foot .k{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-4)}
.chapter-foot .t{font-size:14.5px;color:var(--text);font-weight:600}

@media(max-width:760px){
  .read-body{font-size:17.5px;line-height:1.72}
  .read-body > p:first-of-type::first-letter{font-size:3em}
  .chapter-foot{flex-direction:column;align-items:stretch}
}