/* page-thanks.php 専用のスタイル */
@layer kbt-mock {
  /* ===== 送信完了 ===== */
  .tk{max-width:760px;margin:0 auto;background:var(--white);border:1px solid var(--line);padding:52px 56px 46px;text-align:center}
  .tk .mark{width:64px;height:64px;border-radius:50%;background:var(--brass);color:#fff;font-size:30px;line-height:64px;margin:0 auto 22px}
  .tk h3{font-family:var(--serif);font-size:24px;font-weight:500;margin-bottom:14px}
  .tk .ld{font-size:16px;color:#5a626c;line-height:1.9;margin-bottom:32px}
  .tk .ld b{color:var(--ink)}
  .recap{border:1px solid var(--line);background:var(--paper);text-align:left;padding:22px 26px;margin-bottom:30px}
  .recap h4{font-size:14px;letter-spacing:0.14em;color:var(--muted);font-weight:700;margin-bottom:14px;text-transform:uppercase}
  .recap dl{display:grid;grid-template-columns:auto 1fr;gap:11px 24px;font-size:14px;align-items:baseline}
  .recap dt{color:var(--muted);white-space:nowrap;font-size:14px}
  .recap dd{color:var(--ink)}
  .nextlist{text-align:left;border-top:1px solid var(--line);padding-top:28px;margin-bottom:30px;counter-reset:t}
  .nextlist li{list-style:none;position:relative;padding-left:42px;margin-bottom:18px;font-size:16px;color:#5a626c;line-height:1.85}
  .nextlist li:last-child{margin-bottom:0}
  .nextlist li::before{
    counter-increment:t;content:counter(t);
    position:absolute;left:0;top:1px;width:26px;height:26px;border-radius:50%;
    background:var(--note-bg);color:var(--brass);font-size:14px;font-weight:700;
    text-align:center;line-height:26px;
  }
  /* 完了済みの工程。counter-increment は上の ::before に残るので、
     以降の番号は 2・3・4… とそのまま続きます。 */
  .nextlist li.done{color:var(--muted)}
  .nextlist li.done::before{content:"✓";background:var(--brass);color:#fff}
  .nextlist b{display:block;color:var(--ink);font-size:14px;margin-bottom:2px}
  .nextlist li.done b{color:var(--muted)}
  .nextlist a{color:var(--brass)}
  .tk .spam{font-size:14px;color:var(--muted);line-height:1.85;background:#fffdf7;border:1px solid #e6d9b8;padding:14px 18px;text-align:left;margin-bottom:30px}
  .tk .wait{border-top:1px solid var(--line);padding-top:26px}
  .tk .wait p{font-size:14px;color:var(--muted);margin-bottom:14px}
  /* デモ用の導線。制作確認のためのものなので .tbc と同じ地色にし、
     注記の非表示切り替え（body.kbt-hide-notes）で一緒に消えるようにしています。 */
  .demolink{text-align:right;margin-top:22px;font-size:14px}
  .demolink a{display:inline-block;background:#fdf3d8;color:#7a5c12;padding:2px 8px;border-radius:2px;text-decoration:none}
  .demolink a:hover{text-decoration:underline}
  body.kbt-hide-notes .demolink{display:none}
  @media (max-width:700px){
    .tk{padding:34px 20px 30px}
    .tk h3{font-size:20px}
    .recap dl{grid-template-columns:1fr;gap:3px 0}
    .recap dt{margin-top:8px}
  }
}
