
/* ===========================================================
   PRÜFMAGAZIN — FUNDAMENT
   #1B263B Dunkelblau · #415A77 Graublau · #B8863B Akzent
   #667182 Textgrau · #E0E1DD Linie · #F7F7F5 Fläche
   =========================================================== */
.pm{
  --blau:#1B263B; --blau-2:#415A77;
  --akzent:#B8863B; --akzent-hell:#D0A05C;
  --grau:#667182; --linie:#E0E1DD; --flaeche:#F7F7F5;
  --schwach:#98A0AC; --hell:#C3C8D0;
  --f:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;

  font-family:var(--f);
  color:var(--blau);
  background:#fff;
  -webkit-font-smoothing:antialiased;

  /* Divi-Käfig aufbrechen */
  width:100vw;
  position:relative;
  left:50%;
  margin-left:-50vw;
  overflow-x:hidden;
}
/* --- Reveal-Steuerung: Desktop vs. Mobil --- */
.pm{--rv-y:26px; --rv-t:.55s;}
@media(max-width:900px){ .pm{--rv-y:16px; --rv-t:.4s;} }

.pm *{box-sizing:border-box;}
.pm h1,.pm h2,.pm h3,.pm h4,.pm p,.pm li,.pm span,.pm a,.pm label{
  hyphens:none !important;-webkit-hyphens:none !important;
  -ms-hyphens:none !important;overflow-wrap:normal !important;
  word-break:normal !important;
}
.pm a,.pm a:link,.pm a:visited{color:inherit;}
.pm h1,.pm h2,.pm h3,.pm h4,.pm h5{font-family:var(--f) !important;padding:0 !important;margin:0;}
.pm ul{list-style:none !important;padding-left:0 !important;margin:0;}
.pm ul li{list-style:none !important;}
.pm ul li::marker{content:"" !important;}
.pm img{max-width:100%;height:auto;display:block;}
.pm a{text-decoration:none;}
.pm p{margin:0;}

.pm-wrap{max-width:1240px;margin:0 auto;padding:0 32px;}

.pm-eyebrow{
  font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;
  font-weight:700;color:var(--akzent);margin:0 0 16px;
}
.pm h1.pm-h1{
  font-size:clamp(30px,7vw,58px) !important;
  line-height:1.12 !important;
  font-weight:700 !important;
  letter-spacing:-.025em !important;
  margin:0 0 26px !important;
  color:var(--blau) !important;
  padding:0 !important;
  hyphens:none !important;-webkit-hyphens:none !important;
  -ms-hyphens:none !important;-moz-hyphens:none !important;
  overflow-wrap:normal !important;word-break:normal !important;word-wrap:normal !important;
}
.pm .pm-lead{font-size:18px;line-height:1.7;color:var(--grau);margin:0;max-width:48ch;}

