.login-page {
  --canvas:#f6f3ed;
  background:var(--canvas);
  padding:40px clamp(24px,5vw,88px) 24px;
  min-height:100vh;
  display:flex;
  flex-direction:column;
  color:#172332
}
.login-masthead {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding-bottom:24px;
  border-bottom:1px solid #d7d6d1
}
.login-masthead .s2k-logo {
  width:124px;
  height:auto
}
.login-masthead>span {
  font-size:11px;
  font-weight:650;
  letter-spacing:.15em
}
.login-masthead>span span {
  padding:0 12px;
  color:#d51a38
}
.login-shell {
  display:grid;
  grid-template-columns:minmax(0,1.5fr) minmax(320px,.85fr);
  gap:clamp(32px,6vw,100px);
  width:100%;
  max-width:1440px;
  margin:auto;
  padding:54px 0;
  align-items:center
}
.login-editorial>.eyebrow {
  max-width:none;
  font-size:10px;
  letter-spacing:.15em;
  line-height:1.8;
  margin:0 0 28px
}
.login-editorial h1 {
  font-size:clamp(36px,4.4vw,66px);
  letter-spacing:-.058em;
  line-height:1.04;
  margin:0;
  max-width:860px;
  font-weight:720
}
.login-editorial h1>span {
  font-family:Georgia,'Times New Roman',serif;
  font-style:italic;
  font-weight:400;
  letter-spacing:-.052em;
  color:#b91432
}
.login-panel {
  padding:40px 36px;
  background:#fff;
  border-radius:4px 36px 4px 4px;
  border-top:3px solid #172332;
  box-shadow:0 18px 55px #17233208
}
.login-panel-heading {
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:22px
}
.login-panel-heading p {
  margin:0;
  font-size:10px
}
.login-mark {
  width:7px;
  height:7px;
  background:#d51a38;
  border-radius:50%
}
.login-panel h2 {
  font-size:30px;
  letter-spacing:-.05em;
  margin:0 0 32px
}
.login-panel label {
  font-size:14px
}
.login-panel .field input {
  background:#faf9f6;
  border-color:#d7d6d1;
  min-height:52px;
  border-radius:6px
}
.login-panel .stack {
  gap:18px
}
.login-panel .button {
  min-height:54px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  border-radius:6px;
  width:100%;
  margin-top:12px
}
.login-help {
  margin:32px 0 0;
  padding-top:22px;
  border-top:1px solid #e4e1da;
  font-size:13px;
  line-height:1.8
}
.login-help span {
  color:#626978
}
.login-footer {
  display:flex;
  justify-content:space-between;
  gap:24px;
  font-size:11px;
  color:#626978;
  border-top:1px solid #d7d6d1;
  padding-top:20px
}
.has-visual .login-editorial h1 {
  font-size:clamp(36px,3.9vw,58px)
}
@media(max-width:900px) {
  .login-page {
    padding:24px
  }
  .login-shell {
    grid-template-columns:minmax(0,1fr) minmax(290px,1fr);
    gap:28px;
    padding:40px 0
  }
  .login-panel {
    padding:28px 24px
  }
  .login-editorial h1,.has-visual .login-editorial h1 {
    font-size:38px
  }
  .login-masthead>span {
    font-size:9px
  }
  .editorial-break {
    display:none
  }
}
@media(max-width:650px) {
  .login-page {
    padding:22px 20px;
    min-height:100svh
  }
  .login-masthead {
    padding-bottom:18px
  }
  .login-masthead .s2k-logo {
    width:96px
  }
  .login-masthead>span {
    max-width:115px;
    text-align:right;
    line-height:1.8
  }
  .login-masthead>span span {
    padding:0 4px
  }
  .login-shell {
    display:flex;
    flex-direction:column;
    gap:28px;
    padding:28px 0;
    align-items:stretch
  }
  .login-editorial>.eyebrow {
    font-size:8px;
    margin-bottom:14px;
    max-width:280px
  }
  .login-editorial h1,.has-visual .login-editorial h1 {
    font-size:clamp(32px,8.8vw,46px);
    line-height:1.08
  }
  .login-panel {
    padding:24px;
    border-radius:3px 24px 3px 3px
  }
  .login-panel-heading {
    margin-bottom:12px
  }
  .login-panel h2 {
    font-size:28px;
    margin-bottom:22px
  }
  .login-panel .stack {
    gap:12px
  }
  .login-help {
    margin-top:22px;
    padding-top:18px
  }
  .login-footer {
    font-size:10px;
    padding-top:16px
  }
}
@media(prefers-reduced-motion:reduce) {
  .login-page * {
    animation:none!important;
    transition:none!important;
    scroll-behavior:auto!important
  }
}

/* Immersive canvas: the image covers the entire page, including mobile scroll. */
.login-page { --login-brand:#520057;--login-accent:#be0019;--primary:var(--login-brand);position:relative;isolation:isolate;min-height:100svh;background:var(--login-brand);color:#fff;overflow-x:clip; }
.login-page:before { content:'';position:absolute;inset:0;z-index:-2;background:radial-gradient(ellipse at 12% 20%,#ffffff16,transparent 60%),linear-gradient(125deg,#00000010,#00000065);pointer-events:none; }
.login-backdrop { position:absolute;inset:0;z-index:-3;overflow:hidden; }
.login-backdrop img { width:100%;height:100%;object-fit:cover;filter:saturate(.8); }
.has-visual:before { background:linear-gradient(100deg,color-mix(in srgb,var(--login-brand) 85%,transparent),color-mix(in srgb,var(--login-brand) 30%,transparent)); }
.login-watermark { position:absolute;z-index:-1;bottom:6%;left:-.04em;font-size:clamp(220px,40vw,650px);font-weight:850;letter-spacing:-.10em;line-height:.8;color:#ffffff0d;pointer-events:none; }
.login-masthead { border-color:#ffffff30; }
.login-masthead .s2k-logo { filter:brightness(0) invert(1); }
.login-masthead>span span { color:#ffffff80; }
.login-editorial h1,.has-visual .login-editorial h1 { font-size:clamp(38px,4.5vw,68px); }
.login-editorial h1>span { color:#fff; }
.login-editorial>.eyebrow { color:#fff; }
.login-panel { color:#172332;background:#fffffff5;border-top:4px solid var(--login-accent);box-shadow:0 24px 80px #00000025; }
.login-mark { background:var(--login-accent); }
.login-panel .button-primary { background:var(--login-brand);color:#fff; }
.login-caption { max-width:450px;font-size:13px;line-height:1.6;margin-top:32px;color:#ffffffdb; }
.login-footer { color:#ffffffe6;border-color:#ffffff30; }
@media(max-width:900px) { .login-editorial h1,.has-visual .login-editorial h1 { font-size:38px; } }
@media(max-width:650px) {
 .login-page { padding:22px 20px; }
 .login-editorial h1,.has-visual .login-editorial h1 { font-size:clamp(32px,8.8vw,46px); }
 .login-watermark { bottom:20px;font-size:86vw; }
 .has-visual:before { background:linear-gradient(180deg,color-mix(in srgb,var(--login-brand) 82%,transparent),color-mix(in srgb,var(--login-brand) 55%,transparent)); }
 .login-caption { margin:18px 0 0; }
}
.login-page { align-items:stretch; }
.login-watermark { width:100%;left:0;overflow:hidden; }

.keep-together { white-space:nowrap; }
.login-masthead>span .keep-together { padding:0;color:inherit; }
