
*{box-sizing:border-box;margin:0;padding:0}
:root{
  --sage:#7A9471; --sage-d:#5F7758; --terra:#C1613B; --terra-d:#9E4B2B;
  --cream:#FAF6EC; --charcoal:#2B2A26; --muted:#6B675E;
  --page:#F2EDE0; --line:#DCD4C0; --line-s:#E7E0CE;
}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{background:var(--page);color:var(--charcoal);
  font-family:"Karla",-apple-system,"Segoe UI",sans-serif;font-size:17px;line-height:1.72}
h1,h2,h3,h4{font-family:"Abhaya Libre",Georgia,serif;font-weight:600;line-height:1.16;letter-spacing:.01em}
a{color:var(--terra-d)}
a:hover{color:var(--sage-d)}
img{max-width:100%}
.wrap{max-width:1080px;margin:0 auto;padding:0 22px}
.narrow{max-width:740px}
.kick{font-family:"Karla",sans-serif;font-size:.68rem;letter-spacing:.24em;
  text-transform:uppercase;color:var(--muted)}

/* ---------- header ---------- */
.site-head{background:var(--cream);border-bottom:1px solid var(--line);
  position:sticky;top:0;z-index:40}
.head-in{max-width:1080px;margin:0 auto;padding:15px 22px;display:flex;align-items:center;gap:16px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--charcoal)}
.brand .sprig{width:30px;height:30px;flex:none}
.brand .mark{display:block}
.brand b{font-family:"Abhaya Libre",serif;font-size:1.42rem;font-weight:600;letter-spacing:.02em;display:block}
.brand .mark span{display:block;font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--muted);margin-top:-5px}
.site-nav{margin-left:auto}
.site-nav ul{display:flex;gap:24px;list-style:none;align-items:center}
.site-nav a{text-decoration:none;color:var(--charcoal);font-size:.81rem;letter-spacing:.11em;
  text-transform:uppercase;padding-bottom:3px;border-bottom:2px solid transparent}
.site-nav a:hover,.site-nav a[aria-current="page"]{border-bottom-color:var(--terra);color:var(--terra-d)}
.nav-toggle{display:none;margin-left:auto;background:none;border:1px solid var(--line);
  border-radius:3px;padding:7px 11px;cursor:pointer;color:var(--charcoal);font:inherit;font-size:.8rem}

/* ---------- packet ---------- */
.packet{background:var(--cream);border:1px solid var(--line);border-radius:4px;
  position:relative;overflow:hidden;box-shadow:0 1px 0 rgba(43,42,38,.05)}
.packet .band{padding:13px 20px 14px;color:var(--cream);position:relative}
.packet .band::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;
  background-image:radial-gradient(circle at 3px 1.5px, rgba(250,246,236,.85) 1.4px, transparent 1.5px);
  background-size:9px 3px}
.packet .band h2,.packet .band h3,.packet .band h1{color:var(--cream);font-size:1.34rem;margin:0}
.packet .band .kicker{display:block;font-family:"Karla",sans-serif;font-size:.65rem;
  letter-spacing:.22em;text-transform:uppercase;opacity:.88;margin-bottom:4px}
.band-sage{background:var(--sage)}
.band-terra{background:var(--terra)}
.packet .body{padding:20px 20px 24px;position:relative}
.packet .sprig{position:absolute;right:14px;bottom:12px;width:54px;height:54px;opacity:.7;pointer-events:none}
.packet .body p+p{margin-top:.85em}

/* ---------- hero ---------- */
.hero{padding:56px 0 28px}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(280px,.9fr);
  gap:44px 52px;align-items:center}
.hero-inner{position:relative;padding-left:66px;max-width:none}
.hero-inner>.sprig{position:absolute;left:0;top:-2px;width:52px;height:52px;opacity:.85}
.hero h1{font-size:3rem;max-width:16ch}
.hero .lede{margin-top:16px;font-size:1.12rem;color:var(--muted);max-width:42ch}
.hero-photo{margin:0;background:var(--cream);border:1px solid var(--line);border-radius:4px;
  padding:18px 12px 14px;position:relative;
  box-shadow:0 1px 0 rgba(43,42,38,.05),0 16px 36px rgba(43,42,38,.1)}
