/* =====================================================================
   Dropprinters Plattform · Seite /plattform/ (v1)
   Seitenspezifisches zu den gemeinsamen Story-Bausteinen aus styles/solutions.css.
   Nur Klassen mit Präfix sol-plt-. Basisklassen (.glass, .btn, .nav, .stage, .light) bleiben unberührt.
   Aufbau:
     1  Hero und Story-Gerät (Fenster mit Pfad, Karte, Detailansichten)
     2  Kein Lager (hell)
     3  Kanäle (dunkel): Hub
     4  Aufgabenteilung (hell)
     5  Überblick (dunkel): Konsole
     6  Responsive, reduzierte Bewegung, ohne JavaScript
   Bewegung: nur transform und opacity. Zustände hängen am data-step des Geräts, damit die Seite
   auch ohne Skript einen sinnvollen Ruhezustand zeigt (Schritt 0: Bestellliste).
   ===================================================================== */

/* ---------- Seitenrhythmus: etwas kompaktere Abschnitte, Kapitel dichter gesetzt (nur Desktop) ---------- */
.sol-plt-lager,.sol-plt-kanaele,.sol-plt-split,.sol-plt-ueber,.sol-plt-who{padding-block:clamp(80px,9vw,128px)}
@media (min-width:961px){
  .sol-plt .sol-story__intro{min-height:56svh}
  .sol-plt .sol-chapters{gap:44svh;padding-block:12svh 58svh}
}

/* ---------- Kleine Helfer ---------------------------------------------- */
.sol-plt-crumb{color:var(--ink-2);font-weight:500}
.sol-plt-crumb::before{content:"/";margin:0 8px 0 4px;opacity:.6}

/* Status-Varianten zusätzlich zu den vier Stufen des Moduls:
   Verkauft (ruhig, mit Punkt) und Eingegangen (helles Grau). Die Stufen In Produktion und Versendet kommen aus solutions.css;
   die Kette endet bei Versendet, die Regel für data-s="done" bleibt ungenutzt. */
.sol-status[data-s="sold"]::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.7}
.sol-status[data-s="in"]{color:var(--ink-0);background:rgba(255,255,255,.14);box-shadow:inset 0 0 0 1px rgba(255,255,255,.18)}
.sol-status[data-s="done"]::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.sol-status.is-flip{animation:sol-plt-flip 360ms var(--ease-out)}
@keyframes sol-plt-flip{from{opacity:0;transform:translate3d(0,6px,0)}to{opacity:1;transform:none}}

/* =====================================================================
   1 · Hero und Story-Gerät
   ===================================================================== */
.sol-plt .sol-intro__title{font-size:clamp(36px,3.85vw,55px)}
.sol-plt .sol-intro__lead{max-width:34ch}

.sol-plt-dev{--cw:236px;--ch:64px;--zone:196px;--panel-top:76px;--row-h:60px;max-width:620px}
.sol-plt-dev .sol-device__glow{inset:-16% -10%}
.sol-plt-win .sol-win__bar{padding:10px 18px}
.sol-plt-win .sol-win__title b{font-size:14px}

/* Kanal-Tags */
.sol-plt-chan{display:flex;flex-wrap:wrap;gap:8px;padding:14px 18px 4px}
.sol-plt-chan__t{transition:background-color 420ms var(--ease-glass),color 420ms var(--ease-glass),box-shadow 420ms var(--ease-glass),opacity 420ms var(--ease-glass)}
.sol-plt-dev[data-step="1"] .sol-plt-chan__t:not([data-ch="etsy"]){opacity:.42}
.sol-plt-dev[data-step="1"] .sol-plt-chan__t[data-ch="etsy"]{color:var(--on-solid);background:var(--solid);box-shadow:0 8px 22px -8px rgba(255,255,255,.5)}
.sol-plt-dev[data-step="1"] .sol-plt-chan__t[data-ch="etsy"] .sol-icon{color:var(--on-solid)}
.sol-plt-dev[data-step="2"] .sol-plt-chan__t[data-ch="etsy"]{box-shadow:inset 0 0 0 1px rgba(34,211,238,.6),0 0 22px -4px rgba(34,211,238,.45)}

/* Pfad mit fünf Stationen */
.sol-plt-body{padding:8px 18px 14px}
.sol-plt-track{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr))}
.sol-plt-track__line{position:absolute;left:10%;right:10%;top:21px;height:2px;border-radius:2px;background:rgba(255,255,255,.12);overflow:hidden}
.sol-plt-track__line i{position:absolute;inset:0;transform-origin:left;transform:scaleX(var(--k,0));background:linear-gradient(90deg,var(--accent-3),var(--accent))}
.sol-plt-st{position:relative;z-index:1;display:grid;justify-items:center;gap:8px;min-width:0}
.sol-plt-st__node{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;color:var(--ink-2);
  background:var(--bg-2);border:1px solid rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.12);
  transition:background-color 420ms var(--ease-glass),color 420ms var(--ease-glass),border-color 420ms var(--ease-glass),box-shadow 520ms var(--ease-glass)}
.sol-plt-st__mono{fill:currentColor}
.sol-plt-st__label{font:600 12.5px/1.2 var(--font-body);letter-spacing:.005em;color:var(--ink-2);white-space:nowrap;transition:color 420ms var(--ease-glass)}
.sol-plt-st.is-passed .sol-plt-st__node{color:var(--accent-ink);border-color:rgba(34,211,238,.45);background:color-mix(in srgb,var(--accent) 14%,var(--bg-2))}
.sol-plt-st.is-passed .sol-plt-st__label{color:var(--ink-1)}
.sol-plt-st.is-current .sol-plt-st__node{color:var(--on-solid);background:var(--solid);border-color:var(--solid);
  box-shadow:0 0 0 6px rgba(34,211,238,.14),0 12px 30px -8px rgba(34,211,238,.6)}
.sol-plt-st.is-current .sol-plt-st__label{color:var(--ink-0)}
.sol-plt-dev[data-step="5"] .sol-plt-st.is-current .sol-plt-st__node{box-shadow:0 0 0 6px rgba(52,211,153,.16),0 12px 34px -6px rgba(52,211,153,.7)}

/* Zone: Bestellliste (Schritt 0), Reisekarte und Detailansichten (Schritte 1 bis 5) */
.sol-plt-zone{position:relative;height:var(--zone);margin-top:14px}
.sol-plt-list{position:absolute;inset:0;display:grid;grid-auto-rows:var(--row-h);gap:8px;padding:0;margin:0;list-style:none;
  transition:opacity 420ms var(--ease-out)}
.sol-plt-dev[data-step]:not([data-step="0"]) .sol-plt-list{opacity:0}
.sol-plt-row{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;
  padding:0 14px 0 8px;border-radius:16px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08)}
.sol-plt-row .sol-thumb{width:44px;border-radius:12px}
.sol-plt-row__what{display:flex;flex-direction:column;gap:3px;min-width:0}
.sol-plt-row__what b{font:600 14px/1.15 var(--font-display);letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sol-plt-row__what small{font-size:12.5px;line-height:1.2;color:var(--ink-2)}
.sol-plt-row--mine{grid-template-columns:auto minmax(0,1fr) auto auto;
  background:linear-gradient(90deg,rgba(34,211,238,.12),rgba(255,255,255,.05) 70%);border-color:rgba(34,211,238,.4);
  box-shadow:0 0 0 4px rgba(34,211,238,.06),0 18px 40px -24px rgba(34,211,238,.7)}
.sol-plt-row__mark{display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:var(--r-pill);white-space:nowrap;
  font:600 12px/1 var(--font-body);color:var(--accent-ink);background:rgba(34,211,238,.1);border:1px solid rgba(34,211,238,.34)}
.sol-plt-row__sheen{position:absolute;inset:0;border-radius:inherit;overflow:hidden;pointer-events:none}
.sol-plt-row__sheen::after{content:"";position:absolute;inset:0;opacity:0;transform:translate3d(-120%,0,0);
  background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.2) 50%,transparent 65%)}
.sol-plt-row--mine.is-glint .sol-plt-row__sheen::after{animation:sol-plt-glint 1.4s var(--ease-out) both}
@keyframes sol-plt-glint{0%{opacity:0;transform:translate3d(-120%,0,0)}15%{opacity:1}100%{opacity:0;transform:translate3d(120%,0,0)}}

/* Reisekarte: Skript setzt translate (Karte) und translate (Zeiger) */
.sol-plt-card{position:absolute;left:0;top:0;width:100%;height:var(--ch);opacity:0;pointer-events:none;transition:opacity 420ms var(--ease-out)}
.sol-plt-dev[data-step]:not([data-step="0"]) .sol-plt-card{opacity:1}
.sol-plt-card__move{position:absolute;left:0;top:0;width:var(--cw);will-change:transform}
.sol-plt-card__in{display:flex;align-items:center;gap:10px;height:var(--ch);padding:7px 12px 7px 8px;border-radius:16px;
  background:linear-gradient(135deg,rgba(255,255,255,.17),rgba(255,255,255,.07));border:1px solid rgba(255,255,255,.22);
  box-shadow:0 20px 38px -18px rgba(0,0,0,.75),0 0 0 4px rgba(34,211,238,.08),inset 0 1px 0 rgba(255,255,255,.3)}
.sol-plt-card .sol-thumb{width:48px;flex:none;border-radius:12px}
.sol-plt-card__txt{display:flex;flex-direction:column;gap:6px;min-width:0}
.sol-plt-card__txt b{font:600 14px/1.1 var(--font-display);letter-spacing:-.01em;white-space:nowrap}
.sol-plt-card__chips{display:flex;align-items:center;gap:6px}
.sol-plt-card__caret{position:absolute;left:0;top:-5px;z-index:1;width:10px;height:10px;background:#252838;
  border-left:1px solid rgba(255,255,255,.22);border-top:1px solid rgba(255,255,255,.22);transform:translate3d(20px,0,0) rotate(45deg)}

/* Detailansichten */
.sol-plt-panels{position:absolute;left:0;right:0;top:var(--panel-top);bottom:0}
.sol-plt-panel{position:absolute;inset:0;display:grid;align-content:center;gap:8px;padding:10px 16px;border-radius:18px;
  background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.09);box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
  opacity:0;transform:translate3d(0,10px,0);pointer-events:none;
  transition:opacity 360ms var(--ease-out),transform 560ms var(--ease-out)}
.sol-plt-dev[data-step="1"] .sol-plt-panel--1,
.sol-plt-dev[data-step="2"] .sol-plt-panel--2,
.sol-plt-dev[data-step="3"] .sol-plt-panel--3,
.sol-plt-dev[data-step="4"] .sol-plt-panel--4,
.sol-plt-dev[data-step="5"] .sol-plt-panel--5{opacity:1;transform:none}
.sol-plt-panel__t{font:600 12.5px/1 var(--font-body);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2)}
.sol-plt-panel__line{font:600 14px/1.25 var(--font-display);letter-spacing:-.01em}
.sol-plt-panel__sub{font-size:12.5px;line-height:1.3;color:var(--ink-1)}

