@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Noto+Serif+SC:wght@400;500;600;700&display=swap');

:root{color-scheme:light;--paper:#f8f6f1;--ink:#21372e;--muted:#768179;--forest:#305847;--line:#dddcd3;--serif:'Noto Serif SC','Songti SC',serif;--sans:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
a:focus-visible{outline:2px solid var(--forest);outline-offset:5px;border-radius:2px}
.site-shell{width:min(1120px,calc(100% - 64px));margin:auto}
.site-header{height:104px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--serif);font-weight:700;font-size:19px;letter-spacing:.04em}
.brand-mark{display:grid;place-items:center;width:34px;height:34px;border:1.5px solid var(--forest);border-radius:50%;font-family:var(--sans);font-size:27px;line-height:1;padding-bottom:5px}
.site-nav{display:flex;gap:38px;font-size:14px;color:#53635a}
.site-nav a{padding:8px 0;transition:color .2s}
.site-nav a:hover,.site-nav a[aria-current=page]{color:var(--forest)}
.site-nav a[aria-current=page]{box-shadow:inset 0 -1px var(--forest)}
.hero{min-height:520px;position:relative;overflow:hidden;padding:95px 0 85px;border-bottom:1px solid var(--line)}
.hero-kicker,.eyebrow{font-size:11px;font-weight:700;letter-spacing:.2em;color:var(--forest)}
.hero-kicker{display:flex;align-items:center;gap:14px}
.kicker-line{display:inline-block;width:28px;height:1px;background:var(--forest)}
.hero h1{position:relative;z-index:1;margin:28px 0 24px;font-family:var(--serif);font-size:clamp(52px,6.2vw,86px);font-weight:600;letter-spacing:-.055em;line-height:1.35}
.hero h1 em{font-style:normal;color:var(--forest)}
.hero p{position:relative;z-index:1;max-width:490px;margin:0;color:#657268;font-size:17px;line-height:1.9}
.hero-link{position:relative;z-index:1;display:inline-flex;align-items:center;gap:34px;margin-top:38px;padding:13px 20px;background:var(--forest);color:#fff;font-size:13px;letter-spacing:.04em;transition:transform .2s,background .2s}
.hero-link:hover{transform:translateY(-2px);background:#244636}
.hero-link span{font-size:17px}
.hero-drawing{position:absolute;width:350px;height:290px;right:54px;bottom:78px;opacity:.8}
.drawing-house{position:absolute;width:225px;height:155px;right:38px;bottom:0;border:2px solid #a6b4a8;background:rgba(222,231,218,.22)}
.drawing-roof{position:absolute;width:230px;height:230px;right:35px;bottom:49px;border-left:2px solid #a6b4a8;border-top:2px solid #a6b4a8;transform:rotate(45deg) scale(.72);z-index:1}
.drawing-door{position:absolute;width:53px;height:87px;right:123px;bottom:0;border:2px solid #a6b4a8;border-bottom:0;z-index:2}
.drawing-sun{position:absolute;width:67px;height:67px;right:0;top:2px;border:1.5px solid #b6b990;border-radius:50%}
.latest{padding:76px 0 110px}
.section-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:28px}
.section-heading h2,.page-heading h1{margin:10px 0 0;font:600 36px/1.35 var(--serif);letter-spacing:-.03em}
.section-heading>a{font-size:13px;color:var(--forest);padding-bottom:5px}
.section-heading>a span{margin-left:12px}
.post-list{border-top:1px solid var(--line)}
.post-row{display:grid;grid-template-columns:130px 1fr 32px;gap:16px;align-items:start;padding:28px 0;border-bottom:1px solid var(--line)}
.post-date{font-size:12px;color:var(--muted);letter-spacing:.04em;padding-top:7px}
.post-detail h2,.post-detail h3{margin:0;font:600 20px/1.5 var(--serif)}
.post-detail h2 a:hover,.post-detail h3 a:hover{color:var(--forest)}
.post-detail p{margin:8px 0 0;color:var(--muted);font-size:13px;line-height:1.8}
.post-arrow{font-size:19px;color:var(--forest);text-align:right;transition:transform .2s}
.post-arrow:hover{transform:translate(3px,-3px)}
.empty-state{padding:35px 0;color:var(--muted)}
.page-heading{padding:75px 0 48px}
.page-heading p{color:var(--muted);margin:15px 0 0;font-size:14px}
.post-list-page{margin-bottom:120px}
.article{max-width:740px;margin:0 auto;padding:72px 0 120px}
.back-link{display:inline-block;font-size:13px;color:var(--forest);margin-bottom:32px}
.article-header{padding-bottom:30px;border-bottom:1px solid var(--line)}
.article-header h1{margin:0 0 20px;font:600 clamp(32px,4.5vw,48px)/1.45 var(--serif);letter-spacing:-.04em}
.article-meta{display:flex;flex-wrap:wrap;align-items:center;gap:10px;font-size:12px;color:var(--muted)}
.meta-separator{color:#aaa}
.tag{padding:4px 8px;background:#e8ede7;color:var(--forest)}
.article-body{font-size:16px;line-height:2;color:#394b40;overflow-wrap:anywhere}
.article-body h2,.article-body h3{font-family:var(--serif);color:var(--ink);line-height:1.5;margin:2em 0 .7em}
.article-body h2{font-size:25px}.article-body h3{font-size:20px}
.article-body p,.article-body ul,.article-body ol{margin:1.25em 0}
.article-body a{color:var(--forest);text-decoration:underline;text-underline-offset:3px}
.article-body blockquote{margin:1.6em 0;padding:.1em 1.3em;border-left:3px solid #a6b4a8;color:#697a6d;background:#f1f2eb}
.article-body pre{overflow-x:auto;padding:18px 22px;background:#25382e;color:#f8f6f1;border-radius:4px;font-size:14px;line-height:1.7}
.article-body code:not(pre code){background:#e9ece5;padding:2px 5px;border-radius:3px;font-size:.88em}
.article-body img{max-width:100%;height:auto}
.site-footer{min-height:95px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);color:#89928a;font-size:12px}
@media(max-width:760px){.site-shell{width:min(100% - 36px,640px)}.site-header{height:78px}.brand{font-size:16px}.brand-mark{width:30px;height:30px;font-size:24px}.site-nav{gap:18px;font-size:13px}.hero{min-height:490px;padding:72px 0 73px}.hero h1{font-size:clamp(46px,11vw,72px)}.hero p{max-width:450px;font-size:15px}.hero-drawing{right:-105px;bottom:20px;transform:scale(.7);transform-origin:bottom right;opacity:.32}.latest{padding:58px 0 80px}.section-heading h2,.page-heading h1{font-size:29px}.post-row{grid-template-columns:1fr 24px;gap:4px 12px}.post-date{grid-column:1/-1;padding:0 0 5px}.post-detail h2,.post-detail h3{font-size:18px}.post-arrow{grid-column:2;grid-row:2}.article{padding:55px 0 85px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}
