/* Account and contact flows use the same concise, bilingual form language. */
.account-workspace {
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,.9fr);
    gap:80px;
    align-items:start;
    max-width:1220px;
    padding-block:56px 72px
}

.account-card {
    padding:36px 40px 30px;
    background:#fff;
    border:1px solid var(--color-line,#d8dcd9);
    border-radius:4px;
    min-width:0
}

.account-card>header {
    padding-bottom:28px;
    margin-bottom:28px;
    border-bottom:1px solid var(--color-line,#d8dcd9)
}

.account-card h1 {
    font-size:clamp(29px,3.1vw,42px);
    line-height:1.4;
    letter-spacing:-.025em;
    margin:14px 0
}

.account-card header p {
    font-size:17px;
    line-height:1.85;
    margin:0;
    color:var(--color-muted,#53616a)
}

.account-card .form-stack {
    display:grid;
    gap:22px
}

.account-card .field {
    display:grid;
    gap:10px;
    font-size:15px;
    font-weight:500
}

.account-card input,.account-card textarea {
    font-size:17px;
    line-height:1.5;
    min-width:0;
    border-radius:4px;
    background:#fff
}

.account-card input:not([type=checkbox]) {
    min-height:52px;
    width:100%
}

.account-card .field small {
    font-size:14px;
    color:var(--color-muted,#53616a);
    font-weight:400
}

.account-card .form-stack>.button {
    width:100%;
    justify-content:space-between;
    min-height:54px;
    margin-top:4px
}

.account-form-options {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    flex-wrap:wrap;
    font-size:15px
}

.account-form-options>a {
    color:var(--color-primary,#254eff);
    min-height:44px;
    display:flex;
    align-items:center
}

.account-card .checkbox {
    display:flex;
    align-items:center;
    gap:10px;
    font-size:15px;
    line-height:1.6;
    min-height:44px
}

.account-card .checkbox input {
    width:19px;
    height:19px;
    accent-color:var(--color-primary,#254eff);
    flex-shrink:0
}

.account-field-error {
    color:#a83827;
    font-size:14px;
    line-height:1.7;
    margin:-12px 0 0
}

.account-card [aria-invalid=true] {
    border-color:#a83827
}

.account-switch {
    display:flex;
    align-items:center;
    justify-content:space-between;
    flex-wrap:wrap;
    gap:12px;
    margin-top:28px;
    padding-top:20px;
    border-top:1px solid var(--color-line,#d8dcd9);
    font-size:15px;
    color:var(--color-muted,#53616a)
}

.account-switch>a {
    display:flex;
    align-items:center;
    gap:14px;
    color:var(--color-primary,#254eff);
    min-height:44px;
    font-size:16px
}

.account-story {
    padding-top:30px;
    position:relative
}

.account-story::before {
    content:'';
    display:block;
    width:44px;
    height:44px;
    border-top:3px solid var(--color-primary,#254eff);
    border-inline-start:3px solid var(--color-primary,#254eff);
    margin-bottom:34px
}

.account-story h2 {
    font-size:clamp(32px,3.6vw,48px);
    line-height:1.5;
    letter-spacing:-.025em;
    margin:18px 0 20px
}

.account-story h2>span {
    color:var(--color-primary,#254eff)
}

.account-story>p {
    font-size:19px;
    line-height:1.9;
    color:var(--color-muted,#53616a);
    max-width:480px
}

.account-benefits {
    padding:0;
    list-style:none;
    margin:32px 0
}

.account-benefits li {
    display:flex;
    align-items:start;
    gap:18px;
    padding:22px 0;
    border-top:1px solid var(--color-line,#d8dcd9)
}

.account-benefits .icon {
    width:25px;
    height:25px;
    color:var(--color-primary,#254eff);
    flex-shrink:0;
    margin-top:3px
}

.account-benefits strong {
    font-size:18px;
    display:block;
    font-weight:600
}

.account-benefits span {
    display:block;
    font-size:16px;
    line-height:1.75;
    color:var(--color-muted,#53616a);
    margin-top:6px
}

.account-story>.text-link {
    font-size:16px;
    min-height:44px
}

.account-contact .account-story {
    grid-column:1;
    grid-row:1
}

.account-contact .account-card {
    grid-column:2;
    grid-row:1
}

.account-contact .account-story h1 {
    font-size:clamp(34px,4vw,54px);
    line-height:1.4;
    margin:18px 0 22px;
    letter-spacing:-.02em
}

.account-contact-points {
    padding:24px 0;
    border-block:1px solid var(--color-line,#d8dcd9);
    margin:28px 0
}

.account-contact-points summary {
    font-size:20px;
    font-weight:600;
    cursor:pointer
}

.account-contact-points[open] summary {
    margin-bottom:16px
}

.account-contact-points p {
    font-size:17px;
    line-height:1.8;
    color:var(--color-muted,#53616a);
    margin:0
}

.account-contact-points+.text-link {
    font-size:17px
}

.account-card .honeypot {
    position:absolute;
    inset-inline-start:-9999px;
    width:1px;
    height:1px;
    opacity:0
}

@media(max-width:1000px) {
    .account-workspace {
        gap:40px;
        padding-block:40px 56px
    }

    .account-card {
        padding:28px
    }

    .account-story h2 {
        font-size:35px
    }

    .account-story>p {
        font-size:18px
    }

}

@media(max-width:720px) {
    .account-workspace {
        grid-template-columns:minmax(0,1fr);
        gap:24px;
        padding-block:24px 40px
    }

    .account-card {
        padding:26px 22px
    }

    .account-card>header {
        margin-bottom:24px;
        padding-bottom:24px
    }

    .account-card h1 {
        font-size:32px
    }

    .account-story {
        padding:24px 8px
    }

    .account-story::before {
        width:30px;
        height:30px;
        margin-bottom:24px
    }

    .account-story h2 {
        font-size:32px;
        margin:16px 0
    }

    .account-story>p {
        font-size:18px
    }

    .account-benefits {
        margin-block:24px
    }

    .account-contact .account-story,.account-contact .account-card {
        grid-column:auto;
        grid-row:auto
    }

    .account-contact .account-story {
        padding-top:0
    }

    .account-contact .account-story::before {
        display:none
    }

    .account-contact .account-story h1 {
        font-size:36px
    }

    .account-contact-points {
        margin:20px 0;
        padding:20px 0
    }

}
