/* ─────────────────────────────────────────
   CLIENT ACCESS — SIGN IN PAGE
───────────────────────────────────────── */

.client-access-body{
  background:#F9FAFB; 
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
  overflow:hidden;
}

/* Executive ambient glow */
.client-access-body::before{
  content:"";
  position:absolute;
  width:700px;
  height:700px;
  top:-220px;
  right:-180px;
  background:radial-gradient(circle, rgba(37,99,235,.10), transparent 70%);
  pointer-events:none;
}

.client-access-body::after{
  content:"";
  position:absolute;
  width:500px;
  height:500px;
  bottom:-200px;
  left:-160px;
  background:radial-gradient(circle, rgba(37,99,235,.06), transparent 70%);
  pointer-events:none;
}

/* Container */
.access-container{
  position:relative;
  z-index:2;
  width:92%;
  max-width:640px;
  padding:20px;
}

/* Card */
.access-card{
  background:var(--white);
  padding:3.5rem;
  border-radius:14px;
  border:1px solid var(--border);
  text-align:center;
  box-shadow:
    0 8px 24px rgba(16,24,40,.05),
    0 24px 60px rgba(16,24,40,.08);
  transition:transform .25s ease;
}

.access-card:hover{
  transform:translateY(-2px);
}

/* Typography */
.access-brand{
  font-size:.85rem;
  color:var(--text-3);
  margin-bottom:1rem;
}

.access-title{
  font-family:var(--serif);
  font-size:1.6rem;
  font-weight:400;
  letter-spacing:-0.02em;
  margin-bottom:.6rem;
}

.access-sub{
  font-size:.95rem;
  color:var(--text-3);
  margin-bottom:2rem;
}

.access-line{
  height:1px;
  width:100%;
  margin:2rem 0;
  background:linear-gradient(90deg, transparent, var(--accent), transparent);
  opacity:.15;
}

/* Form */
.form-group{
  text-align:left;
  margin-bottom:1.25rem;
}

.form-group label{
  font-size:.8rem;
  color:var(--text-3);
  margin-bottom:6px;
  display:block;
}

.form-group input{
  width:100%;
  padding:12px;
  border-radius:8px;
  border:1px solid var(--border);
  font-size:.95rem;
  font-family:var(--sans);
}

.form-group input:focus{
  outline:none;
  border-color:var(--accent);
  box-shadow:0 0 0 3px var(--accent-light);
}

.full{
  width:100%;
}

.access-note{
  margin-top:1.5rem;
  font-size:.75rem;
  color:var(--text-4);
}

/* Status Indicator */
.access-status{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  font-size:.75rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--text-4);
  margin-bottom:1.5rem;
}

.status-dot{
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--accent);
  animation:pulse 2s infinite ease-in-out;
}

@keyframes pulse{
  0%{opacity:.4; transform:scale(.9);} 
  50%{opacity:1; transform:scale(1);} 
  100%{opacity:.4; transform:scale(.9);} 
}

/* Optional Boot Overlay */
.ai-boot{
  position:fixed;
  inset:0;
  background:#0B1220;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:9999;
  opacity:0;
  visibility:hidden;
  transition:opacity .4s ease;
}

.ai-boot.active{
  opacity:1;
  visibility:visible;
}

.boot-card{
  text-align:center;
  color:#ffffff;
  max-width:420px;
  width:90%;
}

.boot-title{
  font-family:var(--serif);
  font-size:1.6rem;
  font-weight:300;
  margin-bottom:2rem;
}

.boot-progress{
  width:100%;
  height:4px;
  background:rgba(255,255,255,.08);
  border-radius:4px;
  overflow:hidden;
  margin-bottom:1.2rem;
}

.boot-bar{
  width:0%;
  height:100%;
  background:#2563EB;
  animation:bootLoad 2.4s ease forwards;
}

@keyframes bootLoad{
  0%{width:0%;}
  40%{width:45%;}
  75%{width:80%;}
  100%{width:100%;}
}
