/* Schauraum: der komplette 360°-Rundgang (Pano2VR, cdn2.3dwisemedia.com) als Teil der Seite.
   Das iframe wird so beschnitten, dass die fremde Oberfläche (Buttons, schwarze Leiste, Logo)
   außerhalb des Rahmens liegt: rechts 66 px, unten 92 px (gemessen, pixelfest).
   Symmetrisch beschnitten, damit die Bildmitte erhalten bleibt. */
.showroom{
  --ink:#26261f; --muted:#6c685d; --accent:#9d343a; --paper:#f2f0e8;
  --crop-x:66px; --crop-y:92px;
  position:relative; z-index:1; background:var(--paper); color:var(--ink);
  padding:clamp(56px,7vw,110px) clamp(16px,4vw,64px) clamp(56px,7vw,110px);
  font-family:'DM Sans',sans-serif;
}
.showroom-head{max-width:1400px;margin:0 auto clamp(18px,2.4vw,32px);display:flex;align-items:flex-end;justify-content:space-between;gap:24px}
.showroom-head .eyebrow{margin:0 0 12px;color:var(--accent);font-size:10px;font-weight:700;letter-spacing:.16em}
.showroom-head h2{margin:0;font:500 clamp(30px,3.3vw,52px)/1.06 'Manrope',sans-serif;letter-spacing:-.045em}
.showroom-head h2 em{font-style:normal;color:var(--accent)}
.showroom-head>p{margin:0;max-width:330px;font-size:14px;line-height:1.6;color:var(--muted)}

