/* Plainsmith v4 design language — paper & ink. Warm cream paper, warm
   near-black ink, vermillion stamp accents; dark survives only as the
   screening-room band around live demos (homepage carries that inline).
   Differentiator logic: every site-builder competitor is cool-white SaaS
   minimalism — we read like a letterpress print shop, which dramatizes
   "human-built, by hand." Fonts: Newsreader display, Inter body, Caveat
   for handwritten moments. */
* { box-sizing:border-box; margin:0; }
:root { --bg:#F5EFE2; --panel:#FCF9F1; --line:#E3D9C6; --ink:#211B12; --dim:#6F6350; --hand:#B3402A; }
body { font-family:'Inter',-apple-system,sans-serif; background:var(--bg); color:var(--ink); line-height:1.65; }
a { color:inherit; }
.wrap { max-width:1120px; margin:0 auto; padding:0 24px; }
.hand { font-family:'Caveat',cursive; font-weight:600; color:var(--hand); }

header.v3 { position:sticky; top:0; z-index:20; background:rgba(245,239,226,.9); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); }
header.v3 .topRow { display:flex; align-items:center; justify-content:space-between; padding:16px 24px; }
header.v3 .logo { font-weight:800; font-size:19px; text-decoration:none; letter-spacing:-0.02em; }
header.v3 nav { display:flex; gap:24px; align-items:center; }
header.v3 nav a { text-decoration:none; font-weight:600; font-size:14.5px; color:var(--dim); }
header.v3 nav a:hover { color:var(--ink); }
header.v3 nav a.cta { background:var(--ink); color:var(--bg); padding:10px 20px; border-radius:8px; font-weight:800; }
header.v3 nav a.here { color:var(--ink); border-bottom:2px solid var(--hand); padding-bottom:2px; }
header.v3 nav a.acct { font-size:13.5px; opacity:.85; }

.hero { padding:88px 0 40px; }
.kicker { font-size:12.5px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; color:var(--dim); margin-bottom:26px; }
h1 { font-family:'Newsreader',Georgia,serif; font-weight:330; font-size:clamp(40px,6vw,74px); line-height:1.04; letter-spacing:-0.015em; max-width:18ch; }
.hero .sub { margin-top:24px; font-size:18.5px; color:var(--dim); max-width:58ch; }
.ctaRow { margin-top:34px; display:flex; gap:16px; flex-wrap:wrap; align-items:center; }
.btn { display:inline-block; padding:15px 30px; border-radius:9px; font-weight:800; text-decoration:none; font-size:16px; }
.btn.primary { background:var(--ink); color:var(--bg); }
.btn.quiet { color:var(--ink); border-bottom:2px solid var(--hand); border-radius:0; padding:15px 2px; }
.btn.quiet::after { content:' \2192'; }
.note { margin-top:16px; color:var(--dim); font-size:14px; }

section { padding:80px 0 0; }
h2 { font-family:'Newsreader',Georgia,serif; font-weight:380; font-size:clamp(27px,3.4vw,40px); letter-spacing:-0.01em; margin-bottom:14px; }
.lead { color:var(--dim); max-width:62ch; }
.lead a { color:var(--hand); font-weight:700; }

