/* Parts "ruhig" (06.11.2026) -- Vorschau-Gestaltung nach dem Baufirmen-Atlas / Network-Vorschau.
   Joshua 06.11.: Navy-Heldflaechen, Gold-Knoepfe, Creme und Zierschrift wirken unruhig. Hier: weisser Grund, EINE Schrift (Inter),
   EINE Akzentfarbe (Navy), Gold nur im Logo, graue Etiketten, ruhige Karten mit Haarlinie, eine Menuezeile.
   Alles haengt an body.rh. Die Variablen unten ordnen auch die Altregeln (marktplatz.css) auf die ruhigen Werte um. */
body.rh{
  --n:#0e2a3b; --n2:#16384c; --l:#d9e1e7; --l2:#e8edf1; --bg2:#f4f7f9; --t:#1d2c34; --m:#5b6b76; --fehler:#9a3a22; --ok:#205a3f; --ok-bg:#e7f1eb; --ok-l:#bcd8c8;
  /* Umordnung fuer Altregeln (marktplatz.css, Makros) */
  --navy:var(--n); --meta:var(--m); --linie:var(--l); --linie-2:var(--l); --tinte:var(--t); --gold-text:var(--n);
  --serif:"Inter",system-ui,sans-serif; --sans:"Inter",system-ui,sans-serif; --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --r:12px;
  /* Altnamen der Hausschema-Variablen, damit die Modul-Blaetter (suche.css, auth.css, dokumente.css, oeffentlich.css, zielseite.css)
     in den ruhigen Werten rendern: Gold -> Navy (eine Akzentfarbe), Creme -> Hellgrau, Papier -> Weiss. */
  --navy2:var(--n2); --gold:var(--n); --gold2:var(--n2); --cream:var(--bg2); --paper:#fff; --ink:var(--t); --muted:var(--m);
  --line:var(--l); --line-2:var(--l); --kontrollzeichen:var(--m); --blue:var(--n); --red:var(--fehler);
  --muted-text:var(--m); --ok-text:var(--ok); --yellow-ink:#fff; --radius:12px; --rand:32px; --breite:1180px;
  --schatten:0 1px 2px rgba(14,42,59,.04); --schatten-hoch:0 10px 28px rgba(14,42,59,.10);
}
body.rh *{box-sizing:border-box}
html{scroll-behavior:smooth}
body.rh{margin:0;background:#fff;color:var(--t);font-family:var(--sans);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:clip}
:where(body.rh) a{color:var(--n);text-decoration:none}
:where(body.rh) img{max-width:100%}
:where(body.rh) h1,:where(body.rh) h2,:where(body.rh) h3,:where(body.rh) h4{font-family:var(--sans);color:var(--n);letter-spacing:-.015em;margin:0}
:where(body.rh) h1{font-size:clamp(2rem,4.2vw,3.1rem);line-height:1.1;font-weight:600;text-wrap:balance}
:where(body.rh) h2{font-size:clamp(1.5rem,2.6vw,2rem);line-height:1.2;font-weight:600;text-wrap:balance}
:where(body.rh) h3{font-size:1.1rem;line-height:1.3;font-weight:600}
:where(body.rh) p{margin:0 0 14px}
.rh-in,.wrap{width:100%;max-width:1180px;margin:0 auto;padding-left:32px;padding-right:32px}
@media (max-width:640px){.rh-in,.wrap{padding-left:18px;padding-right:18px}}
.sr-only,.nur-vorleser{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.skip{position:absolute;left:-999px;top:8px;background:var(--n);color:#fff!important;padding:10px 14px;border-radius:8px;z-index:1000;font-weight:600}
.skip:focus{left:8px}
body.rh :focus-visible{outline:2px solid var(--n);outline-offset:2px}

/* ---------- Kopf: EINE Zeile ---------- */
.rh-kopf{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid var(--l2)}
.rh-kopfzeile{display:flex;align-items:center;gap:28px;min-height:68px;max-width:1360px}
.rh-kopfzeile + .rh-mob{}
.rh-logo{display:flex;align-items:center;gap:10px;color:var(--n)}
.rh-logo svg{flex-shrink:0}
.rh-logo-text{display:flex;flex-direction:column;line-height:1}
.rh-logo-text b{font-size:1.18rem;font-weight:700;letter-spacing:-.02em;color:var(--n)}
.rh-logo-text i{font-style:normal;font-size:.62rem;letter-spacing:.3em;color:var(--m);font-weight:600;margin-top:3px}
.rh-nav{display:flex;align-items:center;gap:22px;font-size:14.5px}
.rh-nav a{color:#3a4852;padding:6px 0;border-bottom:2px solid transparent;white-space:nowrap}
.rh-nav a:hover{color:var(--n)}
.rh-nav a.an{color:var(--n);font-weight:600;border-bottom-color:var(--n)}
.rh-rechts{margin-left:auto;display:flex;align-items:center;gap:18px}
.rh-suche{display:flex;align-items:center}
.rh-suche input{width:170px;height:38px;border:1px solid var(--l);border-right:0;border-radius:8px 0 0 8px;padding:0 12px;font:inherit;font-size:14px;color:var(--t);background:#fff}
.rh-suche button{height:38px;width:40px;border:1px solid var(--l);border-radius:0 8px 8px 0;background:#fff;color:var(--n);display:grid;place-items:center;cursor:pointer;padding:0}
.rh-suche button:hover{border-color:var(--n)}
.rh-sprachen{display:flex;gap:2px;font-size:12.5px;letter-spacing:.04em}
.rh-sprachen a{color:var(--m);display:inline-flex;align-items:center;justify-content:center;min-width:28px;min-height:28px}/* Zielgroesse >= 24 px (WCAG 2.5.8) */
.rh-sprachen a.on{color:var(--n);font-weight:700}
.rh-knopf{display:inline-flex;align-items:center;justify-content:center;background:var(--n);color:#fff!important;border:1px solid var(--n);border-radius:8px;padding:9px 16px;font-weight:600;font-size:14.5px;white-space:nowrap;cursor:pointer;font-family:inherit}
.rh-knopf:hover{background:var(--n2)}
.rh-knopf.hell{background:#fff;color:var(--n)!important;border-color:var(--l)}
.rh-knopf.hell:hover{border-color:var(--n)}
@media (max-width:1560px){.rh-weit{display:none}.rh-suche input{display:none}.rh-suche button{border-radius:8px}}
@media (max-width:1100px){.rh-nav,.rh-rechts{display:none}}
.rh-mob{display:none;margin-left:auto}
@media (max-width:1100px){.rh-mob{display:block}}
.rh-mob summary{list-style:none;cursor:pointer;width:42px;height:38px;display:grid;place-items:center;border:1px solid var(--l);border-radius:8px;font-size:18px;color:var(--n)}
.rh-mob summary::-webkit-details-marker{display:none}
.rh-mob-panel{position:absolute;left:0;right:0;top:100%;background:#fff;border-bottom:1px solid var(--l);box-shadow:0 14px 30px rgba(14,42,59,.10);padding:12px 18px 18px;display:flex;flex-direction:column}
.rh-mob-panel nav{display:flex;flex-direction:column}
.rh-mob-panel nav a{padding:12px 0;border-bottom:1px solid var(--l2);font-size:15.5px;color:#3a4852}
.rh-mob-panel nav a.an{color:var(--n);font-weight:600}
.rh-mob-panel .rh-suche{margin:14px 0 6px}
.rh-mob-panel .rh-suche input{display:block;flex:1;width:auto}
.rh-mob-panel .rh-suche button{border-radius:0 8px 8px 0}
.rh-mob-panel .rh-sprachen{margin:10px 0 14px}
.rh-mob-panel .rh-knopf{margin-top:8px}
.rh-kopf{position:sticky}

/* ---------- Seitenkopf / Abschnitte ---------- */
.eyebrow{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--m);margin:0 0 10px}
.seitenkopf,.rh-seitenkopf{padding:60px 0 38px;border-bottom:1px solid var(--l2);background:#fff}
.seitenkopf h1,.rh-seitenkopf h1{max-width:24ch}
.seitenkopf .lead,.rh-seitenkopf .lead{font-size:1.1rem;color:var(--m);max-width:62ch;margin:14px 0 0}
@media (max-width:640px){.seitenkopf,.rh-seitenkopf{padding:38px 0 26px}}
.sek{padding:68px 0}
.sek.alt{background:var(--bg2);border-top:1px solid var(--l2);border-bottom:1px solid var(--l2)}
@media (max-width:760px){.sek{padding:46px 0}}
.kopfz{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-bottom:30px}
.kopfz p{margin:8px 0 0;color:var(--m);max-width:62ch}
.mehr-link{font-weight:600;white-space:nowrap}
.mehr-link:after{content:" →"}
.zwei{display:grid;grid-template-columns:5fr 6fr;gap:56px;align-items:start}
.zwei .prosa p{color:#3d4b55;max-width:62ch}
@media (max-width:900px){.zwei{grid-template-columns:minmax(0,1fr);gap:18px}}

/* ---------- Hero Start ---------- */
.rh-held{padding:92px 0 54px;text-align:center}
.rh-held h1{max-width:20ch;margin:0 auto}
.rh-held .lead{font-size:1.15rem;color:var(--m);max-width:58ch;margin:18px auto 30px}
.rh-held form{display:flex;max-width:640px;margin:0 auto;border:1px solid var(--l);border-radius:10px;background:#fff;overflow:hidden;box-shadow:0 8px 26px rgba(14,42,59,.06)}
.rh-held form:focus-within{border-color:var(--n);outline:2px solid var(--n);outline-offset:2px}
.rh-held input{flex:1;min-width:0;border:0;padding:16px 18px;font:inherit;font-size:1rem;color:var(--t);background:transparent}
.rh-held input:focus-visible{outline:0;box-shadow:none}/* der Ring liegt auf dem Formular (:focus-within) */
.rh-held form button{border:0;background:var(--n);color:#fff;padding:0 26px;font:inherit;font-weight:600;cursor:pointer}
.rh-held form button:hover{background:var(--n2)}
.rh-held .zweit{margin-top:20px;font-size:.95rem;color:var(--m)}
.rh-held .zweit a{font-weight:600}
@media (max-width:640px){.rh-held{padding:54px 0 34px}.rh-held form button{padding:0 16px}}
.rh-zahlen{display:flex;justify-content:center;flex-wrap:wrap;border-top:1px solid var(--l2);border-bottom:1px solid var(--l2)}
.rh-zahlen div{flex:1 1 0;min-width:170px;max-width:300px;text-align:center;padding:26px 14px;color:var(--m);font-size:.9rem}
.rh-zahlen div + div{border-left:1px solid var(--l2)}
.rh-zahlen b{display:block;font-size:2rem;font-weight:600;color:var(--n);letter-spacing:-.02em;line-height:1.1;font-variant-numeric:tabular-nums}
@media (max-width:640px){.rh-zahlen div{min-width:120px;padding:18px 8px}.rh-zahlen b{font-size:1.6rem}}

/* ---------- Kategorie-Karten ---------- */
.kat-raster{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
.kat-karte{display:flex;flex-direction:column;gap:4px;background:#fff;border:1px solid var(--l);border-radius:var(--r);padding:20px 22px;transition:border-color .15s,box-shadow .15s}
.kat-karte:hover{border-color:var(--n);box-shadow:0 10px 28px rgba(14,42,59,.10)}
.kat-karte b{font-weight:600;color:var(--n);font-size:1.05rem;line-height:1.3}
.kat-karte span{color:var(--m);font-size:.9rem;font-variant-numeric:tabular-nums}

/* ---------- Schritte (Start) ---------- */
.spalten{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:6px}
.spalte{background:#fff;border:1px solid var(--l);border-radius:var(--r);padding:24px 24px 20px}
.spalte .nr{font-size:.85rem;font-weight:700;color:var(--m);margin-bottom:10px;letter-spacing:.06em}
.spalte h3{margin-bottom:8px}
.spalte p{color:#3d4b55;margin:0;font-size:.95rem}
@media (max-width:900px){.spalten{grid-template-columns:minmax(0,1fr)}}

/* ---------- Haendler ---------- */
.haendler-reihe{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px;margin-top:30px}
.haendler-karte{background:#fff;border:1px solid var(--l);border-radius:var(--r);padding:16px 18px;display:flex;flex-direction:column;gap:6px}
.haendler-karte .region{font-weight:600;color:var(--n)}
.haendler-karte .seit{font-size:.82rem;color:var(--m)}
.abzeichen{display:inline-flex;align-items:center;gap:5px;font-size:.68rem;letter-spacing:.07em;text-transform:uppercase;font-weight:700;color:var(--n);border:1px solid var(--n);border-radius:20px;padding:2px 9px;width:max-content;white-space:nowrap}
.abzeichen.leer{color:var(--m);border-color:var(--l)}
.abzeichen svg{width:11px;height:11px}
.leer-hinweis{color:var(--m)}

/* ---------- Abschluss-Kasten / FAQ ---------- */
.cta-kasten{background:var(--bg2);border:1px solid var(--l);border-radius:16px;padding:44px 44px;display:grid;grid-template-columns:5fr 6fr;gap:44px;align-items:center}
.cta-kasten p{color:#3d4b55;max-width:56ch}
@media (max-width:900px){.cta-kasten{grid-template-columns:minmax(0,1fr);padding:28px 22px;gap:18px}}
.knoepfe{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-top:8px}
.faq details{background:#fff;border:1px solid var(--l);border-radius:10px;padding:0 18px;margin-bottom:10px}
.faq summary{cursor:pointer;padding:15px 0;font-weight:600;color:var(--n);list-style:none;display:flex;justify-content:space-between;gap:12px}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:"+";color:var(--m);font-weight:400}
.faq details[open] summary:after{content:"–"}
.faq details p{margin:0 0 16px;color:#3d4b55}

/* ---------- Knoepfe (Altklassen der Inhaltsseiten) ---------- */
body.rh main .btn,body.rh main .btn-gold,body.rh main .os-btn-gold{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--n);color:#fff!important;border:1px solid var(--n);border-radius:8px;padding:11px 20px;font:inherit;font-weight:600;font-size:15px;line-height:1.2;cursor:pointer;text-decoration:none}
body.rh main .btn:hover,body.rh main .btn-gold:hover,body.rh main .os-btn-gold:hover{background:var(--n2)}
body.rh main .btn-ghost,body.rh main .btn-quiet,body.rh main .os-btn-ghost{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:#fff;color:var(--n)!important;border:1px solid var(--l);border-radius:8px;padding:11px 20px;font:inherit;font-weight:600;font-size:15px;line-height:1.2;cursor:pointer;text-decoration:none}
body.rh main .btn-ghost:hover,body.rh main .btn-quiet:hover,body.rh main .os-btn-ghost:hover{border-color:var(--n)}
body.rh main .btn-gross,body.rh main .os-btn-lg{padding:14px 26px;font-size:16px}
body.rh main .btn-klein,body.rh main .btn-sm{padding:7px 12px;font-size:13.5px}

/* ---------- Karten, Raster, Listen der Inhaltsseiten ---------- */
.card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--l);border-radius:var(--r)}
.card-body{padding:24px 26px;display:flex;flex-direction:column;gap:10px}
.card-body p{margin:0}
.raster{display:grid;gap:20px}
.raster-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.raster-3{grid-template-columns:repeat(auto-fill,minmax(max(260px,(100% - 40px)/3),1fr))}
@media (max-width:760px){.raster-2{grid-template-columns:minmax(0,1fr)}}
.abschnitt{padding-top:50px;padding-bottom:14px}
.abschnitt:last-of-type{padding-bottom:96px}
.abschnitt h2{margin:0 0 14px}
.abschnitt > p.mute{max-width:64ch;margin:0 0 20px}
.mute{color:var(--m)}
.klein{font-size:15px}
.serif{font-family:var(--sans)}
.mono{font-family:var(--mono)}
.gelb{color:var(--n)}
svg.ic{flex-shrink:0;fill:none;stroke:currentColor}
.ueberzeile{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--m)}
.seite-kopf{display:flex;flex-direction:column;gap:12px;padding-top:60px;padding-bottom:38px;position:relative;isolation:isolate}
.seite-kopf:before{content:"";position:absolute;z-index:-1;top:0;bottom:0;left:calc(50% - 50vw);right:calc(50% - 50vw);background:#fff;border-bottom:1px solid var(--l2)}
.seite-kopf p{margin:0}
.seite-titel{max-width:24ch}
.seite-lead{font-size:1.1rem;color:var(--m);max-width:62ch}
.seite-knoepfe{margin-top:28px}
.karte-h,.rolle-titel,.schritt-karte-titel{font-size:1.25rem;margin:0;line-height:1.25}
.abschnitt .card h2{font-size:1.4rem;line-height:1.2;margin:0 0 4px}
.rolle-titel{font-size:1.5rem}
.rolle-lead{margin:0 0 6px}
.rolle .btn-ghost{align-self:flex-start;margin-top:6px}
.schritte{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.schritte li{display:flex;gap:16px;padding:14px 0;border-bottom:1px solid var(--l2)}
.schritte li:last-child{border-bottom:0}
.schritte li > div{display:flex;flex-direction:column;min-width:0;gap:2px}
.schritt-nr{font-size:1.05rem;font-weight:700;color:var(--m);width:30px;flex-shrink:0;line-height:1.7}
.schritt-nr.gross{font-size:1.5rem;line-height:1;width:auto}
.schritt-titel{font-size:1.1rem;font-weight:600;color:var(--n)}
.zusagen{list-style:none;margin:0;padding:0;counter-reset:zusage}
.zusagen li{display:flex;gap:16px;align-items:flex-start;padding:18px 0;border-bottom:1px solid var(--l2);counter-increment:zusage}
.zusagen li:last-child{border-bottom:0}
.zusagen li:before{content:counter(zusage);font-size:1.05rem;font-weight:700;color:var(--m);width:26px;flex-shrink:0;line-height:1.6}
.zusagen li .ic{margin-top:5px;color:var(--n)}
.zusagen li > div{display:flex;flex-direction:column;gap:4px;min-width:0}
.zusage-titel{font-size:1.15rem;font-weight:600;color:var(--n);line-height:1.3}
.nicht-liste{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.nicht-liste li{background:#fff;border:1px solid var(--l);border-radius:var(--r);padding:20px 24px;display:flex;flex-direction:column;gap:6px}
.card .nicht-liste{grid-template-columns:minmax(0,1fr);gap:0}
.card .nicht-liste li{border:0;border-bottom:1px solid var(--l2);border-radius:0;padding:14px 0;background:transparent}
.card .nicht-liste li:last-child{border-bottom:0}
.nicht-titel{font-size:1.1rem;font-weight:600;color:var(--n)}
@media (max-width:760px){.nicht-liste{grid-template-columns:minmax(0,1fr)}}
.kv{display:grid;grid-template-columns:minmax(0,200px) minmax(0,1fr);column-gap:24px;margin:8px 0 12px}
.kv > dt,.kv > dd{padding:10px 0;border-bottom:1px solid var(--l2);font-size:15px;margin:0;min-width:0;overflow-wrap:anywhere}
.kv > dt{color:var(--m)}
.kv > dt:last-of-type,.kv > dd:last-of-type{border-bottom:0}
@media (max-width:520px){.kv{grid-template-columns:minmax(0,1fr)}.kv > dt{border-bottom:0;padding-bottom:0}}
.platzhalter{font-family:var(--mono);font-size:13px;color:var(--n);border:1px dashed var(--m);border-radius:6px;background:var(--bg2);padding:2px 8px;display:inline-block}
.hinweis-kasten{display:flex;align-items:flex-start;gap:12px;padding:14px 18px;background:var(--bg2);border:1px solid var(--l);border-radius:10px;font-size:15px;color:var(--t);margin:4px 0 0}
.rechnung-abschnitt{display:flex;flex-direction:column;gap:6px}
.band{display:flex;align-items:center;gap:12px;padding:12px 18px;background:var(--ok-bg);border:1px solid var(--ok-l);border-radius:10px;font-size:15px;color:var(--ok)}
.zwei-spalten{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:56px;align-items:start}
@media (max-width:980px){.zwei-spalten{grid-template-columns:minmax(0,1fr);gap:36px}}
.angebot{display:flex;flex-direction:column;gap:14px;scroll-margin-top:90px}
.angebot-form{margin-top:10px}
.honig{display:none}
.stapel{display:flex;flex-direction:column;gap:20px}
.zeile{display:flex;align-items:center;gap:12px}
.zeile .ic{color:var(--n)}
.trust-titel{font-size:1.1rem;font-weight:600;color:var(--n)}
.punkte{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:6px}

/* ---------- Formulare (sell surplus: .f/.in; request: .os-form) ---------- */
.f{display:flex;flex-direction:column;gap:6px;margin-bottom:20px;min-width:0}
.f label,.os-form label{font-size:.82rem;font-weight:600;color:var(--n);display:block;margin:0 0 6px}
.os-form label .os-muted{font-weight:400;color:var(--m)}
.f-zeile{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px}
@media (max-width:640px){.f-zeile{grid-template-columns:minmax(0,1fr)}}
.in,.os-form input,.os-form select,.os-form textarea{width:100%;border:1px solid var(--l);border-radius:8px;padding:12px 14px;font-family:var(--sans);font-size:16px;line-height:1.4;color:var(--t);background:#fff;-webkit-appearance:none;appearance:none}
.os-form input[type=file]{padding:10px 12px;font-size:14px}
textarea.in,.os-form textarea{resize:vertical;min-height:140px}
.in.mono{font-family:var(--mono)}
.in:focus,.os-form input:focus,.os-form select:focus,.os-form textarea:focus{outline:2px solid var(--n);outline-offset:-1px;border-color:var(--n)}
.in::placeholder,.os-form input::placeholder,.os-form textarea::placeholder{color:#8896a0}
.f .fehler{font-size:13px;color:var(--fehler)}
.f.ungueltig .in{border-color:var(--fehler)}
.formular-fuss{display:flex;gap:16px;align-items:center;margin-top:8px;flex-wrap:wrap}
.os-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.os-form > div{min-width:0}
.os-form .full{grid-column:1/-1}
@media (max-width:700px){.os-form{grid-template-columns:minmax(0,1fr);gap:20px}}
.os-muted{color:var(--m)}
.os-note{border:1px solid var(--l);background:var(--bg2);padding:14px 18px;font-size:15px;color:var(--t);border-radius:10px}
.os-note a{font-weight:600;text-decoration:underline}
.anfrage{padding:50px 0 100px}
.anfrage .schmal{max-width:760px}
.flash-bereich{padding-top:20px}
.flash{border:1px solid var(--l);background:var(--bg2);padding:12px 16px;margin-bottom:8px;font-size:15px;color:var(--t);border-radius:10px}
.admin-hinweis{background:var(--bg2);border-bottom:1px solid var(--l);padding:10px 0;font-size:14px;color:var(--t)}

/* ---------- Firmenliste ---------- */
.lieferant-filter{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding-top:28px}
.pill{display:inline-flex;align-items:center;gap:6px;font-size:.84rem;font-weight:600;color:var(--n);background:#fff;border:1px solid var(--l);border-radius:20px;padding:5px 13px;white-space:nowrap}
.pill .mono{color:var(--m);font-weight:400;font-size:.8rem}
a.pill:hover{border-color:var(--n)}
.pill.ok{background:var(--n);color:#fff;border-color:var(--n)}
.pill.ok .mono{color:#cfdbe3}
.lieferant-karte{display:flex;background:#fff;border:1px solid var(--l);border-radius:var(--r);overflow:hidden;transition:border-color .15s,box-shadow .15s}
.lieferant-karte:hover{border-color:var(--n);box-shadow:0 10px 28px rgba(14,42,59,.10)}
.stapel-eng{display:flex;flex-direction:column;gap:8px;padding:20px 22px}
.lieferant-karte-logo{width:64px;height:64px;object-fit:contain;border-radius:8px;background:#fff;border:1px solid var(--l2)}
.lieferant-karte-titel{font-size:1.15rem;font-weight:600;color:var(--n);line-height:1.25}
div.leer{background:#fff;border:1px solid var(--l);border-radius:var(--r);padding:36px;text-align:center;color:var(--m)}
div.leer a{font-weight:600;text-decoration:underline}

/* ---------- Inseratskarten + Listenseite ---------- */
.zk-reihe{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px 20px}
@media (max-width:1100px){.zk-reihe{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:640px){.zk-reihe{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 12px}}
@media (max-width:480px){.zk-reihe{grid-template-columns:minmax(0,1fr)}}
.zk{position:relative;display:flex;flex-direction:column;color:inherit;text-decoration:none;background:#fff;border:1px solid var(--l);border-radius:var(--r);overflow:hidden;transition:border-color .15s,box-shadow .15s}
.zk:hover{border-color:var(--n);box-shadow:0 10px 28px rgba(14,42,59,.10)}
.zk-bild{position:relative;aspect-ratio:4/3;background:var(--bg2) center/cover no-repeat}
.zk-bild.zk-leer{background:var(--bg2)}
.zk-bild-name{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:14px;color:var(--m);font-weight:600;font-size:.95rem;line-height:1.25}
.zk-name{font-weight:600;font-size:1rem;line-height:1.3;color:var(--n);margin:14px 16px 0}
.zk-meta{font-size:.85rem;color:var(--m);margin:4px 16px 0}
.zk-fuss{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;margin:10px 16px 0;gap:6px 8px}
.zk-preis{font-weight:600;color:var(--n);font-size:.95rem}
.zk-fotozahl{position:absolute;top:10px;right:10px;background:rgba(255,255,255,.92);color:var(--n);font-size:.72rem;font-weight:600;line-height:1;padding:5px 8px;border-radius:20px}
.zk-fotozahl:before{content:"\1F4F7\00a0"}
.zk-haendler{display:flex;align-items:center;gap:6px;margin:10px 16px 14px;padding-top:8px;border-top:1px solid var(--l2);font-size:.82rem;color:var(--m)}
.zk-haendler img{width:18px;height:18px;object-fit:contain;border-radius:3px;background:#fff;border:1px solid var(--l2)}
.ergebnisse{padding:44px 0 80px}
/* Karte ohne Foto: ruhige Fassung (Initiale, Kategorie, Hinweis); eigene Regeln, weil die Startseite marktplatz.css nicht laedt */
body.rh .zk-bild.zk-leer.zk-gestaltet{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:10px;background:var(--bg2);border-top:0}
body.rh .zk-gestaltet .ph-ini{font-family:var(--sans);font-weight:600;font-size:2.4rem;line-height:1;color:var(--n);opacity:.7}
body.rh .zk-gestaltet .ph-kat{font-size:12.5px;font-weight:600;color:var(--n);text-align:center;line-height:1.25}
body.rh .zk-gestaltet .ph-text{font-size:11.5px;color:var(--m);text-align:center}
.mp-details{border-radius:var(--r)!important}
.mp-seite-titel{font-family:var(--sans)!important}
.mp-kopf .mp-anzahl{font-family:var(--sans)!important}
.mp-haupt .zk-reihe{gap:22px 18px}
.mp-reset{color:var(--n)!important;text-decoration:underline}
.mp-zahl{font-family:var(--mono)}
.leer-ergebnis{padding:80px 0;text-align:center}
.leer-ergebnis p{color:var(--m)}
.leer-ergebnis .serif{font-size:1.25rem;color:var(--n);font-weight:600}
.leer-ergebnis .knoepfe{justify-content:center;margin-top:20px}
.pagination{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:48px;flex-wrap:wrap}
.pagination .status{font-size:14px;color:var(--m)}
.pagination .seiten{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.pagination .seiten a,.pagination .seiten span.on{min-width:38px;text-align:center;padding:7px 11px;border:1px solid var(--l);border-radius:8px;background:#fff;color:var(--n);font-size:.92rem}
.pagination .seiten span.on{background:var(--n);color:#fff;border-color:var(--n)}
.pagination .seiten a:hover{border-color:var(--n)}
.pagination .seiten .punkte{color:var(--m);padding:0 4px}

/* ---------- Fuss: hell ---------- */
.rh-fuss{border-top:1px solid var(--l);background:#fff;padding:54px 0 40px;font-size:14.5px;color:var(--m)}
.rh-fuss .rh-in{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px}
.rh-fuss b{display:block;color:var(--n);font-weight:600;font-size:.95rem;margin-bottom:10px}
.rh-fuss a{display:block;padding:4px 0;color:#3a4852}
.rh-fuss a:hover{color:var(--n);text-decoration:underline}
.rh-fuss .fuss-sprachen{display:flex;gap:12px;margin-top:8px}
.rh-fuss .fuss-sprachen a{display:inline;padding:0}
.rh-fuss .fuss-sprachen a.on{color:var(--n);font-weight:700}
@media (max-width:900px){.rh-fuss .rh-in{grid-template-columns:1fr 1fr}}
.entwurf{position:fixed;bottom:14px;left:14px;background:var(--bg2);color:var(--n);border:1px solid var(--l);font-size:12px;padding:6px 10px;border-radius:8px;z-index:9}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* Login-Hinweis "Neu: ein Konto fuer die ganze Familie" traegt einen Inline-Stil mit Creme -> in der ruhigen Fassung hellgrau */
body.rh main p[style*="F6EEDC"]{background:var(--bg2)!important;border-color:var(--l)!important;border-radius:10px!important;color:var(--t)}

/* axe (06.11.): Tabellenkopf der Katalogsuche 4,42:1 (os-industrial: --os-steel) -> dunkleres Grau; Links im Fliesstext nur per Farbe -> unterstreichen */
body.rh main table th{color:var(--m)}
body.rh main .brotkrumen a,body.rh main .zentriert a{text-decoration:underline;text-underline-offset:2px}

/* Druck (13.11.2026): nur der Inhalt -- Kopf, Menue, Fuss, Knoepfe, Formulare und Galerie-Bedienung entfallen; Schwarz auf Weiss;
   Karten und Tabellenzeilen nicht mitten durchtrennen; Adressen von Links hinter dem Linktext (wichtig bei Teile- und Firmenseiten). */
@media print{
  body.rh{background:#fff;color:#000;font-size:11pt;line-height:1.45}
  body.rh .rh-kopf,body.rh .skip,body.rh #ansage,body.rh .rh-fuss,body.rh footer,body.rh .rh-mob,body.rh .lightbox,
  body.rh .galerie-leiste,body.rh .mehr-knopf,body.rh .mengenzeile,body.rh .aktion-knopf,body.rh .aktion-neben,
  body.rh .knoepfe,body.rh .btn,body.rh .os-btn,body.rh td.act,body.rh th.act,body.rh button,body.rh form[role=search],body.rh .abschluss{display:none !important}
  body.rh a{color:#000;text-decoration:underline}
  body.rh table{width:100%;table-layout:auto}
  body.rh td,body.rh th{overflow-wrap:anywhere}
  body.rh main a[href^="http"]::after{content:" (" attr(href) ")";font-size:9pt;word-break:break-all;color:#333}
  body.rh .card,body.rh .karte,body.rh .detailtabelle tr,body.rh .zk-karte,body.rh section{break-inside:avoid}
  body.rh h1,body.rh h2,body.rh h3{break-after:avoid;color:#000}
  body.rh .dt .beschreibung.gekappt{max-height:none;-webkit-mask-image:none;mask-image:none}
  body.rh .dt .zwei-oben{grid-template-columns:1fr;gap:16px}
  body.rh .wrap,body.rh .rh-in{max-width:none;padding-left:0;padding-right:0}
}
