:root {
  --bg-ink: #111214;
  --bg-white: #ffffff;
  --bg-yellow: #e7a400;
  --bg-yellow-strong: #f5b317;
  --bg-muted: rgba(24, 26, 29, 0.66);
  --bg-line: rgba(24, 26, 29, 0.18);
}

body {
  background: #ffffff;
  color: var(--bg-ink);
}

.eng-bg--white {
  background: #e8ecef;
  color: var(--bg-ink);
  scroll-margin-top: 76px;
}

.eng-bg--white .eng-bg__layer--drawing {
  background: #e8ecef;
}

.eng-bg--white .eng-bg__layer--drawing img.is-loaded {
  opacity: 0.52;
  filter: grayscale(1) contrast(1.28) brightness(1.18);
}

.eng-bg--white .eng-bg__layer--drawing::after {
  background-image:
    linear-gradient(rgba(24, 26, 29, 0.1) 1px, transparent 1px),
    linear-gradient(90deg, rgba(24, 26, 29, 0.1) 1px, transparent 1px),
    linear-gradient(rgba(24, 26, 29, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(24, 26, 29, 0.035) 1px, transparent 1px);
}

.eng-bg--white .eng-bg__layer--model img {
  filter: grayscale(0.72) contrast(1.08) brightness(1.06);
}

.eng-bg--white .eng-bg__layer--model::after {
  background:
    linear-gradient(125deg, rgba(245, 179, 23, 0.14), transparent 44%),
    repeating-linear-gradient(32deg, transparent 0 56px, rgba(24, 26, 29, 0.075) 57px 58px);
}

.eng-bg--white .eng-bg__layer--final img {
  filter: saturate(0.72) contrast(0.96) brightness(1.08);
}

.eng-bg--white .eng-bg__shade,
.eng-bg--white[data-stage="0"] .eng-bg__shade {
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.78) 0%, rgba(255, 255, 255, 0.58) 39%, rgba(255, 255, 255, 0.1) 72%, rgba(255, 255, 255, 0.3) 100%),
    linear-gradient(0deg, rgba(255, 255, 255, 0.65) 0%, rgba(255, 255, 255, 0.04) 44%, rgba(255, 255, 255, 0.22) 100%);
}

.eng-bg--white .eng-bg__grid {
  opacity: 0.48;
  background-image:
    linear-gradient(rgba(24, 26, 29, 0.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(24, 26, 29, 0.08) 1px, transparent 1px);
}

.eng-bg--white .eng-bg__topline {
  color: rgba(24, 26, 29, 0.68);
}

.eng-bg--white .eng-bg__lead {
  color: rgba(24, 26, 29, 0.78);
}

.eng-bg--white .eng-bg__sequence {
  border-color: rgba(255, 255, 255, 0.24);
  background: rgba(17, 18, 20, 0.7);
  color: #ffffff;
  box-shadow: 0 18px 44px rgba(24, 26, 29, 0.18);
  backdrop-filter: blur(14px);
}

.eng-bg--white .eng-bg__sequence-head {
  border-color: rgba(255, 255, 255, 0.18);
}

.eng-bg--white .eng-bg__sequence-head span {
  color: rgba(255, 255, 255, 0.66);
}

.eng-bg--white .eng-bg__sequence-head button {
  border-color: rgba(255, 255, 255, 0.34);
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
}

.eng-bg--white .eng-bg__tabs button {
  border-color: rgba(255, 255, 255, 0.18);
  color: rgba(255, 255, 255, 0.58);
}

.eng-bg--white .eng-bg__tabs button:hover,
.eng-bg--white .eng-bg__tabs button.is-active {
  color: #ffffff;
}

.eng-bg--white .eng-bg__provisional {
  color: rgba(255, 255, 255, 0.54);
}

.eng-bg--white .eng-bg__capabilities {
  width: 100vw;
  margin-right: calc(50% - 50vw);
  margin-left: calc(50% - 50vw);
  border-color: rgba(255, 255, 255, 0.18);
  background: #000000;
  color: #ffffff;
  box-shadow: 0 -14px 38px rgba(24, 26, 29, 0.16);
  backdrop-filter: blur(14px);
}

.eng-bg--white .eng-bg__capabilities article {
  border-color: rgba(255, 255, 255, 0.18);
}

.eng-bg--white .eng-bg__capabilities p {
  color: rgba(255, 255, 255, 0.68);
}

@media (max-width: 620px) {
  .eng-bg--white .eng-bg__shade,
  .eng-bg--white[data-stage="0"] .eng-bg__shade {
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.72) 48%, rgba(255, 255, 255, 0.84) 100%),
      linear-gradient(90deg, rgba(255, 255, 255, 0.66), rgba(255, 255, 255, 0.2));
  }

  .eng-bg--white .eng-bg__sequence {
    background: rgba(17, 18, 20, 0.76);
  }

  .eng-bg--white .eng-bg__capabilities {
    background: #000000;
  }
}