/* Block «Text» — kein Figma-Frame: Raster der Einleitung (links 506, Abstand 56, Startseite 24), H2 statt H1 */

.gw-text { background: var(--weiss); padding-block: var(--sektion); }
.gw-text--grau { background: var(--hellgrau); }
/* Grün wie die Sektion «Wir bewirtschaften» der Startseite: derselbe Verlauf (120°, Token), Titel weiss, Abstand oben und unten wie dort.
   Der Inhalt steht in einer weissen Karte mit hellgrüner 7-px-Kante oben (wie die Karten der Startseite), weil weisse Schrift auf dem hellen Grün zu schwach wäre (Célines Feedback 21.10.) */
.gw-text--gruen { background: var(--verlauf-gruen); }
/* Einfarbig dunkelgrün wie die Film-Sektion der Startseite: auf Seiten, wo nach dem Farbverlauf noch ein Textblock folgt */
.gw-text--dunkelgruen { background: var(--dunkelgruen-500); }
:is(.gw-text--gruen, .gw-text--dunkelgruen) .gw-text__titel { color: var(--weiss); }
:is(.gw-text--gruen, .gw-text--dunkelgruen) .gw-text__rechts { padding: var(--abstand-xxl); border-top: 7px solid var(--hellgruen-500); background: var(--weiss); }
@media (max-width: 900px) { :is(.gw-text--gruen, .gw-text--dunkelgruen) .gw-text__rechts { padding: var(--abstand-lg); } }

/* Zwei weisse Textblöcke hintereinander teilen sich den Abstand */
.gw-text:not(.gw-text--grau):not(.gw-text--gruen):not(.gw-text--dunkelgruen) + .gw-text:not(.gw-text--grau):not(.gw-text--gruen):not(.gw-text--dunkelgruen),
.gw-intro + .gw-text:not(.gw-text--grau):not(.gw-text--gruen):not(.gw-text--dunkelgruen) { padding-top: 0; }
.gw-text--grau + .gw-text--grau,
.gw-zeitstrahl--grau + .gw-text--grau { padding-top: 0; }

.gw-text__innen { display: flex; gap: var(--abstand-3xl); align-items: flex-start; }
/* Wie .gw-intro__titel (intro.css), damit die Spalten mit der Einleitung bündig bleiben;
   H1-Grösse ausgeschrieben statt em, weil Formular und Login hier ein div tragen */
.gw-text__titel { flex: 0 0 min(506px, max(38.87%, 11.75 * clamp(1.75rem, 1.2rem + 1.6vw, 2.5rem))); max-width: 506px; }
/* Ohne Silbentrennung (WebKit unter Windows, Browser ohne Wörterbuch) wüchse die Spalte sonst bis 506 auf die
   Breite des längsten Titelworts («Geschäftsprüfungskommission»); so bleibt sie bei der flex-basis */
.gw-text__titel { min-width: 0; }

.gw-text__rechts {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--abstand-lg);
}
.gw-text__rechts > .gw-knoepfe { align-self: flex-start; }

/* Einträge in Lauftextgrösse; Links dunkelgrün statt hellgrün (Kontrast auf Weiss) */
.gw-text__zeilen li { font-size: var(--text-xs); }
.gw-text__zeilen .gw-textlink { color: var(--dunkelgruen-500); font-weight: 700; }
.gw-text__zeilen .gw-textlink:hover { color: var(--dunkelgruen-700); }
/* Umbrechende Dokumenttitel: Pfeil 20 direkt hinter dem letzten Wort statt geschrumpft am Spaltenrand
   (inline-flex machte ihn zum schrumpfenden Flex-Element). Der Pfeil ist ein Inline-Stück aus
   Wortverbinder (U+2060) und 28 Polster mit dem Pfeil als Hintergrund rechts darin: so kann er nie
   allein in eine neue Zeile rutschen (vor einem inline-block darf der Browser immer umbrechen).
   Hintergrund statt Maske, weil WebKit Masken auf Inline-Stücken nicht sauber begrenzt; die Farben
   stehen deshalb im SVG (dunkelgrün 500, beim Zeigen 700). Linie als Unterstreichung, weil die
   wachsende Linie (bewegung.css, ::before) bei zwei Zeilen nur unter der Box und bis unter den Pfeil liefe */
.gw-text__zeilen .gw-textlink { display: inline; }
.gw-text__zeilen .gw-textlink::after {
  display: inline;
  content: "\2060";
  padding: 2px 0 2px 28px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232d7e46' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12H19M12 5L19 12L12 19'/%3E%3C/svg%3E") right center / 20px 20px no-repeat;
  -webkit-mask: none;
          mask: none;
}
.gw-text__zeilen .gw-textlink:hover::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23184c28' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12H19M12 5L19 12L12 19'/%3E%3C/svg%3E");
}
.gw-text__zeilen .gw-textlink::before { display: none; }
.gw-text__zeilen .gw-textlink:focus-visible { text-decoration: underline 2px; text-underline-offset: 0.2em; }
@media (hover: hover) and (pointer: fine) {
  .gw-text__zeilen .gw-textlink:hover { text-decoration: underline 2px; text-underline-offset: 0.2em; }
}
/* Einträge ohne Link schwarz: Grün-fett hiesse hier «Link» (kacheln.css färbt .gw-zeilen strong grün) */
.gw-text__zeilen strong { color: var(--schwarz); }
/* Datei-Einträge: Format und Grösse gedämpft unter Titel und Text (#4b5563 auf Weiss 7.6:1, auf Hellgrau 6.4:1) */
.gw-text__zeilen .gw-text__format { color: var(--kit-farbe-gedaempft); }

/* Wie die Einleitung: Abstand 24 nur auf der Startseite */
@media (min-width: 901px) {
  .home .gw-text__innen { gap: var(--abstand-lg); }
}

/* Untereinander: rechte Spalte auf volle Breite (Formular, Login, kurze Linklisten) */
@media (max-width: 900px) {
  .gw-text__innen { flex-direction: column; gap: var(--abstand-xl); align-items: stretch; }
  .gw-text__titel { flex-basis: auto; max-width: none; }
}
