/* ════════════════════════════════════════════════════════════════════════
   法務まわり（全サイト共通）── Cookie バナーと、プライバシーポリシーの体裁
   ★色はサイトの変数を先に見て、無ければ次、それも無ければ決め打ち、の順。
     _src の 3 サイトは --c-ink / --c-main /…、site-build は --ink / --blue-deep /… を持つ。
   ★本文の体裁（h2・p・ul）は、各サイトの .prose にそのまま任せます。
     .prose を持たない site-build だけ、下の .lg-prose で同じ見え方を作ります。
   ════════════════════════════════════════════════════════════════════ */

/* ── Cookie バナー ───────────────────────────────────────────────────── */
.ck-bar{
  position:fixed;left:16px;right:16px;bottom:16px;z-index:9999;
  display:flex;gap:14px 20px;align-items:center;justify-content:space-between;flex-wrap:wrap;
  max-width:860px;margin:0 auto;
  background:#fff;color:var(--c-ink,var(--ink,#15233f));
  border:1px solid var(--c-line,var(--line,#d6e4f8));
  border-radius:14px;padding:16px 20px;
  box-shadow:0 2px 6px rgba(0,0,0,.06),0 18px 50px rgba(0,0,0,.16);
  font-size:13px;line-height:1.8;
}
.ck-bar .ck-text{margin:0;flex:1 1 320px;min-width:0}
.ck-bar .ck-btns{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.ck-bar button{
  font:inherit;font-size:13px;font-weight:700;cursor:pointer;
  border-radius:999px;padding:10px 20px;white-space:nowrap;
  border:1px solid var(--c-main,var(--blue-deep,#1f4fb5));
}
.ck-bar .ck-ok{background:var(--c-main,var(--blue-deep,#1f4fb5));color:#fff}
.ck-bar .ck-no{background:#fff;color:var(--c-main,var(--blue-deep,#1f4fb5))}
.ck-bar .ck-ok:hover{filter:brightness(1.08)}
.ck-bar .ck-no:hover{background:var(--c-pale,var(--blue-soft,#f4f8fe))}
.ck-bar .ck-more{
  font-size:13px;font-weight:700;text-decoration:underline;white-space:nowrap;
  color:var(--c-muted,var(--muted,#66738a));
}
@media(max-width:600px){
  .ck-bar{left:10px;right:10px;bottom:10px;padding:14px 16px;gap:12px}
  .ck-bar .ck-btns{width:100%}
  .ck-bar button{flex:1 1 auto}
}
@media(prefers-reduced-motion:no-preference){
  .ck-bar{animation:ck-in .35s ease-out both}
  @keyframes ck-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
}

/* ── プライバシーポリシーと別表 ───────────────────────────────────────── */
.lg-date{font-size:13px;color:var(--c-muted,var(--muted,#66738a))}
.lg-annex{margin-top:56px;padding-top:8px;border-top:2px solid var(--c-line,var(--line,#d6e4f8))}
.lg-tool{
  margin:18px 0;padding:18px 20px;border-radius:14px;
  background:var(--c-pale,var(--blue-soft,#f4f8fe));
  border:1px solid var(--c-line,var(--line,#d6e4f8));
}
.lg-tool dl{margin:0;display:grid;gap:8px}
.lg-tool dl>div{display:grid;grid-template-columns:7.5em minmax(0,1fr);gap:4px 14px;font-size:14px;line-height:1.8}
/* ★min-width:0 と折り返しが要る。別表には /works/residence-location.html のような
   途中で切れない長い文字が入り、入れずにいると枠の外へ出ます（2026-10-01 実測：
   スマホ幅 390px の画面で中身が 489px になり、99px 横に動いていました）。 */
.lg-tool dt,.lg-tool dd{min-width:0;overflow-wrap:anywhere}
.lg-tool dt{font-weight:700;color:var(--c-muted,var(--muted,#66738a))}
.lg-tool dd{margin:0}
@media(max-width:600px){.lg-tool dl>div{grid-template-columns:1fr}.lg-tool dt{font-size:12px}}

/* ── .prose を持たないサイト（site-build）だけで使う体裁 ────────────────── */
.lg-prose{font-size:16px;line-height:1.95;color:var(--c-text2,var(--ink2,#3b4350))}
.lg-prose .lg-h1{font-size:clamp(28px,3.6vw,42px);line-height:1.4;margin:0 0 10px;color:var(--c-ink,var(--ink,#0e1116))}
.lg-prose h2{font-size:19px;line-height:1.6;margin:44px 0 12px;color:var(--c-ink,var(--ink,#0e1116))}
.lg-prose h3{font-size:16px;margin:28px 0 8px;color:var(--c-ink,var(--ink,#0e1116))}
.lg-prose p{margin:0 0 16px}
.lg-prose ul{margin:0 0 16px;padding-left:1.4em}
.lg-prose li{margin:0 0 6px}
.lg-prose a{color:var(--c-main,var(--blue-deep,#2f5a93));text-decoration:underline}
