/* =======================================================================
   ueber-uns.css - seitenlokale Regeln fuer /ueber-uns/
   -----------------------------------------------------------------------
   Herkunft: Viereck_Ueber_uns_Prototype_CURRENT.html, <style>-Block.
   Von 326 Regeln stehen 291 bereits zeichengleich
   in site.css und sind hier NICHT wiederholt. Zusaetzlich entfallen:
     img                 - site.css fuehrt die korrigierte Fassung
     1 Data-URI-Hintergrundregeln - ersetzt durch echte Bilddateien
                           in <picture>/<img>.
   Inhaltlich wurde nichts geaendert.
   ======================================================================= */

.ubhero{padding:var(--s9) 0 calc(var(--s8) + 30px)}
.ubhero .in{max-width:var(--wrap)}
.ubhero .heroin{max-width:940px}
.ubhero .lbl{color:var(--gold);margin-bottom:var(--s4)}
.ubhero h1{margin:0 0 var(--s5);font-size:clamp(21px,6.6vw,46px);
  font-weight:600;letter-spacing:-.024em;line-height:1.1}
.ubhero h1 .l1,.ubhero h1 .l2{display:block}
.ubhero h1 .l2{color:var(--n300);font-weight:500}
.ubhero .lead{color:var(--n300);max-width:56ch}
.ubhero .diag{background:#fff}
.ubport{position:relative;width:100%;max-width:340px;aspect-ratio:4/5;
  overflow:hidden;background:var(--ink)}
.ubport .brandtile{display:flex;align-items:center;justify-content:center;padding:var(--s6)}
.ubport .lockv{display:flex;flex-direction:column;align-items:center;gap:22px;position:relative;z-index:1}
.ubport .lockv .mk{position:static;font-size:60px;opacity:1;--mk-frame:var(--red);--mk-v:var(--gold)}
.ubport .lockv .wm{width:180px;height:auto;display:block;flex:0 0 auto}
.ubport .brandtile .mkbg{position:absolute;font-size:220px;right:-62px;bottom:-66px;
  --mk-frame:var(--gold);--mk-v:var(--gold);opacity:.16}
.ubowner{display:grid;grid-template-columns:1fr;gap:var(--s7)}
@media (min-width:1024px){
  .ubowner{grid-template-columns:minmax(0,1fr) minmax(0,340px);gap:var(--s8);align-items:start}
}
.ubflow{max-width:66ch}
.ubflow p + p{margin-top:var(--s5)}
.ublinks{display:flex;gap:var(--s6);flex-wrap:wrap;margin-top:var(--s6)}
.ubproof{display:grid;grid-template-columns:1fr;gap:var(--s6)}
@media (min-width:1024px){
  .ubproof{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:var(--s8);align-items:center}
  .ubproof figure{grid-column:1;grid-row:1}
  .ubproof .ubptxt{grid-column:2;grid-row:1}
}
.ubproof .ph{aspect-ratio:3/2;overflow:hidden;position:relative;border:1px solid var(--n200);background:var(--n150)}
.ubproof figure{margin:0}
.ubproof figcaption{font-size:13px;color:var(--n600);line-height:1.5;padding-top:12px;max-width:62ch}
.ubfacts{display:grid;grid-template-columns:1fr;gap:var(--s5) var(--s7);
  border-top:1px solid var(--n200);padding-top:var(--s6)}
@media (min-width:640px){
  .ubfacts{grid-template-columns:1fr 1fr}
}
@media (min-width:1024px){
  .ubfacts{grid-template-columns:repeat(3,minmax(0,1fr))}
}
.ubfacts .k{font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--n500);margin-bottom:6px}
.ubfacts .v{font-size:16px;line-height:1.45;color:var(--ink)}
.ubbar a{flex:1 1 0;justify-content:center;text-align:center}

