/* A restrained engineering-management blueprint layer for the homepage hero. */
.home-main .class-field::before {
  content: "";
  position: absolute;
  top: 14%;
  right: 7vw;
  width: clamp(160px, 18vw, 260px);
  aspect-ratio: 1.46;
  border: 1px solid color-mix(in srgb, var(--cobalt) 25%, transparent);
  background-image:
    linear-gradient(color-mix(in srgb, var(--cobalt) 12%, transparent) 1px, transparent 1px),
    linear-gradient(90deg, color-mix(in srgb, var(--cobalt) 12%, transparent) 1px, transparent 1px);
  background-size: 24px 24px;
  opacity: .42;
  transform: perspective(680px) rotateY(-17deg) rotateX(7deg);
  transform-origin: right center;
  animation: blueprint-drift 14s ease-in-out infinite;
}

.home-main .class-field::after {
  content: "BIM  /  PLAN  /  FIELD";
  position: absolute;
  top: calc(14% + clamp(116px, 12vw, 178px));
  right: 7vw;
  color: color-mix(in srgb, var(--cobalt) 56%, transparent);
  font: 700 8px/1 ui-monospace, Consolas, monospace;
  letter-spacing: .16em;
  opacity: .62;
  transform: translateX(9px);
}

@keyframes blueprint-drift {
  0%, 100% {
    opacity: .32;
    transform: perspective(680px) rotateY(-17deg) rotateX(7deg) translate3d(0, 0, 0);
  }
  50% {
    opacity: .48;
    transform: perspective(680px) rotateY(-14deg) rotateX(8deg) translate3d(-5px, 4px, 0);
  }
}

/* Turn the existing class-project mark into a small professional title block. */
.home-main .field-project::before {
  content: "ENGINEERING MANAGEMENT  /  CLASS ARCHIVE";
  font-size: 8px;
  letter-spacing: .13em;
}

.home-main .field-project::after {
  content: "规划  ·  协作  ·  落地   /   工管 25-2";
  letter-spacing: .09em;
}

@media (max-width: 1100px) and (min-width: 769px) {
  .home-main .class-field::before {
    right: 5vw;
    width: 190px;
  }

  .home-main .class-field::after {
    top: calc(14% + 135px);
    right: 5vw;
  }
}

@media (max-width: 768px) {
  .home-main .class-field::before,
  .home-main .class-field::after {
    display: none;
  }

  .home-main .field-project::before {
    font-size: 7px;
    letter-spacing: .08em;
  }

  .home-main .field-project::after {
    letter-spacing: .02em;
  }
}

@media (prefers-reduced-motion: reduce) {
  .home-main .class-field::before {
    animation: none;
  }
}
