/* ============================================================
   Engine-Logo-Bar (.gq-engines) — Port aus „Logo Section v3".
   ⚠ DESIGN EXCEPTION ZONE — do NOT migrate to design-tokens.css.
   Bewusst eigene Tailwind-Lila-Palette (#7C3AED/#A855F7/#EC4899) +
   JetBrains-Mono-Eyebrow, scope-isoliert unter .gq-engines / .hero-llmbar.
   Vanilla, kein React. Modi via data-Attribute (render: shimmer|native,
   mode: wave). Klassen gq-* prefixed gegen Kollisionen.
   ============================================================ */
.hero-llmbar .gq-engines {
  position: relative; width: 100%; max-width: 1280px; margin: 0 auto; padding: 44px 24px 52px;
  --gq-glow: 14px; --gq-glow-a: .22; --gq-speed: 11s; --gq-stagger: .55s;
  --gq-shimmer: linear-gradient(100deg, rgba(255,255,255,.78) 0%, rgba(255,255,255,.78) 30%, #C4B5FD 40%, #A855F7 48%, #EC4899 56%, rgba(255,255,255,.78) 68%, rgba(255,255,255,.78) 100%);
  --gq-sheen: linear-gradient(100deg, transparent 0%, transparent 38%, rgba(168,85,247,.55) 47%, rgba(236,72,153,.55) 55%, transparent 65%, transparent 100%);
}
.gq-hair { position: absolute; left: 0; right: 0; height: 1px; background: linear-gradient(to right, transparent 0%, rgba(255,255,255,.04) 14%, rgba(168,85,247,.28) 50%, rgba(236,72,153,.18) 62%, rgba(255,255,255,.04) 86%, transparent 100%); }
.gq-hair--top { top: 0 } .gq-hair--bot { bottom: 0 }
.gq-engines::before { content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: min(1000px,75%); height: 200px; background: radial-gradient(ellipse at 30% 50%, rgba(124,58,237,.20), transparent 60%), radial-gradient(ellipse at 70% 50%, rgba(236,72,153,.16), transparent 60%); filter: blur(32px); pointer-events: none; }
.gq-eyebrow { text-align: center; font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: rgba(255,255,255,.38); margin: 0 0 40px; position: relative; }
.gq-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-around; gap: 26px 40px; max-width: 1180px; margin: 0 auto; padding: 0 16px; position: relative; }
.gq-logo { display: inline-flex; align-items: center; justify-content: center; position: relative; transition: transform 280ms cubic-bezier(.2,.7,.2,1), filter 280ms cubic-bezier(.2,.7,.2,1); filter: drop-shadow(0 0 var(--gq-glow) rgba(168,85,247,var(--gq-glow-a))); }
.gq-logo:hover { transform: translateY(-3px) scale(1.06); filter: drop-shadow(0 0 18px rgba(168,85,247,0.6)) drop-shadow(0 0 30px rgba(236,72,153,0.32)); }
.gq-mark { display: block; width: var(--w); height: var(--h); }
.gq-engines[data-render="shimmer"] .gq-mark { background-image: var(--gq-shimmer); background-size: 260% 100%; background-position: 0% 50%; -webkit-mask: var(--mask) center/contain no-repeat; mask: var(--mask) center/contain no-repeat; }
.gq-engines[data-render="shimmer"] .gq-mark img { display: none; }
.gq-engines[data-render="native"] .gq-mark { position: relative; }
.gq-engines[data-render="native"] .gq-mark img { display: block; width: 100%; height: 100%; object-fit: contain; }
.gq-engines[data-render="native"] .gq-mark::after { content: ""; position: absolute; inset: 0; background-image: var(--gq-sheen); background-size: 260% 100%; background-position: 0% 50%; -webkit-mask: var(--mask) center/contain no-repeat; mask: var(--mask) center/contain no-repeat; mix-blend-mode: screen; pointer-events: none; }
@keyframes gq-shimmer-wave { 0% { background-position: 260% 50% } 100% { background-position: -160% 50% } }
.gq-engines[data-mode="wave"] .gq-mark, .gq-engines[data-mode="wave"] .gq-mark::after { animation: gq-shimmer-wave var(--gq-speed) cubic-bezier(.55,.05,.45,1) infinite; animation-delay: calc(var(--i) * var(--gq-stagger) * -1); }
@media (max-width: 720px) { .hero-llmbar .gq-engines { padding: 32px 14px 40px } .gq-row { gap: 20px 28px } .gq-eyebrow { margin-bottom: 28px } }
@media (prefers-reduced-motion: reduce) { .gq-engines .gq-mark, .gq-engines .gq-mark::after { animation: none !important; background-position: 50% 50% !important; } }
