/*
 * AppForze Login 1.8.49
 * Strato finale dedicato alla pagina di accesso.
 */

:root {
    --login-ink: #061833;
    --login-muted: #53677f;
    --login-blue: #0867ff;
    --login-blue-dark: #064dc4;
    --login-line: #cddbeb;
    --login-panel: rgba(255, 255, 255, .94);
}

html,
body {
    min-height: 100%;
}

body {
    margin: 0;
    background: #e3eef7 !important;
    color: var(--login-ink);
    font-family: "Segoe UI", Arial, sans-serif;
    line-height: 1.5;
}

button,
input,
select,
textarea {
    font: inherit;
}

.login-page {
    min-height: 100vh !important;
    min-height: 100dvh !important;
    display: grid !important;
    place-items: center !important;
    padding: clamp(18px, 4vw, 42px) !important;
    /* Atmosphere definitiva in public-surfaces.css — niente wash bianco qui */
    background: #e3eef7 !important;
}

.login-page::before {
    inset: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: none !important;
    box-shadow: none !important;
}

.login-page::after {
    inset: 0 !important;
    width: auto !important;
    height: auto !important;
    border-radius: 0 !important;
    background: none !important;
    transform: none !important;
    box-shadow: none !important;
}

.soft-shape,
.dot-band {
    display: none !important;
}

.login-shell {
    position: relative !important;
    width: min(390px, 100%) !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.login-shell::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: -1;
    width: min(540px, 94vw);
    height: min(540px, 94vw);
    border: 1px solid rgba(255,255,255,.58);
    border-radius: 44px;
    background:
        linear-gradient(135deg, rgba(8,103,255,.10), rgba(255,255,255,.18)),
        linear-gradient(180deg, rgba(255,255,255,.48), rgba(255,255,255,0));
    transform: translate(-50%, -50%) rotate(-8deg);
    box-shadow: 0 34px 90px rgba(6,24,51,.10);
}

.brand-panel {
    display: flex !important;
    justify-content: center !important;
    padding: 0 !important;
}

.brand-core {
    display: grid;
    justify-items: center;
}

.af-mark {
    width: min(214px, 72vw) !important;
    margin: 0 auto 4px !important;
    filter: drop-shadow(0 15px 26px rgba(6,24,51,.14)) !important;
}

.brand-title,
.brand-line,
.brand-subtitle,
.brand-trust,
.brand-version,
.login-kicker,
.login-copy,
.login-accent {
    display: none !important;
}

.login-card {
    width: 100% !important;
    max-width: none !important;
    padding: 24px !important;
    border: 1px solid rgba(199, 216, 237, .95) !important;
    border-radius: 18px !important;
    background: var(--login-panel) !important;
    box-shadow:
        0 24px 64px rgba(6,24,51,.16),
        0 0 0 1px rgba(255,255,255,.72) inset !important;
    backdrop-filter: blur(18px) !important;
}

.login-card h2 {
    margin: 0 0 18px !important;
    color: var(--login-ink) !important;
    font-size: 24px !important;
    font-weight: 850 !important;
    line-height: 1.1 !important;
    text-align: center !important;
}

.alert {
    margin: 0 0 14px !important;
    border-radius: 12px !important;
    font-size: 13px !important;
    line-height: 1.35 !important;
}

.field {
    margin-bottom: 13px !important;
}

.field label {
    margin-bottom: 7px !important;
    color: #203550 !important;
    font-size: 12px !important;
    font-weight: 900 !important;
}

.field input {
    height: 46px !important;
    padding-right: 48px !important;
    padding-left: 48px !important;
    border-color: var(--login-line) !important;
    border-radius: 12px !important;
    background: #fbfdff !important;
    color: var(--login-ink) !important;
    font-size: 14px !important;
    font-weight: 400 !important;
}

.field input:focus {
    border-color: var(--login-blue) !important;
    box-shadow: 0 0 0 4px rgba(8,103,255,.12) !important;
}

.field-icon {
    bottom: 13px !important;
    left: 18px !important;
}

.field-icon::before,
.field-icon::after,
.password-eye::before,
.password-eye::after {
    content: none !important;
    display: none !important;
}

.field-icon svg,
.password-eye svg {
    display: block;
    width: 100%;
    height: 100%;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.field-icon {
    display: grid !important;
    place-items: center;
    color: #53698c;
}

.password-eye {
    display: grid !important;
    place-items: center;
    width: 22px !important;
    height: 22px !important;
    padding: 1px !important;
    border: 0 !important;
    border-radius: 5px !important;
    color: #53698c !important;
    background: transparent !important;
    transform: none !important;
    right: 17px !important;
    bottom: 15px !important;
}

.password-eye .eye-open,
.password-eye .eye-off {
    grid-area: 1 / 1;
}

.password-eye .eye-off,
.password-eye.is-visible .eye-open {
    display: none;
}

.password-eye.is-visible .eye-off {
    display: block;
}

.login-btn {
    height: 48px !important;
    margin-top: 8px !important;
    border-radius: 13px !important;
    background: linear-gradient(135deg, var(--login-blue), var(--login-blue-dark)) !important;
    font-size: 16px !important;
    font-weight: 900 !important;
    box-shadow: 0 15px 30px rgba(8,103,255,.24) !important;
}

.login-btn:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 20px 36px rgba(8,103,255,.30) !important;
}

.login-meta {
    max-width: 280px;
    margin: 13px auto 0 !important;
    color: var(--login-muted) !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    line-height: 1.35 !important;
    text-align: center !important;
}

