/* SYSLOCK HERO - align to approved desktop screenshot */
body.light-palette .hero {
  height: 100svh !important;
  min-height: 790px !important;
  overflow: hidden !important;
}
body.light-palette .hero > .wrap {
  transform: translateY(-17px) !important;
}
body.light-palette .hero h1 {
  max-width: 740px !important;
  font-size: clamp(44px, 4.4vw, 66px) !important;
  line-height: 1.10 !important;
  margin: 29px 0 31px !important;
}
body.light-palette .hero p {
  max-width: 770px !important;
  font-size: clamp(14px, 1.12vw, 16px) !important;
  line-height: 1.7 !important;
}
body.light-palette .hero .actions {
  margin-top: 37px !important;
  gap: 28px !important;
}
body.light-palette .hero .hero-foot {
  bottom: 0 !important;
  padding-bottom: 29px !important;
  width: 100%;
  pointer-events: none;
}
body.light-palette .hero .hero-foot .wrap {
  border-top: 1px solid rgba(235,221,244,.32) !important;
  padding-top: 22px !important;
  font-size: 10px !important;
  letter-spacing: .12em;
  line-height: 1.5;
  transform: none !important;
}
@media(max-width: 760px) {
  body.light-palette .hero {height: 100svh !important; min-height: 760px !important}
  body.light-palette .hero > .wrap {transform: translateY(-12px) !important}
  body.light-palette .hero h1 {font-size: clamp(40px, 7vw, 56px) !important}
  body.light-palette .hero .hero-foot .wrap {font-size: 9px !important}
}
@media(max-width: 520px) {
  body.light-palette .hero {min-height: 760px !important}
  body.light-palette .hero h1 {font-size: 40px !important}
  body.light-palette .hero .hero-foot {padding-bottom: 16px !important}
  body.light-palette .hero .hero-foot .wrap {padding-top: 14px !important;padding-right: 95px !important}
}