/* Kontor Systems — consolidated website styles. */
/* Extracted from page-level CSS during the 2026 professional refactor. */

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  background: #FFFFFF;
  color: #1A1614;
  font-family: "IBM Plex Sans", system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
}

a {
  color: #8C0606;
  text-decoration: none;
}

a:hover {
  color: #B01818;
}

::selection {
  background: #8C0606;
  color: #fff;
}

@keyframes ksPulse {
  0%,100% {
    opacity: 1;
  }

  50% {
    opacity: 0.35;
  }

}

@keyframes ksFloat {
  0%,100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-7px);
  }

}

input, textarea {
  font-family: inherit;
}

input::placeholder, textarea::placeholder {
  color: #B8B0AC;
}

@media (max-width: 1020px) {
  .ks-hero {
    grid-template-columns: 1fr !important;
    gap: 40px !important;
    padding-top: 48px !important;
    padding-bottom: 56px !important;
  }

  .ks-2col {
    grid-template-columns: 1fr !important;
    gap: 36px !important;
  }

  .ks-cta {
    grid-template-columns: 1fr !important;
    gap: 28px !important;
    padding: 36px 28px !important;
  }

  .ks-cta > div:last-child {
    text-align: left !important;
  }

  .ks-g3, .ks-g4 {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  .ks-footgrid {
    grid-template-columns: 1fr !important;
    gap: 26px !important;
  }

}

@media (max-width: 700px) {
  .ks-headbar {
    flex-wrap: wrap !important;
    gap: 10px 12px !important;
    padding: 12px 16px !important;
  }

  .ks-nav {
    order: 3;
    width: 100%;
    margin-left: 0 !important;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  .ks-nav::-webkit-scrollbar {
    display: none;
  }

  .ks-nav a {
    white-space: nowrap;
  }

  h1 {
    font-size: 34px !important;
    line-height: 1.12 !important;
  }

  h2 {
    font-size: 26px !important;
  }

  .ks-g3 {
    grid-template-columns: 1fr !important;
  }

  .ks-wf {
    grid-template-columns: 1fr !important;
    gap: 26px !important;
  }

  .ks-wf span[style*="height: 2px"], .ks-wf span[style*="height:2px"] {
    display: none !important;
  }

  .ks-modtile {
    flex-direction: column !important;
  }

  .ks-modrail {
    width: auto !important;
    border-right: none !important;
    border-bottom: 1px solid #F1DCDC !important;
  }

}

@media (max-width: 460px) {
  .ks-g4 {
    grid-template-columns: 1fr !important;
  }

}

.ks-mobile-toggle {
  display:none;
}

@media (max-width: 700px) {
  .ks-mobile-toggle {
    margin-left:auto;
    width:38px;
    height:38px;
    border-radius:8px;
    border:1px solid #EBCFCF;
    background:#FFFFFF;
    color:#8C0606;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:4px;
    padding:0;
    cursor:pointer;
    flex-shrink:0;
  }

  .ks-mobile-toggle span {
    width:18px;
    height:2px;
    border-radius:2px;
    background:currentColor;
    display:block;
  }

  .ks-headbar > a[href="kontakt.html"] {
    display:none !important;
  }

  .ks-headbar {
    position:relative !important;
  }

  .ks-headbar .ks-nav {
    display:none !important;
    position:absolute;
    top:calc(100% + 8px);
    left:16px;
    right:16px;
    width:auto !important;
    margin-left:0 !important;
    padding:12px;
    border:1px solid #F1DCDC;
    border-radius:14px;
    background:#FFFFFF;
    box-shadow:0 18px 45px rgba(26,22,20,0.12);
    flex-direction:column;
    gap:6px;
    overflow:visible !important;
    z-index:80;
  }

  .ks-headbar.ks-menu-open .ks-nav {
    display:flex !important;
  }

  .ks-headbar .ks-nav a {
    display:block !important;
    width:100%;
    padding:12px 14px !important;
    border-radius:10px !important;
    white-space:normal !important;
  }

  .ks-headbar .ks-nav a.ks-nav-contact {
    background:#8C0606 !important;
    color:#FFFFFF !important;
    text-align:center !important;
    font-weight:600 !important;
    box-shadow:0 8px 18px rgba(140,6,6,0.18) !important;
  }

  div[style*="font-size:38px"][style*="line-height:1"][style*="color:#8C0606"],   span[style*="font-family:'IBM Plex Mono'"][style*="flex-shrink:0"] {
    text-align:center !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }

  div[style*="display:flex"][style*="align-items:center"][style*="margin-bottom:18px"]:has(> span[style*="border-radius:50%"]),   div[style*="display:flex"][style*="align-items:center"][style*="margin-bottom:18px"]:has(> span[style*="border-radius:10px"]) {
    justify-content:center !important;
  }

  .ks-wf > div {
    text-align:center !important;
  }

  .ks-wf > div > div:first-child {
    width:100% !important;
    display:flex !important;
    justify-content:center !important;
  }

  .ks-wf > div > div:first-child > span[style*="border-radius:50%"] {
    margin-left:auto !important;
    margin-right:auto !important;
  }

}

.ks-page {
  display: block;
}

@media (min-width: 701px) {
  .ks-headbar {
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 14px !important;
  }

  .ks-headbar > a:first-child {
    flex: 0 0 auto !important;
  }

  .ks-headbar .ks-nav {
    order: initial !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 4px !important;
    width: auto !important;
    margin-left: auto !important;
    overflow: visible !important;
    flex: 0 1 auto !important;
  }

  .ks-headbar .ks-nav a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 38px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
  }

  .ks-headbar .ks-nav a[href="kontakt.html"] {
    display: none !important;
  }

  .ks-headbar > a[href="kontakt.html"] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 38px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    flex: 0 0 auto !important;
    margin-left: 6px !important;
  }

  .ks-headbar > a[aria-label="Login"] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 38px !important;
    flex: 0 0 auto !important;
  }

}

.ks-page {
  display:block!important;
}

.ks-grid-card {
  isolation: isolate;
}

.ks-grid-card > .ks-grid-bg-symbol {
  z-index: 0;
  pointer-events: none;
  user-select: none;
}

.ks-grid-card > :not(.ks-grid-bg-symbol) {
  position: relative;
  z-index: 1;
}

