/* ===========================================================
   1 · HERO  (Projekt / Testbericht)
   ------------------------------------------------------------
   Links die Galerie (ACF project_gallery), rechts Kicker, H1,
   Datenkarte und Buttons. Weisser Grund, kein Goldstrich am
   Kicker (helle Sektion).
   =========================================================== */
.pm-hero{padding:56px 0 76px;background:#fff;}
.pm-hero__grid{
  display:grid;grid-template-columns:1fr 1fr;
  gap:var(--sp-col);align-items:center;
}

/* --- Galerie --- */
/* Feste HOEHE statt fester Flaeche. Alle Bildvorlagen sind 750 px hoch;
   gibt man dem Bild eine feste Anzeigehoehe und laesst die Breite laufen,
   stehen alle Testberichte auf derselben Linie. Breitenunterschiede fallen
   beim Scrollen nicht auf, Hoehenunterschiede sofort — genau daran ist
   jede Loesung mit festem Seitenverhaeltnis gescheitert.
   Kein Rahmen, keine Flaeche: nur das Bild. */
/* Auf .pm-hero eingegrenzt. Ungescopt griff die feste Hoehe auch auf das
   Bereichsbild in Reihe 2 und zentrierte es in einem zu hohen Kasten —
   daher der Versatz zur Textspalte. */
.pm-hero .pm-gal__main{
  display:flex;align-items:center;justify-content:center;
  height:clamp(300px,38vw,460px);
}
.pm-hero .pm-gal__main img{
  height:100%;width:auto;max-width:100%;object-fit:contain;
  border-radius:10px;
  transition:opacity var(--t-hover);
}
/* Kacheln kleiner und linksbuendig statt ueber die volle Breite gestreckt —
   vier gleich grosse Felder wirkten schwerer als das Hauptbild. */
.pm-gal__thumbs{
  display:flex;flex-wrap:wrap;gap:10px;margin-top:14px;
}
.pm-gal__thumbs .pm-gal__t{width:62px;flex:0 0 auto;}
/* Kacheln nach derselben Regel: feste Hoehe, Breite laeuft. */
.pm-gal__t{
  border:0;border-radius:0;background:none;cursor:pointer;padding:0;
  height:64px;display:flex;align-items:center;justify-content:center;
  transition:transform var(--t-hover),opacity var(--t-hover);opacity:.45;
}
.pm-gal__t img{
  height:100%;width:auto;max-width:100%;object-fit:contain;
  border-radius:6px;
}
.pm-gal__t:hover{opacity:1;transform:translateY(-2px);}
.pm-gal__t.is-akt{opacity:1;}
/* Aktives Vorschaubild ohne Zusatzzeichen: das aktive Bild steht auf voller
   Deckkraft und voller Saettigung, die uebrigen sind zurueckgenommen. Bei
   Produktbildern ist der Bildinhalt das Signal — ein Ring oder Strich
   konkurriert damit. Der frueher gesetzte Goldring lag ausserdem hinter dem
   Bild und war nur an den gerundeten Ecken sichtbar. */
.pm-gal__t img{
  filter:saturate(.55);
  transition:filter var(--t-hover) var(--ease-out);
}
.pm-gal__t:hover img,
.pm-gal__t.is-akt img{filter:none;}

/* --- Datenkarte --- */
.pm-meta{
  border:1px solid var(--linie);border-radius:12px;
  padding:28px 30px;margin:0 0 var(--sp-block);
}
/* Note und Metadaten in EINER Karte. Vorher zwei Bloecke mit Trennstrich —
   fehlte die Note, blieb eine leere Karte mit einem Strich darin. */
.pm-meta__note{margin-bottom:20px;padding-bottom:20px;border-bottom:1px solid var(--linie);}
.pm-meta__zeile{display:flex;align-items:baseline;gap:11px;}
.pm-meta__lbl{
  font-size:0.6875rem;letter-spacing:.16em;text-transform:uppercase;
  font-weight:600;color:var(--schwach);display:block;margin-bottom:6px;
}
/* Ohne Unterstrich: er trennte nichts, sondern hing unter der Zahl. */
.pm-meta__zahl{
  font-size:3.25rem;line-height:1;font-weight:700;color:var(--blau);
  letter-spacing:-.035em;font-variant-numeric:tabular-nums;
}
.pm-meta__wort{
  font-size:1rem;color:var(--blau);font-weight:600;
}
/* .pm-meta__trenn entfaellt — die Trennung sitzt jetzt an .pm-meta__note. */
.pm-meta__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.pm-meta__wert{font-size:0.9375rem;font-weight:500;color:var(--blau);
  display:inline-flex;align-items:center;gap:8px;}
.pm-meta__wert a{color:var(--blau);border-bottom:1px solid var(--linie);}
.pm-meta__wert a:hover{border-color:var(--akzent);}
.pm-meta__punkt{
  display:inline-block;width:8px;height:8px;border-radius:50%;flex:0 0 auto;
  background:var(--schwach);
}
.pm-meta__wert.is-lizenz .pm-meta__punkt{background:var(--gruen);}
.pm-meta__wert.is-lizenz{color:var(--gruen);}

.pm-hero__fuss{
  font-size:0.7812rem;color:var(--schwach);margin-top:16px;line-height:1.6;
}

/* --- Einblenden --- */
.pm-hero [data-anim]{
  opacity:0;transform:translateY(var(--rv-y));
  transition:opacity var(--rv-t) ease,transform var(--rv-t) ease;
}
.pm-hero.is-in [data-anim]{opacity:1;transform:none;}
.pm-hero.is-in [data-anim-delay="1"]{transition-delay:.09s;}
.pm-hero.is-in [data-anim-delay="2"]{transition-delay:.18s;}
.pm-hero.is-in [data-anim-delay="3"]{transition-delay:.27s;}
.pm-hero.is-in [data-anim-delay="4"]{transition-delay:.36s;}

@media(max-width:1100px){.pm-hero__grid{gap:48px;}}
@media(max-width:900px){
  .pm-hero{padding:40px 0 52px;}
  .pm-hero__grid{grid-template-columns:1fr;gap:32px;}
  .pm-hero__gal{order:-1;}
  .pm-meta{padding:24px 22px;}
  .pm-meta__zahl{font-size:2.75rem;}
  .pm-meta__grid{grid-template-columns:1fr 1fr;gap:18px;}
  .pm-hero.is-in [data-anim-delay="1"]{transition-delay:.05s;}
  .pm-hero.is-in [data-anim-delay="2"]{transition-delay:.10s;}
  .pm-hero.is-in [data-anim-delay="3"]{transition-delay:.15s;}
  .pm-hero.is-in [data-anim-delay="4"]{transition-delay:.20s;}
}
@media(max-width:420px){
  .pm-btns{width:100%;}
  .pm .pm-btn{width:100%;text-align:center;padding:15px 24px;}
  .pm-meta__grid{grid-template-columns:1fr;}
}

/* ===========================================================
   2 · UEBERBLICK  (Ergebnis der Bewertungsbereiche)
   ------------------------------------------------------------
   Datenkarten: Kopf zweispaltig (links Nummer und Titel,
   rechts kompakter Donut), darunter die Pruefparameter als
   Zeilenliste mit Haarlinien. Alles linksbuendig.
   Bereichsfarben identisch zu /testprozess.
   =========================================================== */
.pm-ov{background:var(--flaeche);}
.pm-ov__head{max-width:720px;}
.pm-ov__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-card);}