/* Rahmen hält den Platz, die Bühne darin kann sich lösen (Vollbild) */
.showroom-frame{position:relative;max-width:1400px;margin:0 auto;aspect-ratio:16/8.4;min-height:420px}
.showroom-stage{
  position:absolute; inset:0; overflow:hidden; background:#1d1d1a;
  clip-path:inset(calc((1 - var(--reveal,1)) * 9%) calc((1 - var(--reveal,1)) * 7%) round calc(4px + (1 - var(--reveal,1)) * 14px));
  isolation:isolate;
}
.showroom-poster{position:absolute;inset:0;background:#2a2925 center/cover no-repeat;filter:saturate(.9);transform:scale(1.04);transition:opacity .8s ease}
.showroom-crop{position:absolute;inset:calc(var(--crop-y) * -1) calc(var(--crop-x) * -1);opacity:0;transition:opacity .9s ease}
.showroom-stage.is-loaded .showroom-crop{opacity:1}
.showroom-stage.is-loaded .showroom-poster{opacity:0}
.showroom-crop iframe{display:block;width:100%;height:100%;border:0;pointer-events:none}

/* Vorschau-Ebene */
.showroom-shade{position:absolute;inset:0;pointer-events:none;background:
  linear-gradient(90deg,rgba(18,17,14,.78) 0%,rgba(18,17,14,.5) 30%,rgba(18,17,14,.08) 58%,transparent 75%),
  linear-gradient(0deg,rgba(18,17,14,.55),transparent 34%);transition:opacity .5s ease}
.showroom-preview{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;padding:clamp(20px,3vw,44px);color:#f6f3ec;transition:opacity .4s ease}
.showroom-live{align-self:flex-end;display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;background:rgba(20,19,16,.42);backdrop-filter:blur(10px);font-size:10px;font-weight:700;letter-spacing:.14em}
.showroom-live i{width:7px;height:7px;border-radius:50%;background:#e2554f;box-shadow:0 0 0 0 rgba(226,85,79,.6);animation:srPulse 1.8s infinite}
@keyframes srPulse{70%{box-shadow:0 0 0 9px rgba(226,85,79,0)}100%{box-shadow:0 0 0 0 rgba(226,85,79,0)}}
.showroom-copy{max-width:430px}
.showroom-copy .kicker{margin:0 0 12px;font-size:10px;font-weight:700;letter-spacing:.16em;color:#e8c9b8}
.showroom-copy h3{margin:0 0 14px;font:500 clamp(28px,3vw,48px)/1.05 'Manrope',sans-serif;letter-spacing:-.04em}
.showroom-copy p{margin:0 0 24px;font-size:15px;line-height:1.6;color:#d9d4c8}
.showroom-actions{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.showroom-start{display:inline-flex;align-items:center;gap:14px;min-height:50px;padding:0 24px;border-radius:999px;background:var(--accent);color:#fff;font-size:14px;font-weight:700;box-shadow:0 10px 30px rgba(157,52,58,.45);transition:transform .3s,background .3s}
.showroom-start:hover{transform:translateY(-2px);background:#b13b42}
.showroom-start svg{width:20px;height:20px;stroke:#fff;fill:none;stroke-width:1.6}
.showroom-video{font-size:13px;font-weight:600;color:#f1ede4;border-bottom:1px solid rgba(255,255,255,.35);padding-bottom:3px}

/* Stationen */
.showroom-rooms{display:flex;gap:8px;margin:0;padding:0;list-style:none;overflow-x:auto;scrollbar-width:none}
.showroom-rooms::-webkit-scrollbar{display:none}
.showroom-rooms button{display:flex;align-items:center;gap:10px;padding:8px 14px 8px 8px;border-radius:999px;background:rgba(246,243,236,.12);border:1px solid rgba(246,243,236,.22);backdrop-filter:blur(12px);color:#f6f3ec;font-size:12px;font-weight:600;white-space:nowrap;transition:background .3s,border-color .3s,color .3s}
.showroom-rooms button span{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:rgba(246,243,236,.16);font-size:10px;font-weight:700;letter-spacing:.04em}
.showroom-rooms button:hover{background:rgba(246,243,236,.24)}
.showroom-rooms button.active{background:#f6f3ec;color:var(--ink);border-color:#f6f3ec}
.showroom-rooms button.active span{background:var(--accent);color:#fff}

/* Vollbild-Steuerung (nur im Rundgang sichtbar) */
.showroom-ui{position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .35s ease .15s}
.showroom-top,.showroom-bottom{position:absolute;left:0;right:0;display:flex;align-items:center;gap:14px;padding:16px clamp(16px,2.4vw,32px);pointer-events:none}
.showroom-top{top:0;justify-content:space-between;background:linear-gradient(180deg,rgba(18,17,14,.55),transparent)}
.showroom-bottom{bottom:0;background:linear-gradient(0deg,rgba(18,17,14,.6),transparent);padding-bottom:calc(16px + env(safe-area-inset-bottom))}
.showroom-brand{display:flex;align-items:center;gap:12px;color:#f6f3ec;font-size:12px;letter-spacing:.06em}
.showroom-brand img{width:38px;height:38px;object-fit:cover;border-radius:8px}
.showroom-brand b{display:block;font:600 14px/1.2 'Manrope',sans-serif;letter-spacing:-.01em}
.showroom-brand small{display:block;font-size:11px;color:#d0cabd;margin-top:2px}
.showroom-tools{display:flex;align-items:center;gap:10px}
.showroom-pill{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 16px;border-radius:999px;background:rgba(246,243,236,.14);border:1px solid rgba(246,243,236,.25);backdrop-filter:blur(12px);color:#f6f3ec;font-size:12px;font-weight:600}
.showroom-close{width:44px;height:44px;border-radius:50%;background:#f6f3ec;color:var(--ink);font-size:22px;line-height:1;display:grid;place-items:center}
.showroom-bottom .showroom-rooms{flex:1}
.showroom-cta{flex:none;display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 20px;border-radius:999px;background:var(--accent);color:#fff;font-size:13px;font-weight:700}
.showroom-hint{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);padding:12px 18px;border-radius:999px;background:rgba(20,19,16,.55);backdrop-filter:blur(10px);color:#f6f3ec;font-size:12px;letter-spacing:.04em;pointer-events:none;opacity:0;transition:opacity .5s ease;white-space:nowrap}

/* --- Rundgang aktiv --- */
.showroom-stage.is-open{position:fixed;z-index:9000;clip-path:none;border-radius:0}
.showroom-stage.is-open .showroom-crop iframe{pointer-events:auto}
.showroom-stage.is-open .showroom-shade,.showroom-stage.is-open .showroom-preview{opacity:0;pointer-events:none}
.showroom-stage.is-open .showroom-ui{opacity:1}
.showroom-stage.is-open .showroom-top,.showroom-stage.is-open .showroom-bottom,.showroom-stage.is-open .showroom-ui a,.showroom-stage.is-open .showroom-ui button,.showroom-stage.is-open .showroom-ui ul{pointer-events:auto}
.showroom-stage.is-open.show-hint .showroom-hint{opacity:1}
.showroom-stage.is-animating{transition:top .6s cubic-bezier(.7,0,.2,1),left .6s cubic-bezier(.7,0,.2,1),width .6s cubic-bezier(.7,0,.2,1),height .6s cubic-bezier(.7,0,.2,1)}
html.tour-open,html.tour-open body{overflow:hidden}
html.tour-open .dock,html.tour-open .quick-actions,html.tour-open nav.dock,html.tour-open .mobile-bar,html.tour-open [class*=mobilebar]{opacity:0!important;pointer-events:none!important}

@media (max-width:820px){
  .showroom-head{display:block}
  .showroom-head>p{margin-top:10px;font-size:13px}
  .showroom-frame{aspect-ratio:4/5;min-height:0;margin:0 -16px}
  .showroom-stage{clip-path:inset(calc((1 - var(--reveal,1)) * 5%) calc((1 - var(--reveal,1)) * 6%) round calc((1 - var(--reveal,1)) * 14px))}
  .showroom-shade{background:linear-gradient(0deg,rgba(18,17,14,.82) 0%,rgba(18,17,14,.5) 42%,transparent 70%)}
  .showroom-preview{padding:18px 16px 18px}
  .showroom-copy h3{font-size:30px}
  .showroom-copy p{font-size:13px;margin-bottom:18px}
  .showroom-rooms{margin:0 -16px;padding:0 16px}
  .showroom-preview .showroom-rooms{margin-top:16px}
  .showroom-brand small,.showroom-pill .lbl{display:none}
  .showroom-bottom{flex-wrap:wrap}
  .showroom-bottom .showroom-rooms{flex:1 1 100%;order:-1;margin:0 -16px}
  .showroom-cta{width:100%;justify-content:center}
  .showroom-hint{white-space:normal;width:max-content;max-width:78%;text-align:center;border-radius:16px}
}
@media (prefers-reduced-motion:reduce){
  .showroom-stage{clip-path:none}
  .showroom-stage.is-animating{transition:none}
}