html {
  scroll-behavior: smooth;
}

/* Alle Gutenberg-Anchors auf einmal */
[id]:target {
  scroll-margin-top: 120px;
}

/* =====================================================
   RunningFirefighter – Contact Form 7 Styling
   Scope: .rf-contact
   Theme-aware (uses WP preset colors)
   ===================================================== */

.rf-contact{
  /*--rf-text: #green; */
  --rf-border: rgba(202,210,216,.35);
  --rf-border-strong: rgba(202,210,216,.55);
  --rf-field-bg: rgba(0,0,0,.22);
  --rf-field-bg-hover: rgba(0,0,0,.28);
  --rf-radius: 12px
}

/* Formularbreite */
.rf-contact .wpcf7-form{
  max-width: 560px;
}

/* Labels */
.rf-contact label{
  display: block;
  margin: 0 0 8px;
  color: var(--rf-text);
  font-weight: 600;
  letter-spacing: .2px;
}

/* Eingabefelder */
.rf-contact input[type="text"],
.rf-contact input[type="email"],
.rf-contact input[type="tel"],
.rf-contact input[type="url"],
.rf-contact input[type="number"],
.rf-contact select,
.rf-contact textarea{
  width: 100%;
  box-sizing: border-box;
  color: #fffffff;
  background: var(--rf-field-bg);
  border: 1px solid var(--rf-border);
  border-radius: var(--rf-radius);
  padding: 12px 14px;
  font-size: 16px;
  line-height: 1.3;
  outline: none;
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}

/* Textarea */
.rf-contact textarea{
  min-height: 160px;
  resize: vertical;
}

/* Hover */
.rf-contact input:hover,
.rf-contact select:hover,
.rf-contact textarea:hover{
  background: var(--rf-field-bg-hover);
  border-color: var(--rf-border-strong);
}

/* Focus */
.rf-contact input:focus,
.rf-contact select:focus,
.rf-contact textarea:focus{
  border-color: var(--wp--preset--color--primary);
  box-shadow: 0 0 0 4px rgba(217,134,28,.35);
}

/* Placeholder */
.rf-contact ::placeholder{
  color: rgba(202,210,216,.65);
}

/* Absatz-Abstände */
.rf-contact p{
  margin: 0 0 16px;
}

/* Checkbox */
.rf-contact input[type="checkbox"]{
  width: 18px;
  height: 18px;
  accent-color: var(--wp--preset--color--primary);
}

.rf-contact .wpcf7-list-item-label{
  color: var(--rf-text);
  font-weight: 500;
}

/* ======================
   Submit Button
   übernimmt Theme-Farbe
   ====================== */

.rf-contact input[type="submit"],
.rf-contact button[type="submit"]{
  appearance: none;
  border: 0;
  border-radius: 999px;
  background: #F87C2AFF;
  color: var(--wp--preset--color--base);
  font-size: 16px;
	font-weight: 800;
  letter-spacing: .4px;
  padding: 12px 18px;
  cursor: pointer;
  transition: transform .06s ease, filter .2s ease, box-shadow .2s ease;
  box-shadow: 0 10px 24px rgba(0,0,0,.25);
}

/* Hover */
.rf-contact input[type="submit"]:hover,
.rf-contact button[type="submit"]:hover{
  filter: brightness(1.05);
}

/* Active */
.rf-contact input[type="submit"]:active,
.rf-contact button[type="submit"]:active{
  transform: translateY(1px);
}

/* ======================
   CF7 Meldungen
   ====================== */

.rf-contact .wpcf7-response-output{
  margin: 16px 0 0;
  border-radius: var(--rf-radius);
  padding: 12px 14px;
  color: #ffffff;
  border: 1px solid var(--rf-border);
  background: rgba(0,0,0,.25);
}

/* Validierungsfehler */
.rf-contact .wpcf7-not-valid-tip{
  margin-top: 8px;
  color: #ffb4a7;
  font-weight: 600;
}

.rf-contact .wpcf7-not-valid{
  border-color: rgba(255,180,167,.9) !important;
  box-shadow: 0 0 0 4px rgba(255,180,167,.25) !important;
}

/* Spinner */
.rf-contact .wpcf7-spinner{
  margin-left: 10px;
  vertical-align: middle;
  opacity: .85;
}

/* Responsive */
@media (max-width: 720px){
  .rf-contact .wpcf7-form{
    max-width: 100%;
  }
}