/* Orthographic projections sit along the sheet edges, with undistorted axes. */
.gromko-preview :is(.engineering, .projects, .services-overview, .team-section, .stage-design-page) {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  --projection-unit: clamp(1.25px, .16vw, 2.2px);
  --projection-opacity: .19;
}
.gromko-preview .screen-atmosphere {
  position: absolute;
  inset: 0;
  z-index: 1;
  overflow: hidden;
  pointer-events: none;
  user-select: none;
}
.gromko-preview .screen-drawing-light {
  position: absolute;
  top: -280px;
  right: -180px;
  width: 880px;
  height: 640px;
  border-radius: 50%;
  background: radial-gradient(ellipse, #9fb0c112, #69788908 38%, transparent 70%);
  filter: blur(28px);
}
.gromko-preview .screen-blueprint {
  position: absolute;
  display: block;
  width: calc(var(--projection-unit) * var(--projection-units));
  height: calc(var(--projection-unit) * var(--projection-units) * var(--projection-ratio));
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  filter: grayscale(1) invert(1);
  mix-blend-mode: screen;
  opacity: var(--projection-opacity);
}
.gromko-preview .projection-front {
  top: 135px;
  right: -28px;
  mask-image: linear-gradient(90deg, transparent, #000 28%, #000 90%, transparent);
}
.gromko-preview .projection-side {
  top: 440px;
  right: -140px;
  mask-image: linear-gradient(90deg, transparent, #000 46%, #000);
}
.gromko-preview .projection-plan {
  bottom: 18px;
  left: -175px;
  opacity: calc(var(--projection-opacity) * .7);
  mask-image: linear-gradient(90deg, #000, #000 33%, transparent 86%);
}
.gromko-preview .projects { --projection-opacity: .23; }
.gromko-preview .services-overview .projection-front { top: -80px; right: -70px; }
.gromko-preview .services-overview .projection-plan { left: -200px; bottom: 8px; }
.gromko-preview .team-section .projection-plan { left: -1050px; }
.gromko-preview :is(.projects-heading, .services-heading, .closing-heading, .project-grid, .service-grid, .team-grid, .projects-more, .engineering-top, .steps, .approach-carousel, .contacts-content, .home-footer) {
  position: relative;
  z-index: 2;
}
.gromko-preview .about-body, .gromko-preview .hero .play { z-index: 2; }
@media (max-width: 760px) {
  .gromko-preview :is(.engineering, .projects, .services-overview, .team-section, .stage-design-page) {
    --projection-unit: 1.35px;
    --projection-opacity: .11;
  }
  .gromko-preview .projection-front { top: 145px; right: -195px; }
  .gromko-preview .projection-side { right: -165px; top: 530px; }
  .gromko-preview .projection-plan { left: -205px; bottom: 10px; }
  .gromko-preview .services-overview .projection-front { top: 140px; right: -215px; }
  .gromko-preview .services-overview .projection-plan { left: -195px; }
  .gromko-preview .team-section .projection-plan { left: -850px; }
  .gromko-preview .screen-drawing-light { width: 540px; right: -310px; opacity: .65; }
}
.gromko-preview .engineering .projection-front { --projection-units: 210; --projection-ratio: 0.6571428571428571; background-image: url("/assets/media/ea90057efa96f813fffa0a9a.svg"); }
.gromko-preview .engineering .projection-side { --projection-units: 172; --projection-ratio: 0.7582417582417582; background-image: url("/assets/media/5899cd6226caf82c4c94136f.svg"); }
.gromko-preview .engineering .projection-plan { --projection-units: 210; --projection-ratio: 0.8622448979591837; background-image: url("/assets/media/a52c4ecc462e865775851a9b.svg"); }
.gromko-preview .projects .projection-front { --projection-units: 210; --projection-ratio: 0.5375; background-image: url("/assets/media/585fcc796f8e4e446079e2c5.svg"); }
.gromko-preview .projects .projection-side { --projection-units: 148.45; --projection-ratio: 0.7096774193548387; background-image: url("/assets/media/d6ff6a52679115a3d350f97d.svg"); }
.gromko-preview .projects .projection-plan { --projection-units: 210; --projection-ratio: 0.7094017094017094; background-image: url("/assets/media/a3278610c95d3fc526f62b90.svg"); }
.gromko-preview .services-overview .projection-front { --projection-units: 210; --projection-ratio: 1.3825503355704698; background-image: url("/assets/media/bc0c24f7e837458c30030200.svg"); }
.gromko-preview .services-overview .projection-side { display: none; }
.gromko-preview .services-overview .projection-plan { --projection-units: 210; --projection-ratio: 0.8786407766990292; background-image: url("/assets/media/e2bf2485310a325302a5f1be.svg"); }
.gromko-preview .team-section .projection-front { --projection-units: 180; --projection-ratio: 0.6538461538461539; background-image: url("/assets/media/d27621ea6c60c05b101c3c5d.svg"); }
.gromko-preview .team-section .projection-side { display: none; }
.gromko-preview .team-section .projection-plan { --projection-units: 747.35; --projection-ratio: 0.3048543689320388; background-image: url("/assets/media/3e767d7866b41792bebb5f93.svg"); }