.hero-photo::before{content:"";position:absolute;left:0;right:0;top:0;height:8px;
  background:var(--sage);border-radius:4px 4px 0 0}
.hero-photo::after{content:"";position:absolute;left:0;right:0;top:8px;height:3px;
  background-image:radial-gradient(circle at 3px 1.5px, rgba(250,246,236,.9) 1.4px, transparent 1.5px);
  background-size:9px 3px;pointer-events:none}
.hero-photo-stage{position:relative;border-radius:3px;overflow:hidden;aspect-ratio:1;
  background:#151a22;box-shadow:inset 0 0 0 1px rgba(201,168,90,.45)}
.hero-photo-stage::after{content:"";position:absolute;inset:11px;border:1px solid rgba(232,208,140,.3);
  border-radius:2px;pointer-events:none;z-index:1}
.hero-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.hero-photo-solo{max-width:480px;margin:32px auto 6px}

/* ---------- strips & sections ---------- */
.sec{padding:46px 0}
.sec.tight{padding:30px 0}
.sec-head{margin-bottom:24px;max-width:66ch}
.sec-head h2{font-size:2rem;margin-top:5px}
.sec-head p{color:var(--muted);margin-top:7px}
.rule{height:1px;background:var(--line);border:0}

.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:0;background:var(--cream);
  border:1px solid var(--line);border-radius:4px;overflow:hidden}
.stats div{padding:20px 18px;border-left:1px solid var(--line-s)}
.stats div:first-child{border-left:0}
.stats b{display:block;font-family:"Abhaya Libre",serif;font-size:2.4rem;line-height:1;
  color:var(--terra-d)}
.stats div:nth-child(even) b{color:var(--sage-d)}
.stats span{display:block;margin-top:7px;font-size:.72rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--muted)}

.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.count{display:inline-block;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--muted);border-top:1px solid var(--line);padding-top:9px;margin-top:4px}
.card-link{display:block;text-decoration:none;color:inherit;height:100%}
.card-link>.packet,.grid-3>.packet,.versus>.packet{height:100%;display:flex;flex-direction:column}
.card-link>.packet .body,.grid-3>.packet .body,.versus>.packet .body{flex:1}
.grid .packet .body,.grid-3 .packet .body,.versus .packet .body{padding-bottom:58px}
.card-link .packet{transition:box-shadow .18s ease, transform .18s ease}
.card-link:hover .packet{box-shadow:0 6px 20px rgba(43,42,38,.12);transform:translateY(-2px)}

/* anatomy / steps */
.steps{counter-reset:st}
.steps .packet .body{padding-top:22px}
.steps h3{font-size:1.15rem;margin-bottom:6px}
.steps .num{font-family:"Abhaya Libre",serif;font-size:1.5rem;color:var(--terra-d);
  display:block;line-height:1;margin-bottom:4px}
.steps .packet:nth-child(even) .num{color:var(--sage-d)}

