/* Asset Tree Homes · Direct Walk-in Registration v2.0
   Brand tokens match the GRE portal: navy #28316f wordmark, gold #f4aa1c accent. */
:root{
  --c:#28316f;--c-dk:#1b2350;--c-lt:#eaecf5;--c-mid:#3d4a96;--c-glow:rgba(40,49,111,.15);
  --gold:#f4aa1c;--gold-lt:#fdf3e0;--gold-dk:#c98708;--green:#12805a;--green-lt:#e5f0ea;
  --red:#c8322a;--red-lt:#f7e9e8;--text:#14173a;--text-2:#3a4066;--text-3:#6b7196;
  --border:#d5d9ea;--bg:#f5f6fb;--card:#fff;--shadow:0 12px 48px rgba(20,23,58,.12);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{min-height:100vh;font-family:'Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',sans-serif;color:var(--text);
  background:radial-gradient(1200px 600px at 50% -10%,var(--c-lt),var(--bg) 70%) fixed;-webkit-font-smoothing:antialiased;line-height:1.45}
[hidden]{display:none!important}
button,input,select,textarea{font:inherit;color:inherit}

/* ── Shell ── */
.wrap{width:100%;max-width:560px;margin:0 auto;padding:20px 16px 40px}
.wrap.narrow{max-width:420px;min-height:100vh;display:flex;flex-direction:column;justify-content:center}
.card{background:var(--card);border:1px solid var(--border);border-radius:20px;box-shadow:var(--shadow);padding:26px 22px 22px}
.logo{display:block;width:190px;max-width:70%;height:auto;margin:0 auto 16px}
.rule{display:flex;height:4px;border-radius:4px;overflow:hidden;margin:0 0 18px}
.rule i{flex:1;background:var(--c)}.rule b{width:64px;background:var(--gold)}
.eyebrow{font-size:11px;letter-spacing:1.6px;text-transform:uppercase;color:var(--text-3);font-weight:700}
h1{font-size:22px;color:var(--c);margin:4px 0 6px;font-weight:800;letter-spacing:-.01em}
h2{font-size:15px;color:var(--text);font-weight:800;margin:18px 0 10px}
.muted{color:var(--text-3);font-size:14px;margin-bottom:16px}
.foot{margin-top:18px;font-size:12px;color:var(--text-3);text-align:center}

/* ── Top bar ── */
.top{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.top img{height:38px;width:auto}
.top .who{margin-left:auto;text-align:right;font-size:12px;color:var(--text-3);min-width:0}
.top .who b{display:block;color:var(--text-2);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:190px}
.out{background:none;border:0;color:var(--c-mid);font-weight:700;font-size:12px;cursor:pointer;padding:2px 0}
.banner{background:var(--gold-lt);border-left:4px solid var(--gold);border-radius:10px;padding:10px 12px;font-size:13px;color:var(--text-2);margin-bottom:12px}

/* ── Steps ── */
.steps{display:flex;gap:6px;margin:14px 0 18px;list-style:none}
.steps li{flex:1;font-size:11px;font-weight:700;color:var(--text-3);text-transform:uppercase;letter-spacing:.6px;
  padding-top:8px;border-top:4px solid var(--border)}
.steps li.on{color:var(--c);border-color:var(--c)}
.steps li.done{color:var(--text-2);border-color:var(--gold)}

/* ── Fields ── */
.field{display:block;margin:0 0 14px}
.field>span{display:block;font-size:13px;font-weight:700;color:var(--text-2);margin-bottom:6px}
.field>span em{font-style:normal;font-weight:500;color:var(--text-3)}
.field input,.field textarea,.field select{width:100%;min-height:48px;border:1.5px solid var(--border);border-radius:12px;background:var(--card);
  font-size:16px;padding:0 14px;outline:none;transition:border-color .15s,box-shadow .15s}
.field textarea{padding:12px 14px;min-height:84px;resize:vertical}
.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--c);box-shadow:0 0 0 4px var(--c-glow)}
.field .bad{border-color:var(--red)}
.hint{display:block;color:var(--text-3);font-size:12px;margin-top:6px}
.err{min-height:20px;color:var(--red);font-size:13.5px;font-weight:600;margin:2px 0 8px}
.code{letter-spacing:10px;text-align:center;font-size:24px!important;font-weight:800;font-family:Consolas,Menlo,monospace}

/* ── Choice chips ── */
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:6px}
.chip{min-height:44px;padding:0 16px;border:1.5px solid var(--border);border-radius:999px;background:var(--card);font-weight:700;
  font-size:14px;color:var(--text-2);cursor:pointer;transition:background .12s,border-color .12s,color .12s}
.chip:hover{border-color:var(--c-mid)}
.chip:focus-visible,.btn:focus-visible,.link:focus-visible,.out:focus-visible{outline:3px solid var(--c-glow);outline-offset:2px}
.chip[aria-pressed="true"]{background:var(--c);border-color:var(--c);color:#fff}

/* ── Buttons ── */
.btn{width:100%;min-height:50px;border:0;border-radius:999px;background:var(--c);color:#fff;font-weight:800;font-size:16px;
  cursor:pointer;transition:background .15s,transform .08s}
.btn:hover{background:var(--c-mid)}.btn:active{transform:scale(.99)}.btn:disabled{opacity:.55;cursor:default}
.btn.ghost{background:var(--c-lt);color:var(--c)}
.btn.gold{background:var(--gold);color:var(--c-dk)}
.row{display:flex;gap:10px;margin-top:8px}.row .btn.ghost{flex:0 0 34%}
.link{display:block;margin:12px auto 0;background:none;border:0;color:var(--c-mid);font-weight:700;font-size:14px;cursor:pointer;padding:4px 8px}
.link:disabled{color:var(--text-3);cursor:default}

/* ── Summary / notices ── */
.sum{border:1px solid var(--border);border-radius:14px;overflow:hidden;margin-bottom:14px}
.sum div{display:flex;justify-content:space-between;gap:14px;padding:10px 14px;font-size:14px;border-top:1px solid var(--border)}
.sum div:first-child{border-top:0}
.sum dt{color:var(--text-3);flex:0 0 auto}.sum dd{font-weight:700;text-align:right;word-break:break-word}
.note{border-radius:10px;padding:12px 14px;font-size:13.5px;margin:0 0 14px;background:var(--c-lt);border-left:4px solid var(--gold);color:var(--text-2)}
.note.good{background:var(--green-lt);border-color:var(--green);color:#0f4a36}
.note.warn{background:var(--red-lt);border-color:var(--red);color:#6b1c17}
.check{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;color:var(--text-2);margin:0 0 12px;cursor:pointer}
.check input{width:20px;height:20px;margin-top:1px;accent-color:var(--c);flex:0 0 auto}
.tick{width:64px;height:64px;border-radius:50%;background:var(--green-lt);color:var(--green);display:flex;align-items:center;justify-content:center;margin:4px auto 12px}
.tick svg{width:34px;height:34px}
.center{text-align:center}.left{text-align:left}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}