/* LEADR blog: dark dungeon, tuned for reading */
:root{
  --bg:#100b07; --paper:#1d1610; --paper-2:#261d14; --line:#2a2018;
  --ink:#f4ede1; --ink-soft:#cabfae; --muted:#9b8f7c;
  --red:#b3201f; --red-li:#e0473d; --green:#21f36a; --gold:#f5c518; --yellow:#f5c518;
  --mono:"SF Mono", ui-monospace, Menlo, Consolas, monospace;
}
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  margin:0; color:var(--ink-soft); background:var(--bg);
  font-family:"Schibsted Grotesk", ui-sans-serif, system-ui, sans-serif;
  font-size:1.0625rem; line-height:1.72; -webkit-font-smoothing:antialiased;
}
body::before{
  content:""; position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:radial-gradient(120% 60% at 50% -8%, rgba(255,150,70,0.10), transparent 56%);
}
a{ color:var(--gold); text-decoration:none; }
a:hover{ text-decoration:underline; }

.topbar{
  position:sticky; top:0; z-index:10;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:13px clamp(18px,5vw,40px); border-bottom:1px solid #000;
  background:linear-gradient(180deg, rgba(35,26,18,0.92), rgba(16,11,7,0.86)); backdrop-filter:blur(6px);
}
.topbar .brand img{ display:block; height:28px; width:auto; filter:drop-shadow(0 2px 4px rgba(0,0,0,0.6)); }
.topbar .back{ font-size:12px; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:var(--ink-soft); }
.topbar .back:hover{ color:var(--gold); text-decoration:none; }

.wrap{ max-width:720px; margin:0 auto; padding:clamp(38px,6vw,66px) clamp(20px,5vw,32px) 40px; }
.kicker{ margin:0 0 14px; font-size:12px; font-weight:800; letter-spacing:0.22em; text-transform:uppercase; color:var(--gold); }
h1{ margin:0 0 14px; font-family:"Cinzel", serif; font-weight:700; font-size:clamp(30px,4.8vw,48px); line-height:1.06; color:var(--ink); text-shadow:0 1px 0 #000, 0 0 26px rgba(255,140,60,0.14); }
.lede{ margin:0 0 6px; font-size:clamp(17px,1.9vw,19px); color:var(--ink-soft); }
.post-meta{ font-family:var(--mono); font-size:13px; color:var(--muted); letter-spacing:0.02em; }

article{ margin-top:30px; }
article h2{ margin:40px 0 12px; font-size:clamp(20px,2.5vw,25px); font-weight:800; color:var(--ink); letter-spacing:-0.01em; }
article p{ margin:0 0 18px; }
article ul{ margin:0 0 18px; padding:0; list-style:none; }
article li{ position:relative; padding:4px 0 4px 22px; margin:0 0 4px; }
article li::before{ content:""; position:absolute; left:2px; top:14px; width:7px; height:7px; background:var(--green); box-shadow:0 0 6px rgba(33,243,106,0.5); }
article b, article strong{ color:var(--ink); font-weight:700; }

.cta-row{ margin:40px 0 0; padding:22px 24px; background:var(--paper-2); border:1px solid var(--line); }
.cta-row p{ margin:0 0 14px; color:var(--ink-soft); }
.btn{ display:inline-block; background:var(--red); color:#fff; font-weight:700; letter-spacing:0.02em; padding:11px 22px; border:2px solid #000; box-shadow:3px 3px 0 #000; }
.btn:hover{ text-decoration:none; filter:brightness(1.07); }

.backlink{ display:inline-block; margin-top:42px; font-size:14px; font-weight:700; letter-spacing:0.04em; color:var(--muted); }
.backlink:hover{ color:var(--gold); text-decoration:none; }

/* index list */
.post-list{ list-style:none; margin:30px 0 0; padding:0; }
.post-list li{ border-top:1px solid var(--line); }
.post-list li:last-child{ border-bottom:1px solid var(--line); }
.post-list a{ display:block; padding:24px 6px; color:var(--ink-soft); }
.post-list a:hover{ text-decoration:none; background:rgba(255,255,255,0.02); }
.post-list .d{ display:block; margin-bottom:8px; font-family:var(--mono); font-size:12px; color:var(--muted); }
.post-list h2{ margin:0 0 6px; font-family:"Cinzel", serif; font-weight:700; font-size:clamp(20px,2.6vw,26px); color:var(--ink); }
.post-list a:hover h2{ color:var(--gold); }
.post-list .ex{ margin:0; color:var(--muted); font-size:0.98rem; }

footer{
  margin-top:56px; padding:18px 24px; text-align:center;
  background:linear-gradient(180deg, var(--red-li) 0 2px, var(--red) 2px 100%); border-top:3px solid #000;
  font-size:11px; color:#fff; letter-spacing:0.06em; text-transform:uppercase;
}
footer .links{ display:inline-flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-bottom:8px; font-weight:700; }
footer .links a{ color:var(--yellow); }
footer .links a:hover{ color:#fff; }
footer .sep{ color:var(--red-li); }
footer .copy{ color:#ffd9d2; text-shadow:1px 1px 0 var(--red); }
