/* Create account page (21 Oct 2026). Same system as the homepage (site.css, hero.css, nav.css) and the shared page
   chrome (page.css). Every class here starts with ca-. The form follows the app's own workspace-setup screen
   (OnboardingInviteView: labels, order, Show/Hide, the three facts, "Create workspace"); "Company" is the one field
   that screen does not have, because today the workspace name comes from Altira's invitation. */

.ca-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);grid-template-areas:'intro form' 'more form';grid-template-rows:auto 1fr;gap:0 56px;align-items:start}
.ca-intro{grid-area:intro}
.ca-more{grid-area:more}
.ca-card{grid-area:form;padding:32px;border:1px solid var(--rule);border-radius:var(--r-frame);background:var(--panel)}
.ca-intro .t-body{margin:22px 0 0;max-width:460px;font-size:17px;line-height:26px}
.ca-facts{list-style:none;margin:32px 0 0;padding:16px 0 0;border-top:1px solid var(--rule);display:grid;gap:10px}
.ca-facts li{display:flex;gap:12px;font-size:15px;line-height:22px;color:var(--ink)}
.ca-facts li::before{content:'';flex:none;width:7px;height:7px;margin-top:8px;background:var(--amber)}
.ca-alt{margin:18px 0 0;font-size:15px;line-height:22px;color:var(--ink-2)}
.ca-alt a,.ca-terms a{color:var(--link);text-underline-offset:3px}

.ca-form{display:grid;gap:16px}
.ca-eye{margin:0;font-weight:600;font-size:12px;line-height:16px;letter-spacing:.06em;text-transform:uppercase;color:var(--link)}
.ca-f{display:flex;flex-direction:column;gap:6px;min-width:0}
.ca-f > span,.ca-f label{font-weight:600;font-size:12px;line-height:16px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink)}
.ca-pw{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.ca-show{all:unset;font-weight:500;font-size:12px;line-height:16px;letter-spacing:.04em;color:var(--link);text-decoration:underline;text-underline-offset:2px;cursor:pointer}
.ca-show:focus-visible{outline:2px solid var(--link);outline-offset:2px}
.ca-f input{box-sizing:border-box;width:100%;min-height:42px;padding:9px 12px;border:1px solid var(--edge);border-radius:var(--r-btn);background:#fbfdfe;font:400 16px/22px var(--sans);color:var(--ink)}
.ca-f input:focus-visible{outline:2px solid var(--link);outline-offset:1px;border-color:var(--link)}
.ca-f [aria-invalid=true],.ca-f [aria-invalid=true]:focus-visible{border-color:#a3321f;outline-color:#a3321f}
.ca-verify{display:flex;align-items:center;min-height:65px;padding:0 14px;border:1px dashed var(--edge);border-radius:var(--r-btn);background:#fbfdfe;font-size:14px}
.ph{display:inline-block;padding:0 6px;border:1px dashed var(--edge);border-radius:4px;background:repeating-linear-gradient(135deg,transparent 0 6px,rgb(23 59 79 / .05) 6px 12px);color:var(--ink-2)}
.ca-verify .ph{border:0;background:none;padding:0}
.ca-err{padding:12px 14px;border-left:2px solid #a3321f;background:#fbeeea;font-size:15px;line-height:22px;color:#7d2617}
.ca-err a{color:#7d2617;text-underline-offset:3px}
.ca-err:focus{outline:2px solid #a3321f;outline-offset:2px}
.ca-err[hidden]{display:none}
.ca-terms{margin:0;font-size:14px;line-height:20px;color:var(--ink-2)}
.ca-act .btn:disabled{background:#c9d5dd;border-color:#c9d5dd;color:#5a6d7a;cursor:not-allowed}
.ca-status{min-height:0;margin:0;font-size:15px;line-height:22px}
.ca-status:focus{outline:none}
.ca-status.is-note{padding:12px 14px;border-left:2px solid var(--navy);background:#fbfdfe;color:var(--ink)}
.ca-status.is-note:focus{outline:2px solid var(--navy);outline-offset:2px}

@media (max-width:1024px){
  /* headline, then the form, then the rest */
  .ca-grid{grid-template-columns:minmax(0,1fr);grid-template-areas:'intro' 'form' 'more';grid-template-rows:none;gap:32px}
  .ca-facts{margin-top:0}
}
@media (max-width:600px){
  .ca-card{padding:22px 18px}
  .ca-act .btn{width:100%;justify-content:center}
}

/* the product moment above the facts */
.ca-more .pm{margin-top:32px}
.ca-more .pm + .ca-facts{margin-top:28px}
@media (max-width:1024px){ .ca-more .pm{margin-top:0} }
