

body.gece.zemin-acik .hm-renkli-sahne .ff-how__link {
  display: none;
}


body.gece.zemin-acik .hm-renkli-sahne--kurum .ff-how__step:nth-of-type(1) .ff-how__art {
  background: linear-gradient(125deg, #0f766e 0%, #0f766e 30%, #14b8a6 100%);
}

body.gece.zemin-acik .hm-renkli-sahne--kurum .ff-how__step:nth-of-type(2) .ff-how__art {
  background: linear-gradient(125deg, #1d4ed8 0%, #1d4ed8 30%, #3b82f6 100%);
}

body.gece.zemin-acik .hm-renkli-sahne--kurum .ff-how__step:nth-of-type(3) .ff-how__art {
  background: linear-gradient(125deg, #6d28d9 0%, #6d28d9 30%, #8b5cf6 100%);
}


body.gece.zemin-acik .hm-renkli-sahne--uye .ff-how__step:nth-of-type(1) .ff-how__art {
  background: linear-gradient(125deg, #c2610a 0%, #c2610a 30%, #f59e0b 100%);
}

body.gece.zemin-acik .hm-renkli-sahne--uye .ff-how__step:nth-of-type(2) .ff-how__art {
  background: linear-gradient(125deg, #1d4ed8 0%, #1d4ed8 30%, #3b82f6 100%);
}

body.gece.zemin-acik .hm-renkli-sahne--uye .ff-how__step:nth-of-type(3) .ff-how__art {
  background: linear-gradient(125deg, #15803d 0%, #15803d 30%, #22c55e 100%);
}


body.gece.zemin-acik .hm-renkli-sahne .ff-how-pick__tiles > span {
  border-color: rgba(255, 255, 255, 0.6);
  background: linear-gradient(150deg, #ffffff 0%, #f1f3f8 100%);
  box-shadow: 0 10px 20px -8px rgba(8, 28, 48, 0.55);
  animation-name: hm-sahne-sec;
}

body.gece.zemin-acik .hm-renkli-sahne .ff-how-pick__tiles > span:nth-child(1) {
  color: #d97706;
}

body.gece.zemin-acik .hm-renkli-sahne .ff-how-pick__tiles > span:nth-child(2) {
  color: #2563eb;
}

body.gece.zemin-acik .hm-renkli-sahne .ff-how-pick__tiles > span:nth-child(3) {
  color: #0f766e;
}

@keyframes hm-sahne-sec {
  0%, 28% {
    box-shadow: 0 0 0 3px #c2ad8e, 0 12px 22px -8px rgba(8, 28, 48, 0.6);
    transform: translateY(-4%) scale(1.08);
  }

  34%, 100% {
    box-shadow: 0 10px 20px -8px rgba(8, 28, 48, 0.55);
    transform: none;
  }
}


body.gece.zemin-acik .hm-renkli-sahne--uye .ff-how-topic__tags li {
  border-color: #ffffff;
  background: rgba(8, 28, 48, 0.22);
  color: #ffffff;
}

@media (min-width: 961px) {
  body.gece.zemin-acik .hm-renkli-sahne .ff-how {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    column-gap: clamp(11.5px, calc(1.47 * var(--vw)), 26px);
  }
}

@media (max-width: 960px) {
  body.gece.zemin-acik .hm-renkli-sahne .ff-how {
    row-gap: clamp(11.5px, calc(1.47 * var(--vw)), 26px);
  }
}
