body {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 105vh;
  background: #f2b03c;
  margin: 0;
  font-family: Britannic;
}
.particle-deconstruct-container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 150vh;
  background: #0f0f0f;
}

.particle-deconstruct-element {
  width: 1792px;
  height: 1024px;
  background-image: url("/Image/fototrail.png");
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  overflow: hidden;
}

.particle-deconstruct-element h2 {
  color: #ed3b0f;
  font-size: 7rem;
  position: relative;
  z-index: 2;
  transition: all 0.6s ease;
}

.particle-deconstruct-element::before,
.particle-deconstruct-element::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: repeating-radial-gradient(circle at center, #c8b138 1px, transparent 4px, transparent 5px);
  opacity: 0;
  transition: all 0.5s ease;
}

.particle-deconstruct-element:hover h2 {
  transform: scale(2) rotate(360deg);
  opacity: 0;
}

.particle-deconstruct-element:hover::before {
  transform: scale(2) rotate(90deg);
  opacity: 0.3;
}

.particle-deconstruct-element:hover::after {
  transform: scale(2) rotate(-45deg);
  opacity: 0%;
}
