:root{
  --paper:#FFFBF4;
  --ink:#2B2118;
  --wheat:#E8C97A;
  --tomato:#C8402F;
  --basil:#4F6B3A;
  --mute:#7A6A5B;
  --line:#EBDFC9;
  --max:1100px;
  --read:680px;
}
*{box-sizing:border-box}
html{font-size:17px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"Nunito",system-ui,sans-serif;line-height:1.6}
a{color:var(--tomato)}
img{max-width:100%;display:block}

/* header */
.site-head{border-bottom:3px solid var(--wheat);background:#fff}
.site-head .wrap{max-width:var(--max);margin:0 auto;padding:18px 20px;display:flex;align-items:center;gap:16px;justify-content:space-between}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink)}
.brand img{width:44px;height:44px;border-radius:50%}
.brand span{font-family:"Fraunces",Georgia,serif;font-size:1.5rem;font-weight:700;letter-spacing:-.01em}
nav a{margin-left:18px;color:var(--ink);text-decoration:none;font-weight:600}
nav a:hover{color:var(--tomato)}

/* home hero */
.hero{max-width:var(--max);margin:0 auto;padding:48px 20px 24px}
.hero h1{font-family:"Fraunces",Georgia,serif;font-size:clamp(2rem,5vw,3.4rem);line-height:1.05;margin:0 0 12px;max-width:16ch}
.hero p{max-width:52ch;color:var(--mute);margin:0}

/* post grid */
.grid{max-width:var(--max);margin:0 auto;padding:24px 20px 64px;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:28px}
.card{text-decoration:none;color:var(--ink)}
.card .thumb{aspect-ratio:2/3;object-fit:cover;width:100%;background:var(--line)}
.card h3{font-family:"Fraunces",Georgia,serif;font-size:1.2rem;line-height:1.25;margin:12px 0 4px}
.card p{margin:0;color:var(--mute);font-size:.95rem}
.card small{color:var(--basil);font-weight:700}

/* article */
.post{max-width:var(--read);margin:0 auto;padding:40px 20px 72px}
.post .cat{text-decoration:none;color:var(--basil);font-weight:700}
.post h1{font-family:"Fraunces",Georgia,serif;font-size:clamp(1.9rem,4.5vw,2.8rem);line-height:1.1;margin:8px 0 14px}
.post .meta{color:var(--mute);font-size:.95rem;margin-bottom:22px}
.post .hero-img{border-radius:6px;margin:0 0 26px;width:100%;aspect-ratio:4/5;object-fit:cover}
.post h2{font-family:"Fraunces",Georgia,serif;font-size:1.45rem;margin:34px 0 10px}
.post p{margin:0 0 18px}
.post ul{padding-left:22px}
.cta{display:block;background:var(--tomato);color:#fff;text-align:center;text-decoration:none;font-weight:800;font-size:1.1rem;padding:16px 20px;border-radius:8px;margin:28px 0}
.cta:hover{background:#A9321F}
.cta.small{display:inline-block;padding:10px 18px;font-size:1rem;margin:0}
.note{background:#FFF4D6;border-left:4px solid var(--wheat);padding:14px 18px;margin:24px 0;font-size:.98rem}

/* footer */
.site-foot{border-top:1px solid var(--line);color:var(--mute);font-size:.9rem}
.site-foot .wrap{max-width:var(--max);margin:0 auto;padding:22px 20px;display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between}
.site-foot a{color:var(--mute);margin-right:14px}
@media (max-width:600px){nav{display:none}}