/* Field notes — JOB DOCKET theme (matches DESIGN.md palette) */
:root{
  --bg:#F8F4F1; --ink:#231D19; --ink-2:#5f564f; --orange:#BB5417; --orange-ink:#923800;
  --rule:#d9d2ca; --card:#ffffff;
  --display:'Bitter',Georgia,serif;
  --body:'Public Sans',-apple-system,system-ui,sans-serif;
  --mono:'Red Hat Mono',ui-monospace,monospace;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body);line-height:1.65;font-size:1.02rem}
.topbar{position:sticky;top:0;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--rule);z-index:10}
.topbar .wrap{display:flex;align-items:center;gap:20px;max-width:760px;margin:0 auto;padding:14px 24px}
.topbar a{text-decoration:none;color:var(--ink-2);font-size:.88rem;font-weight:500}
.topbar a:hover{color:var(--ink)}
.topbar .brand{font-family:var(--display);font-weight:800;color:var(--ink);font-size:1.05rem}
.topbar .cta{margin-left:auto;font-family:var(--mono);font-size:.76rem;font-weight:600;color:var(--ink);border:1.5px solid var(--ink);padding:7px 12px;border-radius:3px;white-space:nowrap}
.topbar .cta:hover{background:var(--orange);border-color:var(--orange);color:#fff}
main{max-width:760px;margin:0 auto;padding:48px 24px 80px}
.eyebrow{font-family:var(--mono);font-size:.76rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--orange-ink)}
h1{font-family:var(--display);font-size:clamp(1.7rem,4.5vw,2.5rem);line-height:1.15;margin:.35em 0 .5em}
h2{font-family:var(--display);font-size:1.35rem;margin:2em 0 .6em}
h3{font-family:var(--display);font-size:1.08rem;margin:1.6em 0 .5em}
.meta{color:var(--ink-2);font-size:.9rem;margin-bottom:2em}
a{color:var(--orange-ink)}
code{font-family:var(--mono);font-size:.86em;background:#efe9e3;padding:.12em .35em;border-radius:3px}
pre{background:#2b2420;color:#f3ede7;padding:18px 20px;border-radius:6px;overflow-x:auto;font-size:.85rem;line-height:1.55}
pre code{background:none;padding:0;color:inherit}
table{border-collapse:collapse;width:100%;font-size:.92rem;margin:1.2em 0}
th,td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--rule);vertical-align:top}
th{font-family:var(--mono);font-size:.74rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2)}
.note-card{display:block;background:var(--card);border:1px solid var(--rule);border-radius:6px;padding:22px 24px;margin:18px 0;text-decoration:none;color:var(--ink);transition:border-color .15s}
.note-card:hover{border-color:var(--orange)}
.note-card h2{margin:.2em 0 .3em;font-size:1.25rem}
.note-card p{margin:0;color:var(--ink-2);font-size:.95rem}
.hero{margin:0 0 2.2em}
.hero img{display:block;width:100%;height:auto;border:1px solid var(--rule);border-radius:6px;background:#fff}
.callout{border:1px solid var(--rule);background:#fff;padding:14px 18px;margin:1.4em 0;font-size:.95rem}
.callout::before{content:'FIELD NOTE';display:block;font-family:var(--mono);font-size:.68rem;font-weight:600;letter-spacing:.1em;color:var(--orange-ink);margin-bottom:6px}
.cta-block{margin-top:56px;padding:26px 28px;background:var(--ink);color:#EDE5DC;border-radius:6px}
.cta-block h2{margin:0 0 .4em;color:#fff;font-size:1.3rem}
.cta-block p{margin:0 0 1em;color:#cfc5ba}
.cta-block a{display:inline-block;font-family:var(--mono);font-size:.8rem;font-weight:600;color:#fff;border:1.5px solid #fff;padding:9px 14px;border-radius:3px;text-decoration:none}
.cta-block a:hover{background:var(--orange);border-color:var(--orange)}
footer{border-top:1px solid var(--rule);margin-top:70px;padding-top:20px;color:var(--ink-2);font-size:.85rem}