/* =====================================================================
   ACCESS HUB + PORTAL SIGN-IN
   The page uses the global Lestate Real canvas, shell, typography and
   ruled layout language. No separate application chrome or decoration.
   ===================================================================== */

/* ACCESS HUB */
.portal-hero{padding-bottom:68px}
.portal-hero .page-hero-inner{max-width:var(--maxw);align-items:flex-start}
.portal-hero h1{max-width:12ch;text-wrap:balance}
.portal-hero .lead{max-width:54ch}

.workspace-section{padding-bottom:120px}
.workspace-list{border-top:1px solid var(--ink-5)}
.workspace-row{
  position:relative;
  display:grid;
  grid-template-columns:44px minmax(170px,230px) minmax(240px,1fr) minmax(150px,200px);
  align-items:center;gap:28px;
  min-height:146px;padding:28px 4px;
  border-bottom:1px solid var(--hair);
}
.workspace-row::before{
  content:"";position:absolute;left:0;top:-1px;bottom:-1px;width:2px;
  background:var(--blue-accent);
  transform:scaleY(0);transform-origin:center;
  transition:transform .42s var(--ease);
}
.workspace-number{
  align-self:start;padding-top:7px;
  font-size:10px;font-weight:700;letter-spacing:1.5px;color:var(--ink-4);
  font-variant-numeric:tabular-nums;
  transition:color .25s ease;
}
.workspace-mark{display:flex;align-items:center;height:58px}
.workspace-mark img{
  width:auto;max-width:100%;object-fit:contain;object-position:left center;
  transition:opacity .25s ease;
}
.workspace-mark-realaize img{height:29px}
.workspace-mark-werkr img{height:32px}
.workspace-mark-investors img{height:57px}
.workspace-copy{display:flex;flex-direction:column;gap:7px}
.workspace-copy strong{font-size:15px;line-height:1.3;letter-spacing:-.2px;color:var(--ink-1)}
.workspace-copy span{max-width:42ch;font-size:13px;line-height:1.55;color:var(--ink-3)}
.workspace-destination{display:flex;align-items:center;justify-content:flex-end;text-align:right}
.workspace-destination>span{
  display:inline-flex;align-items:center;gap:8px;
  font-size:12.5px;font-weight:700;color:var(--blue-accent);
}
.workspace-destination svg{
  width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.9;
  stroke-linecap:round;stroke-linejoin:round;
  transition:transform .35s var(--ease);
}
.workspace-support{
  display:flex;align-items:baseline;justify-content:space-between;gap:24px;
  padding:22px 4px 0;
}
.workspace-support p{margin:0;font-size:12.5px;line-height:1.55;color:var(--ink-3)}
.workspace-support a{font-size:12.5px;font-weight:700;color:var(--blue-accent);white-space:nowrap}

/* SIGN-IN PAGES */
.signin-main{min-height:calc(100dvh - 343px)}
.signin-page{padding:158px 0 118px}
.signin-back{
  display:inline-flex;align-items:center;gap:7px;margin-bottom:54px;
  font-size:12px;font-weight:700;color:var(--blue-accent);
}
.signin-back svg{
  width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round;
  transition:transform .35s var(--ease);
}
.signin-layout{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(390px,500px);
  gap:clamp(64px,9vw,120px);align-items:start;
}
.signin-intro{display:flex;flex-direction:column;align-items:flex-start;max-width:620px}
.signin-intro .eyebrow{margin-bottom:24px}
.signin-mark{display:flex;align-items:center;height:62px;margin-bottom:38px}
.signin-mark img{width:auto;max-width:100%;object-fit:contain;object-position:left center}
.signin-mark-realaize img{height:38px}
.signin-mark-werkr img{height:41px}
.signin-mark-investors img{height:62px}
.signin-intro h1{
  margin:0;max-width:10ch;
  font-size:clamp(42px,5.6vw,68px);font-weight:700;
  letter-spacing:-2.7px;line-height:1.01;text-wrap:balance;
}
.signin-intro .lead{margin-top:22px;font-size:16px;max-width:48ch}

