/* =========================================================================
   seite-partner.css  --  Anordnung von /partner-werden (views/partner.ejs)
   nach partner-werden-p1 bis p7 (Umbau R4, E9). Komponenten aus styles.css;
   hier nur, was es nur auf dieser Seite gibt. Nur Tokens.
   Desktop aus den Entwuerfen abgeleitet (p2 bis p7 sind schon breit):
   gleiche Abschnitte und Texte, Inhalt mittig mit maximaler Breite.
   ========================================================================= */

/* Icons in den Kacheln etwas groesser als im Standard (Entwuerfe p2, p4, p6) */
.seite-partner .icon-kachel .icon, .seite-partner .icon-kreis .icon { width: 56%; height: 56%; }

/* --- Kopf (p1): dunkel, Pfeil vom Titel zum Text, Beispielprojekt -------- */
/* handgezeichneter Pfeil nach dem Titel (Entwurf p1), als Bild aus der CSS */
.seite-partner .kopf .akzent::after {
  content: ''; display: inline-block; width: 1.6em; height: 0.95em; margin-left: 0.1em; vertical-align: -0.55em;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 38' fill='none' stroke='%238FDCB8' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6C24 0 47 4 55 31'/%3E%3Cpath d='M47 25l8 7 4-10'/%3E%3C/svg%3E") no-repeat center / contain;
}
/* Desktop ab 64rem (Steven ueber Rida 2026-10-29 12:36 «Pfeil soll hinzeigen», auf den Knopf; User: Handy bleibt, ab einer Breite eigene
   Variante): Knopf unter dem Lead, ein kurzer handgezeichneter Pfeil im Stil des Titelpfeils sitzt links davor und zeigt nach rechts
   in den Knopf (User 2026-10-29: Pfeil und Knopf getauscht, «ist doch cleaner»);
   am Titel kein Pfeil, rechts nur das Beispielprojekt. Unter 64rem eigene Fassung (unten) */
/* Handy und Tablet unter 64rem (User 2026-10-29 aus drei Varianten «B unter dem Text»): wie am Desktop Pfeil links, Knopf rechts,
   direkt unter dem Lead vor der Beispielkarte; kein Titelpfeil, kein Knopf unter der Karte (werkzeuge/einmal/heimtreffer-partner-handy-varianten.mjs) */
