/* =========================================================================
   PaXaN Homepage – Optimierungs-Patch
   Diese Datei NACH allen bestehenden Stylesheets einbinden, damit die
   Regeln bestehende Styles gezielt überschreiben (keine Änderung an den
   Original-CSS-Dateien nötig).
   ========================================================================= */

/* -------------------------------------------------------------------------
   1) STARTLEISTE (Header/Nav) – volle Breite nutzen, Buttons besser verteilt
   ------------------------------------------------------------------------- */
.paxan-gnav .in {
  max-width: 1600px;      /* war 1180px – Leiste nutzt jetzt auf breiten
                              Screens die vorhandene Breite statt in der
                              Mitte "zusammenzuschrumpfen" */
  gap: 28px;
}

.paxan-gnav .lk {
  gap: 14px;              /* etwas mehr Luft zwischen den Buttons */
}

.paxan-gnav .paxan-right {
  gap: 14px;
}

/* Der Zeitreise-Button hatte eine feste Mindestbreite, die viel Leerraum
   im Button selbst erzeugt hat ("leere Pille"). Button schmiegt sich jetzt
   an seinen Inhalt an – dafür bekommt die Leiste insgesamt mehr sinnvoll
   nutzbaren Raum für die übrigen Buttons. */
.paxan-gnav .zr-btn {
  min-width: 0;
  padding: 4.8px 14px;
}

/* Kleiner Feinschliff: Trennlinie zwischen Menü-Gruppe und Sprachen/Zeitreise,
   damit die Verteilung über die ganze Breite optisch klar strukturiert bleibt */
.paxan-gnav .paxan-right {
  padding-left: 18px;
  border-left: 1px solid rgba(10, 10, 10, 0.12);
}

@media (max-width: 900px) {
  .paxan-gnav .paxan-right {
    border-left: none;
    padding-left: 0;
  }
}

/* -------------------------------------------------------------------------
   2) HERO – "Paul Götte — Performance Coach." zentrieren
   ------------------------------------------------------------------------- */
#trainer > header.sec {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

#trainer > header.sec .tr-lead {
  margin-left: auto;
  margin-right: auto;
}

/* Kicker ("Der Trainer") ist inline – zentriert sich durch text-align der
   Elternzeile automatisch mit; hier nur sauberer Abstand nach unten */
#trainer > header.sec .kicker {
  display: inline-block;
}

/* "Paul Götte — Performance Coach." soll in einer Zeile stehen. Das feste
   max-width:660px der Original-Header (.block header.sec) war knapp zu
   schmal dafür (Text braucht ~720px bei maximaler Schriftgröße) und riss
   nach "Performance" um. Ab 760px Breite ist genug Platz für eine Zeile;
   darunter (siehe Media Query) wird wieder normal umgebrochen, weil sonst
   der Text auf schmalen Bildschirmen über den Rand hinausliefe. */
#trainer > header.sec {
  max-width: 760px;
}

#trainer > header.sec h2 {
  white-space: nowrap;
}

@media (max-width: 760px) {
  #trainer > header.sec h2 {
    white-space: normal;
  }
}

/* -------------------------------------------------------------------------
   3) SUPPORTER-BEREICH – neue Reihenfolge/Optik (Überschrift-Update erfolgt
   per Skript, siehe paxan-homepage-fixes.js)
   ------------------------------------------------------------------------- */
#mitglied .tiers {
  margin-top: 8px;
}

/* -------------------------------------------------------------------------
   4) GUTSCHEIN-CODE & SPENDE – sichtbarer & einladender, aber dezent
   ------------------------------------------------------------------------- */
#gutschein.voucher-strip,
#spenden.support-strip {
  background:
    radial-gradient(120% 160% at 15% 0%, rgba(201, 162, 39, 0.10) 0%, rgba(201, 162, 39, 0) 60%),
    #F5F3EE;
  border-top: 1px solid rgba(201, 162, 39, 0.28);
  border-bottom: 1px solid rgba(201, 162, 39, 0.28);
  position: relative;
}

#gutschein .voucher-strip-in,
#spenden .support-strip-in {
  position: relative;
  padding: 28px 32px;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.55);
  border: 1px solid rgba(201, 162, 39, 0.35);
  box-shadow: 0 8px 28px rgba(10, 10, 10, 0.05);
}

#gutschein .kicker,
#spenden .kicker {
  color: #8A6E1B;
}

#gutschein h3,
#spenden h3 {
  position: relative;
}

/* kleines, dezentes Icon vor der Überschrift statt aufdringlicher Banner */
#gutschein h3::before {
  content: "🎁";
  margin-right: 10px;
  font-size: 0.85em;
}

#spenden h3::before {
  content: "❤";
  margin-right: 8px;
  font-size: 0.8em;
  color: #C9A227;
}

/* Der Spenden-CTA war ein reiner "ghost"-Outline-Button und ging optisch
   unter – jetzt dezent golden gefüllt, damit er als klarer nächster
   Schritt erkennbar ist, ohne grell zu wirken */
#spenden .cta.ghost.js-donate-cta {
  background: linear-gradient(180deg, #E0B848, #C9A227);
  border: 1px solid #8A6E1B;
  color: #0A0A0A;
  font-weight: 600;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

#spenden .cta.ghost.js-donate-cta:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(201, 162, 39, 0.35);
}

#gutschein .voucher-form button,
#gutschein .voucher-form .btn {
  border-color: #8A6E1B;
}

@media (max-width: 640px) {
  #gutschein .voucher-strip-in,
  #spenden .support-strip-in {
    padding: 20px 18px;
  }
}

/* -------------------------------------------------------------------------
   5) ANGEBOTE-KACHELN – während eine Kachel geöffnet ist, keine
   Scroll-Reveal-Ausblendung (siehe JS für die Logik, hier nur der
   visuelle Grundzustand als Absicherung)
   ------------------------------------------------------------------------- */
#leistungenTiles .tile.open {
  opacity: 1 !important;
  transform: none !important;
}

/* -------------------------------------------------------------------------
   6) FORMULAR-ELEMENTE – Absicherung gegen die "Arial statt Marken-Schrift"-
   Falle bei `all:unset`/`all:initial` auf Buttons (30.09.2026, Nav-Umbau-
   Fund: partials/nav.html hatte ein .drop>.trg{all:unset;...} OHNE explizite
   font-family, das bei manchen Browsern die UA-Formularschrift (Arial) statt
   der geerbten Marken-Schrift zeigte -- Form-Controls erben Schrift nicht
   zuverlässig automatisch, auch wenn font-family technisch eine "inherited"
   Property ist). Das konkrete Element wurde entfernt, dieser Global-Fix
   verhindert, dass derselbe Bug bei künftigen Buttons/Inputs unbemerkt
   wieder auftaucht -- `font: inherit` erzwingt explizit die Schrift des
   umgebenden Elternelements statt sich auf UA-Defaults zu verlassen.
   ------------------------------------------------------------------------- */
button, input, select, textarea {
  font: inherit;
}
