/* Globotent Kalkulatoren v2 (2026-10-10)
   Aufbau: große Zeichen-Bühne links, Eingabe-Panel rechts, Ergebnis-Karte im Panel.
   Farben nur aus dem CI: Grün = Auswahl/CTA/Hallenlinie, Dunkel = Maße/Text. */
.gc{--g:#1aa585;--g-d:#12755e;--g-dd:#0d614c;--g-soft:#e8f6f1;--ink:#061827;--ink-2:#3d4b55;--mut:#5f6e77;--line:#e3e8ea;--bg:#f4f7f6;--ok:#12755e;--bad:#b42318;--bad-soft:#fdecea;--warn:#8a5a00;--warn-soft:#fff6e0;
  font-family:var(--font-family,'Figtree',system-ui,sans-serif);color:var(--ink)}
.gc *{box-sizing:border-box}
.gc-shell{display:grid;grid-template-columns:minmax(0,1fr) 392px;gap:24px;align-items:start}
.gc-tnum{font-variant-numeric:tabular-nums}

/* ---------- Bühne ---------- */
.gc-stage{background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden;position:sticky;top:96px}
.gc-stage__bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-bottom:1px solid var(--line)}
.gc-stage__canvas{position:relative;background:var(--bg);background-image:linear-gradient(rgba(6,24,39,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(6,24,39,.045) 1px,transparent 1px);background-size:24px 24px}
.gc-stage__canvas svg{display:block;width:100%;height:auto}
.gc-stage__foot{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;padding:12px 16px;border-top:1px solid var(--line);font-size:.8rem;color:var(--mut)}
.gc-key{display:inline-flex;align-items:center;gap:6px}
.gc-key i{width:12px;height:12px;border-radius:3px;display:inline-block}
.gc-note{margin:14px 2px 0;font-size:.78rem;line-height:1.5;color:var(--mut)}

/* Status-Chip */
.gc-status{display:inline-flex;align-items:center;gap:8px;height:32px;padding:0 12px 0 10px;border-radius:999px;font-weight:700;font-size:.82rem;background:var(--g-soft);color:var(--g-dd);transition:background .25s,color .25s}
.gc-status::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor;box-shadow:0 0 0 4px color-mix(in srgb,currentColor 18%,transparent)}
.gc-status.is-bad{background:var(--bad-soft);color:var(--bad)}
.gc-status.is-warn{background:var(--warn-soft);color:var(--warn)}

