:root{
  --bg:#FBF7F0; --paper:#FFFFFF; --ink:#1E1A17; --ink-2:#4A433D; --ink-3:#8A817A;
  --line:#E8E0D4; --accent:#D2481E; --accent-soft:#FBE3D9; --green:#2F7D5B; --green-soft:#DDF0E6;
  --amber:#B7791F; --amber-soft:#FBEFD5;
  --display:'Bricolage Grotesque',system-ui,sans-serif; --sans:'DM Sans',system-ui,sans-serif; --mono:'JetBrains Mono',ui-monospace,monospace;
  --r:18px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.65;letter-spacing:0;-webkit-font-smoothing:antialiased}
a{color:inherit}
img{max-width:100%}
.wrap{max-width:760px;margin:0 auto;padding:0 22px}
.wide{max-width:1040px}

/* top bar */
.top{position:sticky;top:0;z-index:20;background:none;border:0;transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.top.away{transform:translateY(-120%)}

.top .wrap{display:flex;align-items:center;justify-content:space-between;height:72px}
.top .wrap{position:relative}