/* ========== Demo Summer Page ========== */
.demo-summer-page {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 80vh;
  padding: calc(40px + env(safe-area-inset-top)) calc(16px + env(safe-area-inset-right)) calc(40px + env(safe-area-inset-bottom)) calc(16px + env(safe-area-inset-left));
  background-color: var(--rd-font-light);
}

.demo-summer-page * {
  touch-action: auto;
}

.demo-summer-card {
  position: relative;
  max-width: 350px;
  width: 100%;
  border-radius: 16px;
  background: var(--rd-font-light);
  overflow: hidden;
  margin: 0 auto;
}

.demo-summer-card {
  background-color: #F9F9FB;
}

.demo-summer-decorations {
  display: none;
}

.demo-summer-sun {
  position: absolute;
  top: 10px;
  left: 20px;
  width: 60px;
  height: 60px;
  background: #ffc107;
  border-radius: 50%;
  box-shadow: 0 0 0 8px rgba(255, 193, 7, 0.2);
}

.demo-summer-sun::before {
  /*   content: "";
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  width: 4px;
  height: 12px;
  background: #ffc107;
  border-radius: 2px;
  box-shadow:
    20px 8px 0 #ffc107,
    -20px 8px 0 #ffc107,
    14px -8px 0 #ffc107,
    -14px -8px 0 #ffc107; */
}



.demo-summer-header {
  width: 100%;
  aspect-ratio: 1000 / 560;
  background: url('/src/img/2024/images/sommer_formular_v5.png') center / contain no-repeat;
}



.demo-summer-form .form_input_text {
  margin-bottom: 12px;
}



.demo-summer-btn {
  display: flex;
  align-items: center;
  justify-content: center;

  width: fit-content;
  margin: 24px auto 24px;

}



.demo-summer-submit-btn:hover {
  background: #c4155c;
  transform: scale(1.02);
}

.demo-summer-btn-icon {
  font-size: 1.3rem;
}

.demo-summer-btn-arrow {
  font-size: 1.3rem;
}

.demo-summer-form .formfiledH {
  display: none;
}

.demo-summer-form {
  padding: var(--rd-spacing-x-big) var(--rd-spacing-md) 0;
}

.rd-primary-btn .rd-icon-gift::before {
  background-color: var(--rd-font-light);
}

@media (max-width: 1000px) {
  .demo-summer-page {
    padding: calc(var(--rd-spacing-x-big) + env(safe-area-inset-top)) calc(var(--rd-spacing-sm) + env(safe-area-inset-right)) calc(var(--rd-spacing-x-big) + env(safe-area-inset-bottom)) calc(var(--rd-spacing-sm) + env(safe-area-inset-left));
    min-height: auto;
  }

  .demo-summer-card {
    max-width: 350px;
  }
}

@media (max-width: 560px) {
  .demo-summer-card {
    border-radius: 12px;
  }


}