/* 1 · Im Kanal */
.sol-plt-panel--1{align-content:center;gap:12px}
.sol-plt-panel__badge{position:absolute;top:10px;right:14px;display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 11px 0 8px;border-radius:var(--r-pill);
  font:600 12px/1 var(--font-body);color:var(--ink-0);background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.sol-plt-panel__badge .sol-icon{width:16px;height:16px;color:var(--accent-ink)}
.sol-plt-kv{display:grid;grid-template-columns:1fr 1fr;gap:8px 14px;margin:0}
.sol-plt-kv > div{display:flex;align-items:baseline;gap:10px;min-width:0}
.sol-plt-kv dt{flex:none;min-width:70px;font-size:12.5px;color:var(--ink-2)}
.sol-plt-kv dd{margin:0;font:600 14px/1.2 var(--font-display);letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sol-plt-kv__wide{grid-column:1 / -1}

/* 2 · Auf der Plattform: Protokollzeilen */
.sol-plt-log{display:grid;gap:7px;padding:0;margin:0;list-style:none}
.sol-plt-log li{display:flex;align-items:center;gap:9px;font:500 13.5px/1.2 var(--font-body);color:var(--ink-0);
  transition:opacity 380ms var(--ease-out),transform 520ms var(--ease-out)}
.sol-plt-log li.is-off{opacity:0;transform:translate3d(0,6px,0)}
.sol-plt-log .sol-icon{width:17px;height:17px;flex:none;color:var(--accent-ink)}

/* 3 · In der Produktion: Hoodie mit Druckmotiv, Balken folgt --q */
.sol-plt-panel--3{grid-template-columns:auto minmax(0,1fr);gap:16px;align-items:center}
.sol-plt-panel__art{width:84px;border-radius:14px}
.sol-plt-panel__art svg{width:88%;height:88%}
.sol-plt-panel__col{display:grid;gap:7px;min-width:0}
.sol-plt-bar{display:block;height:6px;border-radius:6px;background:rgba(255,255,255,.1);overflow:hidden}
.sol-plt-bar i{display:block;height:100%;border-radius:inherit;transform-origin:left;transform:scaleX(var(--q,1));
  background:linear-gradient(90deg,var(--accent-3),var(--accent))}
.sol-plt-sw{grid-area:1 / 1;transition:opacity 300ms var(--ease-out)}
.sol-plt-panel__col .sol-plt-panel__sub{display:grid}
.sol-plt-sw--b{opacity:0;color:#6EE7B7}
.sol-plt-panel--3.is-done .sol-plt-sw--a{opacity:0}
.sol-plt-panel--3.is-done .sol-plt-sw--b{opacity:1}

/* 4 · Versand: Paketschein und Weg */
.sol-plt-panel--4{gap:8px}
.sol-plt-label{display:flex;align-items:center;gap:12px}
.sol-plt-label__ico{display:grid;place-items:center;width:38px;height:38px;flex:none;border-radius:12px;color:var(--ink-dark-0);background:var(--light-1)}
.sol-plt-label__ico .sol-icon{width:22px;height:22px}
.sol-plt-label__txt{display:flex;flex-direction:column;gap:2px;margin-right:auto}
.sol-plt-label__txt small{font-size:12px;color:var(--ink-2)}
.sol-plt-label__txt b{font:600 16px/1.1 var(--font-accent);font-style:italic;font-weight:800;letter-spacing:.04em;font-variant-numeric:tabular-nums}
.sol-plt-route{display:flex;align-items:center;gap:10px}
.sol-plt-route__end{display:grid;place-items:center;width:26px;height:26px;flex:none;color:var(--ink-1)}
.sol-plt-route__end .sol-icon{width:20px;height:20px}
.sol-plt-route__end svg{fill:currentColor}
.sol-plt-route__rail{position:relative;flex:1;height:28px;container-type:inline-size}
.sol-plt-route__rail::before{content:"";position:absolute;left:0;right:0;top:13px;height:2px;border-radius:2px;background:rgba(255,255,255,.14)}
.sol-plt-route__fill{position:absolute;left:0;right:0;top:13px;height:2px;border-radius:2px;transform-origin:left;transform:scaleX(var(--tr,1));
  background:linear-gradient(90deg,var(--accent-3),var(--accent))}
.sol-plt-route__truck{position:absolute;left:0;top:0;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;
  color:var(--on-solid);background:var(--solid);box-shadow:0 8px 20px -6px rgba(34,211,238,.6);transform:translate3d(calc(var(--tr,1) * (100cqw - 28px)),0,0)}
.sol-plt-route__truck .sol-icon{width:17px;height:17px}

/* 5 · Statusverlauf */
.sol-plt-panel--5{gap:12px}
.sol-plt-hist{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding:0;margin:0;list-style:none}
.sol-plt-hist::before,.sol-plt-hist::after{content:"";position:absolute;left:12.5%;right:12.5%;top:6px;height:2px;border-radius:2px;background:rgba(255,255,255,.12)}
.sol-plt-hist::after{transform-origin:left;transform:scaleX(var(--k,1));background:linear-gradient(90deg,var(--accent-3),var(--accent))}
.sol-plt-hist li{position:relative;z-index:1;display:grid;justify-items:center;gap:8px;font:600 12px/1.2 var(--font-body);color:var(--ink-2);text-align:center;
  transition:color 360ms var(--ease-out)}
.sol-plt-hist li i{width:14px;height:14px;border-radius:50%;background:var(--bg-2);border:2px solid rgba(255,255,255,.22);
  transition:background-color 360ms var(--ease-out),border-color 360ms var(--ease-out),box-shadow 420ms var(--ease-out)}
.sol-plt-hist li.is-on{color:var(--ink-0)}
.sol-plt-hist li.is-on i{background:var(--accent);border-color:var(--accent)}
.sol-plt-hist li.is-on.sol-plt-hist__last i{background:#34D399;border-color:#34D399;box-shadow:0 0 0 5px rgba(52,211,153,.18),0 0 18px rgba(52,211,153,.6)}
.sol-plt-hist li.is-on.sol-plt-hist__last{color:#6EE7B7}

/* Fuß: Zähler */
.sol-plt-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 18px 12px;border-top:1px solid rgba(255,255,255,.07)}
.sol-plt-stock{display:inline-flex;align-items:center;gap:10px;font:500 13.5px/1.2 var(--font-body);color:var(--ink-1)}
.sol-plt-stock .sol-icon{width:22px;height:22px;color:var(--accent-ink)}
.sol-plt-stock b{font:800 italic 32px/.9 var(--font-accent);letter-spacing:-.005em;color:var(--ink-0)}
.sol-plt-foot__note{font-size:12.5px;color:var(--ink-2)}

/* Schwebende Chips (Schritt 2 und 5) */
.sol-plt-float--in,.sol-plt-float--ok{right:-30px;top:-54px}
.sol-plt-float:not(.is-on){-webkit-backdrop-filter:none;backdrop-filter:none}

/* =====================================================================
   2 · Kein Lager (hell)
   ===================================================================== */
.sol-plt-lager__grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:18px;align-items:stretch}
.sol-plt-lager .sol-count{min-height:480px}
.sol-plt-lager__num{margin-top:auto}
.sol-plt-shelf{position:absolute;top:clamp(26px,3vw,40px);right:clamp(26px,3vw,40px);display:grid;grid-template-columns:repeat(3,46px);gap:8px}
.sol-plt-shelf i{height:38px;border-radius:10px;border:1.5px dashed color-mix(in srgb,var(--ink-0) 42%,transparent)}   /* leeres Regal auf der hellen Zählkachel (v8) */
.sol-plt-shelf i:nth-child(n+4){opacity:.7}
.sol-plt-shelf i:nth-child(n+7){opacity:.4}
.sol-plt-ship{justify-content:space-between;--label-w:clamp(150px,19vw,236px)}
.sol-plt-ship .sol-ship__rows{gap:26px}
.sol-plt-ship .sol-ship__track{height:68px}
.sol-plt-ship .sol-ship__seg{top:12px;bottom:12px}
.sol-plt-ship .sol-ship__seg span{font-size:13.5px;padding-inline:16px}
.sol-plt-ship .sol-ship__label b{font-size:clamp(26px,2.4vw,34px)}
.sol-plt-ship .sol-ship__label small{font-size:14px}

/* =====================================================================
   3 · Kanäle (dunkel): Hub
   ===================================================================== */
.sol-plt-hub{max-width:1080px;margin-inline:auto;border-radius:34px}
.sol-plt-hub__bar{padding:16px 24px;border-bottom:1px solid rgba(255,255,255,.08)}
.sol-plt-hub__grid{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 190px minmax(0,1.5fr);align-items:center;column-gap:clamp(28px,5vw,80px);
  padding:clamp(24px,3.4vw,44px) clamp(20px,3.4vw,44px)}
.sol-plt-hub__hint{font:600 12.5px/1 var(--font-body);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2);margin-bottom:2px}
.sol-plt-hub__chan{position:relative;z-index:2;display:grid;gap:12px;align-content:center}
.sol-plt-ch{position:relative;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:58px;padding:0 20px;border-radius:20px;text-align:left;
  font:600 17px/1.1 var(--font-display);letter-spacing:-.01em;color:var(--ink-0);
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.12);
  transition:background-color 300ms var(--ease-glass),color 300ms var(--ease-glass),border-color 300ms var(--ease-glass),transform 160ms var(--ease-out)}
.sol-plt-ch:active{transform:scale(.98)}
.sol-plt-ch .sol-icon{width:18px;height:18px;opacity:.6;transition:transform 300ms var(--ease-out),opacity 300ms}
.sol-plt-ch[aria-pressed="true"]{color:var(--on-solid);background:var(--solid);border-color:var(--solid);box-shadow:0 14px 34px -14px rgba(255,255,255,.5)}
.sol-plt-ch[aria-pressed="true"] .sol-icon{opacity:1}
@media (hover:hover) and (pointer:fine){
  .sol-plt-ch:not([aria-pressed="true"]):hover{background:rgba(255,255,255,.12)}
  .sol-plt-ch:hover .sol-icon{transform:translate(2px,-2px);opacity:1}
}
.sol-plt-hub__core{position:relative;z-index:2;display:grid;justify-items:center;gap:16px;text-align:center}
.sol-plt-hub__mono{position:relative;z-index:1;display:grid;place-items:center;width:124px;height:124px;border-radius:50%;color:#fff;
  background:radial-gradient(circle at 30% 25%,rgba(255,255,255,.28),rgba(255,255,255,.06) 60%),rgba(12,12,20,.88);border:1px solid rgba(255,255,255,.22);
  box-shadow:0 0 0 10px rgba(34,211,238,.06),0 0 70px rgba(34,211,238,.38),inset 0 1px 0 rgba(255,255,255,.4)}
.sol-plt-hub__mono svg{fill:currentColor}
.sol-plt-hub__ring{position:absolute;left:50%;top:0;width:124px;height:124px;margin-left:-62px;border-radius:50%;border:1.5px solid var(--accent);opacity:0;pointer-events:none}
.sol-plt-hub__core.is-pulse .sol-plt-hub__ring{animation:sol-plt-pulse 800ms var(--ease-out)}
@keyframes sol-plt-pulse{0%{opacity:.85;transform:scale(1)}100%{opacity:0;transform:scale(1.75)}}
.sol-plt-hub__name{font:600 15px/1.2 var(--font-display);letter-spacing:-.01em;color:var(--ink-1)}
.sol-plt-hub__in{position:relative;z-index:2;display:grid;gap:12px;align-content:center}
.sol-plt-inbox{position:relative;height:222px;padding:0;margin:0;list-style:none}
.sol-plt-it{position:absolute;left:0;right:0;top:0;height:66px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;
  padding:0 14px 0 9px;border-radius:20px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.11);box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
  transform:translate3d(0,calc(var(--slot,0) * 78px),0);transition:transform 560ms var(--ease-out),opacity 420ms var(--ease-out),border-color 600ms ease,box-shadow 600ms ease}