/* Karten gleich hoch und die Parameterliste unten buendig: Bereich 3 hat
   vier Parameter, die anderen drei — sonst bleibt in 1 und 2 ein Loch. */
.pm-ov__card{
  background:#fff;border:1px solid var(--linie);
  border-left:3px solid var(--sa);border-radius:12px;
  padding:26px 26px 8px;
  display:flex;flex-direction:column;
  transition:border-color var(--t-hover),box-shadow var(--t-hover),transform var(--t-hover);
}
.pm-ov__par{margin-top:auto;}
.pm-ov__card:hover{
  box-shadow:0 12px 28px rgba(27,38,59,.07);
  transform:translateY(-2px);
}
.pm-ov__card--1{--sa:var(--ber-1);}
.pm-ov__card--2{--sa:var(--ber-2);}
.pm-ov__card--3{--sa:var(--ber-3);}

/* --- Kopf der Karte --- */
.pm-ov__nr{
  font-size:0.6562rem;letter-spacing:.16em;text-transform:uppercase;
  font-weight:600;color:var(--sa);display:block;margin-bottom:18px;
}
.pm-ov__top{
  display:grid;grid-template-columns:1fr auto;
  gap:16px;align-items:center;
  padding-bottom:22px;border-bottom:1px solid var(--linie);
}
.pm-ov__t{
  font-size:1.125rem;font-weight:600;line-height:1.34;color:var(--blau);
  margin:0;letter-spacing:-.01em;
  /* zwei Zeilen reserviert, damit alle drei Karten gleich hoch beginnen */
  min-height:calc(2 * 1.34em);display:flex;align-items:center;
}

/* --- Donut kompakt --- */
.pm-don{position:relative;width:84px;height:84px;flex:0 0 auto;}
.pm-don svg{width:84px;height:84px;transform:rotate(-90deg);display:block;}
.pm-don__track{fill:none;stroke:var(--linie);stroke-width:7;}
.pm-don__ring{
  fill:none;stroke:var(--sa);stroke-width:7;stroke-linecap:round;
  stroke-dasharray:232.48;stroke-dashoffset:232.48;
  transition:stroke-dashoffset 1.25s cubic-bezier(.2,.75,.3,1);
}
.pm-ov.is-in .pm-don__ring{stroke-dashoffset:var(--soll);}
.pm-don__mitte{
  position:absolute;inset:0;display:flex;
  align-items:center;justify-content:center;
  font-size:1.25rem;font-weight:600;color:var(--blau);
  letter-spacing:-.02em;font-variant-numeric:tabular-nums;
}
.pm-don__mitte sup{font-size:0.6875rem;font-weight:500;color:var(--schwach);top:-.6em;}

/* --- Parameterliste --- */
.pm-ov__par{display:block;}
/* Der Hover sitzt auf der einzelnen Zeile: der Blick soll auf den Wert
   gehen, nicht auf die ganze Karte. */
.pm-ov__par li{
  display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  font-size:0.875rem;color:var(--grau);line-height:1.4;
  padding:13px 0;border-bottom:1px solid var(--linie);
  white-space:nowrap;
  transition:padding-left var(--t-hover) var(--ease-out),color var(--t-hover) var(--ease-out);
}
.pm-ov__par li:hover{padding-left:8px;color:var(--blau);}
.pm-ov__par li:hover .pm-ov__pv{color:var(--sa);}
.pm-ov__pv{transition:color var(--t-hover) var(--ease-out);}
.pm-ov__pv{
  font-size:0.875rem;font-weight:600;color:var(--blau);
  font-variant-numeric:tabular-nums;flex:0 0 auto;
}
.pm-ov__par li:last-child{border-bottom:0;}

/* --- Fusszeile ueber die volle Breite --- */
.pm-ov__fuss{
  margin-top:var(--sp-foot);padding-top:24px;
  border-top:1px solid var(--linie);
  font-size:0.8438rem;line-height:1.7;color:var(--schwach);
  max-width:78ch;
}
.pm-ov__fuss a{color:var(--grau);border-bottom:1px solid var(--linie);}
.pm-ov__fuss a:hover{color:var(--blau);border-color:var(--akzent);}

/* --- Einblenden --- */
.pm-ov [data-anim]{
  opacity:0;transform:translateY(var(--rv-y));
  transition:opacity var(--rv-t) ease,transform var(--rv-t) ease;
}
.pm-ov.is-in [data-anim]{opacity:1;transform:none;}
.pm-ov.is-in [data-anim-delay="1"]{transition-delay:.09s;}
.pm-ov.is-in [data-anim-delay="2"]{transition-delay:.18s;}
.pm-ov.is-in [data-anim-delay="3"]{transition-delay:.27s;}
.pm-ov.is-in [data-anim-delay="4"]{transition-delay:.36s;}

@media(max-width:1000px){
  .pm-ov__grid{grid-template-columns:1fr;}
  .pm-ov__card{padding:24px 24px 6px;}
  .pm-ov.is-in [data-anim-delay="1"]{transition-delay:.05s;}
  .pm-ov.is-in [data-anim-delay="2"]{transition-delay:.10s;}
  .pm-ov.is-in [data-anim-delay="3"]{transition-delay:.15s;}
  .pm-ov.is-in [data-anim-delay="4"]{transition-delay:.20s;}
}

/* ===========================================================
   3 · TEST-FAZIT
   ------------------------------------------------------------
   Weisse Flaeche. Links eine mitlaufende Spalte mit Kicker,
   Ueberschrift und Einordnung, rechts der Fliesstext aus dem
   ACF-Feld test_fazit. Muster wie das FAQ auf /testsiegel.
   =========================================================== */
