/*
 * Page-specific layout: privacy-policy — thai-massage
 * 個人情報保護法準拠のプライバシーポリシー。読みやすさ重視の単カラム。
 * 色は variables.css の var(--color-*)（顧客パレット）のみ。Palsea --brand-* は使わない（ルール11）。
 */

.page-privacy__main {
  display: block;
  background: var(--color-bg-main);
}

/* 前文 */
.privacy-intro {
  max-width: 760px;
  margin: 0 auto;
  padding: var(--section-padding-y) var(--container-padding-x) 0;
}

.privacy-intro__body {
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--color-text-secondary);
  margin: 0;
}

/* 条項ブロック群 */
.privacy-structured {
  max-width: 760px;
  margin: 0 auto;
  padding: var(--gap-xl) var(--container-padding-x) var(--section-padding-y);
}

.privacy-section {
  padding: var(--gap-lg) 0;
  border-bottom: 1px solid var(--color-border);
}

.privacy-section:first-child {
  border-top: 1px solid var(--color-border);
}

.privacy-section__title {
  font-family: var(--font-serif-jp);
  font-size: var(--fs-heading-md);
  font-weight: 500;
  line-height: var(--lh-heading);
  color: var(--color-text);
  margin: 0 0 var(--gap-sm);
}

.privacy-section__body {
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--color-text-secondary);
  margin: 0;
}

/* 空配信時の崩れ防止（既存 :empty 非表示方式に準拠） */
.privacy-section__body:empty {
  display: none;
}

/* 事業者・連絡先（定義リスト） */
.privacy-operator__list {
  display: grid;
  grid-template-columns: 8rem 1fr;
  gap: var(--gap-sm) var(--gap-md);
  margin: 0;
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--color-text-secondary);
}

.privacy-operator__list dt {
  font-weight: 500;
  color: var(--color-text);
}

.privacy-operator__list dd {
  margin: 0;
}

/* 改訂日（右寄せ・控えめ） */
.privacy-revised {
  margin: var(--gap-lg) 0 0;
  text-align: right;
  font-size: var(--fs-caption);
  color: var(--color-text-tertiary);
}

/*
 * PR②（ヒアリングのテキスト貼付け）接続点:
 *   rawHtmlOverride が非空のときだけ .privacy-raw が表示され、
 *   兄弟の .privacy-structured（ひな形）を隠す。PR① は raw 空＝ひな形のみ表示。
 *   ※ テンプレ無改修で PR② に接続できるよう CSS だけで出し分ける。
 */
.privacy-raw {
  max-width: 760px;
  margin: 0 auto;
  padding: var(--gap-xl) var(--container-padding-x) var(--section-padding-y);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--color-text-secondary);
}

.privacy-raw:empty {
  display: none;
}

.privacy-raw:not(:empty) ~ .privacy-structured {
  display: none;
}

@media (max-width: 768px) {
  .privacy-operator__list {
    grid-template-columns: 1fr;
    gap: 0;
  }
  /* 1 カラム時は dt の上だけ余白を入れ、dd は dt の直下に密着させる（スペーシングはトークン経由）。 */
  .privacy-operator__list dt {
    margin-top: var(--gap-sm);
  }
  .privacy-operator__list dt:first-of-type {
    margin-top: 0;
  }
}
