@font-face{font-family:Inter;src:url(/fonts/InterVariable.woff2) format("woff2");font-style:normal;font-weight:100 900;font-display:swap}
:root{color:#181a15;background:#f8f8f3;font-family:Inter,system-ui,sans-serif;--ink:#1a2017;--lime:#d4f66a;--line:#dddfd5;--muted:#515a4b}
*,*::before,*::after{box-sizing:border-box}
body,h1,h2,h3,p{margin:0}
a{color:inherit;text-underline-offset:.18em}
a:focus-visible{outline:3px solid #658523;outline-offset:4px;border-radius:4px}
.wrap{width:min(1180px,calc(100% - 80px));margin-inline:auto}
header{background:#fff;border-bottom:1px solid var(--line)}
.bar{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:22px}
.brand,.bar nav,.website{display:flex;align-items:center;gap:18px;font-size:14px;font-weight:650;text-decoration:none}
.brand img{width:105px;height:35px;object-fit:contain}
.brand span{padding-left:16px;border-left:1px solid var(--line)}
.bar nav{gap:30px}
.bar nav a{text-decoration:none}
.website{border:1px solid var(--line);border-radius:100px;padding:10px 16px;white-space:nowrap}
.intro{padding:62px 0 28px}
h1{font-size:clamp(42px,6vw,78px);letter-spacing:-.065em;line-height:1.02;font-weight:760;text-wrap:balance}
.intro p,.article-lead p{font-size:18px;line-height:1.55;color:var(--muted);margin-top:15px;max-width:65ch}
.feature{display:grid;grid-template-columns:1fr 1.08fr;overflow:hidden;border-radius:24px;background:var(--ink);color:#fff;min-height:362px}
.feature-copy{padding:42px;display:flex;align-items:flex-start;flex-direction:column;justify-content:center}
.tag{display:inline-block;background:var(--lime);border-radius:100px;padding:7px 11px;font-size:12px;font-weight:730;color:#26341c}
.tag.neutral{background:#e9eddd}
.feature h2{font-size:clamp(28px,3.5vw,48px);line-height:1.07;letter-spacing:-.05em;margin:17px 0 14px;max-width:17ch;text-wrap:balance}
.feature h2 a,.story h3 a{text-decoration:none}
.feature p{color:#dce4d5;line-height:1.55;max-width:43ch}
.button{margin-top:24px;background:var(--lime);color:#1a2614;padding:12px 15px;border-radius:9px;font-size:14px;font-weight:760;text-decoration:none}
.button span{margin-left:12px}
.cover{width:100%;height:100%;max-height:440px;object-fit:cover;display:block}
.recent{padding:45px 0 54px}
.recent h2,.article-body h2{font-size:29px;letter-spacing:-.04em;margin-bottom:19px}
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.story{background:#fff;border:1px solid var(--line);padding:24px;border-radius:16px;scroll-margin-top:20px}
.story div,.byline,.crumb{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
time{font-size:13px;color:var(--muted)}
.story h3{font-size:22px;letter-spacing:-.034em;margin:12px 0 8px}
.story h3 span{color:#5c7536;font-size:16px}
.story p{color:var(--muted);line-height:1.55}
.footer{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding:22px 0;color:var(--muted);font-size:14px}
.article{padding-top:31px;padding-bottom:54px}
.crumb{color:var(--muted);font-size:14px}
.article-lead{margin:30px 0 32px}
.article-lead h1{font-size:clamp(38px,5.1vw,66px);max-width:20ch}
.byline{margin-top:20px;font-size:14px;font-weight:670}
.byline time{font-weight:450}
.reading{display:grid;grid-template-columns:minmax(0,750px) 272px;gap:38px}
.article-body{grid-column:1;grid-row:1}
.article-cover{width:100%;height:auto;aspect-ratio:16/8;object-fit:cover;border-radius:19px;display:block}
.article-body section{margin-top:28px;scroll-margin-top:22px}
.article-body h2{margin-bottom:8px}
.article-body p{font-size:18px;line-height:1.7;max-width:66ch}
.article-body h2{margin-top:28px;scroll-margin-top:22px}
.article-body p+p{margin-top:14px}
.updated{color:var(--muted);font-weight:450}
.skip{position:absolute;left:18px;top:-100px;padding:10px 14px;background:var(--lime);z-index:3}
.skip:focus{top:10px}
.bar nav [aria-current=page]{text-decoration:underline;text-decoration-thickness:2px}
.all-posts,.pagination a{display:inline-block;padding:12px 0}
.pagination{display:flex;gap:24px;margin-bottom:30px}
.empty{margin:20px 0 44px}
.feature+.footer{margin-top:32px}
.related li+li{margin-top:10px}
aside{grid-column:2;grid-row:1}
aside nav{position:sticky;top:22px;padding:21px;background:#edf0e4;border-radius:15px;display:grid;gap:13px}
aside p{font-weight:740}
aside a{font-size:14px;line-height:1.4}
@media(max-width:760px){
  .wrap{width:calc(100% - 36px)}
  .bar{display:grid;grid-template-columns:1fr auto;gap:4px 12px;padding-block:12px}
  .bar nav{grid-row:2;grid-column:1/-1;gap:18px;flex-wrap:wrap}
  .bar nav a{padding:11px 0}
  .intro{padding:31px 0 22px}
  .intro p,.article-lead p{font-size:16px}
  .feature,.grid,.reading{grid-template-columns:1fr}
  .feature-copy{padding:25px;grid-row:2}
  .feature h2{font-size:33px}
  .cover{height:auto;aspect-ratio:16/9}
  .recent{padding:30px 0}
  .article{padding-top:22px}
  .article-lead{margin:24px 0}
  aside,.article-body{grid-column:auto;grid-row:auto}
  aside nav{position:static}
  .reading{gap:18px}
  .article-body p{font-size:17px}
}


.guide-figure{margin:20px 0 26px}
.guide-figure img{display:block;width:100%;height:auto;background:#fff;border:1px solid var(--line);border-radius:12px}
.guide-figure figcaption{color:var(--muted);font-size:14px;line-height:1.5;margin-top:8px}
