/* ============================================================
   Heretic Research — shared visual system
   Extracted from site/index.html (single source of truth).
   Reused by report article pages under /reports/**.
   index.html keeps its own inline copy for now.
   ============================================================ */

:root{
  --ink:#0A0A0A;
  --charcoal:#2B2B2B;
  --ivory:#F2F0EA;
  --red:#9B1916;
  --red-bright:#B3221E;
  --gold:#C8B37A;
  --grey:#6B675E;
  --serif-en:"Newsreader",Georgia,serif;
  --serif-zh:"Noto Serif SC","Songti SC",serif;
  --mono:"Space Mono",ui-monospace,monospace;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:hidden}
body{
  background:var(--ivory);
  color:var(--ink);
  font-family:var(--serif-en),var(--serif-zh);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
body.lang-zh{font-family:var(--serif-zh)}
body.lang-en{font-family:var(--serif-en)}

/* ---------- section frame ---------- */
.section{max-width:1280px;margin:0 auto;padding:0 40px}
.rule{border:none;border-top:1px solid var(--ink);margin:0 auto}

/* ---------- mono issue label (ink chip) ---------- */
.issue-label{
  display:inline-block;
  font-family:var(--mono);font-size:11px;letter-spacing:.26em;font-weight:700;
  background:var(--ink);color:var(--ivory);
  padding:9px 16px;
}

/* ---------- buttons ---------- */
.btn{
  display:flex;align-items:center;justify-content:center;gap:7px;
  height:50px;padding:0 14px;
  font-family:var(--mono);font-size:12.5px;letter-spacing:.08em;line-height:1;
  text-decoration:none;border:1px solid var(--ink);transition:all .18s ease;
  white-space:nowrap;color:var(--ink);
}
.btn .arrow{font-size:13px;flex:none}
.btn-primary{background:var(--ink);color:var(--ivory)}
.btn-primary:hover{background:var(--red);border-color:var(--red)}
.btn-ghost:hover{background:var(--ink);color:var(--ivory)}
.btn-red{background:var(--red);border-color:var(--red);color:var(--ivory)}
.btn-red:hover{background:#7E1412;border-color:#7E1412}

/* ---------- inline red link ---------- */
.link-red{color:var(--red);text-decoration:none;border-bottom:1px solid var(--red)}
.reddot{color:var(--red)}

/* ---------- brand footer (dark) ---------- */
.hr-footer{background:var(--ink);color:var(--ivory);margin-top:40px}
.hr-footer .foot-inner{max-width:1280px;margin:0 auto;padding:90px 40px 60px}
.hr-footer .promise{font-size:clamp(22px,2.6vw,32px);line-height:1.6;max-width:30em}
body.lang-en .hr-footer .promise{font-family:var(--serif-en);font-style:italic;font-weight:400}
.hr-footer .tagline{margin-top:34px;font-family:var(--mono);font-size:13px;letter-spacing:.16em;color:rgba(242,240,234,.65)}
.hr-footer .tagline .reddot{color:var(--red);font-size:15px}
.hr-footer .foot-bottom{margin-top:80px;padding-top:26px;border-top:1px solid rgba(242,240,234,.18);display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:center;font-family:var(--mono);font-size:11.5px;letter-spacing:.2em;color:rgba(242,240,234,.55)}
.hr-footer .foot-bottom img{height:34px;opacity:.9}

@media (max-width:900px){
  .section{padding:0 22px}
  .hr-footer .foot-inner{padding:70px 22px 50px}
}
