:root{--bg:#fbfbf9;--soft:#f2f2ee;--ink:#15191a;--ink-2:#3a4140;--mute:#6b7371;--line:#e4e4df;--green:#173a2e;--green-2:#245443;--tint:#e9efec;--sans:"Inter",system-ui,-apple-system,sans-serif;--display:"Inter Tight","Inter",system-ui,sans-serif;--gut:clamp(20px,4vw,40px)} *{box-sizing:border-box;margin:0;padding:0} body{font-family:var(--sans);color:var(--ink);background:var(--bg);font-size:18px;line-height:1.7;-webkit-font-smoothing:antialiased} img{display:block;max-width:100%} a{color:inherit;text-decoration:none} :focus-visible{outline:2px solid var(--green-2);outline-offset:3px;border-radius:6px} .wrap{max-width:1200px;margin:0 auto;padding:0 var(--gut)} .narrow{max-width:740px;margin:0 auto;padding:0 var(--gut)} h1,h2,h3{font-family:var(--display);font-weight:600;letter-spacing:-.025em;line-height:1.1} .site-head{position:sticky;top:0;z-index:50;background:rgba(251,251,249,.85);backdrop-filter:saturate(1.4) blur(16px);-webkit-backdrop-filter:saturate(1.4) blur(16px);border-bottom:1px solid var(--line)} .site-head .wrap{display:flex;align-items:center;justify-content:space-between;height:72px;gap:16px} .brand{font-family:var(--display);font-weight:600;font-size:18px;letter-spacing:-.02em} .menu{display:flex;gap:6px;list-style:none} .menu a{display:block;padding:8px 14px;border-radius:999px;font-size:15px;color:var(--ink-2);transition:background .25s} .menu a:hover{background:var(--soft)} .menu a.on{background:var(--tint);color:var(--green)} .pill{display:inline-flex;align-items:center;gap:8px;padding:11px 20px;border-radius:999px;background:var(--green);color:#fff;font-size:15px;font-weight:500} .pill:hover{background:var(--green-2)} @media (max-width:820px){.menu li:not(.keep){display:none}.head-cta{display:none}} .crumb{font-size:14px;color:var(--mute);padding-top:clamp(32px,5vw,56px)} .crumb a:hover{color:var(--ink)} .art-head{padding:18px 0 clamp(28px,4vw,40px)} .art-tag{display:inline-block;padding:6px 12px;border-radius:999px;background:var(--tint);color:var(--green);font-size:13.5px;font-weight:500;margin-bottom:20px} .art-head h1{font-size:clamp(38px,5.4vw,62px);letter-spacing:-.045em;line-height:1.02} .art-desc{margin-top:18px;font-size:clamp(19px,1.6vw,21px);color:var(--mute);line-height:1.55} .byline{display:flex;align-items:center;gap:14px;margin-top:28px;font-size:15px;color:var(--mute)} .byline img{width:46px;height:46px;flex:none;border-radius:50%;object-fit:cover;object-position:50% 20%} .byline b{display:block;color:var(--ink);font-weight:600} .cover{max-width:1000px;margin:0 auto clamp(40px,6vw,64px);padding:0 var(--gut)} .cover img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;object-position:50% 28%;border-radius:24px} .prose p{margin:0 0 1.15em;color:var(--ink-2)} .prose h2{font-size:clamp(26px,2.6vw,32px);margin:1.8em 0 .6em;letter-spacing:-.03em} .prose ul,.prose ol{margin:0 0 1.3em 1.2em;color:var(--ink-2)} .prose li{margin:.45em 0;padding-left:.2em} .prose strong{color:var(--ink);font-weight:600} .prose .punch{font-family:var(--display);font-weight:600;font-size:clamp(23px,2.3vw,28px);letter-spacing:-.025em;line-height:1.3;color:var(--ink);border-left:3px solid var(--green-2);padding-left:22px;margin:1.6em 0} .author{margin:clamp(48px,6vw,72px) 0;display:grid;grid-template-columns:84px 1fr;gap:22px;align-items:center;background:var(--soft);border-radius:24px;padding:28px} .author img{width:84px;height:84px;border-radius:50%;object-fit:cover;object-position:50% 20%} .author h3{font-size:20px;letter-spacing:-.02em} .author p{font-size:15.5px;color:var(--mute);margin-top:6px;line-height:1.55} .author a{color:var(--green-2);font-weight:500} .more{border-top:1px solid var(--line);padding:clamp(48px,6vw,72px) 0} .more h2{font-size:clamp(26px,2.6vw,34px);margin-bottom:28px} .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px} .post{display:flex;flex-direction:column;background:#fff;border-radius:22px;overflow:hidden;box-shadow:0 0 0 1px var(--line);transition:transform .35s,box-shadow .35s} .post:hover{transform:translateY(-4px);box-shadow:0 24px 50px -24px rgba(21,25,26,.25),0 0 0 1px var(--line)} .post img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:50% 30%} .post .b{padding:22px 24px 26px;display:flex;flex-direction:column;flex:1} .post .t{font-size:13px;font-weight:500;color:var(--green-2);margin-bottom:8px} .post h3{font-size:22px;letter-spacing:-.025em;margin-bottom:10px} .post p{font-size:15.5px;color:var(--mute);line-height:1.55} .post .m{margin-top:auto;padding-top:18px;font-size:13.5px;color:var(--mute)} @media (max-width:980px){.grid{grid-template-columns:1fr 1fr}} @media (max-width:620px){.grid{grid-template-columns:1fr}.author{grid-template-columns:1fr}} .list-head{padding:clamp(48px,7vw,96px) 0 clamp(36px,5vw,56px)} .list-head .eyebrow{font-size:15px;font-weight:500;color:var(--green-2);margin-bottom:14px} .list-head h1{font-size:clamp(44px,6vw,76px);letter-spacing:-.05em;line-height:1} .list-head p{margin-top:18px;max-width:36em;font-size:19px;color:var(--mute)} .foot{border-top:1px solid var(--line);margin-top:clamp(48px,6vw,80px)} .foot .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px;padding:32px var(--gut) 48px;font-size:14px;color:var(--mute)} .foot nav{display:flex;gap:22px} .foot a:hover{color:var(--ink)}
