/*
Theme Name: Sydney Child
Template: sydney
Version: 1.0.0
Text Domain: sydney-child
*/
/* ============================================
   MICHÈLE DAMONTE — Custom CSS Fixes
   WordPress + Elementor Pro + Sydney Theme
   Einfügen unter: Design → Zusätzliches CSS
   ============================================ */

/* ------------------------------------------
   1. KONTAKTFORMULAR — Abstände & Felder
   ------------------------------------------ */

/* Abstand zwischen Feldern */
.elementor-widget-form .elementor-field-group {
  margin-bottom: 20px !important;
}

/* Label-Abstand nach oben */
.elementor-widget-form .elementor-field-label {
  display: block;
  margin-bottom: 6px !important;
  font-size: 14px !important;
  color: #444 !important;
  font-weight: 500;
}

/* Felder: Padding, Höhe, Rahmen */
.elementor-widget-form input.elementor-field-textual,
.elementor-widget-form textarea.elementor-field-textual,
.elementor-widget-form .elementor-select-wrapper select {
  padding: 12px 16px !important;
  border: 1px solid #ddd !important;
  border-radius: 6px !important;
  font-size: 15px !important;
  line-height: 1.5 !important;
  width: 100% !important;
  box-sizing: border-box !important;
  background: #fff !important;
  color: #333 !important;
  transition: border-color 0.2s ease;
}

/* Fokus-Zustand */
.elementor-widget-form input.elementor-field-textual:focus,
.elementor-widget-form textarea.elementor-field-textual:focus,
.elementor-widget-form .elementor-select-wrapper select:focus {
  border-color: #533374 !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(83, 51, 116, 0.1) !important;
}

/* Textarea Mindesthöhe */
.elementor-widget-form textarea.elementor-field-textual {
  min-height: 130px !important;
  resize: vertical !important;
}

/* Select-Feld */
.elementor-widget-form .elementor-select-wrapper {
  position: relative;
}
.elementor-widget-form .elementor-select-wrapper select {
  appearance: none !important;
  -webkit-appearance: none !important;
  padding-right: 40px !important;
}

/* Submit-Button volle Breite */
.elementor-widget-form .elementor-field-type-submit {
  margin-top: 8px !important;
}
.elementor-widget-form .elementor-field-type-submit button {
  width: 100% !important;
}


/* ------------------------------------------
   2. KONTAKTFORMULAR — Titel korrigieren
   Du-Form statt Sie-Form (via CSS nicht möglich,
   muss im Elementor-Editor geändert werden)
   → Titel: "Melde Dich bei mir" ✓ (bereits korrekt)
   → Dropdown-Optionen: alte Seminarnamen entfernen
   ------------------------------------------ */


/* ------------------------------------------
   3. NAVIGATION — "Termin vereinbaren" Button
   Farbe auf Gold ändern
   ------------------------------------------ */

header .elementor-widget-button .elementor-button,
.elementor-location-header .elementor-widget-button .elementor-button {
  background-color: #C9A84C !important;
  border-color: #C9A84C !important;
  color: #fff !important;
}

header .elementor-widget-button .elementor-button:hover,
.elementor-location-header .elementor-widget-button .elementor-button:hover {
  background-color: #b8943d !important;
  border-color: #b8943d !important;
}


/* ------------------------------------------
   4. ANGEBOTS-KARTEN — gleiche Höhe & Abstand
   ------------------------------------------ */

/* Container der 3 Karten */
#angebot .elementor-element-7adb7fe1 {
  align-items: stretch !important;
}

/* Jede Karte */
#angebot .elementor-element-7adb7fe1 > .e-con > .e-con {
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  padding: 32px 24px !important;
  border: 1px solid #e8e0f0 !important;
  border-radius: 12px !important;
  background: #fff !important;
  box-shadow: 0 2px 16px rgba(83,51,116,0.06) !important;
}

/* Icon-Box Innenabstand */
#angebot .elementor-icon-box-wrapper {
  margin-bottom: 16px !important;
}

/* Button immer unten */
#angebot .elementor-widget-button {
  margin-top: auto !important;
}


/* ------------------------------------------
   5. SEKTIONEN — Mehr vertikaler Abstand
   ------------------------------------------ */

.e-con-boxed.e-parent {
  padding-top: 80px !important;
  padding-bottom: 80px !important;
}

@media (max-width: 768px) {
  .e-con-boxed.e-parent {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
  }
}

/* Header-Sektion ausschliessen */
.elementor-location-header .e-con-boxed.e-parent {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Footer-Sektion ausschliessen */
.elementor-location-footer .e-con-boxed.e-parent {
  padding-top: 20px !important;
  padding-bottom: 20px !important;
}


/* ------------------------------------------
   6. HERO — Headline & Subtext
   ------------------------------------------ */

.elementor-element-b49d1d9 h1 {
  font-size: clamp(28px, 4vw, 52px) !important;
  line-height: 1.2 !important;
  color: #533374 !important;
}

.elementor-element-e791321 p {
  font-size: clamp(15px, 1.5vw, 18px) !important;
  line-height: 1.7 !important;
  color: #555 !important;
  max-width: 520px !important;
}


/* ------------------------------------------
   7. ABSCHLUSS-TEXT — Zentrierung & Breite
   ------------------------------------------ */

#abschluss-textblock .elementor-widget-text-editor {
  max-width: 640px !important;
  margin: 0 auto !important;
  text-align: center !important;
}

#abschluss-textblock p {
  font-size: 16px !important;
  line-height: 1.8 !important;
  color: #444 !important;
}

#abschluss-textblock em {
  color: #533374 !important;
  font-style: italic !important;
  font-weight: 500 !important;
}


/* ------------------------------------------
   8. TIPPFEHLER — "nner Leadership" Fix
   (muss im Elementor-Editor korrigiert werden)
   → 1:1 Mentoring Beschreibung: "nner" → "Inner"
   ------------------------------------------ */


/* ------------------------------------------
   9. ALLGEMEIN — Typografie & Links
   ------------------------------------------ */

/* Keine Unterstreichung bei Links im Content */
.elementor-widget-text-editor a,
.elementor-icon-list-text a {
  text-decoration: none !important;
  color: #533374 !important;
}

.elementor-widget-text-editor a:hover {
  color: #C9A84C !important;
}

/* Icon-Farbe in Listen auf Violett */
.elementor-icon-list-icon svg {
  fill: #533374 !important;
  width: 16px !important;
  height: 16px !important;
}


/* ------------------------------------------
   10. MOBILE — Responsive Verbesserungen
   ------------------------------------------ */

@media (max-width: 767px) {
  /* Karten untereinander mit Abstand */
  #angebot .elementor-element-7adb7fe1 > .e-con > .e-con {
    margin-bottom: 20px !important;
  }

  /* Kontaktformular volle Breite */
  .elementor-widget-form {
    padding: 0 !important;
  }
}