/* ============================================================
   固定ページ専用 (about / contact / privacy / terms)
   ============================================================ */

.page-single { background: var(--bg); }

/* ---- HERO ---- */
.page-hero {
  position: relative;
  padding: 140px 0 64px;
  border-bottom: 1px solid #2b2e36;
  background:
    radial-gradient(ellipse at 80% 20%, rgba(31, 78, 240, .08), transparent 60%),
    var(--bg);
}
.page-hero-inner {
  max-width: 880px;
  margin: 0 auto;
  padding: 0 40px;
}

.page-hero .breadcrumb {
  font-family: "JetBrains Mono", monospace;
  font-size: 11px;
  color: var(--fg-dim);
  letter-spacing: .06em;
  margin-bottom: 28px;
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.page-hero .breadcrumb a {
  color: var(--fg-dim);
  text-decoration: none;
  transition: color .2s;
}
.page-hero .breadcrumb a:hover { color: var(--blue); }
.page-hero .breadcrumb .sep { color: #3a3d44; }
.page-hero .breadcrumb .current { color: #cfcfcf; }

.page-eyebrow {
  font-family: "Archivo", sans-serif;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: .26em;
  color: var(--blue);
  margin-bottom: 18px;
  display: inline-flex;
  align-items: center;
  gap: 12px;
}
.page-eyebrow::before {
  content: "";
  width: 32px;
  height: 1px;
  background: var(--blue);
}

.page-title {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 700;
  font-size: clamp(28px, 4vw, 48px);
  line-height: 1.4;
  color: #fff;
  margin-bottom: 20px;
}

.page-meta {
  font-family: "JetBrains Mono", monospace;
  font-size: 11px;
  color: var(--fg-mute);
  letter-spacing: .06em;
}

/* ---- BODY ---- */
.page-body {
  padding: 80px 0 120px;
}
.page-body-inner {
  max-width: 880px;
  margin: 0 auto;
  padding: 0 40px;
}

.page-content {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-size: 16px;
  line-height: 1.95;
  color: #c5c5c5;
}

.page-content > * + * { margin-top: 24px; }

.page-content p {
  font-size: 16px;
  line-height: 1.95;
  color: #c5c5c5;
  margin-bottom: 24px;
}
.page-content p:last-child { margin-bottom: 0; }
.page-content p.has-large-font-size {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 700;
  font-size: 22px;
  line-height: 1.7;
  color: #fff;
  margin-bottom: 40px;
}

.page-content h2 {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 700;
  font-size: clamp(20px, 2.4vw, 28px);
  line-height: 1.5;
  color: #fff;
  margin: 56px 0 24px;
  padding-left: 20px;
  position: relative;
}
.page-content h2::before {
  content: "";
  position: absolute;
  left: 0;
  top: 6px;
  bottom: 6px;
  width: 4px;
  background: var(--blue);
  box-shadow: 0 0 10px var(--blue-glow);
}

.page-content h3 {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 700;
  font-size: clamp(17px, 1.8vw, 20px);
  line-height: 1.5;
  color: #fff;
  margin: 36px 0 14px;
  display: flex;
  align-items: center;
  gap: 12px;
}
.page-content h3::before {
  content: "";
  width: 8px;
  height: 8px;
  background: var(--blue);
  transform: rotate(45deg);
  flex-shrink: 0;
}

/* 本文の通常リンクのみ青下線（ボタン系は除外） */
.page-content a:not([class]):not(.bcj-cta-button):not(.cta-block-primary):not(.cta-block-secondary),
.page-content p a,
.page-content li a {
  color: var(--blue);
  text-decoration: none;
  border-bottom: 1px solid rgba(31, 78, 240, .4);
  transition: border-color .2s;
}
.page-content p a:hover,
.page-content li a:hover { border-color: var(--blue); }

/* ボタン系は親の指定を優先（青下線を打ち消す） */
.page-content a.bcj-cta-button,
.page-content a.cta-block-primary,
.page-content a.cta-block-secondary,
.page-content a.cta-primary,
.page-content a.cta-ghost,
.page-content a.inline-cta-btn,
.page-content a.cta {
  border-bottom: 0;
}

.page-content strong {
  color: #fff;
  font-weight: 700;
}

.page-content em {
  font-style: italic;
  color: var(--fg-dim);
}

/* ---- リスト ---- */
.page-content ul,
.page-content ol {
  list-style: none;
  padding: 0;
  margin: 24px 0;
}
.page-content li {
  font-size: 15px;
  line-height: 1.9;
  color: #c5c5c5;
  margin-bottom: 12px;
  padding-left: 24px;
  position: relative;
  list-style: none;
}
.page-content ul li::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 10px;
  width: 6px;
  height: 6px;
  background: var(--blue);
  transform: rotate(45deg);
}
.page-content ol { counter-reset: pi; }
.page-content ol li { counter-increment: pi; }
.page-content ol li::before {
  content: counter(pi, decimal-leading-zero);
  position: absolute;
  left: 0;
  top: 1px;
  font-family: "JetBrains Mono", monospace;
  font-size: 12px;
  font-weight: 500;
  color: var(--blue);
  letter-spacing: .04em;
}

/* ---- テーブル（about の運営会社情報など） ---- */
.page-content .wp-block-table,
.page-content figure.wp-block-table {
  margin: 32px 0;
}
.page-content table {
  width: 100%;
  border-collapse: collapse;
  background: #20222a;
  border: 1px solid #2b2e36;
}
.page-content th,
.page-content td {
  padding: 14px 20px;
  text-align: left;
  border-bottom: 1px solid #2b2e36;
  font-size: 14px;
  line-height: 1.7;
}
.page-content th {
  font-family: "JetBrains Mono", monospace;
  font-weight: 500;
  font-size: 12px;
  color: var(--blue);
  letter-spacing: .08em;
  background: #20222a;
  width: 32%;
  vertical-align: top;
}
.page-content td { color: #cfcfcf; }
.page-content tr:last-child th,
.page-content tr:last-child td { border-bottom: 0; }

/* ---- 引用 ---- */
.page-content blockquote {
  margin: 32px 0;
  padding: 12px 0 12px 28px;
  border-left: 2px solid var(--blue);
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 500;
  font-size: 17px;
  line-height: 1.85;
  color: #e0e0e0;
  font-style: italic;
}

/* ---- 中間 CTA (本文に挿入する [bcj_signup_cta] / inline-cta) ---- */
.page-content .bcj-cta-block,
.page-content .inline-cta-inner {
  position: relative;
  margin: 48px 0;
  padding: 28px 32px;
  background: radial-gradient(ellipse at 20% 50%, rgba(31, 78, 240, .12), transparent 60%);
  border: 1px solid rgba(31, 78, 240, .3);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
  transition: all .3s var(--ease-out);
}
.page-content .bcj-cta-block::before { display: none; }
.page-content .bcj-cta-block:hover,
.page-content .inline-cta-inner:hover {
  border-color: rgba(31, 78, 240, .6);
  box-shadow: 0 0 40px rgba(31, 78, 240, .1);
}

/* inner を display:contents で透過させ、子要素を直接 flex する */
.page-content .bcj-cta-inner {
  display: contents;
}

/* 左カラム: eyebrow + heading（テキスト群） */
.page-content .bcj-cta-block .bcj-cta-eyebrow {
  font-family: "Archivo", sans-serif;
  font-weight: 700;
  font-size: 10px;
  letter-spacing: .24em;
  color: var(--blue);
  display: block;
  width: 100%;
  margin-bottom: 6px;
  text-align: left;
  order: 1;
  flex: 0 0 auto;
}
.page-content .bcj-cta-block .bcj-cta-heading {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 700;
  font-size: 17px;
  line-height: 1.5;
  color: #fff;
  margin: 0;
  text-align: left;
  flex: 1 1 calc(100% - 220px);
  min-width: 240px;
  order: 2;
}
.page-content .bcj-cta-block .bcj-cta-subheading {
  display: none;
}
.page-content .bcj-cta-block .bcj-cta-button {
  font-family: "Archivo", sans-serif;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: .14em;
  background: var(--blue);
  color: #fff !important;
  padding: 14px 26px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  transition: all .3s var(--ease-out);
  flex: 0 0 auto;
  order: 3;
  border: 0;
  white-space: nowrap;
}
.page-content .bcj-cta-block .bcj-cta-button:hover {
  background: #fff;
  color: #000 !important;
  gap: 14px;
}
.page-content .bcj-cta-arrow { transition: transform .3s; }
.page-content .bcj-cta-block .bcj-cta-button:hover .bcj-cta-arrow { transform: translateX(2px); }

@media (max-width: 720px) {
  .page-content .bcj-cta-block,
  .page-content .inline-cta-inner {
    padding: 22px 20px;
  }
  .page-content .bcj-cta-block .bcj-cta-heading { flex: 0 0 100%; min-width: 0; }
  .page-content .bcj-cta-block .bcj-cta-button {
    flex: 0 0 100%;
    justify-content: center;
  }
}

/* ---- レスポンシブ ---- */
@media (max-width: 980px) {
  .page-hero { padding: 110px 0 48px; }
  .page-hero-inner { padding: 0 22px; }
  .page-body { padding: 48px 0 80px; }
  .page-body-inner { padding: 0 22px; }
  .page-content th { width: 38%; padding: 12px 14px; font-size: 11px; }
  .page-content td { padding: 12px 14px; font-size: 13px; }
}
