/* ===========================================================
   AiBou skin — 下層ページ用の上書きレイヤー
   各ページの <style> の後ろに読み込む。
   レイアウトには触れず、CSS変数の再定義と書体・装飾の統一だけを行う。
   =========================================================== */

:root{
  --ab-ink:#1A1815;
  --ab-ink-60:#6B6862;
  --ab-ink-35:#A5A19A;
  --ab-panel:#F4F0EC;
  --ab-orange:#F48121;
  --ab-rule:#E3DFD9;

  /* --- 既存ページの変数を差し替える --- */
  --navy:#1A1815;
  --navy-mid:#2A2724;
  --orange:#F48121;
  --sky:#F48121;
  --gray-100:#F4F0EC;
  --gray-200:#E3DFD9;
  --gray-500:#6B6862;
  --gray-700:#4A4744;
  --gray-900:#1A1815;
  --white:#FFFFFF;

  /* blog/ec-gyomu-jidoka（緑基調）用 */
  --primary:#1A1815;
  --accent:#F48121;
  --accent-light:#F4F0EC;
  --accent-mid:#E3DFD9;
  --text:#1A1815;
  --text-secondary:#6B6862;
  --text-muted:#A5A19A;
  --border:#E3DFD9;
  --bg:#FFFFFF;
  --cta-bg:#1A1815;
  --cta-hover:#000000;
  --warn:#F48121;
  --warn-light:#F4F0EC;
}

/* ---------- 書体 ---------- */
html{scroll-behavior:smooth}
body{
  font-family:"Zen Kaku Gothic New","Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif !important;
  line-height:1.9;
  letter-spacing:.02em;
  -webkit-font-smoothing:antialiased;
}
img,svg{max-width:100%;height:auto}
picture{display:contents}

h1{font-weight:400 !important;line-height:1.4;letter-spacing:.02em}
h2{font-weight:500 !important;line-height:1.5;letter-spacing:.02em}
h3,h4{font-weight:500 !important}
::selection{background:var(--ab-orange);color:#fff}

.article-category,.article-date,.article-meta,.breadcrumb,.demo-tag,
.free-badge,.plan-badge,.onboard-tag,.section-label,.updated,
.toc-title,.header-cta,.cta-link,.btn-primary,.btn-secondary,
.cta-btn,.dl-btn,.btn-cta-main,.btn-cta-sub{
  font-family:"M PLUS 1 Code",ui-monospace,monospace !important;
  letter-spacing:.05em;
  font-weight:400 !important;
}

/* ---------- 装飾の平坦化 ---------- */
*{box-shadow:none !important;text-shadow:none !important}
.article-card,.dl-card,.feature-card,.task-card,.problem-card,.forwho-card,
.plan-card,.faq-item,.author-box,.related-articles,.cmp,.def-box,
.highlight-box,.conclusion-box,.info,.why-box,.testimonial-box,
.intro-box,.doc-section,.toc{border-radius:10px !important}
.btn-primary,.btn-secondary,.cta-btn,.dl-btn,.btn-cta-main,.btn-cta-sub,
.header-cta,.cta-link,.btn-line-add{border-radius:4px !important}

/* ヘッダー */
.site-header,.header-inner{border-bottom:1px solid var(--ab-rule) !important}
.site-header .logo img,.logo-wrap img,.header-inner img{height:30px !important;width:auto}
.site-header .cta-link,.header-cta{
  background:var(--ab-ink) !important;color:#fff !important;
  border:1px solid var(--ab-ink) !important;padding:11px 22px !important;font-size:.8rem !important;
}
.site-header .cta-link:hover,.header-cta:hover{background:#000 !important;opacity:1}

/* パンくず */
.breadcrumb{color:var(--ab-ink-35) !important;font-size:.76rem !important;background:transparent !important}
.breadcrumb a{color:var(--ab-ink-60) !important;text-decoration:none}
.breadcrumb a:hover{color:var(--ab-ink) !important}

/* ラベル類 */
.article-category,.demo-tag,.onboard-tag,.industry-tag{
  background:transparent !important;color:var(--ab-ink-60) !important;
  border:1px solid var(--ab-rule) !important;border-radius:4px !important;
  font-size:.72rem !important;padding:5px 12px !important;
}
.article-date,.updated,.dl-note,.cta-note,.table-note,.pricing-note,
.image-caption,.sim-note{color:var(--ab-ink-35) !important;font-size:.74rem !important}

.task-number,.feature-num,.onboard-num,.drawing-step-num,.condition-num{
  font-family:"M PLUS 1 Code",monospace !important;font-weight:500 !important;
}
.article-read-more,.r-title,.sim-highlight,.sim-number,.task-effect{color:var(--ab-orange) !important}

/* 記事見出しの左罫 */
.article-body h2,.article-container h2,.article-section h2,.doc-section h2{
  border-left:2px solid var(--ab-orange) !important;padding-left:16px !important;
}
.article-body a,.article-section a{color:var(--ab-orange) !important}

/* フッター */
.site-footer{
  background:linear-gradient(150deg,#FDF6EF 0%,#F6F1EA 40%,#FAEBDC 100%) !important;
  color:var(--ab-ink-60) !important;border:none !important;
  border-radius:14px 14px 0 0;
}
.site-footer a,.footer-links a{color:var(--ab-ink-60) !important}
.site-footer a:hover{color:var(--ab-ink) !important}

/* 表 */
th,td{border-color:var(--ab-rule) !important}
thead th{font-weight:500 !important}

@media (prefers-reduced-motion:reduce){
  *{animation:none !important;transition:none !important}
}

/* ---- ヘッダーのロゴ ----
   ヘッダー背景が暗いページは <body class="dark-header"> を付けること。
   現在の対象は /mitsumo/terms/ のみ。他はすべて白背景なので黒ロゴのまま。 */
body.dark-header header img[src*="aibou-lockup-h.svg"] {
  content: url("https://aibou365.jp/aibou-lockup-h-white.svg");
}
