/* Dropprinters · Hub-Prototyp (v4/v5): nur Hub-Eigenes. Bühne, Fenster, Leiste, gemeinsame Bausteine der Szenen und
   390-Regeln stehen in stage-core.css (vorher geladen); Szenen 3 und 4 in stage-b.css.
   Hier: hm-Abschnitte auf der Bühne, Fensterhöhen des Hubs, .pt-shirt, Konfigurator-Tafel (.pt-panel) und Druckbalken (.pt-bar). */

/* ---------- Abschnitte auf der Bühne ---------- */
.hm-brands,.hm-about,.hm-cs,.hm-cta{margin-top:0}
/* helle Abschnitte: deckende Karten, rund an vier Ecken, leicht eingerückt */
.hm-brands,.hm-cs{margin-inline:clamp(8px,1.2vw,18px);border-radius:var(--sheet-r);
  box-shadow:0 1px 0 #fff inset,0 40px 100px -50px rgba(48,32,110,.28),0 0 0 1px rgba(10,10,12,.05)}
/* durchsichtige Abschnitte (v7 hell, Schrift über Tokens dunkel): das Licht kommt von der Pastell-Bühne */
.hm-hero,.hm-about,.hm-cta{background:transparent;box-shadow:none;border-radius:0}
.hm-hero>.aurora,.hm-about>.aurora,.hm-cta>.aurora{display:none}
.footer{z-index:1}

/* ---------- Fensterhöhen des Hubs (Vorgabe in stage-core.css: 160svh) ---------- */
.pt-on .pt-gate[data-gate="1"]{height:180svh}
.pt-on .pt-gate[data-gate="2"]{height:190svh}
.pt-on .pt-gate[data-gate="3"],.pt-on .pt-gate[data-gate="4"]{height:160svh}

/* Shirt zweilagig: unten unbedruckt, darüber bedruckt, print(r) gibt den Druck von oben frei (Station 2, wieder in Station 3); Schatten aus stage-core.css */
.pt-shirt{position:absolute;left:0;top:0;width:var(--w,300px);aspect-ratio:736/932;will-change:transform,opacity}
.pt-shirt__img,.pt-shirt__print{position:absolute;inset:0;width:100%;height:100%;display:block}
.pt-shirt__print{clip-path:inset(0 0 100% 0)}
.pt-shirt.is-printed .pt-shirt__print{clip-path:inset(0 0 0 0)}

/* ---------- Szene 1 · Konfigurieren ---------- */
.pt-panel{position:absolute;left:0;top:0;width:clamp(260px,22vw,320px);padding:20px;display:grid;gap:16px;border-radius:var(--r-xl);
  color:var(--ink-0);background:linear-gradient(135deg,var(--smoke-bg-strong),var(--smoke-bg));
  border:1px solid var(--smoke-border);box-shadow:var(--smoke-shadow);
  -webkit-backdrop-filter:blur(22px) saturate(160%);backdrop-filter:blur(22px) saturate(160%)}
.pt-panel__top{display:flex;align-items:center;justify-content:space-between;font:600 12px/1 var(--font-body);letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-2)}
.pt-panel__top i{width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 10px 2px rgba(34,211,238,.6)}
.pt-panel__row{display:grid;gap:8px}
.pt-panel__label{font:500 12px/1 var(--font-body);color:var(--ink-2)}
.pt-panel__name{position:relative;height:34px;overflow:hidden}
.pt-panel__name span{position:absolute;left:0;top:0;font:700 28px/34px var(--font-display);letter-spacing:-.02em;opacity:0}
.pt-panel__chips{display:flex;gap:6px}
.pt-panel__chips span{flex:1;height:32px;display:grid;place-items:center;border-radius:10px;font:600 13px/1 var(--font-body);
  color:var(--ink-1);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12)}
.pt-panel__chips span.is-on{color:#0A0A0C;background:#fff;border-color:#fff}
.pt-panel__file{display:flex;align-items:center;gap:10px;height:40px;padding:0 12px;border-radius:12px;
  background:rgba(255,255,255,.06);border:1px dashed rgba(255,255,255,.22);font:500 13px/1 var(--font-body);color:var(--ink-1)}
.pt-panel__file svg{width:26px;height:21px;flex:none}
.pt-panel__qty{display:flex;align-items:center;gap:12px}
.pt-panel__track{position:relative;flex:1;height:6px;border-radius:3px;background:rgba(255,255,255,.12);overflow:hidden}
.pt-panel__track i{position:absolute;inset:0;border-radius:inherit;background:linear-gradient(90deg,#22D3EE,#7C3AED,#F472B6);
  transform-origin:0 50%;transform:scaleX(.08)}
.pt-panel__qty b{font:800 italic 22px/1 var(--font-accent);font-variant-numeric:tabular-nums;min-width:3ch;text-align:right}

/* ---------- Szene 2 · Drucken ---------- */
.pt-bar{position:absolute;left:0;top:0;width:var(--bw,46vw);will-change:transform,opacity}
.pt-bar img{display:block;width:100%;height:auto;position:relative;z-index:1}
.pt-bar__beam{position:absolute;left:4%;right:4%;top:72%;height:3px;border-radius:2px;
  background:linear-gradient(90deg,transparent,#06B6D4 18%,#7C3AED 50%,#F472B6 82%,transparent);
  box-shadow:0 0 18px 4px rgba(124,58,237,.55),0 0 46px 10px rgba(34,211,238,.25)}

/* ---------- 390 px ---------- */
@media (max-width:760px){
  .pt-panel{width:auto;padding:10px 12px;gap:0;grid-auto-flow:column;align-items:center;border-radius:var(--r-pill)}
  .pt-panel__top,.pt-panel__label,.pt-panel__row--file,.pt-panel__row--qty{display:none}
  .pt-panel__row{gap:0}
  .pt-panel__row--name{padding-right:10px;margin-right:10px;border-right:1px solid rgba(255,255,255,.16)}
  .pt-panel__name{height:28px;width:5.4em}
  .pt-panel__name span{font-size:20px;line-height:28px}
  .pt-panel__chips span{width:34px;height:28px;flex:none;border-radius:999px;font-size:12px}
}

@media (prefers-reduced-transparency:reduce){
  .pt-panel{background:#1D1D2A}
}