/* ---------- Segmented Control ---------- */
.gc-seg{position:relative;display:inline-grid;grid-auto-flow:column;grid-auto-columns:1fr;background:#eef2f1;border-radius:12px;padding:4px;gap:0}
.gc-seg--full{display:grid;width:100%}
.gc-seg input{position:absolute;opacity:0;pointer-events:none}
.gc-seg label{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;min-height:38px;padding:0 12px;border-radius:9px;font-weight:600;font-size:.86rem;color:var(--ink-2);cursor:pointer;white-space:nowrap;transition:color .2s,background .2s,box-shadow .2s;user-select:none}
.gc-seg label:hover{color:var(--ink)}
.gc-seg input:checked+label{background:#fff;color:var(--ink);box-shadow:0 1px 2px rgba(6,24,39,.08),0 2px 8px rgba(6,24,39,.06)}
.gc-seg input:focus-visible+label{outline:2px solid var(--g);outline-offset:2px}
.gc-seg--chips label{font-variant-numeric:tabular-nums}

/* ---------- Panel ---------- */
.gc-panel{background:#fff;border:1px solid var(--line);border-radius:20px;padding:22px}
.gc-panel__title{font-size:1.05rem;font-weight:800;margin:0 0 16px;letter-spacing:-.01em}
.gc-group{padding:16px 0;border-top:1px solid var(--line)}
.gc-group:first-of-type{border-top:0;padding-top:0}
.gc-label{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0 0 10px;font-size:.82rem;font-weight:700;color:var(--ink-2)}
.gc-label output,.gc-label .gc-val{font-size:1rem;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums}
.gc-help{margin:8px 0 0;font-size:.76rem;line-height:1.45;color:var(--mut)}

/* Slider mit gefüllter Spur */
.gc-range{--p:20%;-webkit-appearance:none;appearance:none;width:100%;height:28px;background:transparent;cursor:pointer;margin:0}
.gc-range::-webkit-slider-runnable-track{height:6px;border-radius:6px;background:linear-gradient(90deg,var(--g) var(--p),#e1e7e5 var(--p))}
.gc-range::-moz-range-track{height:6px;border-radius:6px;background:#e1e7e5}
.gc-range::-moz-range-progress{height:6px;border-radius:6px;background:var(--g)}
.gc-range::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;margin-top:-8px;border-radius:50%;background:#fff;border:2px solid var(--g);box-shadow:0 2px 6px rgba(6,24,39,.18);transition:transform .15s}
.gc-range::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#fff;border:2px solid var(--g);box-shadow:0 2px 6px rgba(6,24,39,.18)}
.gc-range:active::-webkit-slider-thumb{transform:scale(1.12)}
.gc-range:focus-visible{outline:none}
.gc-range:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 5px rgba(26,165,133,.25)}
.gc-range-scale{display:flex;justify-content:space-between;font-size:.72rem;color:var(--mut);margin-top:2px;font-variant-numeric:tabular-nums}

/* Stepper */
.gc-stepper{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff;transition:border-color .2s,box-shadow .2s}
.gc-stepper:focus-within{border-color:var(--g);box-shadow:0 0 0 3px rgba(26,165,133,.15)}
.gc-stepper button{width:40px;height:42px;border:0;background:#f4f7f6;color:var(--ink);font-size:1.15rem;font-weight:700;cursor:pointer;transition:background .15s}
.gc-stepper button:hover{background:var(--g-soft)}
.gc-stepper button:active{background:#d6efe6}
.gc-stepper input{width:84px;height:42px;border:0;text-align:center;font:800 1rem/1 inherit;font-family:inherit;color:var(--ink);font-variant-numeric:tabular-nums;-moz-appearance:textfield;background:#fff}
.gc-stepper input::-webkit-outer-spin-button,.gc-stepper input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.gc-stepper input:focus{outline:none}
.gc-row{display:flex;align-items:center;gap:12px}
.gc-unit{font-size:.82rem;color:var(--mut);font-weight:600}

/* Select */
.gc-select{position:relative}
.gc-select select{-webkit-appearance:none;appearance:none;width:100%;height:46px;padding:0 40px 0 14px;border:1px solid var(--line);border-radius:12px;background:#fff;font:600 .9rem/1.2 inherit;font-family:inherit;color:var(--ink);cursor:pointer;transition:border-color .2s,box-shadow .2s}
.gc-select select:hover{border-color:#c9d3d0}
.gc-select select:focus{outline:none;border-color:var(--g);box-shadow:0 0 0 3px rgba(26,165,133,.15)}
.gc-select::after{content:"";position:absolute;right:16px;top:50%;width:8px;height:8px;border-right:2px solid var(--ink-2);border-bottom:2px solid var(--ink-2);transform:translateY(-70%) rotate(45deg);pointer-events:none}

/* Schalter */
.gc-switch{display:flex;align-items:flex-start;gap:12px;cursor:pointer}
.gc-switch input{position:absolute;opacity:0;pointer-events:none}
.gc-switch__ui{flex:0 0 44px;height:26px;border-radius:999px;background:#d5dddb;position:relative;transition:background .2s;margin-top:1px}
.gc-switch__ui::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(6,24,39,.25);transition:transform .22s cubic-bezier(.3,.7,.4,1)}
.gc-switch input:checked+.gc-switch__ui{background:var(--g)}
.gc-switch input:checked+.gc-switch__ui::after{transform:translateX(18px)}
.gc-switch input:focus-visible+.gc-switch__ui{outline:2px solid var(--g);outline-offset:2px}
.gc-switch__txt strong{display:block;font-size:.9rem;color:var(--ink)}
.gc-switch__txt span{display:block;font-size:.76rem;color:var(--mut);margin-top:2px;line-height:1.4}

/* ---------- Ergebnis ---------- */
.gc-result{margin-top:4px;border-radius:16px;background:var(--ink);color:#fff;padding:18px 18px 6px;position:relative;overflow:hidden}
.gc-result__eyebrow{font-size:.7rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#8fe0c6}
.gc-result__name{font-size:1.08rem;font-weight:800;line-height:1.3;margin:6px 0 14px;text-wrap:balance}
.gc-result__big{display:flex;align-items:baseline;gap:8px;margin-bottom:12px}
.gc-result__big b{font-size:2.6rem;line-height:1;font-weight:800;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.gc-result__big span{font-size:.86rem;color:#b7c5cc;font-weight:600}
.gc-meter{height:8px;border-radius:8px;background:rgba(255,255,255,.12);overflow:hidden;margin:0 0 14px}
.gc-meter i{display:block;height:100%;width:0;border-radius:8px;background:linear-gradient(90deg,#1aa585,#7ec700);transition:width .6s cubic-bezier(.2,.8,.2,1)}
.gc-rows{list-style:none;margin:0;padding:0}
.gc-rows li{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-top:1px solid rgba(255,255,255,.1);font-size:.86rem;color:#c3d0d6}
.gc-rows li b{color:#fff;font-weight:700;text-align:right;font-variant-numeric:tabular-nums}
.gc-cta{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:52px;margin-top:14px;border-radius:999px;background:var(--g-d);color:#fff;font-weight:800;font-size:.92rem;letter-spacing:.04em;text-transform:uppercase;text-decoration:none;transition:background .2s,transform .15s}
.gc-cta:hover{background:var(--g-dd);color:#fff}
.gc-cta:active{transform:scale(.98)}
.gc-cta svg{transition:transform .2s}
.gc-cta:hover svg{transform:translateX(3px)}

/* Alternativen */
.gc-alts{margin-top:18px}
.gc-alts__h{font-size:.72rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--mut);margin:0 0 8px}
.gc-alt{display:grid;grid-template-columns:1fr auto;gap:2px 12px;align-items:center;padding:12px 14px;border:1px solid var(--line);border-radius:12px;text-decoration:none;color:var(--ink);transition:border-color .2s,background .2s;margin-top:8px}
.gc-alt:hover{border-color:var(--g);background:#fafdfc;color:var(--ink)}
.gc-alt strong{font-size:.86rem;font-weight:700}
.gc-alt span{grid-column:1;font-size:.76rem;color:var(--mut);font-variant-numeric:tabular-nums}
.gc-badge{grid-row:1/span 2;grid-column:2;display:inline-flex;align-items:center;height:24px;padding:0 9px;border-radius:999px;font-size:.72rem;font-weight:800;white-space:nowrap}
.gc-badge--ok{background:var(--g-soft);color:var(--g-dd)}
.gc-badge--bad{background:var(--bad-soft);color:var(--bad)}

/* Prüfliste (Maschinen) */
.gc-checks{list-style:none;margin:0;padding:0}
.gc-checks li{display:grid;grid-template-columns:28px 1fr;gap:2px 10px;padding:11px 0;border-top:1px solid rgba(255,255,255,.1)}
.gc-checks li:first-child{border-top:0}
.gc-checks .ic{grid-row:1/span 2;width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:900;background:rgba(26,165,133,.22);color:#8fe0c6}
.gc-checks li.is-bad .ic{background:rgba(240,68,56,.2);color:#ffb4ab}
.gc-checks strong{font-size:.88rem;color:#fff}
.gc-checks span{font-size:.78rem;color:#b7c5cc;line-height:1.4}

/* Maschinenliste */
.gc-mlist{display:flex;flex-direction:column;gap:10px}
.gc-m{border:1px solid var(--line);border-radius:14px;padding:12px;background:#fff;animation:gcIn .28s cubic-bezier(.2,.8,.2,1) both}
.gc-m.is-bad{border-color:#f3b5ad;background:#fffafa}
.gc-m__head{display:flex;align-items:center;gap:10px}
.gc-m__num{flex:0 0 26px;height:26px;border-radius:8px;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:800}
.gc-m.is-bad .gc-m__num{background:var(--bad)}
.gc-m__head .gc-select{flex:1;min-width:0}
.gc-m__head select{height:40px;font-size:.86rem}
.gc-m__rm{flex:0 0 36px;height:36px;border:0;border-radius:10px;background:transparent;color:var(--mut);font-size:1.2rem;cursor:pointer;transition:background .15s,color .15s}
.gc-m__rm:hover{background:var(--bad-soft);color:var(--bad)}
.gc-m__rm[disabled]{opacity:.3;cursor:default;background:transparent;color:var(--mut)}
.gc-m__dims{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px}
.gc-m__dims label{display:flex;flex-direction:column;gap:4px;font-size:.7rem;font-weight:700;color:var(--mut);letter-spacing:.04em;text-transform:uppercase}
.gc-m__dims .gc-in{position:relative}
.gc-m__dims input{width:100%;height:38px;padding:0 26px 0 10px;border:1px solid var(--line);border-radius:10px;font:700 .9rem/1 inherit;font-family:inherit;color:var(--ink);font-variant-numeric:tabular-nums;transition:border-color .2s,box-shadow .2s}
.gc-m__dims input:focus{outline:none;border-color:var(--g);box-shadow:0 0 0 3px rgba(26,165,133,.15)}
.gc-m__dims .gc-in::after{content:"m";position:absolute;right:10px;top:50%;transform:translateY(-50%);font-size:.78rem;color:var(--mut);font-weight:600;text-transform:none;letter-spacing:0}
.gc-add{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;height:46px;margin-top:10px;border:1.5px dashed #c5d1cd;border-radius:14px;background:transparent;color:var(--g-dd);font:700 .88rem/1 inherit;font-family:inherit;cursor:pointer;transition:border-color .2s,background .2s}
.gc-add:hover{border-color:var(--g);background:var(--g-soft)}
.gc-linkbtn{border:0;background:none;padding:0;color:var(--g-dd);font:700 .8rem/1 inherit;font-family:inherit;cursor:pointer;text-decoration:underline;text-underline-offset:3px}

/* ---------- SVG-Animationen ---------- */
@keyframes gcIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes gcPop{from{opacity:0;transform:translateY(-14px) scale(.92)}to{opacity:1;transform:none}}
@keyframes gcDraw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes gcFade{from{opacity:0}to{opacity:1}}
.gc svg .gc-anim-pop{transform-box:fill-box;transform-origin:center bottom;animation:gcPop .42s cubic-bezier(.2,.9,.25,1.15) both;animation-delay:calc(var(--i,0) * 18ms)}
.gc svg .gc-anim-draw{stroke-dasharray:1;stroke-dashoffset:0;animation:gcDraw .7s cubic-bezier(.4,0,.2,1) both}
.gc svg .gc-anim-fade{animation:gcFade .4s ease both}
.gc svg [data-drag]{cursor:grab}
.gc svg [data-drag]:active{cursor:grabbing}
@media (prefers-reduced-motion:reduce){
  .gc *,.gc svg *{animation:none!important;transition:none!important}
}

/* ---------- Responsive ---------- */
@media (max-width:1080px){.gc-shell{grid-template-columns:minmax(0,1fr) 360px}}
@media (max-width:920px){
  .gc-shell{grid-template-columns:1fr}
  .gc-stage{position:relative;top:0}
}
@media (max-width:520px){
  .gc-panel{padding:18px;border-radius:16px}
  .gc-stage{border-radius:16px}
  .gc-seg label{padding:0 8px;font-size:.8rem}
  .gc-result__big b{font-size:2.2rem}
}
.gc-badge{font-style:normal}
