/* ================================================================================
 * ファイル名: app/assets/stylesheets/landing_legal.css
 * 📊 リファクタリング基準（コメント行は行数カウントから除外）
 *   ✅ 500行未満: 完璧
 *   ✅ 800行未満: 問題なし
 *   ⚠️  1200行未満: 注意喚起・リファクタリング要検討
 *   🚨 1200行以上: リファクタリング必須
 * 現在のコード行数: 約130行（コメント除く） → ✅ 完璧
 *
 * 🎯 作成日: 2026-06-15
 * 📝 目的: 法務ページ（利用規約 / プライバシーポリシー）共通のレイアウトCSS。
 *
 * 【経緯】2026-06-15 リファクタリング:
 *   terms.html.erb と privacy.html.erb のインライン <style> に約140行の
 *   同一 .landing-terms__* CSS が重複していたため、本ファイルへ抽出し単一情報源化した。
 *   privacy 固有の .landing-privacy__* は privacy.html.erb 側に残置している。
 *
 * 【適用ページ】
 *   - app/views/landing/terms.html.erb（利用規約）
 *   - app/views/landing/privacy.html.erb（プライバシーポリシー・.landing-terms__* を共用）
 *
 * 【配線】app/views/layouts/landing.html.erb の stylesheet_link_tag "landing_legal"
 * 【テスト】spec/config/landing_assets_spec.rb（REQUIRED_CSS_FILES / LANDING_CLASS_FILE_MAP に登録）
 * ================================================================================ */

.landing-terms {
  padding: 120px 24px 80px;
  min-height: 100dvh;
  background: linear-gradient(135deg, #0f0f23 0%, #1a1a3e 100%);
}

.landing-terms__container {
  max-width: 800px;
  margin: 0 auto;
  background: var(--landing-card-bg);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 16px;
  padding: 48px;
}

.landing-terms__header {
  position: relative;
  margin-bottom: 32px;
}

.landing-terms__title {
  font-size: 1.8rem;
  font-weight: 700;
  color: #ffffff;
  text-align: center;
}

.landing-terms__date {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 0.75rem;
  color: rgba(255, 255, 255, 0.5);
  background: rgba(var(--landing-accent-rgb), 0.15);
  border: 1px solid rgba(var(--landing-accent-rgb), 0.3);
  padding: 4px 10px;
  border-radius: 4px;
  font-family: monospace;
}

.landing-terms__notice {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  background: rgba(var(--landing-warning-rgb), 0.1);
  border: 1px solid rgba(var(--landing-warning-rgb), 0.3);
  border-radius: 8px;
  padding: 16px;
  margin-bottom: 24px;
}

.landing-terms__notice-icon {
  flex-shrink: 0;
  color: var(--landing-warning);
  margin-top: 2px;
}

.landing-terms__notice p {
  font-size: 0.875rem;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.85);
  margin: 0;
}

.landing-terms__intro {
  font-size: 1rem;
  line-height: 1.8;
  color: rgba(255, 255, 255, 0.8);
  margin-bottom: 40px;
  padding-bottom: 24px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.landing-terms__section {
  margin-bottom: 32px;
}

.landing-terms__section h2 {
  font-size: 1.25rem;
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 16px;
  padding-left: 12px;
  border-left: 3px solid var(--landing-accent, #6366f1);
}

.landing-terms__section p {
  font-size: 0.9375rem;
  line-height: 1.8;
  color: rgba(255, 255, 255, 0.75);
  margin-bottom: 12px;
}

.landing-terms__section ol {
  list-style-type: decimal;
  padding-left: 24px;
  margin-bottom: 12px;
}

.landing-terms__section ol ol {
  list-style-type: lower-alpha;
  margin-top: 8px;
}

.landing-terms__section li {
  font-size: 0.9375rem;
  line-height: 1.8;
  color: rgba(255, 255, 255, 0.75);
  margin-bottom: 8px;
}

.landing-terms__contact {
  list-style: none;
  padding-left: 0;
}

.landing-terms__contact li {
  font-size: 0.9375rem;
  line-height: 1.8;
  color: rgba(255, 255, 255, 0.75);
  margin-bottom: 4px;
}

.landing-terms__section--supplementary {
  margin-top: 48px;
  padding-top: 24px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.landing-terms__end {
  text-align: right;
  font-size: 0.9375rem;
  color: rgba(255, 255, 255, 0.6);
  margin-top: 40px;
}

@media (max-width: 768px) {
  .landing-terms {
    padding: 100px 16px 60px;
  }

  .landing-terms__container {
    padding: 24px;
  }

  .landing-terms__header {
    padding-top: 28px;
  }

  .landing-terms__title {
    font-size: 1.75rem;
  }

  .landing-terms__date {
    font-size: 0.6875rem;
    padding: 3px 8px;
  }

  .landing-terms__section h2 {
    font-size: 1.125rem;
  }
}
