/* Páginas previas a la sesión del CRM (acceso, errores, cierre). Identidad B&S Integral de Carga.
   Paleta tomada del logo original: azul #004999 / #0e3378 / #007fc5, verde #018136 / #5ab130, fondo #f7f7f7. */
:root { --azul: #004999; --azul-osc: #0e3378; --azul-med: #007fc5; --verde: #018136; --verde-cl: #5ab130; --fondo: #f7f7f7; --tinta: #14213d; --texto: #3b4658; }
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body.acceso { margin: 0; min-height: 100vh; display: grid; place-items: center; padding: 32px 16px; background: var(--fondo); color: var(--texto); font: 15px/1.6 system-ui, -apple-system, "Segoe UI", Roboto, "Open Sans", sans-serif; }
body.acceso::before { content: ""; position: fixed; inset: 0 0 auto; height: 6px; background: linear-gradient(90deg, var(--azul-osc), var(--azul-med) 55%, var(--verde-cl)); }
.acceso-card { width: min(100%, 440px); background: #fff; border-radius: 14px; padding: 32px 32px 28px; box-shadow: 0 1px 2px rgb(16 24 40 / 6%), 0 12px 32px -12px rgb(14 51 120 / 22%); border-top: 4px solid var(--azul); }
.acceso-logo { display: block; width: min(100%, 280px); height: auto; aspect-ratio: 768 / 318; margin: 0 auto 6px; border-radius: 6px; background: var(--fondo); }
.acceso-app { margin: 0 0 18px; text-align: center; font-size: 12px; font-weight: 700; letter-spacing: .18em; color: var(--verde); }
.acceso h1 { margin: 0 0 10px; font-size: 22px; line-height: 1.3; color: var(--azul-osc); }
.acceso p { margin: 0 0 16px; overflow-wrap: anywhere; }
.acceso form { margin: 8px 0 12px; }
.acceso button, .acceso-btn { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 46px; padding: 10px 18px; border: 0; border-radius: 8px; background: var(--azul); color: #fff; font: inherit; font-weight: 600; text-align: center; text-decoration: none; cursor: pointer; }
.acceso button:hover, .acceso-btn:hover { background: var(--azul-osc); }
.acceso-sec { display: inline-flex; align-items: center; min-height: 44px; color: var(--azul); font-weight: 600; }
.acceso a:focus-visible, .acceso button:focus-visible { outline: 3px solid var(--azul-med); outline-offset: 2px; }
@media (max-width: 480px) { body.acceso { padding: 22px 12px; place-items: start center; } .acceso-card { padding: 24px 20px 22px; } }