*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
:root{
  --sage:#4a7c59;--sage2:#3a6347;--sage3:#2a4a35;
  --sage-l:#edf5f0;--sage-m:#b5d9c2;
  --sand:#f5f0e8;--sand2:#ede5d4;--sand3:#ddd0b8;
  --stone:#faf9f7;--white:#ffffff;
  --ink:#1a1a1a;--ink2:#4a4a4a;--ink3:#8a8a8a;
  --coral:#e85d3a;
  --gold:#c9972a;--gold-l:#fdf6e3;
  --border:rgba(0,0,0,0.07);--border2:rgba(0,0,0,0.12);
  --r:8px;--r-lg:14px;--r-xl:20px;
}
html{scroll-behavior:smooth;}
body{font-family:'DM Sans',sans-serif;color:var(--ink);background:var(--stone);-webkit-font-smoothing:antialiased;font-size:16px;line-height:1.6;min-height:100vh;}
h1,h2,h3{font-family:'DM Serif Display',serif;line-height:1.12;}
a{color:inherit;text-decoration:none;}
button{font-family:'DM Sans',sans-serif;cursor:pointer;}

@keyframes riseIn{from{opacity:0;transform:translateY(22px);}to{opacity:1;transform:translateY(0);}}
@keyframes fadeIn{from{opacity:0;}to{opacity:1;}}
@keyframes drift{0%{transform:translate(0,0) scale(1);}100%{transform:translate(-40px,35px) scale(1.1);}}

/* — LAYOUT — */
.page{display:grid;grid-template-columns:1fr 1fr;min-height:100vh;}
@media(max-width:900px){.page{grid-template-columns:1fr;}.visual-panel{display:none;}}

