:root{
  --washi:#F5E5C5;
  --washi-2:#EFDCB4;
  --washi-deep:#E6D3A8;
  --shu:#C9763A;
  --shu-deep:#B0531F;
  --sumi:#3A2C1E;
  --sumi-soft:#5C4A38;
  --kin:#B8923F;
  --paper:#FFFDF8;
  --err:#A8321C;
}
*{margin:0;padding:0;box-sizing:border-box}
html{font-size:16px;-webkit-text-size-adjust:100%}
body{
  font-family:"Noto Sans JP",sans-serif;
  color:var(--sumi); line-height:1.7;
  background:radial-gradient(130% 100% at 20% 12%, #FBEFD4 0%, var(--washi) 45%, var(--washi-2) 100%);
  min-height:100vh;
}
/* torii 地紋 */
body::before{
  content:""; position:fixed; inset:0; z-index:0;
  background:url("bg-motif.png") center/cover no-repeat;
  opacity:.06; mix-blend-mode:multiply; pointer-events:none;
}
.page{ position:relative; z-index:1; padding:32px 16px 56px; }

.card{
  max-width:720px; margin:0 auto;
  background:var(--paper);
  border:1px solid var(--washi-deep);
  border-top:4px solid var(--shu);
  border-radius:6px;
  box-shadow:0 10px 40px rgba(58,44,30,.14);
  padding:40px 44px 36px;
}
@media(max-width:560px){ .card{ padding:28px 20px 28px; } }

/* ===== header ===== */
.head{ text-align:center; }
.badge{
  display:inline-block; background:var(--shu-deep); color:#FBEEDC;
  font-family:"Noto Serif JP",serif; font-weight:600;
  font-size:.78rem; letter-spacing:.18em; padding:5px 16px; border-radius:2px;
}
.latin{
  margin-top:16px; font-family:"Cormorant Garamond",serif; font-weight:600;
  font-size:1.05rem; letter-spacing:.4em; text-transform:uppercase; color:var(--kin);
}
.ttl{
  font-family:"Noto Serif JP",serif; font-weight:900;
  font-size:2.1rem; letter-spacing:.04em; margin-top:6px; line-height:1.25;
}
.ttl span{
  display:block; font-size:1.1rem; font-weight:600; color:var(--shu-deep);
  letter-spacing:.2em; margin-top:6px;
}
.overview{
  margin:22px auto 0; max-width:480px; text-align:left;
  border-top:1px solid var(--washi-deep); border-bottom:1px solid var(--washi-deep);
  padding:14px 4px; font-size:.9rem;
}
.overview > div{ display:flex; gap:14px; padding:3px 0; }
.overview dt{
  flex:0 0 5.5em; font-family:"Noto Serif JP",serif; font-weight:700;
  color:var(--shu-deep); letter-spacing:.08em;
}
.overview dd{ color:var(--sumi); }

/* ===== intro / step ===== */
.lead{ margin:26px 0 4px; font-size:.95rem; color:var(--sumi-soft); }
.steps-nav{
  display:flex; justify-content:center; gap:8px; margin:26px 0 6px;
  font-size:.78rem; color:var(--sumi-soft); letter-spacing:.06em;
}
.steps-nav b{
  display:inline-flex; align-items:center; gap:6px;
}
.steps-nav .on{ color:var(--shu-deep); font-weight:700; }
.steps-nav .sp{ color:var(--washi-deep); }

/* ===== form ===== */
.alert{
  margin:20px 0 4px; padding:12px 16px;
  background:#FBEAE3; border:1px solid #E0A48E; border-radius:4px;
  color:var(--err); font-size:.9rem;
}
form{ margin-top:8px; }
.field{ margin-top:24px; }
.field > label.lbl{
  display:block; font-family:"Noto Serif JP",serif; font-weight:700;
  font-size:1rem; color:var(--sumi); margin-bottom:8px; letter-spacing:.04em;
}
.req{ color:var(--shu-deep); font-size:.72rem; font-weight:700;
  border:1px solid var(--shu-deep); border-radius:2px; padding:1px 6px;
  margin-left:8px; vertical-align:2px; letter-spacing:.05em; }
.opt{ color:var(--sumi-soft); font-size:.72rem; margin-left:8px;
  border:1px solid var(--washi-deep); border-radius:2px; padding:1px 6px; vertical-align:2px; }

input[type=text], input[type=tel], input[type=email], textarea{
  width:100%; font:inherit; color:var(--sumi);
  background:#FFFCF5; border:1.5px solid var(--washi-deep); border-radius:4px;
  padding:11px 13px; transition:border-color .15s, box-shadow .15s;
}
textarea{ min-height:96px; resize:vertical; }
input:focus-visible, textarea:focus-visible{
  outline:none; border-color:var(--shu);
  box-shadow:0 0 0 3px rgba(201,118,58,.18);
}
.hint{ font-size:.8rem; color:var(--sumi-soft); margin-top:6px; }
.field.has-error input, .field.has-error textarea{ border-color:var(--err); }
.err-msg{ color:var(--err); font-size:.82rem; margin-top:6px; }

/* radio card group */
.choices{ display:flex; gap:12px; flex-wrap:wrap; }
.choices label{
  flex:1 1 0; min-width:140px; cursor:pointer;
  border:1.5px solid var(--washi-deep); border-radius:5px;
  padding:13px 16px; background:#FFFCF5;
  display:flex; align-items:center; gap:10px;
  transition:border-color .15s, background .15s;
}
.choices input{ accent-color:var(--shu-deep); width:18px; height:18px; }
.choices label:has(input:checked){
  border-color:var(--shu); background:#FBEFE3;
}
.choices label:has(input:focus-visible){
  box-shadow:0 0 0 3px rgba(201,118,58,.18);
}
.choices .c-main{ font-family:"Noto Serif JP",serif; font-weight:700; }
.choices .c-sub{ font-size:.8rem; color:var(--sumi-soft); margin-left:auto; }

/* 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{
  font:inherit; cursor:pointer; border:none; border-radius:5px;
  padding:14px 22px; letter-spacing:.08em;
  font-family:"Noto Serif JP",serif; font-weight:700; font-size:1.02rem;
  transition:filter .15s, transform .05s;
}
.btn-primary{
  flex:1 1 auto; color:#FFF6EA;
  background:linear-gradient(90deg,var(--shu),var(--shu-deep));
  box-shadow:0 4px 14px rgba(176,83,31,.32);
}
.btn-primary:hover{ filter:brightness(1.05); }
.btn-primary:active{ transform:translateY(1px); }
.btn-back{
  flex:0 0 auto; color:var(--sumi); background:transparent;
  border:1.5px solid var(--washi-deep);
}
.btn:focus-visible{ outline:none; box-shadow:0 0 0 3px rgba(201,118,58,.30); }

/* ===== confirm ===== */
.confirm-table{ margin-top:24px; width:100%; border-collapse:collapse; }
.confirm-table th, .confirm-table td{
  text-align:left; padding:13px 12px; border-bottom:1px solid var(--washi-deep);
  vertical-align:top; font-size:.95rem;
}
.confirm-table th{
  width:9em; font-family:"Noto Serif JP",serif; font-weight:700;
  color:var(--shu-deep); white-space:nowrap;
}
.confirm-table td{ white-space:pre-wrap; word-break:break-word; }

/* ===== complete ===== */
.done{ text-align:center; padding:14px 0 6px; }
.done .mark{
  width:64px; height:64px; margin:6px auto 18px; border-radius:50%;
  background:linear-gradient(135deg,var(--shu),var(--shu-deep)); color:#FFF6EA;
  display:flex; align-items:center; justify-content:center; font-size:2rem;
  box-shadow:0 6px 18px rgba(176,83,31,.3);
}
.done h2{ font-family:"Noto Serif JP",serif; font-weight:700; font-size:1.5rem; }
.done p{ margin-top:14px; color:var(--sumi-soft); font-size:.95rem; }
.done .note{
  margin-top:22px; padding:14px 18px; text-align:left; font-size:.88rem;
  background:#FFFCF5; border:1px solid var(--washi-deep); border-radius:5px;
  color:var(--sumi-soft);
}

/* ===== footer ===== */
.foot{ margin-top:34px; text-align:center; font-size:.82rem; color:var(--sumi-soft); }
.foot .rule{ height:1px; background:var(--kin); opacity:.5; margin-bottom:16px; }
.foot a{ color:var(--shu-deep); }

@media(prefers-reduced-motion:reduce){
  *{ transition:none !important; }
}