/* City Suite application page (prefix ca-). Shares the cs- kit from city-suite.css. */
.ca__grid { display: grid; gap: 24px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 960px) { .ca__grid { grid-template-columns: minmax(0, 1.7fr) minmax(280px, 1fr); align-items: start; } }
.ca__main, .ca__side { display: grid; gap: 20px; min-width: 0; }
.ca__side .cs-card__body > * + * { margin-top: 10px; }
.ca__fieldset { border: 1px solid var(--line); border-radius: 12px; padding: 12px 16px 4px; margin: 0 0 16px; min-width: 0; }
.ca__fieldset legend { font: 800 14px/1.3 var(--f-ui); padding: 0 8px; }
.ca__fieldset legend em { font-style: normal; font-weight: 600; color: var(--muted); }
.ca__how { margin: 10px 0 0; padding: 0; list-style: none; counter-reset: ca; display: grid; gap: 12px; }
.ca__how li { counter-increment: ca; position: relative; padding-left: 42px; font-size: 14.5px; line-height: 1.45; }
.ca__how li::before { content: counter(ca); position: absolute; left: 0; top: -1px; width: 30px; height: 30px; border-radius: 50%; background: var(--ink); color: #fff; display: grid; place-items: center; font: 850 14px/1 var(--f-ui); }
.ca__list { margin: 8px 0 0; padding-left: 18px; font-size: 14.5px; line-height: 1.55; }
.ca__lookupform { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; }
.ca__lookupform .cs-field { flex: 1 1 220px; margin: 0; }
.ca__steps { list-style: none; margin: 14px 0; padding: 0; display: grid; gap: 0; }
.ca__steps li { position: relative; padding: 0 0 18px 44px; font-size: 15.5px; min-height: 44px; }
.ca__steps li:last-child { padding-bottom: 0; }
.ca__steps li::before { content: ""; position: absolute; left: 13px; top: 28px; bottom: 0; width: 2px; background: var(--line); }
.ca__steps li:last-child::before { content: none; }
.ca__steps li .ca__dot { position: absolute; left: 0; top: 0; width: 28px; height: 28px; border-radius: 50%; border: 2px solid var(--line); background: var(--card); display: grid; place-items: center; font: 900 13px/1 var(--f-ui); color: var(--muted); }
.ca__steps li.is-done .ca__dot { background: var(--cs-ok); border-color: var(--cs-ok); color: #fff; }
.ca__steps li.is-now .ca__dot { border-color: var(--pink); color: var(--pink); box-shadow: 0 0 0 4px rgba(255,46,136,.15); }
.ca__steps li.is-bad .ca__dot { background: var(--cs-warn); border-color: var(--cs-warn); color: #fff; }
.ca__steps b { display: block; }
.ca__steps small { color: var(--muted); font-size: 13.5px; }
.ca__faq { margin-top: 40px; max-width: 820px; }
.ca__faq details { border-bottom: 1px solid var(--line); padding: 0; }
.ca__faq summary { cursor: pointer; padding: 14px 0; min-height: 44px; font: 800 16px/1.35 var(--f-ui); list-style: none; display: flex; justify-content: space-between; gap: 12px; align-items: center; }
.ca__faq summary::-webkit-details-marker { display: none; }
.ca__faq summary::after { content: "+"; font-size: 22px; line-height: 1; color: var(--pink-d); flex: none; }
.ca__faq details[open] summary::after { content: "\2212"; }
.ca__faq details p { margin: 0 0 14px; font: 400 16px/1.55 var(--f-body); color: var(--muted); }