/*
 * Emanon Businessの実DOMで確認した通常ページタイトルのh1だけを非表示にする。
 * 外側のheaderと.article-headerには余白・枠・最小高さ・疑似要素がないことを確認済み。
 * 診断本文内のh1や他の固定ページには影響させない。
 */
body.page-id-10580 .l-content__main > article.article > header:first-child > .article-header > h1 {
  display: none;
}

.sj-diagnosis-wp-page {
  position: relative;
  left: 50%;
  width: 100vw;
  max-width: 100vw;
  margin: 0;
  padding: clamp(36px, 6vw, 76px) 24px;
  overflow: hidden;
  color: #1f5671;
  background:
    radial-gradient(circle at 8% 12%, rgba(42, 123, 155, 0.08), transparent 28%),
    radial-gradient(circle at 92% 88%, rgba(132, 93, 35, 0.08), transparent 30%),
    linear-gradient(180deg, #fffefb 0%, #f6f3eb 100%);
  font-family: var(--ema-body-font-family, -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Yu Gothic", Meiryo, sans-serif);
  transform: translateX(-50%);
}

.sj-diagnosis-wp-page .sj-diagnosis-wrapper {
  width: min(100%, 1132px);
  border-color: rgba(31, 86, 113, 0.14);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 18px 46px rgba(31, 86, 113, 0.1);
}

.sj-diagnosis-wp-page .sj-diagnosis-app {
  min-height: 600px;
  padding: clamp(44px, 6vw, 72px) clamp(20px, 7vw, 82px);
}

.sj-diagnosis-wp-page .sj-diagnosis-title > br,
.sj-diagnosis-wp-page
  .sj-diagnosis-primary-button[data-sj-diagnosis-start] > br,
.sj-diagnosis-wp-page .sj-diagnosis-app > p:empty {
  display: none;
}

.sj-diagnosis-wrapper .sj-diagnosis-start__features {
  list-style: none;
}

.sj-diagnosis-wp-page .sj-diagnosis-title,
.sj-diagnosis-wp-page .sj-diagnosis-question__title,
.sj-diagnosis-wp-page .sj-diagnosis-result__title,
.sj-diagnosis-wp-page .sj-diagnosis-support-card h3 {
  font-family: "Noto Serif JP", "Yu Mincho", "Hiragino Mincho ProN", serif;
}

.sj-diagnosis-wp-page .sj-diagnosis-primary-button {
  border-radius: 9px;
  background: #1f5671;
  box-shadow: 0 12px 26px rgba(31, 86, 113, 0.23);
}

.sj-diagnosis-wp-page .sj-diagnosis-primary-button:hover {
  color: #ffffff;
  background: #173f54;
  box-shadow: 0 16px 30px rgba(31, 86, 113, 0.28);
}

.sj-diagnosis-wp-page .sj-diagnosis-primary-button > span {
  color: #d6b65d;
}

.sj-diagnosis-wp-page .sj-diagnosis-progress__track span {
  background: linear-gradient(90deg, #845d23 0%, #d6b65d 100%);
}

.sj-diagnosis-wp-page .sj-diagnosis-option.is-selected {
  box-shadow: inset 4px 0 0 #caa846, 0 7px 18px rgba(31, 86, 113, 0.08);
}

.sj-diagnosis-wp-page .sj-diagnosis-result__header {
  background: #153f55;
}

.sj-diagnosis-wp-page .sj-diagnosis-result__eyebrow,
.sj-diagnosis-wp-page .sj-diagnosis-result-section__number {
  color: #d6b65d;
}

.sj-diagnosis-wp-page .sj-diagnosis-demo-note {
  color: #74818a;
}

@media screen and (min-width: 768px) {
  .sj-diagnosis-wp-page {
    padding-top: 60px;
    padding-bottom: 60px;
  }
}

@media screen and (max-width: 767.9px) {
  .sj-diagnosis-wp-page {
    padding: 20px 10px 28px;
  }

  .sj-diagnosis-wp-page .sj-diagnosis-wrapper {
    min-height: 0;
    border: 1px solid rgba(31, 86, 113, 0.12);
    border-radius: 12px;
    box-shadow: 0 12px 30px rgba(31, 86, 113, 0.08);
  }

  .sj-diagnosis-wp-page .sj-diagnosis-app {
    min-height: 0;
    padding: 40px 18px;
  }
}

/* =========================================
 * 診断結果：セクション番号 01〜03 の見せ方
 * WP統合CSS側で上書きし、ベースCSSの旧ピル表示を確実に無効化する。
 * ========================================= */
.sj-diagnosis-wp-page .sj-diagnosis-result-section {
  display: block;
}

.sj-diagnosis-wp-page .sj-diagnosis-result-section__number {
  display: flex;
  width: 100%;
  min-width: 0;
  min-height: 0;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin: 0 0 12px;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: #9b6c0e;
  background: transparent;
  box-shadow: none;
  font-size: 20px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.08em;
}

.sj-diagnosis-wp-page .sj-diagnosis-result-section__number::before,
.sj-diagnosis-wp-page .sj-diagnosis-result-section__number::after {
  display: block;
  width: 30px;
  height: 1px;
  border: 0;
  border-radius: 0;
  background: rgba(185, 130, 17, 0.34);
  content: "";
}

.sj-diagnosis-wp-page .sj-diagnosis-result-section h3 {
  text-align: center;
}

@media screen and (max-width: 767.9px) {
  .sj-diagnosis-wp-page .sj-diagnosis-result-section__number {
    gap: 8px;
    margin-bottom: 10px;
  }

  .sj-diagnosis-wp-page .sj-diagnosis-result-section__number::before,
  .sj-diagnosis-wp-page .sj-diagnosis-result-section__number::after {
    width: 22px;
  }
}
