/* agentsasfolders blog. Jordan's scholarly look: paper ground, deep green,
   serif headings. System fonts only, no external requests, both themes painted. */
:root{
  --ground:#F6F5F1; --card:#FFFFFF; --ink:#23281F; --body-c:#3A4034;
  --muted:#66705E; --accent:#2E7A5E; --accent-lite:#EAF2EC; --line:#DDDDD2;
  --brass:#B97D2A;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --ground:#171B19; --card:#202622; --ink:#E7E9E0; --body-c:#C9CEC2;
    --muted:#9AA694; --accent:#6FB893; --accent-lite:#24332B; --line:#333F36;
    --brass:#D9A84E;
  }
}
:root[data-theme="dark"]{
  --ground:#171B19; --card:#202622; --ink:#E7E9E0; --body-c:#C9CEC2;
  --muted:#9AA694; --accent:#6FB893; --accent-lite:#24332B; --line:#333F36;
  --brass:#D9A84E;
}
*{box-sizing:border-box;margin:0;padding:0}
body{
  background:var(--ground); color:var(--body-c);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:17px; line-height:1.65;
  padding:clamp(20px,4vw,48px) 16px;
}
.page{max-width:680px;margin:0 auto}
.crumb{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);
  font-weight:600;margin-bottom:14px}
.crumb a{color:var(--accent);text-decoration:none}
.crumb a:hover{text-decoration:underline}
h1{font-family:Georgia,"Times New Roman",serif;color:var(--ink);
  font-size:clamp(28px,5vw,40px);line-height:1.12;letter-spacing:-.01em;
  text-wrap:balance;margin-bottom:10px}
.byline{font-size:14px;color:var(--muted);margin-bottom:26px}
h2{font-family:Georgia,"Times New Roman",serif;color:var(--ink);
  font-size:clamp(21px,3.4vw,26px);line-height:1.25;margin:34px 0 12px;text-wrap:balance}
p{margin:0 0 16px;max-width:65ch}
p b,li b{color:var(--ink)}
a{color:var(--accent)}
ul,ol{margin:0 0 16px 22px;max-width:62ch}
li{margin-bottom:8px}
.answer{background:var(--accent-lite);border-radius:10px;padding:16px 18px;
  margin:0 0 20px;font-size:16.5px;color:var(--ink)}
blockquote{border-left:3px solid var(--accent);padding:4px 0 4px 16px;
  color:var(--muted);margin:0 0 16px;font-style:italic;max-width:60ch}
table{border-collapse:collapse;width:100%;font-size:15px;margin:0 0 18px}
th,td{padding:9px 10px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
thead th{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:600}
td{color:var(--ink)}
.tablewrap{overflow-x:auto;margin:0 0 18px}
.cta{background:var(--card);border:1px solid var(--line);border-radius:12px;
  padding:22px 24px;margin:36px 0 0;text-align:center}
.cta h3{font-family:Georgia,serif;color:var(--ink);font-size:21px;margin-bottom:8px}
.cta p{max-width:none;margin-bottom:14px;color:var(--muted);font-size:15.5px}
.cta a.btn{display:inline-block;background:linear-gradient(135deg,#2E7D5B,#1B4A38);color:#fff;font-weight:700;
  padding:13px 26px;border-radius:10px;text-decoration:none;font-size:16px}
footer{margin-top:34px;padding-top:16px;border-top:1px solid var(--line);
  font-size:13px;color:var(--muted);display:flex;flex-wrap:wrap;gap:8px 20px;justify-content:space-between}
footer a{color:var(--muted)}
/* brand footer */
footer.bigfoot{margin-top:38px;padding-top:26px;border-top:1px solid var(--line);
  display:block;font-size:14px;color:var(--muted)}
.fcols{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:24px}
.fcols h3{font-size:13px;font-weight:700;color:var(--ink);margin:0 0 10px;font-family:inherit}
.fcols ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:7px}
.fcols li{margin:0}
.fcols a{font-size:14px;color:var(--muted);text-decoration:none}
.fcols a:hover{color:var(--accent)}
.socials{display:flex;gap:10px}
.socials a{display:flex;align-items:center;justify-content:center;width:34px;height:34px;
  border-radius:50%;border:1px solid var(--line);color:var(--muted);transition:color .15s,border-color .15s}
.socials a:hover{color:var(--accent);border-color:var(--accent)}
.socials svg{width:16px;height:16px;fill:currentColor}
.fbottom{margin-top:26px;padding-top:20px;border-top:1px solid var(--line);
  display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center}
.fmark{font-family:Georgia,"Times New Roman",serif;font-weight:700;font-size:19px;
  color:var(--ink);text-decoration:none}
.as{color:var(--brass)}
.fcopy{font-size:12.5px;color:var(--muted)}
.fcopy a{color:var(--muted)}
.fcopy a:hover{color:var(--accent)}

/* the playbook pop */
.pop{position:fixed;inset:0;z-index:60;display:none;align-items:center;justify-content:center;padding:20px}
.pop.open{display:flex}
.pop .veil{position:absolute;inset:0;background:rgba(10,14,12,.55)}
.popCard{position:relative;z-index:1;width:100%;max-width:540px;max-height:90dvh;overflow:auto;
  background:var(--card);border:1px solid var(--line);border-radius:16px;
  box-shadow:0 30px 80px rgba(10,14,12,.4);padding:clamp(22px,5vw,38px);text-align:center}
.popX{position:absolute;top:10px;right:12px;border:0;background:none;cursor:pointer;
  font-size:22px;line-height:1;color:var(--muted);padding:6px}
.popX:hover{color:var(--ink)}
.popEyebrow{font-size:11.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--accent);margin-bottom:10px}
.popCard h2{margin:0 0 8px;font-size:clamp(23px,4vw,30px)}
.popCard h2 span{color:var(--accent)}
.popSub{font-size:15px;color:var(--muted);max-width:44ch;margin:0 auto 16px}
.popForm{display:flex;flex-direction:column;gap:10px;max-width:380px;margin:0 auto}
.popForm input{padding:13px 16px;font-size:16px;border-radius:10px;
  border:1px solid var(--line);background:var(--ground);color:var(--ink)}
.popForm input:focus{outline:2px solid var(--accent);border-color:transparent}
.popForm .btn2{background:linear-gradient(135deg,#2E7D5B,#1B4A38);color:#fff;font-weight:700;
  padding:13px 26px;border-radius:10px;border:0;cursor:pointer;font-size:16px}
.popRisk{font-size:13px;color:var(--muted);margin-top:10px}
.popCard ul{list-style:none;margin:16px auto 0;padding:0;text-align:left;max-width:440px;
  display:flex;flex-direction:column;gap:6px}
.popCard ul li{padding-left:22px;position:relative;font-size:13px;color:var(--ink);line-height:1.45;margin:0}
.popCard ul li::before{content:"✓";position:absolute;left:0;font-weight:700;color:var(--accent)}

/* index cards */
.postlist{display:flex;flex-direction:column;gap:16px;margin-top:22px}
.postcard{display:block;background:var(--card);border:1px solid var(--line);border-radius:12px;
  padding:20px 22px;text-decoration:none}
.postcard h2{margin:0 0 6px;font-size:21px}
.postcard p{color:var(--muted);font-size:15px;margin:0}
.postcard:hover h2{color:var(--accent)}
