/* terrapilgrim.org draft. Base: terrapilgrim.ai style.css (live Oct 27, 2026): same palette,
   waymark, book-plate mat, drop cap, rules grid, and footer. Type changed to Crimson Pro + Source Sans 3. */
:root{
  --green:#2f4b3c;--green-deep:#22382c;--gold:#b48a3c;--gold-deep:#8a6a2e;
  --ink:#1a1a1a;--muted:#5f5a50;--bg:#fdfcf8;--line:#e6dcc6;--tint:#f8f2e4;--stone:#f3efe5;
  --hair-gray:rgba(150,130,90,.25);--hair-gold:rgba(180,138,60,.5);
  --head:"Crimson Pro",Georgia,serif;--body:"Crimson Pro",Georgia,serif;
  --sans:"Source Sans 3",system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:400 20px/1.65 var(--body);-webkit-font-smoothing:antialiased}
a{color:var(--green);text-decoration-color:var(--gold);text-underline-offset:4px;text-decoration-thickness:1px}
a:hover,a:focus-visible{color:var(--gold-deep)}
h1,h2,h3{font-family:var(--head);font-weight:600;color:var(--ink);line-height:1.15;margin:0}
.skip{position:absolute;left:-9999px}.skip:focus{left:12px;top:12px;background:#fff;padding:8px 12px;z-index:9}
.shell{width:22px;height:22px;color:var(--gold);flex:none}
.label{font:600 14px/1.45 var(--sans);letter-spacing:.15em;text-transform:uppercase;color:var(--gold-deep);margin:0 0 .7rem}

/* Top line: one quiet row (the .ai home has none; inner pages here need a way home) */
.top{max-width:1040px;margin:0 auto;padding:20px 24px;display:flex;flex-wrap:wrap;gap:10px 28px;align-items:center;justify-content:space-between}
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--green);font:600 24px var(--head);letter-spacing:.04em}
nav a{margin-left:26px;text-decoration:none;color:var(--green);font:600 14px var(--sans);letter-spacing:.15em;text-transform:uppercase;display:inline-block;padding:6px 0}
nav a:first-child{margin-left:0}
nav a[aria-current=page]{color:var(--gold-deep)}

