/* ============================================================
   Area do Cliente - Elojob Royal
   ============================================================ */
.ejr-cliente-body{background:#080b12;color:#e7eaf3;min-height:100vh}

/* Fundo da pagina: a arte fica atras de tudo, presa na viewport, com
   escurecimento por cima para o card e o texto continuarem legiveis. */
.ejr-cli-main{position:relative;padding:120px 0 90px;min-height:72vh;isolation:isolate}
.ejr-cli-main::before{content:"";position:fixed;inset:0;z-index:-2;
  background:url('../imagens/background/cliente-fundo.webp') center/cover no-repeat;
  opacity:1}
.ejr-cli-main::after{content:"";position:fixed;inset:0;z-index:-1;
  background:radial-gradient(ellipse 58% 62% at 50% 46%,rgba(8,11,18,.72) 0%,rgba(8,11,18,.5) 55%,rgba(8,11,18,.34) 100%),
             linear-gradient(180deg,rgba(8,11,18,.9) 0%,rgba(8,11,18,.25) 22%,rgba(8,11,18,.3) 68%,rgba(8,11,18,.95) 100%)}
@media (max-width:820px){
  .ejr-cli-main::before{opacity:.85}
}

.ejr-cli-h1{font-size:29px;font-weight:800;letter-spacing:.4px;margin:0 0 6px;color:#fff}
.ejr-cli-h2{font-size:13px;font-weight:800;letter-spacing:1.4px;text-transform:uppercase;color:#1ee0ac;margin:0 0 22px}

/* ------------------------------------------------------------- login */
.ejr-cli-card{display:grid;grid-template-columns:minmax(0,0.82fr) minmax(0,1fr);
  max-width:920px;margin:0 auto;border-radius:24px;overflow:hidden;
  background:linear-gradient(165deg,rgba(18,24,37,.97),rgba(9,13,22,.98));
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 45px 110px rgba(0,0,0,.8),0 0 70px rgba(30,224,172,.07);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}

/* ---- painel de arte ---- */
.ejr-cli-arte{position:relative;min-height:520px;
  background:#070a11 url('../imagens/background/cliente-arte-v2.webp') center/cover no-repeat}
.ejr-cli-arte-fade{position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(7,10,17,.1) 35%,rgba(7,10,17,.82) 78%,rgba(7,10,17,.95) 100%),
             linear-gradient(90deg,transparent 60%,rgba(9,13,22,.55) 100%)}
.ejr-cli-arte-rodape{position:absolute;left:0;right:0;bottom:0;padding:26px 26px 24px}
.ejr-cli-nota{display:flex;align-items:center;gap:9px;margin-bottom:9px}
.ejr-cli-estrelas{display:inline-flex;gap:2px;color:#ffc454}
.ejr-cli-estrelas svg{width:14px;height:14px}
.ejr-cli-nota strong{font-size:13.5px;font-weight:800;color:#fff}
.ejr-cli-arte-rodape p{margin:0;font-size:12.5px;line-height:1.6;color:#b6bccd;max-width:250px}

/* ---- painel do formulario ---- */
.ejr-cli-form-lado{padding:44px 42px 38px;display:flex;flex-direction:column}
.ejr-cli-form-lado .ejr-cli-h1{font-size:26px;text-align:left;margin-bottom:6px}
.ejr-cli-sub{text-align:left;font-size:13.5px;line-height:1.65;color:#858ba1;margin:0 0 26px}
.ejr-cli-form{display:flex;flex-direction:column;gap:0}
.ejr-cli-form label{font-size:11px;font-weight:800;letter-spacing:1.1px;text-transform:uppercase;
  color:#767c92;margin:0 0 8px}
.ejr-cli-campo{position:relative;margin-bottom:18px}
.ejr-cli-campo-ico{position:absolute;left:15px;top:50%;transform:translateY(-50%);
  width:17px;height:17px;color:#4d5468;pointer-events:none;transition:color .2s ease}
.ejr-cli-campo:focus-within .ejr-cli-campo-ico{color:#1ee0ac}
.ejr-cli-input{width:100%;padding:14px 16px 14px 44px;border-radius:12px;font-size:14.5px;color:#fff;
  background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.1);
  transition:border-color .2s,box-shadow .2s,background .2s}
.ejr-cli-input::placeholder{color:#4d5468}
.ejr-cli-input:focus{outline:none;border-color:rgba(30,224,172,.65);
  background:rgba(255,255,255,.06);box-shadow:0 0 0 3px rgba(30,224,172,.12)}
.ejr-cli-btn{margin-top:8px;padding:15px;border:0;border-radius:12px;font-size:13.5px;font-weight:800;
  letter-spacing:.9px;text-transform:uppercase;color:#04231a;cursor:pointer;
  background:linear-gradient(90deg,#0cbf8e,#1ee0ac);box-shadow:0 10px 30px rgba(30,224,172,.28);
  transition:transform .18s,box-shadow .18s}
.ejr-cli-btn:hover{transform:translateY(-2px);box-shadow:0 14px 38px rgba(30,224,172,.42)}
.ejr-cli-erro{padding:12px 15px;margin-bottom:18px;border-radius:11px;font-size:13px;line-height:1.55;
  color:#ffc9d2;background:rgba(255,77,109,.1);border:1px solid rgba(255,77,109,.35)}

.ejr-cli-divisor{display:flex;align-items:center;gap:12px;margin:24px 0 16px}
.ejr-cli-divisor::before,.ejr-cli-divisor::after{content:"";flex:1;height:1px;background:rgba(255,255,255,.08)}
.ejr-cli-divisor span{font-size:10.5px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:#565d70}

.ejr-cli-wpp-alt{display:flex;align-items:center;justify-content:center;gap:9px;padding:13px;
  border-radius:12px;font-size:13px;font-weight:700;color:#c2c8d8;
  background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.09);
  transition:color .2s,border-color .2s,background .2s}
.ejr-cli-wpp-alt:hover{color:#1ee0ac;border-color:rgba(30,224,172,.4);
  background:rgba(30,224,172,.07);text-decoration:none}
.ejr-cli-selo{display:flex;align-items:center;justify-content:center;gap:7px;
  margin:22px 0 0;font-size:11px;font-weight:600;letter-spacing:.4px;color:#565d70}

@media (max-width:820px){
  .ejr-cli-card{grid-template-columns:1fr;max-width:440px}
  .ejr-cli-arte{min-height:170px;background-position:center 22%}
  .ejr-cli-arte-rodape{padding:18px 22px 16px}
  .ejr-cli-arte-rodape p{max-width:none;font-size:12px}
  .ejr-cli-form-lado{padding:32px 26px 30px}
  .ejr-cli-form-lado .ejr-cli-h1{font-size:22px}
}

/* ------------------------------------------------------------ painel */
.ejr-cli-painel{max-width:1000px;margin:0 auto}
.ejr-cli-topo{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;flex-wrap:nowrap;margin-bottom:26px}
.ejr-cli-topo > div:first-child{min-width:0;flex:1}
.ejr-cli-topo .ejr-cli-h1{overflow-wrap:anywhere}
.ejr-cli-ola{font-size:12px;font-weight:800;letter-spacing:1.4px;text-transform:uppercase;color:#1ee0ac;margin:0 0 8px}
.ejr-cli-ref{font-size:12.5px;color:#767c92;margin:0}
.ejr-cli-ref strong{color:#b9bfd0;letter-spacing:.6px}
.ejr-cli-sair{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:#767c92;
  padding:9px 18px;border-radius:30px;border:1px solid rgba(255,255,255,.12);white-space:nowrap}
.ejr-cli-sair:hover{color:#fff;border-color:rgba(255,255,255,.3);text-decoration:none}

.ejr-cli-barra-wrap{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.ejr-cli-barra{flex:1;height:9px;border-radius:20px;background:rgba(255,255,255,.07);overflow:hidden}
.ejr-cli-barra span{display:block;height:100%;border-radius:20px;
  background:linear-gradient(90deg,#0cbf8e,#1ee0ac);box-shadow:0 0 16px rgba(30,224,172,.6);
  transition:width .6s cubic-bezier(.4,0,.2,1)}
.ejr-cli-pct{font-size:13px;font-weight:800;color:#1ee0ac;min-width:42px;text-align:right}

.ejr-cli-aviso{padding:14px 18px;margin:20px 0 0;border-radius:13px;font-size:13.5px;line-height:1.6;
  color:#ffe0a8;background:rgba(255,196,84,.08);border:1px solid rgba(255,196,84,.3)}
.ejr-cli-aviso a{color:#ffc454;font-weight:700;text-decoration:underline}

.ejr-cli-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:20px;margin-top:26px}
.ejr-cli-card{padding:30px 28px;border-radius:20px;
  background:linear-gradient(165deg,rgba(18,24,37,.9),rgba(10,14,23,.9));
  border:1px solid rgba(255,255,255,.07)}

.ejr-cli-timeline{list-style:none;margin:0;padding:0}
.ejr-cli-passo{display:flex;gap:16px;padding-bottom:24px;position:relative}
.ejr-cli-passo:not(:last-child)::before{content:"";position:absolute;left:7px;top:20px;bottom:0;width:2px;background:rgba(255,255,255,.09)}
.ejr-cli-passo.is-feita:not(:last-child)::before{background:rgba(30,224,172,.45)}
.ejr-cli-passo:last-child{padding-bottom:0}
.ejr-cli-bolinha{flex:0 0 16px;width:16px;height:16px;border-radius:50%;margin-top:2px;
  background:rgba(255,255,255,.1);border:2px solid rgba(255,255,255,.18);z-index:1}
.ejr-cli-passo.is-feita .ejr-cli-bolinha{background:#1ee0ac;border-color:#1ee0ac}
.ejr-cli-passo.is-atual .ejr-cli-bolinha{background:#1ee0ac;border-color:rgba(30,224,172,.35);
  box-shadow:0 0 0 5px rgba(30,224,172,.16);animation:ejrPulso 2s ease-in-out infinite}
.ejr-cli-passo.is-cancelado .ejr-cli-bolinha{background:#ff4d6d;border-color:#ff4d6d}
@keyframes ejrPulso{0%,100%{box-shadow:0 0 0 5px rgba(30,224,172,.16)}50%{box-shadow:0 0 0 9px rgba(30,224,172,.05)}}
.ejr-cli-passo strong{display:block;font-size:14.5px;color:#5a6076;font-weight:700}
.ejr-cli-passo p{margin:3px 0 0;font-size:12.5px;line-height:1.6;color:#4d5468}
.ejr-cli-passo.is-feita strong{color:#b9bfd0}
.ejr-cli-passo.is-feita p{color:#6d7488}
.ejr-cli-passo.is-atual strong{color:#fff;font-size:15.5px}
.ejr-cli-passo.is-atual p{color:#989fb4}
.ejr-cli-booster{margin:22px 0 0;padding-top:20px;border-top:1px solid rgba(255,255,255,.07);
  font-size:13px;color:#767c92}
.ejr-cli-booster strong{color:#1ee0ac}

.ejr-cli-dl{margin:0}
.ejr-cli-dl dt{font-size:11px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:#5a6076;margin-top:18px}
.ejr-cli-dl dt:first-child{margin-top:0}
.ejr-cli-dl dd{margin:5px 0 0;font-size:15px;font-weight:700;color:#e7eaf3}
.ejr-cli-wpp{display:block;margin-top:28px;padding:13px;border-radius:30px;text-align:center;
  font-size:12.5px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;
  color:#1ee0ac;border:1px solid rgba(30,224,172,.4)}
.ejr-cli-wpp:hover{color:#04231a;background:#1ee0ac;text-decoration:none}

.ejr-cli-notas{margin-top:20px}
.ejr-cli-notas ul{list-style:none;margin:0;padding:0}
.ejr-cli-notas li{padding:16px 0;border-bottom:1px solid rgba(255,255,255,.06)}
.ejr-cli-notas li:last-child{border-bottom:0;padding-bottom:0}
.ejr-cli-nota-data{font-size:11px;font-weight:800;letter-spacing:.8px;color:#1ee0ac}
.ejr-cli-notas p{margin:5px 0 0;font-size:13.5px;line-height:1.65;color:#989fb4}

@media (max-width:880px){
  .ejr-cli-grid{grid-template-columns:1fr}
  .ejr-cli-main{padding:100px 0 70px}
  .ejr-cli-h1{font-size:23px}
}
@media (prefers-reduced-motion:reduce){
  .ejr-cli-barra span,.ejr-cli-btn{transition:none}
  .ejr-cli-passo.is-atual .ejr-cli-bolinha{animation:none}
}