:root{
  --bg:#000;--ink:#F0F0F0;--ink2:#b4b4b4;--dim:#6e6e6e;
  --line:rgba(240,240,240,.16);
  --light:#F0F0F0;--onlight:#0a0a0a;--onlight2:#4a4a4a;--lightline:#d0d0d0;
  --sans:"Montserrat",system-ui,sans-serif;--serif:"Newsreader",Georgia,serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--serif);line-height:1.62;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}

.nav{display:flex;align-items:center;justify-content:space-between;padding:20px 30px;border-bottom:1px solid var(--line);
  position:sticky;top:0;background:rgba(0,0,0,.86);backdrop-filter:blur(8px);z-index:10}
.nav .brand{display:flex;align-items:center;gap:13px;text-decoration:none}
.nav .brand img{height:19px;filter:brightness(0) invert(1)}
.nav .brand .div{width:1px;height:20px;background:var(--line)}
.nav .brand b{font-family:var(--sans);font-weight:700;font-size:13px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink2)}
.nav .links{display:flex;gap:26px;font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.05em;text-transform:uppercase}
.nav .links a{color:var(--dim);text-decoration:none}
.nav .links a:hover{color:var(--ink)}
@media(max-width:640px){.nav .links{display:none}.nav{padding:15px 18px}}

/* article page */
.apage{max-width:720px;margin:0 auto;padding:0 24px}
.back{display:inline-flex;align-items:center;gap:8px;font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.08em;
  text-transform:uppercase;color:var(--dim);text-decoration:none;margin:34px 0 0}
.back:hover{color:var(--ink)}
.ahead{padding:26px 0 8px;border-bottom:1px solid var(--line);margin-bottom:0}
.ahead .tag{font-family:var(--sans);font-size:11px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--ink2);
  display:flex;align-items:center;gap:12px;margin-bottom:20px}
.ahead .tag::before{content:"";width:34px;height:1px;background:var(--ink)}
.ahead h1{font-family:var(--sans);font-weight:800;font-size:clamp(30px,5vw,46px);line-height:1.06;margin:0 0 18px;letter-spacing:-.02em;text-wrap:balance}
.ahead .lead{font-size:20px;color:var(--ink2);margin:0 0 26px;line-height:1.5}
.ahead .meta{font-family:var(--sans);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--dim);
  display:flex;gap:20px;flex-wrap:wrap;padding-bottom:22px}
.ahead .meta b{color:var(--ink2);font-weight:600}

article{padding:38px 0 10px;font-size:19px}
article p{margin:0 0 24px;color:#dcdcdc}
article h2{font-family:var(--sans);font-weight:800;font-size:15px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink);
  margin:44px 0 18px;padding-bottom:12px;border-bottom:1px solid var(--line)}
article strong{color:#fff;font-weight:600}
article ul{margin:0 0 24px;padding-left:20px;color:#dcdcdc}
article li{margin:0 0 10px}
.drop::first-letter{font-family:var(--sans);font-weight:800;font-size:70px;float:left;line-height:.78;margin:8px 14px 0 0;color:#fff}
blockquote{margin:36px 0;padding:8px 0 8px 26px;border-left:2px solid var(--ink);
  font-family:var(--sans);font-weight:700;font-size:24px;line-height:1.32;color:#fff;letter-spacing:-.01em}
.pullnote{background:#0b0b0b;border:1px solid var(--line);border-left:3px solid var(--ink);border-radius:2px;padding:20px 22px;margin:30px 0;
  font-size:16px;color:var(--ink2)}
.pullnote b{color:#fff}

.aend{border-top:1px solid var(--line);margin-top:36px;padding:26px 0 8px;font-family:var(--sans);font-size:12px;
  letter-spacing:.06em;text-transform:uppercase;color:var(--dim)}
.aend a{color:var(--ink);text-decoration:none}

/* related / cta */
.cta{background:#000;border-top:1px solid var(--line);margin-top:40px}
.cta .in{max-width:720px;margin:0 auto;padding:52px 24px;text-align:center}
.cta h3{font-family:var(--sans);font-weight:800;font-size:clamp(22px,3.4vw,28px);margin:0 0 10px;color:#fff;letter-spacing:-.01em}
.cta p{margin:0 0 22px;color:var(--ink2);font-family:var(--sans);font-size:14px;letter-spacing:.06em;text-transform:uppercase}
.cta a{display:inline-block;font-family:var(--sans);font-weight:700;font-size:13px;letter-spacing:.1em;text-transform:uppercase;
  color:#000;text-decoration:none;background:var(--ink);padding:14px 28px;border-radius:2px;transition:.15s}
.cta a:hover{background:#fff}
.cta a+a{margin-left:10px}
.cta a.ghost{background:transparent;color:var(--ink);border:1px solid var(--line)}
.cta a.ghost:hover{background:rgba(255,255,255,.06)}
@media(max-width:560px){.cta a{display:block;margin:0 auto 10px}.cta a+a{margin-left:auto}}

footer{background:#000;padding:40px 24px;text-align:center;font-family:var(--sans);font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--dim);border-top:1px solid var(--line)}
footer img{height:22px;margin:0 auto 16px;filter:brightness(0) invert(1);opacity:.9}
