:root{
  --bg:#F6F1E9; --ink:#2E3B36; --muted:#8A8F86; --line:#DDD4C4;
  --sage:#DDE3D5; --sage-ink:#5B6A5F; --clay:#EBD5C5; --clay-ink:#8A5A42;
  --sand:#E8DEC9; --mist:#D8DEDD; --accent:#C8643C;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:'Zen Kaku Gothic New','Hiragino Kaku Gothic ProN','Noto Sans JP',Meiryo,sans-serif;font-size:16px;line-height:1.9;letter-spacing:.04em}
a{color:var(--ink);text-decoration:none}
a:hover{color:var(--accent)}
img{max-width:100%;height:auto}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px}
.narrow{max-width:760px;margin:0 auto;padding:0 24px}
/* header */
.site-header{text-align:center;padding:32px 0 16px}
.logo{display:inline-block;font-weight:500;font-size:26px;letter-spacing:.18em}
.logo-mark{vertical-align:middle;margin-right:10px;margin-top:-6px}
.logo-sub{margin:0;font-size:11px;letter-spacing:.3em;color:var(--muted)}
.nav{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 32px;margin-top:20px;padding:12px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:13px;letter-spacing:.12em}
/* home */
.hero{display:flex;flex-wrap:wrap;gap:20px;padding:32px 0 24px}
.hero-main{flex:2 1 560px;min-width:0;display:flex;flex-direction:column;justify-content:space-between;min-height:440px;padding:36px;background:var(--sage)}
.hero-main .label{font-size:12px;letter-spacing:.2em;color:var(--sage-ink)}
.hero-num{display:block;font-weight:300;font-size:clamp(72px,12vw,120px);line-height:1.05;letter-spacing:0}
.hero-lead{display:block;margin-top:12px;font-weight:500;font-size:clamp(18px,2.4vw,24px);line-height:1.6}
.hero-src{display:block;margin-top:16px;font-size:12px;color:var(--sage-ink)}
.hero-side{flex:1 1 300px;min-width:0;display:flex;flex-direction:column;gap:20px}
.tile{flex:1 1 auto;padding:28px}
.tile .label{font-size:12px;letter-spacing:.2em}
.tile p{margin:12px 0 0;font-weight:500;font-size:19px;line-height:1.7}
.tile-clay{background:var(--clay)}.tile-clay .label{color:var(--clay-ink)}
.tile-sand{background:var(--sand)}.tile-sand .label{color:#7A6B45}
.cats{text-align:center;padding:40px 0 8px}
.cats .eyebrow{margin:0 0 16px;font-size:12px;letter-spacing:.3em;color:var(--muted)}
.pill{display:inline-block;margin:4px 6px;padding:8px 28px;border:1px solid var(--ink);border-radius:24px;font-size:14px}
.section-title{margin:0 0 4px;font-weight:500;font-size:22px;letter-spacing:.12em}
.section-sub{margin:0 0 24px;font-size:13px;color:var(--muted)}
.cards{display:flex;flex-wrap:wrap;gap:24px;padding-bottom:48px}
.card{flex:1 1 300px;min-width:0;display:block}
.card-img{display:flex;align-items:flex-end;height:180px;padding:20px;background:var(--mist);font-weight:300;font-size:56px;letter-spacing:0}
.card-img.soon{background:#E6E0D3;font-size:14px;color:#6B6B60;font-weight:400}
.card .cat{display:block;margin-top:12px;font-size:12px;color:var(--muted);letter-spacing:.15em}
.card .ttl{display:block;font-weight:500;font-size:17px;line-height:1.7}
.card.is-soon{opacity:.65}
/* article */
.crumb{padding:20px 0 0;font-size:12px;color:var(--muted)}
.crumb a{color:var(--muted)}
.art-head{padding:16px 0 8px}
.art-cat{font-size:12px;letter-spacing:.15em;color:var(--sage-ink)}
.art-title{margin:8px 0 12px;font-weight:700;font-size:clamp(24px,4vw,32px);line-height:1.5;letter-spacing:.03em}
.art-meta{font-size:12px;color:var(--muted)}
.pr-box{margin:20px 0;padding:12px 16px;border:1px solid var(--accent);font-size:13px;color:#7A3F26;background:#FBEFE8}
.pr-tag{display:inline-block;margin-right:8px;padding:0 8px;background:var(--accent);color:#fff;font-weight:700;font-size:12px}
.toc{margin:28px 0;padding:20px 24px;border:1px solid var(--line);background:#FBF8F2}
.toc-title{margin:0 0 8px;font-weight:700;font-size:14px;letter-spacing:.12em}
.toc ol{margin:0;padding-left:1.4em;font-size:14px;line-height:2}
.art-body h2{margin:48px 0 16px;padding:0 0 8px;border-bottom:1px solid var(--line);font-weight:700;font-size:22px;line-height:1.6}
.art-body h3{margin:28px 0 8px;font-weight:700;font-size:18px}
.art-body p{margin:0 0 1.2em}
.art-body strong{font-weight:700;background:linear-gradient(transparent 65%,#F1DDB8 65%)}
.art-body ul{margin:0 0 1.2em;padding-left:1.4em}
.table-wrap{overflow-x:auto;margin:0 0 1.2em}
table{border-collapse:collapse;width:100%;min-width:420px;font-size:14px}
th,td{padding:10px 12px;border:1px solid var(--line);text-align:left;vertical-align:top}
th{background:#EFE8DA;font-weight:700}
.note{padding:14px 18px;background:#FBF8F2;border-left:3px solid var(--sage-ink);font-size:14px}
.source{font-size:12px;color:var(--muted);word-break:break-all}
.source-list{font-size:13px;color:var(--muted)}
.source-list li{margin-bottom:4px;word-break:break-all}
.ad-slot{margin:28px 0;padding:16px;border:1px solid var(--line);background:#fff;text-align:center;font-size:14px}
.ad-banner{margin:0 0 8px}
.ad-slot .ad-banner a{display:inline-block;margin:0;padding:0;border:0;background:none;line-height:0}
.ad-slot .ad-banner a::after{content:none}
.ad-slot a{display:inline-block;margin-top:4px;padding:10px 22px;border:1px solid var(--accent);background:#FBEFE8;color:#7A3F26;font-weight:700;text-decoration:none}
.ad-slot a::after{content:' \203A';}
.ad-slot a:hover{background:var(--accent);color:#fff}
.ad-label{display:block;margin-bottom:8px;font-size:11px;letter-spacing:.2em;color:var(--muted)}
.next{margin:48px 0 0;padding:24px 0;border-top:1px solid var(--line)}
.next-title{margin:0 0 8px;font-size:13px;letter-spacing:.15em;color:var(--muted)}
/* pages */
.page h1{margin:24px 0 16px;font-weight:700;font-size:28px}
.page h2{margin:36px 0 8px;font-size:19px}
.page dl{margin:0}.page dt{margin-top:16px;font-weight:700}.page dd{margin:0}
.draft-flag{margin:16px 0;padding:10px 14px;background:#FFF3C4;font-size:13px;color:#6B5A00}
.contact-form input,.contact-form textarea{width:100%;max-width:520px;padding:10px 12px;border:1px solid var(--line);background:#fff;font:inherit;border-radius:2px}
.contact-form button{padding:12px 32px;border:0;background:var(--ink);color:#fff;font:inherit;font-weight:700;cursor:pointer}
.contact-form button:hover{background:var(--accent)}
/* footer */
.site-footer{margin-top:64px;border-top:1px solid var(--line);padding:32px 0 40px;text-align:center}
.foot-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 28px;font-size:13px}
.copy{margin:16px 0 0;font-size:11px;color:var(--muted);letter-spacing:.15em}
@media (max-width:600px){.hero-main{min-height:320px;padding:24px}.tile{padding:20px}}