/* ============================================================
   _lower.css — shared styles for static lower pages
   (運営者情報 / プライバシー / 利用規約 / お問い合わせ等)
   出典: cms-design A-default _lower.css
   ============================================================ */

/* page header */
.lp-header{
  border-bottom:1px solid var(--line);
  background:var(--lp-header-bg);
}
.lp-header-inner{
  max-width:1180px; margin:0 auto;
  padding:40px 32px 36px;
}
.lp-header .lab{
  font-size:11px; color:var(--muted); letter-spacing:0.18em; margin-bottom:8px;
}
.lp-header h1{
  margin:0 0 10px; font-size:28px; font-weight:700; letter-spacing:0.04em;
}
.lp-header p{
  margin:0; max-width:640px;
  font-size:13.5px; color:var(--muted); line-height:1.95;
}
.lp-header .updated{
  font-size:11px; color:var(--muted-2); letter-spacing:0.06em;
  margin-top:14px;
}
@media (max-width:760px){.lp-header-inner{padding:32px 22px 28px;}}

/* TOC (anchor list) */
.lp-toc{
  border:1px solid var(--line); border-radius:6px;
  padding:18px 22px;
  margin:0 0 36px;
  background:#fff;
}
.lp-toc .toc-h{
  font-size:11px; letter-spacing:0.16em; color:var(--muted);
  margin-bottom:10px;
}
.lp-toc ol{
  list-style:none; padding:0; margin:0;
  counter-reset:toc;
  display:grid; gap:6px;
}
.lp-toc li{
  counter-increment:toc;
  padding-left:30px; position:relative;
  font-size:13px; line-height:1.7;
}
.lp-toc li::before{
  content:counter(toc, decimal-leading-zero);
  position:absolute; left:0; top:0;
  font-size:11px; color:var(--muted); font-weight:500; letter-spacing:0.06em;
}
.lp-toc a{color:var(--ink-2); text-decoration:none;}
.lp-toc a:hover{color:var(--ink); text-decoration:underline; text-decoration-thickness:1px;}

/* prose blocks (固定ページ本文) */
.lp h2{
  font-size:20px; font-weight:700; letter-spacing:0.04em;
  margin:48px 0 16px; padding-bottom:10px;
  border-bottom:1px solid var(--line);
  scroll-margin-top:90px;
}
.lp h2:first-child{margin-top:8px;}
.lp h3{
  font-size:15.5px; font-weight:700; letter-spacing:0.02em;
  margin:32px 0 10px; padding-left:12px;
  position:relative;
}
.lp h3::before{
  content:""; position:absolute; left:0; top:0.5em;
  width:3px; height:0.95em; background:var(--ink);
}
.lp p{
  margin:0 0 1.4em; font-size:14.5px; line-height:1.95; color:var(--ink-2);
}
.lp ul, .lp ol{
  padding-left:1.4em; margin:0 0 1.4em;
}
.lp ul li, .lp ol li{
  font-size:14px; line-height:1.95; color:var(--ink-2);
  margin-bottom:0.4em;
}
.lp ul li::marker{color:var(--muted-2);}
.lp strong{font-weight:700;}

/* definition table */
.lp-table{
  width:100%; border-collapse:collapse;
  font-size:13.5px; line-height:1.85;
  margin:0 0 24px;
}
.lp-table th, .lp-table td{
  text-align:left; padding:14px 16px;
  border-bottom:1px solid var(--line);
  vertical-align:top;
}
.lp-table th{
  width:32%; font-weight:500; color:var(--muted);
  font-size:12.5px; letter-spacing:0.04em;
  background:var(--soft);
}
.lp-table td{color:var(--ink-2);}
@media (max-width:600px){
  .lp-table th{width:38%; padding:12px;}
  .lp-table td{padding:12px;}
}

/* callout / note */
.lp-note{
  background:var(--soft); border-radius:6px;
  padding:18px 22px;
  margin:0 0 24px;
  font-size:13.5px; line-height:1.9; color:var(--ink-2);
}
.lp-note .nt{
  font-size:11px; letter-spacing:0.16em; color:var(--muted);
  margin-bottom:6px;
}
.lp-note p:last-child{margin-bottom:0;}

/* author profile (運営者情報ページなどで利用) */
.profile{
  display:grid; grid-template-columns:120px 1fr; gap:24px;
  padding:28px;
  border:1px solid var(--line); border-radius:6px;
  background:#fff;
  margin:0 0 32px;
  align-items:center;
}
.profile .avatar{
  width:120px; height:120px; border-radius:50%;
  background:linear-gradient(135deg, var(--avatar-1), var(--avatar-2));
  display:flex; align-items:center; justify-content:center;
  font-size:42px; font-weight:700; color:var(--avatar-ink);
  flex-shrink:0;
}
.profile .nm{font-size:18px; font-weight:700; margin:0 0 4px;}
.profile .role{font-size:12px; color:var(--muted); letter-spacing:0.08em; margin:0 0 10px;}
.profile .bio{font-size:13px; color:var(--ink-2); line-height:1.85; margin:0;}
@media (max-width:560px){
  .profile{grid-template-columns:1fr; text-align:center; padding:24px;}
  .profile .avatar{margin:0 auto;}
}

