/* ============================================================================
   „Für Installateure" — Betriebssuche + Premium-Wisch-Vergleich (.ibv-)
   Anordnung 1:1 wie die echte Profilseite (Hero → ID-Karte → Zweispalter).
   Literalwerte (Marken-Tokens), flat nach RR-Vorgabe.
   ========================================================================== */

/* ── Suche ── */
.ibv-such{position:relative;max-width:560px;margin:0 auto 14px;}
.ibv-such svg{position:absolute;left:15px;top:50%;transform:translateY(-50%);width:19px;height:19px;
  stroke:#64748b;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;pointer-events:none;}
/* padding !important: globale input[type=text]-Regeln (style.css) gewinnen sonst. */
.isb-page .ibv-such input{width:100%;font:inherit;font-size:16px;padding:14px 16px 14px 46px!important;border-radius:12px;
  border:1.5px solid #ccd6e2;color:#1d2430;background:#fff;box-shadow:none;}
.isb-page .ibv-such input:focus{outline:none;border-color:var(--inst-cyan-text);}
.ibv-drop{position:absolute;left:0;right:0;top:calc(100% + 6px);background:#fff;border:1px solid #ccd6e2;
  border-radius:12px;box-shadow:0 14px 40px rgba(16,40,70,.16);overflow:hidden;z-index:40;}
.ibv-drop button{display:flex;width:100%;justify-content:space-between;align-items:center;gap:10px;
  font:inherit;text-align:left;background:#fff;border:0;border-bottom:1px solid #dbe3ec;
  padding:11px 14px;cursor:pointer;font-size:14.5px;color:#1d2430;}
.ibv-drop button:last-child{border-bottom:0;}
.ibv-drop button:hover{background:#f0f6fb;}
.ibv-drop small{color:#64748b;flex:none;}
.ibv-drop-leer{padding:12px 14px;color:#64748b;font-size:13.5px;}

.ibv-gefunden{display:flex;align-items:center;justify-content:center;gap:10px;margin:0 0 12px;flex-wrap:wrap;}
.ibv-gefunden[hidden]{display:none;}
.ibv-tag-prem{background:#f3b100;color:#3d2f00;font-size:11.5px;font-weight:800;padding:4px 10px;border-radius:7px;}
.ibv-gefunden b{color:var(--inst-navy);font-size:15px;}
.ibv-reset{font:inherit;font-size:12.5px;color:#64748b;background:none;border:0;text-decoration:underline;cursor:pointer;padding:0;}

.ibv-scale{display:flex;justify-content:space-between;max-width:100%;margin:0 4px 8px;
  font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:#5c6b80;}
.ibv-scale b{color:var(--inst-navy);}

/* ── Wisch-Container ── */
/* pan-y statt none: der Container ist mobil >1.500px hoch — mit none frisst er
   jeden vertikalen Wisch und die Seite ist dort nicht scrollbar (RR-Befund).
   Horizontal zieht nur der Griff (touch-action:none dort, Rest macht JS). */
.ibv-cmp{position:relative;border-radius:16px;overflow:hidden;border:1px solid #ccd6e2;
  box-shadow:0 1px 2px rgba(16,40,70,.05),0 6px 20px rgba(16,40,70,.08);touch-action:pan-y;background:#f4f7fa;}
.ibv-lay{background:#f4f7fa;}
.ibv-lay-prem{position:absolute;inset:0;}

/* 🛑 Die Replik wird als GANZES verkleinert, nicht an einzelnen Maßen beschnitten.
   Ein erster Versuch, nur Höhen zu kürzen (Video flacher, Kacheln niedriger), hat
   die Proportionen zerstört: das Profil sah gestaucht aus statt kleiner.

   `zoom` statt `transform:scale`, weil es das Layout wirklich verändert. Bei
   transform bliebe unter dem Kasten ein Loch in Originalhöhe stehen, und die
   Prozentwerte des Wisch-Reglers (clip-path + Griff) liefen auseinander.

   🛑 `zoom` war der erste Versuch und funktioniert hier NICHT: der Container füllt
   damit weiter die volle sichtbare Breite und wird dadurch nur logisch breiter
   (1092px / .8 = 1365px). Alles Breitenabhängige wächst mit, allen voran das
   Video-Poster mit aspect-ratio 16/7 — unterm Strich wurde der Kasten sogar höher.

   Der Faktor steht als Variable hier und wird von js/betrieb-vergleich.js gelesen,
   das den Layout-Platz nachzieht (transform schrumpft nur die Darstellung, sonst
   bliebe unter dem Kasten ein Loch in Originalhöhe). EINE Quelle, kein Drift.

   Nur ab 821px: auf dem Handy ist die Replik ohnehin reduziert (Seitenleiste und
   Bewertungen ausgeblendet), dort wäre kleiner nur schlechter lesbar. */
.isb-vgl-sec{--ibv-k:1;}
@media (min-width:821px){
  .isb-vgl-sec{--ibv-k:.8;}
  .ibv-cmp{transform:scale(var(--ibv-k));transform-origin:top center;}
  /* „Heute / Mit Premium" markiert die beiden Hälften — die Beschriftung muss
     also auf die Kastenbreite mitschrumpfen, sonst zeigt sie ins Leere. */
  .ibv-scale{width:calc(100% * var(--ibv-k));margin-left:auto;margin-right:auto;}
}
.ibv-griff{position:absolute;top:0;bottom:0;width:0;z-index:5;touch-action:none;}
.ibv-griff::before{content:'';position:absolute;top:0;bottom:0;left:-1.5px;width:3px;background:var(--inst-navy);}
.ibv-knopf{position:absolute;top:50%;left:0;transform:translate(-50%,-50%);width:46px;height:46px;
  border-radius:50%;background:var(--inst-navy);border:3px solid #fff;box-shadow:0 4px 16px rgba(16,40,70,.35);
  display:flex;align-items:center;justify-content:center;cursor:ew-resize;}
.ibv-knopf svg{width:22px;height:22px;stroke:#fff;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;}
.ibv-hint{text-align:center;color:#64748b;font-size:13px;margin:10px 0 0;}
.ibv-cta{display:flex;gap:10px;justify-content:center;margin-top:18px;flex-wrap:wrap;}

/* ── Profil-Replik: Hero + ID-Karte (wie installateur-details) ── */
.ibv-hero{height:64px;background:var(--inst-navy);}
.ibv-idwrap{padding:0 18px;}
.ibv-id{display:flex;gap:16px;align-items:flex-start;background:#fff;border:1px solid #dbe3ec;
  border-radius:14px;padding:16px 18px;margin-top:-34px;position:relative;}
/* 🛑 Hochformat 4:5, nicht quadratisch. Die echte Profilseite zeigt den Avatar
   als 144x180 (assets/css/profile-rework.css: .isp-avatar), und dieser Kasten
   ist eine REPLIK davon: ein quadratisches 96er-Bild reichte nur bis 57 % der
   Identitätszeile und sah daneben aus wie ein anderes Produkt (Maxim 29.07.,
   „geht nur bis 2/3 vom Platz"). 105x131 ist 144x180 auf die Replikbreite
   heruntergerechnet (843 statt 1152 px), damit die Proportion stimmt.
   Wer die Replikbreite ändert, muss diese Zahlen nachziehen. */
.ibv-av{width:105px;height:131px;border-radius:13px;flex:none;background:#edf1f5;overflow:hidden;
  display:flex;align-items:center;justify-content:center;text-align:center;}
.ibv-av img{width:100%;height:100%;object-fit:cover;display:block;}
.ibv-av svg{width:52px;height:52px;stroke:#a9b6c4;fill:none;stroke-width:1.6;}
.ibv-av-slot{font-size:11px;font-weight:800;color:var(--inst-cyan-text);line-height:1.35;padding:6px;
  border:1.5px dashed #8fc6dd;border-radius:9px;margin:8px;}
.ibv-idmain{flex:1;min-width:0;}
.ibv-name{margin:0 0 6px;font-size:20px;color:var(--inst-navy);line-height:1.2;}
.ibv-meta{display:flex;gap:14px;align-items:center;flex-wrap:wrap;font-size:13px;color:#64748b;}
.ibv-rate{color:#1d2430;font-weight:700;}
.ibv-rate i{font-style:normal;color:#64748b;font-weight:400;}
.ibv-rate-none{color:#64748b;}
.ibv-loc{display:inline-flex;align-items:center;gap:5px;}
.ibv-loc svg{width:14px;height:14px;stroke:#64748b;fill:none;stroke-width:2;}
.ibv-chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px;}
.ibv-chip{background:#e6eef7;color:var(--inst-navy);border:1px solid #dbe3ec;font-size:12px;font-weight:700;
  padding:3px 10px;border-radius:8px;}
.ibv-chip-mehr{display:none;background:#eef2f6;color:#5c6b80;}
.ibv-idcta{display:flex;flex-direction:column;gap:8px;flex:none;}
.ibv-btn{display:inline-flex;align-items:center;justify-content:center;font-size:13.5px;font-weight:700;
  border-radius:9px;padding:9px 16px;white-space:nowrap;}
.ibv-btn-navy{background:var(--inst-navy);color:#fff;}
.ibv-btn-ghost{background:#eef4fb;color:var(--inst-navy);border:1px solid #dbe3ec;}
.ibv-btn-gold{background:#fbe9b6;color:#3d2f00;}

/* ── Body: Hauptspalte + Seitenleiste (wie isp-wrap) ── */
.ibv-body{display:grid;grid-template-columns:1fr 280px;gap:14px;padding:14px 18px 18px;}
.ibv-card{background:#fff;border:1px solid #dbe3ec;border-radius:12px;padding:14px 18px;margin-bottom:12px;}
.ibv-card:last-child{margin-bottom:0;}
.ibv-card h4{margin:0 0 8px;font-size:15px;color:var(--inst-navy);display:flex;align-items:center;gap:8px;}
.ibv-card p{margin:0;font-size:13.5px;line-height:1.55;color:#64748b;}

/* Gegliederte Beschreibung auf der Premium-Seite (fett, Aufzählung,
   Zwischenüberschrift — was der Editor ab Pro zulässt).
   🛑 Die Regeln müssen HIER stehen: .isp-desc-sub ist in profile-rework.css
   definiert, und die lädt auf „Für Installateure" nicht (betrieb-rework.css
   ist selbsttragend). Ohne das wäre die Zwischenüberschrift ein normaler Absatz. */
.ibv-desc p{margin:0 0 7px;font-size:13.5px;line-height:1.55;color:#64748b;}
.ibv-desc p:last-child{margin-bottom:0;}
.ibv-desc .isp-desc-sub{font-size:14px;font-weight:700;color:#1d2430;margin:11px 0 5px;line-height:1.35;}
.ibv-desc .isp-desc-sub:first-child{margin-top:0;}
.ibv-desc ul{margin:0;padding-left:17px;font-size:13.5px;line-height:1.5;color:#64748b;}
.ibv-desc li{margin-bottom:2px;}
.ibv-desc li:last-child{margin-bottom:0;}
.ibv-desc strong{font-weight:700;color:#1d2430;}
.ibv-bsp{background:#f3b100;color:#3d2f00;font-size:10.5px;font-weight:800;text-transform:uppercase;
  letter-spacing:.03em;padding:2px 8px;border-radius:6px;}
.ibv-video{position:relative;display:block;aspect-ratio:16/7;border-radius:9px;overflow:hidden;background:var(--inst-navy-700);}
.ibv-video img{width:100%;height:100%;object-fit:cover;display:block;opacity:.75;}
.ibv-video svg{position:absolute;inset:0;margin:auto;width:38px;height:38px;fill:#fff;
  background:rgba(15,36,56,.55);border-radius:50%;padding:9px;}
.ibv-gal{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;}
.ibv-g{aspect-ratio:4/3;border-radius:8px;overflow:hidden;background:#edf1f5;}
.ibv-g img{width:100%;height:100%;object-fit:cover;display:block;}
.ibv-gal-leer{border:1.5px dashed #ccd6e2;border-radius:9px;padding:20px;text-align:center;
  color:#64748b;font-size:13px;}
.ibv-revline{font-weight:700;color:#1d2430;}
.ibv-revline-leer{font-weight:400;}
.ibv-side .ibv-card h4{font-size:13px;}
.ibv-krow{display:flex;align-items:center;gap:9px;padding:6px 0;font-size:13px;color:#1d2430;}
.ibv-krow svg{width:15px;height:15px;flex:none;stroke:var(--inst-cyan-text);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.ibv-krow span{min-width:0;overflow-wrap:anywhere;}
.ibv-krow-link span{color:var(--inst-cyan-text);font-weight:700;}
.ibv-maplink{display:inline-flex;align-items:center;gap:7px;margin-top:8px;font-size:12.5px;font-weight:700;color:var(--inst-cyan-text);}
.ibv-maplink svg{width:14px;height:14px;stroke:var(--inst-cyan-text);fill:none;stroke-width:2;}
.ibv-hours{list-style:none;margin:0;padding:0;}
.ibv-hours li{display:flex;justify-content:space-between;gap:10px;padding:4px 0;font-size:12.5px;color:#1d2430;border-bottom:1px solid #eef2f6;}
.ibv-hours li:last-child{border-bottom:0;}
.ibv-hours li span:first-child{color:#64748b;}
.ibv-hours .zu{color:#5c6b80;}

@media (max-width:820px){
  .ibv-body{grid-template-columns:1fr;}
  .ibv-idcta{display:none;}
  .ibv-id{flex-wrap:wrap;gap:12px;}
  /* Hochformat auch schmal beibehalten, sonst kippt die Replik hier zurück
     ins Quadrat und widerspricht der echten Profilseite. */
  .ibv-av{width:76px;height:95px;}
  .ibv-av svg{width:38px;height:38px;}
  .ibv-gal{grid-template-columns:repeat(2,1fr);}
  /* Kompakt-Replik: Bewertungen + Seitenleiste sind auf beiden Slider-Seiten
     identisch (kein Vergleichswert) und kosteten ~600px Höhe; Galerie eine Reihe. */
  .ibv-side,.ibv-card-rev{display:none;}
  .ibv-g:nth-child(n+3){display:none;}
  /* Leistungen zusammengefasst: erster Chip + „+n weitere" statt bis zu 6 Chips;
     Chips eine Nummer kleiner, damit beide neben dem Avatar in EINE Zeile passen. */
  .ibv-chips-collapse .ibv-chip:nth-child(n+2):not(.ibv-chip-mehr){display:none;}
  .ibv-chips-collapse .ibv-chip-mehr{display:inline-block;}
  .ibv-chips{gap:5px;margin-top:8px;}
  .ibv-chip{font-size:11px;padding:2px 8px;}
}
