/* Ingreso de clientes (ingreso.php): la plataforma desenfocada al fondo y la ventana de ingreso al frente, como la
   imagen de referencia del usuario. */
@font-face{font-family:'Manrope';src:url('../../../fonts/manrope-latin.woff2') format('woff2');font-weight:200 800;font-display:swap}
:root{--azul:#0b57d0;--azul-2:#0846ad;--tinta:#111418;--suave:#4b5563;--linea:#cfd4dc;--t:1}
@media (prefers-reduced-motion:reduce){:root{--t:2}}
*,*::before,*::after{box-sizing:border-box}
html,body{min-height:100%}
body{margin:0;background:#d9dbdf;color:var(--tinta);font-family:'Manrope','Segoe UI',system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
button,input{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--azul);outline-offset:3px}

/* ---------- fondo: la plataforma desenfocada ---------- */
.in-fondo{position:fixed;inset:-30px;padding:40px 7vw;background:#f4f5f7;filter:blur(9px) grayscale(.35);transform:scale(1.03);pointer-events:none;user-select:none}
.in-fondo::after{content:"";position:fixed;inset:0;background:rgba(40,44,52,.22)}
.in-f-cabeza{display:flex;align-items:center;gap:14px}
.in-f-cabeza img{height:56px}
.in-f-cabeza strong{display:block;font-size:1.3rem;letter-spacing:.04em}
.in-f-cabeza span{color:#6b7280;font-size:.95rem}
.in-f-portada{display:grid;grid-template-columns:1.1fr 1fr;gap:40px;margin-top:60px;align-items:center}
.in-f-chip{display:inline-block;padding:6px 16px;border-radius:999px;background:#e5e7eb;color:#6b7280}
.in-f-portada h2{margin:20px 0 0;font-size:clamp(2.2rem,4.4vw,3.8rem);line-height:1.05;font-weight:800}
.in-f-portada p{margin-top:18px;color:#6b7280;font-size:1.1rem}
.in-f-boton{display:inline-block;margin-top:28px;padding:20px 42px;border-radius:999px;background:#111;color:#fff;box-shadow:0 16px 30px -12px rgba(0,0,0,.6)}
.in-f-panel{padding:30px;border-radius:28px;background:#fff}
.in-f-panel img{width:44%;margin:0 auto 22px;display:block}
.in-f-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:20px;border-radius:22px;background:linear-gradient(135deg,#2b2a24,#4b4630)}
.in-f-kpis b{display:grid;place-items:center;padding:18px 0;border-radius:16px;background:rgba(255,255,255,.08);color:#fff;font-size:1.8rem}
.in-f-kpis small{font-size:.75rem;color:#cfcfcf}
.in-f-buscar{display:flex;align-items:center;justify-content:space-between;margin-top:56px;padding:22px 26px;border-radius:999px;background:#fff;color:#6b7280;font-size:1.1rem}
.in-f-buscar i{width:52px;height:52px;border-radius:50%;background:#111}
.in-f-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:40px}
.in-f-grid i{height:220px;border-radius:24px;background:#fff}

/* ---------- ventana de ingreso ---------- */
.in-capa{position:relative;z-index:1;min-height:100vh;display:grid;place-items:center;padding:28px 16px}
.in-caja{width:min(460px,100%);padding:34px 38px 30px;border-radius:26px;background:#fff;box-shadow:0 40px 80px -30px rgba(0,0,0,.55),0 2px 8px rgba(0,0,0,.06);text-align:left;animation:inEntra calc(.45s*var(--t)) cubic-bezier(.2,.7,.2,1) both}
@keyframes inEntra{from{opacity:0;transform:translateY(16px) scale(.98)}}
.in-logo{display:block;width:140px;height:auto;margin:0 auto 14px}
.in-caja h1{margin:0;text-align:center;font-size:2.05rem;font-weight:700;letter-spacing:-.02em;line-height:1.15}
.in-sub{margin:6px 0 26px;text-align:center;color:var(--suave);font-size:1.12rem}
.in-etiqueta{display:block;margin:14px 0 8px;font-size:1.02rem;font-weight:600}
.in-campo{position:relative;display:flex;align-items:center;height:56px;border:1px solid var(--linea);border-radius:13px;background:#f6f7f9;transition:border-color calc(.15s*var(--t)) ease,box-shadow calc(.15s*var(--t)) ease}
.in-campo:focus-within{border-color:var(--azul);box-shadow:0 0 0 3px rgba(11,87,208,.14);background:#fff}
.in-campo > i{width:52px;text-align:center;color:#6b7280;font-size:1.15rem}
.in-campo input{flex:1;min-width:0;height:100%;border:0;background:none;font-size:1.06rem;outline:none}
.in-campo input::placeholder{color:#8b929c}
.in-ojo{display:grid;place-items:center;width:52px;height:100%;border:0;background:none;color:#4b5563;font-size:1.1rem;cursor:pointer}
.in-fila{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:18px 0 22px;flex-wrap:wrap}
.in-recordar{display:inline-flex;align-items:center;gap:10px;font-size:1.02rem;cursor:pointer}
.in-recordar input{width:20px;height:20px;accent-color:var(--azul)}
.in-fila a{color:#1a56c4;font-size:1.02rem;text-decoration:none}
.in-fila a:hover{text-decoration:underline}
.in-ingresar{display:block;width:100%;height:62px;border:0;border-radius:999px;background:linear-gradient(180deg,#1366e8,var(--azul));color:#fff;font-size:1.2rem;font-weight:700;cursor:pointer;box-shadow:0 14px 26px -12px rgba(11,87,208,.75);transition:transform calc(.2s*var(--t)) ease,filter calc(.2s*var(--t)) ease}
.in-ingresar:hover{filter:brightness(1.07);transform:translateY(-1px)}
.in-ingresar:active{transform:translateY(0)}
.in-aviso{margin:12px 0 0;padding:10px 14px;border-radius:12px;background:#eef3ff;color:#1e3a8a;font-size:.92rem;text-align:center}
.in-aviso[hidden]{display:none}
.in-aviso.is-error{background:#fef3f2;color:#b42318}
.in-ingresar:disabled{opacity:.7;cursor:default;transform:none}
.in-registro{margin:22px 0 0;text-align:center;font-size:1.02rem}
.in-registro a{color:var(--tinta);text-decoration:none;border-bottom:1px solid currentColor}
.in-registro a:hover{color:var(--azul)}
@media (max-width:520px){
    .in-caja{padding:26px 22px 24px;border-radius:22px}
    .in-caja h1{font-size:1.75rem}
    .in-logo{width:118px}
    .in-fondo{padding:20px}
    .in-f-portada{grid-template-columns:1fr}
    .in-f-grid{grid-template-columns:repeat(2,1fr)}
}
