/* Full alto */
.login-root {
    min-height: 100vh;
}

/* Elimina espacios de MudGrid */
.no-gutters {
    margin: 0;
}

    .no-gutters > .mud-grid-item {
        padding: 0;
    }

/* Panel izquierdo */
.left-pane {
    background: #fff;
}

.left-card {
    min-height: 100vh;
    padding: 32px 28px;
    display: flex;
    align-items: center; /* centra verticalmente el contenido */
}

.brand {
    margin-bottom: 12px;
}

.muted {
    color: rgba(0,0,0,.54);
}

.center {
    text-align: center;
}

/* Panel derecho (hero) */
.right-pane {
    position: relative;
}

.hero {
    min-height: 40vh; /* para móvil */
    height: 100%;
    background-image: url('/img/bg.png');
    background-size: contain; /* 👉 asegura que la imagen se vea completa */
    background-repeat: no-repeat;
    background-position: center;
    background-color: #000; /* o el color corporativo */
}

.hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(0,0,0,.35), rgba(0,0,0,.2));
}

/* En pantallas medianas+ la altura ocupa todo */
@media (min-width: 960px) {
    .hero {
        min-height: 100vh;
    }
}