*{box-sizing:border-box}
html,body.zual-login-page{margin:0!important;min-height:100%;background:#e9eff3}
body.zual-login-page{min-height:100dvh;overflow-x:hidden;overflow-y:auto}
body.zual-login-page #wpadminbar{display:none!important}
html{margin-top:0!important}

.zual-screen{
  --zual-primary:#173c2b;
  --zual-primary-hover:#102f21;
  --zual-accent:#8bc34a;
  --zual-text:#172033;
  --zual-muted:#667085;
  --zual-bg:#e9eff3;
  --zual-card:#fff;
  --zual-overlay:rgba(16,38,29,.58);
  --zual-radius:22px;
  --zual-card-width:980px;
  --zual-card-height:610px;
  --zual-logo-width:180px;
  --zual-logo-offset:38px;
  min-height:100dvh;
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:clamp(12px,2.2vw,32px);
  background-color:var(--zual-bg);
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--zual-text);
  position:relative;
  isolation:isolate;
}
.zual-screen:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 14% 18%,rgba(255,255,255,.22),transparent 34%),linear-gradient(135deg,rgba(9,31,40,.08),rgba(9,31,40,.02));z-index:-1}

.zual-card{
  width:min(var(--zual-card-width),100%);
  height:auto;
  min-height:min(var(--zual-card-height),calc(100dvh - clamp(24px,4.4vw,64px)));
  max-height:none;
  background:var(--zual-card);
  border-radius:var(--zual-radius);
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(0,47%) minmax(390px,53%);
  box-shadow:0 24px 70px rgba(13,35,45,.23);
  border:1px solid rgba(255,255,255,.78);
}
.zual-card.no-visual{width:min(540px,100%);height:auto;min-height:auto;display:block}

