/* ============ tokens ============ */
:root{
  --bg:#FFFFFF; --panel:#F5F7F5; --panel2:#EEF3F1;
  --ink:#232A28; --ink-2:#5B6360;
  --accent:#2F6E64; --accent-d:#245349; --accent2:#557C93;
  --line:#DCE3E0; --warn:#A6472F;
  --ff-head:"Zen Kaku Gothic New",system-ui,-apple-system,"Segoe UI",sans-serif;
  --ff-body:"Noto Sans JP",system-ui,-apple-system,"Segoe UI",sans-serif;
  --wrap:1120px;
  --pad:20px;
  --gap-sec:56px;
}
@media(min-width:768px){ :root{ --pad:40px; --gap-sec:96px; } }

*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
@media(prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } }
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:var(--ff-body); font-size:16px; line-height:1.9;
  font-feature-settings:"palt"; -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; height:auto; display:block; }
a{ color:var(--accent-d); text-underline-offset:.18em; text-decoration-thickness:1px; }
h1,h2,h3,.lead,.chip,summary{ font-family:var(--ff-head); word-break:auto-phrase; text-wrap:pretty; }
h1,h2,h3{ line-height:1.5; margin:0; font-weight:700; letter-spacing:.01em; }
p{ margin:0 0 1em; }
:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; border-radius:3px; }

.skip-link{
  position:absolute; left:12px; top:-48px; background:var(--accent); color:#fff;
  padding:8px 14px; border-radius:6px; z-index:200; transition:top .15s;
  font-family:var(--ff-head); text-decoration:none;
}
.skip-link:focus{ top:12px; }

.wrap{ width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:var(--pad); }

/* ============ signature rule + label ============ */
.rule{ display:flex; align-items:center; gap:14px; margin-bottom:22px; }
.rule::after{ content:""; flex:1; height:1px; background:var(--line); }
.rule span{
  font-family:var(--ff-head); font-weight:700; font-size:.82rem; letter-spacing:.14em;
  color:var(--accent); white-space:nowrap;
}

/* ============ header ============ */
.site-header{
  position:sticky; top:0; z-index:100; background:rgba(255,255,255,.94);
  backdrop-filter:saturate(1.1) blur(6px); border-bottom:1px solid var(--line);
}
.site-header__inner{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  min-height:64px;
}
.site-logo{ display:inline-flex; align-items:center; gap:9px; text-decoration:none; color:var(--ink); }
.site-logo svg{ width:24px; height:24px; flex:none; color:var(--accent); }
.site-logo b{ font-family:var(--ff-head); font-weight:700; font-size:1.18rem; letter-spacing:.04em; }
.site-logo small{ font-size:.62rem; letter-spacing:.22em; color:var(--ink-2); margin-left:2px; }

.nav{ display:flex; align-items:center; gap:22px; }
.nav a{
  font-family:var(--ff-head); font-size:.92rem; color:var(--ink); text-decoration:none;
  padding:6px 2px; border-bottom:2px solid transparent;
}
.nav a:hover{ border-bottom-color:var(--accent); }
.nav a.is-check{
  border:1px solid var(--accent); border-radius:999px; padding:7px 16px; color:var(--accent-d);
}
.nav a.is-check:hover{ background:var(--panel2); border-bottom-color:var(--accent); }

.nav-toggle{
  display:none; width:44px; height:44px; border:1px solid var(--line); border-radius:9px;
  background:var(--bg); cursor:pointer; align-items:center; justify-content:center;
}
.nav-toggle svg{ width:22px; height:22px; color:var(--ink); }

@media(max-width:860px){
  .nav-toggle{ display:inline-flex; }
  .nav{
    position:fixed; inset:64px 0 auto 0; flex-direction:column; align-items:stretch; gap:0;
    background:var(--bg); border-bottom:1px solid var(--line);
    padding:8px var(--pad) 20px; transform:translateY(-8px); opacity:0; pointer-events:none;
    transition:opacity .18s, transform .18s;
  }
  .nav.is-open{ opacity:1; transform:none; pointer-events:auto; }
  .nav a{ padding:14px 2px; border-bottom:1px solid var(--line); }
  .nav a.is-check{ margin-top:12px; border:1px solid var(--accent); text-align:center; }
}