/* asymmetric offer doors */
.doors { display:grid; grid-template-columns:1.35fr 1fr; gap:20px; margin-top:38px; }
.door { border:1px solid var(--line); border-radius:14px; padding:36px 34px; background:var(--panel); display:flex; flex-direction:column; }
.door.big { background:linear-gradient(150deg,#FBF5E7 0%, #F1E9D6 100%); }
.door .name { font-weight:800; font-size:14px; letter-spacing:.12em; text-transform:uppercase; color:var(--dim); }
.door .price { font-family:'Newsreader',Georgia,serif; font-weight:420; font-size:clamp(30px,3.4vw,44px); margin-top:12px; }
.door p { color:var(--dim); margin-top:14px; font-size:15.5px; max-width:46ch; }
.door ul { color:var(--dim); margin:14px 0 0; padding-left:20px; font-size:15px; }
.door li { margin-top:7px; }
.door .go { margin-top:auto; padding-top:26px; }
.door .go a { font-weight:800; text-decoration:none; border-bottom:2px solid var(--hand); padding-bottom:3px; }
.door .go a::after { content:' \2192'; }

/* three tiers (sanctioned 3-up: good/better/best) */
.tiers3 { display:grid; grid-template-columns:repeat(3,1fr); gap:0; margin-top:38px; align-items:center; }
.tiers3 .door { border-radius:14px; }
.tiers3 .door.mid { transform:scale(1.05); position:relative; z-index:2; border-color:var(--hand); box-shadow:0 24px 60px rgba(74,58,30,.16); }
.tiers3 .door.mid .flag { display:inline-block; background:var(--hand); color:var(--bg); font-size:12px; font-weight:800; padding:3px 10px; border-radius:999px; margin-bottom:12px; }

/* numbered editorial list */
.how .item { display:grid; grid-template-columns:96px 1fr; gap:28px; padding:30px 0; border-top:1px solid var(--line); align-items:baseline; }
.how .item:first-of-type { margin-top:34px; }
.how .n { font-family:'Newsreader',Georgia,serif; font-weight:300; font-size:46px; color:var(--dim); opacity:.6; line-height:1; }
.how h3 { font-size:19px; font-weight:750; }
.how p { color:var(--dim); margin-top:5px; max-width:60ch; }

.stats { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:26px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:44px 0; margin-top:80px; }
.stats b { display:block; font-family:'Newsreader',Georgia,serif; font-weight:420; font-size:34px; }
.stats span { color:var(--dim); font-size:14px; }

.faq dl { margin-top:30px; max-width:760px; }
.faq dt { font-weight:750; font-size:17px; padding-top:26px; }
.faq dd { margin:8px 0 0; color:var(--dim); }

/* forms */
form.v3 { max-width:560px; margin-top:26px; }
form.v3 label { display:block; font-weight:700; font-size:14px; margin:16px 0 6px; }
form.v3 input, form.v3 textarea, form.v3 select {
  width:100%; border:1.5px solid var(--line); border-radius:9px; padding:12px 13px;
  font:inherit; font-size:15px; background:var(--panel); color:var(--ink);
}
form.v3 input:focus, form.v3 textarea:focus, form.v3 select:focus { outline:none; border-color:var(--hand); }
form.v3 button { margin-top:20px; background:var(--ink); color:var(--bg); border:0; font-weight:800; font-size:16px; padding:14px 32px; border-radius:9px; cursor:pointer; }
form.v3 .msg, #formMsg { margin-top:12px; font-size:14.5px; font-weight:700; color:#3E6B4E; }

footer.v3 { margin-top:96px; border-top:1px solid var(--line); padding:34px 0 52px; color:var(--dim); font-size:14px; }
footer.v3 .row { display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap; }
footer.v3 a { color:var(--dim); }

/* paper repaint of legacy styles.css components still used on v3 pages
   (showcase picker, vs-page CTAs) — kills the v2 gold-gradient/blue-SaaS
   accents that would clash with paper & ink */
.cta { display:inline-block; padding:14px 26px; border-radius:9px; background:var(--ink); color:#F5EFE2;
  font-weight:800; font-size:15.5px; text-decoration:none; border:1.5px solid transparent; box-shadow:none;
  transition:transform .15s, box-shadow .15s; }
.cta:hover { transform:translateY(-2px); box-shadow:0 10px 26px rgba(74,58,30,.22); }
.cta.ghost, a.cta[style*="transparent"] { border-color:var(--line); }
.pchip { border:1.5px solid var(--line); background:var(--panel); color:var(--ink); }
.pchip.on { border-color:var(--ink); background:var(--ink); color:#F5EFE2; }
.devBtn { border:1px solid var(--line); background:var(--panel); color:var(--dim); }
.devBtn.on { border-color:var(--hand); color:var(--hand); }

/* "on the shelf" catalog list (tools page) */
.shelfList { columns:2; column-gap:40px; color:var(--dim); margin-top:14px; padding-left:20px; font-size:15px; max-width:860px; }
.shelfList li { margin-bottom:9px; break-inside:avoid; }
.shelfList b { color:var(--ink); }

@media (max-width:860px) {
  header.v3 nav a:not(.cta):not(.acct) { display:none; }
  .shelfList { columns:1; }
  .hero { padding:60px 0 36px; }
  .doors, .tiers3 { grid-template-columns:1fr; gap:14px; }
  .tiers3 .door.mid { transform:none; }
  .how .item { grid-template-columns:56px 1fr; }
}