/* =========================================================
   Hofmann Exclusive – Demo-Leiste für Branchen-Designs
   Wird von allen Seiten in /branchen/ eingebunden.
   Bewusst neutral & isoliert (Präfix .hx-), damit sie
   das jeweilige Branchen-Design nicht beeinflusst.
   ========================================================= */
.hx-bar{
  position:fixed;left:50%;bottom:16px;transform:translateX(-50%);
  z-index:9999;display:flex;align-items:center;gap:6px;
  padding:6px;border-radius:999px;
  background:rgba(14,16,22,.88);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  box-shadow:0 10px 40px rgba(0,0,0,.35),0 0 0 1px rgba(255,255,255,.08) inset;
  font:500 13px/1 "Inter Tight",system-ui,-apple-system,"Segoe UI",sans-serif;color:#f3efe6;
  max-width:calc(100vw - 24px);
}
.hx-bar a,.hx-bar button{
  all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:6px;
  padding:10px 14px;border-radius:999px;white-space:nowrap;color:#f3efe6;
  transition:background .2s,color .2s;
}
.hx-bar a:hover,.hx-bar button:hover{background:rgba(255,255,255,.1)}
.hx-bar a:focus-visible,.hx-bar button:focus-visible{outline:2px solid #d9b26f;outline-offset:2px}
.hx-bar .hx-mono{width:22px;height:22px;border-radius:50%;background:linear-gradient(135deg,#e7c98f,#b8873e);
  color:#14110b;font:700 12px/22px Georgia,serif;text-align:center;display:inline-block}
.hx-seg{display:inline-flex;background:rgba(255,255,255,.08);border-radius:999px;padding:3px}
.hx-seg button{padding:7px 12px}
.hx-seg button[aria-pressed="true"]{background:#f3efe6;color:#14110b}
.hx-bar .hx-cta{background:linear-gradient(135deg,#e7c98f,#c69a52);color:#14110b;font-weight:600}
.hx-bar .hx-cta:hover{background:linear-gradient(135deg,#f0d6a3,#d4a862)}
.hx-label{opacity:.6;padding:0 4px 0 6px}

.hx-drawer{position:fixed;inset:auto 16px 78px auto;z-index:9998;width:min(380px,calc(100vw - 32px));
  max-height:min(70vh,560px);overflow:auto;padding:22px 22px 18px;border-radius:18px;
  background:#101218;color:#ece7dc;box-shadow:0 20px 60px rgba(0,0,0,.45),0 0 0 1px rgba(255,255,255,.07) inset;
  font:400 14px/1.55 "Inter Tight",system-ui,sans-serif;transform:translateY(12px);opacity:0;pointer-events:none;
  transition:opacity .25s,transform .25s}
.hx-drawer.open{opacity:1;transform:none;pointer-events:auto}
.hx-drawer h3{font:600 17px/1.3 "Inter Tight",system-ui,sans-serif;margin:0 0 4px;color:#fff}
.hx-drawer h4{font:600 11px/1 "Inter Tight",system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#d9b26f;margin:18px 0 8px}
.hx-drawer p{margin:0 0 6px;color:#bdb7ab}
.hx-drawer ul{margin:0;padding:0;list-style:none;display:grid;gap:6px}
.hx-drawer li{padding-left:18px;position:relative}
.hx-drawer li::before{content:"";position:absolute;left:2px;top:.62em;width:7px;height:7px;border-radius:50%;background:#d9b26f}
.hx-drawer .hx-tags{display:flex;flex-wrap:wrap;gap:6px}
.hx-drawer .hx-tags span{font-size:12px;padding:4px 9px;border-radius:999px;background:rgba(255,255,255,.07)}
.hx-drawer .hx-close{position:absolute;top:12px;right:12px;all:unset;cursor:pointer;width:30px;height:30px;
  display:grid;place-items:center;border-radius:50%;color:#fff}
.hx-drawer .hx-close:hover{background:rgba(255,255,255,.1)}

/* Globale Absicherung für Smartphones: kein seitliches Scrollen, lange Wörter umbrechen */
html,body{overflow-x:clip}
h1,h2,h3{overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto}

/* Reveal-Animationen (von allen Branchen nutzbar) */
[data-reveal]{opacity:0;transform:translateY(28px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
[data-reveal="left"]{transform:translateX(-40px)}
[data-reveal="right"]{transform:translateX(40px)}
[data-reveal="zoom"]{transform:scale(.94)}
[data-reveal].is-in{opacity:1;transform:none}
.img-fallback{background:linear-gradient(135deg,#9aa0a8,#5b6068)!important}

@media (max-width:640px){
  .hx-bar{bottom:10px;gap:2px;padding:4px}
  .hx-bar a,.hx-bar button{padding:9px 10px}
  .hx-bar .hx-hide-sm{display:none}
  .hx-drawer{inset:auto 12px 68px 12px;width:auto}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001s!important;animation-iteration-count:1!important;transition-duration:.001s!important;scroll-behavior:auto!important}
  [data-reveal]{opacity:1;transform:none}
}