.sol-plt-it .sol-thumb{width:48px;border-radius:12px}
.sol-plt-it.is-new{border-color:rgba(34,211,238,.5);box-shadow:0 0 0 4px rgba(34,211,238,.08),0 20px 40px -22px rgba(34,211,238,.7)}
.sol-plt-it.is-gone{opacity:0}
.sol-plt-it.is-pre{opacity:0}
.sol-plt-it__what{display:flex;flex-direction:column;gap:3px;min-width:0}
.sol-plt-it__what b{font:600 15px/1.15 var(--font-display);letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sol-plt-it__what small{font-size:13px;color:var(--ink-2)}
.sol-plt-hub__beams{position:absolute;inset:0;z-index:1;width:100%;height:100%;overflow:visible;pointer-events:none}
.sol-plt-beam{fill:none;stroke:rgba(255,255,255,.14);stroke-width:1.5;stroke-linecap:round}
.sol-plt-beam--on{stroke:var(--accent);stroke-width:1.75;opacity:0;transition:opacity 420ms var(--ease-out)}
.sol-plt-beam--on.is-on{opacity:.9}
.sol-plt-beam--out{stroke-dasharray:3 7}
.sol-plt-hub__token{position:absolute;left:0;top:0;z-index:5;display:inline-flex;align-items:center;gap:9px;height:46px;padding:0 16px 0 7px;border-radius:var(--r-pill);
  font:600 13.5px/1 var(--font-body);color:var(--ink-0);white-space:nowrap;background:#151623;border:1px solid rgba(255,255,255,.24);
  box-shadow:0 18px 36px -14px rgba(0,0,0,.8),0 0 0 4px rgba(34,211,238,.1),inset 0 1px 0 rgba(255,255,255,.26);opacity:0;pointer-events:none;will-change:transform}
.sol-plt-hub__token .sol-thumb{width:32px;border-radius:10px}
.sol-plt-hub__log{display:flex;align-items:center;gap:10px;padding:16px 24px;border-top:1px solid rgba(255,255,255,.08);font:500 15px/1.4 var(--font-body);color:var(--ink-1)}
.sol-plt-hub__log .sol-icon{width:20px;height:20px;flex:none;color:var(--accent-ink)}

/* =====================================================================
   4 · Aufgabenteilung (hell): Bestellung wandert von Sie zu Dropprinters
   ===================================================================== */
.sol-plt-board{--p:clamp(24px,3vw,40px);--bridge:clamp(64px,8vw,112px);display:grid;grid-template-columns:minmax(0,1fr) var(--bridge) minmax(0,1fr);position:relative}
.sol-plt-side{position:relative;display:grid;grid-auto-rows:min-content;align-content:start;gap:20px;padding:var(--p);border-radius:var(--r-xl)}
.sol-plt-side h3{height:48px;font-size:clamp(28px,3vw,40px);line-height:48px;letter-spacing:-.03em;white-space:nowrap}
.sol-plt-side--you{background:var(--light-1);border:1px solid rgba(10,10,12,.06);box-shadow:0 24px 50px -32px rgba(16,24,48,.3)}
.sol-plt-side--dp{isolation:isolate;overflow:hidden;border:1px solid transparent;background:var(--bg-1);color:var(--ink-0);box-shadow:0 30px 60px -30px rgba(16,24,48,.45),inset 0 1px 0 rgba(255,255,255,.1)}
.sol-plt-side--dp::before{content:"";position:absolute;z-index:-1;inset:-30% -20% 40% 30%;border-radius:50%;
  background:radial-gradient(closest-side,rgba(37,99,235,.42),rgba(34,211,238,.1) 55%,transparent)}
.sol-plt-slot{position:relative;display:flex;align-items:center;justify-content:flex-end;height:84px;padding-right:20px;border-radius:22px;border:1.5px dashed rgba(10,10,12,.2);
  transition:border-color 400ms ease,background-color 400ms ease}
.sol-plt-side--dp .sol-plt-slot{border-color:rgba(255,255,255,.24)}
.sol-plt-slot__cap{font:500 13px/1.2 var(--font-body);color:var(--ink-dark-2);text-align:right;max-width:9em}
.sol-plt-side--dp .sol-plt-slot__cap{color:var(--ink-2)}
.sol-plt-slot.is-full{border-color:rgba(34,211,238,.6);background:rgba(34,211,238,.06)}
.sol-plt-token{position:absolute;left:10px;top:50%;z-index:4;display:flex;align-items:center;gap:12px;width:min(268px,calc(100% - 20px));height:64px;margin-top:-32px;padding:7px 14px 7px 7px;
  border-radius:18px;color:var(--ink-0);background:#14141F;border:1px solid rgba(255,255,255,.16);
  box-shadow:0 26px 44px -20px rgba(24,16,60,.45),0 0 0 4px rgba(34,211,238,.1),inset 0 1px 0 rgba(255,255,255,.22);will-change:transform}
.sol-plt-token .sol-thumb{width:50px;flex:none;border-radius:12px}
.sol-plt-token__txt{display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-width:0}
.sol-plt-token__txt b{font:600 14px/1.1 var(--font-display);letter-spacing:-.01em;white-space:nowrap}
.sol-plt-tasks{display:grid;padding:0;margin:0;list-style:none}
.sol-plt-tasks li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:16px;align-items:start;padding:18px 0;border-top:1px solid rgba(10,10,12,.08)}
.sol-plt-tasks li b{display:block;margin-bottom:3px;font:600 18px/1.2 var(--font-display);letter-spacing:-.015em}
.sol-plt-tasks li > span:last-child{font-size:15.5px;line-height:1.5;color:var(--ink-dark-1)}
.sol-plt-side--dp .sol-plt-tasks li{border-top-color:rgba(255,255,255,.1)}
.sol-plt-side--dp .sol-plt-tasks li > span:last-child{color:var(--ink-1)}
.sol-plt-side--dp .sol-ico{color:var(--ink-0);background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.04));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28),inset 0 0 0 1px rgba(255,255,255,.10),0 10px 24px rgba(0,0,0,.35)}
.sol-plt-bridge{position:relative;display:block}
.sol-plt-bridge__rail{position:absolute;left:0;right:0;top:calc(var(--p) + 48px + 20px + 42px - 1px);height:2px;border-radius:2px;
  background:repeating-linear-gradient(90deg,rgba(10,10,12,.28) 0 6px,transparent 6px 12px)}
.sol-plt-bridge .sol-icon{display:none}

/* =====================================================================
   5 · Überblick (dunkel): Konsole
   ===================================================================== */
