/* Block «Einleitung» — Figma Unterseiten (2121:3042, 2128:4390, 2204:5811 …): 120 oben/unten, links 506, Abstand 56.
   Startseite «About Section» 2214:3053: Abstand 24 */

.gw-intro { background: var(--weiss); padding-block: var(--sektion); }

.gw-intro__innen {
  position: relative;
  display: flex;
  gap: var(--abstand-3xl);
  align-items: flex-start;
}

/* 506 von 1302 (38.87 %), schmaler mit dem Rahmen statt den Text zu quetschen; nie unter
   11.75 × H1-Grösse (.gw-h1), damit kein Titelwort getrennt wird. Gleiche Formel in text.css. */
.gw-intro__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) sonst breiter als die flex-basis, siehe text.css */
.gw-intro__titel { min-width: 0; }

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

/* Inter läuft minimal breiter als in Figma: ohne die Korrektur 4 statt 3 Zeilen (2204:6581, 2121:3050) */
.gw-intro .gw-lauftext { letter-spacing: -0.005em; }

/* Zwei Buttons nebeneinander: 24 (Figma 2143:7622, 2204:6582) */
.gw-intro .gw-knoepfe { gap: var(--abstand-lg); }

/* Plakette dunkelgrün 700, 56 × 56 (Kacheln 2204:7343) */
.gw-plakette {
  display: grid;
  place-items: center;
  width: var(--abstand-3xl);
  height: var(--abstand-3xl);
  background: var(--dunkelgruen-700);
}

/* Intro-Plakette 80 × 80, 23 über der Bildkante (Figma 2143:8077, 2143:7885, 2204:7108);
   bei kleinerem Sektionsabstand mindestens 24 Luft zum Titel */
.gw-intro__plakette {
  position: absolute;
  left: 0;
  top: min(calc(-1 * var(--sektion) - 23px), calc(-1 * (var(--abstand-5xl) + var(--abstand-lg))));
  width: var(--abstand-5xl);
  height: var(--abstand-5xl);
}

/* Nur die Startseite: Abstand 24 (2214:3053) */
@media (min-width: 901px) {
  .home .gw-intro__innen { gap: var(--abstand-lg); }
}

@media (max-width: 900px) {
  .gw-intro__innen { flex-direction: column; gap: var(--abstand-xl); }
  .gw-intro__titel { flex-basis: auto; max-width: none; }
}