:root{
  --paper:#EEEFEB;
  --paper-soft:#E4E6E0;
  --ink:#23262D;
  --ink-2:#555A61;
  --line:#D3D6CE;
  --moss:#4B5A4F;
  --candle:#B8924A;
  --night:#1E2530;
  --cta:#8C2638;
  --cta-deep:#6F1D2C;
  --card:#FFFFFF;
  --field-bg:#F8F9F6;
  --err:#B42318;
  --serif:"Zen Old Mincho",serif;
  --sans:"BIZ UDPGothic",sans-serif;
  --latin:"Cormorant Garamond",serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{font-size:16px;-webkit-text-size-adjust:100%}
body{
  font-family:var(--sans);
  color:var(--ink); line-height:1.85;
  background:var(--paper);
  min-height:100vh;
  -webkit-font-smoothing:antialiased;
  overflow-wrap:break-word;
}
.page{ padding:32px 16px 56px; }

.card{
  max-width:720px; margin:0 auto;
  background:var(--card);
  border:1px solid var(--line);
  border-radius:14px;
  box-shadow:0 22px 54px -34px rgba(30,37,48,.45);
  padding:44px 44px 36px;
  position:relative; overflow:hidden;
}
/* candle-light edge */
.card::before{
  content:""; position:absolute; top:0; left:0; right:0; height:4px;
  background:linear-gradient(90deg,var(--night),var(--moss) 55%,var(--candle));
}
@media(max-width:560px){ .card{ padding:30px 20px 28px; } }

/* ===== header ===== */
.head{ text-align:center; }
.latin{ font-family:var(--latin); font-style:italic; font-weight:500; font-size:1.15rem; letter-spacing:.04em; color:var(--candle); }
.ttl{ font-family:var(--serif); font-weight:700; font-size:1.7rem; letter-spacing:.03em; margin-top:10px; line-height:1.4; }
.ttl > span:last-child{ display:block; font-size:1rem; font-weight:700; color:var(--ink-2); letter-spacing:.2em; margin-top:8px; }
@media(max-width:560px){ .ttl{ font-size:1.35rem; } }
.ttl small{ display:block; font-family:var(--sans); font-size:.9rem; font-weight:400; color:var(--ink-2); letter-spacing:.06em; margin-top:6px; }
.ttl .nw{ display:inline-block; font-size:inherit; font-weight:inherit; color:inherit; letter-spacing:inherit; margin:0; }
.overview{
  margin:24px auto 0; max-width:520px; text-align:left;
  border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  padding:14px 4px; font-size:.92rem;
}
.overview > div{ display:flex; gap:16px; padding:4px 0; }
.overview dt{ flex:0 0 5em; font-weight:700; font-size:.8rem; color:var(--moss); padding-top:.2em; }

/* ===== intro / step ===== */
.lead{ margin:28px 0 4px; font-size:.95rem; color:var(--ink-2); }
.steps-nav{ display:flex; justify-content:center; gap:8px; margin:28px 0 6px; font-size:.82rem; color:var(--ink-2); letter-spacing:.06em; }
.steps-nav b{ font-weight:400; }
.steps-nav .on{ color:var(--moss); font-weight:700; }
.steps-nav .sp{ color:var(--line); }

/* ===== form ===== */
.alert{
  margin:20px 0 4px; padding:13px 16px;
  background:#FBECEA; border:1px solid #E7B4AE; border-radius:8px;
  color:var(--err); font-size:.92rem;
}
.alert a{ color:var(--err); }
form{ margin-top:8px; }
fieldset{ border:none; min-width:0; }
.field{ margin-top:26px; }
.field .lbl{
  display:block; font-family:var(--serif); font-weight:700;
  font-size:1.02rem; color:var(--ink); margin-bottom:8px; letter-spacing:.03em;
}
.hint{ font-size:.84rem; color:var(--ink-2); margin:-2px 0 8px; line-height:1.7; }
.req{ color:var(--err); font-family:var(--sans); font-size:.7rem; font-weight:700;
  border:1px solid var(--err); border-radius:3px; padding:1px 6px;
  margin-left:8px; vertical-align:2px; letter-spacing:.05em; white-space:nowrap; }
.opt{ color:var(--ink-2); font-family:var(--sans); font-size:.7rem; margin-left:8px;
  border:1px solid var(--line); border-radius:3px; padding:1px 6px; vertical-align:2px; }

input[type=text], input[type=tel], input[type=email], textarea{
  width:100%; font:inherit; font-size:1rem; color:var(--ink); line-height:1.6;
  background:var(--field-bg); border:1.5px solid var(--line); border-radius:8px;
  padding:12px 14px; transition:border-color .15s, box-shadow .15s;
}
textarea{ min-height:96px; resize:vertical; }
input:focus-visible, textarea:focus-visible{
  outline:none; border-color:var(--moss);
  box-shadow:0 0 0 3px rgba(75,90,79,.25);
}
.field.has-error input, .field.has-error textarea{ border-color:var(--err); }
.err-msg{ color:var(--err); font-size:.86rem; margin-top:6px; font-weight:500; }

/* radio card group */
.choices{ display:flex; gap:12px; flex-wrap:wrap; }
.choices label{
  flex:1 1 220px; cursor:pointer;
  border:1.5px solid var(--line); border-radius:10px;
  padding:14px 16px; background:var(--field-bg);
  display:flex; align-items:center; gap:10px;
  transition:border-color .15s, background .15s;
}
.choices input{ accent-color:var(--moss); width:18px; height:18px; flex:none; }
.choices label:has(input:checked){ border-color:var(--moss); background:#EEF1EC; }
.choices label:has(input:focus-visible){ box-shadow:0 0 0 3px rgba(75,90,79,.25); }
.choices .c-main{ font-weight:700; }
.field.has-error .choices label{ border-color:var(--err); }

/* agree */
.agree-box{ display:flex; gap:12px; align-items:flex-start; cursor:pointer;
  padding:16px; border:1.5px solid var(--line); border-radius:10px; background:var(--field-bg); }
.agree-box input{ accent-color:var(--moss); width:20px; height:20px; margin-top:4px; flex:none; }
.agree-box a{ color:var(--moss); }
.agree-box:has(input:focus-visible){ box-shadow:0 0 0 3px rgba(75,90,79,.25); }
.field.has-error .agree-box{ border-color:var(--err); }

/* honeypot */
.hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

/* buttons */
.actions{ margin-top:34px; display:flex; gap:14px; flex-wrap:wrap; }
.btn{
  display:inline-block; text-align:center; text-decoration:none;
  font:inherit; cursor:pointer; border:none; border-radius:999px;
  padding:15px 28px; letter-spacing:.08em;
  font-family:var(--sans); font-weight:700; font-size:1.02rem;
  transition:transform .2s ease, background .15s;
}
.btn-primary{ flex:1 1 auto; color:#FFFFFF; background:var(--cta); box-shadow:0 14px 28px -16px rgba(111,29,44,.7); }
.btn-primary:hover{ background:var(--cta-deep); transform:translateY(-1px); }
.btn-back{ flex:0 0 auto; color:var(--ink); background:transparent; border:1.5px solid var(--line); }
.btn-back:hover{ border-color:var(--ink-2); }
.btn:focus-visible{ outline:3px solid var(--moss); outline-offset:3px; }

/* ===== confirm ===== */
.confirm-table{ margin-top:24px; width:100%; border-collapse:collapse; }
.confirm-table th, .confirm-table td{
  text-align:left; padding:14px 10px; border-bottom:1px solid var(--line);
  vertical-align:top; font-size:.95rem;
}
.confirm-table th{ width:11em; font-weight:700; font-size:.84rem; color:var(--moss); padding-top:15px; }
.confirm-table td{ word-break:break-word; }
@media(max-width:560px){
  .confirm-table th, .confirm-table td{ display:block; width:auto; border:none; padding:2px 0; }
  .confirm-table th{ padding-top:14px; }
  .confirm-table tr{ display:block; border-bottom:1px solid var(--line); padding-bottom:12px; }
}

/* ===== complete ===== */
.done{ text-align:center; padding:14px 0 6px; }
.done .mark{
  width:62px; height:62px; margin:8px auto 20px; border-radius:50%;
  background:linear-gradient(135deg,var(--night),var(--moss) 60%,var(--candle)); color:#FFFFFF;
  display:flex; align-items:center; justify-content:center; font-size:1.6rem;
}
.done h2{ font-family:var(--serif); font-weight:700; font-size:1.45rem; letter-spacing:.03em; }
.done p{ margin-top:14px; color:var(--ink-2); font-size:.95rem; }
.done .pay{ margin-top:26px; padding:22px 18px; border:1.5px solid var(--cta); border-radius:12px; }
.done .pay p{ margin-top:0; color:var(--ink); }
.done .pay .btn{ margin-top:16px; width:100%; max-width:360px; }
.done .pay .hint{ margin-top:12px; }
.done .note{
  margin-top:24px; padding:16px 18px; text-align:left; font-size:.9rem;
  background:var(--paper-soft); border:1px solid var(--line); border-radius:10px;
  color:var(--ink-2); line-height:1.9;
}
.done .note a{ color:var(--moss); }

/* ===== footer ===== */
.foot{ margin-top:36px; text-align:center; font-size:.84rem; color:var(--ink-2); }
.foot .rule{ height:1px; background:var(--line); margin-bottom:16px; }
.foot a{ color:var(--moss); }

@media(prefers-reduced-motion:reduce){
  *{ transition:none !important; }
  .btn-primary:hover{ transform:none; }
}