.reset-page {
    position: relative;
    min-height: 100vh !important;
    min-height: 100dvh !important;
    display: grid !important;
    place-items: center !important;
    padding: clamp(18px, 4vw, 42px) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    background:
        radial-gradient(circle at 50% 40%, rgba(255,255,255,.92) 0 13%, rgba(255,255,255,.50) 32%, transparent 51%),
        radial-gradient(circle at 17% 18%, rgba(8,103,255,.30), transparent 29%),
        radial-gradient(circle at 84% 78%, rgba(6,24,51,.22), transparent 33%),
        linear-gradient(135deg, #dbe8f6 0%, #f5f9fe 46%, #d4e3f4 100%) !important;
}

.reset-page::before {
    content: "";
    position: absolute;
    inset: clamp(10px, 2vw, 22px);
    border: 1px solid rgba(255,255,255,.74);
    border-radius: 28px;
    background: linear-gradient(135deg, rgba(255,255,255,.16), rgba(255,255,255,0));
    box-shadow: inset 0 0 0 1px rgba(8,103,255,.08);
    pointer-events: none;
}

.reset-page::after {
    content: "";
    position: absolute;
    right: -126px;
    top: -118px;
    width: 370px;
    height: 370px;
    border-radius: 76px;
    background:
        linear-gradient(135deg, rgba(8,103,255,.15), rgba(255,255,255,.04)),
        linear-gradient(180deg, rgba(255,255,255,.30), rgba(255,255,255,0));
    box-shadow: 0 30px 90px rgba(8,103,255,.16);
    transform: rotate(18deg);
    pointer-events: none;
}

.reset-card {
    position: relative;
    z-index: 1;
    box-sizing: border-box !important;
    width: min(430px, 100%) !important;
    padding: 24px !important;
    border: 1px solid rgba(199, 216, 237, .95) !important;
    border-radius: 18px !important;
    background: var(--login-panel) !important;
    box-shadow:
        0 24px 64px rgba(6,24,51,.16),
        0 0 0 1px rgba(255,255,255,.72) inset !important;
    backdrop-filter: blur(18px) !important;
}

.reset-card img {
    width: min(186px, 68vw) !important;
    display: block !important;
    margin: 0 auto 18px !important;
    filter: drop-shadow(0 15px 26px rgba(6,24,51,.12)) !important;
}

.admin-reauth-card {
    width: min(400px, 100%) !important;
}

.login-security-kicker {
    width: fit-content !important;
    display: block !important;
    margin: 0 auto 10px !important;
    padding: 6px 10px !important;
    border: 1px solid rgba(8,103,255,.18) !important;
    border-radius: 999px !important;
    background: rgba(8,103,255,.08) !important;
    color: #0758c7 !important;
    font-size: 11px !important;
    font-weight: 900 !important;
    letter-spacing: 0 !important;
    text-transform: uppercase !important;
}

.reset-card h1 {
    margin: 0 0 8px !important;
    color: var(--login-ink) !important;
    font-size: 24px !important;
    font-weight: 850 !important;
    line-height: 1.1 !important;
    text-align: center !important;
}

.reset-card p {
    margin: 0 0 18px !important;
    color: var(--login-muted) !important;
    line-height: 1.45 !important;
    text-align: center !important;
}

.reset-card label {
    display: grid !important;
    gap: 7px !important;
    margin-top: 12px !important;
    color: #203550 !important;
    font-size: 12px !important;
    font-weight: 900 !important;
}

.reset-card input {
    box-sizing: border-box !important;
    width: 100% !important;
    min-height: 46px !important;
    border: 1px solid var(--login-line) !important;
    border-radius: 12px !important;
    padding: 10px 12px !important;
    background: #fbfdff !important;
    color: var(--login-ink) !important;
    font-size: 16px !important;
}

.reset-card input:focus {
    border-color: var(--login-blue) !important;
    outline: none !important;
    box-shadow: 0 0 0 4px rgba(8,103,255,.12) !important;
}

.reset-actions {
    display: flex !important;
    gap: 10px !important;
    margin-top: 18px !important;
}

.reset-actions .login-btn,
.reset-actions a {
    flex: 1 1 0 !important;
    min-height: 46px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 13px !important;
    text-decoration: none !important;
    font-weight: 900 !important;
}

.reset-actions a {
    border: 1px solid var(--login-line) !important;
    background: rgba(255,255,255,.76) !important;
    color: var(--login-ink) !important;
}

.reset-alert {
    margin-bottom: 14px !important;
    padding: 10px 12px !important;
    border-radius: 12px !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1.35 !important;
}

.reset-alert.ok {
    border: 1px solid rgba(18, 135, 83, .24) !important;
    background: rgba(18, 135, 83, .08) !important;
    color: #106c49 !important;
}

.reset-alert.ko {
    border: 1px solid rgba(191, 52, 68, .24) !important;
    background: rgba(191, 52, 68, .08) !important;
    color: #97323c !important;
}

@media (max-width: 560px) {
    .login-page {
        padding: 16px !important;
    }

    .login-page::before {
        inset: 10px !important;
        border-radius: 22px !important;
    }

    .login-page::after {
        width: 245px !important;
        height: 245px !important;
        right: -132px !important;
        top: -98px !important;
    }

    .login-shell {
        width: min(352px, 100%) !important;
    }

    .af-mark {
        width: min(188px, 68vw) !important;
    }

    .login-card {
        padding: 22px 18px !important;
    }

    .field input,
    .reset-card input {
        font-size: 16px !important;
    }

    .reset-page {
        padding: 16px !important;
    }

    .reset-page::before {
        inset: 10px !important;
        border-radius: 22px !important;
    }

    .reset-page::after {
        width: 245px !important;
        height: 245px !important;
        right: -132px !important;
        top: -98px !important;
    }

    .reset-card {
        padding: 22px 18px !important;
    }

    .reset-actions {
        display: grid !important;
    }
}

@media (max-height: 620px) {
    .login-page {
        align-items: start !important;
        padding-top: 14px !important;
        padding-bottom: 14px !important;
    }

    .af-mark {
        width: min(174px, 64vw) !important;
    }

    .login-card {
        padding: 18px !important;
    }

    .login-card h2 {
        margin-bottom: 14px !important;
        font-size: 22px !important;
    }

    .reset-page {
        align-items: start !important;
        padding-top: 14px !important;
        padding-bottom: 14px !important;
        overflow-y: auto !important;
    }
}

/* Login istituzionale — legacy 2.9.36 neutralizzato (niente split navy / wash bianco) */
html {
    scroll-behavior: smooth;
}

.login-page {
    isolation: isolate !important;
    padding: 38px 24px !important;
    background: #e3eef7 !important;
}

.login-page::before,
.login-page::after {
    inset: 0 !important;
    z-index: 0 !important;
    width: auto !important;
    height: auto !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: none !important;
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    transform: none !important;
}

.soft-shape,
.dot-band {
    display: none !important;
}

.login-shell {
    z-index: 2 !important;
    width: min(440px, 100%) !important;
    gap: 15px !important;
    transform: translateY(10px) !important;
}

.login-shell::before {
    content: none !important;
    display: none !important;
}

.af-mark {
    width: min(420px, 88vw) !important;
    margin: 0 auto !important;
    filter: drop-shadow(0 10px 20px rgba(6,24,51,.10)) !important;
}

.login-card {
    position: relative !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    width: min(400px, 100%) !important;
    justify-self: center !important;
    padding: 22px 28px 21px !important;
    border-color: rgba(178, 195, 216, .98) !important;
    border-radius: 18px !important;
    background:
        linear-gradient(180deg, rgba(255,255,255,.985), rgba(252,253,255,.97)) !important;
    box-shadow:
        0 24px 42px rgba(6,24,51,.16),
        0 0 0 1px rgba(255,255,255,.88) inset !important;
    backdrop-filter: blur(22px) !important;
}

.login-card::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 0 auto !important;
    height: 6px !important;
    background: linear-gradient(90deg, #0867ff, #0057ee) !important;
}

.login-card h2 {
    margin-bottom: 5px !important;
    color: #061833 !important;
    font-size: 29px !important;
    font-weight: 900 !important;
    line-height: 1.12 !important;
}

.login-copy {
    display: block !important;
    max-width: 360px !important;
    margin: 0 auto 14px !important;
    color: #5a6f88 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.4 !important;
    text-align: center !important;
}

.field {
    margin-bottom: 12px !important;
}

.field label {
    margin-bottom: 6px !important;
    color: #111827 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
}

.field input {
    height: 49px !important;
    padding-right: 54px !important;
    padding-left: 54px !important;
    border-color: #c2ccda !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    box-shadow: 0 1px 2px rgba(6,24,51,.04) inset !important;
}

.field-icon {
    bottom: 14px !important;
    left: 18px !important;
    width: 22px !important;
    height: 22px !important;
    color: #8695ad !important;
}

.password-eye {
    right: 8px !important;
    bottom: 4px !important;
    width: 42px !important;
    height: 42px !important;
    padding: 10px !important;
    color: #8695ad !important;
}

.login-btn {
    height: 50px !important;
    margin-top: 5px !important;
    border-radius: 10px !important;
    background: linear-gradient(180deg, #0875ff, #0055ed) !important;
    font-size: 17px !important;
    font-weight: 550 !important;
    box-shadow: 0 12px 24px rgba(8,103,255,.25) !important;
}

.login-forgot {
    margin-top: 4px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
}

.login-recovery a {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    padding: 0 6px;
}

.login-security {
    display: flex;
    align-items: center;
    gap: 11px;
    margin: 15px 0 0;
    color: #079463;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    text-align: center;
}

.login-security::before,
.login-security::after {
    content: "";
    flex: 1 1 auto;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(22,116,81,.24));
}

.login-security::after {
    background: linear-gradient(90deg, rgba(22,116,81,.24), transparent);
}

.login-security svg {
    width: 24px;
    height: 24px;
    flex: 0 0 24px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.login-meta {
    max-width: none !important;
    margin-top: 11px !important;
    color: #455c78 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
}

.login-presentation {
    margin-top: 3px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
}

.login-recovery a:focus-visible,
.password-eye:focus-visible,
.login-btn:focus-visible {
    outline: 3px solid rgba(8,103,255,.24) !important;
    outline-offset: 3px !important;
}

@media (max-width: 560px) {
    .login-page {
        padding: 18px !important;
    }

    .login-shell {
        width: min(354px, 100%) !important;
        gap: 13px !important;
        transform: none !important;
    }

    .af-mark {
        width: min(300px, 80vw) !important;
    }

    .login-card {
        width: 100% !important;
        padding: 24px 20px 22px !important;
        border-radius: 18px !important;
    }

    .login-card h2 {
        font-size: 27px !important;
    }

    .login-copy {
        margin-bottom: 18px !important;
        font-size: 14px !important;
    }

    .field input,
    .login-btn {
        height: 50px !important;
    }

    .field-icon {
        bottom: 14px !important;
    }

    .password-eye {
        bottom: 4px !important;
    }

    .login-forgot,
    .login-presentation {
        font-size: 14px !important;
    }

    .login-security {
        margin-top: 18px !important;
        font-size: 13px !important;
    }

    .login-meta {
        margin-top: 13px !important;
        font-size: 13px !important;
    }
}

@media (max-height: 760px) {
    .login-page {
        align-items: start !important;
        padding-top: 14px !important;
        padding-bottom: 14px !important;
    }

    .login-shell {
        gap: 8px !important;
    }

    .af-mark {
        width: min(250px, 72vw) !important;
    }

    .login-card {
        padding-top: 20px !important;
        padding-bottom: 19px !important;
    }

    .login-copy {
        margin-bottom: 14px !important;
    }

    .field {
        margin-bottom: 11px !important;
    }

    .login-forgot {
        margin-top: 3px !important;
    }

    .login-security {
        margin-top: 13px !important;
    }

    .login-meta,
    .login-presentation {
        margin-top: 3px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    .login-card *,
    .login-card *::before,
    .login-card *::after {
        transition: none !important;
    }
}

/* Composizione compatta e autosufficiente dell'accesso. */
.login-page,
.login-page *,
.reset-page,
.reset-page * {
    box-sizing: border-box;
}

.login-page {
    padding: 24px 18px !important;
}

.login-shell {
    width: min(364px, 100%) !important;
    gap: 9px !important;
    transform: none !important;
}

.brand-core {
    width: 100%;
}

.af-mark {
    display: block;
    width: min(270px, 72vw) !important;
    height: auto;
    margin-inline: auto !important;
}

.login-card {
    width: min(344px, 100%) !important;
    padding: 18px 20px 17px !important;
    border-radius: 16px !important;
    box-shadow:
        0 18px 38px rgba(6,24,51,.14),
        0 0 0 1px rgba(255,255,255,.86) inset !important;
}

.login-card h2 {
    margin: 0 0 3px !important;
    font-size: 24px !important;
}

.login-copy {
    margin: 0 auto 11px !important;
    font-size: 12.5px !important;
    line-height: 1.35 !important;
}

.login-card .alert {
    margin-bottom: 10px !important;
    padding: 9px 11px !important;
}

.field {
    position: relative;
    margin-bottom: 9px !important;
}

.field label {
    display: block;
    margin-bottom: 5px !important;
    font-size: 12px !important;
}

.field input {
    width: 100%;
    height: 44px !important;
    padding: 0 46px !important;
    border-style: solid;
    border-width: 1px;
    outline: none;
}

.field-icon {
    position: absolute;
    left: 15px !important;
    bottom: 12px !important;
    width: 19px !important;
    height: 19px !important;
    pointer-events: none;
}

.password-eye {
    position: absolute;
    right: 5px !important;
    bottom: 1px !important;
    width: 42px !important;
    height: 42px !important;
    cursor: pointer;
}

.login-btn {
    display: inline-flex;
    width: 100%;
    height: 44px !important;
    align-items: center;
    justify-content: center;
    margin-top: 4px !important;
    border: 0;
    color: #fff;
    cursor: pointer;
}

.login-btn:disabled {
    cursor: not-allowed;
    opacity: .58;
}

.login-forgot {
    margin: 2px 0 0 !important;
    font-size: 12.5px !important;
}

.login-recovery a {
    min-height: 36px;
}

.login-security {
    gap: 8px !important;
    margin-top: 8px !important;
    font-size: 12px !important;
}

.login-security svg {
    width: 20px;
    height: 20px;
    flex-basis: 20px;
}

.login-meta {
    margin-top: 7px !important;
    font-size: 12px !important;
}

.login-presentation {
    margin-top: 1px !important;
    font-size: 12.5px !important;
}

@media (max-width: 560px) {
    .login-page {
        padding: 14px !important;
    }

    .login-shell {
        width: min(334px, 100%) !important;
        gap: 8px !important;
    }

    .af-mark {
        width: min(244px, 68vw) !important;
    }

    .login-card {
        width: 100% !important;
        padding: 17px 16px 16px !important;
    }

    .field input {
        font-size: 16px !important;
    }
}

@media (max-height: 680px) {
    .login-page {
        align-items: start !important;
        padding-block: 10px !important;
    }

    .af-mark {
        width: min(210px, 62vw) !important;
    }

    .login-card {
        padding-block: 15px !important;
    }
}

/* === extracted from index.php inline styles === */
>
        :root {
            --navy: #061833;
            --blue: #0867ff;
            --blue-soft: #eaf3ff;
            --line: #d4dfed;
            --text: #07152f;
            --muted: #40567a;
        }

        * { box-sizing: border-box; }

        html, body {
            margin: 0;
            min-height: 100%;
            font-family: "Segoe UI", Arial, sans-serif;
            -webkit-font-smoothing: antialiased;
        }

        body {
            min-height: 100vh;
            color: var(--text);
            background:
                radial-gradient(circle at 48% 28%, rgba(255,255,255,.95), transparent 34%),
                linear-gradient(135deg, #ffffff 0%, #f4f8fe 100%);
            overflow-x: hidden;
        }

        .login-page {
            position: relative;
            min-height: 100vh;
            min-height: 100dvh;
            display: grid;
            place-items: center;
            padding: 58px 6vw;
            overflow: hidden;
            background:
                linear-gradient(180deg, rgba(255,255,255,.72), rgba(245,249,255,.86)),
                radial-gradient(circle at 82% 82%, rgba(8,103,255,.08), transparent 34%);
        }

        .login-page::before {
            content: "";
            position: absolute;
            left: -245px;
            top: 92px;
            width: 520px;
            height: 740px;
            border-radius: 56px;
            background:
                linear-gradient(135deg, rgba(8,103,255,.88), rgba(8,103,255,.32) 48%, rgba(255,255,255,.08) 49%),
                linear-gradient(180deg, rgba(255,255,255,.66), rgba(255,255,255,0));
            transform: rotate(-31deg);
            box-shadow:
                0 0 0 1px rgba(8,103,255,.10) inset,
                45px 0 110px rgba(8,103,255,.16);
            opacity: .95;
        }

        .login-page::after {
            content: "";
            position: absolute;
            left: 72px;
            top: 96px;
            width: 1px;
            height: 430px;
            background: linear-gradient(180deg, transparent, rgba(8,103,255,.24), transparent);
            transform: rotate(32deg);
        }

        .soft-shape {
            position: absolute;
            left: 112px;
            bottom: -110px;
            width: 620px;
            height: 260px;
            border-radius: 42px;
            background: linear-gradient(135deg, rgba(219,231,248,.55), rgba(255,255,255,.15));
            transform: rotate(31deg);
            pointer-events: none;
        }

        .dot-band {
            position: absolute;
            left: 43%;
            bottom: 0;
            width: 86px;
            height: 330px;
            opacity: .22;
            transform: rotate(29deg);
            background-image: radial-gradient(circle, #0867ff 1.4px, transparent 1.6px);
            background-size: 11px 11px;
            pointer-events: none;
        }

        .login-shell {
            position: relative;
            z-index: 2;
            width: min(1060px, 100%);
            display: grid;
            grid-template-columns: minmax(380px, 1.08fr) minmax(330px, 380px);
            gap: clamp(44px, 8vw, 96px);
            align-items: center;
        }

        .brand-panel {
            padding-top: 8px;
        }

        .af-mark {
            display: block;
            width: 210px;
            height: auto;
            margin: 0 0 22px 66px;
            filter: drop-shadow(0 18px 18px rgba(6,24,51,.12));
        }

        .brand-title {
            margin: 0;
            color: #061833;
            font-size: clamp(56px, 6.4vw, 78px);
            line-height: .95;
            font-weight: 900;
            letter-spacing: 0;
            text-shadow: 0 8px 18px rgba(6,24,51,.10);
        }

        .brand-line {
            width: 42px;
            height: 4px;
            margin: 22px 0 16px;
            border-radius: 999px;
            background: var(--blue);
        }

        .brand-subtitle {
            width: min(380px, 100%);
            margin: 0;
            color: var(--muted);
            font-size: 18px;
            line-height: 1.45;
            font-weight: 500;
        }

        .login-card {
            width: 100%;
            max-width: 380px;
            padding: 42px 38px 40px;
            border: 1px solid var(--line);
            border-radius: 12px;
            background: rgba(255,255,255,.84);
            box-shadow: 0 26px 70px rgba(6,24,51,.10);
            backdrop-filter: blur(14px);
        }

        .login-card h2 {
            margin: 0;
            color: #07152f;
            font-size: 27px;
            line-height: 1.12;
            font-weight: 900;
            letter-spacing: 0;
        }

        .login-accent {
            width: 50px;
            height: 4px;
            margin: 14px 0 34px;
            border-radius: 999px;
            background: var(--blue);
        }

        .alert {
            padding: 12px 14px;
            border-radius: 8px;
            margin: -20px 0 20px;
            font-size: 13px;
            font-weight: 800;
        }

        .alert.error {
            background: #fdecec;
            border: 1px solid #f5b7b7;
            color: #a92626;
        }

        .alert.warning {
            background: #fff5e4;
            border: 1px solid #f3d29a;
            color: #895000;
        }

        .field {
            position: relative;
            margin-bottom: 20px;
        }

        .field label {
            display: block;
            margin-bottom: 9px;
            color: #07152f;
            font-size: 15px;
            font-weight: 650;
        }

        .field input {
            width: 100%;
            height: 52px;
            padding: 0 52px;
            border: 1px solid #ccd8e8;
            border-radius: 7px;
            background: rgba(255,255,255,.9);
            color: #07152f;
            font-size: 15px;
            outline: none;
            transition: border-color .15s ease, box-shadow .15s ease;
        }

        .field input::placeholder {
            color: #8b9ab6;
        }

        .field input:focus {
            border-color: var(--blue);
            box-shadow: 0 0 0 4px rgba(8,103,255,.10);
        }

        .field-icon {
            position: absolute;
            left: 20px;
            bottom: 16px;
            width: 20px;
            height: 20px;
            pointer-events: none;
        }

        .field-icon.user::before {
            content: "";
            position: absolute;
            left: 6px;
            top: 1px;
            width: 8px;
            height: 8px;
            border: 2px solid #53698c;
            border-radius: 50%;
        }

        .field-icon.user::after {
            content: "";
            position: absolute;
            left: 2px;
            bottom: 0;
            width: 16px;
            height: 10px;
            border: 2px solid #53698c;
            border-bottom: 0;
            border-radius: 10px 10px 0 0;
        }

        .field-icon.lock::before {
            content: "";
            position: absolute;
            left: 4px;
            bottom: 0;
            width: 14px;
            height: 12px;
            border: 2px solid #53698c;
            border-radius: 3px;
        }

        .field-icon.lock::after {
            content: "";
            position: absolute;
            left: 7px;
            top: 0;
            width: 8px;
            height: 10px;
            border: 2px solid #53698c;
            border-bottom: 0;
            border-radius: 8px 8px 0 0;
        }

        .password-eye {
            position: absolute;
            right: 18px;
            bottom: 17px;
            width: 22px;
            height: 14px;
            padding: 0;
            border: 2px solid #53698c;
            border-radius: 50%;
            background: transparent;
            transform: rotate(-8deg);
            cursor: pointer;
        }

        .password-eye::after {
            content: "";
            position: absolute;
            left: 6px;
            top: 3px;
            width: 5px;
            height: 5px;
            border-radius: 50%;
            background: #53698c;
        }

        .password-eye.is-visible::before {
            content: "";
            position: absolute;
            left: -3px;
            top: 5px;
            width: 28px;
            height: 2px;
            background: #53698c;
            transform: rotate(28deg);
            border-radius: 999px;
        }

        .login-options {
            display: none;
        }

        .login-btn {
            width: 100%;
            height: 56px;
            margin-top: 10px;
            border: 0;
            border-radius: 7px;
            background: linear-gradient(135deg, #0867ff, #0057ee);
            color: #fff;
            font-size: 18px;
            font-weight: 800;
            cursor: pointer;
            box-shadow: 0 14px 28px rgba(8,103,255,.22);
            transition: transform .15s ease, box-shadow .15s ease;
        }

        .login-btn:hover {
            transform: translateY(-1px);
            box-shadow: 0 18px 34px rgba(8,103,255,.28);
        }

        .login-btn:disabled {
            opacity: .55;
            cursor: not-allowed;
            transform: none;
        }

        @media (max-width: 980px) {
            .login-page {
                padding: 34px 22px;
                align-items: start;
            }

            .login-shell {
                grid-template-columns: 1fr;
                gap: 36px;
            }

            .brand-panel {
                text-align: center;
                padding-top: 0;
            }

            .af-mark {
                margin: 0 auto 18px;
                width: 170px;
            }

            .brand-line {
                margin-left: auto;
                margin-right: auto;
            }

            .brand-subtitle {
                margin-left: auto;
                margin-right: auto;
            }

            .login-card {
                max-width: 390px;
                margin: 0 auto;
            }
        }

        @media (max-width: 760px) {
            .login-page {
                min-height: 100svh;
                padding: 24px 18px;
            }

            .login-page::after {
                display: none;
            }

            .login-shell {
                gap: 22px;
                align-content: start;
            }

            .af-mark {
                width: 122px;
                margin-bottom: 12px;
            }

            .brand-title {
                font-size: 46px;
            }

            .brand-line {
                margin: 14px auto 10px;
            }

            .brand-subtitle {
                max-width: 330px;
                font-size: 15px;
            }

            .login-card {
                max-width: 360px;
                padding: 26px 20px;
            }

            .login-card h2 {
                font-size: 24px;
            }

            .login-accent {
                margin-bottom: 24px;
            }

            .field {
                margin-bottom: 16px;
            }
        }

        @media (max-width: 560px) {
            .login-page {
                padding: 20px 14px;
            }

            .login-page::before {
                left: -350px;
                opacity: .55;
            }

            .soft-shape,
            .dot-band {
                display: none;
            }

            .brand-title {
                font-size: 40px;
            }

            .brand-subtitle {
                font-size: 14px;
            }

            .login-card {
                width: min(100%, 340px);
                padding: 24px 18px;
            }

            .login-card h2 {
                font-size: 22px;
            }

            .field input {
                height: 48px;
                padding-left: 46px;
                padding-right: 44px;
            }

            .login-btn {
                height: 50px;
                font-size: 16px;
            }
        }

        @media (max-width: 380px) {
            .brand-panel {
                transform: scale(.94);
                transform-origin: top center;
            }

            .login-card {
                padding: 22px 16px;
            }

            .field label {
                font-size: 14px;
            }
        }

        /* Login professionale 2026 */
        body {
            background: #f3f7fc;
        }

        .login-page {
            place-items: center;
            padding: 42px clamp(20px, 5vw, 70px);
            background:
                linear-gradient(135deg, rgba(255,255,255,.96), rgba(239,246,255,.92)),
                radial-gradient(circle at 16% 16%, rgba(8,103,255,.10), transparent 28%),
                radial-gradient(circle at 88% 84%, rgba(6,24,51,.08), transparent 30%);
        }

        .login-page::before,
        .login-page::after,
        .soft-shape,
        .dot-band {
            display: none;
        }

        .login-shell {
            width: min(980px, 100%);
            grid-template-columns: minmax(320px, 1fr) minmax(340px, 410px);
            gap: clamp(34px, 6vw, 76px);
            padding: clamp(22px, 4vw, 42px);
            border: 1px solid rgba(189, 204, 224, .72);
            border-radius: 26px;
            background: rgba(255,255,255,.72);
            box-shadow: 0 28px 80px rgba(6, 24, 51, .11);
            backdrop-filter: blur(18px);
        }

        .brand-panel {
            padding: 0;
        }

        .af-mark {
            width: 116px;
            margin: 0 0 22px;
            filter: drop-shadow(0 16px 24px rgba(6,24,51,.13));
        }

        .brand-title {
            max-width: 420px;
            font-size: clamp(44px, 5vw, 64px);
            line-height: 1;
            letter-spacing: 0;
        }

        .brand-line {
            width: 54px;
            height: 5px;
            margin: 20px 0 18px;
        }

        .brand-subtitle {
            max-width: 420px;
            color: #41577a;
            font-size: 17px;
            line-height: 1.55;
        }

        .brand-trust {
            display: grid;
            gap: 10px;
            max-width: 430px;
            margin-top: 30px;
        }

        .brand-trust span {
            display: inline-flex;
            align-items: center;
            gap: 10px;
            color: #304766;
            font-size: 14px;
            font-weight: 800;
        }

        .brand-trust span::before {
            content: "";
            width: 9px;
            height: 9px;
            border-radius: 50%;
            background: #0867ff;
            box-shadow: 0 0 0 5px rgba(8,103,255,.10);
        }

        .login-card {
            max-width: 410px;
            padding: 34px;
            border-color: rgba(191, 206, 226, .95);
            border-radius: 20px;
            background: rgba(255,255,255,.96);
            box-shadow: 0 18px 54px rgba(6,24,51,.13);
        }

        .login-kicker {
            display: inline-flex;
            align-items: center;
            min-height: 28px;
            border: 1px solid #d7e5f7;
            border-radius: 999px;
            padding: 4px 11px;
            background: #f5f9ff;
            color: #0e55bf;
            font-size: 12px;
            font-weight: 900;
            text-transform: uppercase;
        }

        .login-card h2 {
            margin-top: 18px;
            font-size: 30px;
        }

        .login-copy {
            margin: 10px 0 24px;
            color: #5c708d;
            font-size: 14px;
            line-height: 1.45;
            font-weight: 650;
        }

        .login-accent {
            display: none;
        }

        .field label {
            color: #1b2b44;
            font-size: 14px;
            font-weight: 800;
        }

        .field input {
            height: 50px;
            border-radius: 12px;
            background: #fbfdff;
        }

        .login-btn {
            height: 52px;
            border-radius: 13px;
            background: linear-gradient(135deg, #0b6bff, #064dc4);
        }

        .login-meta {
            margin-top: 18px;
            color: #75869c;
            font-size: 12px;
            line-height: 1.4;
            text-align: center;
        }

        @media (max-width: 980px) {
            .login-shell {
                grid-template-columns: 1fr;
                padding: 28px;
            }

            .brand-panel,
            .brand-subtitle {
                text-align: center;
            }

            .af-mark,
            .brand-line {
                margin-left: auto;
                margin-right: auto;
            }

            .brand-trust {
                margin-left: auto;
                margin-right: auto;
                text-align: left;
            }
        }

        @media (max-width: 560px) {
            .login-page {
                padding: 16px;
            }

            .login-shell {
                gap: 20px;
                padding: 18px;
                border-radius: 20px;
            }

            .login-card {
                width: 100%;
                max-width: none;
                padding: 24px 18px;
                border-radius: 18px;
            }

            .brand-title {
                font-size: 38px;
            }

            .brand-trust {
                display: none;
            }
        }

        /* AppForze Login Experience 1.8.4 */
        :root {
            --af-ink: #061833;
            --af-ink-2: #102b4f;
            --af-blue: #0867ff;
            --af-blue-2: #0b4fc5;
            --af-sky: #eaf4ff;
            --af-panel: rgba(255,255,255,.86);
            --af-line: #d7e4f2;
            --af-muted: #60728a;
            --af-danger: #b42334;
            --af-warning: #8a5200;
        }

        html,
        body {
            min-height: 100%;
        }

        body {
            background: #f4f8fd;
        }

        .login-page {
            isolation: isolate;
            min-height: 100vh;
            min-height: 100dvh;
            display: grid;
            place-items: center;
            padding: clamp(18px, 4vw, 46px);
            background:
                linear-gradient(135deg, rgba(255,255,255,.94), rgba(237,246,255,.94)),
                repeating-linear-gradient(90deg, rgba(8,103,255,.045) 0 1px, transparent 1px 74px),
                repeating-linear-gradient(0deg, rgba(6,24,51,.035) 0 1px, transparent 1px 74px);
            overflow: hidden;
        }

        .login-page::before,
        .login-page::after {
            display: block;
            content: "";
            position: absolute;
            z-index: -1;
            pointer-events: none;
        }

        .login-page::before {
            right: -18vw;
            top: -18vh;
            width: 58vw;
            height: 118vh;
            border-left: 1px solid rgba(8,103,255,.12);
            background:
                linear-gradient(135deg, rgba(8,103,255,.09), rgba(255,255,255,0) 58%),
                linear-gradient(180deg, rgba(255,255,255,.32), rgba(8,103,255,.07));
            transform: skewX(-18deg);
        }

        .login-page::after {
            left: -16vw;
            bottom: -34vh;
            width: 60vw;
            height: 72vh;
            border-top: 1px solid rgba(8,103,255,.12);
            background: linear-gradient(135deg, rgba(6,24,51,.08), rgba(8,103,255,.07), rgba(255,255,255,0));
            transform: skewX(-18deg);
        }

        .soft-shape,
        .dot-band {
            display: none;
        }

        .login-shell {
            position: relative;
            z-index: 2;
            width: min(1080px, 100%);
            min-height: min(640px, calc(100vh - 52px));
            display: grid;
            grid-template-columns: minmax(0, 1.04fr) minmax(350px, 420px);
            gap: 0;
            align-items: stretch;
            overflow: hidden;
            border: 1px solid rgba(190, 205, 224, .84);
            border-radius: 30px;
            background: rgba(255,255,255,.74);
            box-shadow: 0 34px 92px rgba(6,24,51,.14);
            backdrop-filter: blur(18px);
        }

        .brand-panel {
            position: relative;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            min-height: 100%;
            padding: clamp(30px, 5vw, 58px);
            background:
                linear-gradient(135deg, rgba(255,255,255,.76), rgba(238,247,255,.84)),
                linear-gradient(90deg, rgba(8,103,255,.08), rgba(255,255,255,0));
        }

        .brand-panel::before {
            content: "";
            position: absolute;
            right: -80px;
            top: 80px;
            width: 230px;
            height: 230px;
            border: 1px solid rgba(8,103,255,.16);
            border-radius: 34px;
            transform: rotate(16deg);
            background: linear-gradient(135deg, rgba(8,103,255,.05), rgba(255,255,255,.24));
        }

        .brand-panel::after {
            content: "";
            position: absolute;
            right: 32px;
            bottom: 34px;
            width: 152px;
            height: 152px;
            border-radius: 26px;
            opacity: .18;
            background: url("../logo-appforze-mark.svg") center / contain no-repeat;
        }

        .brand-core {
            position: relative;
            z-index: 1;
        }

        .af-mark {
            width: min(330px, 72%);
            max-width: 330px;
            height: auto;
            margin: 0 0 28px;
            filter: drop-shadow(0 22px 34px rgba(6,24,51,.15));
        }

        .brand-title {
            margin: 0;
            max-width: 520px;
            color: var(--af-ink);
            font-size: clamp(46px, 6vw, 76px);
            line-height: .96;
            font-weight: 950;
            letter-spacing: 0;
            text-shadow: none;
        }

        .brand-line {
            width: 62px;
            height: 5px;
            margin: 24px 0 20px;
            border-radius: 999px;
            background: linear-gradient(90deg, var(--af-blue), #35a0ff);
        }

        .brand-subtitle {
            width: min(470px, 100%);
            margin: 0;
            color: #405574;
            font-size: 18px;
            line-height: 1.52;
            font-weight: 650;
        }

        .brand-trust {
            position: relative;
            z-index: 1;
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 12px;
            max-width: 600px;
            margin-top: 42px;
        }

        .brand-trust span {
            min-height: 92px;
            display: flex;
            flex-direction: column;
            justify-content: flex-end;
            gap: 12px;
            border: 1px solid rgba(201,216,233,.9);
            border-radius: 18px;
            padding: 14px;
            background: rgba(255,255,255,.68);
            color: #314866;
            font-size: 13px;
            line-height: 1.25;
            font-weight: 850;
            box-shadow: 0 10px 26px rgba(6,24,51,.06);
        }

        .brand-trust span::before {
            content: "";
            width: 26px;
            height: 26px;
            border-radius: 9px;
            background:
                linear-gradient(135deg, rgba(8,103,255,.18), rgba(8,103,255,.05)),
                linear-gradient(135deg, var(--af-blue), #35a0ff);
            box-shadow: 0 10px 18px rgba(8,103,255,.18);
        }

        .brand-version {
            position: relative;
            z-index: 1;
            width: fit-content;
            margin-top: 28px;
            border: 1px solid rgba(201,216,233,.9);
            border-radius: 999px;
            padding: 8px 12px;
            background: rgba(255,255,255,.74);
            color: #61748c;
            font-size: 12px;
            font-weight: 850;
        }

        .login-card {
            width: 100%;
            max-width: none;
            align-self: stretch;
            display: flex;
            flex-direction: column;
            justify-content: center;
            border: 0;
            border-left: 1px solid rgba(201,216,233,.9);
            border-radius: 0;
            padding: clamp(30px, 4vw, 48px);
            background: rgba(255,255,255,.96);
            box-shadow: none;
            backdrop-filter: none;
        }

        .login-kicker {
            width: fit-content;
            min-height: 30px;
            display: inline-flex;
            align-items: center;
            gap: 8px;
            border: 1px solid #d7e6f8;
            border-radius: 999px;
            padding: 5px 12px;
            background: #f6faff;
            color: #0e55bf;
            font-size: 12px;
            font-weight: 950;
            text-transform: uppercase;
        }

        .login-kicker::before {
            content: "";
            width: 8px;
            height: 8px;
            border-radius: 50%;
            background: #15c76f;
            box-shadow: 0 0 0 4px rgba(21,199,111,.12);
        }

        .login-card h2 {
            margin: 20px 0 0;
            color: var(--af-ink);
            font-size: clamp(28px, 3vw, 36px);
            line-height: 1.2;
            font-weight: 950;
            letter-spacing: 0;
        }

        .login-copy {
            margin: 12px 0 28px;
            color: var(--af-muted);
            font-size: 14px;
            line-height: 1.48;
            font-weight: 700;
        }

        .login-accent {
            display: none;
        }

        .alert {
            margin: 0 0 18px;
            border-radius: 14px;
            padding: 13px 14px;
            font-size: 13px;
            line-height: 1.35;
        }

        .alert.error {
            border-color: #f2c1c7;
            background: #fff2f4;
            color: var(--af-danger);
        }

        .alert.warning {
            border-color: #efd2a0;
            background: #fff8eb;
            color: var(--af-warning);
        }

        .field {
            margin-bottom: 16px;
        }

        .field label {
            margin-bottom: 8px;
            color: #1f314d;
            font-size: 13px;
            font-weight: 900;
        }

        .field input {
            height: 54px;
            border: 1px solid #cbd9ea;
            border-radius: 16px;
            padding: 0 52px;
            background: #fbfdff;
            color: var(--af-ink);
            font-size: 15px;
            font-weight: 700;
        }

        .field input:focus {
            border-color: var(--af-blue);
            box-shadow: 0 0 0 5px rgba(8,103,255,.11);
        }

        .field-icon {
            left: 18px;
            bottom: 17px;
        }

        .password-eye {
            right: 18px;
            bottom: 19px;
        }

        .login-btn {
            height: 56px;
            margin-top: 12px;
            border-radius: 16px;
            background: linear-gradient(135deg, var(--af-blue), var(--af-blue-2));
            font-size: 17px;
            font-weight: 950;
            box-shadow: 0 18px 34px rgba(8,103,255,.24);
        }

        .login-btn:hover {
            transform: translateY(-1px);
            box-shadow: 0 22px 40px rgba(8,103,255,.30);
        }

        .login-meta {
            margin: 18px 0 0;
            color: #75869c;
            font-size: 12px;
            line-height: 1.45;
            text-align: center;
            font-weight: 750;
        }

        @media (max-width: 980px) {
            .login-shell {
                min-height: auto;
                grid-template-columns: 1fr;
                border-radius: 24px;
            }

            .brand-panel {
                min-height: auto;
                padding: 30px 26px 24px;
                text-align: center;
            }

            .brand-panel::before,
            .brand-panel::after {
                display: none;
            }

            .af-mark,
            .brand-line,
            .brand-version {
                margin-left: auto;
                margin-right: auto;
            }

            .brand-subtitle {
                margin-left: auto;
                margin-right: auto;
            }

            .brand-trust {
                max-width: 680px;
                margin: 28px auto 0;
            }

            .login-card {
                border-left: 0;
                border-top: 1px solid rgba(201,216,233,.9);
                padding: 30px 26px;
            }
        }

        @media (max-width: 680px) {
            .login-page {
                padding: 14px;
            }

            .login-shell {
                border-radius: 20px;
            }

            .brand-panel {
                padding: 22px 18px 18px;
            }

            .af-mark {
                width: min(220px, 76%);
                margin-bottom: 16px;
            }

            .brand-title {
                font-size: 40px;
            }

            .brand-subtitle {
                font-size: 14px;
                line-height: 1.45;
            }

            .brand-trust,
            .brand-version {
                display: none;
            }

            .login-card {
                padding: 24px 18px;
            }

            .login-card h2 {
                font-size: 28px;
            }

            .field input {
                height: 52px;
            }
        }

        /* Proporzioni compatte coerenti con il sito */
        .login-page {
            padding: clamp(14px, 3vw, 34px);
        }

        .login-shell {
            width: min(940px, 100%);
            min-height: min(545px, calc(100vh - 36px));
            grid-template-columns: minmax(0, .98fr) minmax(330px, 372px);
            border-radius: 24px;
        }

        .brand-panel {
            padding: clamp(26px, 4vw, 44px);
        }

        .af-mark {
            width: min(245px, 64%);
            margin-bottom: 22px;
        }

        .brand-title {
            max-width: 430px;
            font-size: clamp(34px, 4.2vw, 52px);
            line-height: 1.18;
        }

        .brand-line {
            width: 50px;
            height: 4px;
            margin: 18px 0 15px;
        }

        .brand-subtitle {
            max-width: 390px;
            font-size: 15px;
            line-height: 1.45;
        }

        .brand-trust {
            grid-template-columns: 1fr;
            max-width: 390px;
            gap: 8px;
            margin-top: 26px;
        }

        .brand-trust span {
            min-height: auto;
            flex-direction: row;
            justify-content: flex-start;
            align-items: center;
            padding: 10px 12px;
            border-radius: 14px;
            font-size: 12px;
        }

        .brand-trust span::before {
            flex: 0 0 auto;
            width: 18px;
            height: 18px;
            border-radius: 7px;
        }

        .brand-version {
            margin-top: 20px;
            padding: 7px 10px;
            font-size: 11px;
        }

        .login-card {
            padding: clamp(26px, 3.4vw, 38px);
        }

        .login-kicker {
            min-height: 26px;
            padding: 4px 10px;
            font-size: 11px;
        }

        .login-card h2 {
            margin-top: 16px;
            font-size: clamp(24px, 2.5vw, 30px);
        }

        .login-copy {
            margin: 9px 0 22px;
            font-size: 13px;
        }

        .field {
            margin-bottom: 14px;
        }

        .field label {
            font-size: 12.5px;
        }

        .field input {
            height: 48px;
            border-radius: 13px;
            font-size: 14px;
        }

        .field-icon {
            bottom: 14px;
        }

        .password-eye {
            bottom: 16px;
        }

        .login-btn {
            height: 50px;
            border-radius: 14px;
            font-size: 16px;
        }

        .login-meta {
            margin-top: 14px;
            font-size: 11px;
        }

        @media (max-width: 980px) {
            .login-shell {
                width: min(620px, 100%);
                grid-template-columns: 1fr;
                min-height: auto;
            }

            .brand-panel {
                padding: 24px 22px 20px;
            }

            .af-mark {
                width: min(220px, 58%);
            }

            .brand-title {
                font-size: clamp(30px, 7vw, 42px);
            }

            .brand-trust {
                display: none;
            }
        }

        @media (max-width: 560px) {
            .login-shell {
                width: 100%;
                border-radius: 18px;
            }

            .brand-panel {
                padding: 20px 16px 16px;
            }

            .af-mark {
                width: min(190px, 70%);
            }

            .brand-title {
                font-size: 30px;
            }

            .brand-subtitle {
                font-size: 13px;
            }

            .login-card {
                padding: 22px 16px;
            }
        }

        /* Mockup 3 applicato: accesso semplice e centrale */
        .login-page {
            padding: clamp(16px, 4vw, 40px);
            background:
                radial-gradient(circle at 28% 24%, rgba(8,103,255,.10), transparent 25%),
                radial-gradient(circle at 82% 80%, rgba(6,24,51,.07), transparent 27%),
                linear-gradient(135deg, #ffffff, #eef5fc);
        }

        .login-page::before,
        .login-page::after {
            display: none;
        }

        .login-shell {
            width: min(460px, 100%);
            min-height: auto;
            display: grid;
            grid-template-columns: 1fr;
            gap: 22px;
            overflow: visible;
            border: 0;
            border-radius: 0;
            background: transparent;
            box-shadow: none;
            backdrop-filter: none;
        }

        .brand-panel {
            min-height: auto;
            display: block;
            padding: 0;
            background: transparent;
            text-align: center;
        }

        .brand-panel::before,
        .brand-panel::after {
            display: none;
        }

        .brand-core {
            display: grid;
            justify-items: center;
        }

        .af-mark {
            width: min(230px, 72%);
            margin: 0 auto 20px;
        }

        .brand-title {
            max-width: 410px;
            margin: 0;
            font-size: clamp(28px, 6vw, 36px);
            line-height: 1.18;
            text-align: center;
        }

        .brand-line {
            width: 46px;
            height: 4px;
            margin: 15px auto 12px;
        }

        .brand-subtitle {
            max-width: 390px;
            margin: 0 auto;
            font-size: 14px;
            line-height: 1.45;
            text-align: center;
        }

        .brand-trust,
        .brand-version {
            display: none;
        }

        .login-card {
            width: 100%;
            max-width: none;
            display: block;
            align-self: auto;
            border: 1px solid rgba(198, 214, 232, .95);
            border-radius: 20px;
            padding: clamp(24px, 5vw, 32px);
            background: rgba(255,255,255,.96);
            box-shadow: 0 24px 62px rgba(6,24,51,.12);
            backdrop-filter: blur(16px);
        }

        .login-card h2 {
            font-size: clamp(24px, 5vw, 30px);
        }

        @media (max-width: 560px) {
            .login-shell {
                gap: 18px;
            }

            .af-mark {
                width: min(205px, 76%);
            }

            .brand-title {
                font-size: 28px;
            }
        }

        /* Login essenziale finale */
        .login-page {
            padding: 18px;
        }

        .login-shell {
            width: min(380px, 100%);
            gap: 14px;
        }

        .brand-panel {
            padding: 0;
        }

        .af-mark {
            width: min(210px, 70%);
            margin: 0 auto 4px;
        }

        .brand-title,
        .brand-line,
        .brand-subtitle,
        .brand-trust,
        .brand-version,
        .login-kicker,
        .login-copy,
        .login-accent {
            display: none !important;
        }

        .login-card {
            padding: 22px;
            border-radius: 18px;
            box-shadow: 0 18px 46px rgba(6,24,51,.11);
        }

        .login-card h2 {
            margin: 0 0 18px;
            font-size: 24px;
            text-align: center;
        }

        .field {
            margin-bottom: 13px;
        }

        .field label {
            margin-bottom: 7px;
            font-size: 12px;
        }

        .field input {
            height: 46px;
            border-radius: 12px;
            font-size: 14px;
        }

        .field-icon {
            bottom: 13px;
        }

        .password-eye {
            bottom: 15px;
        }

        .login-btn {
            height: 48px;
            margin-top: 8px;
            border-radius: 13px;
        }

        .login-meta {
            margin-top: 12px;
        }

        @media (max-height: 620px) {
            .login-page {
                align-items: start;
                padding-top: 14px;
                padding-bottom: 14px;
            }

            .af-mark {
                width: min(175px, 64%);
            }

            .login-card {
                padding: 18px;
            }

            .login-card h2 {
                margin-bottom: 14px;
                font-size: 22px;
            }
        }

        /* Sfondo login piu profondo */
        .login-page {
            background:
                radial-gradient(circle at 50% 42%, rgba(255,255,255,.88) 0 12%, rgba(255,255,255,.50) 31%, transparent 48%),
                radial-gradient(circle at 24% 18%, rgba(8,103,255,.30), transparent 28%),
                radial-gradient(circle at 78% 78%, rgba(6,24,51,.28), transparent 34%),
                linear-gradient(135deg, #dfeaf7 0%, #f5f9fe 44%, #d9e6f5 100%);
        }

        .login-page::before,
        .login-page::after {
            display: block;
            content: "";
            position: absolute;
            pointer-events: none;
        }

        .login-page::before {
            inset: 18px;
            border: 1px solid rgba(255,255,255,.72);
            border-radius: 28px;
            box-shadow: inset 0 0 0 1px rgba(8,103,255,.08);
        }

        .login-page::after {
            right: -120px;
            top: -110px;
            width: 360px;
            height: 360px;
            border-radius: 72px;
            background:
                linear-gradient(135deg, rgba(8,103,255,.16), rgba(255,255,255,.04)),
                linear-gradient(180deg, rgba(255,255,255,.28), rgba(255,255,255,0));
            transform: rotate(18deg);
            box-shadow: 0 30px 90px rgba(8,103,255,.16);
        }

        .login-shell {
            position: relative;
        }

        .login-shell::before {
            content: "";
            position: absolute;
            left: 50%;
            top: 50%;
            z-index: -1;
            width: min(520px, 92vw);
            height: min(520px, 92vw);
            border-radius: 42px;
            background:
                linear-gradient(135deg, rgba(8,103,255,.11), rgba(255,255,255,.18)),
                linear-gradient(180deg, rgba(255,255,255,.46), rgba(255,255,255,0));
            transform: translate(-50%, -50%) rotate(-8deg);
            box-shadow: 0 34px 90px rgba(6,24,51,.10);
        }

        .login-card {
            box-shadow:
                0 24px 64px rgba(6,24,51,.16),
                0 0 0 1px rgba(255,255,255,.72) inset;
        }

        @media (max-width: 560px) {
            .login-page::before {
                inset: 10px;
                border-radius: 22px;
            }

            .login-page::after {
                width: 240px;
                height: 240px;
                right: -130px;
                top: -95px;
            }
        }

        /* Font moderno solo login */
        body,
        .login-page,
        .login-card,
        .login-card input,
        .login-card button {
            font-family: "Segoe UI", Arial, sans-serif;
        }

        .login-card h2 {
            font-weight: 700;
            letter-spacing: 0;
        }

        .field label,
        .field input,
        .login-btn,
        .login-meta {
            font-weight: 900;
        }
        .login-recovery {
            margin: 12px 0 0;
            text-align: center;
            font-size: 13px;
            font-weight: 800;
        }

        .login-recovery a {
            color: #0867ff;
            text-decoration: none;
        }

        .login-recovery a:hover {
            text-decoration: underline;
        }

/* === 2.16.62 — neutralizza legacy che lotta con public-surfaces ===
 * Sfondo soft istituzionale (no bande navy / glass / wash bianco).
 * public-surfaces.css resta la fonte definitiva (caricata dopo).
 */
.login-page {
    background-color: #e3eef7 !important;
    background-image:
        radial-gradient(980px 440px at 88% -6%, rgba(48, 163, 216, .16), transparent 58%),
        radial-gradient(860px 400px at 6% 0%, rgba(7, 95, 174, .15), transparent 56%),
        radial-gradient(720px 520px at 50% 110%, rgba(9, 104, 216, .10), transparent 62%),
        linear-gradient(180deg, #d7e6f3 0%, #e3eef7 28%, #ebf3f9 62%, #f0f6fb 100%) !important;
}

.login-page::before,
.login-page::after {
    inset: 0 !important;
    width: auto !important;
    height: auto !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    transform: none !important;
    opacity: 1 !important;
    background: none !important;
    background-color: transparent !important;
    background-image: none !important;
}

.login-card {
    border-radius: 18px !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

.login-card :is(input, .login-btn) {
    border-radius: 10px !important;
}

.login-security {
    border-radius: 12px !important;
}

.soft-shape,
.dot-band {
    display: none !important;
}
