:root {
  --green-900:#0f2e22; --green-800:#143a2b; --green-700:#1c4a37; --green-600:#2a6349;
  --gold:#c9a24a; --gold-soft:#e2c583; --gold-deep:#a9822f;
  --red:#c8332a; --paper:#faf5ea; --paper-2:#f3ebd8; --ink:#2b2a24; --ink-soft:#6a6455;
  --line:#e3d8bd;
}
* { box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
html, body { margin:0; padding:0; }
body {
  color:var(--ink); background:var(--green-900); line-height:1.6;
  font-family:-apple-system,BlinkMacSystemFont,"PingFang HK","PingFang SC","Noto Sans TC","Microsoft JhengHei",sans-serif;
  -webkit-font-smoothing:antialiased;
}
.wrap { max-width:520px; min-height:100vh; margin:0 auto; background:var(--paper); box-shadow:0 0 40px rgba(0,0,0,.35); }
.hero {
  position:relative; overflow:hidden; padding:calc(28px + env(safe-area-inset-top)) 20px 26px;
  border-bottom:1px solid var(--line); text-align:center;
  background:radial-gradient(125% 85% at 50% 0%,#fdfaf3 0%,#f6efdc 58%,#f0e7cf 100%);
}
.hero::after {
  content:""; position:absolute; bottom:-1px; left:50%; width:130px; height:3px;
  border-radius:3px; transform:translateX(-50%); background:linear-gradient(90deg,transparent,var(--gold),transparent);
}
.logos { display:inline-flex; align-items:center; justify-content:center; gap:24px; }
.logos img { width:auto; height:92px; object-fit:contain; filter:drop-shadow(0 3px 6px rgba(15,46,34,.12)); }
.logos .divider { width:1.5px; height:74px; opacity:.65; background:linear-gradient(var(--gold-soft),var(--gold-deep)); }
.hero h1 { margin:20px 0 5px; color:var(--green-800); font-size:26px; font-weight:800; letter-spacing:2px; }
.hero .sub { color:var(--gold-deep); font-size:15px; font-weight:700; letter-spacing:6px; }
form { padding:6px 16px 30px; }
.section {
  margin-top:16px; padding:16px 15px 18px; border:1px solid var(--line); border-radius:16px;
  background:#fff; box-shadow:0 4px 16px rgba(15,46,34,.05);
}
.sec-head { display:flex; align-items:center; gap:10px; width:100%; margin:0 0 6px; padding:0; border:0; color:inherit; background:none; font:inherit; text-align:left; }
.sec-num {
  display:grid; width:26px; height:26px; flex:none; place-items:center; border-radius:50%;
  color:var(--gold-soft); background:linear-gradient(145deg,var(--green-700),var(--green-900));
  box-shadow:0 2px 6px rgba(15,46,34,.3); font-size:14px; font-weight:700;
}
.sec-title { color:var(--green-800); font-size:16px; font-weight:800; letter-spacing:.5px; }
.sec-hint { margin:2px 0 12px 36px; color:var(--ink-soft); font-size:12px; }
.field { margin-top:13px; }
.field:first-of-type { margin-top:4px; }
.lbl { display:block; margin-bottom:6px; color:var(--green-800); font-size:13.5px; font-weight:600; }
.req { margin-left:3px; color:var(--red); }
.opt { margin-left:4px; color:var(--ink-soft); font-size:12px; font-weight:500; }
input[type=text], input[type=tel], input[type=email], input[type=date], input[type=number], select, textarea {
  width:100%; padding:12px 13px; border:1.5px solid var(--line); border-radius:11px; outline:none;
  color:var(--ink); background:var(--paper); appearance:none; font:inherit; font-size:15px;
  transition:border-color .15s,box-shadow .15s;
}
textarea { min-height:74px; resize:vertical; line-height:1.5; }
input:focus, select:focus, textarea:focus { border-color:var(--gold); background:#fff; box-shadow:0 0 0 3px rgba(201,162,74,.18); }
input::placeholder, textarea::placeholder { color:#b3ab97; }
select {
  padding-right:36px; background-image:linear-gradient(45deg,transparent 50%,var(--gold-deep) 50%),linear-gradient(135deg,var(--gold-deep) 50%,transparent 50%);
  background-position:calc(100% - 18px) 50%,calc(100% - 12px) 50%; background-repeat:no-repeat; background-size:6px 6px,6px 6px;
}
.row2 { display:flex; gap:10px; align-items:stretch; margin-top:13px; }
.row2 > * { min-width:0; flex:1; }
.row2 .field { display:flex; flex-direction:column; margin-top:0; }
.row2 .field .lbl { flex:0 0 auto; }
.row2 .field input, .row2 .field select, .row2 .field textarea, .row2 .field .pills { margin-top:auto; }
.tiers { display:flex; flex-direction:column; gap:10px; margin-top:6px; }
.tier {
  position:relative; display:flex; align-items:center; gap:12px; padding:13px 14px; cursor:pointer;
  border:1.5px solid var(--line); border-radius:13px; background:var(--paper); transition:.15s;
}
.tier input, .pill input { position:absolute; opacity:0; pointer-events:none; }
.tier .dot { display:grid; width:20px; height:20px; flex:none; place-items:center; border:2px solid #c7bd9f; border-radius:50%; transition:.15s; }
.tier .dot::after { content:""; width:9px; height:9px; border-radius:50%; background:var(--gold); transform:scale(0); transition:.15s; }
.tier .t-body { min-width:0; flex:1; }
.tier .t-name { color:var(--green-800); font-size:14.5px; font-weight:700; }
.tier .t-price { margin-top:2px; color:var(--gold-deep); font-size:13px; font-weight:700; }
.tier:has(input:checked) { border-color:var(--gold); background:#fff; box-shadow:0 4px 14px rgba(201,162,74,.22); }
.tier:has(input:checked) .dot { border-color:var(--gold); }
.tier:has(input:checked) .dot::after { transform:scale(1); }
.tier:has(input:focus-visible), .pill:has(input:focus-visible), .agree:has(input:focus-visible) { outline:3px solid rgba(201,162,74,.28); outline-offset:2px; }
.pills { display:flex; gap:9px; flex-wrap:wrap; }
.pill { position:relative; min-width:0; flex:1 1 0; }
.pill span {
  display:block; padding:11px 8px; cursor:pointer; border:1.5px solid var(--line); border-radius:11px;
  color:var(--ink-soft); background:var(--paper); text-align:center; font-size:14px; font-weight:600; transition:.15s;
}
.pill input:checked + span { border-color:var(--green-600); color:var(--green-800); background:#fff; box-shadow:0 3px 10px rgba(42,99,73,.18); }
.pill-row { margin-top:9px; }
.rec { margin-top:12px; padding:13px 12px; border:1px dashed var(--gold-soft); border-radius:12px; background:linear-gradient(180deg,#fffdf7,#fbf6ea); }
.rec .rec-h { margin-bottom:8px; color:var(--gold-deep); font-size:13px; font-weight:700; }
.rec .pill span { padding:8px 4px; font-size:12.5px; }
.collapse-toggle { cursor:pointer; }
.collapse-toggle::after {
  content:""; width:9px; height:9px; flex:none; margin-left:auto; border-right:2px solid var(--gold-deep);
  border-bottom:2px solid var(--gold-deep); transform:rotate(45deg); transition:transform .2s;
}
.collapsible:not(.collapsed) .collapse-toggle::after { transform:rotate(-135deg); }
.collapsible.collapsed #recContent { display:none; }
.declare { padding:13px 14px; border:1px solid var(--line); border-radius:11px; color:var(--ink-soft); background:var(--paper-2); font-size:12.5px; line-height:1.85; }
.agree { display:flex; align-items:flex-start; gap:11px; margin-top:14px; cursor:pointer; }
.agree input { position:absolute; opacity:0; }
.agree .box {
  display:grid; width:22px; height:22px; flex:none; place-items:center; margin-top:1px; border:2px solid #c7bd9f;
  border-radius:7px; color:transparent; background:var(--paper); font-size:14px; font-weight:900; transition:.15s;
}
.agree input:checked + .box { border-color:var(--green-600); color:#fff; background:var(--green-600); }
.agree .txt { color:var(--green-800); font-size:13px; font-weight:600; }
.actions { display:flex; flex-direction:column; gap:11px; margin-top:22px; }
.btn {
  display:inline-flex; align-items:center; justify-content:center; padding:15px; border:0; border-radius:13px;
  cursor:pointer; text-decoration:none; font:inherit; font-size:16px; font-weight:700; letter-spacing:2px; transition:.15s;
}
.btn-primary { color:var(--gold-soft); background:linear-gradient(145deg,var(--green-700),var(--green-900)); box-shadow:0 8px 20px rgba(15,46,34,.32); }
.btn-primary:active { transform:translateY(1px); }
.btn:disabled { cursor:wait; opacity:.62; }
.btn-ghost { border:1.5px solid var(--gold-soft); color:var(--green-700); background:transparent; font-size:14px; letter-spacing:1px; }
.err { display:none; margin-top:6px; color:var(--red); font-size:12px; }
.field.invalid > .err, .section.invalid > .err, .agree.invalid ~ .err { display:block; }
.field.invalid input, .field.invalid select, .field.invalid textarea { border-color:var(--red); }
.submit-error { display:none; color:var(--red); text-align:center; font-size:13px; font-weight:600; }
.submit-error.show { display:block; }
footer { padding:22px 20px 30px; color:var(--ink-soft); text-align:center; font-size:11px; line-height:1.8; }
footer .fl { color:var(--gold-deep); font-weight:700; letter-spacing:1px; }
.done { position:fixed; z-index:50; inset:0; display:none; place-items:center; padding:24px; background:rgba(15,46,34,.75); backdrop-filter:blur(3px); }
.done.show { display:grid; }
.done-card { width:100%; max-width:400px; padding:28px 24px; border-radius:20px; background:var(--paper); box-shadow:0 20px 50px rgba(0,0,0,.4); text-align:center; }
.done .ok { display:grid; width:64px; height:64px; margin:0 auto 14px; place-items:center; border-radius:50%; color:var(--gold-soft); background:linear-gradient(145deg,var(--green-600),var(--green-800)); font-size:30px; font-weight:900; }
.done h2 { margin:0 0 8px; color:var(--green-800); font-size:20px; }
.done p { margin:0 0 16px; color:var(--ink-soft); font-size:13.5px; line-height:1.7; }
.application-label { display:block; color:var(--ink-soft); font-size:11px; }
.done code { display:block; margin:6px 0 16px; color:var(--green-800); font-size:12px; font-weight:800; overflow-wrap:anywhere; }
.done .btn { width:100%; }
.done .btn + .btn { margin-top:10px; }
.honeypot { position:absolute!important; left:-10000px!important; width:1px!important; height:1px!important; opacity:0!important; }
@media (max-width:420px) {
  .row2 { gap:8px; }
  .hero h1 { font-size:23px; letter-spacing:1px; }
}
@media (prefers-reduced-motion:reduce) { * { scroll-behavior:auto!important; transition:none!important; } }
