/* Vinyl Hunter Japan — want list の頁(session2524)。白地・大きめの字(aki の Web の好み=ライト+18px)。
   色はロゴ(黒・赤・金・生成り)から。 */
:root {
  --ink: #141414;
  --muted: #4a4a4a;
  --red: #c30a2e;
  --red-dark: #9c0824;
  --gold: #8a6a12;      /* 白地で読める濃さの金(コントラスト 4.5 以上) */
  --cream: #f6f1e4;
  --line: #d9d2c0;
  --bg: #ffffff;
  --ok: #1d6b2f;
  --err: #a30d22;
}
* { box-sizing: border-box; }
html { font-size: 18px; }
body {
  margin: 0; background: var(--bg); color: var(--ink);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  line-height: 1.6;
}
a { color: var(--red-dark); }
.hero {
  background: var(--bg); color: var(--ink); text-align: center; padding: 48px 16px 56px;
  border-bottom: 6px solid var(--red);
}
.hero .logo { border-radius: 50%; width: 160px; height: 160px; }
.hero h1 { font-size: 2.2rem; margin: 16px 0 4px; letter-spacing: .02em; }
.hero .since { color: var(--gold); letter-spacing: .2em; text-transform: uppercase; font-weight: 700; margin: 0 0 16px; }
.hero .lead { font-size: 1.15rem; max-width: 640px; margin: 0 auto 28px; }
.btn {
  display: inline-block; background: var(--red); color: #fff; border: 0; border-radius: 999px;
  padding: 14px 32px; font-size: 1.1rem; font-weight: 700; text-decoration: none; cursor: pointer;
}
.btn:hover, .btn:focus-visible { background: var(--red-dark); }
.btn:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid var(--gold); outline-offset: 2px;
}
.btn[disabled] { opacity: .6; cursor: progress; }
main section { padding: 40px 16px; }
main section > * { max-width: 680px; margin-left: auto; margin-right: auto; }
.band { background: var(--cream); }
h2 { font-size: 1.6rem; margin-top: 0; border-left: 6px solid var(--red); padding-left: 12px; }
.steps { padding-left: 1.4em; }
.steps li { margin: 8px 0; }
.note { color: var(--muted); }
form label { display: block; font-weight: 700; margin: 20px 0 6px; }
form label.inline { display: inline-flex; align-items: center; gap: 8px; font-weight: 400; margin: 6px 20px 6px 0; }
form label.consent { display: flex; align-items: flex-start; margin-top: 24px; }
fieldset { border: 0; padding: 0; margin: 20px 0 0; }
legend { font-weight: 700; padding: 0; margin-bottom: 6px; }
input[type=text], input[type=email], input[type=number], select, textarea {
  width: 100%; font-size: 1rem; padding: 12px; border: 2px solid var(--line); border-radius: 8px;
  background: #fff; color: var(--ink); font-family: inherit;
}
input[type=radio], input[type=checkbox] { width: 22px; height: 22px; accent-color: var(--red); flex: none; }
textarea { resize: vertical; }
.hint { color: var(--muted); font-size: .9rem; margin: 0 0 6px; }
.req { color: var(--red); }
.invalid { border-color: var(--err) !important; }
.trap { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
#turnstile { margin: 24px 0 8px; min-height: 65px; }
#submitBtn { margin-top: 8px; width: 100%; }
#result { font-size: 1.05rem; font-weight: 700; min-height: 1.6em; }
#result.ok { color: var(--ok); }
#result.err { color: var(--err); }
footer { background: var(--cream); color: var(--muted); text-align: center; padding: 24px 16px; border-top: 1px solid var(--line); }
@media (max-width: 480px) {
  .hero h1 { font-size: 1.7rem; }
  .hero .logo { width: 120px; height: 120px; }
}