/* ============ hero / FV ============ */
.hero{ background:var(--panel); border-bottom:1px solid var(--line); }
.hero__grid{
  display:grid; gap:34px 48px; align-items:center;
  padding-block:clamp(40px,7vw,76px);
}
@media(min-width:900px){ .hero__grid{ grid-template-columns:minmax(0,1fr) minmax(0,46%); } }
.hero__eyebrow{
  font-family:var(--ff-head); font-weight:700; font-size:.8rem; letter-spacing:.14em;
  color:var(--accent); margin-bottom:16px;
}
.hero h1{ font-size:clamp(27px,4.6vw,42px); line-height:1.42; letter-spacing:.02em; }
.hero__sub{ margin:18px 0 26px; max-width:34em; color:#33403c; }

.chips{ display:flex; flex-wrap:wrap; gap:10px; }
.chip{
  display:inline-flex; align-items:center; gap:8px; text-decoration:none;
  background:var(--bg); border:1px solid var(--line); border-radius:999px;
  padding:9px 15px 9px 12px; color:var(--ink); font-size:.9rem; font-weight:500;
  transition:border-color .15s, background .15s;
}
.chip:hover{ border-color:var(--accent); background:var(--panel2); }
.chip svg{ width:20px; height:20px; color:var(--accent); flex:none; }

/* FV diagram */
.fv-fig{ margin:0; }
/* ファーストビューの補助写真。主役は下の家断面図のため、高さを抑えて控えめに配置する。 */
.fv-photo{
  width:100%; height:auto; max-height:220px; object-fit:cover;
  display:block; border-radius:14px; margin-bottom:14px;
  box-shadow:0 1px 3px rgba(35,42,40,.08);
}
@media(max-width:767px){
  .fv-photo{ max-height:150px; margin-bottom:10px; }
}
.fv-fig figcaption{
  font-size:.8rem; color:var(--ink-2); margin-top:10px; text-align:center;
  font-family:var(--ff-head); letter-spacing:.02em;
}
.house{ width:100%; height:auto; display:block; }
.house .struct{ fill:none; stroke:var(--accent); stroke-width:2; stroke-linejoin:round; stroke-linecap:round; }
.house .struct--thin{ stroke:var(--accent2); stroke-width:1.4; }
.house .ground{ stroke:var(--ink-2); stroke-width:1.4; }
.house .fill-soft{ fill:#fff; }
.house .zone-hit{ fill:transparent; cursor:pointer; }
.house .zone-glow{ fill:var(--accent); opacity:.055; transition:opacity .16s; }
.house .zone:hover .zone-glow,
.house .zone:focus-visible .zone-glow,
.house .zone.is-active .zone-glow{ opacity:.14; }
.house .dot{ fill:var(--accent); }
.house .dot-n{ fill:#fff; font-family:var(--ff-head); font-weight:700; font-size:10px; }
.house .z-label{ fill:#33403c; font-family:var(--ff-head); font-size:12px; font-weight:500; }
.house .z-label--r{ text-anchor:end; }
.house .lead-line{ stroke:var(--line); stroke-width:1; }

/* subtle one-time line draw (only when JS on & motion allowed) */
.j .house .outline{ stroke-dasharray:2400; stroke-dashoffset:2400; animation:draw 1.1s .15s ease-out forwards; }
@keyframes draw{ to{ stroke-dashoffset:0; } }
@media(prefers-reduced-motion:reduce){
  .j .house .outline{ stroke-dasharray:none; stroke-dashoffset:0; animation:none; }
}

/* ============ sections ============ */
main{ display:block; }
.sec{ padding-block:var(--gap-sec); }
.sec--panel{ background:var(--panel); border-block:1px solid var(--line); }
.sec--tint{ background:var(--panel2); border-block:1px solid var(--line); }
.sec h2{ font-size:clamp(21px,3.2vw,29px); line-height:1.5; }
.sec > .wrap > p{ max-width:40em; }
.sec__lead{ color:#33403c; margin-top:6px; }

/* empathy */
.empathy p{ font-size:1.04rem; max-width:38em; }
.empathy p:first-of-type{ color:var(--ink); }

/* symptom cards */
.cards{
  list-style:none; margin:26px 0 0; padding:0;
  display:grid; gap:14px; grid-template-columns:1fr;
}
@media(min-width:600px){ .cards{ grid-template-columns:1fr 1fr; } }
@media(min-width:960px){ .cards{ grid-template-columns:1fr 1fr 1fr; } }
.cards a{
  display:block; height:100%; text-decoration:none; color:var(--ink);
  background:var(--bg); border:1px solid var(--line); border-radius:14px; padding:20px 18px;
  transition:border-color .15s, transform .15s, box-shadow .15s;
}
.cards a:hover{ border-color:var(--accent); transform:translateY(-2px); box-shadow:0 6px 20px rgba(35,42,40,.06); }
.cards .ic{
  width:40px; height:40px; border-radius:10px; background:var(--panel2);
  display:flex; align-items:center; justify-content:center; margin-bottom:12px;
}
.cards .ic svg{ width:24px; height:24px; color:var(--accent); }
.cards h3{ font-size:1.02rem; line-height:1.6; }
.cards p{ margin:.4em 0 0; font-size:.88rem; color:var(--ink-2); line-height:1.8; }

/* self-check band */
.selfcheck .wrap{ display:grid; gap:20px; align-items:center; }
@media(min-width:820px){ .selfcheck .wrap{ grid-template-columns:1fr auto; } }
.selfcheck h2{ margin-bottom:8px; }
.selfcheck p{ margin:0; color:#33403c; max-width:44em; }
.btn{
  display:inline-flex; align-items:center; gap:9px; justify-content:center;
  font-family:var(--ff-head); font-weight:700; font-size:.98rem; text-decoration:none;
  background:var(--accent); color:#fff; border:1px solid var(--accent);
  border-radius:999px; padding:14px 26px; white-space:nowrap;
  transition:background .15s, border-color .15s;
}
.btn:hover{ background:var(--accent-d); border-color:var(--accent-d); }
.btn--ghost{ background:transparent; color:var(--accent-d); }
.btn--ghost:hover{ background:var(--panel2); color:var(--accent-d); }
.btn svg{ width:18px; height:18px; }

/* table */
.table-wrap{ overflow-x:auto; margin-top:24px; border:1px solid var(--line); border-radius:14px; }
table.cause{ width:100%; border-collapse:collapse; min-width:640px; font-size:.92rem; background:var(--bg); }
table.cause th,table.cause td{ text-align:left; padding:14px 16px; border-bottom:1px solid var(--line); vertical-align:top; }
table.cause thead th{ background:var(--panel); font-family:var(--ff-head); font-weight:700; color:#33403c; }
table.cause tr:last-child td{ border-bottom:0; }
table.cause td:first-child{ font-weight:500; }
.note-small{ font-size:.82rem; color:var(--ink-2); margin-top:10px; }

/* buckets */
.buckets{ list-style:none; margin:26px 0 0; padding:0; display:grid; gap:14px; }
@media(min-width:820px){ .buckets{ grid-template-columns:repeat(3,1fr); } }
.buckets li{ background:var(--bg); border:1px solid var(--line); border-radius:14px; padding:20px 18px; }
.buckets h3{ font-size:1rem; line-height:1.6; margin-bottom:8px; }
.buckets h3::before{
  content:attr(data-n); display:inline-grid; place-items:center; width:24px; height:24px;
  margin-right:8px; border-radius:7px; background:var(--panel2); color:var(--accent-d);
  font-size:.78rem; vertical-align:2px;
}
.buckets p{ margin:0; font-size:.9rem; color:#3a423f; line-height:1.85; }
.legal-note{
  margin-top:22px; border-left:3px solid var(--warn); background:#faf3f1;
  padding:14px 16px; border-radius:0 10px 10px 0; font-size:.9rem; color:#4a3630;
}
.legal-note strong{ color:var(--warn); }

/* cost + pull */
.cost__grid{ display:grid; gap:22px; margin-top:24px; }
@media(min-width:820px){ .cost__grid{ grid-template-columns:1fr 1fr; } }
.cost__grid .box{ background:var(--bg); border:1px solid var(--line); border-radius:14px; padding:22px 20px; }
.cost__grid h3{ font-size:1.02rem; margin-bottom:8px; }
.cost__grid p{ margin:0 0 .8em; font-size:.93rem; color:#3a423f; }
.cost__grid p:last-child{ margin-bottom:0; }
.pull{
  margin-top:34px; display:flex; align-items:baseline; gap:18px; flex-wrap:wrap;
  border-top:1px solid var(--line); padding-top:26px;
}
.pull b{ font-family:var(--ff-head); font-weight:700; font-size:clamp(56px,12vw,104px); line-height:1; color:var(--accent); }
.pull span{ font-family:var(--ff-head); font-weight:700; font-size:1.05rem; }
.pull small{ display:block; color:var(--ink-2); font-size:.86rem; font-weight:400; margin-top:4px; font-family:var(--ff-body); }

/* about-strip */
.about-strip{ background:var(--panel2); border-block:1px solid var(--line); }
.about-strip .wrap{ padding-block:44px; }
.about-strip p{ max-width:46em; margin:0; color:#33403c; }

/* FAQ */
.faq{ margin-top:24px; border-top:1px solid var(--line); }
.faq details{ border-bottom:1px solid var(--line); }
.faq summary{
  list-style:none; cursor:pointer; padding:18px 40px 18px 0; position:relative;
  font-size:1rem; line-height:1.6; color:var(--ink);
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{
  content:""; position:absolute; right:6px; top:24px; width:12px; height:12px;
  border-right:2px solid var(--accent); border-bottom:2px solid var(--accent);
  transform:rotate(45deg); transition:transform .18s;
}
.faq details[open] summary::after{ transform:rotate(225deg); }
.faq .a{ padding:0 0 20px; color:#3a423f; font-size:.94rem; max-width:44em; }

/* CTA row */
.next .wrap{ display:flex; flex-wrap:wrap; gap:12px; }
.next a{
  flex:1 1 220px; text-align:center; text-decoration:none; font-family:var(--ff-head); font-weight:700;
  border:1px solid var(--line); border-radius:12px; padding:16px 14px; color:var(--accent-d);
  background:var(--bg); transition:border-color .15s, background .15s;
}
.next a:hover{ border-color:var(--accent); background:var(--panel2); }

/* footer */
.site-footer{ background:var(--panel); border-top:1px solid var(--line); }
.site-footer .wrap{ padding-block:44px 34px; }
.foot-grid{ display:grid; gap:26px; }
@media(min-width:760px){ .foot-grid{ grid-template-columns:1.1fr 1fr 1fr; } }
.site-footer h4{ font-family:var(--ff-head); font-size:.82rem; letter-spacing:.12em; color:var(--accent); margin:0 0 12px; }
.site-footer ul{ list-style:none; margin:0; padding:0; }
.site-footer li{ margin:0 0 8px; }
.site-footer a{ color:var(--ink); text-decoration:none; font-size:.9rem; }
.site-footer a:hover{ text-decoration:underline; }
.nap{ font-size:.84rem; color:var(--ink-2); line-height:1.9; white-space:pre-line; }
.foot-bottom{ margin-top:30px; padding-top:20px; border-top:1px solid var(--line); font-size:.8rem; color:var(--ink-2); }
.foot-bottom p{ margin:.3em 0; }

/* reveal */
.reveal{ opacity:0; transform:translateY(12px); transition:opacity .5s ease, transform .5s ease; }
.reveal.is-in{ opacity:1; transform:none; }
@media(prefers-reduced-motion:reduce){ .reveal{ opacity:1; transform:none; transition:none; } }

/* ============ fixed-page hero (not FV) ============ */
.page-hero{ background:var(--panel); border-bottom:1px solid var(--line); }
.page-hero .wrap{ padding-block:clamp(34px,6vw,58px); }
.page-hero .crumb{ font-size:.82rem; color:var(--ink-2); margin:0 0 12px; font-family:var(--ff-head); letter-spacing:.02em; }
.page-hero .crumb a{ color:var(--ink-2); }
.page-hero h1{ font-size:clamp(24px,4vw,36px); line-height:1.45; }
.page-hero .page-lead{ margin:14px 0 0; max-width:40em; color:#33403c; }

/* ============ prose (policy / info pages) ============ */
.prose{ padding-block:var(--gap-sec); }
.prose .wrap{ max-width:760px; }
.prose h2{ font-size:clamp(19px,2.6vw,24px); line-height:1.5; margin:2em 0 .7em; padding-top:1em; border-top:1px solid var(--line); }
.prose h2:first-of-type{ margin-top:0; padding-top:0; border-top:0; }
.prose h3{ font-size:1.02rem; margin:1.6em 0 .5em; }
.prose p{ margin:0 0 1em; }
.prose ul,.prose ol{ margin:0 0 1.2em; padding-left:1.4em; }
.prose li{ margin:0 0 .5em; }
.prose a{ color:var(--accent-d); }
.prose .meta{ font-size:.84rem; color:var(--ink-2); margin-bottom:1.6em; }
.prose .callout{
  background:var(--panel2); border:1px solid var(--line); border-radius:12px;
  padding:16px 18px; margin:1.4em 0; font-size:.92rem;
}
.prose .callout.warn{ background:#faf3f1; border-color:#e7cfc8; border-left:3px solid var(--warn); border-radius:0 12px 12px 0; }
.prose .callout.warn strong{ color:var(--warn); }
.prose dl{ margin:0 0 1.2em; }
.prose dt{ font-family:var(--ff-head); font-weight:700; margin-top:1em; }
.prose dd{ margin:.2em 0 0; }
.contact-slot{
  margin:1.6em 0; border:1px dashed var(--line); border-radius:12px; padding:22px 20px;
  background:var(--panel); font-size:.92rem; color:#3a423f;
}
.contact-slot h3{ margin:0 0 .5em; }

/* ============ self-check tool ============ */
.check{ padding:34px 0 var(--gap-sec); }
.check .wrap{ max-width:720px; }
.check-step{ scroll-margin-top:84px; }
.check-result{ scroll-margin-top:84px; }
.check__intro{ color:#33403c; margin-bottom:6px; }
.check__disc{ font-size:.84rem; color:var(--ink-2); margin:0 0 26px; }
.check__progress{ font-family:var(--ff-head); font-size:.82rem; letter-spacing:.1em; color:var(--accent); margin-bottom:10px; }
.check__bar{ height:4px; background:var(--line); border-radius:999px; overflow:hidden; margin-bottom:24px; }
.check__bar i{ display:block; height:100%; background:var(--accent); width:0; transition:width .3s ease; }
.check-step{ display:none; }
.check-step.is-active{ display:block; }
.check-step h2{ font-size:clamp(19px,2.8vw,24px); line-height:1.5; margin-bottom:6px; }
.check-step .q-note{ font-size:.86rem; color:var(--ink-2); margin:0 0 18px; }
.opts{ list-style:none; margin:0 0 24px; padding:0; display:grid; gap:10px; }
.opts label{
  display:flex; gap:12px; align-items:flex-start; cursor:pointer;
  border:1px solid var(--line); border-radius:12px; padding:14px 16px; background:var(--bg);
  transition:border-color .15s, background .15s; font-size:.95rem;
}
.opts label:hover{ border-color:var(--accent); background:var(--panel2); }
.opts input{ margin-top:.3em; accent-color:var(--accent); flex:none; }
.opts input:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }
.opts label:has(input:checked){ border-color:var(--accent); background:var(--panel2); }
.check-nav{ display:flex; gap:12px; flex-wrap:wrap; }
.check-nav .btn--ghost{ border:1px solid var(--line); }
.check-result{ display:none; }
.check-result.is-active{ display:block; }
.check-result h2{ font-size:clamp(20px,3vw,26px); margin-bottom:6px; }
.result-card{ border:1px solid var(--line); border-radius:14px; padding:20px 18px; margin:16px 0; background:var(--bg); }
.result-card h3{ font-size:1.02rem; margin:0 0 .6em; }
.result-card ul{ margin:0; padding-left:1.3em; }
.result-card li{ margin:0 0 .5em; font-size:.94rem; }
.result-note{ font-size:.86rem; color:var(--ink-2); margin-top:8px; }
.check-safety{
  background:#faf3f1; border:1px solid #e7cfc8; border-left:3px solid var(--warn);
  border-radius:0 12px 12px 0; padding:14px 16px; margin:14px 0 4px; font-size:.92rem; color:#4a3630;
}
.check-safety strong{ color:var(--warn); }
.check-restart{ margin-top:20px; }

/* ============ WordPress: 記事 / 一覧 / 比較 ============ */
.card-thumb{ display:block; border-radius:12px; overflow:hidden; margin-bottom:12px; }
.card-thumb img{ width:100%; height:auto; display:block; }
.card-ex{ margin-top:.4em; font-size:.86rem; color:var(--ink-2); line-height:1.8; }

.pr-label{
  display:inline-block; font-size:.76rem; letter-spacing:.04em; color:var(--ink-2);
  background:var(--bg); border:1px solid var(--line); border-radius:999px; padding:3px 12px; margin:0 0 12px;
  font-family:var(--ff-head);
}
.article-dates{ font-size:.82rem; color:var(--ink-2); margin:14px 0 0; }
.article-dates span{ margin-right:14px; white-space:nowrap; }

.prose.article .wrap{ max-width:760px; }

/* 記事アイキャッチ（設定されている記事だけ表示。空枠は出さない＝single.php の has_post_thumbnail() 判定側で制御） */
.article-eyecatch{ margin:0 0 1.6em; }
.article-eyecatch img{
  display:block; width:100%; height:auto; aspect-ratio:3/2; object-fit:cover;
  border-radius:14px; border:1px solid var(--line);
}

/* 本文中に置く図解・写真（記事2・記事10などで使用） */
.post-body figure.body-figure{ margin:1.8em 0; }
.post-body figure.body-figure img{
  display:block; width:100%; height:auto; aspect-ratio:3/2; object-fit:contain;
  background:var(--bg); border-radius:14px; border:1px solid var(--line);
}
.post-body figure.body-figure figcaption{
  font-size:.82rem; color:var(--ink-2); margin-top:.6em; text-align:center;
}
.article-summary{ }
.article-summary strong{ display:block; margin-bottom:.4em; font-family:var(--ff-head); }
.article-summary ul{ margin:0; padding-left:1.3em; }
.article-summary li{ margin:.35em 0; font-size:.95rem; }

.article-toc{
  border:1px solid var(--line); border-radius:14px; padding:18px 20px; margin:1.6em 0; background:var(--panel);
}
.article-toc .toc-ttl{ font-family:var(--ff-head); font-weight:700; margin:0 0 .5em; font-size:.95rem; }
.article-toc ol{ margin:0; padding-left:1.4em; }
.article-toc li{ margin:.35em 0; font-size:.92rem; }
.article-toc li.toc-l3{ margin-left:1em; list-style:circle; font-size:.88rem; }
.article-toc a{ color:var(--accent-d); }

.article-sources{ border-top:1px solid var(--line); margin-top:2.2em; padding-top:1.4em; }
.article-sources h2{ font-size:1.05rem; border:0; padding:0; margin:0 0 .6em; }
.article-sources ul{ padding-left:1.3em; }
.article-sources li{ font-size:.9rem; margin:.4em 0; word-break:break-word; }

.article-cta{
  margin:2.4em 0; padding:22px 20px; background:var(--panel2);
  border:1px solid var(--line); border-radius:14px;
}
.article-cta__lead{ margin:0 0 14px; font-family:var(--ff-head); font-weight:700; }
.article-cta__row{ display:flex; flex-wrap:wrap; gap:12px; }
.article-cta__row .btn{ flex:1 1 240px; }

.article-changelog{ border-top:1px solid var(--line); margin-top:2.2em; padding-top:1.4em; }
.article-changelog h2{ font-size:1.05rem; border:0; padding:0; margin:0 0 .6em; }
.article-changelog ul{ padding-left:1.3em; }
.article-changelog li{ font-size:.88rem; color:var(--ink-2); margin:.35em 0; }

.next-list{ list-style:none; margin:20px 0 0; padding:0; display:grid; gap:10px; }
.next-list a{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  text-decoration:none; color:var(--accent-d); font-family:var(--ff-head); font-weight:700;
  border:1px solid var(--line); border-radius:12px; padding:16px 18px; background:var(--bg);
  transition:border-color .15s, background .15s;
}
.next-list a:hover{ border-color:var(--accent); background:var(--panel2); }
.next-list svg{ width:18px; height:18px; flex:none; }

/* 比較表 */
table.cmp{ width:100%; border-collapse:collapse; min-width:640px; font-size:.9rem; background:var(--bg); }
table.cmp th,table.cmp td{ text-align:left; padding:12px 14px; border-bottom:1px solid var(--line); vertical-align:top; }
table.cmp thead th{ background:var(--panel); font-family:var(--ff-head); font-weight:700; color:#33403c; }
table.cmp tbody th[scope="row"]{ background:var(--panel); font-weight:700; white-space:nowrap; }
table.cmp tr:last-child td, table.cmp tr:last-child th{ border-bottom:0; }
.cmp-unknown{ color:var(--ink-2); }

/* ページネーション */
.pagination, .page-links{ margin-top:32px; font-family:var(--ff-head); }
.pagination .page-numbers{
  display:inline-block; min-width:40px; text-align:center; padding:8px 10px; margin:0 3px 6px 0;
  border:1px solid var(--line); border-radius:9px; text-decoration:none; color:var(--ink);
}
.pagination .page-numbers.current{ background:var(--accent); color:#fff; border-color:var(--accent); }
.pagination a.page-numbers:hover{ border-color:var(--accent); }
.news-empty{ color:var(--ink-2); }

/* 検索フォーム */
.search-form{ display:flex; gap:8px; max-width:420px; margin-top:16px; }
.search-form input[type="search"]{
  flex:1; border:1px solid var(--line); border-radius:10px; padding:10px 12px; font:inherit;
}
.search-form button{
  border:1px solid var(--accent); background:var(--accent); color:#fff; border-radius:10px;
  padding:10px 18px; font-family:var(--ff-head); font-weight:700; cursor:pointer;
}


/* ============ お問い合わせフォーム（[iehen_contact_form]） ============ */
.iehen-cf{ margin:1.4em 0; display:grid; gap:18px; max-width:640px; }
.iehen-cf__row{ display:grid; gap:6px; margin:0; }
.iehen-cf label{ font-family:var(--ff-head); font-weight:700; font-size:.92rem; color:#33403c; }
.iehen-cf input[type="text"],
.iehen-cf input[type="email"],
.iehen-cf textarea{
  width:100%; box-sizing:border-box; font:inherit; font-size:16px; line-height:1.7;
  color:var(--ink); background:var(--bg);
  border:1px solid var(--line); border-radius:10px; padding:12px 14px;
}
.iehen-cf textarea{ resize:vertical; min-height:150px; }
.iehen-cf input:focus-visible,
.iehen-cf textarea:focus-visible{ outline:2px solid var(--accent); outline-offset:1px; border-color:var(--accent); }
.iehen-cf [aria-invalid="true"]{ border-color:var(--warn); }
.iehen-cf__note{ font-size:.88rem; color:#3a423f; margin:0; }
.iehen-cf__agree label{
  display:flex; gap:10px; align-items:flex-start; cursor:pointer;
  font-family:var(--ff-body); font-weight:500; font-size:.95rem; color:var(--ink);
}
.iehen-cf__agree input{ margin-top:.25em; flex:none; width:18px; height:18px; accent-color:var(--accent); }
.iehen-cf__err{ color:var(--warn); font-size:.86rem; }
.iehen-cf__alert{
  background:#faf3f1; border:1px solid #e7cfc8; border-left:3px solid var(--warn);
  border-radius:0 10px 10px 0; padding:12px 14px; margin:0; font-size:.9rem; color:#8a3b2c;
}
.iehen-cf__submit{ margin:4px 0 0; }
.iehen-cf__submit .btn{ width:100%; max-width:320px; min-height:48px; }
.iehen-cf__submit .btn[disabled]{ opacity:.6; cursor:default; }
.iehen-cf__hp{ position:absolute !important; left:-9999px !important; top:auto; width:1px; height:1px; overflow:hidden; }
@media(max-width:420px){
  .iehen-cf__submit .btn{ max-width:none; }
}

/* ============ 地域選択式のASP CTA（[iehen_area_cta]） ============ */
.area-cta{ margin:1.8em 0; border:1px solid var(--line); border-radius:12px; padding:18px 16px; background:var(--panel); }
.area-cta__lead{ font-size:.86rem; color:#3a423f; margin:0 0 12px; }
.area-cta__field{ display:grid; gap:6px; margin:0 0 10px; max-width:360px; }
.area-cta__field label{ font-family:var(--ff-head); font-weight:700; font-size:.9rem; color:#33403c; }
.area-cta__select{
  width:100%; box-sizing:border-box; font:inherit; font-size:16px; line-height:1.6;
  color:var(--ink); background:var(--bg); border:1px solid var(--line); border-radius:10px; padding:11px 12px;
}
.area-cta__select:focus-visible{ outline:2px solid var(--accent); outline-offset:1px; border-color:var(--accent); }
.area-cta__result{ margin-top:4px; }
.area-cta__none{ font-size:.9rem; color:#3a423f; margin:0; }
/* 対象サービスが複数あるときに並べるための最小限のラッパー。順位を意味しない並列表示。 */
.area-cta__list{ display:grid; gap:12px; }
.area-cta__rank-note{ font-size:.78rem; color:var(--ink-2); margin:0; }
.area-cta__name{ font-family:var(--ff-head); font-weight:700; font-size:.94rem; margin:0 0 4px; color:var(--ink); }
.area-cta__feature{ font-size:.86rem; color:var(--ink-2); margin:0 0 10px; }
.area-cta__ad{ position:relative; border:1px solid var(--line); border-radius:10px; padding:14px; background:var(--bg); }
.area-cta__tag{
  display:inline-block; font-family:var(--ff-head); font-weight:700; font-size:.72rem; letter-spacing:.04em;
  color:var(--ink-2); border:1px solid var(--line); border-radius:4px; padding:1px 7px; margin-bottom:9px;
}
.area-cta__btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-family:var(--ff-head); font-weight:700; font-size:.94rem; line-height:1.55; text-decoration:none;
  color:#fff; background:var(--accent); border:1px solid var(--accent); border-radius:999px; padding:12px 20px;
  transition:background .15s, border-color .15s;
}
.area-cta__btn:hover{ background:var(--accent-d); border-color:var(--accent-d); }
/* CTAボタンは <a>。記事本文の共通リンク色 .prose a{color:var(--accent-d)}（詳細度 0,1,1）が
   .area-cta__btn（0,1,0）に勝ち、濃い緑地（--accent）に暗い緑文字（--accent-d）で表示されていた
   （コントラスト比 約1.4:1）。ボタンのリンク各状態を白字に固定してコントラストを確保する。
   背景色・余白・角丸・サイズ・配置は変更しない。他のボタン／通常リンクには影響しない。 */
.area-cta__ad a.area-cta__btn,
.area-cta__ad a.area-cta__btn:link,
.area-cta__ad a.area-cta__btn:visited,
.area-cta__ad a.area-cta__btn:hover,
.area-cta__ad a.area-cta__btn:focus,
.area-cta__ad a.area-cta__btn:focus-visible,
.area-cta__ad a.area-cta__btn:active{ color:#fff; }
.area-cta__ad a.area-cta__btn:focus-visible{ outline:2px solid #fff; outline-offset:2px; }
.area-cta__note{ font-size:.8rem; color:var(--ink-2); margin:10px 0 0; }
.area-cta__px{ position:absolute; width:1px; height:1px; overflow:hidden; border:0; }
@media(max-width:420px){
  .area-cta__btn{ display:flex; width:100%; box-sizing:border-box; text-align:center; }
}

/* ============ トップページ：記事への導線（front-page.php） ============ */
.cards li{ display:flex; flex-direction:column; }
.cards li > a{ flex:1 1 auto; }
.card-more{ margin:8px 0 0; font-size:.85rem; line-height:1.6; }
.card-more a{ font-family:var(--ff-head); font-weight:700; color:var(--accent-d); text-decoration:none; }
.card-more a:hover{ text-decoration:underline; }
.sec__more{ margin:16px 0 0; font-size:.92rem; }
.sec__more a{ font-family:var(--ff-head); font-weight:700; color:var(--accent-d); }
.sec__more a:hover{ text-decoration:none; }
.cost__grid .box .sec__more{ margin:12px 0 0; font-size:.9rem; }
.cost__grid .box .sec__more a{ color:var(--accent-d); }
/* 「まず読む5記事」を順番として見せる小さな番号（1〜5・全カード同じ扱い） */
.cards--flow{ counter-reset:flow; }
.cards--flow li{ counter-increment:flow; }
.cards--flow li > a{ position:relative; }
.cards--flow li > a::before{
  content:counter(flow); position:absolute; top:-11px; left:16px;
  min-width:22px; height:22px; padding:0 5px; box-sizing:border-box;
  display:inline-flex; align-items:center; justify-content:center;
  font-family:var(--ff-head); font-weight:700; font-size:.78rem;
  color:#fff; background:var(--accent); border-radius:999px;
}