@media (min-width: 701px) {
  .ks-headbar .ks-nav a.ks-nav-login {
    display: none !important;
  }

}

@media (max-width: 700px) {
  .ks-headbar > a[aria-label="Login"] {
    display: none !important;
  }

  .ks-headbar .ks-nav {
    max-height: calc(100vh - 100px);
    overflow-y: auto !important;
  }

  .ks-headbar .ks-nav a.ks-nav-login {
    border: 1px solid #EBCFCF !important;
    background: #FBF3F3 !important;
    color: #8C0606 !important;
    text-align: center !important;
    font-weight: 600 !important;
  }

  .ks-grid-card {
    overflow: hidden !important;
    padding-right: 24px !important;
  }

  .ks-grid-card > .ks-grid-bg-symbol {
    right: 12px !important;
    top: 8px !important;
    transform: none !important;
    font-size: 52px !important;
    line-height: 1 !important;
    opacity: 0.5 !important;
  }

}

html, body {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
}

body {
  min-width: 0 !important;
}

*, *::before, *::after {
  min-width: 0;
}

img, svg, video, canvas {
  max-width: 100%;
  height: auto;
}

.ks-page, main, header, footer, section {
  max-width: 100% !important;
}

h1, h2, h3, h4, p, a, span, li {
  overflow-wrap: break-word;
  word-wrap: break-word;
}

.ks-deco-icon {
  display: block !important;
  width: 1em !important;
  height: 1em !important;
  overflow: hidden !important;
  text-indent: -9999px !important;
  color: rgba(140,6,6,0.07) !important;
  opacity: 1 !important;
  pointer-events: none !important;
  user-select: none !important;
  background: transparent !important;
  line-height: 1 !important;
}

.ks-deco-icon::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background: currentColor;
  -webkit-mask: var(--ks-icon) center / contain no-repeat;
  mask: var(--ks-icon) center / contain no-repeat;
}

.ks-deco-letter {
  color: rgba(140,6,6,0.07) !important;
  opacity: 1 !important;
  pointer-events: none !important;
  user-select: none !important;
}

.ks-icon-refresh {
  --ks-icon:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath d=%22M20 6v5h-5%22 fill=%22none%22 stroke=%22black%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E%3Cpath d=%22M19 11a7 7 0 1 0 2 5%22 fill=%22none%22 stroke=%22black%22 stroke-width=%222.2%22 stroke-linecap=%22round%22/%3E%3C/svg%3E");
}

.ks-icon-gear {
  --ks-icon:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%223.3%22 fill=%22none%22 stroke=%22black%22 stroke-width=%222%22/%3E%3Cpath d=%22M12 2.5v3M12 18.5v3M4.8 4.8l2.1 2.1M17.1 17.1l2.1 2.1M2.5 12h3M18.5 12h3M4.8 19.2l2.1-2.1M17.1 6.9l2.1-2.1%22 fill=%22none%22 stroke=%22black%22 stroke-width=%222.2%22 stroke-linecap=%22round%22/%3E%3C/svg%3E");
}

.ks-icon-flag {
  --ks-icon:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath d=%22M6 21V4m0 0h11l-2 4 2 4H6%22 fill=%22none%22 stroke=%22black%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E%3C/svg%3E");
}

.ks-icon-phone {
  --ks-icon:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath d=%22M7.2 3.6l2.4 5.2-2.1 1.4c1.2 2.6 3.7 5.1 6.3 6.3l1.4-2.1 5.2 2.4-.8 3.5c-.2.8-.9 1.3-1.7 1.2C9.6 20.7 3.3 14.4 2.5 6.1c-.1-.8.5-1.5 1.2-1.7l3.5-.8z%22 fill=%22none%22 stroke=%22black%22 stroke-width=%222%22 stroke-linejoin=%22round%22/%3E%3C/svg%3E");
}

.ks-icon-document {
  --ks-icon:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath d=%22M6 3h12v18H6z%22 fill=%22none%22 stroke=%22black%22 stroke-width=%222%22/%3E%3Cpath d=%22M8.5 8h7M8.5 12h7M8.5 16h7%22 stroke=%22black%22 stroke-width=%222%22 stroke-linecap=%22round%22/%3E%3C/svg%3E");
}

.ks-icon-diamond {
  --ks-icon:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath d=%22M12 3l9 9-9 9-9-9z%22 fill=%22none%22 stroke=%22black%22 stroke-width=%222.2%22 stroke-linejoin=%22round%22/%3E%3Cpath d=%22M8 12h8M12 8v8%22 stroke=%22black%22 stroke-width=%221.7%22 stroke-linecap=%22round%22/%3E%3C/svg%3E");
}

.ks-icon-mail {
  --ks-icon:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Crect x=%223%22 y=%225%22 width=%2218%22 height=%2214%22 rx=%222%22 fill=%22none%22 stroke=%22black%22 stroke-width=%222%22/%3E%3Cpath d=%22M4 7l8 6 8-6%22 fill=%22none%22 stroke=%22black%22 stroke-width=%222%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E%3C/svg%3E");
}

.ks-icon-at {
  --ks-icon:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%229%22 fill=%22none%22 stroke=%22black%22 stroke-width=%222%22/%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%223.2%22 fill=%22none%22 stroke=%22black%22 stroke-width=%222%22/%3E%3Cpath d=%22M15.2 12v1.2a2.4 2.4 0 0 0 4.7.7%22 fill=%22none%22 stroke=%22black%22 stroke-width=%222%22 stroke-linecap=%22round%22/%3E%3C/svg%3E");
}

.ks-icon-screen {
  --ks-icon:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Crect x=%224%22 y=%224%22 width=%2216%22 height=%2213%22 rx=%221.5%22 fill=%22none%22 stroke=%22black%22 stroke-width=%222%22/%3E%3Cpath d=%22M9 21h6M12 17v4%22 stroke=%22black%22 stroke-width=%222%22 stroke-linecap=%22round%22/%3E%3C/svg%3E");
}

.ks-icon-house {
  --ks-icon:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath d=%22M3 11l9-8 9 8%22 fill=%22none%22 stroke=%22black%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E%3Cpath d=%22M6 10.5V21h12V10.5%22 fill=%22none%22 stroke=%22black%22 stroke-width=%222.2%22 stroke-linejoin=%22round%22/%3E%3C/svg%3E");
}

