:root{
  --bg:#171410; --bg2:#100e0b; --panel:#201c16; --line:#2e2820;
  --text:#e8e2d4; --muted:#a29a87; --gold:#d4a017; --gold-soft:rgba(212,160,23,.14);
  --serif:"Newsreader","Iowan Old Style",Georgia,serif;
  --sans:"Inter Tight",-apple-system,system-ui,sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font-family:var(--sans);line-height:1.6;min-height:100dvh;display:flex;flex-direction:column}
::selection{background:rgba(212,160,23,.3)}
h1,h2,h3,.serif{font-family:var(--serif);font-weight:500;letter-spacing:-.015em;text-wrap:balance}
p{text-wrap:pretty}
a{color:inherit}
.wrap{max-width:1200px;margin:0 auto;padding:0 clamp(20px,4vw,48px)}

/* nav */
nav{position:fixed;top:0;left:0;right:0;z-index:50;height:68px;display:flex;align-items:center;
  background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line)}
nav .wrap{width:100%;display:flex;align-items:center;justify-content:space-between}
.brand{font-family:var(--serif);font-size:1.15rem;color:var(--text);text-decoration:none}
.brand b{color:var(--gold);font-weight:500}
.nav-links{display:flex;align-items:center;gap:22px}
.nav-link{font-size:.9rem;color:var(--muted);text-decoration:none;transition:color .2s}
.nav-link:hover{color:var(--text)}
.nav-cta{font-size:.9rem;font-weight:500;text-decoration:none;color:var(--bg);background:var(--gold);
  padding:9px 20px;border-radius:999px;transition:transform .2s,background .2s}
.nav-cta:hover{transform:translateY(-1px);background:#c89518}
.nav-cta:active{transform:scale(.98)}

/* reading column */
main{flex:1;padding:calc(68px + clamp(3rem,7vw,5.5rem)) 0 clamp(3rem,7vw,5rem)}
.reading{max-width:720px;margin:0 auto;padding:0 clamp(20px,4vw,48px)}
.eyebrow{font-size:.72rem;text-transform:uppercase;letter-spacing:.16em;color:var(--gold);margin-bottom:1rem}
.page-title{font-size:clamp(2.2rem,5.5vw,3.4rem);line-height:1.08;margin-bottom:.8rem}
.page-lede{color:var(--muted);font-size:1.1rem;max-width:58ch}
.post-meta{color:var(--muted);font-size:.9rem;margin-bottom:1rem}
.back{display:inline-block;font-size:.9rem;color:var(--muted);text-decoration:none;margin-bottom:2rem;transition:color .2s}
.back:hover{color:var(--gold)}

/* article list cards */
.cards{display:grid;gap:1.2rem;margin-top:2.8rem}
.card{display:block;background:var(--panel);border:1px solid var(--line);border-radius:14px;
  padding:1.7rem 1.9rem;text-decoration:none;transition:border-color .2s,transform .2s}
.card:hover{border-color:var(--gold);transform:translateY(-2px)}
.card time{color:var(--gold);font-size:.78rem;text-transform:uppercase;letter-spacing:.12em}
.card h2{font-size:1.45rem;margin:.45rem 0 .5rem;line-height:1.2}
.card p{color:var(--muted);font-size:.98rem}

/* post body */
.post-body{font-family:var(--serif);font-size:17.5px;line-height:1.75;margin-top:2.4rem}
.post-body p{margin:0 0 1.3em}
.post-body h2{font-size:1.7rem;margin:2em 0 .7em;line-height:1.2}
.post-body h3{font-size:1.35rem;margin:1.7em 0 .6em}
.post-body a{color:var(--gold);text-decoration:underline;text-underline-offset:3px}
.post-body strong{font-weight:600}
.post-body blockquote{border-left:2px solid var(--gold);padding-left:1.2rem;margin:0 0 1.3em;
  font-style:italic;color:var(--muted)}
.post-body blockquote p{margin:0}
.post-body ul,.post-body ol{margin:0 0 1.3em 1.4rem}
.post-body li{margin-bottom:.45em}

/* newsletter */
.newsletter{border-top:1px solid var(--line);margin-top:4rem;padding-top:2.8rem}
.newsletter h2{font-size:1.5rem;margin-bottom:.5rem}
.newsletter .nl-lede{color:var(--muted);margin-bottom:1.6rem;font-size:.98rem}
.frow{display:flex;flex-direction:column;gap:8px;margin-bottom:1rem;max-width:440px}
.frow label{font-size:.85rem;color:var(--muted)}
.frow input{background:var(--bg2);border:1px solid var(--line);border-radius:10px;
  padding:12px 14px;color:var(--text);font:inherit;font-size:1rem;transition:border-color .2s}
.frow input:focus{outline:2px solid var(--gold);outline-offset:1px;border-color:var(--gold)}
.hp{position:absolute;left:-9999px}
.nl-note{min-height:1.4em;font-size:.92rem;margin:0 0 1rem;color:var(--muted)}
.nl-note.err{color:#e08f6a}
.nl-note.ok{color:var(--gold)}
.btn{display:inline-block;border:none;cursor:pointer;text-decoration:none;font-weight:500;font-size:1rem;
  font-family:var(--sans);border-radius:999px;padding:13px 28px;transition:transform .2s,background .2s}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:scale(.98)}
.btn:disabled{opacity:.6;cursor:default;transform:none}
.btn:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.btn-gold{background:var(--gold);color:#171410}
.btn-gold:hover{background:#c89518}

footer{border-top:1px solid var(--line);padding:2.4rem 0;color:var(--muted);font-size:.85rem}
footer .wrap{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}
footer a{color:var(--gold)}

@media (max-width:520px){
  .nav-links{gap:14px}
  .nav-cta{padding:8px 14px}
}