/* 個別記事ページ */
.article{ padding-top:var(--header-h); }
.art-head{ border-bottom:1px solid var(--hairline); }
.art-head .inner{ max-width:780px; margin-inline:auto; padding-block:clamp(44px,5vw,84px); text-align:center; }
.art-head .meta{ display:flex; gap:14px; justify-content:center; align-items:center; font-family:var(--font-mono); font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-500); margin-bottom:18px; }
.art-head .meta .cat{ color:var(--accent); }
.art-head h1{ font-family:var(--font-display); font-weight:600; font-size:clamp(28px,2.6vw+14px,52px); line-height:1.3; letter-spacing:-.005em; margin:0; }
.art-head .by{ margin-top:22px; font-family:var(--font-mincho); color:var(--ink-700); font-size:14px; }

.art-cover{ max-width:1040px; margin:clamp(28px,3vw,52px) auto 0; padding-inline:clamp(24px,5vw,80px); }
.art-cover .ph{ aspect-ratio:16/9; }

.art-body{ max-width:720px; margin-inline:auto; padding-block:clamp(40px,4vw,72px); }
.art-body p{ font-size:clamp(16px,.4vw+15px,18px); line-height:2.1; color:var(--ink-900); margin:0 0 1.6em; }
.art-body h2{ font-family:var(--font-display); font-weight:600; font-size:clamp(22px,1.4vw+15px,30px); margin:1.8em 0 .7em; }
.art-body .lead{ font-family:var(--font-mincho); font-size:clamp(18px,.6vw+15px,22px); line-height:2; color:var(--ink-700); margin-bottom:1.8em; }
.art-body figure{ margin:2.4em 0; }
.art-body figure .ph{ aspect-ratio:3/2; }
.art-body figcaption{ font-family:var(--font-mono); font-size:11px; letter-spacing:.08em; color:var(--ink-500); margin-top:10px; text-align:center; }
.art-body em{ font-style:normal; background:linear-gradient(transparent 62%, var(--accent-tint) 62%); }

/* 告知ボックス（お知らせトーン） */
.notice{ border:1px solid var(--hairline); border-left:3px solid var(--accent); background:var(--surface); padding:clamp(20px,2.4vw,30px) clamp(22px,2.6vw,34px); margin:2.4em 0; }
.notice .tag{ font-family:var(--font-mono); font-size:10px; letter-spacing:.22em; text-transform:uppercase; color:var(--accent); }
.notice p{ margin:.7em 0 0; font-size:15px; line-height:1.95; }
.notice p:last-child{ margin-bottom:0; }

/* 手書き風メモ片 */
.memo{ background:#fbf6e9; border:1px solid #e6dcc2; box-shadow:0 8px 24px rgba(0,0,0,.07); padding:clamp(20px,2.4vw,30px); margin:2.4em 0; font-family:var(--font-mincho); transform:rotate(-.6deg); }
.memo .pin{ font-family:var(--font-mono); font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:#b08a3c; }
.memo p{ margin:.6em 0 0; font-size:15.5px; line-height:1.9; color:#4a3b2c; }

.art-nav{ border-top:1px solid var(--hairline); }
.art-nav .inner{ max-width:1040px; margin-inline:auto; padding:clamp(28px,3vw,46px) clamp(24px,5vw,80px); display:flex; justify-content:space-between; gap:20px; align-items:center; flex-wrap:wrap; }
.art-nav a{ font-family:var(--font-mono); font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-700); display:inline-flex; gap:9px; align-items:center; }
.art-nav a:hover{ color:var(--accent); }
.art-nav .back{ font-family:var(--font-display); font-style:italic; font-size:16px; text-transform:none; letter-spacing:0; color:var(--accent); }
@media (max-width:767px){ .art-nav .inner{ flex-direction:column; align-items:flex-start; gap:14px; } }