.ks-icon-building {
  --ks-icon:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Crect x=%224%22 y=%223%22 width=%2216%22 height=%2218%22 fill=%22none%22 stroke=%22black%22 stroke-width=%222%22/%3E%3Cpath d=%22M8 7h2M14 7h2M8 11h2M14 11h2M8 15h2M14 15h2%22 stroke=%22black%22 stroke-width=%222.2%22 stroke-linecap=%22round%22/%3E%3C/svg%3E");
}

.ks-icon-cross {
  --ks-icon:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath d=%22M9 3h6v6h6v6h-6v6H9v-6H3V9h6z%22 fill=%22black%22/%3E%3C/svg%3E");
}

.ks-icon-tools {
  --ks-icon:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath d=%22M5 20l6.5-6.5M14 4l6 6M15.5 5.5L18 3l3 3-2.5 2.5%22 fill=%22none%22 stroke=%22black%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E%3Cpath d=%22M3 7l4-4 3 3-4 4z%22 fill=%22none%22 stroke=%22black%22 stroke-width=%222.2%22 stroke-linejoin=%22round%22/%3E%3Cpath d=%22M6.5 9.5L20 23%22 stroke=%22black%22 stroke-width=%222.2%22 stroke-linecap=%22round%22/%3E%3C/svg%3E");
}

.ks-icon-snow {
  --ks-icon:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath d=%22M12 2v20M4 6l16 12M20 6L4 18%22 stroke=%22black%22 stroke-width=%222%22 stroke-linecap=%22round%22/%3E%3Cpath d=%22M8 4l4 4 4-4M8 20l4-4 4 4M3.5 10.5l5.5 1.5-1.5 5.5M20.5 13.5L15 12l1.5-5.5%22 fill=%22none%22 stroke=%22black%22 stroke-width=%221.6%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E%3C/svg%3E");
}

