/* =========================================================
 * STEP-LEGAL-1: 基本固定ページ専用のコンテンツ表示スタイル
 * 対象: body.va-info-page のみ。既存DB画面に影響させない。
 * ========================================================= */

/* 1. レイアウト */
.va-info-page .va-info-main { padding-block: 34px 78px; }
.va-info-page .va-info-main > .va-db-container { max-width: 1080px; }
.va-info-page .va-info-article {
  max-width: 900px;
  margin-inline: auto;
  padding: clamp(25px, 5vw, 62px);
  background: var(--va-surface, #fff);
  border: 1px solid var(--va-line, #e4dbd7);
  border-radius: var(--va-radius-lg, 10px);
  box-shadow: var(--va-shadow-soft, 0 7px 22px rgba(76,56,53,.055));
  overflow-wrap: anywhere;
}

/* 2. 見出し */
.va-info-page .va-info-article-header { margin-bottom: 40px; }
.va-info-page .va-info-eyebrow {
  margin: 0 0 8px;
  font-size: .73rem;
  font-weight: 700;
  letter-spacing: .15em;
  color: var(--va-accent, #9b7b73);
}
.va-info-page .va-info-article-header h1 {
  margin: 0;
  color: var(--va-text-strong, #3f2e2b);
  font-family: var(--va-serif, serif);
  font-size: clamp(1.55rem, 3.2vw, 2.15rem);
  font-weight: 600;
  line-height: 1.45;
  letter-spacing: .02em;
}
.va-info-page .va-info-content h2 {
  margin: 2.3em 0 .9em;
  padding: 0 0 .56em;
  border-bottom: 1px solid var(--va-line-strong, #d8cbc6);
  background: transparent;
  box-shadow: none;
  color: var(--va-text-strong, #3f2e2b);
  font-family: var(--va-serif, serif);
  font-size: clamp(1.16rem, 2.5vw, 1.42rem);
  line-height: 1.5;
}
.va-info-page .va-info-content h3 {
  margin: 1.8em 0 .7em;
  padding-left: .75em;
  border-left: 3px solid var(--va-accent-soft, #cebfbc);
  background: transparent;
  box-shadow: none;
  color: var(--va-text-strong, #3f2e2b);
  font-size: 1.06rem;
  line-height: 1.5;
}
.va-info-page .va-info-content h2:first-child,
.va-info-page .va-info-content h3:first-child { margin-top: 0; }

/* 3. 本文、リスト、リンク */
.va-info-page .va-info-content { color: var(--va-text, #4c3835); font-size: 1rem; line-height: 1.95; }
.va-info-page .va-info-content p { margin: 0 0 1.45em; color: inherit; }
.va-info-page .va-info-content ul,
.va-info-page .va-info-content ol { padding-left: 1.5em; margin: 0 0 1.6em; }
.va-info-page .va-info-content li { margin-bottom: .4em; }
.va-info-page .va-info-content a { color: var(--va-accent-dark, #6e504b); text-decoration: underline; text-underline-offset: 3px; }
.va-info-page .va-info-content a:hover { color: var(--va-accent-deep, #5f423e); }
.va-info-page .va-info-content a:focus-visible { outline: 2px solid var(--va-focus, #8d6d65); outline-offset: 3px; }
.va-info-page .va-info-content img,
.va-info-page .va-info-content iframe { max-width: 100%; }
.va-info-page .va-info-content figure { max-width: 100%; margin: 1.6em 0; }
.va-info-page .va-info-content .wp-block-spacer { max-height: 200px; }

/* 4. 入力フォームが本文にある場合の最小整形。
 *    フォーム機能そのものは変更せず、各プラグインの操作を尊重する。 */
.va-info-page .va-info-content input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
.va-info-page .va-info-content textarea,
.va-info-page .va-info-content select {
  max-width: 100%;
  padding: .65em .8em;
  border: 1px solid var(--va-line-strong, #d8cbc6);
  border-radius: 5px;
  background: #fff;
  color: var(--va-text, #4c3835);
  font: inherit;
}
.va-info-page .va-info-content input[type="submit"],
.va-info-page .va-info-content button[type="submit"] { cursor: pointer; }

/* 5. モバイル */
@media (max-width: 650px) {
  .va-info-page .va-info-main { padding-block: 16px 46px; }
  .va-info-page .va-info-article { padding: 24px 19px 30px; border-radius: 8px; }
  .va-info-page .va-info-article-header { margin-bottom: 26px; }
  .va-info-page .va-info-content { font-size: .96rem; line-height: 1.85; }
  .va-info-page .va-info-content h2 { margin-top: 1.8em; }
}

/* =========================================================
 * STEP-FEEDBACK-6: Feedbackのフォームだけの装飾（プラグイン機能は変更しない）
 * ========================================================= */
.va-info-page.va-feedback-page .va-info-content .wpcf7 form { max-width: 100%; }
.va-info-page.va-feedback-page .va-info-content .wpcf7 label {
  display: block;
  margin-bottom: .45em;
  font-weight: 600;
}
.va-info-page.va-feedback-page .va-info-content .wpcf7 input[type="text"],
.va-info-page.va-feedback-page .va-info-content .wpcf7 input[type="email"],
.va-info-page.va-feedback-page .va-info-content .wpcf7 select,
.va-info-page.va-feedback-page .va-info-content .wpcf7 textarea {
  display: block;
  width: 100%;
  box-sizing: border-box;
  margin-top: .35em;
  border: 1px solid var(--va-line-strong, #d8cbc6);
}
.va-info-page.va-feedback-page .va-info-content .wpcf7 textarea { min-height: 145px; }
.va-info-page.va-feedback-page .va-info-content .wpcf7 input[type="submit"] {
  display: inline-block;
  width: auto;
  min-height: 44px;
  padding: .7em 1.5em;
  background: var(--va-accent-deep, #6e504b);
  color: #fff;
  border: 1px solid transparent;
  border-radius: 6px;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
}
.va-info-page.va-feedback-page .va-info-content .wpcf7 input[type="submit"]:hover {
  filter: brightness(1.08);
}
.va-info-page.va-feedback-page .va-info-content .wpcf7 input[type="submit"]:focus-visible {
  outline: 2px solid var(--va-focus, #8d6d65);
  outline-offset: 3px;
}
@media (max-width: 650px) {
  .va-info-page.va-feedback-page .va-info-content .wpcf7 input[type="submit"] { width: 100%; }
}


/* =========================================================
 * STEP-GUIDE-4: ガイド記事一覧だけの追加スタイル
 * 既存のabout/privacy/contact/feedbackや商品DBには作用させない。
 * ========================================================= */
.va-guide-page .va-guide-index { margin-top: 2.6rem; }
.va-guide-page .va-guide-index > h2 {
  margin: 0 0 1.1rem;
  font-size: clamp(1.1rem, 2.5vw, 1.4rem);
  color: var(--va-text-strong, #3f2e2b);
  font-family: var(--va-serif, serif);
}
.va-guide-page .va-guide-links { display: grid; gap: 12px; }
.va-guide-page .va-guide-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 66px;
  padding: 14px 18px;
  border: 1px solid var(--va-line, #e4dbd7);
  border-radius: 8px;
  color: var(--va-text-strong, #3f2e2b);
  background: var(--va-surface, #fff);
  text-decoration: none;
  font-weight: 600;
  line-height: 1.5;
}
.va-guide-page .va-guide-link:hover,
.va-guide-page .va-guide-link:focus-visible {
  background: #fbf7f5;
  border-color: var(--va-accent-soft, #cebfbc);
  outline-offset: 2px;
}
.va-guide-page .va-guide-link-arrow { flex: 0 0 auto; font-size: 1.25rem; }
@media (max-width: 650px) {
  .va-guide-page .va-guide-link { padding: 13px 14px; min-height: 58px; }
}

/* =========================================================
 * STEP-GUIDE-6: ガイド記事の自然な改行（v1.19.69）
 * 日本語の語句を途中で割るのを減らす。ガイド以外には影響させない。
 * ========================================================= */
.va-guide-page .va-info-article {
  line-break: strict;
  word-break: normal;
  overflow-wrap: break-word; /* 極端に長いURLなどのみ最終手段として折り返す */
}

/* 対応Chromeなどでは日本語の意味のまとまりを考慮して改行。 */
@supports (word-break: auto-phrase) {
  .va-guide-page .va-info-article-header h1,
  .va-guide-page .va-info-content,
  .va-guide-page .va-guide-link > span:first-child {
    word-break: auto-phrase;
  }
}

/* 幅の狭い比較表で、左列「形状・サイズ」「素材・構造」を語中改行しない。 */
@media (max-width: 650px) {
  .va-guide-page .va-info-content .wp-block-table table {
    width: 100%;
    table-layout: auto;
  }
  .va-guide-page .va-info-content .wp-block-table th:first-child,
  .va-guide-page .va-info-content .wp-block-table td:first-child {
    white-space: nowrap;
    width: 1%; /* 左列は必要最小限の幅を確保し、右列へ残りを配分 */
  }
}

/* =========================================================
 * STEP-GUIDE-7: ガイドの2列表の可読性改善 (v1.19.70)
 * ガイド記事のみ。商品DB/商品比較/法律固定ページは対象外。
 * ========================================================= */
.va-guide-page .va-info-content .wp-block-table table {
  width: 100%;
  table-layout: auto;
  border-collapse: collapse;
  font-size: .9rem;
  line-height: 1.65;
}
.va-guide-page .va-info-content .wp-block-table th,
.va-guide-page .va-info-content .wp-block-table td {
  padding: .68em .95em;
  border: 1px solid #e7ded9;
  text-align: left;
  vertical-align: middle;
}
.va-guide-page .va-info-content .wp-block-table thead th {
  background: #f5f1ee;
  color: #3f2e2b;
  font-weight: 700;
  border-bottom: 2px solid #d1bebb;
}
.va-guide-page .va-info-content .wp-block-table tbody td:first-child {
  background: #faf7f5;
  color: #493530;
  font-weight: 700;
}
.va-guide-page .va-info-content .wp-block-table th:first-child,
.va-guide-page .va-info-content .wp-block-table td:first-child {
  width: 27%;
}
@media (max-width: 650px) {
  .va-guide-page .va-info-content .wp-block-table table {
    font-size: .82rem;
    line-height: 1.55;
  }
  .va-guide-page .va-info-content .wp-block-table th,
  .va-guide-page .va-info-content .wp-block-table td {
    padding: .62em .7em;
  }
  .va-guide-page .va-info-content .wp-block-table th:first-child,
  .va-guide-page .va-info-content .wp-block-table td:first-child {
    width: 1%;
    white-space: nowrap;
  }
}
