/* ══════════════════════════════════════════════════════════════════════
   KAMUI UEBERGAENGE: rahmenlos zwischen den Sektionen
   ══════════════════════════════════════════════════════════════════════

   Gesucht wurden Stellen, an denen die Helligkeit auf wenigen Pixeln
   stark springt UND der Sprung ueber fast die ganze Breite geht. Nur
   dann liest das Auge eine Trennlinie. Lokale Spruenge sind Bildinhalt
   und bleiben unangetastet.

   MESSUNG VORHER (assets/kanten_finden.py, 1440 Pixel breit):

       Start        1 Kante   y=106    59.7 Stufen   56/60 Spalten
       Leistungen   1 Kante   y=106    65.9 Stufen   56/60 Spalten
       Haltung      1 Kante   y=106    65.9 Stufen   56/60 Spalten
       Arbeiten     1 Kante   y=106    65.9 Stufen   56/60 Spalten
       Kontakt      8 Kanten  y=106    65.9 Stufen   56/60 Spalten
                              y=960 bis y=1251 (sechs Stueck)
                              y=1594  123.5 Stufen   56/60 Spalten

   URSACHE y=106, auf allen fuenf Seiten dieselbe:
   DIV.fr-header-alpha__inner traegt border-bottom: 1px rgba(255,255,255,0.3).
   Eine weisse Linie unter der Navigation. Sie ist der Grund, warum der
   Kopf wie aufgeklebt wirkt statt Teil der Seite zu sein.

   Weiss ist ausserdem keine Markenfarbe. Die Linie muesste, wenn ueber-
   haupt, in Creme stehen. Sie faellt hier ganz weg: die Navigation
   trennt sich schon durch Abstand vom Inhalt, eine Linie ist doppelt.  */

/* ── 1. Die Linie unter der Navigation ───────────────────────────────
   Auf allen Seiten. Nicht auf transparent setzen, sondern die Breite
   auf 0: eine durchsichtige Linie belegt weiterhin einen Pixel Hoehe
   und verschiebt alles darunter. */
.fr-header-alpha__inner,
.fr-header-alpha,
.fr-header-alpha__inner > * {
  border-bottom-width: 0 !important;
  border-top-width: 0 !important;
}

/* ── 2. Raender an Sektionen allgemein ───────────────────────────────
   Das Theme setzt an mehreren Stellen duenne Trennlinien zwischen
   Sektionen. Sie stammen aus einer Vorlage mit hellem Grund, wo eine
   graue Linie Struktur gibt. Auf Tusche wirkt dieselbe Linie wie ein
   Riss.

   Nur oben und unten: seitliche Raender gehoeren teils zu Karten und
   Zitatbloecken, die ihre Kontur brauchen. */
.brxe-section,
section.brxe-section,
.brxe-section > .brxe-container {
  border-top-width: 0 !important;
  border-bottom-width: 0 !important;
}

/* ── 3. Trennlinien als eigenes Element ──────────────────────────────
   Manche Uebergaenge sind kein Rand, sondern ein flaches DIV mit
   Hintergrundfarbe. Auf Tusche gesetzt verschwinden sie, ohne dass
   sich die Hoehe der Seite aendert - deshalb hier Farbe statt
   display:none. */
.brxe-divider,
.bricks-divider,
hr {
  background-color: #161B19 !important;
  border-color: #161B19 !important;
  opacity: 0 !important;
}

/* ── 4. Kontakt: die sechs Kanten im Formular ────────────────────────
   Gemessen y=960 bis y=1251, sechs Spruenge von 37 bis 48 Stufen im
   Abstand von rund 50 Pixeln. Das ist der Zeilenabstand der Eingabe-
   felder: jedes Feld hat einen hellen Rahmen.

   Die Felder brauchen eine sichtbare Begrenzung, sonst weiss niemand,
   wo er klicken soll. Aber nicht als heller Kasten auf dunklem Grund.
   Stattdessen eine gedaempfte Cremelinie: sichtbar genug zum Zielen,
   zu leise fuer eine Kante. */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="url"],
input[type="search"],
input[type="number"],
textarea,
select,
.brxe-form input,
.brxe-form textarea,
.brxe-form select {
  background-color: rgba(237, 225, 202, 0.05) !important;
  border: 1px solid rgba(237, 225, 202, 0.22) !important;
  color: #EDE1CA !important;
}

input::placeholder,
textarea::placeholder {
  color: rgba(237, 225, 202, 0.45) !important;
}

/* Beim Hineinklicken wird die Linie deutlicher. So bleibt die Ruhe im
   Normalzustand und die Rueckmeldung beim Tippen. */
input:focus,
textarea:focus,
select:focus {
  border-color: rgba(237, 225, 202, 0.55) !important;
  background-color: rgba(237, 225, 202, 0.08) !important;
  outline: none !important;
}

/* ── 5. Kontakt y=1594: der Sprung von 123 Stufen ────────────────────
   Der groesste gemessene Sprung der ganzen Seite, also die haerteste
   Kante. Er liegt am Uebergang zum Fussbereich, wo eine helle Flaeche
   direkt auf Tusche trifft.

   Statt die Flaeche umzufaerben bekommt sie einen Ausklang: die Farbe
   laeuft ueber 120 Pixel nach Tusche aus. Der Verlauf muss in die Farbe
   laufen, die DANACH kommt, nicht in die eigene - das war der Fehler
   in der ersten Fassung der Hero-Naht. */
.brxe-section + .brxe-section::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 120px;
  background: linear-gradient(to bottom,
              rgba(22, 27, 25, 0.85) 0%,
              rgba(22, 27, 25, 0) 100%);
  pointer-events: none;
  z-index: 1;
}

.brxe-section {
  position: relative;
}
