İlk Dersimiz Bayrak Sevgisi Kodu:

<div class="flag-wrapper">
  <div class="flag">
    <div class="crescent">
      <div class="crescent-cut"></div>
    </div>
    <div class="star"></div>
  </div>
</div>

<style>
.flag-wrapper {
  display: flex;
  justify-content: center;
  margin: 40px 0;
}

.flag {
  position: relative;
  width: 420px;
  height: 280px;
  background: #E30A17;
  box-shadow: 0 20px 40px rgba(0,0,0,0.35);
  animation: wave 4s infinite ease-in-out;
}

/* Dalgalanma */
@keyframes wave {
  0% { transform: skewY(0deg); }
  50% { transform: skewY(-1.2deg); }
  100% { transform: skewY(0deg); }
}

/* Ay */
.crescent {
  position: absolute;
  width: 140px;
  height: 140px;
  background: white;
  border-radius: 50%;
  top: 70px;
  left: 90px;
}

.crescent-cut {
  position: absolute;
  width: 110px;
  height: 110px;
  background: #E30A17;
  border-radius: 50%;
  top: 15px;
  left: 35px;
}

/* Yıldız (CSS ile) */
.star {
  position: absolute;
  width: 70px;
  height: 70px;
  background: white;
  clip-path: polygon(
    50% 0%,
    61% 35%,
    98% 35%,
    68% 57%,
    79% 91%,
    50% 70%,
    21% 91%,
    32% 57%,
    2% 35%,
    39% 35%
  );
  top: 105px;
  left: 210px;
}
</style>