@import url("https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,600;12..96,700&family=Instrument+Sans:wght@400;500;600&family=JetBrains+Mono:wght@400;500&display=swap");

:root{
  --felt:#0A1E1C; --bone:#ECE6D9; --sage:#8FA09B; --sage-dim:#5E7A74;
  --brass:#D7A343; --rule:rgba(236,230,217,.12);
  --display:"Bricolage Grotesque",sans-serif;
  --body:"Instrument Sans",sans-serif;
  --mono:"JetBrains Mono",ui-monospace,monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--felt);color:var(--bone);font-family:var(--body);font-size:16px;line-height:1.7;-webkit-font-smoothing:antialiased}
.wrap{max-width:760px;margin:0 auto;padding:0 clamp(20px,5vw,40px)}

.top{border-bottom:1px solid var(--rule);padding:20px 0}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;max-width:1180px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.brand svg{width:22px;height:22px}
.brand span{font-family:var(--display);font-weight:700;font-size:16px;letter-spacing:-.01em}
.brand span i{color:var(--brass);font-style:normal}
.back{font-family:var(--mono);font-size:12px;color:var(--sage);text-decoration:none;letter-spacing:.06em}
.back:hover{color:var(--brass)}

main{padding:70px 0 100px}
.eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--sage-dim)}
h1{font-family:var(--display);font-weight:700;font-size:clamp(30px,5vw,44px);line-height:1.05;letter-spacing:-.025em;margin:14px 0 36px}
h2{font-family:var(--display);font-weight:600;font-size:20px;letter-spacing:-.01em;margin:44px 0 12px;padding-top:26px;border-top:1px solid var(--rule)}
h2:first-of-type{border-top:0;padding-top:0;margin-top:0}
p,li{color:var(--sage);margin-bottom:12px}
ul{padding-left:20px}
li{margin-bottom:6px}
strong{color:var(--bone);font-weight:600}
a{color:var(--brass)}
.updated{font-family:var(--mono);font-size:11px;color:var(--sage-dim);letter-spacing:.06em;margin-top:50px;padding-top:22px;border-top:1px solid var(--rule)}
:focus-visible{outline:2px solid var(--brass);outline-offset:2px}