/* Masthead */
.mast{max-width:880px;margin:0 auto;padding:clamp(48px,6vw,88px) 24px 28px;text-align:center}
.mast h1{font-size:clamp(54px,7.4vw,84px);font-weight:600;color:var(--green);letter-spacing:.01em}
.mast h1.page{font-size:clamp(44px,6vw,64px)}
.mast h1 .h1-name{display:block}
.tagline{font-family:var(--body);font-size:21px;line-height:1.55;color:#2c2a26;max-width:760px;margin:0 auto;text-wrap:balance}
.tagline .t-line{display:block}

/* Waymark: gold scallop between hairlines */
.waymark{display:flex;align-items:center;justify-content:center;gap:14px;margin:18px auto 20px;max-width:260px}
.waymark span{flex:1;height:1px;background:linear-gradient(90deg,transparent,var(--gold))}
.waymark span:last-child{background:linear-gradient(90deg,var(--gold),transparent)}
.waymark .shell{width:26px;height:26px}
.waymark.small{max-width:180px;margin:0 auto 18px}
.waymark.small .shell{width:20px;height:20px}

/* Plate */
.plate{max-width:720px;margin:20px auto 56px;padding:0 24px;text-align:center}
.mat{background:var(--stone);padding:34px;border:1px solid var(--line);box-shadow:0 14px 34px -18px rgba(34,56,44,.45),0 2px 6px rgba(0,0,0,.05)}
.mat img{display:block;width:100%;height:auto;outline:1px solid var(--gold);outline-offset:6px}
.plate figcaption{margin-top:16px;font-size:17.5px;color:var(--muted)}

/* Intro with drop cap */
.intro{max-width:640px;margin:0 auto;padding:0 24px}
.intro p{margin:0 0 1.1rem}
.lede{text-wrap:pretty}
.lede .dc{float:left;font:600 3.55em/.8 var(--head);color:var(--green);margin:.09em .07em 0 -.02em;padding:0}
.lede .dc + span{margin-left:-.02em}

/* Sections */
.sec{max-width:860px;margin:40px auto 0;padding:56px 24px 16px;border-top:1px solid var(--hair-gray)}
.sec-head{text-align:center;margin-bottom:32px}
.sec-head h2{font-size:clamp(36px,5vw,46px)}
.sec-sub{font-size:19px;font-style:italic;color:var(--muted);margin:.4rem auto 0;max-width:600px}
.rules{list-style:none;margin:0 auto;padding:0;max-width:760px;display:grid;grid-template-columns:1fr 1fr;gap:0 44px}
.rules li{border-top:1px solid var(--hair-gold);padding:18px 0 22px}
.rules h3{font-size:26px;color:var(--green);margin-bottom:.35rem}
.rules p{font-size:18px;margin:0;color:#2c2a26}

/* Project cards */
.works{list-style:none;margin:0 auto;padding:0;max-width:760px;display:grid;grid-template-columns:1fr 1fr;gap:22px}
.works li{display:flex}
.work{display:flex;flex-direction:column;width:100%;text-decoration:none;color:inherit;background:#fff;border:1px solid var(--line);border-top:2px solid var(--gold);padding:22px 24px 20px;transition:border-color .2s,box-shadow .2s}
.work:hover,.work:focus-visible{border-color:var(--gold);box-shadow:0 10px 24px -18px rgba(34,56,44,.55);color:inherit}
.work .for{font:600 13.5px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--gold-deep);margin:0 0 .5rem}
.work h3{font-size:28px;color:var(--green);margin:0 0 .4rem}
.work p.desc{font-size:18px;line-height:1.55;margin:0 0 1rem;color:#2c2a26;flex:1}
.work .go{font:600 15px/1.4 var(--sans);color:var(--green);text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:4px}
.works li.wide{grid-column:1/-1}
.works li.wide .work{max-width:calc((100% - 22px)/2);margin:0 auto}
.more{text-align:center;margin:28px 0 0}
.more a{font:600 15px var(--sans);letter-spacing:.12em;text-transform:uppercase;text-decoration:none}

/* Project detail list (Projects page) */
.plist{max-width:680px;margin:0 auto;padding:0 24px}
.pitem{border-top:1px solid var(--hair-gold);padding:28px 0 30px}
.pitem h2{font-size:34px;color:var(--green);margin:0 0 .2rem}
.pitem .url{font:600 15px var(--sans);letter-spacing:.04em;margin:0 0 .9rem}
.pitem p{margin:0 0 .8rem;font-size:19px}
.pitem .for{font:600 13.5px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--gold-deep);margin:0 0 .5rem}

/* Family card (sister site) */
.family{max-width:640px;margin:0 auto;text-align:center}
.family p{font-size:19px;margin:0 0 .9rem}

/* Contact box */
.contact{max-width:760px;margin:56px auto 40px;padding:0 24px}
.offer-in{background:var(--tint);border-top:1px solid var(--hair-gold);border-bottom:1px solid var(--hair-gold);padding:40px 32px;text-align:center}
.offer-in h2{font-size:clamp(34px,5vw,40px);margin-bottom:.6rem}
.offer-in p{max-width:540px;margin:0 auto 1rem;font-size:19px}
.btn-mail{display:inline-block;margin-top:.4rem;padding:12px 26px;border:1px solid var(--green);color:var(--green);text-decoration:none;font:600 15px var(--sans);letter-spacing:.08em}
.btn-mail:hover,.btn-mail:focus-visible{background:var(--green);color:#fff}

/* Prose pages */
.prose{max-width:640px;margin:0 auto;padding:0 24px 20px}
.prose p{margin:0 0 1.15rem}
.prose h2{font-size:32px;color:var(--green);margin:2.2rem 0 .7rem}
.sign{font:italic 500 22px var(--head);color:var(--green);text-align:right;margin-top:1.4rem}
.sign>span{display:block}

/* Credit page */
.credit-item{display:flex;align-items:flex-start;gap:28px}
.thumb{flex:0 0 150px;margin:6px 0 0;background:var(--stone);padding:8px;border:1px solid var(--line);box-shadow:0 8px 18px -12px rgba(34,56,44,.45)}
.thumb img{display:block;width:100%;height:auto;outline:1px solid var(--gold);outline-offset:3px}
.cite{padding-left:2em;text-indent:-2em;font-size:18.5px;line-height:1.7;margin:0 0 1.2rem;overflow-wrap:anywhere;flex:1;min-width:0}

/* Footer */
.foot{max-width:860px;margin:40px auto 0;padding:46px 24px 40px;border-top:1px solid var(--hair-gray);text-align:center;color:var(--muted);font-size:17.5px}
.foot p{margin:.3rem 0}
.foot-links a{margin:0 12px;color:var(--green);text-decoration:none;font:600 14px var(--sans);letter-spacing:.14em;text-transform:uppercase;display:inline-block;padding:6px 0}
.foot .copy{margin-top:1.1rem}
.foot .copy a{color:inherit;text-decoration:none}
.foot .copy a:hover{text-decoration:underline}
.foot .signoff{display:block;font:italic 500 20px var(--head);color:var(--green);margin-top:1.1rem}
.draft-flag{font:600 13.5px var(--sans);letter-spacing:.12em;text-transform:uppercase;color:#8a3b2e;margin-top:1.2rem !important}

@media (min-resolution:2dppx){
  :root{--hair-gray:rgba(150,130,90,.4);--hair-gold:rgba(180,138,60,.7)}
}
@media (max-width:640px){
  body{font-size:19px}
  .top{justify-content:center;padding:16px 18px}
  nav{display:flex;justify-content:center;gap:4px 22px;flex-wrap:wrap}
  nav a,nav a:first-child{margin:0;font-size:13.5px}
  .mast{padding:40px 22px 24px}
  .tagline{font-size:18px;max-width:360px}
  .tagline .t-line{display:inline}
  .mat{padding:14px}.mat img{outline-offset:4px}
  .rules,.works{grid-template-columns:1fr}
  .works li.wide .work{max-width:none}
  .work{padding:20px}
  .work h3{font-size:26px}
  .offer-in{padding:32px 20px}
  .pitem h2{font-size:30px}
  .credit-item{flex-direction:column;align-items:center;gap:22px}
  .thumb{flex:none;width:140px;margin:0}
  .cite{align-self:stretch}
}