/*! WANDKIND Trustami-Sterne v1 (27.09.2026, Paket cf-trustami-20260927, Nachtrag 1) – nur geladen, wenn der Trustami-Schalter an ist
   (Vorschau-Link bzw. golive): auf Seiten mit Sternen (gültige Live-Daten) sowie auf Produkt- und Motivseiten auch ohne Daten
   (component/cf-trustami-v1/sterne.html.twig, genau einmal je Seite). Alle Selektoren beginnen mit .cf-ta… bzw. :root:has(.cf-ta-top) –
   außer den zwei Abstands-Regeln in 4). Sterne-Farben stehen als fill/stroke im SVG – ohne diese Datei stimmen Größe und Farbe trotzdem.
   Kopfzeile (nur .cf-ta-top = Vorteils-Zeile mit Sternen): links LKW + „Kostenlose Lieferung (in DE)“, rechts der Sterne-Link.
   Unter 992 px zweizeilig: Sterne, darunter „4,84 · 10.920“ – Note UND Anzahl sind auf jeder Breite sichtbar (nie Sterne allein).
   Leiste am Handy 36 statt 32 px hoch (--cf-hd-top-h; die mitlaufende Kopfzeile rechnet damit: top = −36 px) → Tippfläche 36 px.
   Breiten gemessen (tests/breiten-test.js, Quicksand, ohne Unterschneidung): 320–1920 px ohne Überlauf/Abschneiden. */
