/*
Theme Name: 採用の右腕
Theme URI: https://migiudee.com/
Author: 株式会社Bojitete
Description: 中小企業向け採用BPOサービス「採用の右腕」専用テーマ。
Version: 1.1.1
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: migiude
*/
/* ============================================================
   採用の右腕 — 中小企業向け AI採用BPO LP
   参考LP（ゼロからはじめるBPO）のデザイン言語＋青ベース配色
     blue #3D89DE / teal #23B0AE / pastel blue gradient / pill 100px
     Noto Sans JP系ゴシック + 英字はJosefin Sans風のジオメトリック
   ※CSPでWebフォント不可のためシステムフォントで近似
   ※パステル単一テーマに意図的にコミット（実サイトを想定）
   ============================================================ */

:root {
  --blue:      #3D89DE;
  --blue-deep: #2569B8;
  --blue-pale: #EEF6FF;
  --teal:       #23B0AE;
  --teal-deep:  #1B9694;
  --grad:       linear-gradient(135deg, #A9CDFF 0%, #B7E3F5 49%, #E7F8FA 100%);
  --grad-soft:  linear-gradient(135deg, #DFEDFF 0%, #E4F4FB 49%, #F2FBFC 100%);
  --white:      #FFFFFF;
  --off:        #F3F6F9;
  --ink:        #2C3542;
  --ink-soft:   #5F6B78;
  --ink-faint:  #93A0AD;
  --line:       #E4EBF2;
  --shadow-sm:  0 2px 10px rgba(97,133,178,.11);
  --shadow:     0 6px 28px rgba(97,133,178,.17);

  --max: min(1680px, 94vw);
  --f: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", "YuGothic",
       "Noto Sans JP", "Helvetica Neue", Arial, sans-serif;
  --f-en: "Avenir Next", "Futura", "Century Gothic", "Josefin Sans",
          "Helvetica Neue", Arial, sans-serif;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  background: var(--white);
  color: var(--ink);
  font-family: var(--f);
  font-size: 16px;
  line-height: 1.95;
  -webkit-font-smoothing: antialiased;
  text-size-adjust: 100%;
  padding-bottom: 84px; /* sticky bar */
}

h1, h2, h3 { margin: 0; font-weight: 700; line-height: 1.5; text-wrap: balance; }
p  { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
a  { color: inherit; }
:focus-visible { outline: 3px solid var(--blue); outline-offset: 3px; border-radius: 4px; }

/* ---------- primitives ---------- */
.wrap { width: 100%; max-width: var(--max); margin-inline: auto; padding-inline: clamp(22px, 3vw, 56px); }
.stack { display: flex; flex-direction: column; }
.center { text-align: center; align-items: center; }

.sec { padding-block: 78px; position: relative; }
.sec--white { background: var(--white); }
.sec--blush { background: var(--blue-pale); }
.sec--grad  { background: var(--grad-soft); }
/* 参考LPの特徴：セクション上端の大きな角丸 */
.cap { border-radius: 100px 100px 0 0; margin-top: -60px; }

/* 見出し：日本語 + 英字ラベル（参考LPの型） */
.head { display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; }
.head h2 { font-size: clamp(1.5rem, 4.4vw, 2.5rem); letter-spacing: .02em; }
.head h2 b { color: var(--blue); font-weight: 700; }
.head .en {
  font-family: var(--f-en); font-size: .8rem; font-weight: 600;
  letter-spacing: .32em; color: var(--blue); text-transform: uppercase;
}
.head .sub { color: var(--ink-soft); font-size: .96rem; max-width: 46rem; margin-top: 6px; }

.mark { background: linear-gradient(transparent 62%, #A9E3F7 62%); font-weight: 700; }

/* ---------- buttons ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 17px 34px; border-radius: 100px; border: 0;
  font-family: var(--f); font-size: 1rem; font-weight: 700; color: var(--white);
  text-decoration: none; cursor: pointer; line-height: 1.4; text-align: center;
  box-shadow: 0 4px 0 rgba(0,0,0,.06);
  transition: transform .16s ease, filter .16s ease;
}
.btn:hover { transform: translateY(-2px); filter: brightness(1.05); }
.btn--blue { background: var(--blue); }
.btn--teal  { background: var(--teal); }
.btn--line  { background: var(--white); color: var(--blue); border: 2px solid var(--blue); box-shadow: none; }
.btn--sm    { padding: 11px 22px; font-size: .84rem; box-shadow: none; }
.btn--lg    { padding: 21px 44px; font-size: 1.06rem; }
.btn small  { display: block; font-size: .74rem; font-weight: 600; opacity: .92; }

/* ---------- header ---------- */
.head-bar { position: sticky; top: 0; z-index: 60; background: rgba(255,255,255,.94); backdrop-filter: blur(8px); }
.head-bar__in { display: flex; align-items: center; gap: 16px; min-height: 68px; }
.logo { display: flex; align-items: center; gap: 9px; text-decoration: none; }
.logo__mark {
  width: 34px; height: 34px; border-radius: 500px; background: var(--grad);
  display: grid; place-items: center; font-family: var(--f-en); font-size: .72rem;
  font-weight: 700; color: #fff; letter-spacing: .02em; flex: none;
}
.logo__txt { font-size: 1.08rem; font-weight: 700; letter-spacing: .04em; line-height: 1.25; }
.logo__txt em { font-style: normal; color: var(--blue); }
.logo__txt span { display: block; font-family: var(--f-en); font-size: .54rem; letter-spacing: .22em; color: var(--ink-faint); font-weight: 600; }
.head-bar__sp { flex: 1; }
.tel { text-decoration: none; text-align: right; line-height: 1.3; display: none; white-space: nowrap; }
.tel__n { font-family: var(--f-en); font-size: 1.3rem; font-weight: 700; letter-spacing: .01em; }
.tel__t { font-size: .64rem; color: var(--ink-faint); letter-spacing: .08em; white-space: nowrap; }
.head-nav { display: none; gap: 20px; font-size: .8rem; font-weight: 600; }
.head-nav a { text-decoration: none; white-space: nowrap; }
.head-nav a:hover { color: var(--blue); }
.head-bar .btn { display: none; white-space: nowrap; }
@media (min-width: 900px) {
  .head-bar .btn { display: inline-flex; }
  .tel { display: block; }
}
@media (min-width: 1400px) { .head-nav { display: flex; } }

/* ---------- hero ---------- */
.hero { background: var(--grad); position: relative; overflow: hidden; padding-block: 56px 108px; }
.hero__ghost {
  position: absolute; left: 50%; top: 52%; transform: translate(-50%,-50%);
  font-family: var(--f-en); font-size: clamp(9rem, 26vw, 22rem); font-weight: 700;
  color: rgba(255,255,255,.42); letter-spacing: .02em; line-height: 1; white-space: nowrap;
  pointer-events: none; user-select: none;
}
.hero__in { position: relative; display: grid; gap: 34px; }
@media (min-width: 940px) { .hero__in { grid-template-columns: 1.05fr .95fr; align-items: center; gap: 48px; } }

.hero__badge {
  display: inline-flex; align-items: center; gap: 8px; align-self: start;
  background: var(--white); color: var(--blue); border-radius: 100px;
  padding: 8px 20px; font-size: .8rem; font-weight: 700; box-shadow: var(--shadow-sm);
}
.hero h1 { font-size: clamp(1.5rem, 4.6vw, 2.35rem); letter-spacing: .01em; line-height: 1.5; }
.hero h1 .lg { display: block; font-size: 1.3em; line-height: 1.4; }
.hero h1 .sm {
  display: block; margin-top: 14px; font-size: .74em; font-weight: 700;
  color: var(--ink-soft); line-height: 1.65;
  padding-left: 15px; border-left: 4px solid var(--blue);
}
/* 日本語が語中で折り返さないよう、意味の切れ目ごとに inline-block で束ねる */
.hero h1 i { font-style: normal; display: inline-block; }
.hero h1 em { font-style: normal; color: var(--blue-deep); }
.hero__tagline {
  display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px;
  align-self: flex-start; background: var(--white); border-radius: 100px;
  padding: 12px 26px; box-shadow: var(--shadow-sm);
  font-size: clamp(.95rem, 2.6vw, 1.2rem); font-weight: 700; line-height: 1.5;
}
.hero__tagline b { color: var(--blue); font-family: var(--f-en); font-size: 1.5em; line-height: 1; }
.hero__tagline i { font-style: normal; display: inline-block; }
.hero__lead { color: #445263; font-size: 1rem; max-width: 30rem; font-weight: 500; }
.hero__cta { display: flex; flex-wrap: wrap; gap: 14px; }

/* 写真置き場（実写真を後から差し込む） */
.shots { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.shot {
  margin: 0; border-radius: 24px; overflow: hidden; background: rgba(255,255,255,.6);
  box-shadow: 0 6px 24px rgba(97,133,178,.18); min-height: 132px;
}
.shot img { display: block; width: 100%; height: 100%; object-fit: cover; }
.shot--tall { grid-row: span 2; border-radius: 100px 100px 24px 24px; min-height: 280px; }
.shot--pill { border-radius: 100px; }

.hero__facts {
  margin-top: 34px; display: grid; grid-template-columns: repeat(auto-fit, minmax(146px,1fr));
  gap: 12px; position: relative;
}
.fact { background: var(--white); border-radius: 20px; padding: 18px 16px; text-align: center; box-shadow: var(--shadow-sm); }
.fact dt { font-size: .7rem; color: var(--ink-faint); letter-spacing: .1em; font-weight: 700; }
.fact dd { margin: 4px 0 0; font-size: 1.2rem; font-weight: 700; color: var(--blue); line-height: 1.4; }
.fact dd small { font-size: .72rem; color: var(--ink-soft); font-weight: 600; }

/* ---------- 悩みカード ---------- */
.worries { display: grid; grid-template-columns: 1fr; gap: 18px; margin-top: 44px; }
@media (min-width: 640px)  { .worries { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1000px) { .worries { grid-template-columns: repeat(3, 1fr); } }
.worry {
  background: var(--white); border-radius: 24px; padding: 26px 24px 24px;
  box-shadow: var(--shadow-sm); display: flex; flex-direction: column; gap: 10px; position: relative;
}
.worry__n {
  width: 42px; height: 42px; border-radius: 500px; background: var(--blue-pale);
  color: var(--blue); font-family: var(--f-en); font-weight: 700; font-size: .95rem;
  display: grid; place-items: center;
}
.worry h3 { font-size: 1.02rem; line-height: 1.6; }
.worry p { font-size: .88rem; color: var(--ink-soft); line-height: 1.8; }

.verdict {
  margin-top: 46px; background: var(--white); border-radius: 100px; padding: 30px 34px;
  text-align: center; box-shadow: var(--shadow); font-size: clamp(1.02rem,2.6vw,1.35rem);
  font-weight: 700; line-height: 1.7;
}
@media (max-width: 620px) { .verdict { border-radius: 30px; padding: 26px 22px; } }

/* ---------- 解決4つ ---------- */
.solves { display: grid; grid-template-columns: 1fr; gap: 18px; margin-top: 46px; }
@media (min-width: 640px)  { .solves { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1080px) { .solves { grid-template-columns: repeat(4, 1fr); } }
.solve { background: var(--white); border-radius: 24px; padding: 30px 24px; text-align: center; box-shadow: var(--shadow-sm); display: flex; flex-direction: column; gap: 12px; align-items: center; }
.solve__ic { width: 66px; height: 66px; border-radius: 500px; background: var(--grad); display: grid; place-items: center; font-family: var(--f-en); font-size: .68rem; font-weight: 700; color: #fff; letter-spacing: .1em; }
.solve h3 { font-size: 1.06rem; }
.solve p { font-size: .88rem; color: var(--ink-soft); line-height: 1.8; text-align: left; }

/* ---------- 理由 ---------- */
.reasons { display: grid; gap: 20px; margin-top: 46px; }
.reason { background: var(--white); border-radius: 30px; padding: 30px 30px; box-shadow: var(--shadow-sm); display: grid; gap: 14px; }
.reason p { max-width: 62rem; }
@media (min-width: 860px) { .reason { grid-template-columns: 84px 1fr; gap: 26px; align-items: start; padding: 34px 38px; } }
.reason__n {
  width: 76px; height: 76px; border-radius: 500px; background: var(--blue); color: #fff;
  display: grid; place-items: center; text-align: center; line-height: 1.15; flex: none;
}
.reason__n b { display: block; font-family: var(--f-en); font-size: 1.5rem; }
.reason__n span { font-size: .58rem; letter-spacing: .14em; }
.reason h3 { font-size: 1.2rem; margin-bottom: 8px; }
.reason h3 b { color: var(--blue); }
.reason p { font-size: .93rem; color: var(--ink-soft); }

/* ---------- テーブル ---------- */
.scroller { overflow-x: auto; margin-top: 44px; border-radius: 24px; box-shadow: var(--shadow-sm); background: var(--white); }
table { border-collapse: collapse; width: 100%; min-width: 660px; font-size: .9rem; }
th, td { padding: 16px 18px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
thead th { background: var(--blue); color: #fff; font-size: .8rem; letter-spacing: .06em; text-align: center; }
thead th:first-child, thead th:nth-child(2) { text-align: left; }
tbody th { font-weight: 700; white-space: nowrap; width: 168px; }
tbody td:nth-child(n+3) { text-align: center; font-weight: 700; }
tbody tr:last-child th, tbody tr:last-child td { border-bottom: 0; }
tbody tr:nth-child(even) { background: #F7FBFF; }
.yes { color: var(--blue); }
.no  { color: var(--ink-faint); font-weight: 400; }
.by-us    { color: var(--blue); }
.by-pro   { color: var(--teal-deep); }
.opt-note { font-size: .82rem; color: var(--ink-soft); margin-top: 18px; }

/* ---------- 追加メニュー見出し ---------- */
.subhead { margin-top: 64px; display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; }
.subhead h3 { font-size: clamp(1.2rem, 3vw, 1.6rem); }
.subhead h3 b { color: var(--teal-deep); }
.subhead .en { font-family: var(--f-en); font-size: .74rem; font-weight: 600; letter-spacing: .3em; color: var(--teal-deep); text-transform: uppercase; }
.subhead p { font-size: .92rem; color: var(--ink-soft); max-width: 40rem; }
.scroller--pro thead th { background: var(--teal); }
.scroller--pro tbody tr:nth-child(even) { background: #F2FBFB; }

/* ---------- できる/できない ---------- */
.split { display: grid; gap: 20px; margin-top: 46px; }
@media (min-width: 860px) { .split { grid-template-columns: 1fr 1fr; } }
.pan { border-radius: 30px; padding: 32px 30px; background: var(--white); box-shadow: var(--shadow-sm); }
.pan--do   { border: 3px solid var(--teal); }
.pan--dont { border: 3px solid #DDE4EC; }
.pan__ttl { display: inline-flex; align-items: center; gap: 9px; border-radius: 100px; padding: 7px 20px; font-size: .95rem; font-weight: 700; color: #fff; margin-bottom: 16px; }
.pan--do   .pan__ttl { background: var(--teal); }
.pan--dont .pan__ttl { background: #8E9BAA; }
.pan li { position: relative; padding: 11px 0 11px 30px; font-size: .91rem; color: var(--ink-soft); border-bottom: 1px dashed var(--line); }
.pan li:last-child { border-bottom: 0; }
.pan li::before { position: absolute; left: 2px; top: 11px; font-weight: 700; }
.pan--do   li::before { content: "○"; color: var(--teal); }
.pan--dont li::before { content: "×"; color: #8E9BAA; }

/* ---------- 料金 ---------- */
.plans { display: grid; grid-template-columns: 1fr; gap: 20px; margin-top: 46px; align-items: start; }
@media (min-width: 900px) { .plans { grid-template-columns: repeat(3, 1fr); } }
.plan { background: var(--white); border-radius: 30px; padding: 34px 28px; box-shadow: var(--shadow-sm); display: flex; flex-direction: column; gap: 16px; position: relative; border: 3px solid transparent; }
.plan--pick { border-color: var(--blue); box-shadow: var(--shadow); }
.plan__badge { position: absolute; top: -15px; left: 50%; transform: translateX(-50%); background: var(--blue); color: #fff; font-size: .74rem; font-weight: 700; padding: 5px 20px; border-radius: 100px; white-space: nowrap; }
.plan h3 { font-size: 1.12rem; text-align: center; }
.plan__price { text-align: center; font-weight: 700; color: var(--blue); font-variant-numeric: tabular-nums; }
.plan__price b { font-family: var(--f-en); font-size: 2.6rem; line-height: 1; }
.plan__price small { font-size: .84rem; color: var(--ink-soft); }
.plan__for { font-size: .85rem; color: var(--ink-soft); text-align: center; }
.plan__list li {
  display: flex; align-items: baseline; justify-content: space-between; gap: 10px;
  font-size: .84rem; color: var(--ink-soft); padding: 9px 2px;
  border-bottom: 1px dashed var(--line);
}
.plan__list li:last-child { border-bottom: 0; }
.plan__list li b { color: var(--blue); font-weight: 700; white-space: nowrap; text-align: right; }
.plan__list li.na { color: var(--ink-faint); }
.plan__list li.na b { color: var(--ink-faint); font-weight: 400; }
.plan .btn { width: 100%; }

/* 休止プラン */
.pause {
  margin-top: 24px; background: var(--white); border-radius: 30px; padding: 28px 32px;
  box-shadow: var(--shadow-sm); border: 2px dashed var(--blue);
  display: grid; gap: 16px; align-items: center;
}
@media (min-width: 780px) { .pause { grid-template-columns: 1fr auto; gap: 32px; } }
.pause h3 { font-size: 1.08rem; margin-bottom: 8px; }
.pause h3 b { color: var(--blue); }
.pause p { font-size: .88rem; color: var(--ink-soft); }
.pause__price { text-align: center; color: var(--blue); font-weight: 700; white-space: nowrap; }
.pause__price span { display: block; font-size: .72rem; color: var(--ink-faint); letter-spacing: .1em; }
.pause__price b { font-family: var(--f-en); font-size: 2.2rem; line-height: 1.1; }
.pause__price small { font-size: .82rem; color: var(--ink-soft); }

/* ---------- 流れ ---------- */
.flow { display: grid; gap: 16px; margin-top: 46px; max-width: 62rem; margin-inline: auto; }
.fl { background: var(--white); border-radius: 24px; padding: 24px 26px; box-shadow: var(--shadow-sm); display: grid; gap: 12px; position: relative; }
@media (min-width: 760px) { .fl { grid-template-columns: 96px 1fr auto; align-items: center; gap: 24px; } }
.fl__n { display: flex; align-items: center; gap: 9px; color: var(--blue); font-weight: 700; }
.fl__n b { font-family: var(--f-en); font-size: 2rem; line-height: 1; }
.fl__n span { font-size: .62rem; letter-spacing: .12em; }
.fl h3 { font-size: 1.04rem; margin-bottom: 4px; }
.fl p { font-size: .88rem; color: var(--ink-soft); }
.fl__when { background: var(--blue-pale); color: var(--blue); font-size: .74rem; font-weight: 700; padding: 7px 16px; border-radius: 100px; white-space: nowrap; justify-self: start; }

/* ---------- FAQ ---------- */
.faq { margin-top: 44px; display: grid; gap: 12px; max-width: 62rem; margin-inline: auto; }
details { background: var(--white); border-radius: 20px; box-shadow: var(--shadow-sm); overflow: hidden; }
summary { cursor: pointer; list-style: none; padding: 20px 52px 20px 56px; position: relative; font-weight: 700; font-size: .98rem; line-height: 1.7; }
summary::-webkit-details-marker { display: none; }
summary::before {
  content: "Q"; position: absolute; left: 18px; top: 18px; width: 28px; height: 28px;
  border-radius: 500px; background: var(--blue); color: #fff; font-family: var(--f-en);
  font-size: .84rem; font-weight: 700; display: grid; place-items: center;
}
summary::after { content: ""; position: absolute; right: 24px; top: 28px; width: 10px; height: 10px; border-right: 2px solid var(--blue); border-bottom: 2px solid var(--blue); transform: rotate(45deg); transition: transform .2s ease; }
details[open] summary::after { transform: rotate(-135deg); }
.faq__a { padding: 0 26px 24px 56px; font-size: .9rem; color: var(--ink-soft); position: relative; }
.faq__a::before {
  content: "A"; position: absolute; left: 18px; top: -2px; width: 28px; height: 28px;
  border-radius: 500px; background: var(--teal); color: #fff; font-family: var(--f-en);
  font-size: .84rem; font-weight: 700; display: grid; place-items: center;
}

/* ---------- 事例プレースホルダ ---------- */
.ph { margin-top: 40px; border-radius: 30px; border: 2px dashed var(--blue); background: var(--white); padding: 30px 28px; }
.ph b { display: block; color: var(--blue); margin-bottom: 8px; }
.ph p { font-size: .89rem; color: var(--ink-soft); }

/* ---------- 導入事例 ---------- */
.cases { display: grid; grid-template-columns: 1fr; gap: 20px; margin-top: 46px; }
@media (min-width: 640px)  { .cases { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1080px) { .cases { grid-template-columns: repeat(4, 1fr); } }
.case {
  background: var(--white); border-radius: 30px; padding: 30px 28px; box-shadow: var(--shadow-sm);
  display: flex; flex-direction: column; gap: 14px; border-top: 6px solid var(--blue);
}
.case__tag {
  display: inline-flex; align-self: flex-start; gap: 8px; background: var(--blue-pale); color: var(--blue);
  border-radius: 100px; padding: 5px 16px; font-size: .74rem; font-weight: 700;
}
.case h3 { font-size: 1.06rem; line-height: 1.6; }
.case__num {
  display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap;
  border-block: 1px solid var(--line); padding-block: 14px;
}
.case__num dt { font-size: .74rem; color: var(--ink-faint); font-weight: 700; width: 100%; letter-spacing: .08em; }
.case__num dd { margin: 0; font-weight: 700; color: var(--blue); font-variant-numeric: tabular-nums; }
.case__num dd b { font-family: var(--f-en); font-size: 2rem; line-height: 1; }
.case__num dd small { font-size: .8rem; color: var(--ink-soft); }
.case__unit { margin-left: auto; background: var(--blue); color: #fff; border-radius: 100px; padding: 5px 14px; font-size: .76rem; font-weight: 700; white-space: nowrap; }
.case p { font-size: .88rem; color: var(--ink-soft); }
.case__todo { font-size: .76rem; color: #C2703A; background: #FFF6EE; border-radius: 10px; padding: 8px 12px; }

/* ---------- AIと人の分担 ---------- */
.divide { display: grid; gap: 18px; margin-top: 46px; align-items: stretch; }
@media (min-width: 880px) { .divide { grid-template-columns: 1fr auto 1fr; gap: 22px; } }
.dv { border-radius: 30px; padding: 30px 28px; display: flex; flex-direction: column; gap: 14px; }
.dv--ai    { background: var(--white); box-shadow: var(--shadow-sm); border: 2px solid var(--line); }
.dv--human { background: var(--blue); color: #fff; box-shadow: var(--shadow); }
.dv__cap { display: inline-flex; align-self: flex-start; border-radius: 100px; padding: 6px 18px; font-size: .76rem; font-weight: 700; letter-spacing: .06em; }
.dv--ai    .dv__cap { background: var(--blue-pale); color: var(--blue); }
.dv--human .dv__cap { background: rgba(255,255,255,.22); color: #fff; }
.dv h3 { font-size: 1.24rem; line-height: 1.5; }
.dv--ai h3 b { color: var(--blue); }
.dv li { position: relative; padding: 9px 0 9px 24px; font-size: .89rem; border-bottom: 1px dashed var(--line); }
.dv li::before { content: ""; position: absolute; left: 4px; top: 1.05em; width: 9px; height: 2px; border-radius: 2px; background: var(--blue); }
.dv--ai li { color: var(--ink-soft); }
.dv--human li { color: #EAF3FF; border-bottom-color: rgba(255,255,255,.25); }
.dv--human li::before { background: #fff; }
.dv li:last-child { border-bottom: 0; }
.dv__tail { margin-top: auto; padding-top: 10px; font-size: .84rem; font-weight: 700; }
.dv--ai .dv__tail { color: var(--blue); }
.dv--human .dv__tail { color: #fff; }
.divide__x {
  display: grid; place-items: center; font-family: var(--f-en); font-size: 1.5rem;
  font-weight: 700; color: var(--blue); letter-spacing: .1em;
}
.divide__lead {
  margin-top: 30px; text-align: center; font-size: clamp(1.02rem, 2.6vw, 1.3rem);
  font-weight: 700; line-height: 1.75;
}

/* ---------- 広告費の運用フロー ---------- */
.adflow { display: grid; gap: 12px; margin-top: 34px; }
@media (min-width: 860px) { .adflow { grid-template-columns: repeat(4, 1fr); gap: 10px; } }
.adstep {
  background: var(--white); border-radius: 20px; padding: 20px 18px; box-shadow: var(--shadow-sm);
  display: flex; flex-direction: column; gap: 8px; position: relative;
}
.adstep__n { font-family: var(--f-en); font-size: .7rem; font-weight: 700; letter-spacing: .14em; color: var(--blue); }
.adstep h4 { margin: 0; font-size: 1rem; font-weight: 700; line-height: 1.5; }
.adstep p { font-size: .82rem; color: var(--ink-soft); line-height: 1.75; }
.adstep--stop { border: 2px solid var(--blue); }
.adstep--stop .adstep h4 { color: var(--blue); }
.adstep--back { border: 2px dashed var(--teal); }
.adstep--back .adstep__n { color: var(--teal); }
@media (min-width: 860px) {
  .adstep:not(:last-child)::after {
    content: ""; position: absolute; right: -12px; top: 50%; z-index: 1;
    width: 9px; height: 9px; border-right: 2px solid var(--blue); border-bottom: 2px solid var(--blue);
    transform: translateY(-50%) rotate(-45deg);
  }
}
.adnote {
  margin-top: 26px; background: var(--white); border-radius: 30px; padding: 28px 32px;
  box-shadow: var(--shadow-sm); border-left: 8px solid var(--teal);
}
.adnote h4 { margin: 0 0 8px; font-size: 1.06rem; font-weight: 700; }
.adnote h4 b { color: var(--teal-deep); }
.adnote p { font-size: .9rem; color: var(--ink-soft); }

/* ---------- 最終CTA ---------- */
.final { background: var(--grad); padding-block: 80px; }
.final__box { background: var(--white); border-radius: 40px; padding: 46px 34px; text-align: center; box-shadow: var(--shadow); display: flex; flex-direction: column; align-items: center; gap: 20px; }
.final__box h2 { font-size: clamp(1.35rem, 4vw, 2.15rem); }
.final__box h2 b { color: var(--blue); }
.final__box > p { color: var(--ink-soft); font-size: .95rem; max-width: 34rem; }
.final__btns { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; }
.final__contacts { display: flex; flex-wrap: wrap; gap: 14px 40px; justify-content: center; margin-top: 6px; }
.final__tel, .final__mail { text-decoration: none; }
.final__tel .tel__n { font-size: 1.9rem; color: var(--ink); }
.final__tel .tel__t, .final__mail .tel__t { font-size: .74rem; }
.final__mail-a {
  font-family: var(--f-en); font-size: 1.35rem; font-weight: 700; color: var(--blue);
  letter-spacing: .01em; word-break: break-all;
}
.final__mail:hover .final__mail-a { text-decoration: underline; }

/* ---------- footer ---------- */
.foot { background: var(--off); padding-block: 40px; font-size: .82rem; color: var(--ink-faint); }
.foot__in { display: flex; flex-wrap: wrap; gap: 14px 30px; align-items: center; }
.foot__in .logo__txt { color: var(--ink); }

/* ---------- sticky bottom bar ---------- */
.dock {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 70;
  background: rgba(255,255,255,.95); backdrop-filter: blur(8px);
  border-top: 1px solid var(--line); padding: 11px 14px;
}
.dock__in { display: flex; gap: 10px; max-width: var(--max); margin-inline: auto; }
.dock .btn { flex: 1; padding: 13px 12px; font-size: .88rem; box-shadow: none; }

/* ---------- reveal ---------- */
.rv { opacity: 0; transform: translateY(16px); transition: opacity .6s ease, transform .6s ease; }
.rv.in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .rv { opacity: 1; transform: none; transition: none; }
  .btn:hover { transform: none; }
}

/* ---------- お問い合わせフォーム（Contact Form 7） ---------- */
.dlform {
  width: 100%; max-width: 34rem; margin: 18px auto 0; text-align: left;
  background: var(--white); border-radius: 4px; padding: 0;
}
.dlform__ttl {
  font-size: 1.15rem; font-weight: 700; color: var(--ink);
  margin-bottom: 4px; text-align: left; letter-spacing: .02em;
}
.dlform__note { font-size: .82rem; color: var(--ink-faint); text-align: left; margin-bottom: 30px; }

/* 各項目 */
.dlform .wpcf7-form > p { margin: 0 0 22px; max-width: none; }
.dlform label { display: block; font-size: .88rem; font-weight: 700; color: var(--ink); margin: 0; }
.dlform .f-label { font-size: .88rem; font-weight: 700; color: var(--ink); margin: 0 0 8px; }
.dlform .req { color: #D14343; font-size: .78rem; font-weight: 700; margin-left: 5px; }
.dlform .wpcf7-form-control-wrap { display: block; margin-top: 9px; }

/* 入力欄 */
.dlform input[type="text"],
.dlform input[type="email"],
.dlform input[type="tel"],
.dlform select,
.dlform textarea {
  width: 100%; box-sizing: border-box; padding: 14px 16px;
  border: 1px solid #DFE3E8; border-radius: 4px; background: var(--white);
  color: var(--ink); font-family: var(--f); font-size: .95rem; font-weight: 400;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.dlform ::placeholder { color: #B9C0C8; }
.dlform textarea { min-height: 150px; resize: vertical; }
.dlform input:focus, .dlform select:focus, .dlform textarea:focus {
  outline: none; border-color: var(--blue); box-shadow: 0 0 0 3px rgba(61,137,222,.14);
}

/* ラジオボタン */
.dlform .wpcf7-list-item { display: block; margin: 0 0 10px; }
.dlform .wpcf7-list-item label { display: flex; align-items: center; gap: 9px; font-weight: 400; font-size: .93rem; cursor: pointer; }
.dlform input[type="radio"] { accent-color: var(--blue); width: 17px; height: 17px; }

/* 送信ボタン：サイトの主要CTAと同じブランドブルーに揃える */
.dlform input[type="submit"] {
  display: block; margin: 36px auto 0; width: 100%; max-width: 22rem; padding: 19px 40px;
  border: 0; border-radius: 4px; background: var(--blue); color: var(--white);
  font-family: var(--f); font-size: 1.02rem; font-weight: 700; letter-spacing: .06em; cursor: pointer;
  box-shadow: 0 4px 14px rgba(61,137,222,.28);
  transition: background-color .15s ease, transform .15s ease, box-shadow .15s ease;
}
.dlform input[type="submit"]:hover {
  background: var(--blue-deep); transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(61,137,222,.34);
}

/* 検証メッセージ */
.dlform .wpcf7-not-valid-tip { color: #D14343; font-size: .78rem; font-weight: 700; margin-top: 6px; }
.dlform .wpcf7-response-output {
  border-radius: 4px; border-width: 1px; margin: 20px 0 0; padding: 14px 16px; font-size: .86rem;
}
.dlform .wpcf7-spinner { display: block; margin: 12px auto 0; }

/* PCでは幅を広げ、短い入力欄を2カラムに（スマホは1カラムのまま） */
@media (min-width: 760px) {
  .dlform { max-width: 52rem; }
  .dlform .wpcf7-form { display: grid; grid-template-columns: 1fr 1fr; gap: 0 26px; align-items: start; }
  .dlform .wpcf7-form > * { grid-column: 1 / -1; }
  .dlform .wpcf7-form > p:has(input[type="text"]),
  .dlform .wpcf7-form > p:has(input[type="email"]),
  .dlform .wpcf7-form > p:has(input[type="tel"]) { grid-column: span 1; }
}
