/* legal.css — legal.html / privacy.html（ページ固有部分）。
   トークンと共通部品（ヘッダー .site-header・フッター .footer・.button・.skip-link）は /assets/css/site.css。 */
:root {
  --max: 920px;
}

body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  line-height: var(--lh-loose);
}

a { color: inherit; text-decoration: none; }

main {
  max-width: var(--max);
  margin: 0 auto;
  padding: 58px 20px 72px;
}

h1 {
  margin: 0 0 14px;
  color: var(--navy);
  font-size: var(--fs-2xl);
  line-height: var(--lh-tight);
}

.lead {
  margin: 0 0 34px;
  color: var(--muted);
  font-weight: 500;
}

/* ==== page-specific: legal（表） ==== */
table {
  width: 100%;
  border-collapse: collapse;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  background: var(--white);
}

th, td {
  border-bottom: 1px solid var(--line);
  padding: 16px;
  text-align: left;
  vertical-align: top;
  font-size: var(--fs-base);
  line-height: var(--lh-normal);
}

th {
  width: 32%;
  color: var(--navy);
  background: #f3f7f6;
  font-weight: 700;
}

tr:last-child th,
tr:last-child td { border-bottom: 0; }

/* ==== page-specific: privacy（節・リスト） ==== */
section {
  padding: 26px 0;
  border-top: 1px solid var(--line);
}

h2 {
  margin: 0 0 10px;
  color: var(--navy);
  font-size: var(--fs-lg);
  line-height: var(--lh-tight);
}

main p, main li { color: #314355; }

main ul { padding-left: 1.2em; }

/* ==== .note: legal 版を基底とし、privacy 版は下の section ~ .note で上書き ==== */
.note {
  margin-top: 24px;
  color: var(--muted);
  font-size: var(--fs-sm);
}

/* ==== page-specific: privacy（.note は section の後ろにある privacy だけに当たる） ==== */
section ~ .note {
  margin-top: 32px;
  padding: 16px;
  border: 1px solid #d7e2ea;
  border-radius: var(--r-sm);
  background: var(--white);
  color: var(--muted);
  font-size: var(--fs-sm);
}

/* ==== page-specific: legal（表のレスポンシブ） ==== */
@media (max-width: 640px) {
  th, td {
    display: block;
    width: 100%;
  }

  th { border-bottom: 0; }
}