/* two-column contrast */
.versus{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.versus ul{list-style:none;margin-top:4px}
.versus li{padding:9px 0 9px 24px;border-bottom:1px dotted var(--line);position:relative;font-size:.97rem}
.versus li:last-child{border-bottom:0}
.versus li::before{content:"";position:absolute;left:0;top:18px;width:11px;height:1px;background:var(--sage)}
.versus .no li::before{background:var(--terra)}

/* full index */
.index-block{background:var(--cream);border:1px solid var(--line);border-radius:4px;overflow:hidden}
.index-grp{border-top:1px solid var(--line-s)}
.index-grp:first-child{border-top:0}
.index-grp>.hd{display:flex;align-items:baseline;gap:12px;padding:14px 20px 10px;background:rgba(122,148,113,.07)}
.index-grp.t>.hd{background:rgba(193,97,59,.07)}
.index-grp>.hd h3{font-size:1.16rem}
.index-grp>.hd a{margin-left:auto;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;
  text-decoration:none}
.ix{list-style:none}
.ix li{border-top:1px dotted var(--line)}
.ix a{display:flex;gap:14px;align-items:baseline;padding:12px 20px;text-decoration:none;color:var(--charcoal)}
.ix a:hover{background:rgba(122,148,113,.1)}
.ix .n{font-family:"Abhaya Libre",serif;color:var(--muted);font-size:.92rem;min-width:24px}
.ix .t{font-family:"Abhaya Libre",serif;font-size:1.1rem}
.ix .l{margin-left:auto;font-size:.8rem;color:var(--muted);text-align:right;white-space:nowrap}

/* map-free geography block */
.geo{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.geo div{background:var(--cream);border:1px solid var(--line);border-radius:4px;padding:16px 16px 18px}
.geo div:nth-child(even) em{color:var(--terra-d)}
.geo b{display:block;font-family:"Abhaya Libre",serif;font-size:1.12rem}
.geo span{display:block;margin-top:5px;font-size:.78rem;color:var(--muted)}
.geo em{display:block;margin-bottom:6px;font-size:2rem;font-family:"Abhaya Libre",serif;
  font-style:normal;color:var(--sage-d);line-height:1}

.closing{background:var(--cream);border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);padding:44px 0}
.closing p{max-width:66ch;font-size:1.06rem}
.closing p+p{margin-top:.9em}
.closing .sprig{width:44px;height:44px;display:block;margin-bottom:12px}

/* ---------- category page ---------- */
.cat-top{padding:40px 0 0}
.cat-lay{display:grid;grid-template-columns:1fr 290px;gap:28px;align-items:start;padding:28px 0 0}
.side{position:sticky;top:86px;display:flex;flex-direction:column;gap:18px}
.side .box{background:var(--cream);border:1px solid var(--line);border-radius:4px;padding:16px 18px 18px}
.side h3{font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);
  font-family:"Karla",sans-serif;font-weight:700;margin-bottom:10px}
.side ol{list-style:none;counter-reset:s}
.side ol li{counter-increment:s;border-top:1px dotted var(--line)}
.side ol li:first-child{border-top:0}
.side ol a{display:block;padding:9px 0;text-decoration:none;color:var(--charcoal);font-size:.94rem;
  line-height:1.4}
.side ol a::before{content:counter(s,decimal-leading-zero) " ";color:var(--muted);font-size:.8rem}
.side ol a:hover{color:var(--terra-d)}
.side .box p{font-size:.92rem;color:var(--muted)}
.side .box p+h4{margin-top:12px}
.side h4{font-size:1rem;margin-bottom:2px}

.entries{display:flex;flex-direction:column;gap:32px}
.entry{scroll-margin-top:90px}
.entry .band .place{font-family:"Karla",sans-serif;font-size:.78rem;letter-spacing:.06em;
  opacity:.92;display:block;margin-top:3px}
.entry .body{padding-right:78px}
.entry .body p{max-width:74ch}
.lead-line{font-family:"Abhaya Libre",serif;font-size:1.25rem;line-height:1.45;
  border-left:3px solid var(--sage);padding-left:14px;margin-bottom:16px;max-width:60ch}
.entry.t .lead-line{border-left-color:var(--terra)}
.tags{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin-top:18px;max-width:82%}
.tags li{font-size:.71rem;letter-spacing:.09em;text-transform:uppercase;color:var(--sage-d);
  border:1px solid var(--line);border-radius:999px;padding:4px 12px;background:#fff}
.entry.t .tags li{color:var(--terra-d)}
.foot-notes{margin-top:20px;border-top:1px dotted var(--line);padding-top:14px;
  display:grid;grid-template-columns:1fr 1fr;gap:16px;max-width:82%}
.foot-notes div b{display:block;font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--muted);margin-bottom:3px;font-weight:700}
.foot-notes div p{font-size:.95rem;margin:0}

