/* Sign up / log in: brand panel with a short pitch on the left, form card on the right. Clearwave tokens. */
.au-body { margin: 0; background: var(--cw-bg); color: var(--cw-ink); font-family: "DM Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
.au { display: grid; grid-template-columns: minmax(320px, 0.9fr) minmax(0, 1.1fr); min-height: 100vh; }
.au-side { position: relative; overflow: hidden; display: flex; flex-direction: column; gap: 28px; padding: 40px 44px; color: #eafbf6;
  background: radial-gradient(120% 90% at 0% 0%, #14b8a6 0%, #0f766e 45%, #0b4f47 100%); }
.au-side::after { content: ""; position: absolute; right: -120px; bottom: -120px; width: 360px; height: 360px; border-radius: 50%;
  background: radial-gradient(circle, rgba(143, 227, 205, .35), transparent 70%); pointer-events: none; }
.au-brand { display: flex; align-items: center; gap: 10px; color: #fff; text-decoration: none; font-weight: 700; font-size: 18px; }
.au-brand img { width: 40px; height: 40px; object-fit: contain; background: #fff; border-radius: 10px; padding: 4px; }
.au-brand em { font-style: normal; color: #a7f3d0; }
.au-pitch { margin: auto 0; max-width: 460px; position: relative; z-index: 1; }
.au-pitch h2 { font-size: clamp(24px, 2.4vw, 32px); line-height: 1.2; margin: 0 0 10px; font-weight: 700; letter-spacing: -.02em; text-wrap: balance; }
.au-pitch > p { margin: 0 0 22px; color: #c9f2e6; font-size: 15px; }
.au-points { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.au-points li { display: flex; gap: 12px; align-items: flex-start; }
.au-points b { display: block; font-size: 15px; }
.au-points span:not(.au-ic) { font-size: 13.5px; color: #c9f2e6; }
.au-ic { width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; flex: none; background: rgba(255, 255, 255, .14); border: 1px solid rgba(255, 255, 255, .22); font-size: 17px; color: #fff; }
.au-trust { font-size: 12.5px; color: #c9f2e6; display: flex; gap: 8px; align-items: center; position: relative; z-index: 1; }
.au-main { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 40px 20px; }
.au-card { width: min(460px, 100%); background: var(--cw-surface); border: 1px solid var(--cw-line); border-radius: 18px; box-shadow: var(--cw-shadow-md); padding: 32px 30px; }
.au-card h1 { margin: 0 0 6px; font-size: 24px; font-weight: 700; letter-spacing: -.02em; }
.au-card .au-sub { margin: 0 0 22px; color: var(--cw-ink-soft); font-size: 14.5px; }
.au-field { margin-bottom: 16px; }
.au-field label { display: block; font-size: 13px; font-weight: 600; margin-bottom: 6px; color: var(--cw-ink); }
.au-input { display: flex; align-items: center; gap: 10px; height: 46px; padding: 0 12px; border: 1px solid var(--cw-line); border-radius: 12px; background: var(--cw-bg); transition: border-color .15s, box-shadow .15s; }
.au-input:focus-within { border-color: var(--cw-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--cw-accent) 22%, transparent); }
.au-input > .bi { color: var(--cw-ink-faint); font-size: 16px; }
.au-input input, .au-input select { flex: 1; min-width: 0; border: 0; outline: 0; background: none; color: var(--cw-ink); font: inherit; font-size: 15px; height: 100%; }
.au-input button { border: 0; background: none; color: var(--cw-ink-faint); padding: 4px; cursor: pointer; }
.au-field.has-error .au-input { border-color: var(--cw-danger); }
.au-err { color: var(--cw-danger); font-size: 12.5px; margin-top: 5px; }
.au-help { color: var(--cw-ink-faint); font-size: 12.5px; margin-top: 5px; }
.au-strength { display: flex; align-items: center; gap: 8px; margin-top: 6px; font-size: 12px; color: var(--cw-ink-faint); }
.au-strength::before { content: ""; height: 5px; border-radius: 99px; width: 120px; background: linear-gradient(90deg, var(--c, var(--cw-line)) var(--w, 0%), var(--cw-line) 0); }
.au-strength[data-level="1"] { --w: 20%; --c: #dc2626; } .au-strength[data-level="2"] { --w: 40%; --c: #d97706; }
.au-strength[data-level="3"] { --w: 60%; --c: #ca8a04; } .au-strength[data-level="4"] { --w: 80%; --c: #059669; } .au-strength[data-level="5"] { --w: 100%; --c: #047857; }
.au-check { display: flex; gap: 10px; align-items: flex-start; font-size: 13.5px; color: var(--cw-ink-soft); margin: 4px 0 16px; }
.au-check input { margin-top: 3px; accent-color: var(--cw-teal); }
.au-btn { width: 100%; height: 48px; border: 0; border-radius: 12px; background: var(--cw-teal); color: #fff; font: inherit; font-weight: 700; font-size: 15px; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 8px; text-decoration: none; }
.au-btn:hover { filter: brightness(1.07); }
.au-btn:disabled { opacity: .7; cursor: wait; }
.au-btn.ghost { background: none; color: var(--cw-ink); border: 1px solid var(--cw-line); }
[data-theme="dark"] .au-btn:not(.ghost) { color: #05221d; }
.au-row { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin: -4px 0 16px; font-size: 13.5px; }
.au-row a, .au-foot a, .au-card a { color: var(--cw-teal); font-weight: 600; text-decoration: none; }
.au-foot { margin-top: 18px; font-size: 14px; color: var(--cw-ink-soft); }
.au-ts { margin: 6px 0 16px; min-height: 65px; }
.au-hp { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }
.au-alert { padding: 10px 12px; border-radius: 10px; font-size: 13.5px; margin-bottom: 16px; }
.au-alert-danger { background: #fee2e2; color: #991b1b; } .au-alert-success { background: #dcfce7; color: #166534; }
.au-alert-warning { background: #fef3c7; color: #92400e; } .au-alert-info { background: #e0f2fe; color: #075985; }
.au-big-ic { width: 64px; height: 64px; border-radius: 18px; display: grid; place-items: center; font-size: 28px; background: var(--cw-seafoam-soft); color: var(--cw-teal); margin-bottom: 16px; }
.au-steps { display: flex; gap: 6px; margin-bottom: 22px; }
.au-steps span { flex: 1; height: 5px; border-radius: 99px; background: var(--cw-line); }
.au-steps span.on { background: var(--cw-teal); }
.au-stepno { font-size: 12.5px; color: var(--cw-ink-faint); font-weight: 700; text-transform: uppercase; letter-spacing: .06em; margin-bottom: 6px; }
.au-choices { display: grid; gap: 10px; margin-bottom: 18px; }
.au-choice { display: flex; gap: 12px; align-items: flex-start; padding: 14px; border: 1px solid var(--cw-line); border-radius: 14px; cursor: pointer; background: var(--cw-bg); }
.au-choice:hover { border-color: var(--cw-accent); }
.au-choice input { margin-top: 4px; accent-color: var(--cw-teal); }
.au-choice:has(input:checked) { border-color: var(--cw-teal); background: color-mix(in srgb, var(--cw-accent) 8%, var(--cw-surface)); }
.au-choice .au-ic { background: var(--cw-seafoam-soft); border: 0; color: var(--cw-teal); }
.au-choice b { display: block; font-size: 14.5px; } .au-choice small { color: var(--cw-ink-soft); font-size: 13px; }
.au-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.au-chip { display: inline-flex; align-items: center; gap: 7px; padding: 8px 12px; border-radius: 99px; border: 1px solid var(--cw-line); background: var(--cw-bg); cursor: pointer; font-size: 13.5px; }
.au-chip input { position: absolute; opacity: 0; pointer-events: none; }
.au-chip:has(input:checked) { border-color: var(--cw-teal); background: var(--cw-teal); color: #fff; }
.au-chip:has(input:focus-visible) { outline: 2px solid var(--cw-accent); outline-offset: 2px; }
.au-actions { display: flex; gap: 10px; }
.au-actions .au-btn { flex: 1; }
@media (max-width: 900px) {
  .au { grid-template-columns: 1fr; }
  .au-side { padding: 22px 20px; gap: 14px; }
  .au-pitch { margin: 0; }
  .au-pitch h2 { font-size: 21px; }
  .au-points { grid-template-columns: 1fr 1fr; gap: 10px; }
  .au-points span:not(.au-ic) { display: none; }
  .au-main { padding: 20px 16px 36px; justify-content: flex-start; }
  .au-card { padding: 24px 20px; }
}
@media (prefers-reduced-motion: reduce) { .au-input { transition: none; } }
/* Phone with country code */
.au-phone { padding-left: 0; overflow: hidden; }
.au-dial { display: inline-flex; align-items: center; gap: 4px; height: 100%; padding: 0 12px; border-right: 1px solid var(--cw-line); background: var(--cw-bg-tint, rgba(0,0,0,.03)); color: var(--cw-ink); font-weight: 700; font-size: 14px; white-space: nowrap; }