/* Login de L&H AM Control · blanco, azul y diseño SaaS. */
:root {
    --login-ink:#101b35;
    --login-blue:#1468e8;
    --login-muted:#7385a2;
    --login-line:#e2eaf4;
}
html, body { min-height:100%; }
body {
    background:#f3f7fc !important;
    color:var(--login-ink) !important;
    font-family:Inter,"Segoe UI",Arial,sans-serif !important;
}
.panel-left {
    flex:0 0 42% !important;
    padding:48px 54px !important;
    background:linear-gradient(145deg,#0f55c9 0%,#2278f1 57%,#4c97fb 100%) !important;
}
.panel-left::before {
    background-image:linear-gradient(rgba(255,255,255,.075) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.075) 1px,transparent 1px) !important;
    background-size:48px 48px !important;
}
.glow-top { background:radial-gradient(circle,rgba(255,255,255,.18) 0%,transparent 68%) !important; }
.glow-bottom { background:radial-gradient(circle,rgba(9,52,137,.26) 0%,transparent 68%) !important; }
.brand-name,.hero-title { color:#fff !important; }
.brand-name { font-family:Inter,"Segoe UI",Arial,sans-serif !important; font-weight:700 !important; letter-spacing:-.02em !important; }
.hero-eyebrow,.hero-title em,.form-eyebrow { color:#d8eaff !important; }
.hero-title { font-family:Inter,"Segoe UI",Arial,sans-serif !important; font-size:clamp(32px,3.2vw,46px) !important; font-weight:700 !important; letter-spacing:-.045em !important; }
.hero-title em { background:none !important; -webkit-text-fill-color:#cfe3ff !important; }
.hero-desc { color:rgba(255,255,255,.78) !important; }
.hero-eyebrow::before { background:#d8eaff !important; }
.feature-item { background:rgba(255,255,255,.12) !important; border-color:rgba(255,255,255,.22) !important; border-radius:13px !important; }
.feature-item:hover { background:rgba(255,255,255,.18) !important; border-color:rgba(255,255,255,.34) !important; }
.feature-icon { background:rgba(255,255,255,.16) !important; }
.feature-icon svg { color:#fff !important; }
.feature-text { color:#fff !important; }
.panel-right { background:#f3f7fc !important; padding:42px 44px !important; }
.panel-right::before { background:radial-gradient(circle,rgba(20,104,232,.09) 0%,transparent 70%) !important; }
.panel-right::after { background:radial-gradient(circle,rgba(20,104,232,.05) 0%,transparent 70%) !important; }
.form-wrapper {
    max-width:440px !important;
    padding:40px 42px !important;
    border:1px solid #e4ebf4;
    border-radius:20px;
    background:#fff;
    box-shadow:0 18px 50px rgba(28,67,122,.09);
}
.form-header { margin-bottom:30px !important; }
.form-eyebrow { color:var(--login-blue) !important; letter-spacing:.12em !important; }
.eyebrow-dot { background:var(--login-blue) !important; }
.form-title { color:var(--login-ink) !important; font-family:Inter,"Segoe UI",Arial,sans-serif !important; font-size:30px !important; font-weight:700 !important; letter-spacing:-.04em !important; }
.form-subtitle { color:var(--login-muted) !important; font-weight:400 !important; }
.field-label { color:#344767 !important; font-size:12px !important; font-weight:650 !important; }
.field-input { min-height:48px; border:1px solid #dce5f0 !important; border-radius:10px !important; background:#fbfdff !important; color:var(--login-ink) !important; font-family:inherit !important; }
.field-input::placeholder { color:#9aaac0 !important; }
.field-input:focus { border-color:#81b3f8 !important; background:#fff !important; box-shadow:0 0 0 4px rgba(20,104,232,.1) !important; }
.field-icon,.field-eye { color:#8293ab !important; }
.field-wrap:focus-within .field-icon { color:var(--login-blue) !important; }
.checkbox-label { color:var(--login-muted) !important; }
.checkbox-box { background:#fff !important; border-color:#cbd7e6 !important; }
.checkbox-label input:checked + .checkbox-box { background:var(--login-blue) !important; border-color:var(--login-blue) !important; }
.btn-login { padding:14px !important; border-radius:10px !important; background:var(--login-blue) !important; color:#fff !important; font-family:inherit !important; font-weight:650 !important; letter-spacing:0 !important; box-shadow:0 7px 18px rgba(20,104,232,.22) !important; }
.btn-login:hover { background:#0758d3 !important; box-shadow:0 10px 24px rgba(20,104,232,.27) !important; }
.btn-login::before { display:none !important; }
.form-footer-text { color:var(--login-muted) !important; font-weight:400 !important; }
.divider { background:var(--login-line) !important; }
.status-text { color:#0a9b72 !important; }
.status-dot { background:#16a77d !important; }
.alert-error { background:#fff0f0 !important; border-color:#f5cece !important; color:#ad424b !important; }
.alert-success { background:#eaf8f2 !important; border-color:#caebdc !important; color:#087b5b !important; }
@media (max-width:900px) {
    .panel-left { flex:0 0 auto !important; width:100% !important; padding:32px 26px !important; gap:24px !important; }
    .hero-title { font-size:32px !important; }
    .panel-right { padding:28px 18px !important; }
    .form-wrapper { max-width:500px !important; padding:30px 25px !important; }
}
@media (max-width:560px) {
    .panel-left { padding:26px 20px !important; gap:19px !important; }
    .features { grid-template-columns:1fr !important; }
    .hero-title { font-size:27px !important; }
    .form-wrapper { padding:26px 21px !important; }
}
