/* =====================================================================
   login.css — 로그인 페이지(login) — 로그인 카드 · 입력폼 · 버튼
   ---------------------------------------------------------------------
   ● base.css의 전역 변수(:root)에 의존합니다. base.css를 먼저 불러온 뒤 이 파일을 불러오세요.
   ● 로드 순서: base → layout → home → company → products → modal → login → responsive
   ===================================================================== */

/* ══════════ 로그인 페이지 ══════════ */
.auth{min-height:calc(100vh - 69px);display:flex;align-items:center;justify-content:center;padding:56px 24px;position:relative;overflow:hidden;background:var(--ink)}
.auth .grid-lines{position:absolute;inset:0;opacity:.4;background-image:linear-gradient(var(--line-dk) 1px,transparent 1px),linear-gradient(90deg,var(--line-dk) 1px,transparent 1px);background-size:64px 64px;mask-image:radial-gradient(90% 80% at 50% 0%,#000,transparent 80%)}
.auth-card{position:relative;width:100%;max-width:430px;background:var(--paper-2);border:1px solid var(--line);border-radius:18px;padding:42px 40px 36px;box-shadow:0 24px 60px rgba(4,12,20,.4)}
.auth-card .brand{justify-content:center;margin-bottom:6px}
.auth-head{text-align:center;margin-bottom:30px}
.auth-head .eyebrow{justify-content:center;margin-bottom:12px}
.auth-head h1{font-size:26px;font-weight:700;letter-spacing:-.01em}
.field{margin-bottom:16px}
.field label{display:block;font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--slate);margin-bottom:7px}
.field input{width:100%;padding:13px 15px;border:1px solid var(--line);border-radius:10px;font-size:15px;font-family:var(--font-body);background:#fff;color:var(--ink);transition:border-color .15s,box-shadow .15s}
.field input::placeholder{color:#A6B0B8}
.field input:focus{outline:0;border-color:var(--steel-2);box-shadow:0 0 0 3px rgba(27,69,112,.14)}
.auth-row{display:flex;align-items:center;justify-content:space-between;margin:6px 0 22px;font-size:13px}
.remember{display:flex;align-items:center;gap:8px;color:var(--slate);cursor:pointer;user-select:none}
.remember input{width:15px;height:15px;accent-color:var(--steel-2)}
.btn-primary{width:100%;background:var(--ink);color:#fff;border:0;font-family:var(--font-body);font-weight:700;font-size:15px;padding:15px;border-radius:11px;cursor:pointer;transition:background .2s}
.btn-primary:hover{background:var(--steel-2)}
.btn-outline{width:100%;background:none;color:var(--ink);border:1px solid var(--ink);font-family:var(--font-body);font-weight:600;font-size:15px;padding:14px;border-radius:11px;cursor:pointer;margin-top:12px;transition:background .2s,color .2s}
.btn-outline:hover{background:var(--ink);color:#fff}
.auth-sep{display:flex;align-items:center;gap:14px;margin:24px 0 4px;color:var(--slate);font-family:var(--font-mono);font-size:11px;letter-spacing:.1em}
.auth-sep::before,.auth-sep::after{content:"";flex:1;height:1px;background:var(--line)}
.auth-links{display:flex;justify-content:center;gap:18px;margin-top:26px;font-size:13px;color:var(--slate)}
.auth-links a{position:relative}
.auth-links a:hover{color:var(--ink)}
.auth-links a+a::before{content:"";position:absolute;left:-9px;top:3px;bottom:3px;width:1px;background:var(--line)}