.more{padding:46px 0 0}
.more .grid-3 .packet .body{padding-bottom:20px}

/* ---------- long-form ---------- */
.page-head{padding:48px 0 4px}
.page-head .sprig{width:44px;height:44px;display:block;margin-bottom:10px}
.page-head h1{font-size:2.6rem}
.page-head .lede{margin-top:12px;color:var(--muted);font-size:1.06rem;max-width:58ch}
.prose{padding:12px 0 46px}
.prose h2{font-size:1.5rem;margin:34px 0 8px}
.prose p+p,.prose ul{margin-top:.9em}
.prose ul{padding-left:1.2em}
.prose li{margin-bottom:.35em}
.prose .contact-line{font-family:"Abhaya Libre",serif;font-size:1.35rem}
.callout{background:var(--cream);border:1px solid var(--line);border-left:4px solid var(--sage);
  border-radius:4px;padding:16px 18px;margin:24px 0}
.callout b{display:block;font-family:"Abhaya Libre",serif;font-size:1.1rem;margin-bottom:3px}
.callout.t{border-left-color:var(--terra)}
.updated{margin-top:30px;font-size:.8rem;color:var(--muted);letter-spacing:.06em}

/* ---------- footer ---------- */
.site-foot{background:var(--cream);border-top:1px solid var(--line);padding:44px 0 26px;margin-top:40px}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.3fr;gap:32px}
.foot-grid h4{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);
  font-family:"Karla",sans-serif;font-weight:700;margin-bottom:12px}
.foot-grid ul{list-style:none}
.foot-grid li{margin-bottom:7px}
.foot-grid a{text-decoration:none;color:var(--charcoal);font-size:.94rem}
.foot-grid a:hover{color:var(--terra-d)}
.foot-brand{display:flex;gap:12px;align-items:flex-start}
.foot-brand .sprig{width:34px;height:34px;flex:none}
.foot-brand strong{font-family:"Abhaya Libre",serif;font-size:1.3rem;display:block}
.foot-brand p{color:var(--muted);font-size:.93rem;margin-top:5px;max-width:36ch}
.foot-note p{color:var(--muted);font-size:.9rem}
.foot-end{border-top:1px solid var(--line);margin-top:32px;padding-top:16px;
  font-size:.82rem;color:var(--muted);display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between}

@media(max-width:980px){
  .cat-lay{grid-template-columns:1fr}
  .side{position:static;flex-direction:row;flex-wrap:wrap}
  .side .box{flex:1 1 260px}
  .geo{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:860px){
  .grid,.grid-3,.versus{grid-template-columns:1fr}
  .stats{grid-template-columns:1fr 1fr}
  .stats div:nth-child(3){border-left:0}
  .stats div:nth-child(n+3){border-top:1px solid var(--line-s)}
  .foot-grid{grid-template-columns:1fr 1fr}
  .foot-brand,.foot-note{grid-column:1/-1}
  .hero-grid{grid-template-columns:1fr;gap:28px}
  .hero-inner{padding-left:0}
  .hero-inner>.sprig{position:static;display:block;margin-bottom:8px}
  .hero h1{font-size:2.3rem}
  .hero-photo{max-width:420px;margin-left:auto;margin-right:auto}
}
@media(max-width:700px){
  .nav-toggle{display:block}
  .site-nav{margin-left:0;flex-basis:100%;display:none}
  .head-in{flex-wrap:wrap}
  .site-nav.open{display:block}
  .site-nav ul{flex-direction:column;gap:0;padding:6px 0 4px;align-items:stretch}
  .site-nav li{border-top:1px solid var(--line)}
  .site-nav a{display:block;padding:11px 0;border-bottom:none}
  .geo{grid-template-columns:1fr 1fr}
  .tags,.foot-notes{max-width:100%}
  .foot-notes{grid-template-columns:1fr}
  .entry .body{padding-right:20px}
  .packet .sprig{opacity:.35}
  .ix a{flex-wrap:wrap}
  .ix .l{margin-left:38px;width:100%;text-align:left}
}