.sol-plt-con{max-width:1040px;margin-inline:auto;display:grid;gap:18px;padding:clamp(16px,2.2vw,28px);border-radius:34px}
.sol-plt-con__bar{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.sol-plt-con__title{display:inline-flex;align-items:center;gap:10px;font:600 15px/1.2 var(--font-display);color:var(--ink-0)}
.sol-plt-con__title .sol-icon{width:22px;height:22px;opacity:.85}
.sol-plt-con__replay{display:inline-flex;align-items:center;gap:8px;min-height:44px;margin-left:auto;padding:0 8px;font:500 14px/1 var(--font-body);color:var(--ink-1);
  text-decoration:underline;text-decoration-color:rgba(255,255,255,.28);text-underline-offset:5px;visibility:hidden}
.sol-plt-con__replay.is-on{visibility:visible}
.sol-plt-con__replay .sol-icon{width:18px;height:18px}
@media (hover:hover){.sol-plt-con__replay:hover{color:var(--ink-0)}}
.sol-plt-con__filters{display:flex;align-items:center;justify-content:space-between;gap:12px 20px;flex-wrap:wrap}
.sol-plt-con__count{font-size:14px;color:var(--ink-2);font-variant-numeric:tabular-nums}
.sol-plt-orders{display:grid;gap:10px;padding:0;margin:0;list-style:none}
.sol-plt-o{border-radius:22px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.1);transition:border-color 360ms ease,background-color 360ms ease}
.sol-plt-o.is-open{border-color:rgba(34,211,238,.4);background:rgba(34,211,238,.05)}
.sol-plt-o.is-new{animation:sol-plt-rise 420ms var(--ease-out) both}
.sol-plt-o__btn{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto auto;align-items:center;gap:14px;width:100%;min-height:70px;padding:10px 16px 10px 10px;border-radius:inherit;text-align:left}
.sol-plt-o__btn:focus-visible{outline-offset:-3px}
.sol-plt-o .sol-thumb{width:50px;border-radius:12px}
.sol-plt-o__what{display:flex;flex-direction:column;gap:3px;min-width:0}
.sol-plt-o__what b{font:600 15.5px/1.2 var(--font-display);letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sol-plt-o__what small{font-size:13px;color:var(--ink-2);font-variant-numeric:tabular-nums}
.sol-plt-o__car{width:20px;height:20px;color:var(--ink-2);transition:transform 320ms var(--ease-out)}
.sol-plt-o.is-open .sol-plt-o__car{transform:rotate(180deg)}
.sol-plt-o__detail{padding:2px 20px 20px 20px}
.sol-plt-o__detail:not([hidden]) .sol-plt-tl{animation:sol-plt-rise 380ms var(--ease-out) both}
@keyframes sol-plt-rise{from{opacity:0;transform:translate3d(0,8px,0)}to{opacity:1;transform:none}}
.sol-plt-tl{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 16px;padding:0;margin:0;list-style:none}
.sol-plt-tl::before,.sol-plt-tl::after{content:"";position:absolute;left:20px;top:19px;width:calc((100% - 32px) / 3 * 2 + 32px);height:2px;border-radius:2px;background:rgba(255,255,255,.12)}
.sol-plt-tl::after{transform-origin:left;transform:scaleX(var(--k,0));background:linear-gradient(90deg,var(--accent-3),var(--accent));transition:transform 560ms var(--ease-out)}
.sol-plt-tl__s{position:relative;z-index:1;display:grid;justify-items:start;gap:10px;opacity:.5;transition:opacity 360ms var(--ease-out)}
.sol-plt-tl__s.is-done{opacity:1}
.sol-plt-tl__dot{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;color:var(--ink-2);background:var(--bg-2);border:1px solid rgba(255,255,255,.16);
  transition:background-color 360ms var(--ease-out),color 360ms var(--ease-out),border-color 360ms var(--ease-out)}
.sol-plt-tl__dot .sol-icon{width:20px;height:20px}
.sol-plt-tl__s.is-done .sol-plt-tl__dot{color:var(--accent-ink);border-color:rgba(34,211,238,.45);background:color-mix(in srgb,var(--accent) 14%,var(--bg-2))}
.sol-plt-tl__s.is-cur .sol-plt-tl__dot{color:var(--on-solid);background:var(--solid);border-color:var(--solid);box-shadow:0 0 0 5px rgba(34,211,238,.14)}
.sol-plt-tl__t{display:flex;flex-direction:column;gap:3px}
.sol-plt-tl__t b{font:600 15px/1.2 var(--font-display);letter-spacing:-.01em}
.sol-plt-tl__t small{font-size:13px;line-height:1.4;color:var(--ink-2)}
.sol-plt-con__foot{font-size:13px;line-height:1.5;color:var(--ink-2)}

/* =====================================================================
   6 · Responsive
   ===================================================================== */
@media (max-width:1180px){
  .sol-plt-float--in,.sol-plt-float--ok{right:-14px}
}
@media (max-width:960px){
  .sol-plt .sol-intro__title{font-size:clamp(36px,9.2vw,58px)}
  .sol-plt .sol-intro__lead{max-width:40ch}
  .sol-plt .sol-ctas .btn{height:48px}
  .sol-plt-float{display:none}
  .sol-stepbar__note{display:none}

  /* Gerät kompakt: zusammen mit der Schritt-Leiste 380 bis 420 px */
  .sol-plt-dev{--cw:216px;--ch:50px;--zone:130px;--panel-top:56px;--row-h:40px}
  .sol-plt-win .sol-win__bar{min-height:38px;padding:6px 14px}
  .sol-plt-chan{gap:6px;padding:8px 12px 2px}
  .sol-plt-body{padding:6px 12px 8px}
  .sol-plt-track__line{top:14px}
  .sol-plt-st{gap:6px}
  .sol-plt-st__node{width:30px;height:30px}
  .sol-plt-st__node .sol-icon{width:18px;height:18px}
  .sol-plt-st__mono{width:17px;height:14px}
  .sol-plt-zone{margin-top:11px}
  .sol-plt-list{gap:5px}
  .sol-plt-row{gap:10px;padding:0 10px 0 6px;border-radius:13px}
  .sol-plt-row .sol-thumb{width:31px;border-radius:9px}
  .sol-plt-row__what b{font-size:13.5px}
  .sol-plt-card__in{gap:8px;padding:5px 10px 5px 6px;border-radius:14px}
  .sol-plt-card .sol-thumb{width:40px;border-radius:10px}
  .sol-plt-card__txt{gap:4px}
  .sol-plt-card__txt b{font-size:13.5px}
  .sol-plt-card .sol-tag,.sol-plt-card .sol-status{height:22px;padding:0 8px}
  .sol-plt-panel{gap:5px;padding:7px 12px;border-radius:14px}
  .sol-plt-panel__t{font-size:12px}
  .sol-plt-panel--1{gap:6px}
  .sol-plt-panel__badge{top:6px;right:10px;height:24px}
  .sol-plt-kv{gap:4px 12px}
  .sol-plt-kv dt{min-width:62px}
  .sol-plt-kv dd{font-size:13.5px}
  .sol-plt-log{gap:3px}
  .sol-plt-log li{font-size:13px}
  .sol-plt-panel--3{gap:12px}
  .sol-plt-panel__art{width:58px;border-radius:11px}
  .sol-plt-panel__col{gap:5px}
  .sol-plt-panel__line{font-size:13px}
  .sol-plt-panel--4{gap:5px}
  .sol-plt-panel--4 .sol-plt-panel__sub{display:none}
  .sol-plt-label{gap:10px}
  .sol-plt-label__ico{width:30px;height:30px;border-radius:10px}
  .sol-plt-label__ico .sol-icon{width:18px;height:18px}
  .sol-plt-label__txt b{font-size:15px}
  .sol-plt-route__rail,.sol-plt-route__truck{height:24px}
  .sol-plt-route__rail::before,.sol-plt-route__fill{top:11px}
  .sol-plt-route__truck{width:24px}
  .sol-plt-route{gap:8px}
  .sol-plt-panel--5{gap:8px}
  .sol-plt-foot{padding:5px 14px 7px}
  .sol-plt-stock b{font-size:26px}
  .sol-plt-stock{gap:8px;font-size:13px}

  .sol-plt-lager__grid{grid-template-columns:1fr}
  .sol-plt-lager .sol-count{min-height:380px}
  .sol-plt-ship{--label-w:150px}

  .sol-plt-hub__grid{grid-template-columns:1fr;row-gap:22px;justify-items:stretch}
  .sol-plt-hub__chan{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .sol-plt-hub__chan .sol-plt-hub__hint{grid-column:1 / -1}
  .sol-plt-ch{min-height:52px;padding:0 16px;font-size:16px}
  .sol-plt-hub__core{grid-template-columns:auto 1fr;justify-items:start;align-items:center;text-align:left;gap:16px}
  .sol-plt-hub__mono{width:84px;height:84px;box-shadow:0 0 0 8px rgba(34,211,238,.06),0 0 50px rgba(34,211,238,.35),inset 0 1px 0 rgba(255,255,255,.4)}
  .sol-plt-hub__mono svg{width:36px;height:29px}
  .sol-plt-hub__ring{left:0;margin-left:0;width:84px;height:84px}
  .sol-plt-hub__beams{display:none}

  .sol-plt-board{grid-template-columns:1fr}
  .sol-plt-side--you .sol-plt-tasks{order:1}
  .sol-plt-side--you .sol-plt-slot{order:2}
  .sol-plt-bridge{height:64px}
  .sol-plt-bridge__rail{left:50%;right:auto;top:0;bottom:0;width:2px;height:auto;background:repeating-linear-gradient(180deg,rgba(10,10,12,.28) 0 6px,transparent 6px 12px)}
}
@media (max-width:768px){
  .sol-plt-ship .sol-ship__row{grid-template-columns:1fr;row-gap:12px}
  .sol-plt-ship .sol-ship__track{height:56px}
  .sol-plt-ship .sol-ship__seg{top:10px;bottom:10px}
  .sol-plt-ship .sol-ship__seg span{font-size:12.5px;padding-inline:10px}
  .sol-plt-ship .sol-ship__label{flex-direction:row;align-items:baseline;gap:10px;flex-wrap:wrap}
  .sol-plt-ship .sol-ship__label b{font-size:30px}
  .sol-plt-ship .sol-ship__head{gap:10px}
  .sol-plt-tl{grid-template-columns:1fr;gap:16px}
  .sol-plt-tl::before,.sol-plt-tl::after{left:19px;top:20px;width:2px;height:calc(100% - 40px)}
  .sol-plt-tl::after{transform-origin:top;transform:scaleY(var(--k,0))}
  .sol-plt-tl__s{grid-template-columns:auto minmax(0,1fr);align-items:center;gap:14px}
  .sol-plt-o__btn{grid-template-columns:auto minmax(0,1fr) auto auto;gap:10px;min-height:68px;padding:8px 12px 8px 8px}
  .sol-plt-o__ch{display:none}
  .sol-plt-o__what b{white-space:normal}
  .sol-plt-o .sol-thumb{width:44px}
  .sol-plt-con__bar .badge{order:2}
  .sol-plt-con__replay{order:3}
}
@container stage (max-width:540px){
  .sol-plt-row--mine{grid-template-columns:auto minmax(0,1fr) auto}
  .sol-plt-row__mark{position:absolute;top:-13px;right:14px;height:18px;padding:0 8px;font-size:12px;background:#0F1018;border-radius:var(--r-pill)}
}
@container stage (max-width:480px){
  .sol-plt-chan__t .sol-icon{display:none}
  .sol-plt-chan{gap:5px}
  .sol-plt-chan .sol-tag{padding:0 8px}
  .sol-plt-st:not(.is-current) .sol-plt-st__label{visibility:hidden}
  .sol-plt-st__label{font-size:12px}
  .sol-plt-hist li:not(.sol-plt-hist__last) span{display:none}
  .sol-plt-hist{gap:0}
  .sol-plt-hist__last{grid-column:4}
  .sol-plt-row__what small{font-size:12px}
  .sol-plt-kv{grid-template-columns:1fr}
  .sol-plt-kv > div:nth-child(2){display:none}
}
@container stage (max-width:400px){
  .sol-plt-stock{gap:6px;font-size:12px;white-space:nowrap}
  .sol-plt-stock .sol-icon{width:18px;height:18px}
  .sol-plt-stock b{font-size:24px}
  .sol-plt-foot{gap:8px}
  .sol-plt-chan{gap:4px}
  .sol-plt-chan .sol-tag{padding:0 6px}
  .sol-plt-card__in{padding-right:8px}
  .sol-plt-win .sol-win__bar{padding-inline:10px}
}
@media (max-width:560px){
  .sol-plt-hub__bar .sol-plt-crumb{display:none}
}
@media (max-width:480px){
  .sol-plt-hub__chan{grid-template-columns:1fr 1fr}
  .sol-plt-hub__log{padding:14px 18px;font-size:14.5px}
  .sol-plt-hub__bar,.sol-plt-con__bar{gap:10px}
  .sol-plt-side h3{white-space:normal}
  .sol-plt-token{width:min(250px,calc(100% - 16px))}
  .sol-plt-token__txt b{font-size:13.5px}
  /* Produktnamen im Auftragsstapel zweizeilig statt abgeschnitten (66 px Zeile reicht) */
  .sol-plt-it{gap:10px;padding-right:10px}
  .sol-plt-it .sol-thumb{width:42px}
  .sol-plt-it__what b{font-size:14px;white-space:normal;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2}
  /* Hero-Gerät: Produktnamen zweizeilig statt "…"; Zeile 40 -> 48 px, Zone 130 -> 154 px (Gerät +24 px) */
  .sol-plt-dev{--zone:154px;--row-h:48px}
  .sol-plt-row__what b{line-height:1.1;white-space:normal;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2}
  .sol-plt-kv dd{white-space:normal}
}

/* ---------- Reduzierte Bewegung, ohne JavaScript, ohne Glas ---------- */
@media (prefers-reduced-motion:reduce){
  .sol-plt-row__sheen{display:none}
  .sol-plt-hub__ring{display:none}
  .sol-plt-o.is-new,.sol-plt-o__detail:not([hidden]) .sol-plt-tl{animation:none}
  .sol-status.is-flip{animation:none}
}
html:not(.js) .sol-plt-float{display:none}
html:not(.js) .sol-plt-card{display:none}
@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){
  .sol-plt-card__in{background:rgba(32,34,50,.96)}
}

/* ---------- Kontrast in den Glasgeräten (D2, v7) --------------------------
   Hub (#kanaele, helle Fläche): dichtes Rauchglas (Insel). Fläche var(--smoke-bg-strong) statt rgba(13,13,19,.5) (weiß nur 3,88:1 bei .5),
   Specular und Lichtfleck nicht mehr gedämpft; Token und Schrift kommen aus der Rauchglas-Insel (tokens.css), color/color-scheme hier zur Absicherung.
   Konsole (#ueberblick): Glanzkante gedämpft, Lichtfleck auf 60 % wie zuvor (Fläche setzt die Regel unten). */
.sol-plt-hub.glass--strong{color:var(--ink-0);color-scheme:dark;background:var(--smoke-bg-strong);
  box-shadow:0 50px 90px -40px rgba(24,16,60,.5),0 0 0 1px rgba(10,10,12,.10)}
/* Nebentext im Hub: der ungedämpfte Glanz oben links hellt die Fläche auf (Kontrastmessung am Pixel: ink-2 nur 4,36:1), daher ink-1 */
.sol-plt-hub .sol-plt-crumb,.sol-plt-hub__hint{color:var(--ink-1)}
.sol-plt-con.glass--strong{background:rgba(13,13,19,.5)}
.sol-plt-con::before{opacity:.35}
.sol-plt-con::after{opacity:.6}
@media (prefers-reduced-transparency:reduce){
  .sol-plt-hub.glass--strong,.sol-plt-con.glass--strong{background:var(--bg-2)}
}

/* ---------- Überblick auf heller Fläche (D2) --------------------------
   #ueberblick steht hell (abgesetzte Fläche --light-2 zwischen zwei hellen Abschnitten).
   Die Konsole bleibt ein dunkles Gerät: dichte Fläche statt durchscheinendem Glas,
   feine Haarlinie, weicher getönter Schatten; Badge und Fokus behalten ihre Farben für dunklen Grund. */
.sol-plt-ueber.light{background:var(--light-2);box-shadow:inset 0 1px 0 rgba(10,10,12,.06),inset 0 -1px 0 rgba(10,10,12,.06)}
.sol-plt-ueber.light .sol-plt-con.glass{color:var(--ink-0);color-scheme:dark;border-color:rgba(255,255,255,.10);
  background:linear-gradient(180deg,#1A1A26 0%,var(--bg-1) 100%);-webkit-backdrop-filter:none;backdrop-filter:none;
  box-shadow:0 50px 90px -40px rgba(13,13,19,.55),0 18px 40px -24px rgba(16,24,48,.35),0 0 0 1px rgba(10,10,12,.10),inset 0 1px 0 rgba(255,255,255,.10)}
.sol-plt-ueber.light .sol-plt-con.glass::before{opacity:.35}
.sol-plt-ueber.light .sol-plt-con.glass::after{opacity:0}
.sol-plt-ueber.light .sol-plt-con .badge{color:var(--accent-ink);border-color:rgba(34,211,238,.32);background:rgba(34,211,238,.08)}
.sol-plt-ueber.light .sol-plt-con :focus-visible,.sol-plt-ueber.light .sol-plt-con [class*="sol-"]:focus-visible{outline-color:var(--accent)}

/* ---------- Glas-Bühne (v5, body.pt-page) ----------
   stage-core.css macht nur section.stage durchsichtig; die Story-Hülle ist ein div.stage.sol-scrolly. Hintergrund und eigene Aurora
   fallen weg, das Licht kommt von der festen Bühne. Keine neue Hülle, kein overflow/contain: das Gerät in .sol-stagecol klebt weiter. */
.pt-page .sol-scrolly{background:transparent;box-shadow:none}
.pt-page .sol-scrolly>.aurora{display:none}
/* Streifen hinter dem klebenden Gerät (solutions.css: deckend in --bg-0, damit Kapitelkarten nicht durchscheinen). Auf der durchsichtigen
   Hülle stand er als Rechteck mit harter Kante vor der Bühne; jetzt Milchglas (v7, hell): die Bühne bleibt sichtbar, Karten darunter verschwimmen. */
.pt-page .sol-scrolly .sol-stagecol::before{background:rgba(255,255,255,.55);-webkit-backdrop-filter:blur(28px) saturate(150%);backdrop-filter:blur(28px) saturate(150%)}
.pt-page .sol-scrolly .sol-stagecol::after{background:rgba(255,255,255,.55);-webkit-backdrop-filter:blur(28px) saturate(150%);backdrop-filter:blur(28px) saturate(150%);
  -webkit-mask-image:linear-gradient(180deg,#000,transparent);mask-image:linear-gradient(180deg,#000,transparent)}
@media (prefers-reduced-transparency:reduce){.pt-page .sol-scrolly .sol-stagecol::before,.pt-page .sol-scrolly .sol-stagecol::after{background:var(--bg-0);-webkit-backdrop-filter:none;backdrop-filter:none}}

/* ======================================================================
   v6: Anbindungen, Kennzahlen, Funktionen
   Bausteine .int-row/.int-grid/.stat-band kommen aus tiles.css; hier nur Lage und Abstände auf dieser Seite.
   ====================================================================== */

/* ---------- Hero: „Mit einem Klick verbinden“ ---------- */
.sol-plt-connect{display:grid;justify-items:start;gap:10px;margin-top:clamp(20px,2.4vw,28px)}
.sol-plt-connect__t{font:500 13.5px/1.2 var(--font-body);letter-spacing:.005em;color:var(--ink-1)}
.sol-plt-connect .int-row{--plate:38px}
.sol-plt-connect__more{display:grid;place-items:center;width:100%;height:100%;border-radius:inherit;color:inherit;text-decoration:none;
  transition:background-color 200ms var(--ease-glass)}
/* Fokus: globaler Default (:focus-visible, 2px var(--accent-ink)); nur der Abstand nach innen, weil .int-plate overflow:hidden den äußeren Ring abschneiden würde */
.sol-plt-connect__more:focus-visible{outline-offset:-2px}
@media (hover:hover) and (pointer:fine){.sol-plt-connect__more:hover{background:var(--hover)}}

/* ---------- #kein-lager: Produktion in der EU + Kennzahlen ---------- */
.sol-plt-eu{display:grid;gap:clamp(22px,2.6vw,32px);margin-top:clamp(56px,7vw,96px)}
.sol-plt-eu__text{max-width:640px}
.sol-plt-eu__text h3{font:600 var(--h3)/1.12 var(--font-display);letter-spacing:-.02em;color:var(--ink-dark-0)}
.sol-plt-eu__text p{margin-top:14px;max-width:52ch;font-size:17px;line-height:1.6;color:var(--ink-dark-1)}

/* ---------- #kanaele: Anschlussfeld unter der Demo ---------- */
.sol-plt-all{margin-top:clamp(56px,7vw,96px)}
.sol-plt-all__title{margin-bottom:clamp(20px,2.4vw,28px);text-align:center;font:600 clamp(20px,1.9vw,26px)/1.2 var(--font-display);letter-spacing:-.015em;color:var(--ink-0)}
.sol-plt-all__note{max-width:60ch;margin:clamp(18px,2vw,24px) auto 0;text-align:center;font-size:15px;line-height:1.55;color:var(--ink-1)}

/* ---------- #funktionen: Bento aus sechs Glasgeräten ----------
   Helle Karte wie #ueberblick, darin ein dunkles Gerät mit Licht hinter Glas. Alle Daten sind Beispieldaten.
   Endzustand ist Standard; Vorzustände nur unter html.js + .is-armed (setzt sol-plattform.js bei DP.animate). */
.sol-plt-fx{padding-block:clamp(80px,9vw,128px)}
.sol-fx{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(14px,1.4vw,20px)}
.sol-fx__card{grid-column:span 3;position:relative;display:flex;flex-direction:column;gap:clamp(18px,1.8vw,22px);min-width:0;
  padding:8px 8px clamp(22px,2vw,28px);border-radius:var(--r-xl);background:var(--light-1);border:1px solid rgba(10,10,12,.07);
  box-shadow:0 34px 60px -48px rgba(16,24,48,.55),0 2px 8px -6px rgba(16,24,48,.14),inset 0 1px 0 #fff}
.sol-fx__card--a{grid-column:span 7}
.sol-fx__card--b{grid-column:span 5}
@media (max-width:1120px){.sol-fx__card{grid-column:span 6}}
@media (max-width:760px){.sol-fx__card{grid-column:1 / -1}}

.sol-fx__txt{display:grid;gap:8px;padding-inline:clamp(10px,1.1vw,16px)}
.sol-fx__txt h3{font:600 clamp(19px,1.45vw,22px)/1.2 var(--font-display);letter-spacing:-.012em;color:var(--ink-dark-0)}
.sol-fx__txt p{max-width:58ch;font-size:15.5px;line-height:1.55;color:var(--ink-dark-1)}

/* Gerät */
.sol-fx__dev{--dev-h:232px;position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;gap:10px;min-height:var(--dev-h);
  padding:12px;border-radius:var(--r-lg);color:var(--ink-0);color-scheme:dark;
  background:radial-gradient(70% 80% at 100% 0%,rgba(124,58,237,.34),transparent 62%),radial-gradient(60% 70% at 0% 100%,rgba(34,211,238,.22),transparent 64%),linear-gradient(180deg,#1A1A26 0%,var(--bg-1) 100%);
  box-shadow:0 26px 50px -34px rgba(13,13,19,.65),0 0 0 1px rgba(10,10,12,.10),inset 0 1px 0 rgba(255,255,255,.10)}
.sol-fx__card--a .sol-fx__dev,.sol-fx__card--b .sol-fx__dev{--dev-h:272px}
[data-fx="ai"] .sol-fx__dev{background:radial-gradient(60% 70% at 90% 30%,rgba(244,114,182,.26),transparent 64%),radial-gradient(70% 80% at 0% 0%,rgba(124,58,237,.30),transparent 62%),linear-gradient(180deg,#1A1A26 0%,var(--bg-1) 100%)}
[data-fx="stats"] .sol-fx__dev{background:radial-gradient(80% 70% at 50% 110%,rgba(34,211,238,.26),transparent 64%),radial-gradient(60% 60% at 100% 0%,rgba(29,78,216,.30),transparent 62%),linear-gradient(180deg,#1A1A26 0%,var(--bg-1) 100%)}
[data-fx="app"] .sol-fx__dev{background:radial-gradient(70% 70% at 50% 30%,rgba(124,58,237,.36),transparent 66%),radial-gradient(60% 60% at 100% 100%,rgba(34,211,238,.18),transparent 64%),linear-gradient(180deg,#1A1A26 0%,var(--bg-1) 100%)}

.sol-fx__bar{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:22px}
.sol-fx__ttl{display:inline-flex;align-items:center;gap:8px;min-width:0;font:600 13px/1.1 var(--font-display);letter-spacing:-.005em;color:var(--ink-0);white-space:nowrap}
.sol-fx__ttl .dp-logo{flex:none;width:16px;height:13px}
.sol-fx__tag{flex:none;padding:4px 8px;border-radius:var(--r-pill);font:600 10.5px/1.1 var(--font-body);letter-spacing:0;color:var(--accent-ink);
  background:rgba(34,211,238,.08);box-shadow:inset 0 0 0 1px rgba(34,211,238,.32)}

/* Glas im Gerät: das Licht des Geräts liegt dahinter und wird gebrochen */
.sol-fx__g{border-radius:12px;border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(155deg,rgba(255,255,255,.11) 0%,rgba(255,255,255,.035) 60%,rgba(255,255,255,.06) 100%);
  -webkit-backdrop-filter:blur(14px) saturate(150%);backdrop-filter:blur(14px) saturate(150%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 12px 24px -18px rgba(0,0,0,.7)}
@media (prefers-reduced-transparency:reduce){.sol-fx__g{background:#262636;-webkit-backdrop-filter:none;backdrop-filter:none}}
.sol-fx__kpi small,.sol-fx__lbl,.sol-fx__nums small,.sol-fx__prompt small,.sol-fx__price small{font:500 11px/1.2 var(--font-body);color:var(--ink-2)}

/* 1 · Dashboard */
.sol-fx__kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.sol-fx__kpi{display:grid;gap:3px;min-width:0;padding:10px 11px 8px}
.sol-fx__kpi b{font:italic 800 clamp(24px,2.2vw,30px)/1 var(--font-accent);letter-spacing:.005em;color:var(--ink-0);white-space:nowrap;font-variant-numeric:tabular-nums}
.sol-fx__spark{display:block;width:100%;height:26px;margin-top:6px;overflow:visible}
.sol-fx__spark path{fill:none;stroke:var(--accent);stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:0}
.sol-fx__kpi:nth-child(3) .sol-fx__spark path{stroke:rgba(255,255,255,.55)}
.sol-fx__chans{display:flex;align-items:center;flex-wrap:wrap;gap:8px 10px;padding:9px 11px}
.sol-fx__plates{display:flex;gap:5px}
.sol-fx__plates .int-plate,.sol-fx__shops .int-plate{--plate:26px;border-radius:8px}
.sol-fx__ok{margin-left:auto;display:inline-flex;align-items:center;gap:7px;font:600 11.5px/1 var(--font-body);color:var(--ink-1);white-space:nowrap}
.sol-fx__ok::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 3px rgba(34,211,238,.16),0 0 10px rgba(34,211,238,.7)}
.sol-fx__quick{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto}
.sol-fx__quick span{padding:6px 10px;border-radius:var(--r-pill);font:500 11.5px/1 var(--font-body);color:var(--ink-1);background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}

/* 2 · Gestalten mit KI */
.sol-fx__ai{flex:1;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:10px}
.sol-fx__aside{display:flex;flex-direction:column;gap:8px;min-width:0}
.sol-fx__prompt{display:grid;gap:6px;padding:10px 11px}
.sol-fx__typed{min-height:2.7em;font:500 13px/1.35 var(--font-body);color:var(--ink-0)}
.sol-fx__caret{display:inline-block;width:1.5px;height:1.05em;margin-left:2px;vertical-align:-.15em;background:var(--accent);opacity:0}
.sol-fx__go{align-self:flex-start;padding:7px 11px;border-radius:var(--r-pill);font:600 11.5px/1 var(--font-body);color:var(--bg-0);background:var(--light-1)}
.sol-fx__price{display:grid;gap:3px;margin-top:auto;padding:9px 11px}
.sol-fx__price b{font:italic 800 22px/1 var(--font-accent);color:var(--ink-0)}
.sol-fx__shirt,.sol-fx__prod{display:grid;place-items:center;border-radius:12px;background:radial-gradient(70% 60% at 50% 45%,rgba(255,255,255,.08),transparent 70%)}
.sol-fx__shirt svg{display:block;width:100%;max-width:200px;height:auto;overflow:visible}
.sol-fx__tee{fill:rgba(255,255,255,.07);stroke:rgba(255,255,255,.42);stroke-width:1.3;stroke-linejoin:round}
.sol-fx__motif{transform-box:fill-box;transform-origin:50% 50%}

/* 3 · Design-Canvas */
.sol-fx__canvas{flex:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}
.sol-fx__layers{display:grid;align-content:start;gap:4px;margin:0;padding:6px;list-style:none}
.sol-fx__layers li{display:flex;align-items:center;gap:8px;min-width:0;padding:7px 8px;border-radius:8px;font:500 12px/1.1 var(--font-body);color:var(--ink-1);white-space:nowrap}
.sol-fx__layers li.is-on{color:var(--ink-0);background:rgba(34,211,238,.10);box-shadow:inset 0 0 0 1px rgba(34,211,238,.30)}
.sol-fx__sw{flex:none;display:grid;place-items:center;width:18px;height:18px;border-radius:5px;font:normal 700 10px/1 var(--font-display);color:var(--ink-0)}
.sol-fx__sw--motif{background:linear-gradient(135deg,#22D3EE,#7C3AED 60%,#F472B6)}
.sol-fx__sw--text{background:rgba(255,255,255,.12)}
.sol-fx__sw--bg{background:#2B2B3B;box-shadow:inset 0 0 0 1px rgba(255,255,255,.22)}
.sol-fx__prod{align-content:center;gap:12px;padding:8px 6px}
.sol-fx__bag{display:block;width:100%;max-width:112px;height:auto}
.sol-fx__strap{stroke:rgba(255,255,255,.5)}
.sol-fx__bag-a{fill:#E9E9EE}
.sol-fx__bag-b{fill:#2B2B3B;stroke:rgba(255,255,255,.28);stroke-width:1}
.sol-fx__bag-t{stroke:var(--accent)}
.sol-fx__vars{display:flex;gap:9px}
.sol-fx__vars i{position:relative;width:12px;height:12px;border-radius:50%;background:var(--c);box-shadow:0 0 0 1px rgba(255,255,255,.25)}
.sol-fx__vars i::after{content:"";position:absolute;inset:-4px;border-radius:50%;box-shadow:0 0 0 1.5px var(--accent);opacity:0}
.sol-fx__vars .sol-fx__var-on::after{opacity:1}

/* 4 · Shops verbunden */
.sol-fx__shops{display:grid;gap:6px;margin:0;padding:0;list-style:none}
.sol-fx__shops li{display:flex;align-items:center;gap:9px;min-width:0;padding:6px 10px 6px 6px;border-radius:10px}
.sol-fx__shops b{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:600 12.5px/1.1 var(--font-display);color:var(--ink-0)}
.sol-fx__st{flex:none;display:grid;margin-left:auto}
.sol-fx__st>span{grid-area:1/1;display:inline-flex;align-items:center;justify-content:flex-end;gap:6px;font:500 11px/1 var(--font-body);color:var(--ink-1);white-space:nowrap}
.sol-fx__st>span::before{content:"";flex:none;width:6px;height:6px;border-radius:50%}
.sol-fx__st-b::before{background:var(--accent);box-shadow:0 0 8px rgba(34,211,238,.8)}
.sol-fx__st-a::before{box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.62)}
[data-fx-flip] .sol-fx__st-a{opacity:0}

/* 5 · Auswertungen */
.sol-fx__nums{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.sol-fx__nums span{display:grid;gap:3px;min-width:0}
.sol-fx__nums b{font:italic 800 24px/1 var(--font-accent);color:var(--ink-0);white-space:nowrap}
.sol-fx__chart{display:grid;gap:6px;margin-top:auto}
.sol-fx__bars{display:flex;align-items:flex-end;gap:6px;height:96px;padding-top:4px;border-bottom:1px solid rgba(255,255,255,.12)}
.sol-fx__bars i{flex:1;height:calc(var(--h) * 100%);border-radius:5px 5px 2px 2px;transform-origin:50% 100%;
  background:linear-gradient(180deg,rgba(255,255,255,.34),rgba(255,255,255,.10))}
.sol-fx__bars i.is-hot{background:linear-gradient(180deg,var(--accent),rgba(34,211,238,.25));box-shadow:0 0 18px -4px rgba(34,211,238,.7)}
.sol-fx__days{display:flex;gap:6px}
.sol-fx__days span{flex:1;text-align:center;font:500 10.5px/1 var(--font-body);color:var(--ink-2)}

/* 6 · App */
.sol-fx__dev--app{height:var(--dev-h);align-items:center;padding-bottom:0}
.sol-fx__tag--float{position:absolute;top:12px;right:12px;z-index:2}
.sol-fx__phone{position:relative;flex:none;width:min(212px,84%);height:272px;margin-top:20px;padding:34px 10px 0;border-radius:32px 32px 0 0;
  background:radial-gradient(120% 55% at 50% 0%,rgba(124,58,237,.38),transparent 62%),linear-gradient(180deg,#1E1E2C 0%,#121219 100%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.18),inset 0 0 0 5px #0B0B11,inset 0 0 0 6px rgba(255,255,255,.07),0 30px 50px -22px rgba(0,0,0,.7)}
.sol-fx__island{position:absolute;top:11px;left:50%;width:54px;height:15px;margin-left:-27px;border-radius:var(--r-pill);background:#05050A;box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}
.sol-fx__note{display:flex;align-items:center;gap:8px;padding:8px 9px;border-radius:14px;background:rgba(255,255,255,.14);
  -webkit-backdrop-filter:blur(16px) saturate(160%);backdrop-filter:blur(16px) saturate(160%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.24),0 12px 22px -12px rgba(0,0,0,.75)}
.sol-fx__note-ico{flex:none;display:grid;place-items:center;width:26px;height:26px;border-radius:8px;background:var(--light-1);color:var(--bg-0)}
.sol-fx__note-ico .dp-logo{width:15px;height:12px}
.sol-fx__note-t{display:grid;gap:2px;min-width:0}
.sol-fx__note-t b{font:600 11.5px/1.2 var(--font-display);color:var(--ink-0)}
.sol-fx__note-t small,.sol-fx__mini small{font:500 10.5px/1.15 var(--font-body);color:var(--ink-2)}
.sol-fx__mini{display:grid;gap:6px;margin:10px 0 0;padding:0;list-style:none}
.sol-fx__mini li{display:flex;align-items:center;gap:8px;padding:7px 8px;border-radius:10px;background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}
.sol-fx__mini i{flex:none;width:18px;height:18px;border-radius:6px;background:rgba(255,255,255,.12)}
.sol-fx__mini span{display:grid;gap:2px;min-width:0}
.sol-fx__mini b{font:600 11px/1.1 var(--font-display);color:var(--ink-0)}
@media (prefers-reduced-transparency:reduce){.sol-fx__note{background:#2E2E40;-webkit-backdrop-filter:none;backdrop-filter:none}}

/* Je Gerät eine Handlung beim ersten Erscheinen (einmal). Übergänge nur während .is-play, damit das Scharfschalten nicht sichtbar läuft. */
@media (prefers-reduced-motion:no-preference){
  html.js .sol-fx__card.is-armed:not(.is-play) .sol-fx__spark path{stroke-dashoffset:1}
  .sol-fx__card.is-play .sol-fx__spark path{transition:stroke-dashoffset 1.1s var(--ease-out)}
  .sol-fx__card.is-play .sol-fx__kpi:nth-child(2) .sol-fx__spark path{transition-delay:.12s}
  .sol-fx__card.is-play .sol-fx__kpi:nth-child(3) .sol-fx__spark path{transition-delay:.24s}

  html.js .sol-fx__card.is-armed:not(.is-play) .sol-fx__motif{opacity:0;transform:scale(.9)}
  .sol-fx__card.is-play .sol-fx__motif{transition:opacity .5s var(--ease-out),transform .8s var(--ease-out)}
  html.js .sol-fx__card.is-armed:not(.is-play) .sol-fx__caret{opacity:1}

  html.js .sol-fx__card.is-armed:not(.is-play) .sol-fx__bag-b{opacity:0}
  html.js .sol-fx__card.is-armed:not(.is-play) .sol-fx__vars i:first-child::after{opacity:1}
  html.js .sol-fx__card.is-armed:not(.is-play) .sol-fx__vars .sol-fx__var-on::after{opacity:0}
  .sol-fx__card.is-play .sol-fx__bag-b{transition:opacity .5s ease .35s}
  .sol-fx__card.is-play .sol-fx__vars i::after{transition:opacity .3s ease .35s}

  html.js .sol-fx__card.is-armed:not(.is-play) [data-fx-flip] .sol-fx__st-a{opacity:1}
  html.js .sol-fx__card.is-armed:not(.is-play) [data-fx-flip] .sol-fx__st-b{opacity:0}
  .sol-fx__card.is-play [data-fx-flip] .sol-fx__st>span{transition:opacity .35s ease .9s}

  html.js .sol-fx__card.is-armed:not(.is-play) .sol-fx__bars i{transform:scaleY(.06)}
  .sol-fx__card.is-play .sol-fx__bars i{transition:transform .8s var(--ease-out)}
  .sol-fx__card.is-play .sol-fx__bars i:nth-child(2){transition-delay:.06s}
  .sol-fx__card.is-play .sol-fx__bars i:nth-child(3){transition-delay:.12s}
  .sol-fx__card.is-play .sol-fx__bars i:nth-child(4){transition-delay:.18s}
  .sol-fx__card.is-play .sol-fx__bars i:nth-child(5){transition-delay:.24s}
  .sol-fx__card.is-play .sol-fx__bars i:nth-child(6){transition-delay:.30s}
  .sol-fx__card.is-play .sol-fx__bars i:nth-child(7){transition-delay:.36s}

  html.js .sol-fx__card.is-armed:not(.is-play) .sol-fx__note{opacity:0;transform:translateY(-16px) scale(.97)}
  .sol-fx__card.is-play .sol-fx__note{transition:opacity .45s var(--ease-out) .15s,transform .7s var(--ease-out) .15s}
}

/* Schmal: Gestalten-Gerät untereinander nur, wenn es wirklich eng wird */
@media (max-width:380px){
  .sol-fx__ai{grid-template-columns:minmax(0,1fr)}
  .sol-fx__shirt svg{max-width:150px}
}

/* ======================================================================
   v9: Verdienstrechner #rechner, Platzhalter #details, Konto-Link im Kontaktband
   Rechner: links die Eingaben im Doppelrand (helle Schale, Milchglas-Kern), rechts eine helle Akzentkarte wie .sol-count
   (Milchglas, Pastell-Lichtfleck ≤ .9). Ohne Skript: T-Shirt-Beispiel, gesperrte Felder und Hinweis (html:not(.js)).
   Bewegung nur transform und opacity; bei reduzierter Bewegung ohne Übergänge (Zahlen setzt sol-plattform.js dann sofort).
   ====================================================================== */
.sol-plt-calc,.sol-plt-detail{padding-block:clamp(80px,9vw,128px)}

/* ---------- #rechner ---------- */
/* v14: vier Kinder im DOM (Produkt, Figur, Eingaben, Ergebnis). Ab 961 px links Produkt über Eingaben, rechts die Ergebniskarte über die volle Höhe mit der Figur oben drauf;
   bis 960 px eine Spalte in DOM-Reihenfolge. --fig-room hält unter der Figur Platz für Drehung und Weg aller Scrolllagen (sol-plattform.js: ±9°, ±16 px). */
.sol-plt-calc__grid{--fig-h:240px;--fig-w:min(72vw,270px);position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(14px,1.6vw,22px);align-items:stretch}
/* Pastell-Licht hinter beiden Karten, damit das Milchglas etwas zu brechen hat (nur innerhalb der Containerbreite, kein Überlauf) */
.sol-plt-calc__grid::before{content:"";position:absolute;z-index:-1;inset:-7% 0 -9%;pointer-events:none;
  background:radial-gradient(44% 58% at 16% 34%,color-mix(in srgb,var(--fade-c) 72%,transparent),transparent 72%),
    radial-gradient(40% 54% at 58% 82%,color-mix(in srgb,var(--fade-a) 56%,transparent),transparent 72%),
    radial-gradient(30% 42% at 94% 10%,color-mix(in srgb,var(--fade-e) 62%,transparent),transparent 70%);
  /* v14: Die Figur steht frei auf diesem Licht; die Kanten laufen deshalb weich aus statt hart an der Containerbreite zu enden */
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent),linear-gradient(transparent,#000 12%,#000 88%,transparent);-webkit-mask-composite:source-in;
  mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent),linear-gradient(transparent,#000 12%,#000 88%,transparent);mask-composite:intersect}

/* Eingaben: Schale + Kern */
.sol-plt-calc__in{padding:6px;border-radius:var(--r-xl);background:rgba(255,255,255,.42);border:1px solid rgba(10,10,12,.07);
  box-shadow:0 34px 60px -48px rgba(16,24,48,.5),0 2px 8px -6px rgba(16,24,48,.12)}
.sol-plt-calc__core{display:grid;align-content:start;height:100%;padding:clamp(22px,2.6vw,36px);border-radius:calc(var(--r-xl) - 6px);
  background:linear-gradient(160deg,rgba(255,255,255,.9),rgba(255,255,255,.64));box-shadow:inset 0 1px 0 #fff,inset 0 0 0 1px rgba(255,255,255,.6)}

/* Produktwahl: Radios unsichtbar über der ganzen Kachel (bleiben fokussierbar); weißer Grund, kein Pastell. Ab 961 px quer, schmal hoch. */
.sol-plt-calc__product{min-width:0;margin:0;padding:0;border:0}
.sol-plt-calc__product>legend{padding:0 0 12px}
.sol-plt-calc__tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.sol-plt-calc__tile{position:relative;display:flex;align-items:center;gap:clamp(6px,.7vw,10px);min-height:60px;padding:7px clamp(6px,.6vw,10px) 7px clamp(6px,.5vw,8px);border-radius:var(--r-md);background:#fff;border:1px solid var(--line);color:var(--ink-dark-0);
  transition:border-color 160ms var(--ease-glass),box-shadow 160ms var(--ease-glass),transform 160ms var(--ease-out)}
.sol-plt-calc__tile input{position:absolute;inset:0;z-index:1;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.sol-plt-calc__tile input:disabled{cursor:not-allowed}
.sol-plt-calc__tile-pic{flex:none;display:block;width:clamp(34px,3.06vw,44px);height:44px}
.sol-plt-calc__tile-pic img{display:block;width:100%;height:100%;object-fit:contain;transition:transform 200ms var(--ease-out)}
.sol-plt-calc__tile input:disabled:not(:checked)~.sol-plt-calc__tile-pic{opacity:.6}
.sol-plt-calc__tile-name{min-width:0;font:600 clamp(13px,.98vw,14px)/1.2 var(--font-display);letter-spacing:-.005em;hyphens:auto;hyphenate-limit-chars:6 5 5;-webkit-hyphenate-limit-before:5;-webkit-hyphenate-limit-after:5;overflow-wrap:anywhere}
.sol-plt-calc__tile:has(input:checked){border-color:var(--ink-0);box-shadow:0 0 0 1px var(--ink-0)}
.sol-plt-calc__tile:has(input:focus-visible){border-color:var(--ink-0);box-shadow:0 0 0 1px var(--ink-0),0 0 0 5px rgba(34,211,238,.30)}
.sol-plt-calc__tile:active{transform:scale(.98)}
@media (hover:hover){.sol-plt-calc__tile:hover .sol-plt-calc__tile-pic img{transform:scale(1.08)}}
@supports not selector(:has(*)){.sol-plt-calc__tile input:checked~.sol-plt-calc__tile-name{text-decoration:underline;text-underline-offset:3px}}

/* Figur: gewähltes Produkt groß, ohne Kartenrahmen. Scrollbewegung am Wrapper, Tausch am Bild (sol-plattform.js); Maße aus --fig-h/--fig-w, alle Formate per contain. */
.sol-plt-calc__fig{position:relative;z-index:2;justify-self:center;width:var(--fig-w);height:var(--fig-h);pointer-events:none}
.sol-plt-calc__fig-move{position:absolute;inset:0;will-change:transform}
.sol-plt-calc__fig-img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 22px 28px rgba(48,32,110,.20)) drop-shadow(0 5px 9px rgba(48,32,110,.10))}
.sol-plt-calc__fig.is-empty .sol-plt-calc__fig-move{visibility:hidden}

.sol-plt-calc__field{gap:10px}
.sol-plt-calc__field+.sol-plt-calc__field{margin-top:clamp(20px,2.2vw,26px);padding-top:clamp(20px,2.2vw,26px);border-top:1px solid var(--line)}
.sol-plt-calc .sol-plt-calc__label{font:600 16px/1.3 var(--font-display);letter-spacing:-.005em;color:var(--ink-dark-0)}
.sol-plt-calc__row{display:flex;align-items:center;justify-content:space-between;gap:16px}

/* Zahlenfeld mit sichtbarer Einheit: der Rahmen sitzt an der Hülle, Fokus über :focus-within (gleicher Ring wie .field) */
.sol-plt-calc__num{display:flex;align-items:center;gap:6px;flex:none;width:clamp(132px,11vw,148px);height:48px;padding:0 14px;border-radius:var(--r-md);
  border:1px solid var(--field-border);background:var(--field-bg);transition:border-color 200ms ease,background-color 200ms ease,box-shadow 200ms ease}
.sol-plt-calc__num:focus-within{border-color:var(--ink-0);background-color:var(--bg-0);box-shadow:0 0 0 1px var(--ink-0),0 0 0 5px rgba(34,211,238,.30)}
.sol-plt-calc .sol-plt-calc__num input,.sol-plt-calc .sol-plt-calc__num input:focus{flex:1;min-width:0;width:auto;height:46px;padding:0;border:0;background:transparent;box-shadow:none;
  text-align:right;font:600 18px/1 var(--font-display);letter-spacing:-.01em;font-variant-numeric:tabular-nums;color:var(--ink-dark-0)}
.sol-plt-calc__unit{flex:none;font:500 14px/1 var(--font-body);color:var(--ink-dark-2)}

/* Schieberegler: Spur füllt sich bis zum Griff (--k 0 bis 1 setzt sol-plattform.js) */
.sol-plt-calc .sol-plt-calc__range{--thumb:26px;--fill:calc(var(--thumb) / 2 + var(--k,0) * (100% - var(--thumb)));display:block;width:100%;height:32px;margin:0;padding:0;
  border:0;border-radius:0;background:transparent;box-shadow:none;-webkit-appearance:none;appearance:none;cursor:pointer;touch-action:pan-y}
.sol-plt-calc__range:focus{outline:none}
.sol-plt-calc__range::-webkit-slider-runnable-track{height:6px;border-radius:var(--r-pill);
  background:linear-gradient(90deg,var(--ink-dark-0) 0 var(--fill),rgba(10,10,12,.13) var(--fill))}
.sol-plt-calc__range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:var(--thumb);height:var(--thumb);margin-top:calc((6px - var(--thumb)) / 2);
  border-radius:50%;background:#fff;border:1.5px solid var(--ink-dark-0);box-shadow:0 8px 18px -8px rgba(16,24,48,.55),inset 0 -2px 0 rgba(10,10,12,.06);
  transition:transform 280ms var(--ease-out),box-shadow 200ms var(--ease-glass)}
.sol-plt-calc__range:active::-webkit-slider-thumb{transform:scale(1.1)}
.sol-plt-calc__range:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 3px #fff,0 0 0 5px var(--accent-ink),0 0 0 11px rgba(34,211,238,.25)}
.sol-plt-calc__range::-moz-range-track{height:6px;border-radius:var(--r-pill);background:rgba(10,10,12,.13)}
.sol-plt-calc__range::-moz-range-progress{height:6px;border-radius:var(--r-pill);background:var(--ink-dark-0)}
.sol-plt-calc__range::-moz-range-thumb{box-sizing:border-box;width:var(--thumb);height:var(--thumb);border-radius:50%;background:#fff;border:1.5px solid var(--ink-dark-0);
  box-shadow:0 8px 18px -8px rgba(16,24,48,.55);transition:transform 280ms var(--ease-out)}
.sol-plt-calc__range:active::-moz-range-thumb{transform:scale(1.1)}
.sol-plt-calc__range:focus-visible::-moz-range-thumb{box-shadow:0 0 0 3px #fff,0 0 0 5px var(--accent-ink),0 0 0 11px rgba(34,211,238,.25)}
.sol-plt-calc__scale{display:flex;justify-content:space-between;margin-top:-6px;font:500 12.5px/1 var(--font-body);color:var(--ink-dark-2);font-variant-numeric:tabular-nums}
.sol-plt-calc [disabled]{cursor:not-allowed}
.sol-plt-calc__range:disabled{opacity:.6}

/* Ausgabe: helle Akzentkarte (Rezept wie .sol-count), große Zahl skaliert mit der Kartenbreite */
.sol-plt-calc__out{position:relative;isolation:isolate;overflow:hidden;container-type:inline-size;display:flex;flex-direction:column;gap:clamp(20px,2.2vw,26px);
  padding:clamp(24px,3.2vw,40px);border-radius:var(--r-xl);color:var(--ink-dark-0);
  background:linear-gradient(160deg,var(--glass-bg-strong),var(--glass-bg));border:1px solid var(--line-strong);box-shadow:var(--glass-shadow)}
.sol-plt-calc__glow{position:absolute;z-index:-1;inset:auto -30% -55% -10%;height:95%;border-radius:50%;pointer-events:none;
  background:radial-gradient(closest-side,color-mix(in srgb,var(--fade-c) 90%,transparent),color-mix(in srgb,var(--fade-b) 55%,transparent) 55%,transparent)}
.sol-plt-calc__kv{display:grid}
.sol-plt-calc__kv>div{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding-block:13px;border-bottom:1px solid var(--line)}
.sol-plt-calc__kv>div:first-child{padding-top:0}
.sol-plt-calc__kv dt{font-size:15px;line-height:1.4;color:var(--ink-dark-1)}
.sol-plt-calc__kv dd{font:600 clamp(18px,1.6vw,21px)/1.2 var(--font-display);letter-spacing:-.01em;font-variant-numeric:tabular-nums;white-space:nowrap}

/* Balken: ganze Spur = Verkaufspreis; grau die Kosten, schwarz die Marge (von rechts, scaleX) */
.sol-plt-calc__bar{display:grid;gap:9px}
.sol-plt-calc__track{position:relative;display:block;height:10px;border-radius:var(--r-pill);overflow:hidden;background:rgba(10,10,12,.14)}
.sol-plt-calc__fill{position:absolute;inset:0;transform-origin:100% 50%;transform:scaleX(var(--k,0));background:var(--ink-dark-0);transition:transform 640ms var(--ease-out)}
.sol-plt-calc__legend{display:flex;justify-content:space-between;font:500 12.5px/1 var(--font-body);color:var(--ink-dark-2)}
.sol-plt-calc__legend span{display:inline-flex;align-items:center;gap:7px}
.sol-plt-calc__legend span::before{content:"";width:8px;height:8px;border-radius:50%;background:rgba(10,10,12,.22)}
.sol-plt-calc__legend span:last-child{flex-direction:row-reverse}
.sol-plt-calc__legend span:last-child::before{background:var(--ink-dark-0)}

.sol-plt-calc__sum{display:grid;gap:8px;margin-top:auto}
.sol-plt-calc__sum-t{font:600 clamp(17px,1.4vw,19px)/1.25 var(--font-display);letter-spacing:-.01em}
.sol-plt-calc__num-big{font-family:var(--font-accent);font-style:italic;font-weight:800;font-size:clamp(48px,6vw,92px);font-size:clamp(32px,15cqi,96px);line-height:.9;
  letter-spacing:-.005em;font-variant-numeric:tabular-nums;white-space:nowrap;padding-right:.08em}
.sol-plt-calc__formula{font-size:14px;line-height:1.45;color:var(--ink-dark-2);font-variant-numeric:tabular-nums}
.sol-plt-calc__warn{display:flex;align-items:center;gap:9px;justify-self:start;padding:6px 12px 6px 7px;border-radius:var(--r-pill);font:600 14px/1.4 var(--font-body);color:#BE123C;
  background:rgba(255,255,255,.86);box-shadow:inset 0 0 0 1px rgba(190,18,60,.18)}   /* eigene helle Unterlage: auf reinem Pastellblau läge Rot nur bei 4,2:1 */
.sol-plt-calc__warn::before{content:"!";display:grid;place-items:center;flex:none;width:18px;height:18px;border-radius:50%;background:#BE123C;color:#fff;font:700 12px/1 var(--font-body)}
.sol-plt-calc__warn[hidden]{display:none}
.sol-plt-calc__nojs{display:none;font-size:14px;line-height:1.45;color:var(--ink-dark-1)}
html:not(.js) .sol-plt-calc__grid:not(.is-live) .sol-plt-calc__nojs{display:block}
.sol-plt-calc__ctas{display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px}
.sol-plt-calc__more{display:inline-flex;align-items:center;min-height:44px;font:600 15px/1.2 var(--font-display);color:var(--ink-dark-0);
  text-decoration:underline;text-decoration-color:rgba(10,10,12,.25);text-underline-offset:5px;transition:text-decoration-color 200ms var(--ease-glass)}
@media (hover:hover){.sol-plt-calc__more:hover{text-decoration-color:currentColor}}
.sol-plt-calc__foot{max-width:80ch;margin-top:clamp(18px,2vw,26px);font-size:13.5px;line-height:1.55;color:var(--ink-dark-2)}

/* ---------- #details: sieben Funktionskarten (Doppelrand, Milchglas-Kern, Lichtfleck atmet leise); Tarife als breite Karte über die volle Reihe ---------- */
.sol-plt-detail.light{background:var(--light-2);box-shadow:inset 0 1px 0 rgba(10,10,12,.06),inset 0 -1px 0 rgba(10,10,12,.06)}
.sol-plt-detail__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.6vw,20px)}
.sol-plt-detail__card--wide{grid-column:1/-1}
.sol-plt-detail__card{padding:6px;border-radius:var(--r-xl);background:rgba(255,255,255,.5);border:1px solid rgba(10,10,12,.06);
  box-shadow:0 30px 56px -44px rgba(16,24,48,.45),0 2px 8px -6px rgba(16,24,48,.10)}
.sol-plt-detail__core{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;gap:14px;height:100%;
  padding:clamp(22px,2.4vw,32px);border-radius:calc(var(--r-xl) - 6px);color:var(--ink-dark-0);
  background:linear-gradient(160deg,rgba(255,255,255,.94),rgba(255,255,255,.7));box-shadow:inset 0 1px 0 #fff,inset 0 0 0 1px rgba(255,255,255,.55)}
.sol-plt-detail__glow{--g:var(--fade-c);position:absolute;z-index:-1;top:-40%;right:-32%;width:80%;aspect-ratio:1;border-radius:50%;pointer-events:none;opacity:.9;
  background:radial-gradient(closest-side,color-mix(in srgb,var(--g) 85%,transparent),transparent 72%)}
.sol-plt-detail__card:nth-child(2) .sol-plt-detail__glow{--g:var(--fade-a)}
.sol-plt-detail__card:nth-child(3) .sol-plt-detail__glow{--g:var(--fade-e)}
.sol-plt-detail__core h3{margin-top:6px;font:600 clamp(21px,1.8vw,26px)/1.15 var(--font-display);letter-spacing:-.018em}
.sol-plt-detail__core p{max-width:40ch;font-size:15.5px;line-height:1.55;color:var(--ink-dark-1)}
.sol-plt-detail__chip{display:inline-flex;align-items:center;gap:8px;min-height:30px;margin-top:auto;padding:0 12px;border-radius:var(--r-pill);
  font:600 12.5px/1 var(--font-body);letter-spacing:.01em;color:var(--ink-dark-1);background:rgba(10,10,12,.05);border:1px solid var(--line)}
.sol-plt-detail__chip::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.55}
@media (prefers-reduced-motion:no-preference){
  .sol-plt-detail__glow{animation:sol-plt-breathe 9s cubic-bezier(.45,0,.55,1) infinite alternate}
  .sol-plt-detail__card:nth-child(2) .sol-plt-detail__glow{animation-delay:-3s}
  .sol-plt-detail__card:nth-child(3) .sol-plt-detail__glow{animation-delay:-6s}
}
@keyframes sol-plt-breathe{from{opacity:.55;transform:translate3d(0,0,0) scale(.92)}to{opacity:.9;transform:translate3d(-6%,6%,0) scale(1.06)}}

/* ---------- #kontakt: direkter Weg zur Registrierung über dem Formular ---------- */
.sol-plt-direct{font-size:16px;line-height:1.5;color:var(--ink-1)}
.sol-plt-direct__link{display:inline-flex;align-items:center;gap:6px;min-height:44px;vertical-align:middle;font-family:var(--font-display);font-weight:600;color:var(--ink-0);
  text-decoration:underline;text-decoration-color:rgba(10,10,12,.3);text-underline-offset:5px;transition:text-decoration-color 200ms var(--ease-glass)}
.sol-plt-direct__link .sol-icon{width:16px;height:16px;fill:currentColor}
@media (hover:hover){.sol-plt-direct__link:hover{text-decoration-color:currentColor}}

@media (min-width:961px){
  .sol-plt-calc__grid{--fig-h:clamp(216px,20.84vw,300px);--fig-w:calc(var(--fig-h) * 1.07);--fig-rise:calc(var(--fig-h) * .26);--fig-room:calc(var(--fig-h) * .8175 + 20px);grid-template-rows:auto minmax(0,1fr)}
  .sol-plt-calc__in--product{grid-column:1;grid-row:1}
  .sol-plt-calc__in--inputs{grid-column:1;grid-row:2}
  .sol-plt-calc__fig{grid-column:2;grid-row:1;align-self:start;margin-top:calc(var(--fig-rise) * -1)}
  .sol-plt-calc__out{grid-column:2;grid-row:1/span 2;padding-top:var(--fig-room)}
}
@media (max-width:960px){
  .sol-plt-calc__grid{grid-template-columns:minmax(0,1fr)}
  .sol-plt-calc__in--product .sol-plt-calc__core{padding:clamp(14px,4.6vw,24px)}
  .sol-plt-calc__tile{flex-direction:column;justify-content:center;gap:4px;min-height:44px;padding:6px 4px;text-align:center}
  .sol-plt-calc__tile-pic{width:100%;height:54px}
  .sol-plt-calc__tile-name{font-size:clamp(11.5px,3.4vw,13.5px)}
}
@media (max-width:860px){
  .sol-plt-detail__grid{grid-template-columns:minmax(0,1fr)}
}
@media (prefers-reduced-motion:reduce){
  .sol-plt-calc__fill{transition:none}
  .sol-plt-calc__tile,.sol-plt-calc__tile-pic img{transition:none}
  .sol-plt-calc__tile:active{transform:none}
  .sol-plt-calc__tile:hover .sol-plt-calc__tile-pic img{transform:none}
  .sol-plt-calc__range::-webkit-slider-thumb{transition:none}
  .sol-plt-calc__range::-moz-range-thumb{transition:none}
}
@media (prefers-reduced-transparency:reduce){
  .sol-plt-calc__core,.sol-plt-detail__core{background:var(--light-1)}
  .sol-plt-calc__out{background:var(--light-1)}
}