/* Buttons */
.pm .pm-btn{
  display:inline-block;padding:18px 40px;border-radius:2px;
  font-size:15px;font-weight:600;font-family:var(--f);line-height:1.2;
  transition:.18s;border:1.5px solid transparent;
  text-decoration:none;cursor:pointer;
}
.pm a.pm-btn--primary,.pm a.pm-btn--primary:link,.pm a.pm-btn--primary:visited{
  background:#1B263B;color:#ffffff !important;border-color:#1B263B;}
.pm a.pm-btn--primary:hover{background:#415A77;border-color:#415A77;color:#ffffff !important;}
.pm a.pm-btn--ghost,.pm a.pm-btn--ghost:link,.pm a.pm-btn--ghost:visited{
  background:#ffffff;color:#1B263B !important;border-color:#E0E1DD;}
.pm a.pm-btn--ghost:hover{border-color:#1B263B;color:#1B263B !important;}
.pm-btns{display:flex;gap:14px;flex-wrap:wrap;}

@keyframes pmFade{from{opacity:0;transform:translateY(-5px);}to{opacity:1;transform:none;}}

@media(max-width:900px){.pm-wrap{padding:0 22px;}}
@media(prefers-reduced-motion:reduce){
  .pm *{transition:none !important;animation:none !important;}
}


/* ===========================================================
   1 · HERO
   Siegel auf 320 px gedeckelt und zentriert (kein border-radius,
   freigestelltes PNG), mobil 200 px.
   =========================================================== */
.pm-hero{padding:56px 0 76px;}
.pm-hero__grid{display:grid;grid-template-columns:1.15fr .85fr;gap:80px;align-items:center;}
.pm-hero__img{display:flex;justify-content:center;}
.pm-hero__img img{width:100%;max-width:320px;height:auto;}

@media(max-width:1100px){.pm-hero__grid{gap:56px;}}
@media(max-width:900px){
  .pm-hero{padding:48px 0 52px;}
  .pm-hero__grid{grid-template-columns:1fr;gap:36px;}
  .pm-hero__img{order:-1;}
  .pm-hero__img img{max-width:200px;}
}
@media(max-width:420px){
  .pm-btns{width:100%;}
  .pm .pm-btn{width:100%;text-align:center;padding:17px 24px;}
}

/* ===========================================================
   3 · AUSGANGSLAGE
   ------------------------------------------------------------
   Links das Listing-Raster (CSS, kein Fotomaterial),
   rechts die fünf Hürden als Akkordeon.

   Akkordeon statt offener Liste, damit die Sektion auf eine
   Displayhöhe passt: fünf Titel sind sofort lesbar, der
   Erklärtext kommt auf Klick.
   =========================================================== */
.pm-issue{padding:80px 0;background:var(--flaeche);}
.pm-issue__grid{
  display:grid;grid-template-columns:1fr 1fr;
  gap:72px;align-items:center;
}

/* ---------- Links: Listing-Raster ---------- */
.pm-serp{
  border:1px solid var(--linie);
  border-radius:14px;background:#fff;overflow:hidden;
  box-shadow:0 18px 50px rgba(27,38,59,.07);
}
.pm-serp__bar{
  display:flex;align-items:center;gap:14px;
  padding:14px 18px;border-bottom:1px solid var(--linie);
  background:var(--flaeche);
}
.pm-serp__field{
  flex:1;display:flex;align-items:center;gap:9px;
  background:#fff;border:1px solid var(--linie);
  border-radius:100px;padding:8px 14px;min-width:0;
}
.pm-serp__field svg{width:14px;height:14px;flex:none;opacity:.5;}
.pm-serp__field span{
  font-size:13px;color:var(--grau);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.pm-serp__count{
  font-size:12px;color:var(--schwach);
  font-variant-numeric:tabular-nums;white-space:nowrap;
}

.pm-serp__grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:1px;background:var(--linie);
}
.pm-tile{
  background:#fff;padding:16px 14px 18px;
  opacity:0;transform:translateY(var(--rv-y));
  transition:opacity var(--rv-t) cubic-bezier(.2,.75,.3,1),
             transform var(--rv-t) cubic-bezier(.2,.75,.3,1);
}
.pm-serp.is-in .pm-tile{opacity:1;transform:none;}
.pm-serp.is-in .pm-tile:nth-child(1){transition-delay:.04s;}
.pm-serp.is-in .pm-tile:nth-child(2){transition-delay:.10s;}
.pm-serp.is-in .pm-tile:nth-child(3){transition-delay:.16s;}
.pm-serp.is-in .pm-tile:nth-child(4){transition-delay:.22s;}
.pm-serp.is-in .pm-tile:nth-child(5){transition-delay:.28s;}
.pm-serp.is-in .pm-tile:nth-child(6){transition-delay:.34s;}

.pm-tile__img{
  aspect-ratio:1/1;background:var(--flaeche);border-radius:7px;
  margin-bottom:13px;display:flex;align-items:flex-end;
  justify-content:center;padding-bottom:13%;
}
.pm-bottle{
  width:27%;height:57%;background:#D8DCE2;
  border-radius:5px 5px 4px 4px;position:relative;
}
.pm-bottle::before{
  content:"";position:absolute;left:50%;transform:translateX(-50%);
  top:-15%;width:42%;height:16%;background:#C7CCD4;border-radius:3px 3px 0 0;
}
.pm-bottle::after{
  content:"";position:absolute;left:16%;right:16%;top:26%;height:34%;
  background:#E6E9ED;border-radius:2px;
}
.pm-tile__ln{height:6px;border-radius:3px;background:var(--linie);margin-bottom:6px;}
.pm-tile__ln--s{width:58%;}
.pm-tile__rate{display:flex;align-items:center;gap:5px;margin:10px 0 8px;}
.pm-tile__stars{display:flex;gap:1.5px;}
.pm-tile__stars svg{width:10px;height:10px;}
.pm-tile__cnt{font-size:11px;color:var(--schwach);font-variant-numeric:tabular-nums;}
.pm-tile__price{
  font-size:14px;font-weight:700;color:var(--hell);
  font-variant-numeric:tabular-nums;letter-spacing:-.02em;
}

.pm-serp__note{
  padding:14px 18px;border-top:1px solid var(--linie);
  background:var(--flaeche);
  font-size:13px;color:var(--grau);
}
.pm-serp__note b{color:var(--blau);font-weight:600;}

/* ---------- Rechts: Hürden als Akkordeon ---------- */
.pm-issue__h2{
  font-size:clamp(26px,2.9vw,38px);line-height:1.16;font-weight:700;
  letter-spacing:-.024em;color:var(--blau);margin:0 0 18px;
}
.pm-issue__lead{
  font-size:16.5px;line-height:1.72;color:var(--grau);
  margin:0 0 34px;max-width:50ch;
}

.pm-acc{border-top:1px solid var(--linie);}
.pm-acc__it{border-bottom:1px solid var(--linie);}

.pm-acc__btn{
  width:100%;background:none;border:0;padding:0;margin:0;
  font-family:var(--f);text-align:left;cursor:pointer;
  display:grid;grid-template-columns:30px 1fr 20px;
  align-items:center;gap:10px;
  padding:17px 0 17px 0;
  position:relative;
  transition:padding-left .28s cubic-bezier(.3,.8,.35,1);
}
/* Goldbalken, der beim Hover und im offenen Zustand einläuft */
.pm-acc__btn::before{
  content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);
  width:0;height:2px;background:var(--akzent);
  transition:width .28s cubic-bezier(.3,.8,.35,1);
}
.pm-acc__btn:hover{padding-left:26px;}
.pm-acc__btn:hover::before{width:16px;}
.pm-acc__it.is-open .pm-acc__btn{padding-left:26px;}
.pm-acc__it.is-open .pm-acc__btn::before{width:16px;}

.pm-acc__no{
  font-size:11.5px;font-weight:700;letter-spacing:.08em;
  color:var(--hell);font-variant-numeric:tabular-nums;
  transition:color .22s;
}
.pm-acc__it.is-open .pm-acc__no{color:var(--akzent);}
.pm-acc__btn:hover .pm-acc__no{color:var(--akzent);}

.pm-acc__t{
  font-size:16.5px;font-weight:600;line-height:1.35;
  color:var(--blau);letter-spacing:-.014em;
}

.pm-acc__ic{position:relative;width:14px;height:14px;justify-self:end;}
.pm-acc__ic::before,.pm-acc__ic::after{
  content:"";position:absolute;left:50%;top:50%;
  background:var(--akzent);transform:translate(-50%,-50%);
  transition:transform .28s cubic-bezier(.3,.7,.3,1),opacity .2s;
}
.pm-acc__ic::before{width:14px;height:1.6px;}
.pm-acc__ic::after{width:1.6px;height:14px;}
.pm-acc__it.is-open .pm-acc__ic::after{transform:translate(-50%,-50%) rotate(90deg);opacity:0;}

/* Ausklappen ohne feste Höhe */
.pm-acc__panel{
  display:grid;grid-template-rows:0fr;
  transition:grid-template-rows .34s cubic-bezier(.3,.8,.35,1);
}
.pm-acc__it.is-open .pm-acc__panel{grid-template-rows:1fr;}
.pm-acc__inner{overflow:hidden;}
.pm .pm-acc__inner p{
  font-size:15px;line-height:1.72;color:var(--grau);
  padding:0 34px 20px 40px;max-width:56ch;
  opacity:0;transform:translateY(-4px);
  transition:opacity .3s ease .06s, transform .3s ease .06s;
}
.pm-acc__it.is-open .pm-acc__inner p{opacity:1;transform:none;}

/* Einblenden der rechten Spalte */
.pm-issue__txt > *{
  opacity:0;transform:translateY(var(--rv-y));
  transition:opacity var(--rv-t) cubic-bezier(.2,.75,.3,1),
             transform var(--rv-t) cubic-bezier(.2,.75,.3,1);
}
.pm-issue.is-in .pm-issue__txt > *{opacity:1;transform:none;}
.pm-issue.is-in .pm-issue__txt > *:nth-child(2){transition-delay:.06s;}
.pm-issue.is-in .pm-issue__txt > *:nth-child(3){transition-delay:.12s;}
.pm-issue.is-in .pm-issue__txt > *:nth-child(4){transition-delay:.18s;}

@media(max-width:1080px){
  .pm-issue__grid{gap:48px;}
}
@media(max-width:900px){
  .pm-issue{padding:60px 0;}
  .pm-issue__grid{grid-template-columns:1fr;gap:40px;}
  .pm-serp__grid{grid-template-columns:repeat(2,1fr);}
  .pm-serp__grid .pm-tile:nth-child(5),
  .pm-serp__grid .pm-tile:nth-child(6){display:none;}
  .pm .pm-acc__inner p{padding-left:0;padding-right:0;}
  .pm-acc__btn{grid-template-columns:26px 1fr 18px;}
}
@media(prefers-reduced-motion:reduce){
  .pm-tile,.pm-issue__txt > *{opacity:1 !important;transform:none !important;transition:none !important;}
  .pm-acc__panel{transition:none !important;}
}

/* ===========================================================
   4 · NACHWEISPFLICHT
   ------------------------------------------------------------
   Kopfzeile mittig — schließt das Loch oben rechts.
   Darunter zwei Spalten mit einheitlicher Leserichtung:
   links die Kriterien, rechts das Siegel mit Beschriftungen
   rechts daneben.

   Gleiche Endhöhe: Grid auf stretch, rechte Spalte als
   Flex-Container mit space-between. Siegel oben, Quellenblock
   unten — die Spalte dehnt sich auf die Höhe der Kriterien,
   unabhängig von späteren Textlängen.

   Beschriftungen bewusst kleiner und heller als der Fließtext,
   damit sie als Bildannotation lesen und nicht als dritte
   Textspalte. Ausschließlich CI-Farben.
   =========================================================== */
.pm-proof{
  padding:76px 0;
  background:#fff;
}

/* ---------- Kopfzeile ---------- */
.pm-proof__head{
  max-width:720px;margin:0 auto 52px;text-align:center;
}
.pm-proof__h2{
  font-size:clamp(26px,2.9vw,38px);line-height:1.16;font-weight:700;
  letter-spacing:-.024em;color:var(--blau);margin:0 0 16px;
}
.pm .pm-proof__lead{
  font-size:16.5px;line-height:1.72;color:var(--grau);
  margin:0 auto;max-width:60ch;
}

/* ---------- zweispaltig, gleiche Endhöhe ---------- */
.pm-proof__grid{
  display:grid;grid-template-columns:1fr 1fr;
  gap:64px;align-items:stretch;
}
.pm-proof__left{
  display:flex;flex-direction:column;justify-content:space-between;
  gap:36px;
}
.pm-proof__right{
  display:flex;flex-direction:column;justify-content:center;
}

/* ---------- links: Kriterien ---------- */
.pm-crit{list-style:none;padding:0;margin:0;}
.pm-crit li{
  display:grid;grid-template-columns:auto 1fr;gap:18px;
  padding:22px 0;border-bottom:1px solid var(--linie);
}
.pm-crit li:last-child{border-bottom:0;padding-bottom:0;}
.pm-crit li:first-child{padding-top:0;}

.pm-crit__no{
  display:inline-flex;align-items:center;justify-content:center;
  width:32px;height:32px;border-radius:50%;
  border:1.5px solid rgba(184,134,59,.4);background:#fff;
  color:var(--akzent);font-size:12px;font-weight:700;
  font-variant-numeric:tabular-nums;flex:none;
  transition:border-color .22s, background .22s;
}
.pm-crit li:hover .pm-crit__no{
  border-color:var(--akzent);background:rgba(184,134,59,.09);
}
.pm-crit__t{
  display:block;font-size:16.5px;font-weight:600;
  color:var(--blau);letter-spacing:-.016em;
  line-height:1.35;margin-bottom:6px;
}
.pm-crit__x{
  display:block;font-size:14.5px;line-height:1.68;
  color:var(--grau);
}

/* ---------- rechts: Siegel ---------- */
.pm-anat{position:relative;}
/* weiches Licht hinter dem Siegel, CI-Gold */
.pm-anat::before{
  content:"";position:absolute;left:-3%;top:50%;
  width:54%;padding-bottom:54%;transform:translateY(-50%);
  border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(184,134,59,.16) 0%,rgba(184,134,59,0) 68%);
}
.pm-anat__img{
  position:relative;z-index:1;
  width:54%;                      /* Siegel links, Beschriftung rechts daneben */
  filter:drop-shadow(0 20px 42px rgba(15,31,61,.18));
}

/* Ein Pin = Punkt · Linie · Beschriftung  (Leserichtung nach rechts) */
.pm-pin{
  position:absolute;z-index:2;
  left:var(--x);right:0;top:var(--y);
  transform:translateY(-50%);
  display:flex;align-items:center;
}
.pm-pin__dot{
  width:6px;height:6px;border-radius:50%;
  background:var(--akzent);flex:none;
  box-shadow:0 0 0 3px rgba(184,134,59,.18);
  opacity:0;transform:scale(.4);
  transition:opacity .3s ease, transform .3s cubic-bezier(.3,.9,.4,1);
}
.pm-pin__ln{
  flex:1;height:1px;margin:0 10px;
  background-image:linear-gradient(90deg,var(--linie) 55%,rgba(255,255,255,0) 0);
  background-size:6px 1px;background-repeat:repeat-x;
  transform:scaleX(0);transform-origin:left center;
  transition:transform .5s cubic-bezier(.25,.8,.3,1);
}
.pm-pin__lbl{
  flex:none;width:138px;
  opacity:0;transform:translateX(-8px);
  transition:opacity .35s ease, transform .35s ease;
}
.pm-pin__lbl b{
  display:block;font-size:10px;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;
  color:var(--akzent);margin-bottom:3px;
}
.pm-pin__lbl span{
  display:block;font-size:12px;line-height:1.42;color:var(--schwach);
}

.pm-anat.is-in .pm-pin__dot{opacity:1;transform:none;}
.pm-anat.is-in .pm-pin__ln{transform:scaleX(1);}
.pm-anat.is-in .pm-pin__lbl{opacity:1;transform:none;}

.pm-anat.is-in .pm-pin:nth-of-type(1) .pm-pin__dot{transition-delay:.15s;}
.pm-anat.is-in .pm-pin:nth-of-type(1) .pm-pin__ln{transition-delay:.25s;}
.pm-anat.is-in .pm-pin:nth-of-type(1) .pm-pin__lbl{transition-delay:.6s;}
.pm-anat.is-in .pm-pin:nth-of-type(2) .pm-pin__dot{transition-delay:.35s;}
.pm-anat.is-in .pm-pin:nth-of-type(2) .pm-pin__ln{transition-delay:.45s;}
.pm-anat.is-in .pm-pin:nth-of-type(2) .pm-pin__lbl{transition-delay:.8s;}
.pm-anat.is-in .pm-pin:nth-of-type(3) .pm-pin__dot{transition-delay:.55s;}
.pm-anat.is-in .pm-pin:nth-of-type(3) .pm-pin__ln{transition-delay:.65s;}
.pm-anat.is-in .pm-pin:nth-of-type(3) .pm-pin__lbl{transition-delay:1s;}
.pm-anat.is-in .pm-pin:nth-of-type(4) .pm-pin__dot{transition-delay:.75s;}
.pm-anat.is-in .pm-pin:nth-of-type(4) .pm-pin__ln{transition-delay:.85s;}
.pm-anat.is-in .pm-pin:nth-of-type(4) .pm-pin__lbl{transition-delay:1.2s;}

/* ---------- Quellenblock ---------- */
.pm-src{
  border-left:2px solid var(--akzent);
  padding:4px 0 4px 20px;
}
.pm-src p{
  font-size:14px;line-height:1.7;color:var(--grau);margin:0 0 9px;
}
.pm-src a{
  display:inline-flex;align-items:center;gap:7px;
  font-size:13px;font-weight:600;color:var(--blau) !important;
  border-bottom:1px solid var(--linie);padding-bottom:2px;
  transition:border-color .18s,color .18s;
}
.pm-src a:hover{border-bottom-color:var(--akzent);color:var(--akzent) !important;}
.pm-src a svg{width:12px;height:12px;flex:none;}

/* ---------- Einblenden ---------- */
.pm-proof__head > *,.pm-crit li{
  opacity:0;transform:translateY(var(--rv-y));
  transition:opacity var(--rv-t) cubic-bezier(.2,.75,.3,1),
             transform var(--rv-t) cubic-bezier(.2,.75,.3,1);
}
.pm-proof.is-in .pm-proof__head > *,
.pm-proof.is-in .pm-crit li{opacity:1;transform:none;}
.pm-proof.is-in .pm-proof__head > *:nth-child(2){transition-delay:.06s;}
.pm-proof.is-in .pm-proof__head > *:nth-child(3){transition-delay:.12s;}
.pm-proof.is-in .pm-crit li:nth-child(2){transition-delay:.09s;}
.pm-proof.is-in .pm-crit li:nth-child(3){transition-delay:.18s;}

@media(max-width:1080px){
  .pm-proof__grid{gap:44px;}
  .pm-pin__lbl{width:118px;}
  .pm-pin__ln{margin:0 8px;}
}
@media(max-width:900px){
  .pm-proof{padding:60px 0;}
  .pm-proof__head{margin-bottom:40px;text-align:left;}
  .pm-proof__grid{grid-template-columns:1fr;gap:44px;}
  .pm-proof__left{gap:34px;}
  .pm-anat__img{width:44%;}
  .pm-pin__lbl{width:140px;}
}
@media(max-width:600px){
  .pm-anat__img{width:50%;}
  .pm-pin__lbl{width:100px;}
  .pm-pin__lbl b{font-size:9.5px;letter-spacing:.11em;}
  .pm-pin__lbl span{font-size:11px;line-height:1.38;}
  .pm-pin__ln{margin:0 7px;}
}
@media(prefers-reduced-motion:reduce){
  .pm-proof__head > *,.pm-crit li,.pm-pin__dot,.pm-pin__lbl{
    opacity:1 !important;transform:none !important;transition:none !important;}
  .pm-pin__ln{transform:scaleX(1) !important;transition:none !important;}
}

/* ===========================================================
   5 · LEISTUNGSUMFANG
   ------------------------------------------------------------
   Kartenrahmen entfernt: gerahmt ist nur noch die Bildfläche,
   der Text steht frei darunter. Das nimmt der Sektion die
   Baukasten-Anmutung und lässt die Motive wirken.

   HINWEIS zur Zentrierung: ".pm p{margin:0}" aus dem Fundament
   hat höhere Spezifität als eine reine Klassenregel und kippt
   "margin:0 auto". Die Lead-Regel steht deshalb als
   ".pm .pm-deliv__lead". Derselbe Fehler steckt in Sektion 4
   und muss dort nachgezogen werden.
   =========================================================== */
.pm-deliv{padding:84px 0;background:var(--flaeche);}

/* ---------- Kopfzeile ---------- */
.pm-deliv__head{max-width:660px;margin:0 auto 56px;text-align:center;}
.pm-deliv__h2{
  font-size:clamp(26px,2.9vw,38px);line-height:1.16;font-weight:700;
  letter-spacing:-.024em;color:var(--blau);margin:0 0 16px;
}
.pm .pm-deliv__lead{
  font-size:16.5px;line-height:1.72;color:var(--grau);
  margin:0 auto;max-width:52ch;
}

/* ---------- Kartenraster ---------- */
.pm-deliv__grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:32px;
}
.pm-dcard{display:flex;flex-direction:column;}

/* Bildfläche — einziges gerahmtes Element */
.pm-dcard__fig{
  aspect-ratio:4/3;
  background:#fff;
  border:1px solid var(--linie);
  border-radius:12px;
  overflow:hidden;position:relative;
  transition:border-color .25s, box-shadow .25s cubic-bezier(.2,.75,.3,1);
}
.pm-dcard:hover .pm-dcard__fig{
  border-color:var(--hell);
  box-shadow:0 16px 36px rgba(27,38,59,.10);
}
.pm-dcard__fig img{
  width:100%;height:100%;object-fit:cover;
  transition:transform .5s cubic-bezier(.2,.75,.3,1);
}
.pm-dcard:hover .pm-dcard__fig img{transform:scale(1.04);}

/* Text steht frei unter dem Bild */
.pm-dcard__body{padding:22px 2px 0;}
.pm-dcard__t{
  font-size:17px;font-weight:600;color:var(--blau);
  letter-spacing:-.016em;line-height:1.32;margin:0 0 6px;
  display:inline-block;position:relative;
}
/* feiner Goldstrich beim Hover */
.pm-dcard__t::after{
  content:"";position:absolute;left:0;bottom:-4px;
  width:0;height:1.5px;background:var(--akzent);
  transition:width .3s cubic-bezier(.3,.8,.35,1);
}
.pm-dcard:hover .pm-dcard__t::after{width:100%;}

.pm-dcard__x{
  font-size:14.5px;line-height:1.65;color:var(--grau);margin:8px 0 0;
}

/* ---------- Schlusszeile ---------- */
.pm-deliv__foot{
  margin-top:52px;padding-top:30px;
  border-top:1px solid var(--linie);
  display:flex;justify-content:space-between;
  align-items:center;gap:28px;flex-wrap:wrap;
}
.pm .pm-deliv__foot p{
  font-size:15.5px;line-height:1.68;color:var(--grau);max-width:64ch;
}
.pm-deliv__foot strong{color:var(--blau);font-weight:600;}
.pm-deliv__link{
  display:inline-flex;align-items:center;gap:9px;
  font-size:14px;font-weight:600;color:var(--blau) !important;
  white-space:nowrap;border-bottom:1.5px solid var(--akzent);
  padding-bottom:4px;transition:.18s;
}
.pm-deliv__link:hover{border-bottom-color:var(--blau);}
.pm-deliv__link svg{width:14px;height:14px;flex:none;}

/* ---------- Einblenden ---------- */
.pm-deliv__head > *,.pm-dcard{
  opacity:0;transform:translateY(var(--rv-y));
  transition:opacity var(--rv-t) cubic-bezier(.2,.75,.3,1),
             transform var(--rv-t) cubic-bezier(.2,.75,.3,1);
}
.pm-deliv.is-in .pm-deliv__head > *,
.pm-deliv.is-in .pm-dcard{opacity:1;transform:none;}
.pm-deliv.is-in .pm-deliv__head > *:nth-child(2){transition-delay:.06s;}
.pm-deliv.is-in .pm-deliv__head > *:nth-child(3){transition-delay:.12s;}
.pm-deliv.is-in .pm-dcard:nth-child(1){transition-delay:.10s;}
.pm-deliv.is-in .pm-dcard:nth-child(2){transition-delay:.18s;}
.pm-deliv.is-in .pm-dcard:nth-child(3){transition-delay:.26s;}
.pm-deliv.is-in .pm-dcard:nth-child(4){transition-delay:.34s;}

@media(max-width:1000px){
  .pm-deliv{padding:64px 0;}
  .pm-deliv__grid{grid-template-columns:repeat(2,1fr);gap:28px 24px;}
}
@media(max-width:560px){
  .pm-deliv__grid{grid-template-columns:1fr;gap:26px;}
}
@media(prefers-reduced-motion:reduce){
  .pm-deliv__head > *,.pm-dcard{opacity:1 !important;transform:none !important;transition:none !important;}
}

/* ===========================================================
   6 · WIRKUNG
   ------------------------------------------------------------
   Vier Touchpoints als Reiter. Beim Wechsel tauscht rechts das
   Visual — andere Mechanik als das Akkordeon in Sektion 3.
   Alle Visuals in CSS gebaut: kein Bildmaterial, keine fremden
   Marken, keine behauptete Platzierung.

   Reihenfolge = echte Journey: die Recherche beginnt nicht im
   Shop, deshalb steht KI an Position eins.
   =========================================================== */
.pm-touch{padding:80px 0;background:#fff;}

.pm-touch__head{max-width:660px;margin:0 0 46px;}
.pm-touch__h2{
  font-size:clamp(26px,2.9vw,38px);line-height:1.16;font-weight:700;
  letter-spacing:-.024em;color:var(--blau);margin:0 0 16px;
}
.pm .pm-touch__lead{
  font-size:16.5px;line-height:1.72;color:var(--grau);max-width:56ch;
}

.pm-touch__grid{
  display:grid;grid-template-columns:.86fr 1.14fr;
  gap:64px;align-items:start;
}

/* ---------- links: Reiter + Erklärung ---------- */
.pm-tabs{list-style:none;padding:0;margin:0 0 30px;}
.pm-tabs li{border-bottom:1px solid var(--linie);}
.pm-tabs li:first-child{border-top:1px solid var(--linie);}

.pm-tab{
  width:100%;background:none;border:0;margin:0;
  font-family:var(--f);text-align:left;cursor:pointer;
  display:grid;grid-template-columns:34px 1fr;align-items:center;gap:12px;
  padding:16px 0;position:relative;
  transition:padding-left .28s cubic-bezier(.3,.8,.35,1);
}
.pm-tab::before{
  content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);
  width:0;height:2px;background:var(--akzent);
  transition:width .28s cubic-bezier(.3,.8,.35,1);
}
.pm-tab:hover{padding-left:24px;}
.pm-tab:hover::before{width:15px;}
.pm-tabs li.is-on .pm-tab{padding-left:24px;}
.pm-tabs li.is-on .pm-tab::before{width:15px;}

.pm-tab__no{
  font-size:11.5px;font-weight:700;letter-spacing:.08em;
  color:var(--hell);font-variant-numeric:tabular-nums;
  transition:color .22s;
}
.pm-tabs li.is-on .pm-tab__no,
.pm-tab:hover .pm-tab__no{color:var(--akzent);}

.pm-tab__t{
  font-size:16.5px;font-weight:600;line-height:1.35;
  color:var(--grau);letter-spacing:-.014em;transition:color .22s;
}
.pm-tabs li.is-on .pm-tab__t{color:var(--blau);}
.pm-tab:hover .pm-tab__t{color:var(--blau);}

/* Erklärtext — feste Fläche, damit beim Wechsel nichts springt */
.pm-touch__note{min-height:118px;position:relative;}
.pm .pm-touch__note p{
  position:absolute;inset:0;
  font-size:15.5px;line-height:1.74;color:var(--grau);max-width:46ch;
  opacity:0;transform:translateY(6px);pointer-events:none;
  transition:opacity .3s ease, transform .3s ease;
}
.pm .pm-touch__note p.is-on{opacity:1;transform:none;pointer-events:auto;}

/* ---------- rechts: Visualbühne ---------- */
.pm-stage{
  position:relative;aspect-ratio:4/3;
  border:1px solid var(--linie);border-radius:14px;
  background:#fff;overflow:hidden;
  box-shadow:0 18px 50px rgba(27,38,59,.07);
}
.pm-view{
  position:absolute;inset:0;padding:26px;
  opacity:0;transform:translateY(10px);pointer-events:none;
  transition:opacity .34s ease, transform .34s cubic-bezier(.2,.75,.3,1);
  display:flex;flex-direction:column;
}
.pm-view.is-on{opacity:1;transform:none;pointer-events:auto;}

/* gemeinsame Bausteine */
.pm-bar{
  display:flex;align-items:center;gap:9px;
  background:var(--flaeche);border:1px solid var(--linie);
  border-radius:100px;padding:9px 15px;margin-bottom:20px;flex:none;
}
.pm-bar svg{width:14px;height:14px;flex:none;opacity:.5;}
.pm-bar span{font-size:13px;color:var(--grau);}
.pm-ln{height:7px;border-radius:3px;background:var(--linie);margin-bottom:9px;}
.pm-ln--90{width:90%;} .pm-ln--75{width:75%;} .pm-ln--60{width:60%;}
.pm-ln--45{width:45%;} .pm-ln--30{width:30%;}

/* ---- 01 KI-Antwort ---- */
.pm-ai__head{
  display:flex;align-items:center;gap:9px;margin-bottom:16px;flex:none;
}
.pm-ai__head b{
  font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;
  font-weight:700;color:var(--schwach);
}
.pm-ai__dot{width:7px;height:7px;border-radius:50%;background:var(--akzent);flex:none;}
.pm-ai__body{flex:1;}
.pm-ai__srcs{
  border-top:1px solid var(--linie);padding-top:16px;flex:none;
}
.pm-ai__srcs > b{
  display:block;font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;
  font-weight:700;color:var(--schwach);margin-bottom:11px;
}
.pm-chip{
  display:inline-flex;align-items:center;gap:8px;
  border:1px solid var(--linie);border-radius:100px;
  padding:7px 14px;margin:0 8px 8px 0;
  font-size:12.5px;color:var(--grau);background:#fff;
}
.pm-chip i{
  width:5px;height:5px;border-radius:50%;
  background:var(--hell);flex:none;font-style:normal;
}
.pm-chip--pm{
  border-color:var(--akzent);color:var(--blau);font-weight:600;
  background:rgba(184,134,59,.06);
}
.pm-chip--pm i{background:var(--akzent);}

/* ---- 02 Suchergebnisse ---- */
.pm-res{padding:14px 0;border-bottom:1px solid var(--linie);}
.pm-res:last-child{border-bottom:0;}
.pm-res__url{font-size:12px;color:var(--schwach);margin-bottom:7px;}
.pm-res__ttl{
  font-size:14.5px;font-weight:600;color:var(--hell);
  line-height:1.35;margin-bottom:8px;
}
.pm-res--pm .pm-res__url{color:var(--akzent);font-weight:600;}
.pm-res--pm .pm-res__ttl{color:var(--blau);}

/* ---- 03 Listing ---- */
.pm-grid6{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:1px;background:var(--linie);
  border:1px solid var(--linie);border-radius:10px;overflow:hidden;flex:1;
}
.pm-cell{background:#fff;padding:11px;display:flex;flex-direction:column;}
.pm-cell__img{
  flex:1;background:var(--flaeche);border-radius:6px;
  display:flex;align-items:flex-end;justify-content:center;
  padding-bottom:12%;position:relative;margin-bottom:9px;
}
.pm-bottle-s{
  width:26%;height:54%;background:#D8DCE2;
  border-radius:5px 5px 4px 4px;position:relative;
}
.pm-bottle-s::before{
  content:"";position:absolute;left:50%;transform:translateX(-50%);
  top:-15%;width:42%;height:16%;background:#C7CCD4;border-radius:3px 3px 0 0;
}
.pm-cell--off{opacity:.42;filter:grayscale(1);}
.pm-cell--on{box-shadow:inset 0 0 0 1.5px var(--akzent);}
.pm-seal{
  position:absolute;right:7px;bottom:7px;
  width:34%;aspect-ratio:3/4;border-radius:3px;
  background:var(--blau);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:1px;box-shadow:0 4px 10px rgba(15,31,61,.3);
}
/* Bewusst ohne Text: bei dieser Groesse waere jede Schrift unlesbar oder
   wuerde abgeschnitten. Das Siegel wird als Form gezeichnet. */
.pm-seal{box-shadow:0 4px 10px rgba(15,31,61,.3), inset 0 0 0 1px var(--akzent);}
.pm-seal b,.pm-seal i{display:none;}
.pm-seal::before{
  content:"";position:absolute;left:22%;right:22%;top:16%;height:24%;
  border-radius:1px;background:rgba(255,255,255,.92);
}
.pm-seal::after{
  content:"";position:absolute;left:0;right:0;top:52%;height:20%;
  background:linear-gradient(90deg,var(--akzent),var(--akzent-hell));
}

/* ---- 04 Produktseite ---- */
.pm-pdp{display:flex;gap:20px;flex:1;align-items:center;}
.pm-pdp__l{
  flex:none;width:38%;background:var(--flaeche);border-radius:8px;
  aspect-ratio:1/1;display:flex;align-items:flex-end;justify-content:center;
  padding-bottom:12%;position:relative;
}
.pm-pdp__r{flex:1;}
.pm-licbox{
  border:1px solid var(--linie);border-radius:8px;
  padding:13px 15px;margin-top:14px;background:var(--flaeche);
}
.pm-licbox__k{
  font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  font-weight:700;color:var(--schwach);margin-bottom:5px;
}
.pm-licbox__v{
  font-size:15px;font-weight:700;color:var(--blau);
  font-variant-numeric:tabular-nums;letter-spacing:.02em;
}
.pm-licbox__go{
  display:flex;align-items:center;gap:7px;margin-top:11px;
  font-size:12.5px;font-weight:600;color:var(--akzent);
}
.pm-licbox__go svg{width:13px;height:13px;flex:none;}

/* ---------- Schlusszeile ---------- */
.pm-touch__foot{
  margin-top:48px;padding-top:28px;border-top:1px solid var(--linie);
}
.pm .pm-touch__foot p{
  font-size:16px;line-height:1.7;color:var(--grau);max-width:86ch;
}
.pm-touch__foot strong{color:var(--blau);font-weight:600;}

/* ---------- Einblenden ---------- */
.pm-touch__head > *,.pm-touch__grid,.pm-touch__foot{
  opacity:0;transform:translateY(var(--rv-y));
  transition:opacity var(--rv-t) cubic-bezier(.2,.75,.3,1),
             transform var(--rv-t) cubic-bezier(.2,.75,.3,1);
}
.pm-touch.is-in .pm-touch__head > *,
.pm-touch.is-in .pm-touch__grid,
.pm-touch.is-in .pm-touch__foot{opacity:1;transform:none;}
.pm-touch.is-in .pm-touch__head > *:nth-child(2){transition-delay:.06s;}
.pm-touch.is-in .pm-touch__head > *:nth-child(3){transition-delay:.12s;}
.pm-touch.is-in .pm-touch__grid{transition-delay:.16s;}
.pm-touch.is-in .pm-touch__foot{transition-delay:.24s;}

@media(max-width:1080px){.pm-touch__grid{gap:44px;}}
@media(max-width:900px){
  .pm-touch{padding:60px 0;}
  .pm-touch__grid{grid-template-columns:1fr;gap:36px;}
  .pm-touch__note{min-height:96px;}
  .pm-view{padding:20px;}
}
@media(max-width:560px){
  .pm-stage{aspect-ratio:1/1;}
  .pm-view{padding:16px;}
  .pm-pdp{flex-direction:column;align-items:stretch;gap:14px;}
  .pm-pdp__l{width:100%;aspect-ratio:16/9;}
}
@media(prefers-reduced-motion:reduce){
  .pm-touch__head > *,.pm-touch__grid,.pm-touch__foot{
    opacity:1 !important;transform:none !important;transition:none !important;}
}

/* ===========================================================
   6b · FALLSTUDIE
   ------------------------------------------------------------
   Steht direkt hinter der Wirkungs-Sektion: dort die vier
   Mechanismen, hier der Beleg an einem realen Fall.

   Statt einer Verlaufskurve ein Vorher-Nachher-Vergleich —
   für eine Kurve fehlen die Monatswerte, und eine geschätzte
   Kurve wäre erfunden. Alle gezeigten Werte sind dokumentiert.
   =========================================================== */
.pm-case{padding:84px 0;background:var(--flaeche);}

.pm-case__head{max-width:660px;margin:0 0 46px;}
.pm-case__h2{
  font-size:clamp(26px,2.9vw,38px);line-height:1.16;font-weight:700;
  letter-spacing:-.024em;color:var(--blau);margin:0 0 16px;
}
.pm .pm-case__lead{
  font-size:16.5px;line-height:1.72;color:var(--grau);max-width:56ch;
}

.pm-case__grid{
  display:grid;grid-template-columns:1.06fr .94fr;
  gap:60px;align-items:stretch;
}

/* ---------- links: Vergleich ---------- */
.pm-chart{
  background:#fff;border:1px solid var(--linie);border-radius:14px;
  padding:30px 32px 26px;box-shadow:0 16px 44px rgba(27,38,59,.06);
  display:flex;flex-direction:column;
}
.pm-chart__head{
  display:flex;justify-content:space-between;align-items:baseline;
  gap:16px;padding-bottom:16px;margin-bottom:24px;
  border-bottom:1px solid var(--linie);
}
.pm-chart__t{font-size:14.5px;font-weight:600;color:var(--blau);letter-spacing:-.012em;}
.pm-chart__legende{display:flex;gap:16px;}
.pm-chart__lg{
  display:inline-flex;align-items:center;gap:7px;
  font-size:11.5px;color:var(--grau);white-space:nowrap;
}
.pm-chart__lg i{width:9px;height:9px;border-radius:2px;flex:none;font-style:normal;}
.pm-chart__lg--v i{background:var(--hell);}
.pm-chart__lg--n i{background:var(--blau);}

.pm-mess{margin-bottom:26px;}
.pm-mess:last-of-type{margin-bottom:0;}
.pm-chart__body{flex:1;display:flex;flex-direction:column;justify-content:space-around;gap:24px;}
.pm-mess__k{
  font-size:12px;font-weight:600;color:var(--blau);
  margin-bottom:14px;letter-spacing:-.008em;
}
.pm-cbar{
  display:grid;grid-template-columns:56px 1fr auto;
  align-items:center;gap:14px;margin-bottom:9px;
}
.pm-cbar__lbl{
  font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  font-weight:700;color:var(--schwach);
}
.pm-cbar__track{height:26px;background:var(--flaeche);border-radius:4px;overflow:hidden;}
.pm-cbar__fill{
  display:block;height:100%;width:0;border-radius:4px;
  transition:width 1.1s cubic-bezier(.25,.8,.3,1);
}
.pm-case.is-in .pm-cbar__fill{width:var(--w);}
.pm-cbar--v .pm-cbar__fill{background:var(--hell);}
.pm-cbar--n .pm-cbar__fill{background:var(--blau);}
.pm-cbar__val{
  font-size:14px;font-weight:700;color:var(--blau);
  font-variant-numeric:tabular-nums;white-space:nowrap;min-width:96px;text-align:right;
}
.pm-cbar--v .pm-cbar__val{color:var(--schwach);}

.pm-chart__delta{
  margin-top:8px;padding-top:14px;border-top:1px solid var(--linie);
  display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;
}
.pm-chart__delta span{font-size:12.5px;color:var(--grau);}
.pm-chart__delta b{color:var(--akzent);font-weight:700;}

/* ---------- rechts: Text ---------- */
.pm-case__block{
  padding:20px 0;border-bottom:1px solid var(--linie);
}
.pm-case__block:first-child{padding-top:0;}
.pm-case__block:last-of-type{border-bottom:0;}
.pm-case__k{
  font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
  font-weight:700;color:var(--akzent);margin:0 0 9px;
}
.pm .pm-case__x{font-size:15px;line-height:1.72;color:var(--grau);max-width:52ch;}

.pm-erg{margin-top:2px;}
.pm-erg li{
  position:relative;padding:8px 0 8px 26px;
  font-size:15px;line-height:1.55;color:var(--blau);
}
.pm-erg li::before{
  content:"";position:absolute;left:0;top:15px;
  width:10px;height:5px;
  border-left:1.8px solid var(--akzent);
  border-bottom:1.8px solid var(--akzent);
  transform:rotate(-45deg);
}

/* ---------- Fußzeile ---------- */
.pm-case__foot{
  margin-top:32px;padding-top:24px;border-top:1px solid var(--linie);
  display:flex;justify-content:space-between;align-items:center;
  gap:28px;flex-wrap:wrap;
}
.pm .pm-case__note{
  font-size:13px;line-height:1.62;color:var(--schwach);max-width:64ch;
}
.pm-case__links{display:flex;gap:22px;flex-wrap:wrap;}
.pm a.pm-case__dl{
  display:inline-flex;align-items:center;gap:9px;
  font-size:14px;font-weight:600;color:var(--blau) !important;
  border-bottom:1.5px solid var(--akzent);padding-bottom:4px;
  white-space:nowrap;transition:border-color .18s;
}
.pm a.pm-case__dl:hover{border-bottom-color:var(--blau);}
.pm-case__dl svg{width:14px;height:14px;flex:none;}

/* ---------- Einblenden ---------- */
.pm-case__head > *,.pm-chart,.pm-case__block,.pm-case__foot{
  opacity:0;transform:translateY(var(--rv-y));
  transition:opacity var(--rv-t) cubic-bezier(.2,.75,.3,1),
             transform var(--rv-t) cubic-bezier(.2,.75,.3,1);
}
.pm-case.is-in .pm-case__head > *,
.pm-case.is-in .pm-chart,
.pm-case.is-in .pm-case__block,
.pm-case.is-in .pm-case__foot{opacity:1;transform:none;}
.pm-case.is-in .pm-case__head > *:nth-child(2){transition-delay:.06s;}
.pm-case.is-in .pm-case__head > *:nth-child(3){transition-delay:.12s;}
.pm-case.is-in .pm-chart{transition-delay:.14s;}
.pm-case.is-in .pm-case__block:nth-child(2){transition-delay:.20s;}
.pm-case.is-in .pm-case__block:nth-child(3){transition-delay:.26s;}
.pm-case.is-in .pm-case__foot{transition-delay:.32s;}

@media(max-width:1000px){
  .pm-case{padding:64px 0;}
  .pm-case__grid{grid-template-columns:1fr;gap:40px;}
}
@media(max-width:560px){
  .pm-chart{padding:22px 20px 20px;}
  .pm-chart__head{flex-direction:column;align-items:flex-start;gap:12px;}
  .pm-cbar{grid-template-columns:48px 1fr;gap:10px;}
  .pm-cbar__val{grid-column:2;text-align:left;min-width:0;margin-top:-4px;}
}
@media(prefers-reduced-motion:reduce){
  .pm-case__head > *,.pm-chart,.pm-case__block,.pm-case__foot{
    opacity:1 !important;transform:none !important;transition:none !important;}
  .pm-cbar__fill{transition:none !important;width:var(--w) !important;}
}

/* ===========================================================
   7 · ABLAUF
   ------------------------------------------------------------
   Aufteilung nach Zuständigkeit statt nach Reihenfolge:
   links, was der Hersteller tut (zwei Schritte), rechts, was
   Prüfmagazin übernimmt (drei). Die eigentliche Frage des
   Lesers ist nicht "was passiert", sondern "wie viel Arbeit
   macht mir das".

   Bewusst ruhige Sektion nach dem interaktiven Block davor:
   keine Reiter, keine Klapper — nur Hover und Scroll-Einlauf.
   =========================================================== */
.pm-flowb{padding:84px 0;background:#fff;}

/* ---------- Kopfzeile ---------- */
.pm-flowb__head{max-width:820px;margin:0 auto 52px;text-align:center;}
.pm-flowb__h2{
  font-size:clamp(26px,2.9vw,38px);line-height:1.16;font-weight:700;
  letter-spacing:-.024em;color:var(--blau);margin:0 0 16px;
}
.pm .pm-flowb__lead{
  font-size:16.5px;line-height:1.72;color:var(--grau);
  margin:0 auto;max-width:46ch;
}

/* ---------- zwei Spalten ---------- */
.pm-flowb__grid{
  display:grid;grid-template-columns:1fr 1fr;
  gap:56px;align-items:stretch;
}

/* Spaltenkopf */
.pm-col__head{
  display:flex;align-items:baseline;justify-content:space-between;
  gap:16px;padding-bottom:14px;margin-bottom:8px;
  border-bottom:1px solid var(--linie);
}
.pm-col__t{
  font-size:12px;letter-spacing:.16em;text-transform:uppercase;
  font-weight:700;color:var(--blau);
}
.pm-col--you .pm-col__t{color:var(--akzent);}
.pm-col__n{
  font-size:12px;color:var(--schwach);font-weight:500;
  font-variant-numeric:tabular-nums;white-space:nowrap;
}

/* Schritte */
.pm-step{
  position:relative;
  display:grid;grid-template-columns:38px 1fr;gap:18px;
  padding:22px 0;
  transition:padding-left .28s cubic-bezier(.3,.8,.35,1);
}
.pm-step::after{
  content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);
  width:0;height:2px;background:var(--akzent);
  transition:width .28s cubic-bezier(.3,.8,.35,1);
}
.pm-step:hover{padding-left:22px;}
.pm-step:hover::after{width:14px;}

/* Nummernkreis + Verbindungslinie */
.pm-step__no{
  position:relative;z-index:1;
  width:38px;height:38px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  font-size:12.5px;font-weight:700;font-variant-numeric:tabular-nums;
  background:#fff;transition:border-color .22s, background .22s;
}
.pm-col--you .pm-step__no{border:1.5px solid rgba(184,134,59,.45);color:var(--akzent);}
.pm-col--we  .pm-step__no{border:1.5px solid var(--linie);color:var(--blau-2);}
.pm-col--you .pm-step:hover .pm-step__no{border-color:var(--akzent);background:rgba(184,134,59,.09);}
.pm-col--we  .pm-step:hover .pm-step__no{border-color:var(--hell);background:var(--flaeche);}

/* durchgehende Linie zwischen den Kreisen */
.pm-steps{position:relative;}
.pm-steps::before{
  content:"";position:absolute;left:18.5px;top:38px;bottom:38px;
  width:1px;background:var(--linie);
}

.pm-step__t{
  display:block;font-size:16.5px;font-weight:600;
  color:var(--blau);letter-spacing:-.016em;
  line-height:1.35;margin-bottom:6px;
}
.pm-step__x{
  display:block;font-size:14.5px;line-height:1.68;color:var(--grau);
}

/* ---------- Fußleiste ---------- */
.pm-flowb__foot{
  margin-top:52px;padding-top:30px;border-top:1px solid var(--linie);
  display:flex;justify-content:space-between;align-items:center;
  gap:40px;flex-wrap:wrap;
}
.pm-kpi{display:flex;gap:40px;flex-wrap:wrap;}
.pm-kpi__it b{
  display:block;font-size:24px;font-weight:700;color:var(--blau);
  letter-spacing:-.03em;line-height:1;margin-bottom:7px;
  font-variant-numeric:tabular-nums;
}
.pm-kpi__it span{
  font-size:12px;letter-spacing:.08em;text-transform:uppercase;
  font-weight:600;color:var(--schwach);white-space:nowrap;
}
/* Button im Stil des Hero-CTA — hier steht die Entscheidung an,
   deshalb kein Textlink wie in Sektion 5 */
.pm a.pm-flowb__cta,
.pm a.pm-flowb__cta:link,
.pm a.pm-flowb__cta:visited{
  display:inline-flex;align-items:center;gap:11px;
  background:#1B263B;color:#ffffff !important;
  border:1.5px solid #1B263B;border-radius:2px;
  padding:17px 34px;font-size:15px;font-weight:600;
  font-family:var(--f);line-height:1.2;white-space:nowrap;
  transition:background .18s, border-color .18s, transform .18s;
  margin-left:auto;
}
.pm a.pm-flowb__cta:hover{
  background:#415A77;border-color:#415A77;color:#ffffff !important;
  transform:translateY(-1px);
}
.pm-flowb__cta svg{width:16px;height:16px;flex:none;}
/* Pfeil rückt beim Hover leicht nach rechts */
.pm-flowb__cta svg{transition:transform .22s cubic-bezier(.3,.8,.35,1);}
.pm-flowb__cta:hover svg{transform:translateX(3px);}

/* ---------- Einblenden ---------- */
.pm-flowb__head > *,.pm-step,.pm-col__head,.pm-flowb__foot{
  opacity:0;transform:translateY(var(--rv-y));
  transition:opacity var(--rv-t) cubic-bezier(.2,.75,.3,1),
             transform var(--rv-t) cubic-bezier(.2,.75,.3,1);
}
.pm-flowb.is-in .pm-flowb__head > *,
.pm-flowb.is-in .pm-step,
.pm-flowb.is-in .pm-col__head,
.pm-flowb.is-in .pm-flowb__foot{opacity:1;transform:none;}
.pm-flowb.is-in .pm-flowb__head > *:nth-child(2){transition-delay:.06s;}
.pm-flowb.is-in .pm-flowb__head > *:nth-child(3){transition-delay:.12s;}
.pm-flowb.is-in .pm-col__head{transition-delay:.14s;}
.pm-flowb.is-in .pm-step:nth-child(1){transition-delay:.20s;}
.pm-flowb.is-in .pm-step:nth-child(2){transition-delay:.28s;}
.pm-flowb.is-in .pm-step:nth-child(3){transition-delay:.36s;}
.pm-flowb.is-in .pm-flowb__foot{transition-delay:.40s;}
/* Hover darf die Einblendung nicht zurücksetzen */
.pm-flowb.is-in .pm-step:hover{transform:none;}

@media(max-width:1000px){
  .pm-flowb{padding:64px 0;}
  .pm-flowb__grid{grid-template-columns:1fr;gap:40px;}
  .pm-flowb__foot{gap:28px;}
  .pm-kpi{gap:30px;}
  .pm-kpi__it span{font-size:11.5px;letter-spacing:.06em;}
  .pm a.pm-flowb__cta{padding:16px 26px;}
}
@media(max-width:560px){
  .pm-kpi{gap:28px;}
  .pm-kpi__it b{font-size:21px;}
  .pm-flowb__foot{gap:28px;}
  .pm a.pm-flowb__cta{width:100%;justify-content:center;padding:16px 24px;}
}
@media(prefers-reduced-motion:reduce){
  .pm-flowb__head > *,.pm-step,.pm-col__head,.pm-flowb__foot{
    opacity:1 !important;transform:none !important;transition:none !important;}
}

/* ===========================================================
   8 · EIGNUNG
   ------------------------------------------------------------
   Die fünfzehn Kategorien stehen als Menge über die volle
   Breite — die Botschaft ist die Breite selbst, nicht die
   einzelne Kategorie.

   Die beiden Einschränkungen darunter, sichtbar aber ohne
   eigene Bühne. Offen zu benennen, wo Grenzen liegen, ist an
   dieser Stelle ein Vertrauenssignal.

   Bewusst NICHT verlinkt: die Kategorieseiten sind
   Verbraucher-Content und würden aus dem Funnel führen.
   =========================================================== */
.pm-fit{padding:84px 0;background:var(--flaeche);}

/* ---------- Kopfzeile ---------- */
.pm-fit__head{max-width:720px;margin:0 auto 46px;text-align:center;}
.pm-fit__h2{
  font-size:clamp(26px,2.9vw,38px);line-height:1.16;font-weight:700;
  letter-spacing:-.024em;color:var(--blau);margin:0 0 16px;
}
.pm .pm-fit__lead{
  font-size:16.5px;line-height:1.72;color:var(--grau);
  margin:0 auto;max-width:56ch;
}

/* ---------- Kategorien ---------- */
.pm-cats{
  display:flex;flex-wrap:wrap;justify-content:center;
  gap:12px;max-width:1000px;margin:0 auto;
}
.pm-cat{
  display:inline-flex;align-items:center;gap:10px;
  background:#fff;border:1px solid var(--linie);
  border-radius:100px;padding:11px 22px;
  font-size:14.5px;font-weight:500;color:var(--blau);
  letter-spacing:-.008em;white-space:nowrap;
  transition:border-color .22s, transform .22s cubic-bezier(.2,.75,.3,1),
             box-shadow .22s;
}
.pm-cat::before{
  content:"";width:5px;height:5px;border-radius:50%;
  background:var(--akzent);flex:none;opacity:.55;
  transition:opacity .22s, transform .22s;
}
.pm-cat:hover{
  border-color:var(--akzent);transform:translateY(-2px);
  box-shadow:0 10px 24px rgba(27,38,59,.08);
}
.pm-cat:hover::before{opacity:1;transform:scale(1.25);}

/* ---------- Einschränkungen ---------- */
.pm-limits{
  max-width:1000px;margin:52px auto 0;
  padding-top:32px;border-top:1px solid var(--linie);
  display:grid;grid-template-columns:1fr 1fr;gap:40px;
}
.pm-limit{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:start;}
.pm-limit__ic{
  width:32px;height:32px;border-radius:50%;
  border:1.5px solid var(--linie);background:#fff;
  display:inline-flex;align-items:center;justify-content:center;flex:none;
}
.pm-limit__ic svg{width:15px;height:15px;}
.pm-limit__t{
  display:block;font-size:15.5px;font-weight:600;color:var(--blau);
  letter-spacing:-.014em;line-height:1.35;margin-bottom:6px;
}
.pm-limit__x{
  display:block;font-size:14.5px;line-height:1.66;color:var(--grau);
}
.pm .pm-limit__a,
.pm .pm-limit__a:link,
.pm .pm-limit__a:visited{
  color:var(--blau) !important;font-weight:600;
  border-bottom:1px solid var(--akzent);padding-bottom:1px;
  transition:color .18s, border-color .18s;
}
.pm .pm-limit__a:hover{color:var(--akzent) !important;border-bottom-color:var(--blau);}

/* ---------- Einblenden ---------- */
.pm-fit__head > *,.pm-cat,.pm-limits{
  opacity:0;transform:translateY(var(--rv-y));
  transition:opacity var(--rv-t) cubic-bezier(.2,.75,.3,1),
             transform var(--rv-t) cubic-bezier(.2,.75,.3,1);
}
.pm-fit.is-in .pm-fit__head > *,
.pm-fit.is-in .pm-cat,
.pm-fit.is-in .pm-limits{opacity:1;transform:none;}
.pm-fit.is-in .pm-fit__head > *:nth-child(2){transition-delay:.06s;}
.pm-fit.is-in .pm-fit__head > *:nth-child(3){transition-delay:.12s;}
.pm-fit.is-in .pm-cat:nth-child(1){transition-delay:.16s;}
.pm-fit.is-in .pm-cat:nth-child(2){transition-delay:.19s;}
.pm-fit.is-in .pm-cat:nth-child(3){transition-delay:.22s;}
.pm-fit.is-in .pm-cat:nth-child(4){transition-delay:.25s;}
.pm-fit.is-in .pm-cat:nth-child(5){transition-delay:.28s;}
.pm-fit.is-in .pm-cat:nth-child(6){transition-delay:.31s;}
.pm-fit.is-in .pm-cat:nth-child(7){transition-delay:.34s;}
.pm-fit.is-in .pm-cat:nth-child(8){transition-delay:.37s;}
.pm-fit.is-in .pm-cat:nth-child(9){transition-delay:.40s;}
.pm-fit.is-in .pm-cat:nth-child(10){transition-delay:.43s;}
.pm-fit.is-in .pm-cat:nth-child(11){transition-delay:.46s;}
.pm-fit.is-in .pm-cat:nth-child(12){transition-delay:.49s;}
.pm-fit.is-in .pm-cat:nth-child(13){transition-delay:.52s;}
.pm-fit.is-in .pm-cat:nth-child(14){transition-delay:.55s;}
.pm-fit.is-in .pm-cat:nth-child(15){transition-delay:.58s;}
.pm-fit.is-in .pm-limits{transition-delay:.64s;}
/* Hover darf die Einblendung nicht zurücksetzen */
.pm-fit.is-in .pm-cat:hover{transform:translateY(-2px);}

@media(max-width:900px){
  .pm-fit{padding:64px 0;}
  .pm-cats{gap:10px;}
  .pm-cat{padding:10px 18px;font-size:14px;}
  .pm-limits{grid-template-columns:1fr;gap:26px;margin-top:44px;}
}
@media(max-width:520px){
  .pm-cat{padding:9px 15px;font-size:13.5px;gap:8px;}
}
@media(prefers-reduced-motion:reduce){
  .pm-fit__head > *,.pm-cat,.pm-limits{
    opacity:1 !important;transform:none !important;transition:none !important;}
}

/* ===========================================================
   9 · LIZENZRICHTLINIEN
   ------------------------------------------------------------
   Links die drei Nutzungsbeispiele — dasselbe Siegel dreimal,
   korrekt / entfärbt / verzerrt. Vollständig per CSS-Filter aus
   dem vorhandenen PNG, kein neues Bildmaterial nötig.

   Rechts die fünf Regeln als Akkordeon. Bewusste Wiederholung
   der Mechanik aus Sektion 3, aber mit fünf Sektionen Abstand —
   fünf ausgeschriebene Regeltexte würden die Displayhöhe
   sprengen.
   =========================================================== */
.pm-lic{padding:84px 0;background:#fff;}

.pm-lic__head{max-width:660px;margin:0 0 46px;}
.pm-lic__h2{
  font-size:clamp(26px,2.9vw,38px);line-height:1.16;font-weight:700;
  letter-spacing:-.024em;color:var(--blau);margin:0 0 16px;
}
.pm .pm-lic__lead{
  font-size:16.5px;line-height:1.72;color:var(--grau);max-width:56ch;
}

.pm-lic__grid{
  display:grid;grid-template-columns:.92fr 1.08fr;
  gap:64px;align-items:start;
}

/* ---------- links: Nutzungsbeispiele ---------- */
.pm-ex{display:grid;gap:16px;}
.pm-ex__it{
  display:grid;grid-template-columns:96px 1fr;gap:22px;align-items:center;
  border:1px solid var(--linie);border-radius:12px;
  padding:18px 22px;background:#fff;
  transition:border-color .22s, box-shadow .22s;
}
.pm-ex__it--ok{border-color:rgba(184,134,59,.42);}
.pm-ex__it:hover{box-shadow:0 12px 28px rgba(27,38,59,.07);}

.pm-ex__fig{
  width:96px;height:96px;background:var(--flaeche);border-radius:8px;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;padding:10px;
}
.pm-ex__fig img{max-width:100%;max-height:100%;width:auto;}
/* entfärbt */
.pm-ex__fig--gray img{filter:grayscale(1) brightness(1.18);}
/* verzerrt */
.pm-ex__fig--warp img{transform:scaleX(.6) scaleY(1.14);}

.pm-ex__st{
  display:inline-flex;align-items:center;gap:8px;
  font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;
  font-weight:700;margin:0 0 8px;
}
.pm-ex__it--ok .pm-ex__st{color:var(--akzent);}
.pm-ex__it--no .pm-ex__st{color:var(--schwach);}
.pm-ex__st i{
  width:6px;height:6px;border-radius:50%;background:currentColor;
  flex:none;font-style:normal;
}
.pm-ex__cap{font-size:14.5px;line-height:1.55;color:var(--grau);}
.pm-ex__cap b{display:block;color:var(--blau);font-weight:600;margin-bottom:3px;}

/* ---------- rechts: Regeln ---------- */
.pm-rules{border-top:1px solid var(--linie);}
.pm-rules__it{border-bottom:1px solid var(--linie);}

.pm-rules__btn{
  width:100%;background:none;border:0;margin:0;
  font-family:var(--f);text-align:left;cursor:pointer;
  display:grid;grid-template-columns:30px 1fr 18px;
  align-items:center;gap:12px;padding:18px 0;
  position:relative;
  transition:padding-left .28s cubic-bezier(.3,.8,.35,1);
}
.pm-rules__btn::before{
  content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);
  width:0;height:2px;background:var(--akzent);
  transition:width .28s cubic-bezier(.3,.8,.35,1);
}
.pm-rules__btn:hover{padding-left:24px;}
.pm-rules__btn:hover::before{width:15px;}
.pm-rules__it.is-open .pm-rules__btn{padding-left:24px;}
.pm-rules__it.is-open .pm-rules__btn::before{width:15px;}

.pm-rules__no{
  font-size:11.5px;font-weight:700;letter-spacing:.08em;
  color:var(--hell);font-variant-numeric:tabular-nums;transition:color .22s;
}
.pm-rules__it.is-open .pm-rules__no,
.pm-rules__btn:hover .pm-rules__no{color:var(--akzent);}

.pm-rules__t{
  font-size:16.5px;font-weight:600;line-height:1.35;
  color:var(--blau);letter-spacing:-.014em;
}

.pm-rules__ic{position:relative;width:14px;height:14px;justify-self:end;}
.pm-rules__ic::before,.pm-rules__ic::after{
  content:"";position:absolute;left:50%;top:50%;
  background:var(--akzent);transform:translate(-50%,-50%);
  transition:transform .28s cubic-bezier(.3,.7,.3,1),opacity .2s;
}
.pm-rules__ic::before{width:14px;height:1.6px;}
.pm-rules__ic::after{width:1.6px;height:14px;}
.pm-rules__it.is-open .pm-rules__ic::after{transform:translate(-50%,-50%) rotate(90deg);opacity:0;}

.pm-rules__panel{
  display:grid;grid-template-rows:0fr;
  transition:grid-template-rows .34s cubic-bezier(.3,.8,.35,1);
}
.pm-rules__it.is-open .pm-rules__panel{grid-template-rows:1fr;}
.pm-rules__inner{overflow:hidden;}
.pm .pm-rules__inner p{
  font-size:15px;line-height:1.72;color:var(--grau);
  padding:0 30px 20px 42px;max-width:58ch;
  opacity:0;transform:translateY(-4px);
  transition:opacity .3s ease .06s, transform .3s ease .06s;
}
.pm-rules__it.is-open .pm-rules__inner p{opacity:1;transform:none;}

/* ---------- Einblenden ---------- */
.pm-lic__head > *,.pm-ex__it,.pm-rules{
  opacity:0;transform:translateY(var(--rv-y));
  transition:opacity var(--rv-t) cubic-bezier(.2,.75,.3,1),
             transform var(--rv-t) cubic-bezier(.2,.75,.3,1);
}
.pm-lic.is-in .pm-lic__head > *,
.pm-lic.is-in .pm-ex__it,
.pm-lic.is-in .pm-rules{opacity:1;transform:none;}
.pm-lic.is-in .pm-lic__head > *:nth-child(2){transition-delay:.06s;}
.pm-lic.is-in .pm-lic__head > *:nth-child(3){transition-delay:.12s;}
.pm-lic.is-in .pm-ex__it:nth-child(1){transition-delay:.16s;}
.pm-lic.is-in .pm-ex__it:nth-child(2){transition-delay:.24s;}
.pm-lic.is-in .pm-ex__it:nth-child(3){transition-delay:.32s;}
.pm-lic.is-in .pm-rules{transition-delay:.20s;}

@media(max-width:1000px){
  .pm-lic{padding:64px 0;}
  .pm-lic__grid{grid-template-columns:1fr;gap:44px;}
}
@media(max-width:520px){
  .pm-ex__it{grid-template-columns:72px 1fr;gap:16px;padding:14px 16px;}
  .pm-ex__fig{width:72px;height:72px;padding:8px;}
  .pm .pm-rules__inner p{padding-left:0;padding-right:0;}
  .pm-rules__btn{grid-template-columns:26px 1fr 16px;}
}
@media(prefers-reduced-motion:reduce){
  .pm-lic__head > *,.pm-ex__it,.pm-rules{
    opacity:1 !important;transform:none !important;transition:none !important;}
  .pm-rules__panel{transition:none !important;}
}

/* ===========================================================
   10 · EINORDNUNG
   ------------------------------------------------------------
   Erste dunkle Sektion der Seite, direkt vor dem Formular —
   sie markiert den Übergang. Stil der Kontaktbox von der
   Startseite: gerastertes Dunkelblau, Goldlicht, umrandete Box.

   Tonlage: offen und klar, aber ohne dem Hersteller Sorge zu
   machen, sein Produkt könnte nicht genügen. Deshalb steht hier
   KEINE Vergabeschwelle und keine Formulierung, die auf einen
   möglichen negativen Ausgang zeigt.
   =========================================================== */
.pm-open{
  background:var(--blau);
  padding:88px 0;
  position:relative;overflow:hidden;
}
.pm-open::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.028) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.028) 1px, transparent 1px);
  background-size:64px 64px;
}
.pm-open::after{
  content:"";position:absolute;bottom:-240px;left:-160px;
  width:640px;height:640px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(184,134,59,.14) 0%,rgba(184,134,59,0) 68%);
}

