/* /createAccount — the card shell only.

   The form inside it styles itself (signupCard.css), which is the same file the landing
   page's hero and closing-CTA cards get. Everything that used to re-skin the fields,
   the eye toggle and the submit button lived here in one copy and in home.css in
   another; the two drifted. This file now owns the card and its header, nothing else. */

.company-name {
    color: var(--fw-brand, #00afb5);
}

.container {
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
}

/* Centered signup card: the old layout floated 40%-wide rows on a center-aligned body,
   which read as unanchored. Everything now lives in one card, left-aligned form fields. */
.create-account-body {
    max-width: 540px;
    margin: 48px auto 64px;
    padding: 30px 32px 26px;
    background: #ffffff;
    border: 1px solid var(--fw-border, #e2e8f0);
    border-radius: 16px;
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.08);
    text-align: left;
}

.create-account-head {
    padding-bottom: 18px;
    margin-bottom: 22px;
    border-bottom: 1px solid var(--fw-border, #e2e8f0);
}

.create-account-head h2 {
    margin: 0;
    font-size: 2.05rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1.15;
    color: var(--fw-ink, #0f172a);
}

.create-account-head .information {
    margin: 6px 0 0;
    font-size: 1.06rem;
    color: var(--fw-ink-soft, #64748b);
}

@media (max-width: 650px) {
    .create-account-body {
        max-width: 100%;
        margin: 16px 12px 32px;
        padding: 22px 20px 20px;
    }

    .create-account-head h2 { font-size: 1.75rem; }
}