/* QR Studio – Seite Möglichkeiten */
.mg-defs{position:absolute;width:0;height:0;overflow:hidden}
.mg-hero{padding-block:clamp(48px,8vw,96px) 12px}
.mg-hero h1{max-width:16ch}
.mg-lead{color:var(--muted);max-width:62ch;font-size:1.08rem;line-height:1.6}
.mg-feature-grid{display:grid;gap:clamp(28px,5vw,64px);grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center}
@media (max-width:860px){.mg-feature-grid{grid-template-columns:1fr}}
.mg-feature-grid>*{min-width:0}
.mg-feature{overflow-x:clip}
.mg-logo{position:absolute;left:20px;top:20px;display:flex;align-items:center;gap:10px}
.mg-logo b{width:34px;height:34px;border-radius:9px;background:linear-gradient(135deg,var(--gold-hi),var(--gold-lo))}
.mg-logo i{width:70px;height:9px;border-radius:5px;background:rgba(255,255,255,.55)}
.mg-qr{position:absolute;right:16px;top:50%;translate:0 -50%;width:36%;aspect-ratio:1;background:#fff;border-radius:8px;padding:7px;color:#111}
.mg-qr svg{display:block;width:100%;height:100%}
.mg-scan{position:absolute;left:20px;bottom:18px;max-width:45%;font-size:.68rem;line-height:1.3;color:var(--gold-hi);letter-spacing:.02em}
.mg-back-title{font-family:var(--font-display);font-size:1rem;margin-bottom:2px}
.mg-field{display:flex;align-items:flex-end;gap:8px;font-size:.62rem;text-transform:uppercase;letter-spacing:.08em;color:#7a7264}
.mg-field em{font-style:normal;white-space:nowrap}
.mg-field i{flex:1;border-bottom:1px solid #cfc7b8;height:1px}
.mg-points{list-style:none;margin:20px 0 0;padding:0;display:grid;gap:12px}
.mg-points li{position:relative;padding-left:30px;color:var(--muted);line-height:1.55}
.mg-points li::before{content:"✓";position:absolute;left:0;top:0;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;font-size:.72rem;font-weight:700;color:#111;background:var(--gold)}
.mg-points strong{color:var(--text)}
.mg-grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}
.mg-idea{padding:18px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);transition:border-color .2s,transform .2s}
.mg-idea:hover{border-color:var(--gold);transform:translateY(-2px)}
.mg-pic{border-radius:14px;padding:6px 4px;background:radial-gradient(90% 80% at 30% 0%,rgba(201,169,107,.2),transparent 60%),radial-gradient(80% 70% at 100% 100%,rgba(90,110,160,.16),transparent 60%),linear-gradient(160deg,#1c1b22,#121117);border:1px solid rgba(255,255,255,.06);margin-bottom:14px;overflow:hidden}
.mg-pic svg{display:block;width:100%;height:auto}
.mg-pic svg{overflow:visible}
.g-glass{fill:url(#mg-glass-grad);stroke:rgba(255,255,255,.2);stroke-width:1.2}
.g-glass2{fill:rgba(255,255,255,.07);stroke:rgba(255,255,255,.14);stroke-width:1}
.g-line{fill:none;stroke:rgba(255,255,255,.42);stroke-width:2.6;stroke-linecap:round}
.g-faint{stroke:rgba(255,255,255,.2)}
.g-goldfill{fill:url(#mg-gold-grad)}
.g-qrbg{fill:#fff;filter:drop-shadow(0 4px 10px rgba(0,0,0,.45))}
.g-qr{color:#16151b}
.g-chip rect{fill:rgba(18,17,22,.92);stroke:rgba(255,255,255,.18);stroke-width:1}
.g-chip text{font:600 7.6px/1 var(--font-body);fill:#ece8df;letter-spacing:.02em}
.g-chip-gold rect{stroke:var(--gold)}
.g-chip-gold text{fill:var(--gold-hi)}
.g-chip-ok rect{stroke:var(--ok)}
.g-chip-ok text{fill:var(--ok)}
.g-phone>rect:first-child{fill:#0d0d11;stroke:rgba(255,255,255,.3);stroke-width:1.2}
.g-screen{fill:rgba(201,169,107,.12)}
.g-beam{stroke:var(--gold);stroke-width:2;stroke-linecap:round;filter:drop-shadow(0 0 4px var(--gold));animation:mg-beam 2.4s ease-in-out infinite}
.g-wheel{fill:#101015;stroke:rgba(255,255,255,.28);stroke-width:2}
.g-hub{fill:url(#mg-gold-grad)}
.g-sign{fill:none;stroke:var(--gold-hi);stroke-width:1.8;stroke-linecap:round}
.g-stars{font-size:11px;letter-spacing:1px;fill:var(--gold)}
.g-post{stroke:rgba(255,255,255,.3);stroke-width:5;stroke-linecap:round}
.g-lanyard{fill:none;stroke:url(#mg-gold-grad);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.g-avatar{fill:rgba(255,255,255,.14);stroke:rgba(255,255,255,.25)}
.g-open{fill:rgba(127,197,155,.18);stroke:var(--ok);stroke-width:1}
.g-open-t{font:700 6.4px/1 var(--font-body);fill:var(--ok);letter-spacing:.12em}
.g-dot{fill:rgba(255,255,255,.22)}
.mg-pic .g-chip{transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.mg-idea:hover .g-chip{transform:translateY(-3px)}
@keyframes mg-beam{0%,100%{transform:translateY(-14px);opacity:.2}50%{transform:translateY(14px);opacity:1}}
@media (prefers-reduced-motion:reduce){.g-beam{animation:none}}
.mg-who{margin:0 0 4px;font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--gold)}
.mg-idea h3{margin:0 0 6px;font-size:1.1rem}
.mg-idea p{margin:0;color:var(--muted);line-height:1.55;font-size:.95rem}
.mg-steps{list-style:none;margin:0;padding:0;counter-reset:mg;display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.mg-steps li{counter-increment:mg;position:relative;padding:22px 20px 20px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface)}
.mg-steps li::before{content:counter(mg);display:grid;place-items:center;width:32px;height:32px;margin-bottom:12px;border-radius:50%;font-weight:700;color:#111;background:var(--gold)}
.mg-steps h3{margin:0 0 6px;font-size:1.05rem}
.mg-steps p{margin:0;color:var(--muted);line-height:1.55}
.mg-cta{text-align:center}
.mg-cta p{color:var(--muted)}
.mg-cta-row{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:16px}
@media (max-width:520px){.mg-cards{min-height:300px}}
@media (prefers-reduced-motion:reduce){.mg-card,.mg-idea{transition:none}}
.mg-idea .mg-who{color:var(--gold)}

/* Teamkarte: dreht sich in Dauerschleife */
.mg-cards{position:relative;min-height:380px;display:grid;place-items:center;perspective:1200px}
.mg-flip{position:relative;width:min(340px,80vw);aspect-ratio:85/55;transform-style:preserve-3d;animation:mg-flip 9s cubic-bezier(.65,0,.35,1) infinite}
.mg-card{position:absolute;inset:0;border-radius:14px;overflow:hidden;backface-visibility:hidden;-webkit-backface-visibility:hidden;box-shadow:0 30px 60px -28px rgba(0,0,0,.85)}
.mg-card-front{background:linear-gradient(140deg,#1d1a14,#0f0e0b);border:1px solid var(--line-strong)}
.mg-card-front::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.09) 45%,transparent 60%);transform:translateX(-60%);animation:mg-sheen 9s ease-in-out infinite;pointer-events:none}
.mg-card-back{transform:rotateY(180deg);background:#f6f3ec;color:#2a2620;padding:18px 22px;display:flex;flex-direction:column;justify-content:center;gap:10px}
.mg-shadow{position:absolute;bottom:22px;width:58%;height:24px;border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.65),transparent);filter:blur(4px);animation:mg-shadow 9s cubic-bezier(.65,0,.35,1) infinite}
@keyframes mg-flip{0%,38%{transform:rotateX(10deg) rotateY(-16deg)}50%,88%{transform:rotateX(10deg) rotateY(164deg)}100%{transform:rotateX(10deg) rotateY(344deg)}}
@keyframes mg-shadow{0%,38%,50%,88%,100%{transform:scaleX(1);opacity:1}44%,94%{transform:scaleX(.35);opacity:.5}}
@keyframes mg-sheen{0%,10%{transform:translateX(-60%)}30%,100%{transform:translateX(60%)}}
@media (prefers-reduced-motion:reduce){.mg-flip,.mg-shadow,.mg-card-front::after{animation:none}.mg-flip{transform:rotateX(8deg) rotateY(-12deg)}}