/* ============================================================
   privacy.html（個人情報の取扱いについて）専用スタイル
   ------------------------------------------------------------
   読み込み順：common.css → privacy.css
   内容は本番 https://deal-biz.jp/privacy に準拠。
   条文ページなので装飾は最小限にして、白カード＋番号付き見出しで
   「読める文書」に寄せている（配下ページの .shell / .related は共通のまま）
   ============================================================ */

/* ---- 配下ページ共通の控えめ見出し（このページ内のみ上書き） ---- */
main .en-h2 {
  font-size: var(--fs-en-h3);
  letter-spacing: 3px;
}

.privacy-hero { padding-block: clamp(48px, 6vw, 104px) 0; }
.privacy-updated {
  margin-top: clamp(16px, 2vw, 24px);
  font-size: var(--fs-sm);
  letter-spacing: 1px;
  color: var(--neutral-700);
}

/* ============ 本文 ============ */
.privacy-section { padding-block: clamp(32px, 4vw, 56px) 0; }
.privacy-box {
  padding: var(--pad-card);
  border-radius: var(--radius-lg);
  background: #fff;
  border: 1px solid rgba(14, 59, 52, 0.07);
  display: flex;
  flex-direction: column;
  gap: clamp(32px, 4vw, 56px);
}

/* ---- 条項 ----
   見出しの番号はティールの丸。テキストと縦に揃えるため
   flex＋align-items:center ではなく行頭に置いて line-height を合わせている */
.privacy-item__title {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: var(--fs-ttl);
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 2px;
  color: var(--teal-900);
}
.privacy-item__num {
  flex-shrink: 0;   /* flexアイテムは既定で縮むので真円を保つために必須 */
  display: grid;
  place-items: center;
  width: clamp(26px, 2.2vw, 32px);
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--teal-300);
  font-family: var(--font-inter);
  font-size: var(--fs-sm);
  font-weight: 700;
  color: #fff;
}
.privacy-item__body {
  margin-top: 14px;
  font-size: var(--fs-body-sm);
  line-height: 1.95;
  letter-spacing: 1px;
  color: var(--neutral-800);
}

/* ---- 箇条書き ---- */
.privacy-list {
  list-style: none;
  margin-top: 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.privacy-list li {
  position: relative;
  padding-left: 1.4em;
  font-size: var(--fs-body-sm);
  line-height: 1.95;
  letter-spacing: 1px;
  color: var(--neutral-800);
}
/* 行頭のティールの点。テキストの1行目に光学的に合わせるため em 基準で置く */
.privacy-list li::before {
  content: "";
  position: absolute;
  left: 0.25em;
  top: 0.85em;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--teal-300);
}
/* 本文中のリンク。common.css で a { color: inherit; text-decoration: none }
   とリセットしているので、本文色のままだとリンクだと気づけない。
   色＋下線で明示する（.privacy-contact は撤去済みだが、条項本文内の
   「お問い合わせフォーム」等のリンクで同じ見た目を使う） */
.privacy-contact a,
.privacy-item__body a,
.privacy-list a {
  color: var(--teal-400);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.privacy-contact a:hover,
.privacy-item__body a:hover,
.privacy-list a:hover { opacity: 0.75; }

.privacy-back {
  margin-top: clamp(32px, 4vw, 56px);
  display: flex;
  justify-content: center;
}

/* ============ 関連ページ導線 ============ */
.privacy-related-section { padding-bottom: 0; } /* 下は Contact＋SNS パネルが続くため */
/* related の上余白は common.css に統一（page個別指定は撤去） */

/* ============================================================
   600px〜
   ============================================================ */
@media (min-width: 600px) {
}
