@media (max-width: 1120px) {
    .page-shell { padding: 0 18px; }
    .login-layout { grid-template-columns: minmax(0, .95fr) minmax(400px, 1.05fr); }
    .login-hero { padding: 54px; }
    .feature-list { grid-template-columns: 1fr; }
    .feature-item { display: flex; align-items: center; gap: 14px; }
    .feature-item__icon { margin-bottom: 0; flex: 0 0 auto; }
}

@media (max-width: 860px) {
    :root { --header-height: 72px; --footer-height: auto; }
    .page-shell { min-height: 100svh; grid-template-rows: var(--header-height) auto auto; }
    .login-layout { grid-template-columns: 1fr; }
    .login-panel { order: -1; padding: 52px 32px; }
    .login-hero { min-height: auto; padding: 44px; }
    .login-hero h1 { font-size: clamp(36px, 8vw, 54px); }
    .feature-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .feature-item { display: block; }
    .feature-item__icon { margin-bottom: 16px; }
    .site-footer { padding: 22px 0; }
}

/* No celular o login ocupa a tela e vira o foco absoluto. */
@media (max-width: 620px) {
    .login-page {
        background: var(--color-surface);
    }

    .login-page .page-shell {
        width: 100%;
        min-height: 100svh;
        padding: 0;
        grid-template-rows: 64px 1fr auto;
    }

    .login-page .site-header {
        padding: 0 18px;
        border-bottom: 1px solid var(--color-border);
    }

    .environment-badge,
    .login-hero {
        display: none;
    }

    .login-layout {
        min-height: 0;
        display: block;
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .login-panel {
        min-height: calc(100svh - 64px);
        padding: 30px 20px 34px;
        display: flex;
        align-items: flex-start;
        background:
            radial-gradient(circle at 100% 0%, var(--color-primary-soft), transparent 36%),
            var(--color-surface);
    }

    .login-card {
        width: 100%;
        max-width: none;
    }

    .login-card__header {
        margin-bottom: 26px;
    }

    .login-card__badge {
        margin-bottom: 12px;
    }

    .login-card__header h2 {
        font-size: clamp(34px, 10vw, 44px);
    }

    .login-card__header p {
        max-width: 420px;
        font-size: 14px;
    }

    .login-form {
        gap: 22px;
    }

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

    .input-shell input {
        height: 58px;
        font-size: 16px;
        border-radius: 14px;
    }

    .submit-button {
        min-height: 58px;
        font-size: 15px;
        border-radius: 14px;
    }

    .login-card__security {
        margin-top: 24px;
    }

    .site-footer {
        padding: 16px 20px 22px;
        flex-direction: column;
        justify-content: center;
        gap: 8px;
        text-align: center;
        background: var(--color-surface);
    }

    .site-footer nav {
        gap: 14px;
    }
}

@media (max-width: 390px) {
    .brand__name { font-size: 17px; }
    .form-field__label-row { align-items: flex-start; flex-direction: column; gap: 6px; }
    .login-panel { padding-inline: 16px; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}