/* MIEKATA B: 検討情報・FAQ・比較計算。既存ページへ隔離した mb- 名前空間で追加。 */
:root{--mb-ink:var(--ds-ink,#1b1e2b);--mb-text:#3d4456;--mb-line:#dfe6f2;--mb-bg:#f4f5f7;--mb-white:#fff;--mb-blue:var(--ds-blue,#2448d8);--mb-ease:cubic-bezier(.43,.05,.17,1)}
/* 余白・幅・見出しスケールをネイティブの .section/.wrap（padding-block 100px・幅 calc(100% - 160px)/max 1200px・見出し clamp）に合わせて統一（2026-10-29 デザイン磨き） */
html body:is(#m#m#m#m#m#m#m#m#m#m#m#m#m#m,*) .mb-section{padding:100px 0!important;background:var(--mb-white);color:var(--mb-ink)}
html body .mb-section:nth-of-type(even){background:var(--mb-bg)}
html body .mb-inner{width:calc(100% - 160px);max-width:1200px;margin-inline:auto}
html body .mb-inner>h2{font-size:clamp(26px,2.8vw,38px);line-height:1.5;max-width:900px;margin:0 0 28px;font-weight:700;letter-spacing:-.01em;word-break:auto-phrase}
html body .mb-inner p{max-width:720px;font-size:17px;line-height:1.9;font-weight:400;color:var(--mb-text);margin:16px 0 0;letter-spacing:.03em}
html body .mb-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:28px}
html body .mb-card{border:1px solid var(--mb-line);border-radius:16px;padding:24px;background:var(--mb-white);box-shadow:none;min-width:0}
html body .mb-card h3{font-size:20px;line-height:1.6;margin:0;font-weight:700;word-break:auto-phrase}
html body .mb-related{display:flex;flex-wrap:wrap;gap:8px 24px;margin-top:24px}
html body .mb-related a{padding:12px 0;color:var(--mb-blue);min-height:44px}
html body .mb-inner a:focus-visible,html body .mb-inner :is(input,select,summary,button):focus-visible{outline:2px solid var(--mb-blue);outline-offset:3px}
html body .mb-faq{max-width:800px;scroll-margin-top:120px}
html body .mb-faq details{border-bottom:1px solid var(--mb-line);padding:0;background:var(--mb-white)}
html body:is(#m#m#m#m#m#m#m#m#m#m#m#m#m#m,*) .mb-faq summary{display:flex;align-items:center;justify-content:space-between;gap:24px;cursor:pointer;padding:24px 16px!important;font-size:18px;font-weight:700;list-style:none}
html body .mb-faq summary::-webkit-details-marker{display:none}
html body .mb-faq summary::after{display:none!important}
html body .mb-faq summary span{flex-shrink:0;font-family:'Barlow',sans-serif}
html body .mb-faq details[open] summary span{transform:rotate(45deg)}
html body .mb-faq details p{padding:0 16px 24px;margin:0;max-width:720px}
html body .mb-calculator{max-width:1000px;margin-top:24px}
html body .mb-calculator label{display:flex;flex-direction:column;gap:8px;font-size:14px;font-weight:500;min-width:0}
html body .mb-calculator :is(input,select){width:100%;min-width:0;min-height:48px;border:1px solid var(--mb-line);border-radius:12px;padding:12px;font-size:16px;background:var(--mb-white);color:var(--mb-ink)}
html body .mb-calculator button{margin-top:24px}
html body #mb-result{margin:24px 0;padding:24px;background:var(--mb-bg);border-radius:12px}
html body #mb-result strong{font:700 28px/1.5 'Barlow','Noto Sans JP',sans-serif}
html body .mb-inner .mb-small{font-size:13px}
@media(max-width:767px){html body:is(#m#m#m#m#m#m#m#m#m#m#m#m#m#m,*) .mb-section{padding:64px 0!important}html body .mb-inner,html body main>.mb-related{width:calc(100% - 40px)}html body .mb-grid{grid-template-columns:1fr;gap:16px}html body .mb-card{padding:20px}html body .mb-inner>h2{font-size:24px}html body .mb-card h3,html body .mb-faq summary{font-size:18px}}
@media(prefers-reduced-motion:reduce){html body .mb-section *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* FAQの分類リンクは本文と同じ左端にそろえる。 */
html body main>.mb-related{width:calc(100% - 160px);max-width:1200px;margin:32px auto 0;padding:0}

/* 実績詳細（/miekata/works/[slug]）：メイン画像・メタ・本文・操作ボタン */
html body .mwk-detail-hero{margin:0 0 32px;border-radius:16px;overflow:hidden;border:1px solid var(--mb-line)}
html body .mwk-detail-hero img{display:block;width:100%;height:auto}
html body .mb-metas{display:flex;flex-wrap:wrap;gap:12px 28px;margin:0 0 28px;padding:0}
html body .mb-metas>div{display:flex;gap:8px;align-items:baseline}
html body .mb-metas dt{margin:0;font-size:13px;font-weight:700;color:var(--mb-text)}
html body .mb-metas dd{margin:0;font-size:14px;color:var(--mb-ink)}
html body .mb-prose{margin:0}
html body .mwk-detail-actions{display:flex;flex-wrap:wrap;gap:16px;margin-top:40px}
html body .mwk-detail-actions .mwk-act{display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:12px 28px;border-radius:999px;border:1px solid var(--mb-blue);background:var(--mb-white);color:var(--mb-blue);font-size:15px;font-weight:700;text-decoration:none}
html body .mwk-detail-actions .mwk-act-primary{background:var(--mb-blue);color:#fff}
html body .mwk-detail-actions .mwk-act:hover{opacity:.9}