/* — LEFT: FORM SIDE — */
.form-side{display:flex;flex-direction:column;padding:2rem 2.5rem;position:relative;}
.form-header{display:flex;align-items:center;justify-content:space-between;}
.logo{display:flex;align-items:center;gap:10px;font-family:'DM Serif Display',serif;font-size:1.3rem;color:var(--ink);}
.logo-leaf{width:30px;height:30px;background:var(--sage);border-radius:50% 50% 50% 8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.logo-leaf svg{width:16px;height:16px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.logo em{font-style:italic;color:var(--sage);}
.header-link{font-size:.845rem;color:var(--ink3);}
.header-link a{color:var(--sage);font-weight:600;text-decoration:underline;text-underline-offset:3px;}

.form-wrap{flex:1;display:flex;align-items:center;justify-content:center;padding:3rem 0;}
.form-box{width:100%;max-width:400px;animation:riseIn .6s cubic-bezier(.16,1,.3,1) both .1s;}

.form-title{font-size:2.1rem;color:var(--ink);margin-bottom:.4rem;letter-spacing:-.02em;}
.form-title em{font-style:italic;color:var(--sage);}
.form-sub{font-size:.9rem;color:var(--ink2);margin-bottom:1.75rem;font-weight:300;line-height:1.7;}

/* — AUDIENCE TOGGLE — */
.audience-toggle{display:grid;grid-template-columns:1fr 1fr;background:var(--sand);border:1px solid var(--border);border-radius:14px;padding:5px;gap:4px;margin-bottom:1.75rem;position:relative;}
.at-btn{border:none;background:transparent;border-radius:10px;padding:.7rem .5rem;font-size:.875rem;font-weight:600;color:var(--ink3);transition:color .2s;display:flex;flex-direction:column;align-items:center;gap:.25rem;position:relative;z-index:1;}
.at-btn svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.at-btn.active{color:var(--sage2);}
.at-btn .at-sub{font-size:.62rem;font-weight:500;color:var(--ink3);letter-spacing:.02em;}
.at-btn.active .at-sub{color:var(--sage);}
.at-slider{position:absolute;top:5px;bottom:5px;width:calc(50% - 7px);background:#fff;border-radius:10px;box-shadow:0 2px 12px rgba(0,0,0,.08);transition:left .3s cubic-bezier(.16,1,.3,1);z-index:0;}
.at-slider.pos-0{left:5px;}
.at-slider.pos-1{left:calc(50% + 2px);}

/* — FORM FIELDS — */
.field{margin-bottom:1rem;}
.field label{display:block;font-size:.75rem;font-weight:600;color:var(--ink2);margin-bottom:.35rem;letter-spacing:.02em;}
.field input{width:100%;background:#fff;border:1.5px solid var(--border2);border-radius:11px;padding:.7rem .9rem;font-size:.9rem;font-family:'DM Sans',sans-serif;color:var(--ink);outline:none;transition:border-color .15s,box-shadow .15s;}
.field input:focus{border-color:var(--sage);box-shadow:0 0 0 3px var(--sage-l);}
.field input.error{border-color:var(--coral);}
.field-hint{font-size:.7rem;color:var(--ink3);margin-top:.35rem;line-height:1.5;}
.pw-wrap{position:relative;}
.pw-toggle{position:absolute;right:.75rem;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--ink3);font-size:.72rem;font-weight:600;padding:.25rem;transition:color .15s;}
.pw-toggle:hover{color:var(--sage);}

.form-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.35rem;}
.remember{display:flex;align-items:center;gap:.5rem;font-size:.8rem;color:var(--ink2);cursor:pointer;user-select:none;}
.remember input{width:16px;height:16px;accent-color:var(--sage);cursor:pointer;}
.forgot{font-size:.8rem;font-weight:600;color:var(--sage);transition:color .15s;}
.forgot:hover{color:var(--sage2);text-decoration:underline;text-underline-offset:3px;}

.btn-signin{width:100%;background:linear-gradient(135deg,#5a8f69 0%,var(--sage) 45%,var(--sage2) 100%);color:#fff;font-size:.95rem;font-weight:700;padding:.8rem;border-radius:12px;border:none;letter-spacing:.01em;box-shadow:0 8px 24px rgba(74,124,89,.3);transition:transform .2s,box-shadow .2s;position:relative;overflow:hidden;}
.btn-signin::after{content:'';position:absolute;top:0;left:-80%;width:60%;height:100%;background:linear-gradient(105deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-20deg);transition:left .55s ease;}
.btn-signin:hover{transform:translateY(-2px);box-shadow:0 12px 32px rgba(74,124,89,.42);}
.btn-signin:hover::after{left:130%;}
.btn-signin:active{transform:scale(.99);}
.si-arrow{display:inline-block;transition:transform .25s;margin-left:.35rem;}
.btn-signin:hover .si-arrow{transform:translateX(4px);}

/* — DIVIDER + SSO — */
.divider{display:flex;align-items:center;gap:1rem;margin:1.5rem 0;}
.divider::before,.divider::after{content:'';flex:1;height:1px;background:var(--border2);}
.divider span{font-size:.72rem;color:var(--ink3);font-weight:500;letter-spacing:.04em;}
.sso-row{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;}
.sso-btn{display:flex;align-items:center;justify-content:center;gap:.55rem;background:#fff;border:1.5px solid var(--border2);border-radius:11px;padding:.65rem;font-size:.845rem;font-weight:600;color:var(--ink2);transition:border-color .15s,box-shadow .15s,transform .15s;}
.sso-btn:hover{border-color:var(--sage-m);box-shadow:0 4px 16px rgba(0,0,0,.06);transform:translateY(-1px);}
.sso-btn svg{width:17px;height:17px;flex-shrink:0;}

/* — EMPLOYEE NOTICE — */
.employee-notice{background:var(--gold-l);border:1px solid #f0d080;border-radius:12px;padding:.85rem 1rem;display:flex;gap:.7rem;align-items:flex-start;margin-bottom:1.35rem;}
.en-icon{width:28px;height:28px;border-radius:8px;background:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.en-icon svg{width:14px;height:14px;stroke:var(--gold);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.employee-notice p{font-size:.75rem;color:#7a5a0a;line-height:1.55;}
.employee-notice strong{font-weight:700;}

/* Form panels swap */
.form-panel{display:none;}
.form-panel.active{display:block;animation:fadeIn .35s ease both;}

.form-footer{font-size:.78rem;color:var(--ink3);text-align:center;padding-top:1rem;}
.form-footer a{color:var(--sage);font-weight:600;}
.form-footer a:hover{text-decoration:underline;text-underline-offset:3px;}

.bottom-links{display:flex;gap:1.5rem;justify-content:center;font-size:.72rem;color:var(--ink3);padding-top:.5rem;}
.bottom-links a:hover{color:var(--ink2);}

/* — RIGHT: VISUAL PANEL — */
.visual-panel{background:
  radial-gradient(ellipse 600px 420px at 85% 12%, rgba(181,217,194,.13) 0%, transparent 55%),
  radial-gradient(ellipse 500px 380px at 8% 92%, rgba(201,151,42,.1) 0%, transparent 55%),
  linear-gradient(145deg,#2a4a35 0%,#1c3524 55%,#243f2e 100%);
  position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:4rem 3rem;}
.visual-panel::before{content:'';position:absolute;width:460px;height:460px;border-radius:50%;background:radial-gradient(circle,rgba(181,217,194,.09) 0%,transparent 70%);top:-160px;right:-120px;animation:drift 14s ease-in-out infinite alternate;pointer-events:none;}

.vp-content{position:relative;z-index:1;max-width:420px;width:100%;}
.vp-panel{display:none;}
.vp-panel.active{display:block;animation:fadeIn .4s ease both;}
.vp-quote{font-family:'DM Serif Display',serif;font-style:italic;font-size:1.45rem;color:#fff;line-height:1.5;margin-bottom:1.25rem;}
.vp-author{font-size:.845rem;color:rgba(255,255,255,.55);margin-bottom:2.5rem;}
.vp-author strong{color:#fff;font-weight:600;}

/* mini mockup card */
.vp-card{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:1.4rem;backdrop-filter:blur(8px);}
.vp-card-title{font-size:.72rem;font-weight:700;color:rgba(255,255,255,.5);letter-spacing:.07em;text-transform:uppercase;margin-bottom:.85rem;}
.vp-row{display:flex;align-items:center;gap:.7rem;padding:.55rem .7rem;background:rgba(255,255,255,.06);border-radius:10px;margin-bottom:.45rem;}
.vp-av{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.58rem;font-weight:700;flex-shrink:0;background:rgba(255,255,255,.15);color:#fff;}
.vp-name{flex:1;font-size:.78rem;font-weight:600;color:rgba(255,255,255,.9);}
.vp-amt{font-size:.78rem;font-weight:700;color:#fff;}
.vp-tag{font-size:.6rem;font-weight:700;padding:.14rem .5rem;border-radius:99px;background:rgba(74,222,128,.18);color:#4ade80;}
.vp-doc-row{display:flex;align-items:center;gap:.7rem;padding:.6rem .7rem;background:rgba(255,255,255,.06);border-radius:10px;margin-bottom:.45rem;}
.vp-doc-icon{width:30px;height:30px;border-radius:8px;background:rgba(255,255,255,.12);display:flex;align-items:center;justify-content:center;font-size:.58rem;font-weight:800;color:#fff;flex-shrink:0;}
.vp-doc-name{flex:1;font-size:.78rem;font-weight:600;color:rgba(255,255,255,.9);}
.vp-dl{font-size:.62rem;font-weight:700;padding:.2rem .6rem;border-radius:6px;background:rgba(181,217,194,.2);color:var(--sage-m);}
.vp-stats{display:flex;gap:2rem;margin-top:2.5rem;}
.vp-stat-num{font-family:'DM Serif Display',serif;font-size:1.5rem;color:#fff;line-height:1;}
.vp-stat-lbl{font-size:.68rem;color:rgba(255,255,255,.4);margin-top:.2rem;}