:root{
  --bg:#f5f2e9; --paper:#fffdf7; --ink:#1d2a22; --muted:#667068;
  --green:#123b2b; --gold:#a98b4d; --line:#ded8c8; --shadow:0 14px 36px rgba(30,40,34,.08);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Yu Gothic UI","Yu Gothic","Noto Sans JP",sans-serif;line-height:1.9;letter-spacing:.02em}
a{color:var(--green);text-underline-offset:.2em}
.site-header{border-bottom:1px solid var(--line);background:rgba(245,242,233,.96)}
.header-inner,.container{width:min(900px,calc(100% - 36px));margin:auto}
.header-inner{min-height:70px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{color:var(--green);font-weight:800;letter-spacing:.08em;text-decoration:none}
.header-note{color:var(--muted);font-size:.86rem}
main{padding:42px 0 64px}
.hero{background:linear-gradient(150deg,#163f2e,#0e2c21);color:white;border-radius:24px;padding:44px 42px;box-shadow:var(--shadow);margin-bottom:28px}
.hero .eyebrow{color:#d5c28f;font-size:.82rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase}
.hero h1{margin:.4rem 0 .6rem;font-size:clamp(2rem,5vw,3.2rem);line-height:1.3}
.hero p{margin:0;color:#e5e9e5}
.card{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:28px;margin:16px 0;box-shadow:0 5px 18px rgba(30,40,34,.035)}
.card h2{margin:0 0 10px;font-size:1.16rem;color:var(--green)}
.card p{margin:.35rem 0}
.lead{border-left:4px solid var(--gold);background:#fbf8ee}
.list-link{display:block;text-decoration:none;color:inherit;transition:transform .15s ease,border-color .15s ease}
.list-link:hover{transform:translateY(-1px);border-color:#c4b27e}
.meta{margin-top:30px;padding-top:20px;border-top:1px solid var(--line);color:var(--muted);font-size:.88rem}
footer{color:var(--muted);font-size:.82rem;padding:22px 0 48px}
.badge{display:inline-block;border:1px solid rgba(169,139,77,.45);color:#d9c794;border-radius:999px;padding:.18rem .58rem;font-size:.75rem;margin-top:14px}
@media(max-width:640px){
  .header-inner,.container{width:min(100% - 24px,900px)}
  .header-inner{min-height:62px}.header-note{display:none}
  main{padding:24px 0 42px}.hero{padding:30px 24px;border-radius:18px}.card{padding:22px 20px;border-radius:15px}
}