:root{ --lime:#8BC53F; --limeSoft: rgba(139,197,63,.14); }

/* ===== Überdachungen WOW (matches ARTLIVE dark/glass system) ===== */

.ueber-hero-media{
  border-radius: var(--radius);
  overflow:hidden;
  border:1px solid rgba(255,255,255,.16);
  box-shadow: 0 30px 90px rgba(0,0,0,.55), inset 0 0 0 1px var(--limeSoft);
  background: rgba(0,0,0,.22);
  position: relative;
  aspect-ratio: 16 / 10;
  width: 100%;
  max-width: 680px;
}

.ueber-hero-media img{
  width:100%;
  height:100%;
  object-fit: cover;
  object-position: center 70%;
  display:block;
  transform: scale(1.03);
  filter: contrast(1.04) saturate(1.06);
}

.ueber-hero-media::after{
  content:"";
  position:absolute; inset:0;
  background:
    radial-gradient(800px 380px at 70% 20%, rgba(139,197,63,.18), rgba(0,0,0,0) 60%),
    linear-gradient(90deg, rgba(0,0,0,.50), rgba(0,0,0,.12));
  pointer-events:none;
}

.hero-glow{
  position:absolute;
  inset:-25%;
  background:
    radial-gradient(closest-side, rgba(139,197,63,.24), rgba(139,197,63,0) 60%),
    radial-gradient(closest-side, rgba(255,255,255,.10), rgba(255,255,255,0) 65%);
  transform: translate(var(--mx,0px), var(--my,0px));
  transition: transform .14s ease;
  pointer-events:none;
  mix-blend-mode: screen;
  filter: blur(14px);
}

.ueber-kpis{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px;}
.ueber-kpis span{
  font-size:12px;padding:8px 10px;border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.18);
  color: rgba(242,245,251,.84);
}

.ueber-band{
  margin-top:14px;
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:14px;
}
.ueber-band .glass{padding:18px;}
@media(max-width:980px){ .ueber-band{grid-template-columns:1fr;} }

/* Prevent "endless tall card" when used inside a split flex/grid */
.wrap.split{align-items:flex-start;}
.glass.card{height:fit-content;}

/* Video card */
.video-frame{
  border-radius:18px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.18);
}
.video-frame video{
  width:100%;
  display:block;
  max-height:520px;
  object-fit:cover;
}

/* Visuals gallery */
.ueber-gallery{padding:16px;}
.ueber-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:14px;}
.ueber-tile{
  grid-column:span 4;
  height:240px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.03);
  overflow:hidden;
  cursor:pointer;
  position:relative;
  padding:0;
  transition:.25s ease;
}
.ueber-tile img{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.03);transition:.35s ease;}
.ueber-tile:hover{
  border-color:rgba(139,197,63,.28);
  box-shadow:0 18px 50px rgba(0,0,0,.45), inset 0 0 0 1px rgba(139,197,63,.12);
  transform:translateY(-1px);
}
.ueber-tile:hover img{transform:scale(1.08);}
.ueber-chip{
  position:absolute;left:12px;bottom:12px;
  padding:6px 10px;border-radius:999px;
  font-size:12px;font-weight:900;
  background:rgba(0,0,0,.45);
  border:1px solid rgba(255,255,255,.12);
  color:#fff;
  backdrop-filter:blur(10px);
}

@media(max-width:1100px){ .ueber-tile{grid-column:span 6;height:220px;} }
@media(max-width:700px){ .ueber-tile{grid-column:span 12;height:220px;} }

/* Lightbox */
.ueber-lightbox{position:fixed;inset:0;display:none;z-index:9999;}
.ueber-lightbox[aria-hidden="false"]{display:block;}
.ueber-lightbox-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.65);}
.ueber-lightbox-card{
  position:relative;max-width:1040px;width:calc(100% - 28px);
  margin:70px auto;padding:14px;border-radius:22px;
}
.ueber-lightbox-img{width:100%;max-height:72vh;object-fit:contain;display:block;border-radius:16px;}
.ueber-lightbox-caption{margin-top:10px;color:rgba(242,245,251,.72);}
.ueber-lightbox-close{
  position:absolute;top:10px;right:12px;width:40px;height:40px;border-radius:999px;
  border:1px solid rgba(255,255,255,.16);background:rgba(0,0,0,.35);
  color:#fff;font-size:22px;cursor:pointer;
}

/* Tech strip */
.tech-strip{
  margin-top:14px;
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap:14px;
}
@media(max-width:980px){ .tech-strip{grid-template-columns:1fr;} }

.tech-figure{
  border-radius:18px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.18);
}
.tech-figure img{width:100%;height:auto;display:block;}
.tech-figure figcaption{padding:12px 14px;color:rgba(242,245,251,.72);}

/* Micro motion */
@media (prefers-reduced-motion:no-preference){
  .ueber-hero-media{animation: ueberFloat 6.5s ease-in-out infinite;}
  @keyframes ueberFloat{
    0%,100%{transform:translateY(0);}
    50%{transform:translateY(-8px);}
  }
}