.spy-man{
    font-size: 4rem;
}

.cerb-text{
    padding: 0rem 1.5rem 1.5rem 1.5rem;
    font-size: 1.8rem;
    font-weight: 500;
}

.cerb-side-bloc{
    width: 80%;
    margin: auto;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.cerb {
  display: inline-block;
  width: 50%;
  max-width: 1500px;
  max-height: 600px;
  aspect-ratio: 1;
}

.cerb-shape {
  width: 100%;
  height: 100%;
  background-image: linear-gradient(-45deg, #ba71ff, #ff71b8);

  /* Inset */
  clip-path: inset(40px);
  clip-path: inset(40px 20px);
  clip-path: inset(40px 20px 40% 50px);
  clip-path: inset(40px 20px round 15% 0);

  /* Circle */
  clip-path: circle(50px);
  clip-path: circle(50% at center);
  clip-path: circle(25% at 25%);
  clip-path: circle(25% at 0 0);
  clip-path: circle(60%);

  /* Ellipse */
  clip-path: ellipse(50px 80px);
  clip-path: ellipse(80px 40px at center);
  clip-path: ellipse(80px 40px at 40px 20px);

  /* Polygon */
  /* polygon(X0 Y0, X1 Y1 ... Xn Yn); */
  clip-path: polygon(100px 20px, 10px 170px, 180px 80px);
  clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%);

  /* Hexagon */
  clip-path: polygon(0% 25%, 0% 75%, 50% 100%, 100% 75%, 100% 25%, 50% 0%);
  clip-path: polygon(-50% 50%, 50% 100%, 150% 50%, 50% 0);

  /* Octagon */
  clip-path: polygon(
    0% 25%,
    0% 75%,
    25% 100%,
    75% 100%,
    100% 75%,
    100% 25%,
    75% 0%,
    25% 0%
  );
  clip-path: polygon(-25 50%, 50% -25%, 125% 50%, 50% -25%);
}

/* Animate clip-path */
.cerb-animat .cerb-shape {
  background: url('/images/cerb-lupa-3.jpg');
  background-size: cover;
  background-repeat: no-repeat;
  animation: animate 4s infinite alternate;
}

@media (max-width: 960px){
    .cerb-text{
        font-size: 1.2rem;
    }
    .cerb-side-bloc{
        flex-direction: column;
        width: 100%;
    }
}

@keyframes animate {
  0% {
    clip-path: circle(100% at 50% 50%);
  }

  25% {
    clip-path: circle(25% at 50% 50%);
  }

  50% {
    clip-path: circle(25% at 20% 80%);
  }

  75% {
    clip-path: circle(25% at 90% 50%);
  }

  100% {
    clip-path: circle(25% at 10% 10%);
  }
}