/* UEB-S-05a Bildausschnitt des Belegbilds.
   Der Prototyp setzt den Data-URI-Hintergrund auf
   "center 38% / cover no-repeat", nicht auf die Vorgabe "center".
   Ohne diese Regel wuerde das Motiv nach dem Wechsel auf <img> um 12 %
   der Bildhoehe nach unten rutschen. object-fit:cover kommt aus site.css;
   hier wird ausschliesslich die Position nachgezogen.
   Eng begrenzt auf dieses Belegmodul - keine globale Regel. */
.ubproof .im>picture>img{object-position:center 38%}

/* =======================================================================
   V1-Review E3 · Block 2 · WM-R-UU (Regel W1, Grundregel wie Startseite A2.2)
   Gerahmte Bildmarke unveraendert (vorhandene Pfade), Weiss 10 %, rechts und
   unten angeschnitten. "Kantenlaenge" = sichtbarer Rahmen; er belegt 21,4/28,4
   der viewBox. Desktop: Rahmen 720 px -> Box 955,5 px, Rahmen beginnt 117,8 px
   innerhalb der Box. Rahmen ragt 200 px rechts und 180 px unten ueber den
   Hero-Rand; die linke Rahmenkante bleibt mindestens 24 px rechts von der
   Textspalte des Heros (.heroin, hoechstens 940 px) und rueckt sonst nach rechts.
   Mobil (bis 960 px): Rahmen 300 px -> Box 398,1 px; 70 px rechts, 75 px unten
   ueber den Rand. Unter 360 px kein Motiv. aria-hidden und pointer-events:none
   sind vorhanden.
   ======================================================================= */
.ubhero .water{width:955.5px;height:955.5px;opacity:.1;top:auto;right:auto;transform:none;
  bottom:-297.8px;
  left:max(calc(100% - 637.8px),calc(max(var(--gut),(100% - var(--wrap))/2 + var(--gut)) + min(940px,(min(100%,var(--wrap)) - 2*var(--gut))) + 24px - 117.8px))}
@media (max-width:960px){
  .ubhero .water{width:398.1px;height:398.1px;left:auto;top:auto;right:-119.1px;bottom:-124.1px}
}
@media (max-width:359px){
  .ubhero .water{display:none}
}
/* Messbefund Schritt B: Zwischen 520 und 960 px laege der Rahmen in dieser Lage auf
   mindestens einer W1-Seite hinter der H1 (Grundregel: nie hinter einer Ueberschrift).
   Dort deshalb kein Motiv, einheitlich auf allen W1-Seiten. Zur Entscheidung bei Halt 2. */
@media (min-width:520px) and (max-width:960px){
  .ubhero .water{display:none}
}

/* =======================================================================
   E2-A (03.11.2026) - lokale Arbeitsfassung, NICHT FREIGEGEBEN.
   Nur diese Seite; komponenten.css wird im Body nach dieser Datei geladen.
   Statt der Platzhalter-Kachel mit alter Wortmarke: zwei gleichrangige,
   fotofreie Inhaberkarten (K3 mit Goldkante). Ein gemeinsames Inhaberfoto
   kann spaeter an dieser Stelle die Karten ergaenzen (Austauschpunkt).
   Hero (W1) unveraendert.
   ======================================================================= */
@media (min-width:1024px){
  .ubowner{grid-template-columns:minmax(0,1fr) minmax(0,380px)}
}
.ubinh{display:grid;grid-template-columns:1fr;gap:var(--s4);align-content:start}
.ubinh .vk-k3{min-height:0}
.ubinh .vk-kick{color:var(--red)}
.ubinh .vk-list li{font-size:15px}
/* Barrierefreiheit: Kennzeichnungen der Unternehmensdaten mit ausreichendem Kontrast (axe, vorher n500) */
.ubfacts .k{color:var(--n600)}
.ubinhnote{margin:var(--s2) 0 0;font-size:13.5px;line-height:1.5;color:var(--n600)}
@media (min-width:640px) and (max-width:1023px){
  .ubinh{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ubinhnote{grid-column:1 / -1}
}