.cf-ta-sr{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.cf-ta-sterne{display:block;flex:none}
.cf-ta .cf-ta-link,.cf-ta-top .cf-ta-link{display:inline-flex;align-items:center;flex-wrap:wrap;gap:4px 8px;color:inherit;text-decoration:none}
.cf-ta .cf-ta-note,.cf-ta-top .cf-ta-note{font-weight:700}
.cf-ta .cf-ta-anz,.cf-ta-top .cf-ta-anz{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px}
.cf-ta .cf-ta-link:hover .cf-ta-anz,.cf-ta-top .cf-ta-link:hover .cf-ta-anz{text-decoration-thickness:2px}
.cf-ta .cf-ta-link:focus-visible,.cf-ta-top .cf-ta-link:focus-visible{outline:2px solid #467A4A;outline-offset:2px}

/* 1) Kopfzeile v1 – Vorteils-Zeile */
:root:has(.cf-ta-top){--cf-hd-top-h:36px}
.cf-ta-top .cf-hd-top-in{justify-content:space-between;gap:12px}
.cf-ta-top .cf-ta-kurz{display:none}
.cf-ta-top .cf-hd-toplinks{display:flex;align-items:center;flex:none;height:100%}
.cf-ta-top .cf-hd-toplinks>li:not(.cf-ta-toplink){display:none}
.cf-ta-top .cf-ta-toplink{display:flex;height:100%}
/* < 992 px: zweizeilig (Sterne 60 × 12, darunter „4,84 · 10.920“ in 11,5 px) – 12 + 2 + 13,2 = 27,2 px hoch, passt in 36 px */
.cf-ta-top .cf-ta-link.cf-ta-kopf{flex-direction:column;flex-wrap:nowrap;justify-content:center;align-items:center;gap:2px;height:100%;min-height:var(--cf-hd-top-h);margin-right:-8px;padding:0 8px;white-space:nowrap}
.cf-ta-top .cf-ta-link.cf-ta-kopf:focus-visible{outline-offset:-3px}
.cf-ta-top .cf-ta-kopf .cf-ta-sterne{width:60px;height:12px}
.cf-ta-top .cf-ta-kopf .cf-ta-txt{font-size:11.5px;line-height:1.15}
.cf-ta-top .cf-ta-von,.cf-ta-top .cf-ta-bew,.cf-ta-top .cf-ta-bei{display:none}
@media (max-width:767.98px){
    .cf-ta-top .cf-ta-lang{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
    .cf-ta-top .cf-ta-kurz{display:inline}
}
/* ab 992 px einzeilig: „★★★★★ 4,84/5 · 10.920 Bewertungen“ (ab 1200 px „… bei Trustami“), daneben „Hilfe & Kontakt“ */
@media (min-width:992px){
    .cf-ta-top .cf-hd-top-in{gap:16px}
    .cf-ta-top .cf-hd-toplinks{gap:12px}
    .cf-ta-top .cf-hd-toplinks>li:not(.cf-ta-toplink){display:flex}
    .cf-ta-top .cf-ta-link.cf-ta-kopf{flex-direction:row;gap:6px}
    .cf-ta-top .cf-ta-kopf .cf-ta-sterne{width:70px;height:14px}
    .cf-ta-top .cf-ta-kopf .cf-ta-txt{font-size:inherit;line-height:inherit}
    .cf-ta-top .cf-ta-von,.cf-ta-top .cf-ta-bew{display:inline}
    /* 992–1199: „Hilfe & Kontakt“ ohne Symbol, damit „4,84/5 · 10.920 Bewertungen“ ohne Abschneiden daneben passt */
    .cf-ta-top .cf-hd-toplinks>li:not(.cf-ta-toplink) .cf-hd-i{display:none}
}
@media (min-width:1200px){
    .cf-ta-top .cf-hd-toplinks{gap:20px}
    .cf-ta-top .cf-ta-bei{display:inline}
    .cf-ta-top .cf-hd-toplinks>li:not(.cf-ta-toplink) .cf-hd-i{display:block}
}

/* 2) Handy-Menü der Kopfzeile v1 */
.cf-ta--drawer{margin:16px 0 0;font-size:14px;line-height:1.4}
.cf-ta--drawer .cf-ta-link{min-height:44px;padding:4px 0;color:#2B3136;font-weight:600}
.cf-ta--drawer .cf-ta-hinweis{margin:4px 0 0;font-size:12.5px;line-height:1.45;color:#5F666C}

/* 3) Fußzeile v1 (Gruppe „Shopbewertungen“; auf Kassen-Seiten in der reduzierten, zentrierten Fußzeile) */
.cf-ta--fuss{max-width:520px;font-size:14px;line-height:1.4}
.cf-ta--fuss .cf-ta-link{min-height:44px;color:#2B3136;font-weight:600}
.cf-ta--fuss .cf-ta-link:hover{color:#467A4A}
.cf-ta--fuss .cf-ta-hinweis{margin:6px 0 0;font-size:12.5px;line-height:1.5;color:#5F666C}
.cf-ta-mingroup .cf-ta--fuss{margin:0 auto}

/* 4) Nachtrag 1: Kaufbox und Motiv-Hero zeigen mit Schalter KEINEN Trustami-Hinweis mehr (Sterne nur oben in der Leiste). Die Datei
      kommt dort nur mit Schalter auf die Seite – diese Regeln wirken also nur dann. Sie ersetzen den Abstand, den vorher die Zeile
      zwischen Überschrift und Preis gab: Produktseite v1 8 → 16 px (h1 32/26 px, Preis 30 px), Motivseite 10 → 16 px (Preis 28 px).
      Spezifität je +1 Klasse gegenüber produkt-v1.css (0,3,0) bzw. motif-v3.css (1,2,0), weil diese Dateien später geladen werden.
      Alte Produktseite: kein Eingriff nötig (Theme: h1 16 px, Preis 25 px → 25 px). Keine Höhe/Mindesthöhe, kein leerer Rahmen. */
.cf-pd1 .cf-pd1-panel .cms-element-buy-box .productbox-headline{margin-bottom:16px}
#cfcustomcart-addmotifpage.cf-v3 .cf-v3-panel .cf-v3-title{margin-bottom:16px}

/* 5) Startseite v1 (Kundenstimmen) – .cf-ta.cf-ta--start (0,2,0) schlägt „.cf-start-v1 :is(…,p,…){margin:0}“ (0,1,1) */
.cf-ta.cf-ta--start{display:flex;flex-wrap:wrap;align-items:center;gap:0 12px;margin:16px 0 0;font-size:15px;line-height:1.45;color:#2B3136}
.cf-ta--start .cf-ta-link{min-height:44px;font-weight:600}
.cf-ta--start .cf-ta-stand{font-size:13px;color:#5F666C}