/* The maker's plate is part of the casing; its green seam is decorative. */
.side{padding-top:0}
.side .brand,.login .brand{
  position:relative;isolation:isolate;display:block;
  padding:25px 29px 26px;
  background:linear-gradient(125deg,#f5f7ef 12%,#e4ebdf 68%,#cfdbcd);
  color:#172a20;
  clip-path:polygon(0 0,100% 0,100% calc(100% - 19px),calc(100% - 19px) 100%,0 100%);
  box-shadow:inset 0 1px #ffffff,inset -1px 0 #a7b8a6,inset 0 -1px #a7b8a6;
}
.side .brand{margin:0 -17px 26px}
.side .brand:before,.login .brand:before{
  content:'';position:absolute;top:15px;right:17px;width:27px;height:5px;
  background:repeating-linear-gradient(90deg,#6b8066 0 2px,transparent 2px 6px);
  opacity:.55;pointer-events:none;
}
.side .brand:after,.login .brand:after{
  content:'';position:absolute;left:29px;right:29px;bottom:0;height:3px;
  background:linear-gradient(90deg,#2a6c3c 0 22%,#8acb4f 22% 78%,#b8df8b 78%);
  box-shadow:0 -1px #fff8;pointer-events:none;
}
.side .brand img,.login .brand img{
  display:block;width:182px;max-width:100%;height:auto;
  margin:0 0 10px;padding:0;border-radius:0;background:none;
  mix-blend-mode:multiply;
}
.side .brand-name,.login .brand-name{
  display:flex;align-items:baseline;gap:7px;margin:0;padding-top:14px;
  border-top:1px solid #bac9b6;
  color:#172a20;font-size:19px;letter-spacing:-.65px;line-height:1.3;
}
.side .brand-name span,.login .brand-name span{color:#3b7a3c;padding:0;font-weight:500}
.side .brand-caption,.login .brand-caption{
  margin-top:6px;color:#4e634f;font-size:9px;letter-spacing:.1px;line-height:1.5;
}
.login .brand{margin:-36px -36px 28px;padding:27px 36px 25px}
.login .brand img{width:204px}
.login .brand:after{left:36px;right:36px}
.login .brand-name{justify-content:flex-start;font-size:21px}
.login .brand+.eyebrow{margin-top:0}
@media(max-width:1180px) and (min-width:761px){
  .side{padding-top:0}
  .side .brand{margin:0 -12px 26px;padding:25px 21px}
  .side .brand:after{left:21px;right:21px}
  .side .brand-name{font-size:18px;gap:6px}
  .side .brand-caption{font-size:8px}
}
@media(max-width:760px){
  .side{padding-top:0}
  .side .brand{
    margin:0 -16px 12px;padding:18px 22px 19px;
    display:grid;grid-template-columns:minmax(0,122px) minmax(0,1fr);
    gap:3px 20px;align-items:center;
    clip-path:polygon(0 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%);
  }
  .side .brand img{grid-row:1/3;width:122px;margin:0}
  .side .brand-name{border:0;padding:0;font-size:17px;gap:5px;align-self:end;white-space:nowrap}
  .side .brand-caption{font-size:8px;line-height:1.4;margin:0;align-self:start}
  .side .brand:before{top:8px;right:11px;width:15px;height:3px}
  .side .brand:after{left:22px;right:22px;height:2px}
  .login .brand{display:block;margin:-28px -24px 25px;padding:22px 24px 24px}
  .login .brand img{width:183px}
  .login .brand-name{font-size:20px;margin:0}
  .login .brand-caption{margin-top:6px;font-size:9px}
  .login .brand:after{left:24px;right:24px}
}
@media(max-width:360px){
  .side .brand{grid-template-columns:104px minmax(0,1fr);gap:3px 14px;padding-inline:17px}
  .side .brand-name{font-size:15px;gap:4px}
  .side .brand-caption{font-size:7px}
}
@media(forced-colors:active){
  .side .brand,.login .brand{background:Canvas;color:CanvasText;clip-path:none;border-bottom:2px solid CanvasText}
  .side .brand-name,.login .brand-name,.side .brand-caption,.login .brand-caption{color:CanvasText}
  .side .brand img,.login .brand img{background:#fff;mix-blend-mode:normal;forced-color-adjust:none}
}
