/*
 * The animated Atlas mark and the login page — the only screens a signed-out
 * visitor sees, shared by the CRM and the Portal's own login.
 *
 * Part of the ordered atlas stylesheet — the files in this directory are
 * linked in filename order and the order is load-bearing, so a rule moved
 * between them can change what wins.
 */
/* ===================== Animated Atlas logo ===================== */
.atlas-logo{display:block;overflow:visible}
.al-globe{transform-origin:50px 50px;animation:al-tilt 9s ease-in-out infinite}
.al-orbit{transform-origin:50px 50px;animation:al-spin 7s linear infinite}
.al-sat{filter:drop-shadow(0 0 6px #5eead4)}
.al-glow{animation:al-pulse 3.2s ease-in-out infinite;transform-origin:50px 50px}
@keyframes al-spin{to{transform:rotate(360deg)}}
@keyframes al-pulse{0%,100%{opacity:.5;transform:scale(.9)}50%{opacity:1;transform:scale(1.08)}}
@keyframes al-tilt{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(4deg)}}

/* ===================== Login ===================== */
.auth-body{display:grid;place-items:center;min-height:100vh;position:relative;overflow:hidden;
  background:radial-gradient(1100px 650px at 75% -15%,#e7efec,transparent),var(--bg)}
.auth-bg{position:absolute;inset:0;z-index:0}
.orb{position:absolute;border-radius:50%;filter:blur(80px);opacity:.20;animation:float 16s ease-in-out infinite}
.orb-1{width:340px;height:340px;background:var(--accent);top:-90px;left:-60px}
.orb-2{width:280px;height:280px;background:var(--gold);bottom:-90px;right:-40px;animation-delay:-5s}
.orb-3{width:220px;height:220px;background:#3257A8;top:42%;right:32%;animation-delay:-9s}
@keyframes float{0%,100%{transform:translate(0,0)}50%{transform:translate(26px,-26px)}}
.auth-card{position:relative;z-index:1;width:380px;max-width:92vw;padding:36px 32px;
  background:var(--surface,#fff);border:1px solid var(--line);border-radius:16px;
  box-shadow:0 16px 48px -16px rgba(20,25,31,.22);animation:rise .5s cubic-bezier(.2,.8,.2,1)}
@keyframes rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.auth-brand{display:flex;align-items:center;gap:13px;margin-bottom:24px}
.auth-brand h1{font-family:var(--wordmark);font-size:24px;letter-spacing:2px;color:var(--ink);font-weight:600}
.auth-brand-text p{color:var(--muted);font-size:12px;margin-top:3px}
.auth-form{display:flex;flex-direction:column;gap:15px}
.auth-form label{display:flex;flex-direction:column;gap:7px;font-size:12px;color:var(--muted);font-weight:600}
.auth-form input{background:#fff;border:1px solid var(--line2);border-radius:9px;padding:11px 13px;
  color:var(--txt);font-size:14px;transition:.18s}
.auth-form input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(30,99,224,.14)}
.auth-error{background:#F1DBDB;border:1px solid #e3c4c4;color:#9a2f2f;
  padding:10px 13px;border-radius:9px;font-size:13px;margin-bottom:16px}
.btn-primary{display:flex;align-items:center;justify-content:center;gap:9px;margin-top:6px;
  background:var(--accent);color:#fff;font-weight:600;border:none;border-radius:9px;
  padding:12px;cursor:pointer;font-size:14px;transition:.18s;box-shadow:0 1px 2px rgba(30,99,224,.25)}
.btn-primary:hover{background:#1a55c0}
.auth-foot{text-align:center;color:var(--faint);font-size:11px;margin-top:22px}