/* SAITOWORKS Privacy Policy (pages) */
/* base.css のトークン：--brand, --text, --border, --surface, --surface-elev, --tint を利用 */

.swx-privacy{
  --pp-accent: var(--brand, #FFD400);
  --pp-ink: var(--text, #1b1b1b);
  --pp-border: var(--border, #e3e5ea);
  --pp-surface: var(--surface, #fff);
  --pp-elev: var(--surface-elev, #fff);

  max-width: 960px;
  margin: clamp(20px, 3vw, 40px) auto;
  padding: 0 clamp(16px, 2.4vw, 24px) 64px;
  color: var(--pp-ink);
}

/* ページヘッダー */
.pp-header{
  position: relative;
  margin-bottom: 24px;
  padding: 18px 12px 10px;
  border-bottom: 2px solid color-mix(in oklab, var(--pp-accent) 55%, transparent);
}
.pp-title{
  font-size: clamp(22px, 3.2vw, 32px);
  font-weight: 900;
  letter-spacing: .02em;
  margin: 0 0 8px;
}
.pp-updated{
  font-size: 13px; color: color-mix(in oklab, var(--pp-ink) 65%, transparent);
}

/* 目次カード */
.pp-toc{
  background: linear-gradient(180deg, color-mix(in oklab, var(--pp-accent) 18%, #fff) 0%, #fff 80%);
  border: 1px solid var(--pp-border);
  border-radius: 14px;
  padding: 12px 14px;
  margin: 18px 0 28px;
  box-shadow: 0 8px 24px rgba(0,0,0,.05);
}
.pp-toc > strong{ display:block; font-weight:800; margin-bottom:6px; }
/* 目次（2列固定／スマホは1列） */
.pp-toc ol{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr)); /* ← 2列固定 */
  gap: 6px 16px;
  margin: 0;
  padding-left: 18px; /* 行頭の番号が見切れないように */
  list-style-position: outside;
}

/* 幅が狭い時は1列 */
@media (max-width: 560px){
  .pp-toc ol{
    grid-template-columns: 1fr;
  }
}

.pp-toc a{ color: var(--pp-ink); text-decoration: none; border-bottom: 1px dashed transparent; }
.pp-toc a:hover{ border-bottom-color: color-mix(in oklab, var(--pp-ink) 35%, transparent); }

/* セクション見出し */
.pp-section{ margin: 28px 0; }
.pp-section > h2{
  position: relative;
  font-size: clamp(18px, 2.4vw, 22px);
  font-weight: 900; margin: 0 0 10px;
  padding-left: 14px;
}
.pp-section > h2::before{
  content:""; position:absolute; left:0; top:.2em; bottom:.2em;
  width:6px; border-radius: 3px;
  background: linear-gradient(180deg, var(--pp-accent), color-mix(in oklab, var(--pp-accent) 70%, #000));
  box-shadow: 0 4px 14px rgba(0,0,0,.08);
}

/* 本文 */
.pp-section p{ line-height: 1.9; margin: 0 0 10px; }
.pp-section ul{ margin: .25rem 0 .75rem 1.2rem; }
.pp-section li{ margin: .1rem 0; }

/* 定義リストをカード化 */
.pp-list{
  padding: 0; margin: .25rem 0 1rem;
}
.pp-list dt{
  font-weight: 800; margin-top: .8rem;
}
.pp-list dd{
  margin: .25rem 0 .4rem 0;
  padding: .6rem .75rem;
  background: var(--pp-surface);
  border: 1px solid var(--pp-border);
  border-radius: 10px;
}

/* 小さな注意文 */
.pp-note{
  font-size: 13px;
  color: color-mix(in oklab, var(--pp-ink) 65%, transparent);
  background: color-mix(in oklab, var(--pp-accent) 12%, #fff);
  border: 1px dashed color-mix(in oklab, var(--pp-accent) 40%, transparent);
  padding: .5rem .6rem; border-radius: 10px;
}

/* 小見出し付きカード */
.pp-card{
  background: var(--pp-elev);
  border: 1px solid var(--pp-border);
  border-radius: 14px;
  padding: .8rem .9rem;
  box-shadow: 0 10px 30px rgba(0,0,0,.06);
}
.pp-card h3{
  font-size: 15px; font-weight: 800; margin: .2rem 0 .3rem;
  color: color-mix(in oklab, var(--pp-ink) 90%, transparent);
}