/* 2026-11-12 レイアウト整理: 白カード・濃い帯・入口グリッド・強弱。元に戻すにはこのファイルとbuild.mjsのlinkを外す */
:root{--bg:#f6f3ee;--ink:#25322f;--a:#ef7f3c;--a2:#17595a;--soft:#e4f0ee;--line:#dfd6c9}
body{background:var(--bg);font-size:17px;line-height:1.9}
header.site{position:sticky;top:0;z-index:20;background:#fff;border-bottom:4px solid var(--a);box-shadow:0 2px 10px rgba(0,0,0,.06)}
.brand{color:var(--a2)}nav a{font-weight:700;border-bottom:0}
.hero{background:var(--a2);color:#fff;padding:30px 0 26px;margin:0 0 20px;box-shadow:0 0 0 100vmax var(--a2);clip-path:inset(0 -100vmax)}
.hero h1{color:#fff;font-size:clamp(1.8rem,6.4vw,2.7rem);line-height:1.4}
.hero .eyebrow{background:var(--a);color:#fff;font-weight:800}
.hero-copy{color:#d7ebe8}
.hero .four div{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.3);color:#fff}
.hero .four b{color:#ffd1ae}.hero .four span{color:#e6f3f1}
.entry h2{font-size:1.4rem;border:0;padding:0;margin:0 0 12px;color:var(--a2)}
.entry-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:30px}
.entry-grid a{display:block;background:#fff;border:2px solid var(--line);border-top:8px solid var(--a);border-radius:14px;padding:14px 14px 16px;text-decoration:none;color:var(--ink);transition:transform .15s,box-shadow .15s}
.entry-grid a:hover{transform:translateY(-3px);box-shadow:0 8px 18px rgba(0,0,0,.12)}
.entry-grid b{display:block;font-size:1.2rem;line-height:1.4;color:var(--a2);margin-bottom:6px}
.entry-grid span{font-size:.9rem;color:var(--muted);line-height:1.6}
@media(max-width:760px){.entry-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
article{background:#fff;border-radius:18px;padding:20px 20px 28px;box-shadow:0 2px 14px rgba(0,0,0,.06);margin-top:12px}
article h1{color:var(--a2);font-size:clamp(1.6rem,5.4vw,2.1rem);font-weight:800}
article h2{color:var(--a2);font-size:1.4rem;font-weight:800;background:var(--soft);border-left:8px solid var(--a);padding:10px 14px;border-radius:0 10px 10px 0}
.lead{color:var(--a2);font-weight:600}
.answer{border:2px solid var(--a2);background:#f1f9f8}.answer>p{font-size:1.15rem}
.related h2{background:none;border:0;padding:0}
.related li.next a{background:var(--a2);color:#fff;border:0;border-left:10px solid var(--a)}
.related li.next small{color:#ffd1ae}.related li.next h3{color:#fff}.related li.next span{color:#ffd1ae}
footer.site{background:var(--a2)}
.hero .entry h2{color:#fff}