/* ぬりたび BLOG — 御朱印テーマ共通スタイル */
:root{
  --washi:#ece3d0; --washi-card:#f4eede; --sumi:#1c1a17; --sumi-soft:#3a352d;
  --shu:#c8102e; --ai:#1b3a5b; --muted:#6b6250; --line:#d9cdb3;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--washi); color:var(--sumi);
  font-family:"Noto Sans JP",-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN",sans-serif;
  line-height:1.85; font-size:17px; -webkit-font-smoothing:antialiased;
  background-image:radial-gradient(rgba(180,165,135,.10) 1px,transparent 1px);background-size:5px 5px;
}
.wrap{max-width:720px;margin:0 auto;padding:0 22px}
a{color:var(--ai);text-decoration:none;border-bottom:1px solid rgba(27,58,91,.25)}
a:hover{border-bottom-color:var(--ai)}
:focus-visible{outline:3px solid var(--shu);outline-offset:2px;border-radius:3px}

/* header */
.site-head{border-bottom:1px solid var(--line);background:rgba(236,227,208,.85);position:sticky;top:0;backdrop-filter:blur(6px);z-index:10}
.site-head .wrap{display:flex;align-items:center;justify-content:space-between;height:60px}
.brand{font-weight:900;font-size:1.2rem;color:var(--sumi);border:none;letter-spacing:.02em}
.brand b{color:var(--shu)}
.site-head nav a{font-size:.92rem;border:none;color:var(--sumi-soft);margin-left:18px}

/* hero / article head */
.eyebrow{font-size:.8rem;letter-spacing:.18em;color:var(--ai);font-weight:700;text-transform:uppercase}
.post-head{padding:54px 0 26px}
h1{font-weight:900;font-size:2.05rem;line-height:1.32;letter-spacing:.01em;margin:14px 0 16px}
.post-meta{font-size:.86rem;color:var(--muted)}
.shu-rule{height:5px;width:64px;background:var(--shu);border-radius:3px;margin:18px 0 0}

/* article body */
article{padding:8px 0 10px}
article h2{font-weight:900;font-size:1.45rem;margin:46px 0 14px;padding-left:16px;border-left:5px solid var(--shu);line-height:1.4}
article h3{font-weight:800;font-size:1.12rem;margin:30px 0 8px;color:var(--sumi)}
article p{margin:0 0 18px}
article ul{margin:0 0 20px;padding-left:0;list-style:none}
article ul li{position:relative;padding-left:26px;margin-bottom:10px}
article ul li::before{content:"";position:absolute;left:2px;top:.72em;width:9px;height:9px;background:var(--shu);border-radius:2px;transform:rotate(8deg)}
article strong{font-weight:800;background:linear-gradient(transparent 62%,rgba(200,16,46,.16) 62%)}
blockquote{background:var(--washi-card);border:1px solid var(--line);border-left:4px solid var(--ai);
  padding:16px 20px;margin:24px 0;border-radius:8px;font-size:.98rem;color:var(--sumi-soft)}

/* CTA seal block */
.cta{background:var(--washi-card);border:1px solid var(--line);border-radius:16px;padding:28px 26px;margin:40px 0;text-align:center;position:relative;overflow:hidden}
.cta h3{font-size:1.18rem;margin:0 0 6px;border:none}
.cta p{color:var(--muted);font-size:.92rem;margin:0 0 18px}
.btn{display:inline-block;background:var(--shu);color:#fff;font-weight:800;font-size:1.02rem;
  padding:14px 30px;border-radius:10px;border:none;box-shadow:0 6px 18px rgba(200,16,46,.28)}
.btn:hover{filter:brightness(1.06)}
.seal{position:absolute;right:-14px;top:-14px;width:96px;height:96px;border:5px solid rgba(200,16,46,.18);
  border-radius:14px;transform:rotate(8deg);display:flex;align-items:center;justify-content:center;
  font-family:"Noto Serif JP",serif;font-weight:900;color:rgba(200,16,46,.2);font-size:1.5rem}

/* blog index cards */
.lead{font-size:1.05rem;color:var(--sumi-soft);margin:0 0 8px}
.card-list{display:grid;gap:18px;padding:10px 0 30px}
.card{display:block;background:var(--washi-card);border:1px solid var(--line);border-radius:14px;padding:22px 24px;color:var(--sumi)}
.card:hover{border-color:var(--shu);transform:translateY(-2px);transition:.15s}
.card .eyebrow{margin-bottom:6px}
.card h2{font-size:1.2rem;border:none;padding:0;margin:0 0 8px;font-weight:800}
.card p{font-size:.92rem;color:var(--muted);margin:0}

/* footer */
.site-foot{border-top:1px solid var(--line);margin-top:50px;padding:34px 0;text-align:center;font-size:.85rem;color:var(--muted)}
.site-foot a{color:var(--ai);border:none;font-weight:700}

@media(max-width:600px){
  body{font-size:16px}
  h1{font-size:1.7rem}
  article h2{font-size:1.28rem}
  .post-head{padding:36px 0 20px}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
