:root {
  --silver: #c0c0c0;
  --navy: #000080;
  --blue: #0000ee;
  --purple: #551a8b;
  --teal: #008080;
  --yellow: #ffff00;
}

* {
  box-sizing: border-box;
  transition: none !important;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  padding: 24px 12px 44px;
  color: #000;
  background-color: #000016;
  background-image:
    radial-gradient(circle, #fff 0 1px, transparent 1.5px),
    radial-gradient(circle, #79a7ff 0 1px, transparent 1.5px),
    radial-gradient(circle, #fff 0 1px, transparent 1.5px);
  background-position: 0 0, 57px 39px, 103px 81px;
  background-size: 137px 137px, 181px 181px, 223px 223px;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
}

a {
  color: var(--blue);
  text-decoration: underline;
}

a:visited {
  color: var(--purple);
}

a:hover {
  color: var(--blue);
}

a:visited:hover {
  color: var(--purple);
}

.skip-link {
  position: fixed;
  top: -60px;
  left: 12px;
  z-index: 100;
  padding: 8px 12px;
  color: #000;
  background: var(--yellow);
}

.skip-link:focus {
  top: 8px;
}

.browser-page {
  width: min(790px, 100%);
  margin: 0 auto;
  overflow: hidden;
  background: #d6d6d6;
  border: 3px outset #eee;
  box-shadow: 0 0 0 2px #000, 12px 14px 0 rgba(0, 0, 0, 0.45);
}

.masthead {
  padding: 5px;
}

.top-strip {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 24px;
  padding: 3px 7px;
  color: #fff;
  background: var(--navy);
  font: bold 11px "Courier New", monospace;
  letter-spacing: 0.04em;
}

.online {
  display: flex;
  align-items: center;
  gap: 5px;
}

.online i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #00ff00;
  box-shadow: 0 0 7px #00ff00;
  animation: pulse-led 1.3s steps(2, end) infinite;
}

.logo-area {
  position: relative;
  display: grid;
  grid-template-columns: 115px 1fr 74px;
  align-items: center;
  min-height: 138px;
  padding: 12px 14px;
  overflow: hidden;
  text-align: center;
  background:
    linear-gradient(135deg, rgba(0, 0, 128, 0.94), rgba(37, 0, 99, 0.93)),
    #000080;
  border: 2px inset #fff;
}

.logo-area::before {
  position: absolute;
  inset: 0;
  opacity: 0.14;
  background: repeating-linear-gradient(
    0deg,
    transparent 0 3px,
    #fff 3px 4px
  );
  content: "";
  pointer-events: none;
}

.welcome {
  margin: 0 0 4px;
  color: #00ffff;
  font: bold 12px "Courier New", monospace;
  letter-spacing: 0.16em;
}

.logo-area h1 {
  position: relative;
  margin: 0;
  color: #fff;
  font: italic bold 39px/1 "Times New Roman", serif;
  letter-spacing: -0.03em;
  text-shadow: 3px 3px #000, -1px -1px #00ffff;
}

.logo-area h1 span {
  color: #ffff00;
}

.tagline {
  margin: 9px 0 0;
  color: #fff;
  font: italic 15px "Times New Roman", serif;
}

.planet {
  position: relative;
  z-index: 1;
  isolation: isolate;
  width: 82px;
  height: 82px;
  margin: auto;
  overflow: visible;
  border: 3px solid #00ffff;
  border-radius: 50%;
  background: #000;
  box-shadow:
    0 0 5px #00ffff,
    0 0 14px rgb(0 255 255 / 80%);
}

.planet img {
  position: relative;
  z-index: 2;
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: #fff;
  object-fit: contain;
}

.planet span {
  position: absolute;
  z-index: 3;
  top: 9px;
  left: -15px;
  width: 112px;
  height: 60px;
  border: 0;
  border-bottom: 7px solid #ff00df;
  border-radius: 50%;
  filter:
    drop-shadow(0 0 3px #ff00df)
    drop-shadow(0 0 7px rgb(255 0 223 / 85%));
  -webkit-mask-image: linear-gradient(
    90deg,
    transparent 0%,
    #000 3%,
    #000 97%,
    transparent 100%
  );
  mask-image: linear-gradient(
    90deg,
    transparent 0%,
    #000 3%,
    #000 97%,
    transparent 100%
  );
  transform: rotate(-13deg);
  pointer-events: none;
}

.planet span::after {
  position: absolute;
  inset: 6px 8px -5px;
  border-bottom: 2px solid #ff9af2;
  border-radius: 50%;
  content: "";
}

.new-badge {
  z-index: 1;
  display: grid;
  place-items: center;
  width: 63px;
  height: 63px;
  color: #f00;
  background: #ff0;
  border: 4px double #f00;
  border-radius: 50%;
  font: bold italic 15px Arial, sans-serif;
  transform: rotate(10deg);
  animation: blink 0.8s steps(2, end) infinite;
}

.new-badge .fa-shopware {
  color: #087eb7;
  font-size: 34px;
  filter: drop-shadow(1px 1px 0 #fff);
  transform: rotate(-3deg);
}

.rainbow-rule {
  height: 7px;
  margin: 5px 0;
  background: linear-gradient(
    90deg,
    #f00 0 14%,
    #ff0 14% 28%,
    #0f0 28% 42%,
    #0ff 42% 56%,
    #00f 56% 70%,
    #f0f 70% 84%,
    #f00 84%
  );
  border: 1px inset #fff;
}

.ticker {
  display: flex;
  align-items: center;
  height: 27px;
  overflow: hidden;
  color: #fff;
  background: #000;
  border: 2px inset #fff;
  font: 12px "Courier New", monospace;
}

.ticker strong {
  z-index: 1;
  align-self: stretch;
  display: flex;
  align-items: center;
  padding: 0 7px;
  color: #ff0;
  background: #800000;
  white-space: nowrap;
}

.ticker-window {
  flex: 1;
  overflow: hidden;
}

.ticker p {
  width: max-content;
  margin: 0;
  padding-left: 24px;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  background: transparent !important;
  white-space: nowrap;
  animation: ticker 20s linear infinite;
}

.button-bar {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 4px;
  padding-top: 5px;
}

.button-bar a,
.classic-button {
  display: block;
  padding: 7px 5px;
  color: #000;
  text-align: center;
  text-decoration: none;
  background: var(--silver);
  border: 3px outset #eee;
  font: bold 12px Arial, sans-serif;
}

.button-bar a:active,
.classic-button:active {
  padding: 9px 3px 5px 7px;
  border-style: inset;
}

.page-columns {
  display: grid;
  grid-template-columns: 185px minmax(0, 1fr);
  gap: 6px;
  padding: 0 5px 7px;
}

.sidebar {
  min-width: 0;
}

.side-box {
  margin-bottom: 7px;
  padding: 3px;
  background: var(--silver);
  border: 2px outset #fff;
}

.bevel-title {
  margin: 0 0 4px;
  padding: 5px 4px;
  color: #fff;
  text-align: center;
  background: var(--navy);
  border: 2px inset #aaa;
  font: bold 12px "Courier New", monospace;
  letter-spacing: 0.05em;
}

.sidebar .bevel-title {
  max-width: 100%;
  overflow-wrap: anywhere;
  font-size: clamp(10px, 1.6vw, 12px) !important;
  line-height: 1.15 !important;
}

.link-list {
  display: flex;
  flex-direction: column;
  padding: 3px 4px 5px;
  background: #fff;
  border: 1px inset #999;
}

.link-list a {
  padding: 5px 2px;
  border-bottom: 1px dotted #999;
  font: bold 12px "Times New Roman", serif;
}

.updates > p {
  margin: 0;
  padding: 5px;
  background: #ffffcc;
  border-bottom: 1px dotted #777;
  font: 11px/1.25 Arial, sans-serif;
}

.updates p strong {
  display: block;
  color: #800000;
  font-family: "Courier New", monospace;
}

.counter-box {
  text-align: center;
}

.counter-box p {
  margin: 7px 0 3px;
  font: 11px Arial, sans-serif;
}

.counter {
  display: flex;
  justify-content: center;
  gap: 1px;
  margin: 4px 0;
}

.counter span {
  padding: 2px 3px;
  color: #0f0;
  background: #000;
  border: 1px inset #888;
  font: bold 14px "Courier New", monospace;
}

.counter-box small,
.award small {
  display: block;
  margin: 3px 0 5px;
  font-size: 9px;
}

.award {
  color: #fff;
  text-align: center;
  background: #000;
}

.award small {
  color: #fff !important;
}

.award-star {
  color: #ff0;
  font-size: 43px;
  line-height: 1;
  text-shadow: 2px 2px #f00;
  animation: spin-star 8s linear infinite;
}

.award strong {
  display: block;
  color: #0ff;
  font: bold 11px "Times New Roman", serif;
}

.browser-note {
  padding: 7px 4px;
  color: #fff;
  text-align: center;
  background: #333;
  border: 2px outset #aaa;
  font: 9px Arial, sans-serif;
}

.browser-note strong,
.browser-note small {
  display: block;
}

.browser-note span {
  display: block;
  margin: 4px;
  padding: 4px;
  color: #ff0;
  background: #000080;
  border: 1px solid #fff;
  font: bold 14px "Times New Roman", serif;
}

.content {
  min-width: 0;
}

.welcome-box {
  margin-bottom: 9px;
  background: #fff;
  border: 3px outset #eee;
}

.window-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 3px 4px;
  color: #fff;
  background: linear-gradient(90deg, #000080, #1084d0);
  font: bold 12px Arial, sans-serif;
}

.window-title div {
  display: flex;
  gap: 2px;
}

.window-title b {
  display: grid;
  place-items: center;
  width: 16px;
  height: 14px;
  color: #000;
  background: var(--silver);
  border: 1px outset #fff;
  font-size: 10px;
}

.window-content {
  padding: 13px 15px 10px;
  background-image: linear-gradient(90deg, #fff 96%, #e9e9e9 96%);
  font: 15px/1.45 "Times New Roman", serif;
}

.window-content p {
  margin: 0 0 10px;
}

.hello {
  color: #000080;
  font-size: 23px;
  font-weight: bold;
}

.wave {
  display: inline-block;
  animation: wave 2s ease-in-out infinite;
  transform-origin: 70% 70%;
}

.signature {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  margin-top: 8px;
  color: #000080;
  font-style: italic;
}

.signature strong {
  font: bold 18px "Brush Script MT", cursive;
}

.content-section {
  margin-bottom: 9px;
  padding: 5px;
  background: #fff;
  border: 2px outset #eee;
}

.section-banner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 6px;
  color: #ff0;
  text-align: center;
  background: #800000;
  border: 2px inset #ddd;
}

.section-banner h2 {
  margin: 0;
  font: bold 20px "Times New Roman", serif;
}

.section-banner > span {
  color: #fff;
  animation: blink 1.2s steps(2, end) infinite;
}

.center-copy {
  margin: 8px 5px;
  text-align: center;
  font: italic 14px "Times New Roman", serif;
}

.service-table {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-top: 1px solid #999;
  border-left: 1px solid #999;
}

.service-table article {
  display: grid;
  grid-template-columns: 41px 1fr;
  gap: 7px;
  min-height: 104px;
  padding: 9px 7px;
  border-right: 1px solid #999;
  border-bottom: 1px solid #999;
  background: #f4f4f4;
}

.pixel-icon {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  background: #d6d6d6;
  border: 3px outset #fff;
  font-size: 21px;
}

.service-table h3 {
  margin: 0 0 3px;
  font: bold 14px Arial, sans-serif;
}

.service-table p {
  margin: 0;
  font: 12px/1.35 Arial, sans-serif;
}

.shopware-zone {
  margin-bottom: 9px;
  overflow: hidden;
  color: #fff;
  background: #000044;
  border: 3px outset #aaa;
}

.construction-tape {
  display: flex;
  justify-content: space-around;
  padding: 4px;
  color: #000;
  background: repeating-linear-gradient(
    135deg,
    #ff0 0 14px,
    #000 14px 28px
  );
  font: bold 9px Arial, sans-serif;
}

.construction-tape span {
  padding: 2px 5px;
  background: #ff0;
}

.shopware-inner {
  display: grid;
  grid-template-columns: 105px 1fr;
  gap: 15px;
  align-items: center;
  padding: 16px;
  background-image:
    linear-gradient(rgba(0, 255, 255, 0.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 255, 255, 0.08) 1px, transparent 1px);
  background-size: 16px 16px;
}

.zone-label {
  margin: 0;
  color: #0ff;
  font: bold 10px "Courier New", monospace;
}

.shopware-inner h2 {
  margin: 3px 0 7px;
  color: #ff0;
  font: bold 25px "Times New Roman", serif;
  text-shadow: 2px 2px #800080;
}

.shopware-inner p,
.shopware-inner ul {
  margin: 6px 0;
  font: 13px/1.4 Arial, sans-serif;
}

.shopware-inner ul {
  padding-left: 19px;
}

.disk {
  position: relative;
  width: 88px;
  height: 96px;
  background: #222;
  border: 4px outset #777;
  border-radius: 3px;
  box-shadow: 4px 4px 0 #000;
}

.disk::before {
  position: absolute;
  top: 8px;
  left: 17px;
  width: 49px;
  height: 29px;
  background: #bbb;
  border: 2px inset #777;
  content: "";
}

.disk::after {
  position: absolute;
  right: 13px;
  bottom: 11px;
  left: 13px;
  height: 30px;
  background: #ddd;
  border: 2px inset #888;
  content: "";
}

.disk span {
  position: absolute;
  z-index: 1;
  right: 25px;
  bottom: 17px;
  width: 14px;
  height: 17px;
  background: #111;
}

.classic-button {
  width: max-content;
  margin-top: 10px;
  color: #000 !important;
}

.process-line {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin-top: 6px;
  border: 1px solid #777;
}

.process-line article {
  min-height: 104px;
  padding: 8px 6px;
  text-align: center;
  background: #ffffdd;
  border-right: 1px dotted #777;
}

.process-line article:last-child {
  border: 0;
}

.process-line article > span {
  display: inline-grid;
  place-items: center;
  width: 30px;
  height: 30px;
  color: #fff;
  background: #008080;
  border: 2px outset #0cc;
  font: bold 12px "Courier New", monospace;
}

.process-line h3 {
  margin: 5px 0 3px;
  color: #800000;
  font: bold 13px Arial, sans-serif;
}

.process-line p {
  margin: 0;
  font: 11px/1.3 Arial, sans-serif;
}

.webmaster-card {
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 13px;
  align-items: center;
  margin-bottom: 9px;
  padding: 13px;
  background: #d6d6d6;
  border: 3px outset #eee;
}

.webmaster-card h2 {
  margin: 3px 0 6px;
  color: #000080;
  font: bold 22px "Times New Roman", serif;
}

.webmaster-card p {
  margin: 0;
  font: 13px/1.4 Arial, sans-serif;
}

.mono-label {
  color: #800000;
  font-family: "Courier New", monospace !important;
  font-size: 10px !important;
  font-weight: bold !important;
}

.avatar {
  position: relative;
  height: 84px;
}

.screen {
  width: 67px;
  height: 58px;
  margin: 0 auto;
  padding: 7px;
  background: #bbb;
  border: 4px outset #eee;
}

.screen span {
  display: grid;
  place-items: center;
  height: 100%;
  color: #0f0;
  background: #002900;
  font: bold 21px "Courier New", monospace;
}

.keyboard {
  width: 93px;
  height: 15px;
  margin: 1px auto 0;
  background: repeating-linear-gradient(90deg, #999 0 5px, #555 5px 6px);
  border: 3px outset #ddd;
  transform: perspective(25px) rotateX(6deg);
}

.contact-box {
  display: grid;
  grid-template-columns: 82px 1fr;
  gap: 13px;
  align-items: center;
  padding: 14px;
  color: #fff;
  background: #008080;
  border: 4px ridge #fff;
}

.mail-icon {
  display: grid;
  place-items: center;
  width: 66px;
  height: 52px;
  color: #000080;
  background: #fff;
  border: 4px outset #ddd;
  font: bold 30px "Times New Roman", serif;
}

.contact-box h2 {
  margin: 0 0 4px;
  color: #ff0;
  font: bold 22px "Times New Roman", serif;
}

.contact-box p {
  margin: 0 0 7px;
  font-size: 12px;
}

.contact-box a {
  color: #fff;
  font: bold 13px "Courier New", monospace;
}

footer {
  padding: 0 7px 14px;
  text-align: center;
  background: #d6d6d6;
  font: 11px Arial, sans-serif;
}

footer nav {
  padding: 7px;
  font-family: "Courier New", monospace;
  font-weight: bold;
}

.footer-brand {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
}

.footer-brand img {
  width: 32px;
  height: 32px;
  padding: 2px;
  background: #fff;
  border: 2px outset #fff;
  object-fit: contain;
}

.footer-brand p {
  margin: 0;
}

.legal {
  margin: 8px 0 0;
  color: #555;
  font-size: 9px;
}

.status-bar {
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 20;
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 3px;
  padding: 3px;
  background: var(--silver);
  border-top: 2px outset #fff;
  font: 11px Arial, sans-serif;
}

.status-bar span {
  padding: 2px 7px;
  border: 1px inset #fff;
}

@keyframes ticker {
  to {
    transform: translateX(-100%);
  }
}

@keyframes blink {
  50% {
    opacity: 0.25;
  }
}

@keyframes pulse-led {
  50% {
    opacity: 0.3;
  }
}

@keyframes spin-star {
  to {
    transform: rotate(360deg);
  }
}

@keyframes wave {
  0%,
  100% {
    transform: rotate(0);
  }
  30% {
    transform: rotate(18deg);
  }
  60% {
    transform: rotate(-8deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}

@media (max-width: 650px) {
  body {
    padding: 5px 5px 38px;
  }

  .browser-page {
    box-shadow: none;
  }

  .top-strip {
    font-size: 9px;
  }

  .online {
    font-size: 0;
  }

  .logo-area {
    grid-template-columns: 63px 1fr;
    min-height: 116px;
    padding: 9px 6px;
  }

  .planet {
    width: 54px;
    height: 54px;
  }

  .planet span {
    top: 5px;
    left: -7px;
    width: 68px;
    height: 40px;
    border-bottom-width: 5px;
  }

  .new-badge {
    position: absolute;
    right: 4px;
    bottom: 4px;
    width: 37px;
    height: 37px;
    border-width: 2px;
    font-size: 9px;
  }

  .welcome {
    font-size: 8px;
    letter-spacing: 0.08em;
  }

  .logo-area h1 {
    font-size: clamp(24px, 8vw, 34px);
  }

  .tagline {
    font-size: 11px;
  }

  .button-bar {
    grid-template-columns: 1fr 1fr;
  }

  .button-bar a:last-child {
    grid-column: 1 / -1;
  }

  .page-columns {
    display: flex;
    flex-direction: column;
  }

  .content {
    order: -1;
  }

  .sidebar {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5px;
  }

  .side-box {
    margin: 0;
  }

  .side-box:first-child,
  .browser-note {
    grid-column: 1 / -1;
  }

  .award {
    display: none;
  }

  .browser-note {
    margin-bottom: 2px;
  }

  .browser-note span {
    display: inline-block;
  }

  .service-table {
    grid-template-columns: 1fr;
  }

  .service-table article {
    min-height: 0;
  }

  .shopware-inner {
    grid-template-columns: 68px 1fr;
    gap: 8px;
    padding: 11px 8px;
  }

  .disk {
    width: 59px;
    height: 67px;
  }

  .disk::before {
    left: 10px;
    width: 32px;
    height: 19px;
  }

  .disk::after {
    right: 7px;
    bottom: 7px;
    left: 7px;
    height: 20px;
  }

  .disk span {
    right: 15px;
    bottom: 11px;
    width: 10px;
    height: 11px;
  }

  .shopware-inner h2 {
    font-size: 19px;
  }

  .process-line {
    grid-template-columns: 1fr 1fr;
  }

  .process-line article {
    min-height: 92px;
    border-bottom: 1px dotted #777;
  }

  .webmaster-card {
    grid-template-columns: 90px 1fr;
    padding: 9px;
  }

  .contact-box {
    grid-template-columns: 50px 1fr;
    padding: 10px;
  }

  .mail-icon {
    width: 46px;
    height: 38px;
    font-size: 22px;
  }

  .contact-box a {
    overflow-wrap: anywhere;
    font-size: 10px;
  }

  .status-bar span:nth-child(2) {
    display: none;
  }
}

/* ProcessWire fusion layer
   Keeps the existing CMS content and behavior inside the design_05 shell. */

body.site-layout {
  display: block !important;
  min-height: 100vh;
  color: #000;
  background-color: #000016;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
}

.site-starfield {
  z-index: 0;
}

.browser-page {
  position: relative;
  z-index: 1;
}

.oldschool-brand {
  position: relative;
  margin: 0;
  color: #fff !important;
  font: italic bold 39px/1 "Times New Roman", serif;
  letter-spacing: -0.03em;
  text-shadow: 3px 3px #000, -1px -1px #00ffff;
}

.oldschool-brand span {
  color: #ffff00;
}

.logo-area .welcome,
.logo-area .tagline {
  color: #fff !important;
}

.planet {
  display: block;
}

.oldschool-navbar.button-bar {
  display: block;
  min-height: 0;
  position: static !important;
  top: auto !important;
  left: auto !important;
  width: 100% !important;
  padding: 5px 0 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}

.has-conversion-topbar .oldschool-navbar {
  top: auto !important;
}

.oldschool-navbar::before {
  display: none !important;
}

.oldschool-navbar .navbar-toggler {
  width: 100%;
  padding: 7px 5px;
  color: #000;
  background: var(--silver);
  border: 3px outset #eee;
  border-radius: 0;
  font: bold 12px Arial, sans-serif;
}

.oldschool-navbar .navbar-toggler-icon {
  width: 15px;
  height: 15px;
  margin-right: 5px;
}

.oldschool-navbar .navbar-collapse,
.oldschool-navbar .navbar-nav {
  width: 100%;
}

.oldschool-navbar .navbar-mobile-close {
  top: 7px;
  right: 7px;
  z-index: 5;
  width: 25px;
  height: 25px;
  padding: 0 !important;
  color: #000 !important;
  background: var(--silver) !important;
  border: 2px outset #eee !important;
  border-radius: 0 !important;
}

.oldschool-navbar .navbar-nav {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
  gap: 4px;
  margin: 0;
}

.oldschool-navbar .nav-item {
  position: relative;
  min-width: 0;
}

.oldschool-navbar .nav-item.dropdown > .nav-link {
  padding-right: 31px !important;
}

.oldschool-navbar .nav-item.dropdown > .dropdown-toggle-split {
  position: absolute;
  top: 3px;
  right: 3px;
  width: 25px;
  height: calc(100% - 6px);
  padding: 0 !important;
  color: #000 !important;
  background: var(--silver) !important;
  border: 2px outset #eee !important;
  border-radius: 0 !important;
  z-index: 2;
}

.oldschool-navbar .nav-item.dropdown > .dropdown-toggle-split::before,
.oldschool-navbar .nav-item.dropdown > .dropdown-toggle-split::after {
  display: none !important;
}

.oldschool-navbar .dropdown-toggle-icon__open {
  display: none;
}

.oldschool-navbar .dropdown-toggle-split[aria-expanded="true"] .dropdown-toggle-icon__closed {
  display: none;
}

.oldschool-navbar .dropdown-toggle-split[aria-expanded="true"] .dropdown-toggle-icon__open {
  display: inline;
}

.oldschool-navbar .nav-link,
.oldschool-navbar .dropdown-item {
  display: block;
  width: 100%;
  padding: 7px 5px !important;
  color: #000 !important;
  text-align: center;
  text-decoration: none;
  white-space: normal;
  background: var(--silver) !important;
  border: 3px outset #eee !important;
  border-radius: 0 !important;
  font: bold 11px Arial, sans-serif;
}

.oldschool-navbar .nav-link:focus-visible,
.oldschool-navbar .dropdown-item:focus-visible {
  color: #fff !important;
  background: var(--navy) !important;
}

.oldschool-navbar .nav-link:hover,
.oldschool-navbar .dropdown-item:hover {
  color: #000 !important;
  background: var(--silver) !important;
}

.oldschool-navbar .dropdown-menu {
  min-width: 100%;
  padding: 3px;
  background: var(--silver);
  border: 2px outset #fff;
  border-radius: 0;
}

.oldschool-navbar .dropdown-menu li + li {
  margin-top: 2px;
}

.page-columns > main,
.page-columns > section {
  min-width: 0;
  width: 100%;
}

.page-columns > .floating-chatbot {
  position: fixed;
}

.browser-page main,
.browser-page .hero-section {
  color: #000 !important;
}

.browser-page main.page-content {
  padding: 0 0 9px;
}

.browser-page main > .container,
.browser-page .hero-section > .container,
.browser-page .layout-section > .container {
  width: 100%;
  max-width: none;
  padding: 0;
}

.browser-page main > .container > .row {
  display: block;
  margin: 0;
}

.browser-page main > .container > .row > [class*="col-"] {
  width: 100%;
  max-width: none;
  padding: 0;
}

.browser-page main .row > [class*="col-"],
.browser-page .hero-section .row > [class*="col-"] {
  width: 100%;
  max-width: none;
}

.browser-page .layout-section,
.browser-page .hero-section,
.browser-page .legal-shell {
  display: block !important;
  width: 100%;
  min-height: 0 !important;
  padding: 0 0 9px !important;
  color: #000 !important;
  background: transparent !important;
}

.browser-page .section-shell,
.browser-page .legal-page-content,
.browser-page .page-content > .container,
.browser-page .layout-section > .container > .section-shell {
  width: 100%;
  max-width: none;
  margin: 0 !important;
  padding: 12px !important;
  color: #000;
  background: #fff !important;
  border: 3px outset #eee !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.browser-page .layout-section:first-child .section-shell {
  padding-top: 12px !important;
}

.browser-page h1,
.browser-page h2,
.browser-page h3,
.browser-page h4,
.browser-page h5,
.browser-page h6 {
  color: #000080 !important;
  font-family: "Times New Roman", serif;
  text-shadow: none !important;
}

.browser-page .bevel-title,
.browser-page .window-title,
.browser-page .section-kicker {
  color: #fff !important;
}

.browser-page h1 {
  font-size: clamp(28px, 6vw, 42px) !important;
}

.browser-page h2 {
  font-size: clamp(21px, 4vw, 29px) !important;
}

.browser-page p,
.browser-page li,
.browser-page label,
.browser-page small,
.browser-page .text-white,
.browser-page .text-muted,
.browser-page .section-lead {
  color: #000 !important;
  font-family: Arial, Helvetica, sans-serif;
}

.browser-page .ticker .ticker-window p {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  opacity: 1 !important;
}

.browser-page a {
  color: var(--blue);
}

.browser-page a:visited {
  color: var(--purple);
}

.browser-page a:focus-visible {
  color: #f00;
}

.browser-page a:hover {
  color: var(--blue);
}

.browser-page a:visited:hover {
  color: var(--purple);
}

.browser-page .section-kicker,
.browser-page .mono-label,
.browser-page .breadcrumb {
  color: #800000 !important;
  font-family: "Courier New", monospace;
  font-weight: bold;
}

.browser-page .section-kicker {
  display: block;
  margin: -12px -12px 10px;
  padding: 5px 7px;
  color: #fff !important;
  background: linear-gradient(90deg, #000080, #1084d0);
  border: 1px inset #aaa;
  font-size: 12px;
}

.browser-page .oldschool-section-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: calc(100% + 24px);
  margin: -12px -12px 10px;
  min-height: 38px;
  padding: 3px 5px 3px 9px !important;
  color: #fff !important;
  text-align: left;
  background: linear-gradient(90deg, #000080 0%, #0756b2 58%, #168cd2 100%) !important;
  border: 3px outset #d8d8d8 !important;
  border-radius: 0 !important;
  cursor: pointer;
  font: bold clamp(14px, 1.6vw, 19px) Arial, Helvetica, sans-serif;
  user-select: none;
}

.browser-page .oldschool-section-toggle:hover {
  color: #fff !important;
  background: linear-gradient(90deg, #000080 0%, #0756b2 58%, #168cd2 100%) !important;
}

.browser-page .oldschool-section-toggle.has-interaction-hint {
  animation: oldschool-section-tab-hint 1.05s ease-in-out
    var(--oldschool-tab-hint-delay, 0.45s) 1 both;
}

@keyframes oldschool-section-tab-hint {
  0%,
  100% {
    filter: brightness(1);
    box-shadow: none;
    text-shadow: 1px 1px #00144c;
  }

  42% {
    filter: brightness(1.65) saturate(1.3);
    box-shadow:
      inset 0 0 0 2px rgb(255 255 255 / 85%),
      0 0 10px #00ffff,
      0 0 20px rgb(0 255 255 / 85%);
    text-shadow:
      0 0 4px #fff,
      0 0 9px #00ffff;
  }

  72% {
    filter: brightness(1.06);
    box-shadow: 0 0 3px rgb(0 255 255 / 25%);
    text-shadow: 1px 1px #00144c;
  }
}

.browser-page .oldschool-section-toggle__label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-shadow: 1px 1px #00144c;
}

.browser-page .oldschool-section-toggle__controls {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 3px;
  pointer-events: none;
}

.browser-page .oldschool-section-toggle__label {
  pointer-events: none;
}

.browser-page
  .layout-section:not(.is-accordion-open)
  .section-shell {
  cursor: pointer;
}

.browser-page .oldschool-section-toggle__control {
  display: grid;
  place-items: center;
  width: 27px;
  height: 25px;
  color: #111 !important;
  background: #c9c9c9;
  border: 2px outset #eee;
  font: bold 17px/1 Arial, Helvetica, sans-serif;
  text-shadow: none;
}

.browser-page .oldschool-section-toggle__control:first-child {
  align-items: end;
  padding-bottom: 3px;
}

.browser-page .oldschool-section-toggle:active
  .oldschool-section-toggle__control {
  border-style: inset;
}

.browser-page .oldschool-section-content[hidden] {
  display: none !important;
}

.browser-page .oldschool-section-content {
  display: block;
}

@media (prefers-reduced-motion: reduce) {
  .browser-page .oldschool-section-toggle.has-interaction-hint {
    animation: none;
  }
}

.browser-page .breadcrumb {
  margin: 0 0 8px;
  padding: 6px 8px;
  background: #ffffcc;
  border: 1px inset #999;
  border-radius: 0;
}

.browser-page .card,
.browser-page .project-card,
.browser-page .blog-card,
.browser-page .shopware-topic-card,
.browser-page .contact-form-panel,
.browser-page .contact-aside,
.browser-page .shopware-demo-callout,
.browser-page .blog-detail-media {
  color: #000 !important;
  background: #f4f4f4 !important;
  border: 3px outset #eee !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.browser-page .card::before,
.browser-page .card::after {
  display: none;
}

.browser-page main.page-content i[class*="fa-"] {
  color: #000080 !important;
  opacity: 1 !important;
}

.browser-page main.page-content
  :where(h2, h3, h4, h5, h6)
  i[class*="fa-"],
.browser-page main.page-content .card > i[class*="fa-"],
.browser-page main.page-content
  :where(.rounded-circle, .rounded-1, .rounded-2, .rounded-3, .rounded-4)
  > i[class*="fa-"] {
  display: inline-grid !important;
  place-items: center;
  width: 54px !important;
  height: 54px !important;
  margin-right: 10px;
  color: #000 !important;
  vertical-align: middle;
  background: #d6d6d6 !important;
  border: 4px outset #eee !important;
  border-radius: 0 !important;
  line-height: 1 !important;
}

.browser-page main.page-content
  :where(.rounded-circle, .rounded-1, .rounded-2, .rounded-3, .rounded-4):has(
    > i[class*="fa-"]
  ) {
  width: auto !important;
  height: auto !important;
  padding: 0 !important;
  background: transparent !important;
  border-radius: 0 !important;
}

.browser-page main.page-content i.fa-cart-shopping::before {
  content: "🛒" !important;
}

.browser-page main.page-content
  i:is(.fa-right-left, .fa-arrow-right-arrow-left, .fa-arrows-left-right)::before {
  content: "🔌" !important;
}

.browser-page main.page-content i.fa-sliders::before {
  content: "🛠" !important;
}

.browser-page main.page-content
  i:is(.fa-globe, .fa-globe-europe, .fa-store)::before {
  content: "🌐" !important;
}

.browser-page main.page-content
  i:is(.fa-location-dot, .fa-map-marker-alt)::before {
  content: "📍" !important;
}

.browser-page main.page-content
  i:is(.fa-calendar, .fa-calendar-days)::before {
  content: "📅" !important;
}

.browser-page main.page-content i.fa-briefcase::before {
  content: "💼" !important;
}

.browser-page main.page-content
  i:is(.fa-users, .fa-user-group)::before {
  content: "👥" !important;
}

.browser-page main.page-content i.fa-envelope::before {
  content: "✉" !important;
}

.browser-page main.page-content i.fa-puzzle-piece::before {
  content: "🧩" !important;
}

.browser-page main.page-content i.fa-swatchbook::before {
  content: "🎨" !important;
}

.browser-page main.page-content i.fa-arrows-rotate::before {
  content: "🔄" !important;
}

.browser-page main.page-content
  i:is(.fa-plug, .fa-code, .fa-code-branch)::before {
  content: "🔌" !important;
}

.browser-page main.page-content
  i:is(.fa-database, .fa-server)::before {
  content: "🗄" !important;
}

.browser-page main.page-content i.fa-bug::before {
  content: "🐞" !important;
}

.browser-page main.page-content
  i:is(.fa-gauge-high, .fa-bolt)::before {
  content: "⚡" !important;
}

.browser-page main.page-content
  i:is(.fa-rocket, .fa-rocket-launch)::before {
  content: "🚀" !important;
}

.browser-page main.page-content
  i:is(
    .fa-cart-shopping,
    .fa-right-left,
    .fa-arrow-right-arrow-left,
    .fa-arrows-left-right,
    .fa-sliders,
    .fa-globe,
    .fa-globe-europe,
    .fa-store,
    .fa-location-dot,
    .fa-map-marker-alt,
    .fa-calendar,
    .fa-calendar-days,
    .fa-briefcase,
    .fa-users,
    .fa-user-group,
    .fa-envelope,
    .fa-puzzle-piece,
    .fa-swatchbook,
    .fa-arrows-rotate,
    .fa-plug,
    .fa-code,
    .fa-code-branch,
    .fa-database,
    .fa-server,
    .fa-bug,
    .fa-gauge-high,
    .fa-bolt,
    .fa-rocket,
    .fa-rocket-launch
  )::before {
  font-family:
    "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif !important;
  font-size: 27px !important;
  font-style: normal;
}

.browser-page main.page-content
  i:is(
    .fa-cart-shopping,
    .fa-right-left,
    .fa-arrow-right-arrow-left,
    .fa-arrows-left-right,
    .fa-sliders,
    .fa-globe,
    .fa-globe-europe,
    .fa-store,
    .fa-location-dot,
    .fa-map-marker-alt,
    .fa-calendar,
    .fa-calendar-days,
    .fa-briefcase,
    .fa-users,
    .fa-user-group,
    .fa-envelope,
    .fa-puzzle-piece,
    .fa-swatchbook,
    .fa-arrows-rotate,
    .fa-plug,
    .fa-code,
    .fa-code-branch,
    .fa-database,
    .fa-server,
    .fa-bug,
    .fa-gauge-high,
    .fa-bolt,
    .fa-rocket,
    .fa-rocket-launch
  )::after {
  display: none !important;
}

.browser-page main.page-content
  :where(.text-white, .text-light, [class*="text-white"]),
.browser-page main.page-content [style*="color: #fff"],
.browser-page main.page-content [style*="color:#fff"],
.browser-page main.page-content [style*="color: white"],
.browser-page main.page-content :where(.badge, [class*="badge"]) {
  color: #000 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

.browser-page main.page-content :where(.badge, [class*="badge"]) {
  background: #d6d6d6 !important;
  border: 2px outset #eee !important;
  border-radius: 0 !important;
}

.browser-page main.page-content
  :where(.badge, [class*="badge"])
  i[class*="fa-"] {
  display: inline-block !important;
  width: auto !important;
  height: auto !important;
  margin: 0 5px 0 0 !important;
  padding: 0 !important;
  color: #000080 !important;
  vertical-align: -1px;
  background: transparent !important;
  border: 0 !important;
  font-size: 14px !important;
  line-height: 1 !important;
}

.browser-page main.page-content
  :where(.badge, [class*="badge"])
  i[class*="fa-"]::before {
  font-size: 14px !important;
}

.browser-page .shopware-topic-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid #999;
  border-left: 1px solid #999;
}

.browser-page .shopware-topic-card {
  min-height: 142px;
  padding: 12px !important;
  border-width: 0 1px 1px 0 !important;
  border-style: solid !important;
  border-color: #999 !important;
  text-decoration: none !important;
}

.browser-page .shopware-topic-card__line {
  display: none !important;
}

.browser-page .shopware-topic-card__head {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 12px;
}

.browser-page .shopware-topic-card__body {
  min-width: 0;
}

.browser-page .shopware-topic-card__icon {
  display: grid !important;
  place-items: center;
  flex: 0 0 auto;
  width: 54px !important;
  height: 54px !important;
  color: #000 !important;
  background: #d6d6d6 !important;
  border: 4px outset #eee !important;
  border-radius: 0 !important;
  font: 28px/1 "Times New Roman", serif !important;
  opacity: 1 !important;
}

.browser-page .shopware-topic-card__title {
  margin: 3px 0 0;
  color: #0000ee !important;
  font: bold 17px/1.15 Arial, sans-serif !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  text-decoration: underline;
  text-transform: none !important;
}

.browser-page .shopware-topic-card__eyebrow {
  display: block;
  margin: 0 0 3px;
  color: #800000 !important;
  font: bold 11px "Courier New", monospace;
  opacity: 1 !important;
}

.browser-page .shopware-topic-card__text {
  margin: 6px 0 5px;
  color: #000 !important;
  font: 13px/1.4 Arial, sans-serif;
  opacity: 1 !important;
}

.browser-page .shopware-topic-card__cta {
  display: inline-block;
  margin: 0;
  color: #0000ee !important;
  font: bold 12px Arial, sans-serif;
  text-decoration: underline;
  opacity: 1 !important;
}

.browser-page .home-mini-grid {
  display: grid;
  gap: 10px;
}

.browser-page .home-mini-card {
  display: block;
}

.browser-page .home-mini-card__eyebrow,
.browser-page .home-mini-card__cta {
  display: block;
}

.browser-page :where(
  .btn,
  button,
  input[type="submit"],
  .hero-cta,
  .hero-cta--primary,
  .shopware-demo-callout__link,
  .contact-submit-btn
) {
  color: #000 !important;
  background: var(--silver) !important;
  border: 3px outset #eee !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font: bold 12px Arial, sans-serif;
  text-decoration: none;
}

.browser-page :where(
  .btn,
  button,
  input[type="submit"],
  .hero-cta,
  .hero-cta--primary,
  .shopware-demo-callout__link,
  .contact-submit-btn
):active {
  border-style: inset !important;
}

.browser-page :where(
  .btn,
  button,
  .hero-cta,
  .hero-cta--primary,
  .shopware-demo-callout__link,
  .contact-submit-btn
)::before,
.browser-page :where(
  .btn,
  button,
  .hero-cta,
  .hero-cta--primary,
  .shopware-demo-callout__link,
  .contact-submit-btn
)::after {
  display: none !important;
}

.browser-page .form-control,
.browser-page input,
.browser-page textarea,
.browser-page select {
  color: #000 !important;
  background: #fff !important;
  border: 2px inset #ddd !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font: 14px Arial, sans-serif;
}

.browser-page .form-control::placeholder,
.browser-page input::placeholder,
.browser-page textarea::placeholder {
  color: #555 !important;
  opacity: 1;
}

.browser-page img {
  max-width: 100%;
}

.browser-page .hero-media,
.browser-page .blog-card-media,
.browser-page .project-card__media {
  border: 2px inset #999;
  border-radius: 0 !important;
}

.browser-page .hero-media {
  position: relative;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  width: 100%;
  padding-top: 48px;
  background: #d6d6d6;
}

.browser-page .hero-speech {
  position: absolute;
  top: 12px;
  left: 50%;
  z-index: 5;
  width: max-content;
  max-width: calc(100% - 24px);
  padding: 5px 9px;
  text-align: center;
  background: #ffffcc;
  border: 2px outset #eee;
  transform: translateX(-50%);
}

.browser-page .hero-speech__label {
  display: none;
}

.browser-page .hero-speech__text {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  white-space: normal;
}

.browser-page .hero-media > img {
  display: block;
  width: min(64%, 420px) !important;
  height: auto !important;
  margin: 12px auto 0;
  object-fit: contain;
}

.browser-page .contact-aside {
  display: grid;
  gap: 8px;
  width: 100%;
  padding: 12px !important;
}

.browser-page .contact-aside-list {
  margin: 0;
}

.browser-page .contact-aside-link {
  min-height: 28px;
  font-size: 13px;
}

.browser-page .contact-aside-classic-icon {
  display: inline-grid;
  place-items: center;
  flex: 0 0 31px;
  width: 31px;
  height: 31px;
  color: #000080 !important;
  background: #d6d6d6;
  border: 3px outset #eee;
  font: bold 20px/1 "Times New Roman", serif;
  text-decoration: none !important;
}

.browser-page .contact-aside-divider {
  width: 100%;
  margin: 4px 0 !important;
  border-top: 1px dotted #777 !important;
}

.browser-page .contact-aside-qr {
  display: block !important;
  width: 132px !important;
  height: 132px !important;
  margin: 2px auto 0;
  padding: 4px;
  background: #fff;
  border: 3px outset #eee !important;
}

.browser-page .contact-aside-qr img {
  display: block;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}

.browser-page .qr-scan-overlay {
  display: none !important;
}

.browser-page .contact-aside-qr-note {
  margin: 0 0 5px !important;
  text-align: center;
  font-size: 11px !important;
}

.browser-page .contact-aside-list:last-child {
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 10px !important;
  padding: 7px;
  background: #fff;
  border: 1px inset #999;
}

.browser-page .contact-aside-list:last-child li {
  margin: 0;
}

.browser-page .contact-aside-list:last-child .contact-aside-link {
  display: inline-flex !important;
  align-items: center;
  gap: 7px !important;
  min-height: 36px;
  padding: 4px 8px;
  color: #0000ee !important;
  background: #d6d6d6 !important;
  border: 2px outset #eee !important;
  text-decoration: none !important;
}

.browser-page .contact-aside-brand-icon {
  display: grid;
  place-items: center;
  flex: 0 0 27px;
  width: 27px;
  height: 27px;
  margin: 0;
  padding: 2px;
  background: #fff;
  border: 2px inset #aaa;
}

.browser-page .contact-aside-brand-icon .contact-aside-icon {
  width: auto !important;
  height: auto !important;
  margin: 0;
  padding: 0;
  color: #000080 !important;
  background: transparent;
  border: 0;
  font-size: 16px !important;
  line-height: 1;
}

.browser-page .contact-aside-malt {
  display: block;
  width: 19px !important;
  height: 19px !important;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  object-fit: contain;
  filter: invert(1);
}

.browser-page .contact-aside-link--malt {
  position: static !important;
}

.browser-page .contact-aside-link--malt::after {
  display: none !important;
}

.footer {
  padding: 0 7px 14px !important;
  color: #000 !important;
  background: #d6d6d6 !important;
  border: 0 !important;
}

.footer .container-fluid {
  padding-top: 8px;
}

.footer .row {
  --bs-gutter-x: 0.75rem;
}

.footer p,
.footer span {
  color: #000 !important;
  font-size: 11px;
}

.footer a {
  color: var(--blue) !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  text-decoration: underline;
}

.footer .partner-logo svg {
  max-width: 120px;
  opacity: 1;
}

.footer .partner-logo .hubyte-text {
  fill: #15171b !important;
}

.footer .partner-logo .hubyte-box {
  fill: #1b67be !important;
}

.cookie-consent {
  z-index: 2000;
  pointer-events: none;
  font-family: Arial, Helvetica, sans-serif;
}

.cookie-consent.is-open {
  pointer-events: auto;
}

.cookie-consent__panel {
  width: min(790px, calc(100% - 1rem));
  grid-template-columns: minmax(0, 1fr) minmax(180px, 230px);
  gap: 12px;
  color: #000;
  background: var(--silver);
  border: 3px outset #eee;
  border-radius: 0;
  box-shadow: 8px 8px 0 rgba(0, 0, 0, 0.45);
}

.cookie-consent__title {
  margin: 0 0 6px;
  padding: 4px 6px;
  color: #fff;
  background: var(--navy);
  font: bold 14px Arial, sans-serif;
}

.cookie-consent__text,
.cookie-consent__category {
  color: #000;
}

.cookie-consent__categories {
  gap: 8px 16px;
  margin-top: 10px;
}

.cookie-consent__category {
  gap: 5px;
}

.cookie-consent__switch {
  width: 42px;
  height: 20px;
}

.cookie-consent__slider {
  inset: 0;
  cursor: pointer;
  background: #fff;
  border: 2px inset #ddd;
}

.cookie-consent__slider::before {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 12px;
  height: 12px;
  background: #800000;
  content: "";
}

.cookie-consent__switch input:checked + .cookie-consent__slider::before {
  left: 24px;
  background: #008000;
}

.conversion-topbar {
  z-index: 1085;
  color: #fff !important;
  background: var(--navy) !important;
  border-bottom: 2px outset #fff !important;
  font: bold 11px "Courier New", monospace;
}

.conversion-topbar a,
.conversion-topbar span,
.conversion-topbar i {
  color: #fff !important;
}

body.has-conversion-topbar {
  padding-top: 64px;
}

.cookie-consent :where(button, .btn) {
  color: #000 !important;
  background: var(--silver) !important;
  border: 3px outset #eee !important;
  border-radius: 0 !important;
}

.cookie-consent :where(button, .btn):hover,
.floating-action:hover {
  color: #000 !important;
  background: var(--silver) !important;
  border-color: #eee !important;
}

.floating-action {
  color: #000 !important;
  background: var(--silver) !important;
  border: 3px outset #eee !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.floating-chatbot {
  position: fixed !important;
  right: 10px;
  bottom: 38px;
  z-index: 24;
  display: block;
  width: auto !important;
  height: auto !important;
  padding: 7px 10px;
  color: #000 !important;
  background: var(--silver);
  border: 3px outset #eee;
  font: bold 11px Arial, sans-serif;
  text-decoration: none;
}

.floating-chatbot--left {
  right: auto;
  left: 10px;
}

.floating-chatbot__robot {
  display: none;
}

.floating-chatbot::after {
  content: "E-MAIL";
}

.floating-actions {
  position: fixed;
  right: 10px;
  bottom: 72px;
  z-index: 1200;
}

.floating-action {
  display: grid !important;
  place-items: center;
  width: 38px;
  height: 34px;
  padding: 0;
}

.floating-action--top {
  opacity: 0;
  pointer-events: none;
}

.floating-action--top.is-visible {
  opacity: 1;
  pointer-events: auto;
}

.cosmic-scroll-top__slider > :not(.cosmic-scroll-top__orb),
.cosmic-scroll-top__ring,
.cosmic-scroll-top__inner-orb {
  display: contents;
}

.accessibility-orbit {
  position: relative;
  margin-bottom: 5px;
}

.accessibility-orbit__actions {
  position: absolute;
  right: 44px;
  bottom: 0;
  display: none;
  grid-auto-flow: column;
  gap: 4px;
}

.accessibility-orbit.is-open .accessibility-orbit__actions {
  display: grid;
}

.accessibility-orbit__submenu {
  position: absolute;
  right: 0 !important;
  bottom: 42px;
  top: auto !important;
  display: none;
  gap: 4px;
  width: max-content;
}

.accessibility-orbit__submenu.is-visible {
  display: flex;
}

.accessibility-orbit__option {
  min-width: 38px;
  min-height: 34px;
  padding: 5px 7px;
  color: #000;
  background: var(--silver);
  border: 3px outset #eee;
}

.accessibility-orbit__option.is-active {
  border-style: inset;
}

.accessibility-mask {
  position: fixed;
  left: 0;
  z-index: 1500;
  width: 100%;
  pointer-events: none;
  background: rgba(0, 0, 0, 0.72);
  opacity: 0;
}

.accessibility-mask--top {
  top: 0;
  height: max(calc(var(--a11y-mask-y, 50vh) - 80px), 0px);
}

.accessibility-mask--bottom {
  top: calc(var(--a11y-mask-y, 50vh) + 80px);
  bottom: 0;
}

body.a11y-reading-mask .accessibility-mask {
  opacity: 1;
}

html.a11y-font-large {
  font-size: 112.5%;
}

html.a11y-font-xlarge {
  font-size: 125%;
}

body.a11y-hide-images img {
  visibility: hidden !important;
}

.status-modal {
  z-index: 2100;
  padding: 15px;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  background: rgba(0, 0, 0, 0.35);
}

.status-modal.active {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}

.status-modal__glass {
  gap: 10px;
  max-width: 520px;
  padding: 12px;
  color: #000;
  background: var(--silver);
  border: 3px outset #eee;
}

.status-modal__icon {
  width: 32px;
  height: 32px;
}

.status-modal__text {
  margin: 0;
  color: #000 !important;
}

.status-modal--success .status-modal__icon {
  color: #008000;
}

.status-modal--error .status-modal__icon {
  color: #800000;
}

@media (min-width: 992px) {
  .oldschool-navbar .navbar-collapse {
    display: block !important;
  }
}

@media (max-width: 991.98px) {
  .oldschool-navbar .navbar-collapse {
    padding-top: 4px;
  }

  .oldschool-navbar .navbar-nav {
    grid-template-columns: 1fr 1fr;
  }

  .oldschool-navbar .dropdown-menu {
    position: static !important;
    transform: none !important;
  }
}

@media (max-width: 650px) {
  body.has-conversion-topbar {
    padding-top: 43px;
  }

  .browser-page .shopware-topic-grid {
    grid-template-columns: 1fr;
  }

  .oldschool-brand {
    font-size: clamp(24px, 8vw, 34px);
  }

  .page-columns > main,
  .page-columns > section {
    order: -1;
  }

  .browser-page .section-shell,
  .browser-page .legal-page-content,
  .browser-page .page-content > .container,
  .browser-page .layout-section > .container > .section-shell {
    padding: 9px !important;
  }

  .browser-page .hero-media > img {
    width: min(76%, 340px) !important;
  }

  .browser-page .contact-aside-qr {
    width: 112px !important;
    height: 112px !important;
  }

  .browser-page .contact-aside-list:last-child {
    flex-wrap: wrap;
    gap: 10px !important;
  }

  .browser-page .row {
    --bs-gutter-x: 0.75rem;
  }

  .footer .row > div {
    width: 100%;
    margin-bottom: 7px;
    text-align: center !important;
  }

  .cookie-consent__panel {
    grid-template-columns: 1fr;
  }

  .floating-chatbot {
    right: 5px;
    bottom: 35px;
  }
}