.pm-open__card{
  position:relative;z-index:1;
  max-width:1120px;margin:0 auto;
  border:1px solid rgba(255,255,255,.13);
  background:rgba(255,255,255,.018);
  padding:56px 64px;
  display:grid;grid-template-columns:1.4fr auto;
  gap:56px;align-items:center;
}

.pm-open__kicker{
  display:flex;align-items:center;gap:14px;
  font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;
  font-weight:700;color:var(--akzent-hell);margin:0 0 20px;
}
.pm-open__kicker::before{
  content:"";width:32px;height:1.5px;background:var(--akzent-hell);flex:none;
}
.pm .pm-open__h2{
  font-size:clamp(24px,2.7vw,34px);line-height:1.16;font-weight:700;
  letter-spacing:-.024em;color:#fff;margin:0 0 24px;
  text-wrap:balance;
}

.pm-open__list{list-style:none;padding:0;margin:0;}
.pm-open__list li{
  padding:16px 0;border-top:1px solid rgba(255,255,255,.11);
}
.pm-open__list li:first-child{border-top:0;padding-top:0;}
.pm-open__list li:last-child{padding-bottom:0;}
.pm .pm-open__p{
  font-size:15.5px;line-height:1.75;color:#B5C0D2;max-width:58ch;
}
.pm .pm-open__p b{color:#fff;font-weight:600;}

.pm a.pm-open__btn,
.pm a.pm-open__btn:link,
.pm a.pm-open__btn:visited{
  display:inline-flex;align-items:center;gap:12px;
  background:#ffffff;color:#1B263B !important;
  border:1.5px solid #ffffff;border-radius:2px;
  padding:18px 32px;font-size:15px;font-weight:600;
  white-space:nowrap;transition:background .18s, border-color .18s, transform .18s;
}
.pm a.pm-open__btn:hover{
  background:#E0E1DD;border-color:#E0E1DD;transform:translateY(-1px);
}
.pm-open__btn svg{width:17px;height:17px;flex:none;}

/* ---------- Einblenden ---------- */
.pm-open__card > div > *,.pm-open__btn{
  opacity:0;transform:translateY(var(--rv-y));
  transition:opacity var(--rv-t) cubic-bezier(.2,.75,.3,1),
             transform var(--rv-t) cubic-bezier(.2,.75,.3,1);
}
.pm-open.is-in .pm-open__card > div > *,
.pm-open.is-in .pm-open__btn{opacity:1;transform:none;}
.pm-open.is-in .pm-open__h2{transition-delay:.06s;}
.pm-open.is-in .pm-open__list{transition-delay:.12s;}
.pm-open.is-in .pm-open__btn{transition-delay:.20s;}

@media(max-width:1000px){
  .pm-open{padding:68px 0;}
  .pm-open__card{grid-template-columns:1fr;gap:36px;padding:44px 36px;}
}
@media(max-width:560px){
  .pm-open{padding:56px 0;}
  .pm-open__card{padding:34px 24px;gap:30px;}
  .pm a.pm-open__btn{width:100%;justify-content:center;padding:17px 22px;}
}
@media(prefers-reduced-motion:reduce){
  .pm-open__card > div > *,.pm-open__btn{
    opacity:1 !important;transform:none !important;transition:none !important;}
}

/* ===========================================================
   2 · FAKTENBAND
   Rahmen wie zuvor: helle Fläche, Haarlinien, 58 px Padding,
   linksbündig mit Trennlinien.
   Geändert nur: Zahlen 34 px Semibold in Graublau statt
   44 px Bold in Navy, und die fünf Kennzahlen selbst.
   =========================================================== */
.pm-facts{
  background:var(--flaeche);
  padding:48px 0;
}

.pm-facts__grid{
  display:grid;grid-template-columns:repeat(5,1fr);gap:0;
}

.pm-facts__it{
  padding:0 18px;
  text-align:center;
  display:flex;flex-direction:column;align-items:center;
}



/* Icon */
.pm-facts__ic{
  display:block;width:32px;height:32px;
  margin-bottom:22px;
  opacity:.45;
  transition:opacity .25s;
}
.pm-facts__it:hover .pm-facts__ic{opacity:.85;}

/* Zahl */
.pm-facts__num{
  display:flex;align-items:baseline;justify-content:center;
  font-size:clamp(28px,2.5vw,34px);
  font-weight:600;
  letter-spacing:-.032em;
  line-height:1;
  height:34px;
  color:var(--blau);
  font-variant-numeric:tabular-nums;
  margin-bottom:18px;
}
.pm-facts__num i{
  font-style:normal;
  color:var(--blau);
  font-size:.58em;
  letter-spacing:0;
  margin-left:2px;
}

/* Label */
.pm-facts__t{
  display:block;
  font-size:14.5px;font-weight:600;
  color:var(--blau);letter-spacing:-.008em;
  line-height:1.35;margin-bottom:5px;
  white-space:nowrap;
}
.pm-facts__s{
  display:block;
  font-size:13.5px;font-weight:400;
  color:var(--grau);line-height:1.45;
  white-space:nowrap;
}

/* Einblenden */
.pm-facts__it{
  opacity:0;transform:translateY(var(--rv-y));
  transition:opacity var(--rv-t) cubic-bezier(.2,.75,.3,1),
             transform var(--rv-t) cubic-bezier(.2,.75,.3,1);
}
.pm-facts.is-in .pm-facts__it{opacity:1;transform:none;}
.pm-facts.is-in .pm-facts__it:nth-child(2){transition-delay:.06s;}
.pm-facts.is-in .pm-facts__it:nth-child(3){transition-delay:.12s;}
.pm-facts.is-in .pm-facts__it:nth-child(4){transition-delay:.18s;}
.pm-facts.is-in .pm-facts__it:nth-child(5){transition-delay:.24s;}

@media(max-width:1080px){
  .pm-facts__it{padding:0 24px;}
  .pm-facts__t,.pm-facts__s{white-space:normal;}
}
@media(max-width:900px){
  .pm-facts{padding:40px 0;}
  .pm-facts__grid{grid-template-columns:1fr 1fr 1fr;gap:34px 24px;}
  .pm-facts__it{padding:0;}
  .pm-facts__ic{width:28px;height:28px;margin-bottom:18px;}
  .pm-facts__num{height:auto;margin-bottom:14px;}
}
@media(max-width:600px){
  .pm-facts__grid{grid-template-columns:1fr 1fr;gap:30px 20px;}
}
@media(prefers-reduced-motion:reduce){
  .pm-facts__it{opacity:1 !important;transform:none !important;transition:none !important;}
}

/* ===========================================================
   11 · VORQUALIFIZIERUNG
   ------------------------------------------------------------
   Sieben Felder, ein Schritt. Absenden geht an den eigenen
   WordPress-Endpunkt, der Versand läuft über wp_mail und damit
   über WP Mail SMTP mit info@pruefmagazin.de.

   Spam-Schutz ohne Captcha: unsichtbares Honeypot-Feld plus
   Zeitprüfung im Snippet.

   Heller Hintergrund — die Sektion davor (Einordnung) ist
   dunkel, zwei dunkle Blöcke hintereinander würden verschmelzen.
   =========================================================== */
.pm-form{padding:88px 0;background:#fff;}
.pm-form__grid{
  display:grid;grid-template-columns:.82fr 1.18fr;
  gap:72px;align-items:start;
}

/* ---------- links: Ansprache ---------- */
.pm-form__aside{position:sticky;top:60px;}
.pm-form__h2{
  font-size:clamp(26px,2.9vw,38px);line-height:1.14;font-weight:700;
  letter-spacing:-.024em;color:var(--blau);margin:0 0 18px;
}
.pm .pm-form__lead{
  font-size:16.5px;line-height:1.72;color:var(--grau);
  margin:0 0 30px;max-width:38ch;
}
.pm-form__pts{list-style:none;padding:0;margin:0;}
.pm-form__pts li{
  position:relative;padding:11px 0 11px 26px;
  font-size:15px;line-height:1.6;color:var(--blau);
}
.pm-form__pts li::before{
  content:"";position:absolute;left:0;top:17px;
  width:10px;height:5px;
  border-left:1.8px solid var(--akzent);
  border-bottom:1.8px solid var(--akzent);
  transform:rotate(-45deg);
}

/* Alternativer Kontakt — schließt die Höhendifferenz zur Formularkarte */
.pm-form__alt{
  margin-top:34px;padding-top:26px;border-top:1px solid var(--linie);
}
.pm-form__alt-k{
  font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
  font-weight:700;color:var(--schwach);margin:0 0 12px;
}
.pm a.pm-form__alt-a{
  display:inline-flex;align-items:center;gap:10px;
  font-size:16px;font-weight:600;color:var(--blau) !important;
  letter-spacing:-.014em;transition:color .18s;
}
.pm a.pm-form__alt-a:hover{color:var(--akzent) !important;}
.pm-form__alt-a svg{width:17px;height:17px;flex:none;color:var(--akzent);}
.pm .pm-form__alt-x{
  font-size:13.5px;line-height:1.6;color:var(--grau);
  margin-top:11px;max-width:34ch;
}

/* ---------- rechts: Formularkarte ---------- */
.pm-card{
  border:1px solid var(--linie);border-radius:14px;
  background:#fff;padding:40px 40px 36px;
  box-shadow:0 18px 50px rgba(27,38,59,.06);
  position:relative;
}

.pm-fields{
  display:grid;grid-template-columns:1fr 1fr;gap:20px 22px;
}
.pm-f{display:flex;flex-direction:column;}
.pm-f--voll{grid-column:1 / -1;}

.pm .pm-f label{
  font-size:12.5px;font-weight:600;letter-spacing:.02em;
  color:var(--blau);margin-bottom:8px;
}
.pm .pm-f label i{
  font-style:normal;color:var(--akzent);margin-left:2px;
}
.pm .pm-f input,
.pm .pm-f select{
  font-family:var(--f);font-size:15px;color:var(--blau);
  background:#fff;border:1px solid var(--linie);border-radius:6px;
  padding:13px 15px;width:100%;
  transition:border-color .18s, box-shadow .18s;
  -webkit-appearance:none;appearance:none;
}
.pm .pm-f select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6 9l6 6 6-6' stroke='%23667182' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 13px center;
  background-size:17px;padding-right:42px;cursor:pointer;
}
.pm .pm-f input::placeholder{color:var(--schwach);}
.pm .pm-f input:focus,
.pm .pm-f select:focus{
  outline:none;border-color:var(--akzent);
  box-shadow:0 0 0 3px rgba(184,134,59,.13);
}
.pm .pm-f input.pm-fehler,
.pm .pm-f select.pm-fehler{border-color:#B3543F;}

/* Hinweis am Feld */
.pm-tip{position:relative;display:inline-flex;margin-left:7px;vertical-align:middle;}
.pm .pm-tip__b{
  width:16px;height:16px;border-radius:50%;padding:0;
  border:1px solid var(--hell);background:#fff;color:var(--grau);
  font-family:var(--f);font-size:10.5px;font-weight:700;line-height:1;
  display:inline-flex;align-items:center;justify-content:center;
  cursor:help;transition:border-color .18s,color .18s;
}
.pm .pm-tip__b:hover,.pm .pm-tip__b:focus-visible{
  border-color:var(--akzent);color:var(--akzent);outline:none;
}
.pm-tip__t{
  position:absolute;left:-8px;bottom:calc(100% + 10px);
  width:290px;z-index:5;
  background:var(--blau);color:#C9D2E0;
  font-size:12.5px;line-height:1.6;font-weight:400;
  padding:13px 15px;border-radius:8px;
  box-shadow:0 12px 30px rgba(15,31,61,.28);
  opacity:0;visibility:hidden;transform:translateY(4px);
  transition:opacity .2s ease, transform .2s ease, visibility .2s;
}
.pm-tip__t::after{
  content:"";position:absolute;left:12px;top:100%;
  border:6px solid transparent;border-top-color:var(--blau);
}
.pm-tip__b:hover + .pm-tip__t,
.pm-tip__b:focus-visible + .pm-tip__t,
.pm-tip:hover .pm-tip__t{opacity:1;visibility:visible;transform:none;}
@media(max-width:600px){
  .pm-tip__t{width:230px;left:auto;right:-8px;}
  .pm-tip__t::after{left:auto;right:12px;}
}

/* Honeypot — für Menschen unsichtbar */
.pm-hp{
  position:absolute !important;width:1px;height:1px;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;
}

/* Datenschutz */
.pm-dsgvo{
  grid-column:1 / -1;display:grid;grid-template-columns:auto 1fr;
  gap:12px;align-items:start;margin-top:4px;
}
.pm .pm-dsgvo input{
  width:18px;height:18px;margin:2px 0 0;flex:none;
  accent-color:#B8863B;cursor:pointer;
}
.pm .pm-dsgvo label{
  font-size:13.5px;line-height:1.6;color:var(--grau);
  font-weight:400;margin:0;cursor:pointer;
}
.pm .pm-dsgvo a{
  color:var(--blau) !important;font-weight:600;
  border-bottom:1px solid var(--akzent);
}

/* Absenden */
.pm-send{
  grid-column:1 / -1;margin-top:10px;
  display:flex;align-items:center;gap:20px;flex-wrap:wrap;
}
.pm button.pm-btn{
  display:inline-flex;align-items:center;gap:11px;
  background:#1B263B;color:#fff;border:1.5px solid #1B263B;
  border-radius:2px;padding:17px 34px;
  font-family:var(--f);font-size:15px;font-weight:600;line-height:1.2;
  cursor:pointer;transition:background .18s, border-color .18s, transform .18s;
}
.pm button.pm-btn:hover{background:#415A77;border-color:#415A77;transform:translateY(-1px);}
.pm button.pm-btn[disabled]{opacity:.55;cursor:default;transform:none;}
.pm-btn svg{width:16px;height:16px;flex:none;
  transition:transform .22s cubic-bezier(.3,.8,.35,1);}
.pm button.pm-btn:hover svg{transform:translateX(3px);}
.pm-hinweis{font-size:13px;line-height:1.55;color:var(--schwach);max-width:34ch;}

/* Meldungen */
.pm-meldung{
  grid-column:1 / -1;font-size:14.5px;line-height:1.6;
  color:#B3543F;margin-top:4px;display:none;
}
.pm-meldung.is-on{display:block;}

/* Danke-Zustand */
.pm-danke{
  display:none;text-align:center;padding:44px 20px;
}
.pm-danke.is-on{display:block;animation:pmFade .45s ease both;}
.pm-danke__ic{
  width:56px;height:56px;border-radius:50%;margin:0 auto 22px;
  border:1.5px solid rgba(184,134,59,.45);
  display:flex;align-items:center;justify-content:center;
}
.pm-danke__ic svg{width:26px;height:26px;}
.pm-danke h3{
  font-size:21px;font-weight:700;color:var(--blau);
  letter-spacing:-.018em;margin:0 0 12px;
}
.pm .pm-danke p{
  font-size:15.5px;line-height:1.72;color:var(--grau);
  max-width:44ch;margin:0 auto;
}
@keyframes pmFade{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}

/* ---------- Einblenden ---------- */
.pm-form__aside > *,.pm-card{
  opacity:0;transform:translateY(var(--rv-y));
  transition:opacity var(--rv-t) cubic-bezier(.2,.75,.3,1),
             transform var(--rv-t) cubic-bezier(.2,.75,.3,1);
}
.pm-form.is-in .pm-form__aside > *,
.pm-form.is-in .pm-card{opacity:1;transform:none;}
.pm-form.is-in .pm-form__aside > *:nth-child(2){transition-delay:.06s;}
.pm-form.is-in .pm-form__aside > *:nth-child(3){transition-delay:.12s;}
.pm-form.is-in .pm-form__aside > *:nth-child(4){transition-delay:.18s;}
.pm-form.is-in .pm-card{transition-delay:.10s;}

@media(max-width:1000px){
  .pm-form{padding:64px 0;}
  .pm-form__grid{grid-template-columns:1fr;gap:40px;}
  .pm-form__aside{position:static;}
  .pm .pm-form__lead{max-width:56ch;}
}
@media(max-width:600px){
  .pm-card{padding:28px 22px 26px;}
  .pm-fields{grid-template-columns:1fr;gap:18px;}
  .pm button.pm-btn{width:100%;justify-content:center;}
  .pm-hinweis{max-width:none;}
}
@media(prefers-reduced-motion:reduce){
  .pm-form__aside > *,.pm-card{
    opacity:1 !important;transform:none !important;transition:none !important;}
}

/* ===========================================================
   12 · FAQ
   ------------------------------------------------------------
   Aufbau wie auf /testprozess: links Kicker, H2 und Kontaktlink
   in einer mitlaufenden Spalte, rechts das Akkordeon.

   Ausschließlich B2B-Fragen. Keine Pakete, keine Preise, keine
   Garantie — und keine Vergabeschwelle.
   =========================================================== */
.pm-faq{
  padding:88px 0;background:var(--flaeche);
  border-top:1px solid var(--linie);
}
.pm-faq__grid{
  display:grid;grid-template-columns:.72fr 1.28fr;
  gap:88px;align-items:start;
}

/* ---------- links ---------- */
.pm-faq__aside{position:sticky;top:60px;}
.pm .pm-faq__h2{
  font-size:clamp(26px,2.9vw,38px);line-height:1.12;font-weight:700;
  letter-spacing:-.026em;color:var(--blau);margin:0 0 18px;
}
.pm .pm-faq__sub{
  font-size:16.5px;line-height:1.72;color:var(--grau);
  margin:0 0 30px;max-width:34ch;
}
.pm-faq__link{
  display:inline-flex;align-items:center;gap:9px;
  font-size:14px;font-weight:600;color:var(--blau) !important;
  border-bottom:1.5px solid var(--akzent);padding-bottom:4px;
  transition:border-color .18s;
}
.pm-faq__link:hover{border-bottom-color:var(--blau);}
.pm-faq__link svg{width:14px;height:14px;flex:none;
  transition:transform .22s cubic-bezier(.3,.8,.35,1);}
.pm-faq__link:hover svg{transform:translateX(3px);}

/* ---------- rechts: Akkordeon ---------- */
.pm-faq__list{border-top:1px solid var(--linie);}
.pm-faq__item{border-bottom:1px solid var(--linie);}

.pm-faq__q{
  width:100%;background:none;border:0;margin:0;
  font-family:var(--f);text-align:left;cursor:pointer;
  display:grid;grid-template-columns:42px 1fr 18px;
  align-items:start;gap:10px;padding:24px 0;
  position:relative;
  transition:padding-left .28s cubic-bezier(.3,.8,.35,1);
}
.pm-faq__q::before{
  content:"";position:absolute;left:0;top:34px;
  width:0;height:2px;background:var(--akzent);
  transition:width .28s cubic-bezier(.3,.8,.35,1);
}
.pm-faq__q:hover{padding-left:24px;}
.pm-faq__q:hover::before{width:15px;}
.pm-faq__item.is-open .pm-faq__q{padding-left:24px;}
.pm-faq__item.is-open .pm-faq__q::before{width:15px;}

.pm-faq__no{
  font-size:11.5px;font-weight:700;letter-spacing:.07em;
  color:var(--hell);font-variant-numeric:tabular-nums;
  padding-top:5px;transition:color .22s;
}
.pm-faq__item.is-open .pm-faq__no,
.pm-faq__q:hover .pm-faq__no{color:var(--akzent);}

.pm-faq__txt{
  font-size:17.5px;font-weight:600;line-height:1.42;
  color:var(--blau);letter-spacing:-.016em;
}

.pm-faq__ic{position:relative;width:15px;height:15px;justify-self:end;margin-top:6px;}
.pm-faq__ic::before,.pm-faq__ic::after{
  content:"";position:absolute;left:50%;top:50%;
  background:var(--akzent);transform:translate(-50%,-50%);
  transition:transform .28s cubic-bezier(.3,.7,.3,1),opacity .2s;
}
.pm-faq__ic::before{width:15px;height:1.7px;}
.pm-faq__ic::after{width:1.7px;height:15px;}
.pm-faq__item.is-open .pm-faq__ic::after{transform:translate(-50%,-50%) rotate(90deg);opacity:0;}

.pm-faq__panel{
  display:grid;grid-template-rows:0fr;
  transition:grid-template-rows .34s cubic-bezier(.3,.8,.35,1);
}
.pm-faq__item.is-open .pm-faq__panel{grid-template-rows:1fr;}
.pm-faq__inner{overflow:hidden;}
.pm .pm-faq__inner p{
  font-size:15.5px;line-height:1.8;color:var(--grau);
  padding:0 34px 26px 52px;max-width:70ch;
  opacity:0;transform:translateY(-4px);
  transition:opacity .3s ease .06s, transform .3s ease .06s;
}
.pm-faq__item.is-open .pm-faq__inner p{opacity:1;transform:none;}
.pm .pm-faq__inner a{
  color:var(--blau) !important;font-weight:600;
  border-bottom:1px solid var(--akzent);padding-bottom:1px;
  transition:color .18s, border-color .18s;
}
.pm .pm-faq__inner a:hover{color:var(--akzent) !important;border-bottom-color:var(--blau);}

/* ---------- Einblenden ---------- */
.pm-faq__aside > *,.pm-faq__list{
  opacity:0;transform:translateY(var(--rv-y));
  transition:opacity var(--rv-t) cubic-bezier(.2,.75,.3,1),
             transform var(--rv-t) cubic-bezier(.2,.75,.3,1);
}
.pm-faq.is-in .pm-faq__aside > *,
.pm-faq.is-in .pm-faq__list{opacity:1;transform:none;}
.pm-faq.is-in .pm-faq__aside > *:nth-child(2){transition-delay:.06s;}
.pm-faq.is-in .pm-faq__aside > *:nth-child(3){transition-delay:.12s;}
.pm-faq.is-in .pm-faq__aside > *:nth-child(4){transition-delay:.18s;}
.pm-faq.is-in .pm-faq__list{transition-delay:.10s;}

@media(max-width:1000px){
  .pm-faq{padding:64px 0;}
  .pm-faq__grid{grid-template-columns:1fr;gap:44px;}
  .pm-faq__aside{position:static;}
  .pm .pm-faq__sub{max-width:56ch;}
}
@media(max-width:560px){
  .pm-faq__q{grid-template-columns:30px 1fr 16px;gap:8px;padding:20px 0;}
  .pm-faq__txt{font-size:16px;}
  .pm .pm-faq__inner p{padding:0 0 22px 38px;}
}
@media(prefers-reduced-motion:reduce){
  .pm-faq__aside > *,.pm-faq__list{
    opacity:1 !important;transform:none !important;transition:none !important;}
  .pm-faq__panel{transition:none !important;}
}

/* ===========================================================
   TEXTABSTAENDE — Reparatur
   Der Reset ".pm h1..h5{margin:0}" und ".pm p{margin:0}" hat
   hoehere Spezifitaet als die reinen Klassenregeln und hat die
   Abstaende unter Kicker und Ueberschriften seitenweit auf 0
   gesetzt — auf Desktop wie mobil. Hier mit ".pm "-Praefix
   wiederhergestellt, exakt auf die urspruenglich deklarierten
   Werte.
   =========================================================== */
.pm .pm-eyebrow{margin-bottom:16px;}
.pm .pm-issue__h2,
.pm .pm-form__h2{margin-bottom:18px;}
.pm .pm-proof__h2,
.pm .pm-deliv__h2,
.pm .pm-touch__h2,
.pm .pm-case__h2,
.pm .pm-flowb__h2,
.pm .pm-fit__h2,
.pm .pm-lic__h2{margin-bottom:16px;}
.pm .pm-issue__lead{margin-bottom:34px;}

/* Ziffern auf dem Siegel: auf Desktop unsichtbar, Wrapper neutral */
.pm-anat__fig{display:contents;}
.pm-anat__mk{display:none;}


/* ===========================================================
   MOBIL-KORREKTUREN  (Durchgang 07/2026)
   Gilt ausschliesslich fuer Mobil — Desktop bleibt unveraendert.
   Steht bewusst am Ende des Stylesheets, damit diese Regeln
   die frueheren Mobil-Regeln ueberschreiben.
   =========================================================== */

@media(max-width:900px){

  /* --- 1 Ausgangslage: Kopf ueber das Raster ziehen -------- */
  .pm-issue__grid{gap:0;align-items:start;}
  .pm-issue__txt{display:contents;}
  .pm-issue__txt > .pm-eyebrow{order:1;}
  .pm-issue__h2{order:2;}
  .pm-issue__lead{order:3;}
  .pm-serp{order:4;margin-bottom:34px;}
  .pm-acc{order:5;}

  /* --- 3a Kaufentscheidung: Buehne mit fester Mindesthoehe --
         Alle vier Ansichten gleich hoch, nichts wird gekappt,
         die inneren flex:1-Elemente behalten ihre Hoehe.      */
  .pm-stage{aspect-ratio:auto;min-height:420px;}
  .pm-view{position:absolute;inset:0;display:flex;}
  .pm-view:not(.is-on){opacity:0;pointer-events:none;}

  /* --- 3b Erklaertext im Fluss statt absolut, damit er nicht
         in die Buehne laeuft --------------------------------- */
  .pm-touch__note{min-height:0;margin-bottom:26px;}
  .pm .pm-touch__note p{position:static;inset:auto;display:none;max-width:none;}
  .pm .pm-touch__note p.is-on{display:block;opacity:1;transform:none;}

  /* --- 3c Reiter als 2x2-Raster: alles sichtbar, kein Scrollen */
  .pm-touch__grid > *{min-width:0;}
  .pm-tabs{
    display:grid;grid-template-columns:1fr 1fr;gap:8px;
    margin:0 0 24px;padding:0;overflow:visible;
  }
  .pm-tabs li,.pm-tabs li:first-child{border:0;}
  .pm-tab{
    display:flex;align-items:center;justify-content:center;gap:7px;
    white-space:nowrap;width:100%;
    padding:10px 8px;border:1px solid var(--linie);border-radius:999px;
    transition:background .22s, border-color .22s;
  }
  .pm-tab::before{display:none;}
  .pm-tab__t{font-size:13px;}
  .pm-tab__no{font-size:10.5px;}
  .pm-tabs li.is-on .pm-tab{background:var(--blau);border-color:var(--blau);padding-left:8px;}
  .pm-tabs li.is-on .pm-tab__no{color:rgba(255,255,255,.6);}
  .pm-tabs li.is-on .pm-tab__t{color:#fff;}
}

@media(max-width:700px){

  /* --- 2 Nachweispflicht: Siegel gross, Ziffern darauf,
         Beschriftung als nummerierte Liste darunter ---------- */
  .pm-anat{counter-reset:pmpin;}
  .pm-anat::before{display:none;}
  .pm-anat__fig{display:block;position:relative;margin:0 0 24px;}
  .pm-anat__img{width:100%;display:block;}
  .pm-anat__mk{
    display:flex;align-items:center;justify-content:center;
    position:absolute;left:var(--x);top:var(--y);
    transform:translate(-50%,-50%);
    width:21px;height:21px;border-radius:50%;
    background:var(--akzent);color:#fff;
    font-size:9.5px;font-weight:700;letter-spacing:.02em;
    font-variant-numeric:tabular-nums;
    box-shadow:0 2px 6px rgba(15,31,61,.35);
  }
  .pm-pin{
    position:static;transform:none;
    display:grid;grid-template-columns:26px 1fr;
    align-items:start;gap:12px;
    padding:13px 0;border-top:1px solid var(--linie);
    counter-increment:pmpin;
  }
  .pm-pin:last-child{border-bottom:1px solid var(--linie);}
  .pm-pin__dot{
    width:auto;height:auto;border-radius:0;
    background:none;box-shadow:none;
    opacity:1;transform:none;
    font-size:11px;font-weight:700;letter-spacing:.06em;
    color:var(--akzent);font-variant-numeric:tabular-nums;
  }
  .pm-pin__dot::before{content:counter(pmpin,decimal-leading-zero);}
  .pm-pin__ln{display:none;}
  .pm-pin__lbl{width:auto;opacity:1;transform:none;}
}

@media(max-width:560px){

  /* --- 4 Fallstudie: Beschriftung ueber den Balken, Fusszeile
         enger an den Text ----------------------------------- */
  .pm-cbar{grid-template-columns:1fr;gap:5px;margin-bottom:16px;}
  .pm-cbar__lbl,.pm-cbar__track{grid-column:1;}
  .pm-cbar__val{grid-column:1;text-align:left;margin-top:0;}
  .pm-case__foot{margin-top:14px;padding-top:20px;}

  /* Kaufentscheidung, Ansicht 04: Bildhoehe deckeln. Im Bereich
     480-560 px waechst das 16/9-Bild sonst mit der Breite und
     schiebt den Lizenzblock aus der Buehne heraus. */
  .pm-pdp__l{aspect-ratio:auto;height:148px;}
}



/* ===========================================================
   ABSTANDSSKALA  (Durchgang 08/2026)
   Ersetzt 40 gewachsene Einzelwerte durch eine 8er-Skala.
   Grundsatz:
   - TYPOGRAFISCHE Abstaende haengen an der Schriftgroesse und
     bleiben mobil gleich (Kicker, Ueberschrift, Absatz).
   - STRUKTURELLE Abstaende haengen am Viewport und werden
     mobil eine Stufe kleiner (Sektion, Spalte, Karte).
   Dieselben Werte gelten auf der Startseite.
   =========================================================== */
.pm{
  /* typografisch - viewportunabhaengig */
  --tp-kicker:12px;      /* Kicker  -> Ueberschrift */
  --tp-head:16px;        /* Ueberschrift -> Lead    */
  --tp-para:12px;        /* Absatz  -> Absatz       */
  --tp-title:8px;        /* Blocktitel -> Blocktext */
  /* strukturell - Desktop */
  --sp-sec:96px;         /* Sektion oben/unten      */
  --sp-lead:48px;        /* Lead -> Inhalt          */
  --sp-col:64px;         /* Spalte -> Spalte        */
  --sp-block:32px;       /* Block -> Block          */
  --sp-card:24px;        /* Karte -> Karte          */
  --sp-foot:40px;        /* Inhalt -> Fusszeile     */
}
@media(max-width:900px){
  .pm{
    --sp-sec:64px;
    --sp-lead:32px;
    --sp-col:40px;
    --sp-block:24px;
    --sp-card:16px;
    --sp-foot:32px;
  }
}

/* --- Sektionsrahmen (Hero und Faktenband haben eigene Hoehen) --- */
.pm section:not(.pm-hero):not(.pm-facts){padding:var(--sp-sec) 0;}

/* --- Kopfbereich: identisch auf allen Seiten --- */
.pm .pm-eyebrow{margin-bottom:var(--tp-kicker);}
.pm [class$="__h2"]{
  margin-bottom:var(--tp-head);
  font-size:clamp(28px,2.9vw,42px);
  line-height:1.14;
}
.pm [class$="__lead"]:not([class*="hero"]){
  margin-bottom:var(--sp-lead);
  font-size:17px;
  line-height:1.72;
}

/* --- Spaltenraster: mobil gestapelt, deshalb eigener Zeilenabstand --- */
@media(max-width:900px){
  .pm [class$="__grid"]{row-gap:var(--sp-col);}
  .pm .pm-proof__left,
  .pm .pm-open__card{row-gap:var(--sp-block);}
  .pm .pm-facts__grid{row-gap:var(--sp-card);}

  /* Ausgangslage: Kicker, Ueberschrift und Lead sind hier selbst
     Rasterkinder (order-Umsortierung). Der Zeilenabstand des Rasters
     wuerde sich sonst auf die Kopfzeilen legen. */
  .pm .pm-issue__grid{row-gap:0;}
  .pm .pm-serp{margin-bottom:var(--sp-col);}

  /* Kaufentscheidung: Reiter und Erklaertext gehoeren zusammen und
     stehen deshalb enger als der Abstand zur Buehne. */
  .pm .pm-touch__grid{row-gap:var(--sp-block);}
  .pm .pm-touch__head{margin-bottom:var(--sp-lead);}
  .pm .pm-touch__lead{margin-bottom:0;}
  .pm .pm-tabs{margin-bottom:var(--sp-card);}
  .pm .pm-touch__note{margin-bottom:0;}
}

/* Zwischenstufe 901-1000 px: die Buehne ist dort am schmalsten,
   das Seitenverhaeltnis allein reicht der Suchtrefferliste nicht. */
@media(min-width:901px) and (max-width:1000px){
  .pm-stage{min-height:368px;}
}

/* --- Kopfzeile ---------------------------------------------------------- */
.pm-head{position:fixed;top:0;left:0;right:0;z-index:100;
  background:rgba(255,255,255,.94);backdrop-filter:saturate(180%) blur(14px);
  -webkit-backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid var(--linie);
  transition:transform .32s cubic-bezier(.2,.75,.3,1);}
.pm-head.is-weg{transform:translateY(-101%);}
.pm-head__in{display:flex;align-items:center;gap:28px;height:72px;
  max-width:1240px;margin:0 auto;padding:0 32px;}
.pm-head__logo{flex:0 0 auto;display:flex;align-items:center;}
.pm-head__logo img{height:38px;width:auto;display:block;}

/* Navigation */
.pm-nav2{display:flex;align-items:center;gap:26px;margin-left:6px;}
.pm-nav2 a{position:relative;font-size:14.5px;font-weight:500;color:var(--blau);
  padding:6px 0;white-space:nowrap;}
.pm-nav2 a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1.5px;
  background:var(--akzent);transform:scaleX(0);transform-origin:left;
  transition:transform .3s cubic-bezier(.2,.75,.3,1);}
.pm-nav2 a:hover::after,.pm-nav2 a.is-akt::after{transform:scaleX(1);}

/* Flyout */
.pm-nav2{position:static;}
.pm-fly{position:absolute;left:0;right:0;top:100%;
  background:#fff;border-bottom:1px solid var(--linie);
  box-shadow:0 30px 70px -40px rgba(27,38,59,.32);
  opacity:0;visibility:hidden;transform:translateY(-10px);
  transition:opacity .26s cubic-bezier(.2,.75,.3,1),
             transform .26s cubic-bezier(.2,.75,.3,1),visibility .26s;}
.pm-fly.is-auf{opacity:1;visibility:visible;transform:none;}
.pm-fly__in{max-width:1240px;margin:0 auto;padding:44px 32px 48px;
  display:grid;grid-template-columns:1.35fr 1px .9fr;gap:0 52px;}
.pm-fly__linie{background:var(--linie);}
.pm-fly__lbl{font-size:10px;letter-spacing:.18em;text-transform:uppercase;
  font-weight:700;color:var(--schwach);margin:0 0 20px;}

/* Kategorien */
.pm-fly__kat{display:grid;grid-template-columns:repeat(3,1fr);gap:0 32px;}
.pm-fly__kat a{position:relative;display:block;font-size:14px;color:var(--grau);
  padding:9px 0 9px 16px;transition:color .18s;}
.pm-fly__kat a::before{content:"";position:absolute;left:0;top:50%;
  width:5px;height:5px;border-radius:50%;background:var(--akzent);
  transform:translateY(-50%) scale(0);transition:transform .22s cubic-bezier(.2,.75,.3,1);}
.pm-fly__kat a:hover{color:var(--blau);}
.pm-fly__kat a:hover::before{transform:translateY(-50%) scale(1);}

/* Aufmacher rechts */
.pm-fly__auf{display:block;}
.pm-fly__bild{overflow:hidden;border-radius:12px;background:var(--flaeche);
  border:1px solid var(--linie);aspect-ratio:16/10;margin-bottom:16px;}
.pm-fly__bild img{width:100%;height:100%;object-fit:cover;
  transition:transform .9s cubic-bezier(.2,.75,.3,1);}
.pm-fly__auf:hover .pm-fly__bild img{transform:scale(1.04);}
.pm-fly__kick{font-size:10px;letter-spacing:.16em;text-transform:uppercase;
  font-weight:700;color:var(--akzent);margin:0 0 8px;}
.pm-fly__t{font-size:16px;line-height:1.36;font-weight:600;color:var(--blau);
  letter-spacing:-.01em;margin:0;}
.pm-fly__zeilen{margin-top:22px;border-top:1px solid var(--linie);}
.pm-fly__zeilen a{display:block;padding:13px 0;border-bottom:1px solid var(--linie);
  font-size:13.5px;line-height:1.4;color:var(--grau);transition:color .18s;}
.pm-fly__zeilen a:last-child{border-bottom:0;}
.pm-fly__zeilen a:hover{color:var(--blau);}
.pm-fly__alle{display:inline-flex;align-items:center;gap:9px;margin-top:24px;
  font-size:13.5px;font-weight:500;color:var(--blau);
  border-bottom:1px solid var(--linie);padding-bottom:3px;transition:border-color .2s;}
.pm-fly__alle:hover{border-color:var(--akzent);}
.pm-fly__alle svg{transition:transform .22s;}
.pm-fly__alle:hover svg{transform:translateX(3px);}

/* Lizenzsuche */
/* Lizenzsuche */
.pm-such{position:relative;flex:1 1 auto;max-width:300px;margin-left:auto;}
.pm-such input{width:100%;height:40px;border:1px solid var(--linie);border-radius:8px;
  background:var(--flaeche);padding:0 58px 0 36px;font-family:var(--f);
  font-size:14px;color:var(--blau);transition:border-color .2s,background .2s;}
.pm-such input::placeholder{color:var(--schwach);}
.pm-such input:focus{outline:none;border-color:var(--blau-2);background:#fff;}
.pm-such__ic{position:absolute;left:12px;top:50%;transform:translateY(-50%);
  color:var(--schwach);pointer-events:none;}
.pm-such__kbd{position:absolute;right:10px;top:50%;transform:translateY(-50%);
  font-size:11px;font-weight:600;color:var(--schwach);border:1px solid var(--linie);
  border-radius:5px;padding:2px 6px;background:#fff;pointer-events:none;}

/* Sprache */
.pm-lang{position:relative;flex:0 0 auto;}
.pm-lang__btn{display:flex;align-items:center;gap:7px;background:none;border:0;
  cursor:pointer;font-family:var(--f);font-size:13.5px;font-weight:600;
  letter-spacing:.06em;color:var(--grau);padding:8px 2px;transition:color .2s;}
.pm-lang__btn:hover,.pm-lang.is-auf .pm-lang__btn{color:var(--blau);}
.pm-lang__btn svg{transition:transform .25s;}
.pm-lang.is-auf .pm-lang__btn svg{transform:rotate(180deg);}
.pm-lang__pn{position:absolute;top:calc(100% + 14px);right:0;min-width:200px;
  background:#fff;border:1px solid var(--linie);border-radius:12px;padding:8px;
  box-shadow:0 18px 50px rgba(27,38,59,.10);
  opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .22s,transform .22s,visibility .22s;}
.pm-lang.is-auf .pm-lang__pn{opacity:1;visibility:visible;transform:none;}
.pm-lang__pn a{display:block;padding:9px 14px;border-radius:8px;font-size:14px;
  color:var(--grau);transition:background .16s,color .16s;}
.pm-lang__pn a:hover{background:var(--flaeche);color:var(--blau);}
.pm-lang__pn a.is-akt{color:var(--blau);font-weight:600;}

/* Button */
.pm-head .pm-cta{display:inline-block;flex:0 0 auto;padding:12px 20px;border-radius:8px;
  background:var(--blau);color:#fff !important;font-size:14px;font-weight:500;
  white-space:nowrap;transition:background .18s;}
.pm-head .pm-cta:hover{background:var(--blau-2);}

/* Burger */
.pm-burger{display:none;width:40px;height:40px;margin-left:auto;background:none;
  border:0;cursor:pointer;position:relative;}
.pm-burger span{position:absolute;left:9px;width:22px;height:1.5px;background:var(--blau);
  transition:transform .3s cubic-bezier(.2,.75,.3,1),opacity .2s;}
.pm-burger span:nth-child(1){top:14px;}
.pm-burger span:nth-child(2){top:20px;}
.pm-burger span:nth-child(3){top:26px;}
body.pm-offen .pm-burger span:nth-child(1){transform:translateY(6px) rotate(45deg);}
body.pm-offen .pm-burger span:nth-child(2){opacity:0;}
body.pm-offen .pm-burger span:nth-child(3){transform:translateY(-6px) rotate(-45deg);}

/* Mobiles Vollbildmenue */
.pm-mob{display:none;position:fixed;inset:64px 0 0;z-index:99;background:#fff;
  flex-direction:column;padding:28px 22px 32px;
  opacity:0;visibility:hidden;transform:translateY(-8px);
  transition:opacity .28s,transform .28s,visibility .28s;overflow-y:auto;}
body.pm-offen .pm-mob{opacity:1;visibility:visible;transform:none;}
.pm-mob__such{margin-bottom:26px;}
.pm-mob__nav a{display:flex;align-items:center;justify-content:space-between;
  padding:18px 0;border-bottom:1px solid var(--linie);
  font-size:19px;font-weight:500;color:var(--blau);letter-spacing:-.01em;}
.pm-mob__nav a:first-child{border-top:1px solid var(--linie);}
.pm-mob__nav svg{color:var(--hell);}
.pm-mob__fuss{margin-top:auto;padding-top:32px;}
.pm-mob__fuss .pm-cta{display:block;text-align:center;padding:16px 20px;
  background:var(--blau);color:#fff !important;border-radius:8px;
  font-size:15px;font-weight:500;}
.pm-mob__spr{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px;}
.pm-mob__spr a{padding:8px 14px;border:1px solid var(--linie);border-radius:100px;
  font-size:13.5px;color:var(--grau);}
.pm-mob__spr a.is-akt{border-color:var(--blau);color:var(--blau);font-weight:600;}

@media(max-width:1180px){
  .pm-nav2{gap:20px;}
  .pm-such{max-width:210px;}
  .pm-such__kbd{display:none;}
  .pm-such input{padding-right:14px;}
}
@media(max-width:1000px){
  .pm-head__in{height:64px;padding:0 22px;gap:0;}
  .pm-nav2,.pm-such,.pm-lang,.pm-head .pm-cta{display:none;}
  .pm-burger{display:block;}
  .pm-mob{display:flex;}
}
/* --- Fußzeile ----------------------------------------------------------- */
.pm-foot{background:var(--blau);position:relative;overflow:hidden;}
.pm-foot::after{content:"";position:absolute;top:-60%;right:-8%;
  width:48%;height:200%;pointer-events:none;
  background:radial-gradient(closest-side,rgba(184,134,59,.09),transparent 72%);}
.pm-foot .pm-wrap{position:relative;z-index:1;}

/* Zeile 1: Marke + Navigation */
.pm-foot__oben{display:grid;grid-template-columns:auto 1fr;gap:var(--sp-col);
  align-items:start;padding:var(--sp-lead) 0 var(--sp-block);}
.pm-foot__logo img{height:52px;width:auto;display:block;}
.pm-foot__nav{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-card);}
.pm-foot__lbl{font-size:10px;letter-spacing:.18em;text-transform:uppercase;
  font-weight:700;color:var(--akzent-hell);margin:0 0 16px;}
.pm-foot__nav ul{display:flex;flex-direction:column;gap:1px;}
.pm .pm-foot__nav a,.pm .pm-foot__nav a:link,.pm .pm-foot__nav a:visited{
  display:inline-block;font-size:14.5px;color:var(--hell);padding:6px 0;
  transition:color .18s,transform .18s;}
.pm .pm-foot__nav a:hover{color:#fff;transform:translateX(3px);}

/* Zeile 2: Hinweis + Belege */
.pm-foot__mitte{display:grid;grid-template-columns:1fr auto;gap:var(--sp-col);
  align-items:center;padding:var(--sp-block) 0;
  border-top:1px solid rgba(255,255,255,.12);}
.pm-foot__hinweis{font-size:13px;line-height:1.7;color:var(--hell);margin:0;max-width:62ch;}
.pm-foot__hinweis strong{color:#fff;font-weight:600;}
.pm .pm-foot__hinweis a,.pm .pm-foot__hinweis a:link,.pm .pm-foot__hinweis a:visited{
  color:#fff;border-bottom:1px solid rgba(255,255,255,.28);}
.pm .pm-foot__hinweis a:hover{border-color:var(--akzent);}

/* Belege: kein Kasten, sondern Haarlinien-Trennung */
.pm-foot__belege{display:flex;align-items:center;gap:28px;flex:none;}
.pm-foot__bg{display:flex;align-items:center;gap:13px;position:relative;}
.pm-foot__bg + .pm-foot__bg{padding-left:28px;}
.pm-foot__bg + .pm-foot__bg::before{content:"";position:absolute;left:0;top:2px;bottom:2px;
  width:1px;background:rgba(255,255,255,.14);}
.pm-foot__bgic{flex:none;width:38px;height:38px;border-radius:50%;
  border:1px solid rgba(255,255,255,.18);display:flex;align-items:center;
  justify-content:center;color:var(--akzent-hell);}
.pm-foot__bgtx{font-size:12px;line-height:1.45;color:var(--hell);white-space:nowrap;}
.pm-foot__bgtx b{display:block;font-size:13.5px;font-weight:600;color:#fff;
  letter-spacing:-.005em;margin-bottom:1px;}
.pm-foot__sterne{display:flex;gap:2px;margin-bottom:5px;}
.pm .pm-foot__bgtx a,.pm .pm-foot__bgtx a:link,.pm .pm-foot__bgtx a:visited{
  color:var(--hell);border-bottom:1px solid rgba(255,255,255,.22);}
.pm .pm-foot__bgtx a:hover{color:#fff;border-color:var(--akzent-hell);}

/* Zeile 3: Schlusszeile */
.pm-foot__unten{border-top:1px solid rgba(255,255,255,.12);
  padding:20px 0 var(--sp-block);
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  font-size:12.5px;color:var(--hell);}
.pm .pm-foot__unten a,.pm .pm-foot__unten a:link,.pm .pm-foot__unten a:visited{
  color:var(--hell);border-bottom:1px solid rgba(255,255,255,.2);}
.pm .pm-foot__unten a:hover{color:#fff;border-color:var(--akzent-hell);}

@media(max-width:1100px){
  .pm-foot__mitte{grid-template-columns:1fr;gap:var(--sp-block);align-items:start;}
  .pm-foot__hinweis{max-width:none;}
}
@media(max-width:1000px){
  .pm-foot__oben{grid-template-columns:1fr;gap:var(--sp-block);}
  .pm-foot__nav{grid-template-columns:1fr 1fr;gap:var(--sp-block) var(--sp-card);}
}
@media(max-width:560px){
  .pm-foot__belege{flex-direction:column;align-items:flex-start;gap:18px;}
  .pm-foot__bg + .pm-foot__bg{padding-left:0;padding-top:18px;}
  .pm-foot__bg + .pm-foot__bg::before{left:0;right:auto;top:0;bottom:auto;
    width:56px;height:1px;}
  .pm-foot__bgtx{white-space:normal;}
  .pm-foot__unten{flex-direction:column;align-items:flex-start;gap:12px;}
  .pm-foot__logo img{height:44px;}
}
