:root{
  --jhb-green-950:#092718;
  --jhb-green-900:#0d3620;
  --jhb-green-800:#14502d;
  --jhb-green-700:#1b6a39;
  --jhb-green-600:#238447;
  --jhb-green-500:#36a85b;
  --jhb-green-400:#59c875;
  --jhb-green-100:#e8f7ec;
  --jhb-green-50:#f5fbf6;
  --jhb-ink:#173322;
  --jhb-muted:#728078;
  --jhb-line:#dce8df;
  --jhb-danger:#b42318;
}
*{box-sizing:border-box}
html,body{margin:0;min-width:0;min-height:100%}
body.jhb-auth-page{
  min-height:100svh;
  overflow-x:hidden;
  background:#f5f8f5;
  color:var(--jhb-ink);
  font-family:'Manrope',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
}
a{color:inherit;text-decoration:none}
button,input{font:inherit}

/* LOGIN — composición simple 2 columnas */
.jhb-auth-layout{
  min-height:100svh;
  display:grid;
  grid-template-columns:minmax(390px,46%) minmax(520px,54%);
  background:#fff;
}
.jhb-auth-story{
  min-width:0;
  position:relative;
  isolation:isolate;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  padding:clamp(38px,5vw,76px);
  color:#fff;
  background:
    linear-gradient(145deg,rgba(8,45,25,.96),rgba(20,101,51,.92) 62%,rgba(55,151,78,.88)),
    url('/assets/jhb-importaciones-visual.jpg') center/cover no-repeat;
}
.jhb-auth-story:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:
    radial-gradient(circle at 18% 18%,rgba(255,255,255,.13),transparent 26%),
    radial-gradient(circle at 84% 72%,rgba(132,230,151,.20),transparent 28%);
}
.jhb-auth-story:after{
  content:"";
  position:absolute;
  width:520px;height:520px;
  right:-280px;bottom:-250px;
  z-index:-1;
  border:1px solid rgba(255,255,255,.18);
  border-radius:50%;
  box-shadow:0 0 0 62px rgba(255,255,255,.035),0 0 0 126px rgba(255,255,255,.02);
}
.jhb-auth-kicker{
  margin:0;
  width:max-content;
  max-width:100%;
  padding:8px 12px;
  border:1px solid rgba(255,255,255,.28);
  border-radius:999px;
  background:rgba(255,255,255,.08);
  backdrop-filter:blur(8px);
  font-size:9px;
  font-weight:800;
  letter-spacing:.18em;
}
.jhb-auth-story-main{margin:auto 0;max-width:650px;padding:50px 0}
.jhb-auth-story h1{
  margin:0;
  max-width:650px;
  font-size:clamp(44px,4.5vw,72px);
  line-height:1.01;
  letter-spacing:-.055em;
  text-wrap:balance;
}
.jhb-auth-story h1 span{display:block;color:#a9efb7}
.jhb-auth-story-main>p{
  max-width:570px;
  margin:24px 0 0;
  color:rgba(255,255,255,.78);
  font-size:14px;
  line-height:1.75;
}
.jhb-auth-benefits{
  display:flex;
  flex-wrap:wrap;
  gap:9px;
  margin-top:30px;
}
.jhb-auth-benefits article{
  min-width:0;
  display:flex;
  align-items:center;
  gap:8px;
  padding:9px 12px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:10px;
  background:rgba(255,255,255,.075);
  backdrop-filter:blur(8px);
}
.jhb-auth-benefits .benefit-icon{display:none}
.jhb-auth-benefits strong{font-size:9px;letter-spacing:.035em}
.jhb-auth-benefits small{display:none}
.jhb-auth-benefits article:before{
  content:"✓";
  width:18px;height:18px;
  display:grid;place-items:center;
  border-radius:50%;
  background:rgba(190,246,200,.16);
  color:#bff4c9;
  font-size:10px;font-weight:900;
}
.jhb-auth-signature{
  display:flex;
  align-items:center;
  gap:13px;
  color:rgba(255,255,255,.72);
}
.jhb-auth-signature:before{content:"";width:34px;height:2px;background:#9ee9ad}
.jhb-auth-signature b{font-size:9px;letter-spacing:.22em}
.jhb-auth-signature span{font-size:8px;letter-spacing:.18em}

.jhb-auth-center{
  min-width:0;
  display:grid;
  place-items:center;
  padding:40px clamp(32px,7vw,110px);
  background:
    radial-gradient(circle at 92% 10%,rgba(61,163,87,.07),transparent 24%),
    #fff;
}
.jhb-auth-card{
  width:min(100%,470px);
  padding:0;
  background:transparent;
}
.jhb-auth-logo{
  width:205px;
  height:108px;
  display:grid;
  place-items:center;
  margin:0 0 26px;
}
.jhb-auth-logo img{display:block;width:100%;height:100%;object-fit:contain;object-position:left center}
.jhb-auth-heading{text-align:left;margin:0 0 30px}
.jhb-auth-heading h2{
  margin:0;
  color:#173322;
  font-size:34px;
  line-height:1.08;
  letter-spacing:-.045em;
}
.jhb-auth-heading p{
  margin:9px 0 0;
  color:#79867e;
  font-size:10px;
  font-weight:800;
  letter-spacing:.22em;
}
.jhb-auth-mode{
  width:max-content;
  margin:15px 0 0;
  padding:7px 10px;
  border-radius:999px;
  background:var(--jhb-green-100);
  color:var(--jhb-green-700);
  font-size:8px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.jhb-auth-alert{
  margin:0 0 17px;
  padding:12px 14px;
  border-radius:10px;
  font-size:11px;
  line-height:1.55;
}
.jhb-auth-alert.error{border:1px solid #f2cbc7;background:#fff5f4;color:#a12b22}
.jhb-auth-alert.success{border:1px solid #cfe8d5;background:#f1faf3;color:#176236}
.jhb-auth-form{display:grid;gap:16px}
.jhb-auth-form label{display:grid;gap:7px}
.jhb-auth-form label>span{color:#31473a;font-size:11px;font-weight:800}
.jhb-input{
  height:54px;
  display:flex;
  align-items:center;
  gap:11px;
  padding:0 13px;
  border:1px solid #d9e5dc;
  border-radius:11px;
  background:#fbfdfb;
  transition:border-color .2s,box-shadow .2s,background .2s;
}
.jhb-input:focus-within{
  border-color:#65b97a;
  box-shadow:0 0 0 4px rgba(47,145,72,.09);
  background:#fff;
}
.jhb-input>svg{width:19px;height:19px;flex:0 0 auto;fill:none;stroke:#87978c;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.jhb-input input{min-width:0;flex:1;height:100%;border:0;outline:0;background:transparent;color:#1e3527;font-size:12px}
.jhb-input input::placeholder{color:#a1ada5}
.jhb-password-toggle{
  width:38px;height:38px;
  border:0;border-radius:9px;
  display:grid;place-items:center;
  background:transparent;
  color:#8b9a90;
  cursor:pointer;
  transition:.2s;
}
.jhb-password-toggle:hover,.jhb-password-toggle.active{background:#edf7ef;color:#297a43}
.jhb-password-toggle svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.jhb-auth-tools{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:-3px;font-size:9px}
.jhb-auth-tools .secure-note{color:#87938b}
.jhb-auth-tools a{color:#237641;font-weight:900}
.jhb-auth-tools a:hover{text-decoration:underline}
.jhb-auth-submit{
  width:100%;height:54px;
  border:0;border-radius:11px;
  display:flex;align-items:center;justify-content:center;gap:13px;
  background:linear-gradient(135deg,#176d38,#2f9550);
  color:#fff;
  font-size:12px;
  font-weight:900;
  cursor:pointer;
  box-shadow:0 13px 28px rgba(27,109,56,.18);
  transition:transform .2s,box-shadow .2s,filter .2s;
}
.jhb-auth-submit:hover{transform:translateY(-1px);filter:saturate(1.05);box-shadow:0 16px 34px rgba(27,109,56,.24)}
.jhb-auth-submit b{font-size:19px;line-height:1}
.jhb-auth-divider{display:flex;align-items:center;gap:12px;margin:20px 0;color:#99a49c;font-size:9px}
.jhb-auth-divider:before,.jhb-auth-divider:after{content:"";height:1px;flex:1;background:#e2ebe4}
.jhb-auth-secondary{
  width:100%;height:49px;
  display:grid;place-items:center;
  border:1px solid #a9cfb3;
  border-radius:10px;
  background:#fff;
  color:#236d3d;
  font-size:11px;font-weight:900;
  transition:.2s;
}
.jhb-auth-secondary:hover{background:#f3faf5;border-color:#73b685}
.jhb-auth-help{margin:14px 0 0;text-align:center;color:#8a968e;font-size:9px;line-height:1.45}
.jhb-auth-help a{color:#237641;font-weight:900}
.jhb-google-slot{min-height:44px;margin-bottom:3px;display:grid;place-items:center;overflow:hidden}
.jhb-auth-visual{display:none!important}

/* Recuperación / reset: misma identidad clara */
.jhb-recovery-shell{
  min-height:100svh;
  display:grid;
  place-items:center;
  padding:30px 16px;
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 15% 15%,rgba(65,165,89,.11),transparent 28%),
    linear-gradient(145deg,#f3f8f4,#edf5ef);
}
.jhb-recovery-shell:before{
  content:"";position:absolute;width:560px;height:560px;right:-300px;bottom:-320px;border:1px solid rgba(34,111,57,.11);border-radius:50%;box-shadow:0 0 0 72px rgba(34,111,57,.025)
}
.jhb-recovery-card{
  position:relative;z-index:2;
  width:min(100%,530px);
  padding:34px 38px 36px;
  border:1px solid #dce9df;
  border-radius:22px;
  background:#fff;
  box-shadow:0 28px 80px rgba(33,79,45,.11);
  text-align:center;
}
.jhb-recovery-logo{width:205px;height:100px;display:grid;place-items:center;margin:0 auto 5px}
.jhb-recovery-logo img{width:100%;height:100%;object-fit:contain}
.jhb-recovery-icon{width:48px;height:48px;margin:5px auto 13px;display:grid;place-items:center;border:1px solid #b9ddc2;border-radius:50%;color:#24733f;background:#eef8f1}
.jhb-recovery-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.jhb-recovery-card>small{color:#2b8147;font-size:9px;font-weight:900;letter-spacing:.22em}
.jhb-recovery-card h1{margin:8px 0 10px;color:#183625;font-size:30px;line-height:1.08;letter-spacing:-.04em}
.jhb-recovery-card>p{max-width:430px;margin:0 auto 22px;color:#75847a;font-size:11px;line-height:1.65}
.jhb-recovery-card .jhb-auth-form{text-align:left;margin-top:17px}
.jhb-recovery-back{display:inline-block;margin-top:20px;color:#748178;font-size:10px;font-weight:800}
.jhb-recovery-back:hover{color:#246f3e}
.jhb-submit-link{text-decoration:none;margin-top:18px}
.jhb-recovery-card>.jhb-auth-secondary{margin-top:18px}

@media(max-width:980px){
  .jhb-auth-layout{grid-template-columns:minmax(330px,42%) minmax(0,58%)}
  .jhb-auth-story{padding:38px 32px}
  .jhb-auth-story h1{font-size:clamp(38px,5.5vw,58px)}
  .jhb-auth-center{padding:34px}
}
@media(max-width:760px){
  .jhb-auth-layout{display:block;min-height:100svh;background:#fff}
  .jhb-auth-story{display:none}
  .jhb-auth-center{min-height:100svh;padding:28px 20px}
  .jhb-auth-card{width:min(100%,500px)}
  .jhb-auth-logo{width:190px;height:92px;margin-bottom:18px}
  .jhb-auth-heading{margin-bottom:24px}
  .jhb-auth-heading h2{font-size:29px}
}
@media(max-width:480px){
  .jhb-auth-center{padding:20px 17px}
  .jhb-auth-logo{width:175px;height:84px}
  .jhb-auth-heading h2{font-size:27px}
  .jhb-input{height:51px}
  .jhb-auth-submit{height:52px}
  .jhb-auth-tools .secure-note{display:none}
  .jhb-auth-tools a{margin-left:auto}
  .jhb-recovery-card{padding:27px 18px;border-radius:18px}
  .jhb-recovery-logo{width:180px;height:86px}
  .jhb-recovery-card h1{font-size:26px}
}