:root{
  --bg:#0b0a09;--bg-2:#131110;--ink:#f1ebdf;--ink-dim:#b9b0a1;--line:rgba(241,235,223,.14);
  --gold:#c9a24b;--gold-soft:#e0c27a;
  --serif:"Cormorant Garamond",Georgia,serif;
  --sans:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--bg);color:var(--ink);font:400 17px/1.7 var(--sans);-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
.wrap{width:min(1120px,100% - 40px);margin-inline:auto}
.eyebrow{font:500 12px/1 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}
h1,h2{font-family:var(--serif);font-weight:500;line-height:1.08}

.nav{position:sticky;top:0;z-index:50;background:rgba(11,10,9,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{font:600 20px/1 var(--serif);letter-spacing:.14em;text-transform:uppercase;text-decoration:none}
.nav ul{display:flex;gap:28px;list-style:none;align-items:center}
.nav ul a{font:500 12px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;text-decoration:none;color:var(--ink-dim)}
.nav ul a:hover{color:var(--ink)}
.btn{display:inline-block;font:600 12px/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;text-decoration:none;padding:16px 26px;border:1px solid var(--gold);color:var(--ink)}
.btn:hover{background:var(--gold);color:#16110a}
.btn.solid{background:var(--gold);color:#16110a}
.btn.solid:hover{background:var(--gold-soft)}
.nav .btn{padding:11px 18px}
@media(max-width:640px){.nav ul li:not(:last-child){display:none}}

/* post */
.post{max-width:760px;padding:clamp(48px,8vw,96px) 0 clamp(56px,8vw,96px)}
.back{display:inline-block;margin-bottom:34px;font:500 12px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;text-decoration:none;color:var(--ink-dim)}
.back:hover{color:var(--ink)}
.post h1{font-size:clamp(36px,6vw,62px);margin:16px 0 34px}
.prose p{color:var(--ink-dim);font-size:18px;margin-bottom:20px}
.prose p:first-child{color:var(--ink);font-size:20px}
.prose a{color:var(--gold-soft);text-decoration-thickness:1px;text-underline-offset:3px}
.prose figure{margin:34px 0}
.prose figure img{width:100%;background:#1a1714}
.cta{margin:48px 0 0;padding-top:34px;border-top:1px solid var(--line)}
.pn{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:48px;padding-top:30px;border-top:1px solid var(--line)}
.pn a{text-decoration:none;font:500 20px/1.3 var(--serif);color:var(--ink)}
.pn a:hover{color:var(--gold-soft)}
.pn small{display:block;margin-bottom:6px;font:500 10px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
.pn .r{text-align:right}

/* index */
.idx{max-width:860px;padding:clamp(48px,8vw,96px) 0}
.idx h1{font-size:clamp(40px,7vw,72px);margin:14px 0 18px}
.intro{color:var(--ink-dim);max-width:34em;margin-bottom:34px}
.idx h2{font-size:34px;margin:50px 0 14px;color:var(--gold-soft)}
.list{list-style:none;border-top:1px solid var(--line)}
.list a{display:grid;grid-template-columns:150px 1fr;gap:20px;padding:20px 0;border-bottom:1px solid var(--line);text-decoration:none}
.list time{font:500 12px/1.6 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--gold);padding-top:4px}
.list b{display:block;font:500 24px/1.25 var(--serif)}
.list a:hover b{color:var(--gold-soft)}
.list em{display:block;margin-top:6px;font-style:normal;font-size:14px;line-height:1.5;color:var(--ink-dim)}
@media(max-width:640px){.list a{grid-template-columns:1fr;gap:4px}}

footer{border-top:1px solid var(--line);padding:34px 0;font-size:13px;color:var(--ink-dim)}
footer .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
footer a{text-decoration:none;margin-left:18px}
footer a:hover{color:var(--ink)}