.pm-faz{background:#fff;}
.pm-faz__grid{display:grid;grid-template-columns:.62fr 1.38fr;gap:var(--sp-col);}

.pm-faz__aside{position:sticky;top:110px;align-self:start;}
.pm-faz__note{
  margin-top:var(--sp-block);padding-top:20px;
  border-top:1px solid var(--linie);
  display:flex;align-items:baseline;gap:12px;
}
.pm-faz__zahl{
  font-size:2.125rem;font-weight:600;color:var(--blau);line-height:1;
  letter-spacing:-.02em;font-variant-numeric:tabular-nums;
}
.pm-faz__wort{font-size:0.875rem;color:var(--grau);font-weight:500;}
.pm-faz__lbl{
  font-size:0.6562rem;letter-spacing:.16em;text-transform:uppercase;
  font-weight:600;color:var(--schwach);display:block;margin-bottom:10px;
}

/* --- Fliesstext mit Fade und Aufklappen --- */
.pm-faz__txt{max-width:68ch;}
.pm-faz__body{position:relative;overflow:hidden;transition:max-height .5s ease;}
.pm-faz__body.is-kurz{max-height:520px;}
.pm-faz__body.is-kurz::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:170px;
  background:linear-gradient(to bottom,rgba(255,255,255,0),#fff 82%);
  pointer-events:none;
}
.pm-faz__mehr{
  display:none;align-items:center;gap:10px;margin-top:20px;
  font-size:0.875rem;font-weight:500;color:var(--blau);
  background:none;border:0;padding:0;cursor:pointer;font-family:var(--f);
}
.pm-faz__mehr.is-da{display:inline-flex;}
/* Goldunterstrich wie alle anderen Textlinks. Der Pfeil nach unten war
   als Scrollhinweis lesbar, gemeint war Aufklappen. */
.pm-faz__mehr span{border-bottom:1.5px solid var(--akzent);padding-bottom:4px;
  transition:border-color var(--t-hover),color var(--t-hover);}
.pm-faz__mehr:hover span{color:var(--akzent);}
/* ".pm " davor ist Pflicht, nicht Kosmetik: die Absaetze kommen aus dem
   Editor und haben keine Klasse. pm-basis.css Z.78 setzt fuer genau die
   ".pm p:not([class]){margin:0}" — das ist staerker als ".pm-faz__txt p"
   und loeschte den Absatzabstand im ganzen Fliesstext. */
.pm .pm-faz__txt p{
  font-size:1.0312rem;line-height:1.82;color:var(--grau);
  margin:0 0 var(--tp-abs);
}
.pm .pm-faz__txt p:last-child{margin-bottom:0;}
.pm .pm-faz__txt p:first-child{margin-bottom:var(--sp-block);}
.pm-faz__txt strong,.pm-faz__txt b{color:var(--blau);font-weight:600;}

/* --- Einblenden --- */
.pm-faz [data-anim]{
  opacity:0;transform:translateY(var(--rv-y));
  transition:opacity var(--rv-t) ease,transform var(--rv-t) ease;
}
.pm-faz.is-in [data-anim]{opacity:1;transform:none;}
.pm-faz.is-in [data-anim-delay="1"]{transition-delay:.09s;}
.pm-faz.is-in [data-anim-delay="2"]{transition-delay:.18s;}

@media(max-width:1000px){
  .pm-faz__grid{grid-template-columns:1fr;}
  .pm-faz__aside{position:static;}
  .pm-faz__txt{max-width:none;}
  .pm-faz.is-in [data-anim-delay="1"]{transition-delay:.05s;}
  .pm-faz.is-in [data-anim-delay="2"]{transition-delay:.10s;}
}


/* ===========================================================
   4-6 · BEWERTUNGSBEREICHE  (drei identische Karten)
   ------------------------------------------------------------
   Mitlaufende Bereichsleiste, darunter drei gleich gebaute
   Karten. Flaechen wechseln: Bereich 1 grau, 2 weiss, 3 grau.
     Zeile 1  links Kicker/Titel/Lead + Einzelbewertung,
              rechts Bild mit Bildunterschrift (50/50)
     Zeile 2  links Befund-Fliesstext, rechts Definitionen
   Mobil eine Spalte: Titel - Bild - Einzelbewertung -
   Fliesstext - Definitionen.
   =========================================================== */
.pm-ber{background:#fff;}

/* --- Bereichsleiste --- */
/* Klebt unter der festen Kopfzeile (72px, mobil 64px — functions.php Z.4).
   Bei top:0 schob sie sich beim Scrollen unter die Kopfzeile.
   Ein Pixel Ueberlappung statt exakt 72: bei einer Kopfzeile, die durch
   Rahmen oder Rundung minimal hoeher ausfaellt, blitzte sonst ein Spalt
   durch. Ueberlappen ist unsichtbar, eine Luecke nicht. */
.pm-nav{
  position:sticky;top:71px;z-index:20;
  transition:transform var(--t-panel) var(--ease-out);
  /* Volle Flaeche statt Milchglas: halbdurchsichtig lief die grosse
     Bereichsziffer sichtbar unter der Leiste durch und wirkte angeschnitten. */
  background:#fff;
  border-bottom:1px solid var(--linie);
}
.pm-nav__in{display:flex;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;}
.pm-nav__in::-webkit-scrollbar{display:none;}
.pm-nav.is-weg{transform:translateY(-102%);}
.pm-nav__b{
  position:relative;flex:1 1 0;min-width:200px;
  background:none;border:0;cursor:pointer;font-family:var(--f);
  text-align:left;padding:20px 24px 18px;transition:background var(--t-hover);
}
.pm-nav__b + .pm-nav__b::before{
  content:"";position:absolute;left:0;top:22px;bottom:22px;width:1px;background:var(--linie);
}
.pm-nav__b::after{
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;
  background:var(--sa);transform:scaleX(0);transform-origin:left;
  transition:transform var(--t-panel) var(--ease-out);
}
.pm-nav__b.is-akt::after{transform:scaleX(1);}
.pm-nav__b:hover{background:rgba(27,38,59,.025);}
.pm-nav__nr{
  display:flex;align-items:center;gap:8px;
  font-size:0.625rem;letter-spacing:.18em;text-transform:uppercase;
  font-weight:700;color:var(--schwach);margin-bottom:9px;transition:color var(--t-hover);
}
.pm-nav__nr::before{
  content:"";width:6px;height:6px;border-radius:50%;
  background:var(--linie);transition:background var(--t-hover),box-shadow var(--t-hover);
}
.pm-nav__b.is-akt .pm-nav__nr{color:var(--sa);}
.pm-nav__b.is-akt .pm-nav__nr::before{
  background:var(--sa);box-shadow:0 0 0 3px rgba(27,38,59,.06);
}
.pm-nav__row{display:flex;align-items:baseline;justify-content:space-between;gap:14px;}
.pm-nav__k{display:none;}
.pm-nav__n{
  font-size:0.9375rem;font-weight:500;color:var(--grau);white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis;transition:color var(--t-hover);
}
.pm-nav__b.is-akt .pm-nav__n{color:var(--blau);font-weight:600;}
.pm-nav__v{
  font-size:0.9375rem;font-weight:600;color:var(--hell);flex:0 0 auto;
  font-variant-numeric:tabular-nums;transition:color var(--t-hover);
}
.pm-nav__b.is-akt .pm-nav__v{color:var(--blau);}

/* --- Karte --- */
.pm-card{
  /* Sprungziel unter Kopfzeile UND Bereichsleiste, siehe .pm-werte */
  scroll-margin-top:150px;padding:var(--sp-sec) 0;
  position:relative;overflow:hidden;
}
.pm-card--grau{background:var(--flaeche);}
.pm-card .pm-eyebrow{color:var(--sa);margin-bottom:var(--tp-kicker);}

/* Grosse Bereichsziffer als ruhiges Hintergrundmotiv */
/* Die Ziffer sass mit negativem Abstand am rechten Rand und wurde vom
   Fensterrand beschnitten. Jetzt haengt sie am Raster und bleibt ganz. */
.pm-card{overflow:hidden;}
/* Die Ziffer haengt am Kopf, nicht am Fensterrand: rechte Kante der
   Textspalte, Oberkante beim Kicker, von der H2 ueberlappt. Ungebunden
   am Fensterrand stand sie in keiner Beziehung zur Sektion. */
.pm-card__head{position:relative;}
.pm-card__head > .pm-eyebrow,
.pm-card__head > .pm-card__h2,
.pm-card__head > .pm-card__lead{position:relative;z-index:1;}
.pm-card__ziffer{
  position:absolute;top:-.22em;right:0;z-index:0;
  font-size:clamp(150px,17vw,230px);line-height:.8;font-weight:700;
  color:var(--sa);opacity:.06;letter-spacing:-.05em;
  pointer-events:none;user-select:none;
}

/* Beide Reihen auf derselben Kante: links schmal, rechts breit. Vorher
   war es oben 1:1 und unten 1.58:0.92 — zwei Zweispalter mit verschiedenen
   Kanten, das war der Grund fuer die Unruhe im Bereich. */
/* Eine einzige Kante fuer den ganzen Bereich: links die Randspalte mit
   Bild, Werten und Definitionen, rechts Kopf und Fliesstext. Vorher waren
   es zwei Zweispalter mit verschiedenen Kanten. */
/* Zwei Reihen, dieselbe Kante. Oben der Kopf: links die Parameter,
   rechts Kicker, Titel, Lead — der Einstieg in den Bereich. Darunter Bild
   und Werte parallel zum Fliesstext. Nichts bleibt stehen: eine feste
   Randspalte verdeckte beim Scrollen genau die Werte, die zum Text
   gehoeren, und gab sie erst am Bereichsende frei. */
/* Spaltenverhaeltnis so, dass die rechte Spalte dem Textmass entspricht.
   Bei .86fr 2fr war die Spalte breiter als der Satz — der Text endete
   frei im Raum, Linien und Lead liefen weiter. */
.pm-card__r1,
.pm-card__r2{
  display:grid;grid-template-columns:1fr 1.6fr;gap:var(--sp-col);
}
/* Kein Trenner mehr zwischen den Reihen: der Wechsel von der Parameter-
   liste zum Bild traegt die Zaesur, und die Linie lief ueber beide
   Spalten, waehrend der Text darunter frueher endete. */
.pm-card__r1{margin-bottom:var(--sp-block);align-items:start;}
/* stretch, damit die linke Spalte Hoehe hat und die Werte wandern koennen */
.pm-card__r2{align-items:stretch;}
.pm-card__fig{margin:0 0 var(--sp-block);}
.pm-card__r1,.pm-card__r2{position:relative;}

/* --- Bildergalerie --- */
.pm-card__fig{margin:0;}
.pm-gal__t{
  border:1px solid var(--linie);border-radius:8px;overflow:hidden;
  background:#fff;aspect-ratio:1/1;cursor:pointer;padding:0;
  transition:border-color var(--t-hover),transform var(--t-hover);
}
.pm-gal__t img{width:100%;height:100%;object-fit:cover;}
.pm-gal__t:hover{transform:translateY(-2px);}
.pm-gal__t.is-akt{border-color:var(--sa);}
.pm-gal__reihe{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:10px;}
/* Fester Hoehenbereich ohne sichtbaren Kasten. Bei kleinen oder hohen
   Motiven dominierte der graue Rahmen sonst das Bild. contain statt cover:
   nichts wird beschnitten, alle drei Bereichsbilder enden gleich. */
/* In der Randspalte: das Bild nimmt die Spaltenbreite, die Hoehe ergibt
   sich. Kein festes Seitenverhaeltnis, also kein Beschnitt und keine leere
   Flaeche. Weil die Spalte schmal ist, bleibt das Bild klein und wird nie
   sperriger als der Text daneben. */
.pm-card__box{border-radius:10px;overflow:hidden;}
.pm-card__box img{
  width:100%;height:auto;display:block;
  transition:transform 1.1s cubic-bezier(.2,.75,.3,1),opacity .25s ease;
}
.pm-card__fig:hover .pm-card__box img{transform:scale(1.035);}
.pm-card__cap{
  display:flex;align-items:baseline;gap:12px;
  margin-top:14px;font-size:0.7812rem;line-height:1.5;color:var(--schwach);
}
.pm-card__cap::before{
  content:"";flex:0 0 auto;width:22px;height:1px;background:var(--sa);
  opacity:.55;transform:translateY(-4px);
}

/* --- Einzelbewertung --- */
/* Ohne Kasten: die Randspalte traegt Bild, Werte und Definitionen
   untereinander — ein Kasten mittendrin unterbrach die Reihe. */
/* Die Werte wandern mit dem Fliesstext. Das Bild bleibt oben — eine
   ganze mitlaufende Randspalte hatte genau diese Werte verdeckt. */
/* Klebepunkt: Kopfzeile 72px + Bereichsleiste rund 76px = 148, dazu die
   Hoehe des Labels "Einzelbewertung" samt Abstand. Bei 150px wurde das
   Label von der Leiste gekappt, nur die Balken standen frei. */
.pm-werte{position:sticky;top:178px;margin-top:var(--sp-block);}
.pm-lbl{
  display:flex;align-items:center;gap:10px;
  font-size:0.625rem;letter-spacing:.18em;text-transform:uppercase;
  font-weight:700;color:var(--schwach);margin-bottom:6px;
}
.pm-lbl::after{content:"";flex:1 1 auto;height:1px;background:var(--linie);}
.pm-bar{padding:15px 0;border-bottom:1px solid var(--linie);}
.pm-bar:last-child{border-bottom:0;padding-bottom:4px;}
.pm-bar__top{
  display:flex;justify-content:space-between;align-items:baseline;
  gap:14px;margin-bottom:9px;white-space:nowrap;
}
.pm-bar__n{font-size:0.9062rem;color:var(--grau);overflow:hidden;text-overflow:ellipsis;}
.pm-bar__v{
  font-size:0.9375rem;font-weight:600;color:var(--blau);
  font-variant-numeric:tabular-nums;flex:0 0 auto;letter-spacing:-.01em;
}
.pm-bar__track{display:block;height:3px;border-radius:2px;background:var(--linie);overflow:hidden;}
.pm-bar__fill{
  display:block;height:3px;border-radius:2px;width:0;
  transition:width 1.25s cubic-bezier(.2,.75,.3,1);
}
.pm-card.is-in .pm-bar__fill{width:var(--w);}
.pm-card.is-in .pm-bar:nth-child(3) .pm-bar__fill{transition-delay:.10s;}
.pm-card.is-in .pm-bar:nth-child(4) .pm-bar__fill{transition-delay:.20s;}
.pm-card.is-in .pm-bar:nth-child(5) .pm-bar__fill{transition-delay:.30s;}

/* --- Fliesstext --- */
/* Keine eigene Breitenbegrenzung: die Spalte gibt das Textmass vor.
   Mit max-width blieb der Satz schmaler als Lead und Linien darueber. */
/* Gleicher Reset-Konflikt wie beim Fazit — siehe Kommentar dort. */
.pm .pm-card__txt p{font-size:1.0312rem;line-height:1.84;color:var(--grau);margin:0 0 var(--tp-abs);}
.pm .pm-card__txt p:last-child{margin-bottom:0;}
/* Initiale entfernt: mit Ziffer und Balken waren es drei Stilmittel in
   einer Sektion, und sie kollidierte mit dem fetten Einstiegssatz. */
.pm-card__txt strong,.pm-card__txt b{color:var(--blau);font-weight:600;}

/* --- Definitionen --- */
/* Ohne Kasten. Weisse Flaeche, Rahmen und Schatten setzten die Liste
   in eine andere Gewichtsklasse als den nackten Kopf daneben — die
   Klammer entsteht jetzt ueber die gemeinsame Oberlinie. */
.pm-card__def{background:none;border:0;border-radius:0;padding:0;box-shadow:none;}
.pm-def__t{
  display:flex;align-items:center;gap:10px;
  font-size:0.625rem;letter-spacing:.18em;text-transform:uppercase;
  font-weight:700;color:var(--schwach);margin:0 0 4px;
}
.pm-def__t::after{content:"";flex:1 1 auto;height:1px;background:var(--linie);}
.pm-def__it{border-bottom:1px solid var(--linie);}
.pm-def__it:first-of-type{border-top:1px solid var(--linie);}
.pm-def__it:last-child{border-bottom:0;}
.pm-def__btn{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;
  background:none;border:0;padding:17px 0;cursor:pointer;
  font-family:var(--f);font-size:0.9062rem;font-weight:500;color:var(--blau);
  text-align:left;transition:color var(--t-hover);line-height:1.35;
}
.pm-def__btn:hover{color:var(--sa);}
.pm-def__nr{font-size:0.6875rem;font-weight:700;letter-spacing:.14em;
  color:var(--schwach);flex:0 0 auto;transition:color var(--t-hover);font-variant-numeric:tabular-nums;}
/* Goldstrich am offenen Eintrag — dasselbe Mittel wie auf /testsiegel */
.pm-def__nr{position:relative;transition:color var(--t-hover),padding-left var(--t-hover);}
.pm-def__nr::before{
  content:"";position:absolute;left:0;top:50%;width:0;height:1px;
  background:var(--akzent);transition:width var(--t-panel) var(--ease-out);
}
.pm-def__it.is-open .pm-def__nr{color:var(--akzent);padding-left:26px;}
.pm-def__it.is-open .pm-def__nr::before{width:18px;}
.pm-def__n{flex:1 1 auto;text-align:left;}
.pm-def__ic{position:relative;width:11px;height:11px;flex:0 0 auto;opacity:.8;}
.pm-def__ic::before,.pm-def__ic::after{
  content:"";position:absolute;background:var(--sa);
  transition:transform var(--t-panel) var(--ease-out),opacity var(--t-panel);
}
.pm-def__ic::before{left:0;top:5px;width:11px;height:1.4px;}
.pm-def__ic::after{left:5px;top:0;width:1.4px;height:11px;}
.pm-def__it.is-open .pm-def__ic::after{transform:rotate(90deg);opacity:0;}
.pm-def__pn{max-height:0;overflow:hidden;transition:max-height var(--t-panel) var(--ease-out);}
.pm-def__it.is-open .pm-def__pn{max-height:440px;}
.pm-def__pn p{font-size:0.9062rem;line-height:1.74;color:var(--grau);margin:0;padding:0 0 20px;}

/* --- Einblenden --- */
.pm-card [data-anim]{
  opacity:0;transform:translateY(var(--rv-y));
  transition:opacity var(--rv-t) ease,transform var(--rv-t) ease;
}
.pm-card.is-in [data-anim]{opacity:1;transform:none;}
.pm-card.is-in [data-anim-delay="1"]{transition-delay:.09s;}
.pm-card.is-in [data-anim-delay="2"]{transition-delay:.18s;}

/* --- Responsive --- */
@media(max-width:1000px){
  .pm-nav{top:63px;}
  /* Mobil untereinander in dieser Reihenfolge:
       Kicker/Titel/Lead — Parameterliste — Bild — Einzelbewertung — Text
     Der Wrapper um Bild und Werte wird per display:contents aufgeloest,
     damit alle fuenf Bausteine echte Geschwister im selben Raster sind.
     Damit regelt EIN gap saemtliche Abstaende; die Einzelabstaende der
     Bausteine entfallen ersatzlos. Vorher kamen sie aus drei Quellen
     (Rasterabstand, Aussenabstand der Werte, Abstand unter Reihe 1) und
     wirkten deshalb zufaellig. */
  .pm-card__r1,.pm-card__r2{grid-template-columns:1fr;gap:var(--sp-mod);}
  .pm-card__r1{margin-bottom:var(--sp-mod);}
  .pm-card__r2 > div:first-child{display:contents;}
  .pm-card__def{order:2;}
  .pm-werte{margin-top:0;}
  .pm-card__ziffer{font-size:9.375rem;top:-.18em;opacity:.04;}
  /* mobil: eine Zeile, 44 px hoch */
  .pm-nav__b{min-width:auto;padding:0 16px;height:44px;display:flex;align-items:center;}
  .pm-nav__nr{display:none;}
  .pm-nav__row{gap:8px;}
  /* Kurztitel: die vollen Bereichsnamen passten nicht nebeneinander und
     wurden mit Auslassungspunkten abgeschnitten. */
  .pm-nav__n{display:none;}
  .pm-nav__k{display:inline;white-space:nowrap;}
  .pm-nav__k,.pm-nav__v{font-size:0.8438rem;}
  /* Kopfkasten ohne Rahmen: als Karte mit drei kurzen Zeilen wirkte er
     leer. Haarlinien trennen jetzt Note, Nummer und Status. */
  .pm-meta{border:0;border-radius:0;padding:0;}
  .pm-meta__grid{grid-template-columns:1fr;gap:0;}
  .pm-meta__grid > div{padding:13px 0;border-bottom:1px solid var(--linie);
    display:flex;align-items:baseline;justify-content:space-between;gap:14px;}
  .pm-meta__grid > div:last-child{border-bottom:0;padding-bottom:0;}
  .pm-nav__b + .pm-nav__b::before{top:12px;bottom:12px;}
  .pm-gal__reihe{grid-template-columns:repeat(4,1fr);}
  .pm-card{scroll-margin-top:112px;}   /* Kopfzeile 64 + Leiste 44 */
  .pm-werte{position:static;}
  .pm-card.is-in [data-anim-delay="1"]{transition-delay:.05s;}
  .pm-card.is-in [data-anim-delay="2"]{transition-delay:.10s;}
}
@media(max-width:560px){
  .pm-nav__b{min-width:auto;padding:0 14px;}
  /* Seitenpolsterung entfernt: Rest aus der Zeit, als die Werte in einem
     Kasten sassen. Sie ruecke sie gegenueber dem Bild ein. */
}

/* ===========================================================
   7 · TECHNISCHE DATEN  (optional, entfaellt wenn leer)
   ------------------------------------------------------------
   Weisse Flaeche. Links das Datenblatt als zweispaltige Liste
   (ACF-Repeater Label/Wert), rechts Preis zum Pruefzeitpunkt
   und die hinterlegten Dokumente. Jeder Block faellt weg,
   wenn sein Feld leer ist.
   =========================================================== */
.pm-td{background:#fff;}
.pm-td__head{max-width:720px;}
.pm-td__grid{display:grid;grid-template-columns:1.55fr .95fr;gap:var(--sp-col);align-items:start;}

/* --- Dokumentenliste --- */
.pm-td__liste{border-top:1px solid var(--linie);}
.pm-td__z{
  display:flex;align-items:center;gap:18px;
  padding:18px 0;border-bottom:1px solid var(--linie);
  transition:background var(--t-hover);
}
.pm-td__z:hover{background:rgba(27,38,59,.018);}
.pm-td__ic{
  flex:0 0 auto;width:38px;height:38px;border-radius:8px;
  border:1px solid var(--linie);display:flex;align-items:center;
  justify-content:center;color:var(--blau-2);
}
.pm-td__k{font-size:0.9688rem;font-weight:500;color:var(--blau);line-height:1.4;display:block;}
.pm-td__meta{font-size:0.7812rem;color:var(--schwach);margin-top:3px;display:block;}
.pm-td__pfeil{margin-left:auto;flex:0 0 auto;color:var(--schwach);transition:color var(--t-hover),transform var(--t-hover);}
.pm-td__z:hover .pm-td__pfeil{color:var(--akzent);transform:translateY(2px);}

/* --- Seitenkarte --- */
.pm-td__side{
  border:1px solid var(--linie);border-radius:12px;padding:26px 28px 24px;
  box-shadow:0 16px 44px rgba(27,38,59,.06);
}
.pm-td__lbl{
  display:flex;align-items:center;gap:10px;
  font-size:0.625rem;letter-spacing:.18em;text-transform:uppercase;
  font-weight:700;color:var(--schwach);margin-bottom:10px;
}
.pm-td__lbl::after{content:"";flex:1 1 auto;height:1px;background:var(--linie);}
.pm-td__firma{font-size:1.0625rem;font-weight:600;color:var(--blau);line-height:1.4;}
.pm-td__adr{font-size:0.9062rem;line-height:1.7;color:var(--grau);margin-top:8px;}
.pm-td__link{
  display:block;font-size:0.9062rem;color:var(--blau);margin-top:4px;
  border-bottom:0;
}
.pm-td__link:hover{color:var(--akzent);}
.pm-td__preis{
  font-size:1.625rem;font-weight:600;color:var(--blau);line-height:1;
  letter-spacing:-.02em;font-variant-numeric:tabular-nums;
}
.pm-td__hinweis{font-size:0.7812rem;line-height:1.6;color:var(--schwach);margin-top:10px;}
.pm-td__docs{margin-top:26px;}
.pm-td__doc{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:14px 0;border-top:1px solid var(--linie);
  font-size:0.9062rem;font-weight:500;color:var(--blau);transition:color var(--t-hover);
}
.pm-td__doc:hover{color:var(--akzent);}
.pm-td__doc svg{flex:0 0 auto;opacity:.7;}

.pm-td [data-anim]{opacity:0;transform:translateY(var(--rv-y));
  transition:opacity var(--rv-t) ease,transform var(--rv-t) ease;}
.pm-td.is-in [data-anim]{opacity:1;transform:none;}
.pm-td.is-in [data-anim-delay="1"]{transition-delay:.09s;}
.pm-td.is-in [data-anim-delay="2"]{transition-delay:.18s;}

@media(max-width:1000px){
  .pm-td__grid{grid-template-columns:1fr;}
  .pm-td__liste{grid-template-columns:1fr;}
  .pm-td.is-in [data-anim-delay="1"]{transition-delay:.05s;}
  .pm-td.is-in [data-anim-delay="2"]{transition-delay:.10s;}
}

/* ===========================================================
   7 · GESAMTERGEBNIS  (dunkle Sektion)
   ------------------------------------------------------------
   Links die beiden Textbausteine aus ACF (produktinformationen,
   das_ergebnis), jeweils mit vorangestelltem Produktnamen.
   Rechts die Ergebniskarte mit Note, Nummer und Prüfbericht.
   Auf dunklem Grund traegt der Kicker den Goldstrich.
   =========================================================== */
/* Flaeche statt Dunkelblau: die Fusszeile ist selbst dunkel, zwei dunkle
   Flaechen liefen ineinander. Ausserdem gilt die Regel, dass die letzte
   Sektion nie dunkel ist. */
.pm-erg{background:var(--flaeche);position:relative;overflow:hidden;}
.pm-erg .pm-wrap{position:relative;z-index:1;}

.pm-erg .pm-eyebrow{
  display:flex;align-items:center;gap:14px;color:var(--akzent);
}
.pm-erg .pm-eyebrow::before{
  content:"";width:34px;height:1.5px;background:var(--akzent);flex:0 0 auto;
}
.pm-erg__h2{color:var(--blau);}
.pm-erg__grid{display:grid;grid-template-columns:1.32fr .68fr;gap:var(--sp-col);align-items:start;}

/* --- Textbausteine --- */
.pm-erg__gegenstand{margin:0 0 var(--sp-block);}
.pm-erg__gname{
  font-size:1.375rem;line-height:1.3;font-weight:600;color:var(--blau);
  letter-spacing:-.015em;display:block;
}
.pm-erg__satz{
  font-size:1.1875rem;line-height:1.72;color:var(--grau);margin:0;
  max-width:60ch;
}
.pm-erg__satz b{color:var(--blau);font-weight:600;}
/* Drei Toene statt bestanden/nicht bestanden: jeder Status bekommt seine
   Aussage, auch wenn keine Note vorliegt. Kein Kasten mehr, sondern ein
   Balken links — der Kasten wirkte auf heller Flaeche zu schwer. */
.pm-erg__urteil{
  margin-top:var(--sp-block);padding:2px 0 2px 20px;
  border-left:2px solid var(--linie);
  display:flex;gap:15px;align-items:flex-start;
}
.pm-erg__urteil p{font-size:1rem;line-height:1.68;color:var(--blau);margin:0;}
/* Statuszeichen: duenner Kreis, Linien-Symbol darin — dieselbe Machart wie
   die Kategoriesymbole auf /testberichte. Das Zeichen selbst kommt aus
   pm_status_symbol() im Template, hier steht nur der Rahmen. */
.pm-erg__sym{
  flex:0 0 auto;width:34px;height:34px;border-radius:50%;
  border:1px solid var(--linie);
  display:flex;align-items:center;justify-content:center;
  color:var(--schwach);
}
.pm-erg__sym svg{width:18px;height:18px;display:block;}
/* Gold traegt ausschliesslich das Siegel. Waere "getestet" ebenfalls gold,
   lese sich der Testbericht wie eine zweite Auszeichnung — genau das sagt
   der Satz daneben aber nicht aus. */
.pm-erg__sym--lizenziert{color:var(--akzent);border-color:var(--akzent);}
.pm-erg__sym--getestet{color:var(--blau);border-color:var(--hell);}
.pm-erg__urteil--ja{border-left-color:var(--akzent);}

/* --- Ergebniskarte --- */
/* Ohne Kasten: Trennlinien reichen, der Rahmen war auf heller Flaeche
   ein zweiter Rahmen um dieselbe Sache. */
.pm-erg__card{padding:0;}
.pm-erg__lbl{
  font-size:0.625rem;letter-spacing:.18em;text-transform:uppercase;
  font-weight:700;color:var(--schwach);display:block;margin-bottom:8px;
}
.pm-erg__note{display:flex;align-items:baseline;gap:12px;}
/* Ohne Unterstrich: er trennte Leerraum von Leerraum. */
.pm-erg__zahl{
  font-size:3.5rem;line-height:1;font-weight:700;color:var(--blau);letter-spacing:-.035em;
  font-variant-numeric:tabular-nums;
}
.pm-erg__wort{font-size:0.9375rem;color:var(--grau);padding-bottom:12px;font-weight:500;}
.pm-erg__note{padding-bottom:20px;border-bottom:1px solid var(--linie);margin-bottom:4px;}
.pm-erg__zeile{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:11px 0;}
.pm-erg__zeile + .pm-erg__zeile{border-top:1px solid var(--linie);}
.pm-erg__k{font-size:0.875rem;color:var(--grau);white-space:nowrap;}
.pm-erg__w{font-size:0.9062rem;color:var(--blau);font-weight:600;font-variant-numeric:tabular-nums;
  display:flex;align-items:center;gap:8px;}
.pm-erg__w.is-lizenz{color:var(--gruen);}
.pm-erg__w.is-lizenz .pm-meta__punkt{background:var(--gruen);}
.pm-erg__docs{display:grid;gap:10px;margin-top:22px;}
/* Textlinks statt Knoepfe: Unterlagen sind ein Angebot, keine Handlung. */
.pm-erg__docs{display:flex;flex-direction:column;align-items:flex-start;gap:14px;}
.pm-erg__pdf{
  display:inline-flex;align-items:center;gap:9px;
  font-size:0.8438rem;font-weight:600;color:var(--blau) !important;
  border-bottom:1.5px solid var(--akzent);padding-bottom:4px;
  transition:color var(--t-hover);
}
.pm-erg__pdf:hover{color:var(--akzent) !important;}
.pm-erg__pdf svg{flex:0 0 auto;color:var(--akzent);}

.pm-erg__fuss{
  margin-top:var(--sp-foot);padding-top:22px;
  border-top:1px solid var(--linie);
  font-size:0.8125rem;line-height:1.7;color:var(--schwach);max-width:78ch;
}
.pm-erg__fuss a{color:var(--blau);border-bottom:1px solid var(--linie);}
.pm-erg__fuss a:hover{border-color:var(--akzent);}

/* --- Einblenden --- */
.pm-erg [data-anim]{opacity:0;transform:translateY(var(--rv-y));
  transition:opacity var(--rv-t) ease,transform var(--rv-t) ease;}
.pm-erg.is-in [data-anim]{opacity:1;transform:none;}
.pm-erg.is-in [data-anim-delay="1"]{transition-delay:.09s;}
.pm-erg.is-in [data-anim-delay="2"]{transition-delay:.18s;}
.pm-erg.is-in [data-anim-delay="3"]{transition-delay:.27s;}

@media(max-width:1000px){
  .pm-erg__grid{grid-template-columns:1fr;}
  .pm-erg__gegenstand{margin:0 0 var(--sp-block);}
  /* Stand hier ein zweites Mal mit color:#fff — der Produktname war auf der
     hellen Flaeche mobil unsichtbar. */
  .pm-erg__gname{font-size:1.25rem;}
.pm-erg__satz{font-size:1.0938rem;max-width:none;}
  .pm-erg__card{padding:26px 24px 22px;}
  .pm-erg__zahl{font-size:2.875rem;}
  .pm-erg.is-in [data-anim-delay="1"]{transition-delay:.05s;}
  .pm-erg.is-in [data-anim-delay="2"]{transition-delay:.10s;}
  .pm-erg.is-in [data-anim-delay="3"]{transition-delay:.15s;}
}

/* ===========================================================
   8 · PRUEFGEGENSTAND  ·  .pm-geg
   ------------------------------------------------------------
   Unterlagen, Herstellerangaben, Preis. Alles optional: fehlt
   eine Spalte, laeuft die andere ueber die volle Breite; fehlt
   alles, gibt das Template die Sektion gar nicht erst aus.
   =========================================================== */
.pm-geg{background:#fff;}
.pm-geg .pm-eyebrow{margin-bottom:var(--sp-block);}
.pm-geg__grid{display:grid;grid-template-columns:1.35fr 1fr;gap:var(--sp-col);align-items:start;}
.pm-geg__grid--breit{grid-template-columns:1fr;}

/* Unterlagen */
.pm-dok{
  display:grid;grid-template-columns:22px 1fr auto;gap:14px;align-items:center;
  padding:15px 0;border-bottom:1px solid var(--linie);
  color:var(--blau);transition:padding-left var(--t-hover) var(--ease-out);
}
a.pm-dok:hover{padding-left:8px;}
.pm-dok svg{width:19px;height:19px;color:var(--akzent);flex:0 0 auto;}
.pm-dok__n{font-size:0.9062rem;}
a.pm-dok .pm-dok__n{border-bottom:1px solid transparent;transition:border-color var(--t-hover) var(--ease-out);}
a.pm-dok:hover .pm-dok__n{border-bottom-color:var(--akzent);}
.pm-dok__h{font-size:0.7812rem;color:var(--schwach);white-space:nowrap;}

/* Herstellerangaben — drei Spalten, sobald links nichts steht */
.pm-geg__herst{display:grid;grid-template-columns:1fr;gap:var(--sp-block);}
.pm-geg__grid--breit .pm-geg__herst{grid-template-columns:repeat(3,1fr);gap:var(--sp-col);}
.pm-geg__sp .pm-lbl{margin-bottom:14px;}
.pm .pm-geg__name{font-size:0.9062rem;font-weight:600;color:var(--blau);margin:0 0 4px;}
.pm .pm-geg__adr{font-size:0.8438rem;line-height:1.6;color:var(--grau);margin:0;}
.pm .pm-geg__sp p{margin:0 0 6px;font-size:0.8438rem;}
.pm-geg__sp a{color:var(--blau);border-bottom:1px solid var(--akzent);}
.pm-geg__sp a:hover{color:var(--akzent);}
.pm-geg__z{display:flex;justify-content:space-between;gap:14px;
  padding:11px 0;border-bottom:1px solid var(--linie);font-size:0.8438rem;}
.pm-geg__z span:first-child{color:var(--grau);}
.pm-geg__z span:last-child{color:var(--blau);font-weight:600;}

@media(max-width:1000px){
  .pm-geg__grid,.pm-geg__grid--breit{grid-template-columns:1fr;gap:var(--sp-block);}
  .pm-geg__grid--breit .pm-geg__herst{grid-template-columns:1fr;gap:var(--sp-block);}
}

/* Verweis auf die Warengruppe: eigene Zeile, sonst verschwindet er im
   Kleingedruckten der Fusszeile. */
.pm-erg__weiter{margin-top:18px;}
.pm-erg__weiter a{
  display:inline-block;font-size:0.8438rem;font-weight:600;color:var(--blau);
  border-bottom:1.5px solid var(--akzent);padding-bottom:4px;
  transition:color var(--t-hover) var(--ease-out);
}
.pm-erg__weiter a:hover{color:var(--akzent);}

/* ===========================================================
   ABSTAENDE UND DEFINITIONEN — Nachtrag
   =========================================================== */
/* Die Leads hatten keine eigene Regel und klebten an der Ueberschrift. */
.pm .pm-card__lead,
.pm .pm-faz__lead{
  margin-top:var(--tp-para);
  font-size:0.9688rem;line-height:1.65;color:var(--grau);
}
.pm .pm-card__h2,
.pm .pm-faz__h2{margin-bottom:0;}

/* Definitionen im Muster von /testsiegel: Ziffer links, Titel, Plus rechts,
   Haarlinie dazwischen. Vorher ein zweites Vokabular fuer dieselbe Sache. */
.pm-def__btn{
  display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;
  width:100%;padding:14px 0;background:none;border:0;cursor:pointer;
  font-family:inherit;font-size:0.875rem;font-weight:600;color:var(--blau);
  text-align:left;transition:padding-left var(--t-hover) var(--ease-out);
}
.pm-def__btn:hover{padding-left:6px;}
.pm .button.pm-def__btn,.pm button.pm-def__btn{background:none !important;border:0 !important;}

/* ===========================================================
   HINWEIS IN DER LINKEN SPALTE  ·  .pm-hinweis
   Traegt die Kopfspalte, die sonst zu drei Vierteln leer bleibt.
   =========================================================== */
.pm-hinweis{
  margin-top:var(--sp-block);padding-top:var(--sp-card);
  border-top:1px solid var(--linie);
  display:grid;grid-template-columns:20px 1fr;gap:13px;align-items:start;
}
.pm-hinweis svg{width:20px;height:20px;color:var(--akzent);margin-top:1px;}
.pm .pm-hinweis p{font-size:0.8125rem;line-height:1.6;color:var(--schwach);margin:0;}

/* ===========================================================
   DOWNLOAD-TEXTLINK  ·  .pm-dl
   =========================================================== */
.pm-hero__akt{display:flex;align-items:center;gap:26px;flex-wrap:wrap;
  margin-top:var(--sp-block);}
.pm-dl{
  display:inline-flex;align-items:center;gap:9px;
  font-size:0.8438rem;font-weight:600;color:var(--blau);
  border-bottom:1.5px solid var(--akzent);padding-bottom:4px;
  transition:color var(--t-hover) var(--ease-out);
}
.pm-dl:hover{color:var(--akzent);}
.pm-dl svg{width:15px;height:15px;color:var(--akzent);flex:0 0 auto;}

/* ===========================================================
   ZUSAMMENBAU — sektionsuebergreifende Korrekturen
   =========================================================== */
.pm-faz,.pm-td,.pm-erg{scroll-margin-top:150px;}
@media(max-width:1000px){.pm-faz,.pm-td,.pm-erg{scroll-margin-top:112px;}
}

/* ==========================================================
   NAMENSKOLLISION MIT pm.css
   pm.css setzt .pm-card global auf opacity:0 und macht die
   Klasse nur innerhalb von .pm-form.is-in wieder sichtbar.
   Die Bewertungsbereiche heissen ebenfalls .pm-card, liegen
   aber nicht in .pm-form — sie blieben deshalb dauerhaft
   unsichtbar. section.pm-card ist spezifischer und gewinnt.
   ========================================================== */
.pm-card{opacity:1;transform:none;}
.pm-form .pm-card{opacity:0;transform:translateY(var(--rv-y));}
.pm-form.is-in .pm-card{opacity:1;transform:none;}