/* =========================================================
   下層ページ（規約・特商法・お問い合わせ等）を
   exam.legal-vibes.com のテイストに合わせる上書き層。

   style.css / moshi.css / legal.css の「あと」に読み込みます。
   既存の CSS はそのまま残し、色・書体・枠の形だけを差し替えます。
   ========================================================= */

:root {
  /* 色のトークンを受験用サイトの値に置き換える */
  --c-bg:          #F3F7FA;
  --c-bg-soft:     #FFFFFF;
  --c-ink:         #2A2A2A;
  --c-ink-soft:    #2A2A2A;
  --c-text:        #3A3F44;
  --c-text-mute:   #5C6771;
  --c-line:        #CFDAE2;
  --c-line-strong: #2A2A2A;
  --c-accent:        #0C7D86;
  --c-accent-bright: #CCFF00;

  --font-sans: "Zen Kaku Gothic New", -apple-system, "system-ui",
               "Hiragino Kaku Gothic ProN", "Hiragino Sans",
               "Yu Gothic Medium", Meiryo, "Noto Sans JP", sans-serif;

  --radius:    8px;
  --radius-lg: 10px;

  --lv-lime: #CCFF00;
  --lv-dot:  #D5E1EA;
}

body {
  background-color: var(--c-bg);
  background-image: radial-gradient(var(--lv-dot) 1px, transparent 1px);
  background-size: 24px 24px;
}

/* ---------- ヘッダー ---------- */
.site-header,
.site-header--static {
  background: var(--c-bg);
  border-bottom: 2px solid var(--c-ink);
}
.logo__img { border-radius: 9px; }
.logo__text strong { font-weight: 900; letter-spacing: .04em; }
.logo__text small  { color: var(--c-text-mute); }

/* ---------- ボタン ----------
   受験用サイトと同じ「2pxの黒枠＋真下に落ちる影」。
   下層ページのボタンは文字が素のままなので、傾けていません。 */
.btn {
  border: 2px solid var(--c-ink);
  border-radius: var(--radius);
  font-weight: 900;
  box-shadow: 0 3px 0 var(--c-ink);
  transition: transform .18s ease, box-shadow .18s ease;
}
.btn:hover  { transform: translateY(-2px); box-shadow: 0 5px 0 var(--c-ink); }
.btn:active { transform: translateY(1px);  box-shadow: 0 1px 0 var(--c-ink); }
.btn--solid { background: var(--lv-lime); color: var(--c-ink); border-color: var(--c-ink); }
.btn--solid:hover { background: var(--lv-lime); color: var(--c-ink); }

/* ---------- 見出し ---------- */
.legal__title,
.page-head__title {
  font-weight: 900;
  color: var(--c-ink);
}
.legal__title { border-bottom-width: 3px; }

.legal__h2 {
  font-weight: 900;
  padding-left: 0;
  border-left: 0;
}
/* 見出しの頭に、ライムの小さな帯を置く */
.legal__h2::before {
  content: "";
  display: inline-block;
  width: 14px; height: 14px;
  margin-right: 10px;
  background: var(--lv-lime);
  border: 2px solid var(--c-ink);
  transform: skewX(-8deg) translateY(1px);
}

/* ---------- 一覧（特商法の表など） ---------- */
.legal__list {
  background: #fff;
  border: 2px solid var(--c-ink);
  border-radius: var(--radius-lg);
  box-shadow: 0 2px 0 var(--c-ink);
  padding: 4px 24px;
}
.legal__row:first-child { padding-top: 22px; }
.legal__row:last-child  { border-bottom: 0; }
.legal__row dt { font-weight: 900; }

.legal__back a,
.thanks__sub a { color: var(--c-accent); }

/* ---------- 決済完了ページ ---------- */
.thanks__mark {
  border-radius: 10px;
  border: 2px solid var(--c-ink);
  background: var(--lv-lime);
  color: var(--c-ink);
  box-shadow: 0 2px 0 var(--c-ink);
}
.thanks__steps > li::before {
  border-radius: 7px;
  border: 2px solid var(--c-ink);
  background: var(--c-accent);
}

/* ---------- フッター ---------- */
.site-footer {
  border-top: 2px solid var(--c-ink);
  background: transparent;
}