/* =====================================================
   Image Crop Studio — pages.css
   静的ページ(使い方 / 利用規約 / お問い合わせ)
   ===================================================== */

.article {
  max-width: 760px;
  margin: 0 auto;
  padding: 8px 0 40px;
}
.article-card {
  background: var(--surface);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  border: 1px solid rgba(255, 255, 255, 0.7);
  outline: 1px solid var(--border);
  border-radius: var(--radius-card);
  box-shadow: var(--shadow-card);
  padding: 28px 30px 32px;
}
.article h1 {
  font-family: var(--font-latin);
  font-weight: 600;
  font-size: 24px;
  margin: 0 0 6px;
  color: var(--text);
}
.article .lead {
  font-size: 13px;
  color: var(--text-muted);
  line-height: 1.9;
  margin: 0 0 24px;
}
.article h2 {
  font-family: var(--font-latin);
  font-weight: 600;
  font-size: 17px;
  color: var(--text);
  margin: 34px 0 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border);
}
.article h2:first-of-type { margin-top: 24px; }
.article h3 {
  font-size: 14px;
  font-weight: 600;
  margin: 20px 0 6px;
}
.article p, .article li {
  font-size: 13.5px;
  line-height: 1.95;
  color: var(--text);
}
.article ul, .article ol { padding-left: 22px; margin: 8px 0; }
.article .note { font-size: 12px; color: var(--text-muted); }

/* 使い方ページの図版 */
.figure {
  margin: 14px 0 6px;
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
}
.figure svg { display: block; width: 100%; height: auto; }
.figure-caption {
  font-size: 11px;
  color: var(--text-faint);
  text-align: center;
  padding: 7px 10px 9px;
  border-top: 1px solid var(--border);
  background: #FBFAFF;
}

/* ステップ番号 */
.step-title {
  display: flex;
  align-items: baseline;
  gap: 10px;
}
.step-num {
  font-family: var(--font-latin);
  font-weight: 700;
  font-size: 13px;
  color: var(--accent);
  flex: none;
}

/* お問い合わせページ */
.contact-actions {
  margin-top: 22px;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

@media (max-width: 640px) {
  .article-card { padding: 22px 18px 26px; }
  .article h1 { font-size: 21px; }
}