@media (max-width: 63.99rem) {
  .seite-partner .kopf .akzent::after { content: none; }
  .partner-kopf__knopf--rechts { display: none; }
  .seite-partner .kopf__extra { display: flex; justify-content: flex-end; margin-top: 1.25rem; }
  .partner-kopf__cta { position: relative; display: inline-block; padding-left: 4.25rem; }
  .partner-kopf__cta .knopf { padding-inline: 1.125rem; gap: 0.5rem; font-size: 1rem; }
  .partner-kopf__cta::after { content: ''; position: absolute; left: 0; bottom: calc(50% - 0.45rem); width: 3.75rem; height: 2.6rem; pointer-events: none;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 88 60' fill='none' stroke='%238FDCB8' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 4C2 28 26 48 76 50'/%3E%3Cpath d='M68 43.9L76 50 67.6 55.4'/%3E%3C/svg%3E") no-repeat center / contain; }
}
/* kleine Handys (unter 24rem, z. B. 360 px): Pfeil und Knopf kompakter, Knopftext bleibt auf einer Zeile */
@media (max-width: 23.99rem) {
  .partner-kopf__cta { padding-left: 3rem; }
  .partner-kopf__cta .knopf { padding-inline: 0.875rem; font-size: 0.9375rem; white-space: nowrap; }
  .partner-kopf__cta::after { width: 2.75rem; height: 1.9rem; bottom: calc(50% - 0.2rem); }
}
@media (min-width: 64rem) {
  .seite-partner .kopf .akzent::after { content: none; }
  .partner-kopf__knopf--rechts { display: none; }
  /* User 2026-10-29 «weiter rechts… so fast am beispiel projekt»: Knopf und Pfeil rechtsbuendig in der Textspalte, direkt vor der Karte */
  .seite-partner .kopf__extra { display: flex; justify-content: flex-end; }
  .partner-kopf__cta { position: relative; display: inline-block; padding-left: 6.25rem; }
  .partner-kopf__cta::after { content: ''; position: absolute; left: 0; bottom: calc(50% - 0.6rem); width: 5.5rem; height: 3.75rem; pointer-events: none;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 88 60' fill='none' stroke='%238FDCB8' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 4C2 28 26 48 76 50'/%3E%3Cpath d='M68 43.9L76 50 67.6 55.4'/%3E%3C/svg%3E") no-repeat center / contain; }
}
.seite-partner .kopf__inner { gap: 1.5rem; }
/* am Handy den linken Bildteil zeigen: Haeuser mit Solardach statt Gebuesch */
.seite-partner .kopf__foto img { object-position: 12% 50%; }
.partner-beispiel {
  padding: 1rem; border: 1px solid rgb(255 255 255 / 0.18); border-radius: var(--r-karte);
  background: rgb(255 255 255 / 0.06); color: var(--auf-dunkel-2);
}
@supports (backdrop-filter: blur(8px)) { .partner-beispiel { backdrop-filter: blur(8px); } }
.partner-beispiel__kopf { display: flex; align-items: center; gap: 0.875rem; }
.partner-beispiel__sonne { display: grid; place-items: center; flex: none; width: 3rem; height: 3rem; border-radius: 50%; background: rgb(255 255 255 / 0.08); color: var(--mint-auf-dunkel); }
.partner-beispiel__sonne .icon { width: 1.75rem; height: 1.75rem; }
.partner-beispiel__titel { color: var(--auf-dunkel); font: 800 var(--fs-h3)/1.25 var(--font-titel); }
.partner-beispiel__unter { color: var(--auf-dunkel-2); font-size: var(--fs-klein); }
.partner-beispiel__inhalt { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0.875rem; align-items: center; margin-top: 0.875rem; }
.partner-beispiel__bild img, .partner-beispiel__bild .foto-platzhalter { width: 100%; height: auto; aspect-ratio: 4 / 3; border-radius: 10px; object-fit: cover; }
.partner-kopf__knopf { margin-top: 1.25rem; }

/* Daten einer Anfrage: Icon und Text, Linien dazwischen (p1 Karte, p2 Schritt 04) */
.partner-daten { margin: 0; padding: 0; list-style: none; font-size: var(--fs-klein); line-height: 1.35; }
.partner-daten li { display: flex; align-items: center; gap: 0.625rem; padding-block: 0.5rem; color: var(--auf-dunkel); }
.partner-daten li + li { border-top: 1px solid var(--linie-dunkel); }
.partner-daten .icon { width: 1.25rem; height: 1.25rem; color: var(--mint-auf-dunkel); }
.partner-daten__label { display: block; color: var(--auf-dunkel-2); font-size: var(--fs-mini); }
.partner-daten__zeit strong { display: block; color: var(--mint-auf-dunkel); font: 700 var(--fs-text)/1.3 var(--font-titel); }
@media (min-width: 64rem) {
  .seite-partner .kopf__inner--seite { align-items: end; }
  .partner-beispiel { padding: 1.25rem; }
  /* breiter Kopf: Foto erst unten sichtbar, Text auf ruhigem Marine (Entwurf p1: Abendhimmel oben) */
  .seite-partner .kopf--dunkel .kopf__foto::after { background: linear-gradient(180deg, color-mix(in srgb, var(--marine) 97%, transparent) 0%, color-mix(in srgb, var(--marine) 93%, transparent) 55%, color-mix(in srgb, var(--marine) 45%, transparent) 82%, color-mix(in srgb, var(--marine) 15%, transparent) 100%); }
}

/* --- So funktioniert's (p2): Schritte mit Pfeil (styles.css schritte--pfeil), Schritt 04 als gruene Karte --- */
/* R10: Text der Pille steht auf der Kante des Kartentextes darunter (Rand 1px + Innenabstand 1.25rem) */
@media (min-width: 48rem) { .partner-betriebe .kicker--pille { padding-inline: calc(1.25rem + 1px); } }
/* R10: Ablauf und Fragen stehen wie alle Abschnitte auf der Rasterkante (x=120 bei 1440), vorher in 64rem zentriert (x=208) */
.partner-ablauf .schritte__text p { max-width: 38rem; }   /* Zeilen hoechstens rund 75 Zeichen */
.partner-auftrag { display: grid; gap: 1.25rem; margin-top: 1rem; padding: 2rem 1.25rem 1.25rem; border-radius: var(--r-gross); }
.partner-auftrag__nr {
  position: absolute; top: -1.375rem; left: 0; display: grid; place-items: center; width: 3rem; height: 3rem;
  border-radius: 50%; background: var(--gruen-dunkel); box-shadow: 0 0 0 4px var(--bg); color: #fff; font: 800 var(--fs-text)/1 var(--font-titel);
}
.partner-auftrag__haupt { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 1rem; align-items: start; }
.partner-auftrag__haken { display: grid; place-items: center; width: 3.5rem; height: 3.5rem; border-radius: 50%; background: var(--mint); color: var(--gruen-dunkel); }
.partner-auftrag__haken .icon { width: 1.75rem; height: 1.75rem; stroke-width: 2.5; }
.partner-auftrag .h3 { color: #fff; }
.partner-auftrag .h3 + p { margin-top: 0.375rem; }
.partner-auftrag__status { display: flex; align-items: center; gap: 0.625rem; margin-top: 1rem; color: #fff; font-weight: 600; }
.partner-auftrag__pfeil { display: grid; place-items: center; flex: none; width: 1.75rem; height: 1.75rem; border-radius: 50%; background: var(--mint); color: var(--gruen-dunkel); }
.partner-auftrag__pfeil .icon { width: 1rem; height: 1rem; stroke-width: 2.5; }
.partner-daten--auftrag { padding-top: 0.75rem; border-top: 1px solid rgb(255 255 255 / 0.18); }
.partner-daten--auftrag li + li { border-top-color: rgb(255 255 255 / 0.12); }
.partner-daten__wert strong { display: block; color: #fff; font: 800 var(--fs-lead)/1.2 var(--font-titel); }
@media (min-width: 48rem) {
  .partner-auftrag { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); align-items: center; gap: 2rem; padding: 2.25rem 2rem 2rem; }
  .partner-daten--auftrag { padding: 0 0 0 2rem; border-top: 0; border-left: 1px solid rgb(255 255 255 / 0.18); }
}
/* --- Warum Heimtreffer (p3): zwei Punkte, in der Mitte die Karte mit Haken --- */
.partner-warum__liste { position: relative; isolation: isolate; display: grid; gap: 2.5rem; margin: 2.5rem 0 0; padding: 0; list-style: none; }
.partner-warum__punkt, .partner-warum__mitte { display: grid; justify-items: center; text-align: center; }
.partner-warum__icon { display: grid; place-items: center; width: 5rem; height: 5rem; border-radius: 50%; background: #fff; box-shadow: var(--schatten-hoch); color: var(--gruen); }
.partner-warum__icon .icon { width: 2.25rem; height: 2.25rem; }
.partner-warum__titel { margin-top: 1rem; color: var(--marine); font: 800 var(--fs-h3)/1.25 var(--font-titel); }
.partner-warum__text { max-width: 18rem; margin-top: 0.5rem; font-size: var(--fs-klein); }
.partner-warum__ring {
  position: relative; z-index: 1; display: grid; place-items: center; width: 8.5rem; height: 8.5rem; border-radius: 50%;
  background: color-mix(in srgb, var(--mint) 70%, var(--bg));
  box-shadow: 0 0 0 1.125rem color-mix(in srgb, var(--mint) 40%, transparent);
}
.partner-warum__haken { display: grid; place-items: center; width: 5.25rem; height: 5.25rem; border-radius: 50%; background: var(--gruen-dunkel); box-shadow: var(--schatten-hoch); color: #fff; }
.partner-warum__haken .icon { width: 2.5rem; height: 2.5rem; stroke-width: 2.75; }
.partner-warum__karte { width: 100%; max-width: 24rem; margin-top: -3rem; padding: 4rem 1.5rem 1.5rem; border-radius: var(--r-gross); background: color-mix(in srgb, var(--mint) 45%, var(--bg)); box-shadow: var(--schatten); }
.partner-warum__gross { color: var(--marine); font: 800 var(--fs-h2)/1.1 var(--font-titel); letter-spacing: -0.02em; }
.partner-warum__ganz { white-space: nowrap; }
.partner-warum__gruen { margin-top: 0.5rem; color: var(--gruen); font: 700 var(--fs-h3)/1.3 var(--font-titel); }
.partner-warum__badge { display: inline-flex; align-items: center; gap: 0.5rem; margin-top: 1.25rem; padding: 0.625rem 1rem; border-radius: var(--r-feld); background: var(--mint); color: var(--marine); font-size: var(--fs-klein); }
.partner-warum__badge .icon { width: 1.25rem; height: 1.25rem; color: var(--gruen); }
@media (min-width: 48rem) {
  .partner-warum__liste { grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr) minmax(0, 1fr); align-items: start; gap: 1.5rem; }
  .partner-warum__punkt { margin-top: 5.5rem; }
  /* gestrichelte Verbindung von den Punkten zum Haken in der Mitte */
  .partner-warum__liste::before {
    content: ''; position: absolute; z-index: -1; left: 17%; right: 17%; top: 1.75rem; height: 5rem;
    border: 1.5px dashed var(--mint-2); border-bottom: 0; border-radius: 50% 50% 0 0 / 100% 100% 0 0;
  }
}

/* --- Regionen (p4): Schweizer Karte, drei Spalten, Gebiets-Karte ---------- */
.partner-regionen__karte { position: relative; margin-top: 1.5rem; }
.partner-regionen__karte .karte-info { top: 30%; right: 4%; bottom: auto; }
.partner-spalten { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 1.5rem 0 0; padding: 0; list-style: none; }
.partner-spalten__item { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; padding: 0.25rem 0.5rem; text-align: center; overflow-wrap: break-word; }
.partner-spalten__item + .partner-spalten__item { border-left: 1px solid var(--linie); }
.partner-spalten .icon-kachel { width: 3rem; height: 3rem; }
.partner-spalten__titel { color: var(--marine); font: 800 0.9375rem/1.25 var(--font-titel); }
.partner-spalten__text { font-size: 0.8125rem; line-height: 1.45; }
/* Abnahme-Check 2026-11-01 («Ansprech-/partner» von 360 bis 1440): «Ansprechpartner» ohne Trennstelle (server.js SHY) und die
   Titel ab 48rem so gross, dass das Wort in die Spalte passt (am Handy bleiben 15px ueber dem 13px-Text, dort trennt das weiche
   Trennzeichen aus server.js SHY korrekt an der Fuge): Spalte = ein Drittel der Liste (33.33cqi) ohne Innenabstand und Trennlinie,
   Wort 8.43em breit (8.7 laesst Luft), hoechstens die bisherige Groesse; alle drei Titel gleich gross. Nur Deutsch, die
   englischen Titel haben kein so langes Wort. */
.partner-spalten { container-type: inline-size; }
@media (max-width: 47.99rem) { .partner-spalten__item { padding-inline: 0.25rem; } }
.partner-gebiet { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 1rem 1.25rem; align-items: center; margin-top: 2rem; padding: 1.25rem; border-radius: var(--r-gross); background: var(--mint); }
.partner-gebiet__icon { display: grid; place-items: center; width: 4rem; height: 4rem; color: var(--gruen); }
.partner-gebiet__icon .icon { width: 3.25rem; height: 3.25rem; stroke-width: 1.5; }
.partner-gebiet__titel { color: var(--marine); font: 800 var(--fs-h3)/1.3 var(--font-titel); }
.partner-gebiet__text { margin-top: 0.125rem; }
.partner-gebiet .knopf { grid-column: 1 / -1; }
@media (min-width: 48rem) {
  .partner-spalten__item { gap: 0.75rem; padding: 0.5rem 1.25rem; }
  .partner-spalten .icon-kachel { width: 3.5rem; height: 3.5rem; }
  .partner-spalten__titel { font-size: var(--fs-h3); }
  :lang(de) .partner-spalten__titel { font-size: min(var(--fs-h3), calc((33.33cqi - 2.5rem - 1px) / 8.7)); hyphens: none; }
  .partner-spalten__text { font-size: var(--fs-klein); }
}
@media (min-width: 64rem) {
  .partner-spalten__item { padding-inline: 0.75rem; }
  :lang(de) .partner-spalten__titel { font-size: min(var(--fs-h3), calc((33.33cqi - 1.5rem - 1px) / 8.7)); }
}
@media (min-width: 64rem) {
  .partner-regionen__page { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "kopf karte" "spalten karte" "gebiet gebiet"; gap: 0 clamp(3rem, 6vw, 6rem); align-items: start; }
  .partner-regionen__kopf { grid-area: kopf; }
  .partner-regionen__karte { grid-area: karte; align-self: center; margin-top: 0 !important; }
  .partner-spalten { grid-area: spalten; margin-top: 2.5rem; }
  .partner-gebiet { grid-area: gebiet; grid-template-columns: auto minmax(0, 1fr) auto; margin-top: 3rem; padding: 1.5rem 2rem; }
  .partner-gebiet .knopf { grid-column: auto; }
}

/* --- Gesuchte Betriebe (p5): vier Punkte, Foto als Blase, gruene Karte ---- */
.partner-betriebe__inhalt { display: grid; gap: 1.5rem; margin-top: clamp(1.75rem, 3.5vw, 2.75rem); }
.partner-betriebe__liste { display: grid; gap: 0.75rem; margin: 0; padding: 0; list-style: none; }
.partner-betriebe__item { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 1rem; align-items: center; padding: 1rem 1.25rem; border: 1px solid var(--linie); border-radius: var(--r-karte); background: #fff; box-shadow: var(--schatten); }
.partner-betriebe__item .icon-kreis { width: 3rem; height: 3rem; }
.partner-betriebe__item .icon-kreis .icon { stroke-width: 2.5; }
.partner-betriebe__titel { color: var(--marine); font: 800 var(--fs-text)/1.3 var(--font-titel); }
.partner-betriebe__text { margin-top: 0.25rem; font-size: var(--fs-klein); }
.partner-betriebe__bild { overflow: hidden; height: clamp(15rem, 70vw, 22rem); border-radius: 50% 50% var(--r-gross) var(--r-gross) / 28% 28% var(--r-gross) var(--r-gross); }
.partner-betriebe__bild img, .partner-betriebe__bild .foto-platzhalter { width: 100%; height: 100%; aspect-ratio: auto; object-fit: cover; }
.partner-passt { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1rem 1.25rem; align-items: center; margin-top: 2rem; padding: 1.5rem 1.25rem; overflow: hidden; }
.partner-passt .kicker { margin-bottom: 0.5rem; }
.partner-passt__titel { color: #fff; font: 800 var(--fs-h2)/1.15 var(--font-titel); letter-spacing: -0.02em; }
.partner-passt__icon {
  display: grid; place-items: center; width: 4.5rem; height: 4.5rem; border-radius: 50%;
  background: rgb(255 255 255 / 0.1); box-shadow: 0 0 0 0.75rem rgb(255 255 255 / 0.06), 0 0 0 1.5rem rgb(255 255 255 / 0.03); color: var(--mint-auf-dunkel);
}
.partner-passt__icon .icon { width: 2.25rem; height: 2.25rem; }
.partner-passt .knopf { grid-column: 1 / -1; }
@media (min-width: 48rem) {
  .partner-passt { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "text icon" "knopf icon"; padding: 2rem 2.5rem; }
  .partner-passt > div { grid-area: text; }
  .partner-passt .knopf { grid-area: knopf; justify-self: start; }
  .partner-passt__icon { grid-area: icon; width: 6.5rem; height: 6.5rem; margin-right: 1.5rem; }
  .partner-passt__icon .icon { width: 3rem; height: 3rem; }
}
@media (min-width: 64rem) {
  .partner-betriebe__inhalt { grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr); align-items: stretch; gap: 3rem; }
  .partner-betriebe__bild { height: auto; min-height: 26rem; border-radius: 16rem var(--r-gross) var(--r-gross) 16rem / 50% var(--r-gross) var(--r-gross) 50%; }
}

/* --- Fragen (p6): alle offen, Icon-Kachel links, Pfeil rechts; Schlusskarte --- */
/* Abgrenzung (R5, Kunde 2026-10-25 «es gäbe keine Abgrenzung»): Warum Heimtreffer und Gesuchte
   Betriebe stehen auf --bg-hell (partner.ejs section--hell), die Abschnitte dazwischen auf Weiss. */
.partner-fragen { padding-top: clamp(1.5rem, 3vw, 3rem); }   /* folgt auf die gruene Karte, deren Abschnitt unten genug Luft hat */
/* Icon-Kachel links ausserhalb des Flusses, damit die Antwort direkt unter der Frage steht */
.partner-faq .faq__item { position: relative; min-height: 5rem; }
.partner-faq .faq__frage { align-items: flex-start; gap: 1rem; min-height: 0; padding: 1.125rem 1.25rem 0.5rem calc(1.25rem + 3rem + 1rem); }
.partner-faq .faq__item:not([open]) .faq__frage { padding-bottom: 1.125rem; }
.partner-faq__frage { flex: 1; }
.partner-faq .icon-kachel { position: absolute; top: 1rem; left: 1.25rem; width: 3rem; height: 3rem; }
.partner-faq .faq__frage > .icon { width: 1.375rem; height: 1.375rem; color: var(--gruen); transition: transform var(--dur) var(--ease); }
.partner-faq .faq__item:not([open]) .faq__frage > .icon { transform: rotate(-90deg); }
.partner-faq .faq__antwort { margin: 0 1.25rem 0 calc(1.25rem + 3rem + 1rem); padding: 0 0 1.25rem; border-top: 0; font-size: var(--fs-klein); }
.partner-schluss { display: grid; margin-top: 2.5rem; overflow: hidden; border-radius: var(--r-gross); background: color-mix(in srgb, var(--mint) 60%, var(--bg)); }
.partner-schluss__text { padding: 1.75rem 1.25rem 1.5rem; }
.partner-schluss__lead { margin-top: 0.75rem; }
.partner-schluss .knopf { margin-top: 1.25rem; }
.partner-schluss__klein { margin-top: 0.875rem; color: var(--text-2); font-size: var(--fs-mini); }
.partner-schluss__bild { height: clamp(12rem, 52vw, 18rem); }
.partner-schluss__bild img, .partner-schluss__bild .foto-platzhalter { width: 100%; height: 100%; aspect-ratio: auto; object-fit: cover; }
@media (min-width: 48rem) {
  .partner-faq .faq__antwort { font-size: var(--fs-text); }
  .partner-faq .faq__antwort p { max-width: 39rem; }   /* hoechstens rund 78 Zeichen je Zeile */
  .partner-schluss { grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr); }
  .partner-schluss__text { padding: 2.5rem; }
  .partner-schluss__bild { height: auto; -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 30%); mask-image: linear-gradient(90deg, transparent 0, #000 30%); }
}

/* --- Bewerbung (p7): Karte auf dunklem, unscharfem Foto ------------------ */
.partner-bewerben { position: relative; isolation: isolate; overflow: hidden; padding-block: var(--pad); background: var(--marine); }
.partner-bewerben__bild { position: absolute; inset: 0; z-index: -2; }
.partner-bewerben__bild img, .partner-bewerben__bild .foto-platzhalter { width: 100%; height: 100%; aspect-ratio: auto; object-fit: cover; filter: blur(12px); transform: scale(1.08); }
.partner-bewerben::before { content: ''; position: absolute; inset: 0; z-index: -1; background: rgb(11 31 58 / 0.7); }
.partner-form { max-width: 30rem; margin-inline: auto; }
.partner-form:not(.is-live) .stufen { display: none; }
.partner-form .stufen { margin-bottom: 1.5rem; }
.partner-form .stufen .icon { display: none; }
.partner-form .stufen li.is-done { background: var(--gruen); color: #fff; }
.partner-form .stufen li.is-done .stufen__nr { display: none; }
.partner-form .stufen li.is-done .icon { display: block; }
.partner-form .stufen li.is-now { background: var(--gruen-dunkel); color: #fff; }
.partner-form .stufen li.is-done + li::before { background: var(--gruen); }
.partner-form__kicker { margin-bottom: 0.625rem; }
.partner-form .schritt__legend { font-size: clamp(1.625rem, 1.35rem + 1.1vw, 2rem); }
.partner-form .field__zaehler { margin-top: 0.125rem; }
.partner-form__weiter { margin-top: 1.5rem; }
.partner-zurueck { display: inline-flex; align-items: center; gap: 0.5rem; min-height: 2.75rem; padding: 0; border: 0; background: none; color: var(--gruen); font: 600 var(--fs-text)/1.2 var(--font-text); cursor: pointer; }
.partner-zurueck .icon { width: 1.25rem; height: 1.25rem; }
@media (hover: hover) { .partner-zurueck:hover { color: var(--gruen-dunkel); text-decoration: underline; text-underline-offset: 0.25em; } }