.signin-form-panel{border-top:1px solid var(--ink-5);padding-top:26px}
.signin-form-head{margin-bottom:27px}
.signin-form-head h2{font-size:28px;letter-spacing:-.7px}
.signin-form-head p{margin:10px 0 0;font-size:13px;line-height:1.55;color:var(--ink-3);max-width:42ch}
.signin-form{display:flex;flex-direction:column;gap:17px}
.signin-form .field{gap:8px}
.signin-form .field input{min-height:50px}
.password-field{position:relative}
.password-field input{padding-right:52px}
.password-toggle{
  position:absolute;right:5px;top:50%;transform:translateY(-50%);
  width:40px;height:40px;display:grid;place-items:center;
  border:0;border-radius:10px;background:transparent;color:var(--ink-3);cursor:pointer;
  transition:color .2s ease,background .2s ease;
}
.password-toggle svg{
  width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round;
}
.password-toggle .eye-off{display:none}
.password-toggle[aria-pressed="true"] .eye-on{display:none}
.password-toggle[aria-pressed="true"] .eye-off{display:block}
.signin-form-row{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:-1px}
.remember{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--ink-2);cursor:pointer}
.remember input{width:15px;height:15px;margin:0;accent-color:var(--blue-accent)}
.signin-help{font-size:12px;font-weight:700;color:var(--blue-accent)}
.signin-submit{margin-top:3px;min-height:49px}
.signin-error{
  display:flex;align-items:flex-start;gap:8px;margin:0;
  font-size:12.5px;line-height:1.45;font-weight:700;color:var(--red);
}
.signin-error svg{
  width:16px;height:16px;flex:none;margin-top:1px;
  fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;
}
.investor-signin{padding:0 0 110px}
.investor-signin-title{
  margin:0;max-width:11ch;
  font-size:clamp(36px,4.6vw,56px);font-weight:700;
  letter-spacing:-2px;line-height:1.03;text-wrap:balance;
}
.investor-capital{padding-top:0}

@media (hover:hover){
  .workspace-row:hover::before{transform:scaleY(1)}
  .workspace-row:hover .workspace-number{color:var(--blue-accent)}
  .workspace-row:hover .workspace-destination svg{transform:translateX(4px)}
  .workspace-support a:hover,.signin-help:hover{opacity:.7}
  .signin-back:hover svg{transform:translateX(-3px)}
  .password-toggle:hover{color:var(--ink-1);background:var(--grey-100)}
}

@media (max-width:960px){
  .portal-hero{padding-bottom:54px}
  .workspace-row{
    grid-template-columns:32px minmax(150px,190px) minmax(0,1fr);
    gap:18px 24px;
  }
  .workspace-destination{grid-column:3;justify-content:flex-start;text-align:left}

  .signin-main{min-height:0}
  .signin-page{padding:126px 0 88px}
  .investor-signin{padding-top:0}
  .signin-back{margin-bottom:42px}
  .signin-layout{grid-template-columns:1fr;gap:54px}
  .signin-intro{max-width:720px}
  .signin-intro h1{max-width:13ch}
  .signin-form-panel{max-width:560px;width:100%}

  /* On the investor route the retained investment story is additional
     context. A phone therefore presents the sign-in first; otherwise the
     primary action would sit several screens below the opening copy. */
  .investor-access-page #main{display:flex;flex-direction:column}
  .investor-access-page .investor-signin{order:1;padding-top:126px}
  .investor-access-page .page-hero{order:2;padding-top:64px}
  .investor-access-page .investor-capital{order:3}
}

@media (max-width:640px){
  .workspace-section{padding-bottom:88px}
  .workspace-row{
    grid-template-columns:26px minmax(0,1fr) auto;
    gap:9px 14px;min-height:0;padding:24px 0;
  }
  .workspace-number{grid-row:1 / 3;padding-top:5px}
  .workspace-mark{grid-column:2;height:46px}
  .workspace-mark-realaize img{height:24px}
  .workspace-mark-werkr img{height:27px}
  .workspace-mark-investors img{height:45px}
  .workspace-copy{grid-column:2 / 4}
  .workspace-copy strong{font-size:14px}
  .workspace-copy span{font-size:12px}
  .workspace-destination{grid-column:3;grid-row:1;align-self:center}
  .workspace-destination>span{font-size:0;gap:0}
  .workspace-destination svg{width:20px;height:20px}
  .workspace-support{flex-direction:column;gap:8px;padding-top:19px}

  .signin-page{padding:120px 0 76px}
  .investor-signin{padding-top:0}
  .signin-back{margin-bottom:34px}
  .signin-intro .eyebrow{margin-bottom:20px}
  .signin-mark{height:50px;margin-bottom:29px}
  .signin-mark-realaize img{height:30px}
  .signin-mark-werkr img{height:32px}
  .signin-mark-investors img{height:50px}
  .signin-intro h1{font-size:clamp(37px,11vw,52px);letter-spacing:-2px}
  .signin-intro .lead{font-size:15px;margin-top:18px}
  .signin-layout{gap:44px}
  .signin-form-panel{padding-top:23px}
  .signin-form-head h2{font-size:25px}
  .investor-signin{padding-bottom:88px}
  .investor-signin-title{font-size:clamp(34px,10vw,46px);letter-spacing:-1.7px}
  .investor-access-page .investor-signin{padding-top:120px}
  .investor-access-page .page-hero{padding-top:56px}
}

@media (max-width:390px){
  .signin-form-row{align-items:flex-start}
  .remember{max-width:120px}
  .signin-help{text-align:right}
}

@media (prefers-reduced-motion:reduce){
  .workspace-row::before,.workspace-destination svg,.signin-back svg{transition:none}
}