/* ============================================================
   breadcrumb (.crumb) — 固定ページのパンくず
   ※ category ページ用 _category.css にも同等定義あり（重複は意図的、ページタイプ別CSS切替のため）
   出典: cms-design A-default _lower.css
   ============================================================ */
.crumb {
  border-bottom: 1px solid var(--line);
  background: #fff;
}
.crumb-inner {
  max-width: 1180px;
  margin: 0 auto;
  padding: 14px 32px;
  font-size: 11.5px;
  color: var(--muted);
  letter-spacing: 0.06em;
}
.crumb-inner a {
  color: var(--muted);
  text-decoration: none;
}
.crumb-inner a:hover {
  color: var(--ink);
}
.crumb-inner .sep {
  margin: 0 8px;
  color: var(--muted-2);
}
.crumb-inner .current {
  color: var(--ink);
}
@media (max-width: 760px) {
  .crumb-inner { padding: 12px 22px; }
}

/* ============================================================
   contact-cards — お問い合わせページ上部の連絡先カード群
   出典: cms-design A-default _lower.css
   ============================================================ */
.contact-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin: 0 0 32px;
}
@media (max-width: 600px) {
  .contact-cards { grid-template-columns: 1fr; }
}
.contact-card {
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 20px;
  background: #fff;
}
.contact-card .icon {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--soft);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 10px;
}
.contact-card h4 {
  margin: 0 0 4px;
  font-size: 14px;
  font-weight: 700;
}
.contact-card p {
  margin: 0;
  font-size: 12.5px;
  color: var(--muted);
  line-height: 1.8;
}

/* ============================================================
   form 系 (.form-row / .form-radios / .form-agree / .form-actions)
   出典: cms-design A-default _lower.css
   ============================================================ */
.form-row {
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: 18px;
  padding: 20px 0;
  border-bottom: 1px solid var(--line);
  align-items: flex-start;
}
.form-row:first-child {
  border-top: 1px solid var(--line);
}
.form-row label {
  font-size: 13px;
  font-weight: 500;
  display: flex;
  align-items: center;
  gap: 8px;
  padding-top: 10px;
}
.form-row label .req {
  background: var(--ink);
  color: #fff;
  font-size: 9.5px;
  padding: 2px 6px;
  border-radius: 2px;
  letter-spacing: 0.08em;
  font-weight: 500;
}
.form-row label .opt {
  background: var(--line);
  color: var(--muted);
  font-size: 9.5px;
  padding: 2px 6px;
  border-radius: 2px;
  letter-spacing: 0.08em;
  font-weight: 500;
}
.form-row .field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.form-row input,
.form-row select,
.form-row textarea {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 2px;
  background: #fff;
  font-size: 14px;
  font-family: inherit;
  color: var(--ink);
  outline: none;
  transition: border-color 0.15s ease;
}
.form-row input:focus,
.form-row select:focus,
.form-row textarea:focus {
  border-color: var(--ink);
}
.form-row textarea {
  min-height: 160px;
  resize: vertical;
  line-height: 1.85;
}
.form-row .hint {
  font-size: 11.5px;
  color: var(--muted);
  letter-spacing: 0.04em;
}

.form-radios {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.form-radios label {
  font-size: 13.5px;
  padding: 0;
  font-weight: 400;
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}
.form-radios input {
  width: auto;
  padding: 0;
}

.form-agree {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 24px 0 0;
  padding: 16px;
  background: var(--soft);
  border-radius: 4px;
  font-size: 13px;
  line-height: 1.85;
}
.form-agree input {
  margin-top: 4px;
}
.form-agree a {
  color: var(--ink);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.form-actions {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin: 32px 0 0;
}
.form-actions .submit {
  height: 52px;
  padding: 0 48px;
  background: var(--ink);
  color: #fff;
  border: none;
  border-radius: 2px;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.08em;
  cursor: pointer;
  font-family: inherit;
}
.form-actions .submit:hover {
  background: #000;
}

@media (max-width: 600px) {
  .form-row {
    grid-template-columns: 1fr;
    gap: 8px;
    padding: 16px 0;
  }
  .form-row label {
    padding-top: 0;
  }
}

/* ========================================
   お問い合わせフォーム: 完了/エラーメッセージ
   /contact/?status=ok|error&msg=... を front.js が判定して内容を埋め込む
   ======================================== */
.contact-status {
  display: none;
  padding: 16px 20px;
  margin: 0 0 24px;
  border-radius: var(--radius-md, 6px);
  font-size: 14px;
  line-height: 1.7;
  border: 1px solid transparent;
}
.contact-status.is-ok,
.contact-status.is-error {
  display: block;
}
.contact-status.is-ok {
  background: #E8F4ED;
  border-color: #B5DAC4;
  color: #1B6B3F;
}
.contact-status.is-error {
  background: #FBECEC;
  border-color: #F0C6C4;
  color: #A8312D;
}

/* ハニーポット（bot 検出用）— 視覚的・支援技術的にも非表示 */
.hp-field {
  position: absolute !important;
  left: -10000px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  opacity: 0 !important;
}