.zual-visual{position:relative;min-height:0;height:100%;background:#203b32 center/cover no-repeat;overflow:hidden}
.zual-visual:before{content:"";position:absolute;inset:0;background:linear-gradient(160deg,rgba(20,42,34,.2),rgba(8,23,18,.52))}
.zual-visual-overlay{position:absolute;inset:0;background:var(--zual-overlay)}
.zual-pattern{position:absolute;inset:auto auto 0 0;width:68%;height:52%;opacity:.22;background-image:linear-gradient(rgba(255,255,255,.22) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.22) 1px,transparent 1px);background-size:28px 28px;mask-image:linear-gradient(45deg,#000,transparent 70%);transform:skewY(-7deg);transform-origin:left bottom}
.zual-pattern:after{content:"";position:absolute;inset:18% 12%;border:1px solid rgba(139,195,74,.7);border-radius:50%;box-shadow:0 0 60px rgba(139,195,74,.35)}
.zual-visual-copy{position:absolute;left:clamp(28px,4.5vw,54px);right:clamp(28px,4.5vw,54px);bottom:clamp(36px,6vh,66px);color:#fff;z-index:2}
.zual-kicker{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:900;letter-spacing:.18em;color:#d9f3a9;margin-bottom:15px}
.zual-kicker:before{content:"";width:28px;height:2px;background:var(--zual-accent);border-radius:10px}
.zual-visual-copy h1{margin:0;font-size:clamp(30px,3.4vw,45px);line-height:1.04;letter-spacing:-.035em;font-weight:850;max-width:420px;color:#fff}
.zual-visual-copy p{margin:14px 0 0;font-size:clamp(16px,1.7vw,20px);font-weight:600;color:rgba(255,255,255,.86)}

.zual-form-side{display:flex;align-items:center;justify-content:center;background:var(--zual-card);padding:clamp(26px,4.2vw,58px);min-width:0;height:auto;overflow:visible}
.zual-form-inner{width:min(390px,100%);margin-inline:auto}
.zual-brand{width:100%;min-height:68px;display:grid;place-items:center;margin:0 auto 22px;overflow:visible;text-align:center}
.zual-brand img{display:block;width:min(var(--zual-logo-width),100%);max-width:100%;height:68px;object-fit:contain;object-position:center;margin:0 auto;transform:translateX(var(--zual-logo-offset));transform-origin:center}
.zual-brand-fallback{display:flex;align-items:flex-end;justify-content:center;font-size:46px;line-height:1;font-weight:900;letter-spacing:-.12em;color:var(--zual-primary)}
.zual-brand-fallback i{font-style:normal;color:var(--zual-accent);font-size:30px;transform:translate(-2px,-4px)}
.zual-form-head{text-align:center;margin-bottom:27px}
.zual-form-head h2{margin:0;color:var(--zual-text);font-size:clamp(25px,2.5vw,30px);line-height:1.15;letter-spacing:-.025em;font-weight:850}
.zual-form-head p{margin:9px auto 0;color:var(--zual-muted);font-size:14px;line-height:1.5;max-width:350px}
.zual-alert{display:flex;align-items:flex-start;gap:10px;margin:0 0 18px;padding:12px 14px;border:1px solid #fecaca;background:#fff1f2;color:#9f1239;border-radius:12px;font-size:13px;font-weight:650;line-height:1.45}
.zual-alert span{display:grid;place-items:center;width:20px;height:20px;flex:0 0 20px;background:#be123c;color:#fff;border-radius:50%;font-size:12px;font-weight:900}
.zual-form{display:block}
.zual-label{display:block;margin:0 0 7px;color:var(--zual-text);font-size:13px;font-weight:750}
.zual-label:not(:first-of-type){margin-top:17px}
.zual-control{height:50px;border:1px solid #d0d5dd;border-radius:11px;background:#fff;display:flex;align-items:center;padding:0 13px;transition:border-color .18s,box-shadow .18s,transform .18s}
.zual-control:focus-within{border-color:var(--zual-primary);box-shadow:0 0 0 4px color-mix(in srgb,var(--zual-primary) 13%,transparent)}
.zual-control>svg{width:19px;height:19px;fill:none;stroke:#98a2b3;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:0 0 19px;margin-right:10px}
.zual-control input{min-width:0;flex:1;height:100%;border:0!important;outline:0!important;background:transparent!important;box-shadow:none!important;color:var(--zual-text)!important;font:inherit!important;font-size:16px!important;padding:0!important;margin:0!important}
.zual-control input:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px #fff inset!important;-webkit-text-fill-color:var(--zual-text)!important}
.zual-password-toggle{width:36px;height:36px;border:0;background:transparent;border-radius:8px;display:grid;place-items:center;cursor:pointer;color:var(--zual-primary);padding:0;margin-left:6px}
.zual-password-toggle:hover{background:#f2f4f7}
.zual-password-toggle svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.zual-eye-closed{display:none}
.zual-password-toggle.is-visible .zual-eye-open{display:none}
.zual-password-toggle.is-visible .zual-eye-closed{display:block}
.zual-form-options{min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 0 1px}
.zual-form-options>a{color:var(--zual-primary);font-size:12px;font-weight:750;text-decoration:none;text-align:right}
.zual-form-options>a:hover{text-decoration:underline}
.zual-checkbox{display:flex;align-items:center;gap:8px;color:var(--zual-muted);font-size:12px;font-weight:650;cursor:pointer}
.zual-checkbox input{appearance:none;width:17px;height:17px;border:1px solid #c7cdd6;border-radius:5px;background:#fff;margin:0;display:grid;place-items:center;cursor:pointer}
.zual-checkbox input:checked{background:var(--zual-primary);border-color:var(--zual-primary)}
.zual-checkbox input:checked:after{content:"";width:8px;height:4px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg) translate(1px,-1px)}
.zual-submit{width:100%;height:50px;border:0;border-radius:11px;background:var(--zual-primary);color:#fff;display:flex;align-items:center;justify-content:center;gap:12px;font-size:13px;font-weight:900;letter-spacing:.045em;cursor:pointer;box-shadow:0 10px 24px color-mix(in srgb,var(--zual-primary) 20%,transparent);transition:background .18s,transform .18s,box-shadow .18s;margin-top:12px}
.zual-submit:hover{background:var(--zual-primary-hover);transform:translateY(-1px);box-shadow:0 13px 28px color-mix(in srgb,var(--zual-primary) 27%,transparent)}
.zual-submit:active{transform:translateY(0)}
.zual-submit svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .18s}
.zual-submit:hover svg{transform:translateX(3px)}
.zual-footer-text{text-align:center;margin:24px 0 0;color:#98a2b3;font-size:11px;font-weight:650}

@media (min-width:851px) and (max-height:680px){
  .zual-screen{padding:10px;align-items:flex-start}
  .zual-card{height:auto;min-height:min(var(--zual-card-height),calc(100dvh - 20px))}
  .zual-form-side{padding:24px 42px}
  .zual-brand{min-height:56px;margin-bottom:13px}
  .zual-brand img{height:56px}
  .zual-form-head{margin-bottom:20px}
  .zual-form-head p{margin-top:6px}
  .zual-label:not(:first-of-type){margin-top:13px}
  .zual-control{height:46px}
  .zual-form-options{min-height:39px;padding-top:7px}
  .zual-submit{height:47px;margin-top:9px}
  .zual-footer-text{margin-top:17px}
  .zual-visual-copy{bottom:34px}
}

@media(max-width:850px){
  body.zual-login-page{overflow-y:auto}
  .zual-screen{padding:16px;align-items:flex-start}
  .zual-card{width:min(600px,100%);height:auto;min-height:0;grid-template-columns:1fr}
  .zual-visual{height:220px;min-height:220px}
  .zual-visual-copy{left:30px;right:30px;bottom:27px}
  .zual-visual-copy h1{font-size:31px;max-width:430px}
  .zual-visual-copy p{font-size:16px}
  .zual-form-side{height:auto;overflow:visible;padding:34px 34px 38px}
  .zual-brand{margin-bottom:17px;min-height:58px}
  .zual-brand img{height:58px;width:min(var(--zual-logo-width),72%)}
  .zual-form-head{margin-bottom:23px}
}

@media(max-width:560px){
  .zual-screen{padding:0;background-image:none!important}
  .zual-card,.zual-card.no-visual{width:100%;min-height:100dvh;border-radius:0;border:0;box-shadow:none}
  .zual-visual{height:170px;min-height:170px}
  .zual-visual-copy{left:22px;right:22px;bottom:20px}
  .zual-kicker{margin-bottom:9px;font-size:9px}
  .zual-kicker:before{width:20px}
  .zual-visual-copy h1{font-size:25px;line-height:1.06}
  .zual-visual-copy p{font-size:14px;margin-top:7px}
  .zual-form-side{padding:27px 20px 32px;align-items:flex-start}
  .zual-form-inner{width:100%;max-width:430px}
  .zual-brand{min-height:52px;margin-bottom:14px}
  .zual-brand img{height:52px;width:min(var(--zual-logo-width),68vw);transform:translateX(clamp(-30px,var(--zual-logo-offset),30px))}
  .zual-form-head{margin-bottom:21px}
  .zual-form-head h2{font-size:24px}
  .zual-form-head p{font-size:13px}
  .zual-control{height:49px}
  .zual-form-options{align-items:center;gap:12px}
  .zual-form-options>a{max-width:54%}
  .zual-footer-text{margin-top:22px}
}

@media(max-width:380px){
  .zual-visual{height:145px;min-height:145px}
  .zual-visual-copy p,.zual-kicker{display:none}
  .zual-form-side{padding-inline:16px}
  .zual-form-options{align-items:flex-start;flex-direction:column;gap:10px;padding:12px 0}
  .zual-form-options>a{max-width:none;text-align:left}
}

@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.zual-submit,.zual-control,.zual-submit svg{transition:none!important}}