:root {
  color-scheme: light;
  --page-bg: #fbf8ef;
  --frame: #e9e2d3;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  background: var(--page-bg);
  font-family: Arial, Helvetica, sans-serif;
  padding: 42px 32px;
}

.landing {
  width: min(100%, 1380px);
  margin: 0 auto;
  overflow: hidden;
  background: #fffaf0;
  box-shadow: 0 0 0 1px var(--frame);
  border-radius: 14px;
}

.slice {
  position: relative;
  margin: 0;
  line-height: 0;
  font-size: 0;
}

.slice img {
  display: block;
  width: 100%;
  height: auto;
  user-select: none;
  margin-top: -1px;
}

.hotspot {
  position: absolute;
  z-index: 2;
}

.hotspot {
  display: block;
  border-radius: 12px;
}

.nav-home {
  left: 36.3%;
  top: 7.4%;
  width: 5.6%;
  height: 4.5%;
}

.nav-solutions {
  left: 43.2%;
  top: 7.4%;
  width: 7.2%;
  height: 4.5%;
}

.nav-how {
  left: 51.5%;
  top: 7.4%;
  width: 12%;
  height: 4.5%;
}

.nav-about {
  left: 63.8%;
  top: 7.4%;
  width: 8.8%;
  height: 4.5%;
}

.nav-contact {
  left: 72.2%;
  top: 6.9%;
  width: 8.7%;
  height: 5.2%;
}

.nav-consultant {
  left: 81.6%;
  top: 4.8%;
  width: 16.7%;
  height: 6.8%;
}

.hero-solution {
  left: 6.2%;
  top: 77.1%;
  width: 19.6%;
  height: 7.6%;
}

.hero-consultant {
  left: 27.1%;
  top: 77.1%;
  width: 22.8%;
  height: 7.6%;
}

.contact-anchor {
  position: absolute;
  top: 58%;
  left: 0;
}

.contact-form {
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
}

.contact-form label,
.contact-form button {
  position: absolute;
  pointer-events: auto;
}

.contact-form label span {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.contact-form label:nth-child(1) {
  left: 44.72%;
  top: 58.22%;
  width: 23.34%;
  height: 5.52%;
}

.contact-form label:nth-child(2) {
  left: 69.08%;
  top: 58.22%;
  width: 23.34%;
  height: 5.52%;
}

.contact-form label:nth-child(3) {
  left: 44.84%;
  top: 65.40%;
  width: 23.34%;
  height: 5.52%;
}

.contact-form label:nth-child(4) {
  left: 69.08%;
  top: 65.40%;
  width: 23.34%;
  height: 5.52%;
}

.contact-form .message-field {
  left: 45.26%;
  top: 72.35%;
  width: 47.40%;
  height: 11.00%;
}

.contact-form input,
.contact-form textarea {
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #1f2a2d;
  font: 500 clamp(8px, 0.9vw, 16px) Arial, Helvetica, sans-serif;
  line-height: 1.2;
  outline: none;
  padding: 0 5.4%;
  box-shadow: none;
  caret-color: #103f25;
}

.contact-form textarea {
  resize: none;
  padding-top: 2.7%;
}

.contact-form label:nth-child(1) input {
  padding-left: 23%;
}

.contact-form label:nth-child(2) input {
  padding-left: 25%;
}

.contact-form label:nth-child(3) input {
  padding-left: 33%;
}

.contact-form label:nth-child(4) input {
  padding-left: 28%;
}

.contact-form .message-field textarea {
  padding-left: 15%;
}

.contact-form input:focus,
.contact-form textarea:focus {
  box-shadow: none;
}

.contact-form input::placeholder,
.contact-form textarea::placeholder {
  color: #6d737b;
}

.contact-form .form-submit {
  left: 74.5%;
  top: 86.50%;
  width: 17.75%;
  height: 6.15%;
  border: 0;
  border-radius: 11px;
  background: transparent;
  color: transparent;
  cursor: pointer;
}

.footer-admin-link {
  left: 5.6%;
  top: 27%;
  width: 31%;
  height: 34%;
  border-radius: 0;
}

.footer-privacy-link {
  left: 63%;
  top: 78%;
  width: 18%;
  height: 12%;
  border-radius: 4px;
}

@media (max-width: 760px) {
  body {
    padding: 0;
  }

  .landing {
    width: 100%;
    border-radius: 0;
    box-shadow: none;
  }
}