@media (max-width: 700px) {
  html,   body {
    overflow-x: clip !important;
    max-width: 100vw !important;
    position: relative;
  }

  body {
    touch-action: pan-y !important;
  }

  .ks-page,   main,   header,   footer,   section,   .ks-headbar,   section > div,   main > section,   main > section > div,   div[style*="max-width:1240px"] {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  section,   main,   .ks-page {
    overflow-x: clip !important;
  }

  .ks-headbar {
    padding: 14px 16px !important;
    gap: 10px !important;
    overflow: visible !important;
  }

  .ks-headbar > a:first-child {
    flex: 0 1 auto !important;
    min-width: 0 !important;
    overflow: visible !important;
  }

  .ks-headbar > a:first-child img {
    width: auto !important;
    max-width: 170px !important;
    height: 31px !important;
    object-fit: contain !important;
    object-position: left center !important;
  }

  .ks-mobile-toggle {
    margin-left: auto !important;
    flex: 0 0 38px !important;
  }

  .ks-headbar .ks-nav {
    max-width: calc(100vw - 32px) !important;
    left: 16px !important;
    right: 16px !important;
  }

  section > div[style*="padding:58px 28px"],   section > div[style*="padding:64px 28px"],   section > div[style*="padding:72px 28px"],   section > div[style*="padding:44px 28px"],   section > div[style*="padding:80px 28px"],   section[style*="padding:0 28px"],   section[style*="padding:44px 28px"],   section[style*="padding:60px 28px"],   section[style*="padding:24px 28px"],   div[style*="padding:58px 28px"],   div[style*="padding:64px 28px"],   div[style*="padding:72px 28px"],   div[style*="padding:44px 28px"],   div[style*="padding:80px 28px"] {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }

  h1 {
    font-size: clamp(30px, 8.2vw, 36px) !important;
    line-height: 1.12 !important;
    letter-spacing: -0.02em !important;
    max-width: 100% !important;
    text-align: left !important;
    overflow-wrap: anywhere !important;
    word-break: normal !important;
    hyphens: auto !important;
  }

  h2 {
    font-size: clamp(24px, 6.8vw, 30px) !important;
    line-height: 1.16 !important;
    letter-spacing: -0.015em !important;
    max-width: 100% !important;
    text-align: left !important;
    overflow-wrap: anywhere !important;
    hyphens: auto !important;
  }

  h3 {
    font-size: clamp(20px, 5.8vw, 24px) !important;
    line-height: 1.2 !important;
    max-width: 100% !important;
    overflow-wrap: anywhere !important;
  }

  h4,   p,   li {
    max-width: 100% !important;
    overflow-wrap: anywhere !important;
  }

  p {
    font-size: 16px !important;
    line-height: 1.58 !important;
  }

  .ks-wf > div,   .ks-wf > div h4,   .ks-wf > div p {
    text-align: left !important;
  }

  .ks-wf > div > div:first-child {
    width: 100% !important;
    justify-content: flex-start !important;
    display: flex !important;
  }

  .ks-wf > div > div:first-child > span[style*="border-radius:50%"] {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .ks-wf > div > div:first-child > span[style*="height: 2px"],   .ks-wf > div > div:first-child > span[style*="height:2px"] {
    display: none !important;
  }

  div[style*="font-size:38px"][style*="line-height:1"][style*="color:#8C0606"],   span[style*="font-family:'IBM Plex Mono'"][style*="flex-shrink:0"] {
    text-align: left !important;
    margin-left: 0 !important;
    margin-right: 12px !important;
  }

  .ks-g3,   .ks-g4 {
    grid-template-columns: 1fr !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .ks-g3 > div,   .ks-g4 > div,   .ks-grid-card {
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
    min-height: auto !important;
  }

  .ks-g4 > div {
    padding: 20px 18px !important;
  }

  .ks-g4 > div > div[style*="display:flex"] {
    display: grid !important;
    grid-template-columns: 48px minmax(0, 1fr) !important;
    gap: 12px !important;
    align-items: center !important;
    justify-content: start !important;
    width: 100% !important;
    max-width: 100% !important;
    text-align: left !important;
  }

  .ks-g4 > div > div[style*="display:flex"] > span:first-child {
    grid-column: 1 !important;
    min-width: 0 !important;
    width: 48px !important;
    margin: 0 !important;
    text-align: left !important;
    justify-self: start !important;
  }

  .ks-g4 > div > div[style*="display:flex"] > span:last-child {
    grid-column: 2 !important;
    min-width: 0 !important;
    width: auto !important;
    max-width: 100% !important;
    text-align: left !important;
    justify-self: start !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    line-height: 1.25 !important;
  }

  .ks-g3 > div > div[style*="display:flex"] {
    justify-content: flex-start !important;
    align-items: center !important;
    gap: 12px !important;
    min-width: 0 !important;
    text-align: left !important;
  }

  .ks-g3 > div > div[style*="display:flex"] > span:first-child {
    flex: 0 0 auto !important;
    min-width: 34px !important;
    text-align: left !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .ks-g3 > div > div[style*="display:flex"] > span:last-child {
    min-width: 0 !important;
    flex: 1 1 auto !important;
    text-align: left !important;
  }

  .ks-deco-icon,   .ks-deco-letter,   .ks-grid-bg-symbol,   span[style*="font-size:96px"][style*="color:rgba(140,6,6,0.07)"],   span[style*="font-size:72px"][style*="color:rgba(140,6,6,0.07)"],   span[style*="font-size:120px"][style*="color:rgba(140,6,6,0.06)"] {
    right: 14px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    font-size: 54px !important;
    line-height: 1 !important;
    color: rgba(140,6,6,0.045) !important;
    opacity: 1 !important;
    z-index: 0 !important;
    filter: none !important;
    text-shadow: none !important;
  }

  .ks-grid-card > :not(.ks-deco-icon):not(.ks-deco-letter):not(.ks-grid-bg-symbol),   .ks-g3 > div > :not(.ks-deco-icon):not(.ks-deco-letter),   .ks-g4 > div > :not(.ks-deco-icon):not(.ks-deco-letter) {
    position: relative !important;
    z-index: 1 !important;
  }

  .ks-cta {
    padding: 34px 24px !important;
    max-width: 100% !important;
  }

  .ks-cta h2,   .ks-cta p {
    color: #fff !important;
  }

  a[aria-label="Anrufen"] {
    right: 18px !important;
    bottom: 22px !important;
    width: 56px !important;
    height: 56px !important;
    z-index: 90 !important;
  }

  .ks-cookie-consent {
    left: 12px !important;
    right: 12px !important;
    bottom: calc(12px + env(safe-area-inset-bottom)) !important;
  }

  .ks-cookie-box {
    max-width: 100% !important;
  }

}

@media (max-width: 420px) {
  section > div[style*="padding"],   section[style*="padding"] {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }

  .ks-headbar {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  .ks-headbar > a:first-child img {
    max-width: 150px !important;
    height: 29px !important;
  }

  .ks-g4 > div > div[style*="display:flex"] {
    grid-template-columns: 44px minmax(0, 1fr) !important;
  }

  .ks-g4 > div > div[style*="display:flex"] > span:first-child {
    width: 44px !important;
  }

  .ks-deco-icon,   .ks-deco-letter,   .ks-grid-bg-symbol,   span[style*="font-size:96px"][style*="color:rgba(140,6,6,0.07)"],   span[style*="font-size:72px"][style*="color:rgba(140,6,6,0.07)"] {
    font-size: 48px !important;
    right: 12px !important;
    color: rgba(140,6,6,0.04) !important;
  }

}

*, *::before, *::after {
  box-sizing: border-box !important;
}

img, svg, video, canvas {
  max-width: 100% !important;
  height: auto;
}

.ks-icon-gear {
  --ks-icon:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%223.4%22 fill=%22none%22 stroke=%22black%22 stroke-width=%222%22/%3E%3Cpath d=%22M12 2.5v3M12 18.5v3M4.8 4.8l2.1 2.1M17.1 17.1l2.1 2.1M2.5 12h3M18.5 12h3M4.8 19.2l2.1-2.1M17.1 6.9l2.1-2.1%22 fill=%22none%22 stroke=%22black%22 stroke-width=%222.2%22 stroke-linecap=%22round%22/%3E%3C/svg%3E");
}

.ks-deco-icon {
  display: block !important;
  width: var(--ks-deco-size, 96px) !important;
  height: var(--ks-deco-size, 96px) !important;
  font-size: 0 !important;
  line-height: 0 !important;
  text-indent: 0 !important;
  overflow: hidden !important;
  color: transparent !important;
  pointer-events: none !important;
  user-select: none !important;
  z-index: 0 !important;
}

.ks-deco-icon::before {
  content: "" !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  background: rgba(140, 6, 6, 0.07) !important;
  -webkit-mask: var(--ks-icon) center / contain no-repeat !important;
  mask: var(--ks-icon) center / contain no-repeat !important;
}

.ks-deco-icon[style*="font-size:72px"] {
  --ks-deco-size: 72px;
}

.ks-deco-icon[style*="font-size:84px"] {
  --ks-deco-size: 84px;
}

.ks-deco-icon[style*="font-size:96px"] {
  --ks-deco-size: 96px;
}

.ks-deco-letter {
  color: rgba(140, 6, 6, 0.07) !important;
  font-family: "Space Grotesk", sans-serif !important;
}

.ks-inline-icon {
  font-size: 0 !important;
  line-height: 0 !important;
  text-indent: 0 !important;
  overflow: hidden !important;
  position: relative !important;
}

.ks-inline-icon::before {
  content: "" !important;
  display: block !important;
  width: 24px !important;
  height: 24px !important;
  background: #8C0606 !important;
  -webkit-mask: var(--ks-icon) center / contain no-repeat !important;
  mask: var(--ks-icon) center / contain no-repeat !important;
}

.ks-g3 > div, .ks-g4 > div, .ks-grid-card, div[style*="position:relative"][style*="overflow:hidden"][style*="border:1px solid #F1DCDC"] {
  isolation: isolate !important;
}

.ks-g3 > div > :not(.ks-deco-icon), .ks-g4 > div > :not(.ks-deco-icon), .ks-grid-card > :not(.ks-deco-icon), div[style*="position:relative"][style*="overflow:hidden"][style*="border:1px solid #F1DCDC"] > :not(.ks-deco-icon) {
  position: relative !important;
  z-index: 1 !important;
}

@media (max-width: 700px) {
  html, body {
    width: 100% !important;
    max-width: 100vw !important;
    overflow-x: hidden !important;
  }

  body {
    min-width: 0 !important;
    position: relative !important;
    touch-action: pan-y !important;
  }

  .ks-page,   .ks-page > div,   main,   header,   footer,   section {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  div[style*="max-width:1240px"],   div[style*="max-width:1180px"],   div[style*="max-width:1100px"],   div[style*="max-width:980px"],   div[style*="max-width:960px"] {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 22px !important;
    padding-right: 22px !important;
  }

  .ks-headbar {
    width: 100% !important;
    max-width: 100% !important;
    padding: 12px 18px !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
  }

  .ks-headbar > a:first-child {
    flex: 0 1 158px !important;
    min-width: 0 !important;
    max-width: 158px !important;
    overflow: hidden !important;
  }

  .ks-headbar > a:first-child img {
    display: block !important;
    width: auto !important;
    max-width: 158px !important;
    height: 34px !important;
    object-fit: contain !important;
  }

  .ks-mobile-toggle {
    flex: 0 0 38px !important;
    margin-left: auto !important;
  }

  .ks-headbar .ks-nav {
    left: 18px !important;
    right: 18px !important;
    width: auto !important;
    max-width: calc(100vw - 36px) !important;
  }

  h1, h2, h3, h4 {
    max-width: 100% !important;
    text-align: left !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: normal !important;
    hyphens: auto !important;
  }

  h1 {
    font-size: clamp(31px, 8.5vw, 38px) !important;
    line-height: 1.08 !important;
    letter-spacing: -0.02em !important;
  }

  h2 {
    font-size: clamp(25px, 7vw, 32px) !important;
    line-height: 1.15 !important;
  }

  h3 {
    font-size: clamp(20px, 5.8vw, 26px) !important;
    line-height: 1.2 !important;
  }

  p, li, a, span {
    max-width: 100% !important;
    overflow-wrap: break-word !important;
  }

  .ks-g3,   .ks-g4,   .ks-2col,   .ks-hero,   .ks-wf {
    grid-template-columns: 1fr !important;
  }

  .ks-g3 > div,   .ks-g4 > div,   .ks-grid-card,   div[style*="position:relative"][style*="overflow:hidden"][style*="border:1px solid #F1DCDC"] {
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }

  .ks-deco-icon {
    --ks-deco-size: 76px !important;
    right: 12px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    opacity: 1 !important;
    z-index: 0 !important;
  }

  .ks-deco-icon::before {
    background: rgba(140, 6, 6, 0.055) !important;
  }

  .ks-grid-bg-symbol {
    --ks-deco-size: 80px !important;
  }

  .ks-g4 > div > div[style*="display:flex"],   div[style*="position:relative"] > div[style*="display:flex"][style*="align-items:baseline"] {
    display: flex !important;
    justify-content: flex-start !important;
    align-items: baseline !important;
    text-align: left !important;
    gap: 12px !important;
    width: 100% !important;
  }

  .ks-g4 > div > div[style*="display:flex"] > span:first-child,   div[style*="position:relative"] > div[style*="display:flex"][style*="align-items:baseline"] > span:first-child,   span[style*="font-family:'IBM Plex Mono'"][style*="flex-shrink:0"] {
    flex: 0 0 44px !important;
    width: 44px !important;
    min-width: 44px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    text-align: left !important;
  }

  .ks-g4 > div > div[style*="display:flex"] > span:last-child,   div[style*="position:relative"] > div[style*="display:flex"][style*="align-items:baseline"] > span:last-child {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    text-align: left !important;
  }

  .ks-wf > div {
    text-align: left !important;
  }

  .ks-wf > div > div:first-child {
    justify-content: flex-start !important;
  }

  .ks-wf > div p {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  a[aria-label="Anrufen"] {
    right: 18px !important;
    bottom: calc(22px + env(safe-area-inset-bottom)) !important;
    width: 58px !important;
    height: 58px !important;
    z-index: 90 !important;
  }

  .ks-cookie-consent {
    left: 12px !important;
    right: 12px !important;
    bottom: calc(12px + env(safe-area-inset-bottom)) !important;
  }

}

@media (max-width: 420px) {
  div[style*="max-width:1240px"],   div[style*="max-width:1180px"],   div[style*="max-width:1100px"],   div[style*="max-width:980px"],   div[style*="max-width:960px"] {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }

  .ks-headbar {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  .ks-headbar > a:first-child {
    max-width: 146px !important;
  }

  .ks-headbar > a:first-child img {
    max-width: 146px !important;
    height: 31px !important;
  }

  h1 {
    font-size: clamp(29px, 8.2vw, 34px) !important;
  }

  .ks-deco-icon {
    --ks-deco-size: 68px !important;
  }

}

@media (max-width: 700px) {
  html, body {
    width: 100% !important;
    max-width: 100vw !important;
    overflow-x: hidden !important;
  }

  .ks-page, .ks-page > div, main, section, header, footer {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  body .ks-wf > div,   body .ks-wf > div h4,   body .ks-wf > div p {
    text-align: center !important;
  }

  body .ks-wf > div > div:first-child {
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
  }

  body .ks-wf > div > div:first-child > span[style*="border-radius:50%"],   body .ks-wf > div > div:first-child > span[style*="border-radius: 50%"] {
    margin-left: auto !important;
    margin-right: auto !important;
  }

  body .ks-wf > div > div:first-child > span[style*="height: 2px"],   body .ks-wf > div > div:first-child > span[style*="height:2px"] {
    display: none !important;
  }

  body .ks-wf > div p {
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 26rem !important;
  }

}

@media (min-width: 701px) {
  .ks-mobile-toggle {
    display: none !important;
  }

}

@media (max-width: 700px) {
  header {
    overflow: visible !important;
  }

  .ks-headbar {
    position: relative !important;
    overflow: visible !important;
    z-index: 9990 !important;
  }

  .ks-mobile-toggle {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-direction: column !important;
    gap: 4px !important;
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
    flex: 0 0 38px !important;
    margin-left: auto !important;
    padding: 0 !important;
    border: 1px solid #EBCFCF !important;
    border-radius: 8px !important;
    background: #FFFFFF !important;
    color: #8C0606 !important;
    cursor: pointer !important;
    pointer-events: auto !important;
    touch-action: manipulation !important;
    position: relative !important;
    z-index: 10020 !important;
    -webkit-tap-highlight-color: transparent !important;
  }

  .ks-mobile-toggle span {
    display: block !important;
    width: 18px !important;
    height: 2px !important;
    border-radius: 2px !important;
    background: currentColor !important;
    transition: transform .16s ease, opacity .16s ease !important;
  }

  .ks-mobile-toggle[aria-expanded="true"] span:nth-child(1) {
    transform: translateY(6px) rotate(45deg) !important;
  }

  .ks-mobile-toggle[aria-expanded="true"] span:nth-child(2) {
    opacity: 0 !important;
  }

  .ks-mobile-toggle[aria-expanded="true"] span:nth-child(3) {
    transform: translateY(-6px) rotate(-45deg) !important;
  }

  .ks-headbar > a[href="kontakt.html"],   .ks-headbar > a[aria-label="Login"] {
    display: none !important;
  }

  .ks-headbar .ks-nav {
    display: none !important;
    position: absolute !important;
    top: calc(100% + 8px) !important;
    left: 16px !important;
    right: 16px !important;
    width: auto !important;
    max-width: calc(100vw - 32px) !important;
    margin: 0 !important;
    padding: 12px !important;
    border: 1px solid #F1DCDC !important;
    border-radius: 14px !important;
    background: #FFFFFF !important;
    box-shadow: 0 18px 45px rgba(26,22,20,0.14) !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 6px !important;
    overflow: visible !important;
    z-index: 10010 !important;
    pointer-events: auto !important;
  }

  .ks-headbar.ks-menu-open .ks-nav,   .ks-headbar .ks-mobile-toggle[aria-expanded="true"] + .ks-nav {
    display: flex !important;
  }

  .ks-headbar .ks-nav a {
    display: block !important;
    width: 100% !important;
    padding: 12px 14px !important;
    border-radius: 10px !important;
    white-space: normal !important;
    text-align: left !important;
    color: #4A4542 !important;
    background: transparent !important;
    line-height: 1.2 !important;
  }

  .ks-headbar .ks-nav a[aria-current="page"],   .ks-headbar .ks-nav a.ks-current,   .ks-headbar .ks-nav a[style*="background:#FBF3F3"] {
    color: #8C0606 !important;
    background: #FBF3F3 !important;
  }

  .ks-headbar .ks-nav a.ks-nav-contact {
    background: #8C0606 !important;
    color: #FFFFFF !important;
    text-align: center !important;
    font-weight: 700 !important;
    box-shadow: 0 8px 18px rgba(140,6,6,0.18) !important;
  }

  .ks-headbar .ks-nav a.ks-nav-login {
    border: 1px solid #EBCFCF !important;
    background: #FBF3F3 !important;
    color: #8C0606 !important;
    text-align: center !important;
    font-weight: 700 !important;
  }

}

body {
  position: relative !important;
}

img, svg, video, canvas {
  max-width: 100%;
}

header {
  z-index: 1000 !important;
}

.ks-headbar {
  min-width: 0 !important;
}

.ks-headbar > a:first-child {
  min-width: 0 !important;
}

.ks-headbar > a:first-child img {
  max-width: 180px !important;
  object-fit: contain !important;
}

.ks-mobile-toggle {
  display: none !important;
}

@keyframes ksServerFloatFixed {
  0%, 100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-7px);
  }

}

@keyframes ksServerDrawFixed {
  0% {
    stroke-dashoffset: 420;
    opacity: .72;
  }

  55%, 100% {
    stroke-dashoffset: 0;
    opacity: 1;
  }

}

@keyframes ksServerAreaFixed {
  0%, 100% {
    opacity: .55;
  }

  50% {
    opacity: .95;
  }

}

.ks-server-visual {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  animation: ksServerFloatFixed 7s ease-in-out infinite !important;
  will-change: transform;
}

.ks-server-visual > div {
  max-width: 100% !important;
}

.ks-server-visual svg {
  width: 100% !important;
  max-width: 100% !important;
  overflow: visible !important;
}

.ks-server-visual polyline[stroke="#8C0606"] {
  stroke-dasharray: 420 !important;
  stroke-dashoffset: 420;
  animation: ksServerDrawFixed 3.6s ease-in-out infinite alternate !important;
}

.ks-server-visual polyline[fill^="url"] {
  animation: ksServerAreaFixed 3.6s ease-in-out infinite alternate !important;
}

@media (max-width: 700px) {
  *, *::before, *::after {
    max-width: 100%;
  }

  header {
    position: sticky !important;
    top: 0 !important;
    z-index: 1000 !important;
    overflow: visible !important;
  }

  .ks-headbar {
    position: relative !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 12px 16px !important;
    overflow: visible !important;
  }

  .ks-headbar > a:first-child {
    flex: 0 1 auto !important;
    overflow: hidden !important;
  }

  .ks-headbar > a:first-child img {
    height: 30px !important;
    width: auto !important;
    max-width: 150px !important;
    display: block !important;
  }

  .ks-headbar > a[href="kontakt.html"],   .ks-headbar > a[aria-label="Login"] {
    display: none !important;
  }

  .ks-mobile-toggle {
    appearance: none !important;
    -webkit-appearance: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-direction: column !important;
    gap: 4px !important;
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
    margin-left: auto !important;
    padding: 0 !important;
    border: 1px solid #EBCFCF !important;
    border-radius: 8px !important;
    background: #FFFFFF !important;
    color: #8C0606 !important;
    cursor: pointer !important;
    pointer-events: auto !important;
    touch-action: manipulation !important;
    -webkit-tap-highlight-color: transparent !important;
    z-index: 1003 !important;
    position: relative !important;
  }

  .ks-mobile-toggle span {
    display: block !important;
    width: 18px !important;
    height: 2px !important;
    border-radius: 2px !important;
    background: currentColor !important;
    transition: transform .18s ease, opacity .18s ease !important;
  }

  .ks-mobile-toggle[aria-expanded="true"] span:nth-child(1) {
    transform: translateY(6px) rotate(45deg) !important;
  }

  .ks-mobile-toggle[aria-expanded="true"] span:nth-child(2) {
    opacity: 0 !important;
  }

  .ks-mobile-toggle[aria-expanded="true"] span:nth-child(3) {
    transform: translateY(-6px) rotate(-45deg) !important;
  }

  .ks-headbar .ks-nav {
    display: none !important;
    position: absolute !important;
    top: calc(100% + 8px) !important;
    left: 16px !important;
    right: 16px !important;
    width: auto !important;
    max-width: calc(100vw - 32px) !important;
    max-height: calc(100vh - 110px) !important;
    margin: 0 !important;
    padding: 12px !important;
    border: 1px solid #F1DCDC !important;
    border-radius: 14px !important;
    background: #FFFFFF !important;
    box-shadow: 0 18px 45px rgba(26,22,20,0.14) !important;
    flex-direction: column !important;
    gap: 6px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    z-index: 1002 !important;
  }

  .ks-headbar.ks-menu-open .ks-nav {
    display: flex !important;
  }

  .ks-headbar .ks-nav a {
    display: block !important;
    width: 100% !important;
    padding: 12px 14px !important;
    border-radius: 10px !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    text-align: left !important;
    line-height: 1.2 !important;
    color: #4A4542 !important;
    background: transparent !important;
  }

  .ks-headbar .ks-nav a[style*="background:#FBF3F3"],   .ks-headbar .ks-nav a[aria-current="page"] {
    color: #8C0606 !important;
    background: #FBF3F3 !important;
  }

  .ks-headbar .ks-nav a.ks-nav-contact {
    background: #8C0606 !important;
    color: #FFFFFF !important;
    text-align: center !important;
    font-weight: 700 !important;
    box-shadow: 0 8px 18px rgba(140,6,6,0.18) !important;
  }

  .ks-headbar .ks-nav a.ks-nav-login {
    border: 1px solid #EBCFCF !important;
    background: #FBF3F3 !important;
    color: #8C0606 !important;
    text-align: center !important;
    font-weight: 700 !important;
  }

  .ks-hero {
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }

  .ks-server-visual {
    margin: 8px auto 0 !important;
    transform-origin: center !important;
  }

  .ks-server-visual > div {
    padding: 16px !important;
  }

  .ks-server-visual h1, .ks-server-visual h2, .ks-server-visual h3 {
    overflow-wrap: anywhere !important;
  }

}

.ks-server-visual .ks-live-number {
  display: inline-block !important;
  min-width: 2.6ch !important;
  font-variant-numeric: tabular-nums !important;
  transition: color .18s ease !important;
  transform: none !important;
  will-change: contents !important;
}

.ks-server-visual .ks-live-line, .ks-server-visual polyline.ks-live-line[stroke="#8C0606"] {
  animation: none !important;
  stroke-dasharray: none !important;
  stroke-dashoffset: 0 !important;
  transition: none !important;
  will-change: points !important;
}

.ks-server-visual .ks-live-area, .ks-server-visual polyline.ks-live-area[fill^="url"] {
  animation: none !important;
  transition: none !important;
  will-change: points !important;
  opacity: .9 !important;
}

.ks-server-visual .ks-live-dot {
  transition: none !important;
  filter: drop-shadow(0 3px 8px rgba(140,6,6,.25));
}

@media (prefers-reduced-motion: reduce) {
  .ks-server-visual,   .ks-server-visual .ks-live-number,   .ks-server-visual .ks-live-line,   .ks-server-visual .ks-live-area,   .ks-server-visual .ks-live-dot {
    animation: none !important;
    transition: none !important;
    transform: none !important;
  }

}

.ks-server-visual .ks-live-number {
  display: inline-block !important;
  min-width: 2.8ch !important;
  font-variant-numeric: tabular-nums !important;
  animation: none !important;
  transition: color .18s ease !important;
  transform: none !important;
  will-change: contents !important;
}

.ks-server-visual .ks-live-temp, .ks-server-visual .ks-live-humidity {
  animation: none !important;
  transform: none !important;
}

.ks-server-visual .ks-live-line, .ks-server-visual .ks-live-area, .ks-server-visual .ks-live-dot {
  transition: none !important;
  animation: none !important;
  will-change: points !important;
}

@media (min-width: 701px) {
  .ks-page .ks-headbar {
    max-width: 1240px !important;
    padding-left: 28px !important;
    padding-right: 28px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .ks-page main > section[style*="max-width:1240px"],   .ks-page main > div[style*="max-width:1240px"],   .ks-page main > section > .ks-hero,   .ks-page main > section > div[style*="max-width:1240px"],   .ks-page main > div > div[style*="max-width:1240px"],   .ks-page footer .ks-footgrid,   .ks-page footer > div > div[style*="max-width:1240px"],   .ks-page > div > div[style*="border-top"] > div[style*="max-width:1240px"] {
    width: auto !important;
    max-width: min(1184px, calc(100% - 56px)) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

}

.ks-server-visual {
  animation: none !important;
  transform: none !important;
}

.ks-server-visual .ks-live-number {
  animation: none !important;
  transform: none !important;
  transition: color .18s ease !important;
}

@media (min-width: 701px) {
  .ks-page .ks-headbar {
    max-width: 1240px !important;
    padding-left: 28px !important;
    padding-right: 28px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .ks-page main > section[style*="max-width:1240px"],   .ks-page main > section[style*="max-width:1184px"],   .ks-page main > section[style*="max-width:1180px"],   .ks-page main > section[style*="max-width:1100px"],   .ks-page main > section[style*="max-width:1080px"],   .ks-page main > section[style*="max-width:980px"],   .ks-page main > section[style*="max-width:960px"],   .ks-page main > div[style*="max-width:1240px"],   .ks-page main > div[style*="max-width:1184px"],   .ks-page main > div[style*="max-width:1180px"],   .ks-page main > div[style*="max-width:1100px"],   .ks-page main > div[style*="max-width:1080px"],   .ks-page main > div[style*="max-width:980px"],   .ks-page main > div[style*="max-width:960px"],   .ks-page main > section > div[style*="max-width:1240px"],   .ks-page main > section > div[style*="max-width:1184px"],   .ks-page main > section > div[style*="max-width:1180px"],   .ks-page main > section > div[style*="max-width:1100px"],   .ks-page main > section > div[style*="max-width:1080px"],   .ks-page main > section > div[style*="max-width:980px"],   .ks-page main > section > div[style*="max-width:960px"],   .ks-page footer .ks-footgrid,   .ks-page footer > div > div[style*="max-width:1240px"],   .ks-page > div > div[style*="border-top"] > div[style*="max-width:1240px"] {
    box-sizing: border-box !important;
    width: auto !important;
    max-width: min(1184px, calc(100% - 56px)) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .ks-page main > section[style*="max-width:1080px"] .ks-modtile,   .ks-page main > section[style*="max-width:1180px"] .ks-modtile,   .ks-page main > section[style*="max-width:1240px"] .ks-modtile {
    width: 100% !important;
  }

}

.ks-g3 > div > .ks-deco-letter, .ks-g4 > div > .ks-deco-letter, .ks-grid-card > .ks-deco-letter, .ks-g3 > div > .ks-deco-icon, .ks-g4 > div > .ks-deco-icon, .ks-grid-card > .ks-deco-icon {
  position: absolute !important;
  right: 14px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  display: block !important;
  z-index: 0 !important;
  pointer-events: none !important;
  margin: 0 !important;
}

.ks-g3 > div > div[style*="position:absolute"][style*="height:3px"], .ks-g3 > div > div[style*="position:absolute"][style*="height: 3px"], .ks-grid-card > div[style*="position:absolute"][style*="height:3px"], .ks-grid-card > div[style*="position:absolute"][style*="height: 3px"] {
  position: absolute !important;
  top: 0 !important;
  left: 26px !important;
  right: 26px !important;
  width: auto !important;
  height: 3px !important;
  z-index: 1 !important;
  margin: 0 !important;
}

@media (min-width: 701px) {
  .ks-g3 > div[style*="border-radius:18px"][style*="padding:30px"],   .ks-grid-card[style*="border-radius:18px"][style*="padding:30px"] {
    padding-top: 26px !important;
  }

}

.ks-g3 > div > :not(.ks-deco-icon):not(.ks-deco-letter), .ks-g4 > div > :not(.ks-deco-icon):not(.ks-deco-letter), .ks-grid-card > :not(.ks-deco-icon):not(.ks-deco-letter) {
  position: relative !important;
  z-index: 1 !important;
}

html body .ks-page .ks-g3 > div > .ks-deco-letter, html body .ks-page .ks-g4 > div > .ks-deco-letter, html body .ks-page .ks-grid-card > .ks-deco-letter, html body .ks-page .ks-g3 > div > .ks-deco-icon, html body .ks-page .ks-g4 > div > .ks-deco-icon, html body .ks-page .ks-grid-card > .ks-deco-icon {
  position: absolute !important;
  right: 14px !important;
  top: 50% !important;
  left: auto !important;
  bottom: auto !important;
  transform: translateY(-50%) !important;
  display: block !important;
  z-index: 0 !important;
  margin: 0 !important;
  pointer-events: none !important;
}

html body .ks-page .ks-g3 > div > div[style*="position:absolute"][style*="height:3px"], html body .ks-page .ks-g3 > div > div[style*="position:absolute"][style*="height: 3px"], html body .ks-page .ks-grid-card > div[style*="position:absolute"][style*="height:3px"], html body .ks-page .ks-grid-card > div[style*="position:absolute"][style*="height: 3px"] {
  position: absolute !important;
  top: 0 !important;
  left: 26px !important;
  right: 26px !important;
  width: auto !important;
  height: 3px !important;
  z-index: 1 !important;
  margin: 0 !important;
}

html body .ks-page .ks-g3 > div > :not(.ks-deco-icon):not(.ks-deco-letter):not([style*="position:absolute"]), html body .ks-page .ks-g4 > div > :not(.ks-deco-icon):not(.ks-deco-letter):not([style*="position:absolute"]), html body .ks-page .ks-grid-card > :not(.ks-deco-icon):not(.ks-deco-letter):not([style*="position:absolute"]) {
  position: relative !important;
  z-index: 1 !important;
}

input {
  font-family: inherit;
}

input::placeholder {
  color: #B8B0AC;
}

@keyframes ksSpin {
  to {
    transform: rotate(360deg);
  }

}

.ks-login-shell {
  display: grid;
  grid-template-columns: 1.05fr 1fr;
  min-height: 100vh;
}

.ks-brandpane {
  order: 0;
}

.ks-formpane {
  order: 1;
}

.ks-alert {
  display:none;
  align-items:center;
  gap:9px;
  background:#FBF0F0;
  border:1px solid #EBCFCF;
  border-radius:10px;
  padding:11px 14px;
  margin-bottom:18px;
}

.ks-alert svg {
  flex-shrink:0;
}

.ks-alert span {
  font-size:13.5px;
  color:#8C0606;
  font-weight:500;
}

.ks-field:focus {
  border-color:#8C0606 !important;
  box-shadow:0 0 0 3px rgba(140,6,6,0.1);
}

.ks-submit:hover {
  background:#7A0505 !important;
}

.ks-toggle:hover {
  background:#FBF3F3 !important;
  color:#8C0606 !important;
}

@media (max-width: 900px) {
  .ks-login-shell {
    grid-template-columns: 1fr;
  }

  .ks-brandpane {
    min-height: auto !important;
    padding: 40px 28px !important;
  }

  .ks-brand-tagline {
    display: none !important;
  }

  .ks-brand-features {
    display: none !important;
  }

  .ks-formpane {
    padding: 44px 24px 56px !important;
  }

}


/* Hover states extracted from previous style-hover attributes. */
.ks-hover-19af3b06:hover {
  background:#B01818;
  transform:scale(1.06);
}

.ks-hover-7ecb8507:hover {
  border-color:#E3B9B9;
  box-shadow:0 14px 32px rgba(140,6,6,0.12);
  transform:translateY(-4px);
}

.ks-hover-c723365b:hover {
  border-color:#E3B9B9;
  box-shadow:0 12px 30px rgba(140,6,6,0.1);
}


/* Refactoring additions */
.ks-image-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 160px;
  border: 1px dashed #E3B9B9;
  background: #FFFFFF;
  color: #8C0606;
  text-align: center;
  font-size: 14px;
  line-height: 1.45;
}

.ks-image-placeholder span {
  max-width: 220px;
  padding: 0 16px;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}