/* ============================================================
   ИНЖЕНЕРНЫЙ ФОН — спокойный, за секциями
   ============================================================ */

.engineer-bg {
  position: fixed;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}

/* ---------- Крупные пунктирные окружности ---------- */
.engineer-bg__circle {
  position: absolute;
  border: 2px dashed rgba(47, 112, 229, 0.55);
  border-radius: 50%;
  will-change: transform;
}
.engineer-bg__circle::before {
  content: "";
  position: absolute;
  inset: 14%;
  border: 1.2px solid rgba(47, 112, 229, 0.32);
  border-radius: 50%;
}
.engineer-bg__circle::after {
  content: "";
  position: absolute;
  inset: 30%;
  border: 1.2px dashed rgba(47, 112, 229, 0.26);
  border-radius: 50%;
}
.engineer-bg__circle--1 {
  width: 800px; height: 800px;
  top: -220px; right: -280px;
  animation: engineerRotate 90s linear infinite, engineerDrift1 25s ease-in-out infinite;
}
.engineer-bg__circle--2 {
  width: 620px; height: 620px;
  bottom: -180px; left: -220px;
  animation: engineerRotate 70s linear infinite reverse, engineerDrift2 30s ease-in-out infinite;
}
@keyframes engineerRotate {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}
@keyframes engineerDrift1 {
  0%, 100% { transform: translate(0, 0); }
  50%      { transform: translate(-40px, 30px); }
}
@keyframes engineerDrift2 {
  0%, 100% { transform: translate(0, 0); }
  50%      { transform: translate(35px, -25px); }
}

/* ---------- Три ромба под 45° ---------- */
.engineer-bg__diamond {
  position: absolute;
  border: 1.2px solid rgba(47, 112, 229, 0.22);
  will-change: transform;
}

/* Ромб 1 — слева сверху, плавно вверх-вниз */
.engineer-bg__diamond--1 {
  width: 160px; height: 160px;
  top: 14%; left: 5%;
  animation: engineerDiamondUpDown1 12s ease-in-out infinite;
}

/* Ромб 2 — справа снизу, плавно вниз-вверх */
.engineer-bg__diamond--2 {
  width: 200px; height: 200px;
  top: 60%; right: 7%;
  animation: engineerDiamondUpDown2 16s ease-in-out infinite;
}

/* Ромб 3 — пунктирный, вращается */
.engineer-bg__diamond--3 {
  width: 160px; height: 160px;
  bottom: 30%; left: 45%;
  border-style: dashed;
  border-width: 2px;
  border-color: rgba(0, 212, 255, 0.65);
  animation: engineerDiamondSpin 40s linear infinite;
}

@keyframes engineerDiamondUpDown1 {
  0%, 100% { transform: rotate(45deg) translateY(0); }
  50%      { transform: rotate(45deg) translateY(-35px); }
}
@keyframes engineerDiamondUpDown2 {
  0%, 100% { transform: rotate(45deg) translateY(0); }
  50%      { transform: rotate(45deg) translateY(40px); }
}
@keyframes engineerDiamondSpin {
  from { transform: rotate(45deg); }
  to   { transform: rotate(405deg); }
}

/* ---------- Маркеры «+» ---------- */
.engineer-bg__plus {
  position: absolute;
  width: 18px;
  height: 18px;
  animation: engineerPlus 5s ease-in-out infinite;
}
.engineer-bg__plus::before,
.engineer-bg__plus::after {
  content: "";
  position: absolute;
  background: var(--blue);
}
.engineer-bg__plus::before {
  top: 50%; left: 0; right: 0;
  height: 1px;
  transform: translateY(-50%);
}
.engineer-bg__plus::after {
  left: 50%; top: 0; bottom: 0;
  width: 1px;
  transform: translateX(-50%);
}
@keyframes engineerPlus {
  0%, 100% { opacity: 0.35; transform: scale(1); }
  50%      { opacity: 0.75; transform: scale(1.25); }
}

/* ---------- Технические подписи ---------- */
.engineer-bg__label {
  position: absolute;
  color: rgba(47, 112, 229, 0.7);
  font-family: "Montserrat", Arial, sans-serif;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  white-space: nowrap;
  animation: engineerLabel 8s ease-in-out infinite;
}
.engineer-bg__label--dot {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.engineer-bg__label--dot::before {
  content: "";
  width: 5px;
  height: 5px;
  background: var(--blue);
  border-radius: 50%;
  opacity: 0.6;
}
@keyframes engineerLabel {
  0%, 100% { opacity: 0.75; }
  50%      { opacity: 1; }
}

/* ---------- Скан-линия ---------- */
.engineer-bg__hline {
  position: absolute;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(47, 112, 229, 0.45) 50%,
    transparent 100%
  );
  animation: engineerScan 24s linear infinite;
}
@keyframes engineerScan {
  0%   { top: -10%; opacity: 0; }
  5%   { opacity: 1; }
  95%  { opacity: 1; }
  100% { top: 110%; opacity: 0; }
}

/* ---------- Мобильный ---------- */
@media (max-width: 768px) {
  .engineer-bg__circle--1 { width: 480px; height: 480px; top: -140px; right: -180px; }
  .engineer-bg__circle--2 { width: 380px; height: 380px; }
  .engineer-bg__diamond--2 { width: 140px; height: 140px; }
  .engineer-bg__diamond--3 { display: none; }
  .engineer-bg__label { font-size: 9px; letter-spacing: 1.5px; }
}