/* =========================================================================
   360web — Suchergebnis
   Eigenständige Komponente für den Seitenkopf der SEO-Seite.
   Alle Farben und Maße liegen als Variablen auf .serp selbst, damit nichts
   mit dem übrigen Stylesheet kollidiert.
   ========================================================================= */

.serp{
  --sr-brand:#1a4bf0;--sr-brand-tint:#eff4fe;--sr-link:#1a3fbf;--sr-dark:#06233f;
  --sr-text:#072034;--sr-text-2:#2c3e51;--sr-muted:#55677a;--sr-muted-2:#8593a3;
  --sr-on-dark:#c2d2e2;--sr-line:rgba(6,35,63,.13);--sr-line-soft:rgba(6,35,63,.06);
  --sr-leiste-bg:#fbfcfe;--sr-karte-bg:#e8eef6;--sr-karte-weg:#c3d2e2;
  --sr-radius:10px;--sr-radius-sm:6px;--sr-radius-xs:4px;--sr-shadow:0 40px 80px -50px rgba(7,32,52,.7);
  --sr-display:"Familjen Grotesk",ui-sans-serif,system-ui,sans-serif;
  --sr-body:"Manrope",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  width:min(100%,540px);background:#fff;border:1px solid var(--sr-line);border-radius:var(--sr-radius);overflow:hidden;
  box-shadow:var(--sr-shadow);font-family:var(--sr-body);color:var(--sr-text);font-size:16px;line-height:1.55;text-align:left;-webkit-font-smoothing:antialiased;
}
.serp *{box-sizing:border-box}
.sr-kopf{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:14px 18px;border-bottom:1px solid var(--sr-line)}
.sr-kopf b{font-family:var(--sr-display);font-weight:700;font-size:15px;letter-spacing:-.022em}.sr-kopf span{font-size:11.5px;color:var(--sr-muted-2)}
.sr-blatt{padding:18px;display:grid;gap:15px;position:relative;border-radius:var(--sr-radius-sm);outline:1.5px solid transparent;outline-offset:-5px;transition:outline-color .45s ease,background .45s ease}
.serp.alles .sr-blatt{outline-color:var(--sr-brand);background:rgba(26,75,240,.045)}
.serp [data-t]{border-radius:var(--sr-radius-xs);outline:1.5px solid transparent;outline-offset:5px;transition:opacity .45s ease,outline-color .45s ease,background .45s ease}
.serp [data-t].aus{opacity:.36}.serp [data-t].an{opacity:1;outline-color:var(--sr-brand);background:var(--sr-brand-tint)}
.sr-suche{display:flex;align-items:center;gap:9px;border:1px solid var(--sr-line);border-radius:999px;padding:9px 15px;font-size:13.5px;color:var(--sr-text-2)}
.sr-suche svg{color:var(--sr-muted-2);flex:none}.serp .sr-suche.an{background:#fff;border-color:var(--sr-brand)}
.sr-treffer{display:grid;gap:5px}.sr-pfad{display:block;font-size:12px;color:var(--sr-muted)}
.sr-titel{display:block;font-size:15.5px;line-height:1.3;font-weight:600;letter-spacing:-.015em;color:var(--sr-link)}
.sr-text{display:block;font-size:12.8px;line-height:1.5;color:var(--sr-muted)}
.sr-links{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:3px}.sr-links i{font-style:normal;font-size:12.5px;color:var(--sr-link);border-bottom:1px solid rgba(26,63,191,.28)}
.sr-faq{display:grid;margin-top:4px;border-top:1px solid var(--sr-line-soft)}.sr-faq i{font-style:normal;font-size:12.5px;color:var(--sr-text-2);padding:8px 0;border-bottom:1px solid var(--sr-line-soft);display:flex;justify-content:space-between;align-items:center}.sr-faq i::after{content:"⌄";color:var(--sr-muted-2);font-size:14px;line-height:1;transform:translateY(-2px)}
.sr-lokal{display:flex;align-items:center;gap:12px;border:1px solid var(--sr-line);border-radius:var(--sr-radius-sm);padding:11px 13px}.serp .sr-lokal.an{background:#fff;border-color:var(--sr-brand)}
.sr-karte{width:46px;height:46px;flex:none;position:relative;border-radius:var(--sr-radius-xs);background:var(--sr-karte-bg);background-image:linear-gradient(115deg,transparent 46%,var(--sr-karte-weg) 46%,var(--sr-karte-weg) 52%,transparent 52%),linear-gradient(to right,rgba(6,35,63,.09) 1px,transparent 1px),linear-gradient(to bottom,rgba(6,35,63,.09) 1px,transparent 1px);background-size:100% 100%,12px 12px,12px 12px}
.sr-karte::after{content:"";position:absolute;left:50%;top:50%;width:9px;height:9px;margin:-5px 0 0 -5px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:var(--sr-brand)}
.sr-lokal-text{display:grid;gap:2px;min-width:0}.sr-lokal-text b{font-size:13.5px;font-weight:600;letter-spacing:-.015em}.sr-lokal-text i{font-style:normal;font-size:12px;color:var(--sr-muted)}
.sr-technik{display:grid;gap:7px;border-top:1px solid var(--sr-line-soft);padding-top:13px}.sr-technik b{font-size:11.5px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--sr-muted-2)}.sr-technik span{display:flex;flex-wrap:wrap;gap:6px}.sr-technik i{font-style:normal;font-size:11.5px;font-weight:500;color:var(--sr-text-2);border:1px solid var(--sr-line-soft);border-radius:var(--sr-radius-xs);padding:4px 8px}
.sr-fuss{background:var(--sr-dark);color:#fff;padding:15px 18px;display:grid;gap:4px;min-height:82px;align-content:center}.sr-fuss b{font-family:var(--sr-display);font-weight:700;font-size:1.08rem;letter-spacing:-.026em}.sr-fuss span{font-size:13px;line-height:1.5;color:var(--sr-on-dark)}.sr-fuss b,.sr-fuss span{transition:opacity .19s ease,transform .19s ease}.serp.wechsel .sr-fuss b,.serp.wechsel .sr-fuss span{opacity:0;transform:translateY(3px)}
.sr-leiste{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 18px;border-top:1px solid var(--sr-line);background:var(--sr-leiste-bg)}.sr-punkte{display:flex;gap:6px}.sr-punkt{width:20px;height:6px;border:0;border-radius:3px;background:#d5dde6;padding:0;cursor:pointer;transition:background .3s ease,width .3s ease}.sr-punkt:hover{background:#a9b6c4}.sr-punkt:focus-visible{outline:2px solid var(--sr-brand);outline-offset:3px}.sr-punkt.an{background:var(--sr-brand);width:28px}.sr-ehrlich{font-size:12px;color:var(--sr-muted-2)}
.seo-hero-visual{display:grid;min-width:0}
@media(max-width:520px){.sr-kopf{padding:13px 16px}.sr-blatt{padding:16px;gap:13px}.serp [data-t]{outline-offset:3px}.sr-fuss{padding:15px 16px;min-height:0}.sr-leiste{padding:11px 16px}.sr-ehrlich{display:none}}
@media(prefers-reduced-motion:reduce){.serp [data-t],.sr-blatt,.sr-fuss b,.sr-fuss span,.sr-punkt{transition:none}}