/* Login + create business */
.split { display: grid; grid-template-columns: minmax(340px, 1fr) minmax(0, 1.15fr); min-height: 100vh; }
.pitch { background: radial-gradient(900px 500px at 0% 0%, #6366f1 0%, #4338ca 45%, #312e81 100%); color: #fff; padding: 40px; display: flex; flex-direction: column; gap: 24px; position: relative; overflow: hidden; }
.pitch::after { content: ""; position: absolute; width: 420px; height: 420px; border-radius: 50%; right: -140px; bottom: -140px; background: rgba(255, 255, 255, .07); }
.pitch .brand { display: inline-flex; align-items: center; position: relative; z-index: 1; }
.pitch .brand img { height: 34px; width: auto; display: block; }
.pitch-in { margin: auto 0; max-width: 440px; position: relative; z-index: 1; }
.pitch h2 { font-size: clamp(26px, 3vw, 38px); font-weight: 800; letter-spacing: -1px; line-height: 1.15; margin-bottom: 12px; }
.pitch p { font-size: 16px; opacity: .85; margin-bottom: 24px; }
.pitch ul { list-style: none; display: grid; gap: 14px; }
.pitch li { display: flex; gap: 12px; align-items: flex-start; font-size: 14.5px; }
.pitch li .ic { width: 32px; height: 32px; padding: 7px; border-radius: 9px; background: rgba(255, 255, 255, .14); flex: none; }
.pitch li b { display: block; }
.pitch li span { opacity: .8; font-size: 13.5px; }
.mu-l { opacity: .65; font-size: 12.5px; position: relative; z-index: 1; }

.panel { display: flex; flex-direction: column; padding: 24px; background: var(--bg); }
.panel-top { display: flex; justify-content: flex-end; }
.mini-sel { height: 34px; border: 1px solid var(--ln); border-radius: 8px; background: var(--card); padding: 0 8px; font-size: 13px; font-weight: 600; }
.box { width: 100%; max-width: 440px; margin: auto; padding: 20px 0; }
.box h1 { font-size: 26px; font-weight: 800; letter-spacing: -.6px; margin-bottom: 6px; }
.box .sub { color: var(--t2); margin-bottom: 22px; font-size: 14.5px; }
.or { display: flex; align-items: center; gap: 12px; margin: 18px 0; color: var(--mu); font-size: 12.5px; }
.or::before, .or::after { content: ""; flex: 1; height: 1px; background: var(--ln); }
.field input { height: 44px; }
.steps { display: flex; align-items: center; gap: 8px; margin-bottom: 18px; }
.steps span { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-size: 12.5px; font-weight: 700; background: var(--ln-2); color: var(--mu); }
.steps span.on { background: var(--p); color: #fff; }
.steps i { width: 40px; height: 2px; background: var(--ln); }

/* type picker */
.tp-search { display: flex; align-items: center; gap: 8px; height: 42px; padding: 0 12px; border: 1px solid var(--ln); border-radius: 10px; background: var(--card); color: var(--mu); margin-bottom: 14px; }
.tp-search input { border: 0; outline: none; background: transparent; flex: 1; height: 100%; color: var(--ink); }
.tp-cats { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.tp-cat { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding: 14px; border: 1px solid var(--ln); border-radius: 12px; background: var(--card); text-align: left; transition: border-color .15s, box-shadow .15s; }
.tp-cat:hover { border-color: var(--p); box-shadow: 0 0 0 3px color-mix(in srgb, var(--p) 12%, transparent); }
.tp-cat .ic { color: var(--p); padding: 0; }
.tp-cat b { font-size: 14px; }
.tp-cat small { color: var(--mu); font-size: 12px; }
.tp-back { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; color: var(--p); margin-bottom: 10px; font-size: 13.5px; }
.tp-list { display: grid; gap: 6px; max-height: 360px; overflow-y: auto; }
.tp-sub { display: flex; align-items: center; gap: 10px; padding: 11px 12px; border: 1px solid var(--ln); border-radius: 10px; background: var(--card); text-align: left; font-weight: 600; font-size: 14px; }
.tp-sub span { flex: 1; }
.tp-sub small { color: var(--mu); font-weight: 500; font-size: 12px; }
.tp-sub .ic { color: var(--t2); }
.tp-sub:hover { border-color: var(--p); }
.tp-sub.on { border-color: var(--p); background: var(--p-soft); color: var(--p); }
.tp-sub.on .ic { color: var(--p); }

@media (max-width: 860px) {
  .split { grid-template-columns: 1fr; }
  .pitch { padding: 22px 20px; gap: 10px; }
  .pitch-in { margin: 4px 0 0; }
  .pitch h2 { font-size: 22px; margin-bottom: 4px; }
  .pitch p, .pitch ul, .mu-l { display: none; }
  .panel { padding: 16px; }
  .box { margin-top: 0; }
}

.phone-in { display: flex; align-items: stretch; border: 1px solid var(--ln); border-radius: var(--r-sm); background: var(--card); overflow: hidden; }
.phone-in span { display: grid; place-items: center; padding: 0 12px; background: var(--ln-2); color: var(--t2); font-weight: 600; border-right: 1px solid var(--ln); min-width: 56px; }
.phone-in input { border: 0 !important; box-shadow: none !important; flex: 1; }
.phone-in:focus-within { border-color: var(--p); box-shadow: 0 0 0 3px color-mix(in srgb, var(--p) 18%, transparent); }
.forgot { text-align: right; margin: -6px 0 14px; font-size: 13px; }
.err.ok { color: var(--ok); }
