/*
  website-neu: Stile der Startseite (linkt BaseLayout über die Kopfzeile der Seite).
  Quelle: features/website-mockup/src/10-head.html (Tokens aus brand.ailean.re, Inhaberentscheid Farbe 06.11.2026:
  Fotos farbig, roter Punkt vor Kickern, Schlüsselzahlen rot, Diagramme in der Rotskala, Preise schwarz, Primärknöpfe
  Almost Black, Logo nie rot) und die Hero Szene «Fassung 2» nach der PROPbase Demo (hs- Klassen am Ende).
  Alles unter .neu-start, damit nichts auf die übrigen Seiten wirkt. Die Startseite ist hell (Mockup kennt keinen
  Dunkelmodus), darum setzt .neu-start Farben und color-scheme ausdrücklich.
  Statische Datei, siehe src/lib/neu/assets.ts (nicht durch die Astro Pipeline).
*/
.neu-start {
  --background: #ffffff; --foreground: #040404; --primary: #040404; --primary-foreground: #ffffff;
  --muted: #f5f5f5; --muted-foreground: #757575; --border: #ebebeb; --ring: #999999; --radius: 10px;
  --emerald: var(--neu-emerald); --whatsapp: var(--neu-whatsapp); --orange: var(--neu-orange); --destructive: var(--neu-orange);
  --emerald-tint: color-mix(in srgb, var(--emerald) 14%, transparent);
  --emerald-line: color-mix(in srgb, var(--emerald) 55%, transparent);
  --wa-tint: color-mix(in srgb, var(--whatsapp) 16%, transparent);
  --orange-tint: color-mix(in srgb, var(--orange) 14%, transparent);
  --fs-xs: .72rem; --fs-sm: .82rem; --fs-md: .875rem; --fs-base: .95rem; --fs-lg: 1.1rem; --fs-xl: 1.35rem; --fs-2xl: 1.75rem;
  --lh-tight: 1.2; --lh-snug: 1.4; --lh-normal: 1.55;
  --shadow-card: 0 1px 2px rgba(0, 0, 0, .04); --shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);
  --shadow-md: 0 4px 14px rgba(0, 0, 0, .08); --shadow-lg: 0 18px 50px rgba(0, 0, 0, .18);
  --ease: cubic-bezier(.4, 0, .2, 1); --wrap: 1160px; --app-font: inherit;
  --ico-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
  --ico-play: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolygon points='6 3 20 12 6 21 6 3'/%3E%3C/svg%3E");
  background: var(--background); color: var(--foreground); color-scheme: light; overflow-x: clip;
  font-size: 1rem; line-height: var(--lh-normal); -webkit-text-size-adjust: 100%;
}
.neu-start section { scroll-margin-top: 72px; }
@media (max-width: 900px) { .neu-start section { scroll-margin-top: 64px; } }

/* ---------- Sektionen und Bedienelemente aus dem Mockup (Selektoren unter .neu-start) ---------- */
.neu-start img,.neu-start svg{max-width:100%;display:block}
.neu-start a{color:inherit}
.neu-start h1,.neu-start h2,.neu-start h3,.neu-start p{margin:0}
.neu-start h1{font-weight:700}
.neu-start h2,.neu-start h3{font-weight:600}
.neu-start .dot,.neu-start .rot{color:var(--brand-red)}
.neu-start .wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:24px}
@media(max-width:520px){
.neu-start .wrap{padding-inline:16px}
}
.neu-start :focus-visible{outline:2px solid var(--ring);outline-offset:2px;border-radius:4px}
.neu-start .btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);min-height:48px;padding:0 var(--sp-6);border-radius:8px;border:1px solid var(--primary);background:var(--primary);color:var(--primary-foreground);font:600 var(--fs-base)/1 var(--app-font);text-decoration:none;cursor:pointer;transition:opacity .12s var(--ease)}
.neu-start .btn:hover{opacity:.9}
.neu-start .btn:active{transform:translateY(1px)}
.neu-start .btn.sek{background:var(--background);color:var(--foreground);border-color:var(--border)}
.neu-start .btn.sek:hover{border-color:var(--grey-300)}
.neu-start .btn.klein{min-height:36px;padding:0 var(--sp-4);font-size:var(--fs-md)}
.neu-start .cta-row{display:flex;flex-wrap:wrap;gap:var(--sp-3);margin-top:var(--sp-5)}
.neu-start .kick{font-size:var(--fs-md);font-weight:500;color:var(--grey-500)}
.neu-start .dot-r{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--red);vertical-align:middle;margin-right:.5em}
.neu-start .live-pill{display:inline-flex;align-items:center;gap:6px;font-size:var(--fs-xs);font-weight:600;padding:2px 9px;border-radius:999px;border:1px solid var(--grey-100);background:var(--background);color:var(--foreground);margin-bottom:var(--sp-3)}
.neu-start .live-dot{width:6px;height:6px;border-radius:50%;background:var(--brand-red);animation:neu-pulse 2s ease-in-out infinite}
@keyframes neu-pulse{0%,100%{opacity:1}50%{opacity:.4}}
.neu-start .scr{position:relative;background:var(--background);border-radius:36px;overflow:hidden;display:flex;flex-direction:column;height:100%;min-height:0;font-size:max(11px,4.1cqw)}
.neu-start .insel{position:absolute;top:9px;left:50%;transform:translateX(-50%);width:31%;height:25px;border-radius:999px;background:var(--foreground);z-index:3}
.neu-start .sb{display:flex;align-items:center;justify-content:space-between;padding:12px 7% 5px;height:46px;background:var(--whatsapp);color:var(--primary-foreground);font-weight:600;font-size:max(11px,4.2cqw)}
.neu-start .sb-r{display:flex;align-items:center;gap:max(3px,1.6cqw)}
.neu-start .sb-r svg{fill:currentColor;height:max(8px,4cqw);width:auto}
.neu-start .wa-kopf{background:var(--whatsapp);color:var(--primary-foreground);padding:4px 5% 10px;display:flex;align-items:center;gap:var(--sp-2)}
.neu-start .wa-kopf .zur{font-size:1.9em;line-height:1;font-weight:300;margin-top:-4px}
.neu-start .wa-kopf .av{width:2.4em;height:2.4em;border-radius:50%;background:var(--primary-foreground);color:#040404;display:grid;place-items:center;flex:0 0 auto}
.neu-start .wa-kopf .av svg{width:72%;height:72%;display:block}
.neu-start .wa-kopf b{display:block;font-weight:600;line-height:1.15}
.neu-start .wa-kopf small{font-size:.8em;opacity:.85}
.neu-start .chat{flex:1;min-height:0;overflow-y:auto;padding:var(--sp-2);display:flex;flex-direction:column;gap:5px;background:var(--muted);scrollbar-width:none}
.neu-start .chat::-webkit-scrollbar{display:none}
.neu-start .msg{max-width:88%;padding:6px 9px;border-radius:12px;line-height:1.32;box-shadow:var(--shadow-sm);animation:neu-rein .35s ease both;overflow-wrap:anywhere}
.neu-start .msg.m{align-self:flex-end;background:var(--wa-tint);border:1px solid var(--wa-tint);border-bottom-right-radius:4px}
.neu-start .msg.a{align-self:flex-start;background:var(--background);border-bottom-left-radius:4px}
.neu-start .msg .zeit{display:block;text-align:right;font-size:.68em;color:var(--muted-foreground);margin-top:2px}
.neu-start .msg .gap{height:6px}
.neu-start .chip{display:inline-flex;align-items:center;gap:4px;margin-top:4px;font-size:.66em;font-weight:600;color:var(--success);background:var(--emerald-tint);border-radius:999px;padding:1px 7px}
.neu-start .chip i{width:6px;height:6px;border-radius:50%;background:var(--emerald)}
.neu-start .chip.wait{color:var(--grey-700);background:var(--muted)}
.neu-start .chip.wait i{animation:neu-punkt 1s infinite}
.neu-start .tag-tag{align-self:center;font-size:.7em;color:var(--grey-700);background:var(--background);border-radius:999px;padding:1px 10px;box-shadow:var(--shadow-sm);margin:3px 0}
.neu-start .foto{width:min(100%,15em);border-radius:10px;overflow:hidden;margin-bottom:2px;line-height:0;background:var(--border)}
.neu-start .foto img,.neu-start .mk-img img,.neu-start .mk-duo img{display:block;width:100%;height:auto;border-radius:8px}
.neu-start .mk-img{margin-bottom:4px;line-height:0}
.neu-start .mk-duo{display:grid;gap:6px;margin-top:4px}
.neu-start .mk-duo figure{margin:0}
.neu-start .mk-duo figcaption{font-size:.78em;line-height:1.3;color:var(--grey-700);margin-top:2px}
.neu-start .vm{display:flex;align-items:center;gap:7px;min-width:11em}
.neu-start .vp{width:1.9em;height:1.9em;border-radius:50%;background:var(--emerald);color:var(--primary-foreground);display:grid;place-items:center;flex:0 0 auto}
.neu-start .vp svg{width:1.1em;height:1.1em;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.neu-start .welle{flex:1;height:1.7em;min-width:0;fill:var(--muted-foreground)}
.neu-start .vd{font-size:.72em;color:var(--muted-foreground)}
.neu-start .vt{margin-top:4px;font-size:.86em;color:var(--grey-700);font-style:italic}
.neu-start .msg.link{width:88%}
.neu-start .lp-card{border-radius:7px;overflow:hidden;background:var(--muted)}
.neu-start .lp-img{aspect-ratio:16/9;background:var(--background)}
.neu-start .lp-img svg{display:block;width:100%;height:100%}
.neu-start .lp-body{padding:.55em .7em .6em;display:flex;flex-direction:column;gap:2px}
.neu-start .lp-price{font-size:1.5em;font-weight:800;letter-spacing:-.02em;line-height:1.1;color:var(--foreground)}
.neu-start .lp-t{font-size:1em;line-height:1.3;color:var(--foreground)}
.neu-start .lp-t b{font-weight:800}
.neu-start .lp-d{font-size:.92em;color:var(--grey-700)}
.neu-start .lp-av{display:flex;align-items:center;gap:.5em;font-size:.92em;font-weight:700;color:var(--destructive,var(--orange));margin-top:3px}
.neu-start .lp-av i{width:.6em;height:.6em;border-radius:50%;background:var(--success);flex:0 0 auto}
.neu-start .lp-dom{font-size:.84em;color:var(--muted-foreground);margin-top:3px}
.neu-start .mk{background:var(--muted);border-radius:8px;padding:6px 8px;margin-top:2px}
.neu-start .mk-t{font-weight:600;line-height:1.25;overflow-wrap:anywhere}
.neu-start .mk-s{font-size:.8em;color:var(--muted-foreground)}
.neu-start .mk-r{display:flex;justify-content:space-between;gap:6px;font-size:.8em;border-top:1px solid var(--border);margin-top:3px;padding-top:3px}
.neu-start .mk-r b{font-weight:600}
.neu-start .mk ul{margin:4px 0 0;padding:0;list-style:none;font-size:.82em}
.neu-start .mk li::before{content:"";display:inline-block;width:1em;height:1em;margin-right:.3em;vertical-align:-.15em;background:var(--success);-webkit-mask:var(--ico-check) center/contain no-repeat;mask:var(--ico-check) center/contain no-repeat}
.neu-start .mk.video .mk-t::before{content:"";display:inline-block;width:.9em;height:.9em;margin-right:.3em;vertical-align:-.1em;background:var(--grey-700);-webkit-mask:var(--ico-play) center/contain no-repeat;mask:var(--ico-play) center/contain no-repeat}
.neu-start .mk.auftrag{border-left:3px solid var(--success)}
.neu-start .sys{align-self:center;font-size:.72em;background:var(--orange-tint);color:var(--grey-700);padding:2px 10px;border-radius:999px;animation:neu-rein .35s ease both;text-align:center;max-width:92%}
.neu-start .tipp{align-self:flex-start;background:var(--background);border-radius:12px;border-bottom-left-radius:4px;padding:9px 11px;display:flex;gap:4px;box-shadow:var(--shadow-sm);animation:neu-rein .25s ease both}
.neu-start .tipp i{width:6px;height:6px;border-radius:50%;background:var(--muted-foreground);animation:neu-punkt 1s infinite}
.neu-start .tipp i:nth-child(2){animation-delay:.15s}
.neu-start .tipp i:nth-child(3){animation-delay:.3s}
@keyframes neu-punkt{0%,60%,100%{opacity:.3;transform:none}30%{opacity:1;transform:translateY(-3px)}}
@keyframes neu-rein{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.neu-start .wa-fuss{background:var(--background);border-top:1px solid var(--border);padding:7px 5% 18px;color:var(--muted-foreground);font-size:.85em}
.neu-start .wa-fuss span{display:block;background:var(--muted);border-radius:999px;padding:5px 12px}
.neu-start .balken{position:absolute;bottom:6px;left:50%;transform:translateX(-50%);width:34%;height:4px;border-radius:999px;background:var(--foreground)}
.neu-start @container (max-width:600px){.karte .t{font-size:.72rem}
  .karte .a,.karte .st,.karte .tag{font-size:.6rem}
  .sp h3{font-size:.62rem}}
.neu-start .sek-block{padding:clamp(48px,8vw,104px) 0;border-top:1px solid var(--border)}
.neu-start .sek-block h2{font-size:clamp(1.7rem,3.6vw,2.6rem);line-height:1.1;letter-spacing:-.03em;font-weight:600;max-width:20em;margin-top:var(--sp-3)}
.neu-start .lead{font-size:var(--fs-lg);color:var(--grey-700);max-width:38em;margin-top:var(--sp-4);line-height:var(--lh-snug)}
.neu-start .drei{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-5);margin-top:var(--sp-10)}
@media(max-width:900px){
.neu-start .drei{grid-template-columns:minmax(0,1fr)}
}
.neu-start .tun{box-shadow:var(--shadow-card);border:1px solid var(--border);border-radius:var(--radius);padding:var(--sp-6);display:flex;flex-direction:column;gap:var(--sp-4)}
.neu-start .tun h3{font-size:var(--fs-xl);letter-spacing:-.015em}
.neu-start .tun .satz{color:var(--grey-700)}
.neu-start .vn{display:grid;gap:var(--sp-2);margin-top:auto}
.neu-start .vn div{border-radius:var(--radius);padding:var(--sp-3);font-size:var(--fs-md);line-height:1.4}
.neu-start .vn .v{background:var(--grey-50);border:1px solid var(--grey-200);color:var(--grey-700)}
.neu-start .vn .n{background:var(--grey-50);border:1px solid var(--almost-black)}
.neu-start .vn b{display:block;font-size:var(--fs-sm);font-weight:600;margin-bottom:2px}
.neu-start .vn .v b{color:var(--grey-500)}
.neu-start .vn .n b{color:var(--foreground)}
.neu-start .zeit-leiste{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--sp-5);margin-top:var(--sp-10);position:relative;counter-reset:s}
.neu-start .zeit-leiste::before{content:"";position:absolute;left:0;right:0;top:19px;height:1px;background:var(--grey-200)}
.neu-start .zeit-leiste li{list-style:none;position:relative;padding-top:56px;counter-increment:s}
.neu-start .zeit-leiste li::before{content:counter(s);position:absolute;left:0;top:0;width:40px;height:40px;border-radius:50%;background:var(--background);border:1px solid var(--almost-black);display:grid;place-items:center;font-weight:700;color:var(--foreground)}
.neu-start .zeit-leiste .wo{font-size:var(--fs-sm);font-weight:600;color:var(--grey-500)}
.neu-start .zeit-leiste .online::before{background:var(--almost-black);color:var(--white);border-color:var(--almost-black)}
.neu-start .zeit-leiste h3{font-size:var(--fs-lg);margin-top:var(--sp-1);letter-spacing:-.01em}
.neu-start .zeit-leiste p{font-size:var(--fs-md);color:var(--grey-700);margin-top:var(--sp-2)}
.neu-start ol.zeit-leiste{margin-bottom:0;padding-left:0;margin-top:var(--sp-10)}
@media(max-width:900px){
.neu-start .zeit-leiste{grid-template-columns:minmax(0,1fr);gap:var(--sp-6)}
.neu-start .zeit-leiste::before{left:19px;right:auto;top:0;bottom:0;width:2px;height:auto}
.neu-start .zeit-leiste li{padding-top:0;padding-left:60px;min-height:40px}
}
.neu-start .nein{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-4);margin-top:var(--sp-6)}
@media(max-width:900px){
.neu-start .nein{grid-template-columns:minmax(0,1fr)}
}
.neu-start .nein.nein4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:1000px){
.neu-start .nein.nein4{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:600px){
.neu-start .nein.nein4{grid-template-columns:minmax(0,1fr)}
}
.neu-start .nein div{background:var(--grey-50);border:1px solid var(--grey-200);color:var(--foreground);border-radius:var(--radius);padding:var(--sp-4) var(--sp-5);font-weight:600;display:flex;gap:var(--sp-3);align-items:center}
.neu-start .nein div{position:relative}
.neu-start .nein div::after{content:"";position:absolute;inset:-1px;border:2px solid var(--almost-black);border-radius:var(--radius);pointer-events:none}
.neu-start .nein div:nth-child(2){--i:1}
.neu-start .nein div:nth-child(3){--i:2}
.neu-start .nein div:nth-child(4){--i:3}
.neu-start .nein.vor div::after{clip-path:inset(0 100% 0 0)}
.neu-start .nein.zeichnen div::after{animation:neu-rand 700ms var(--ease) both;animation-delay:calc(var(--i,0) * 120ms)}
@keyframes neu-rand{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
.neu-start .nein div::before{content:"";flex:0 0 auto;width:1.2em;height:1.2em;background:var(--success);-webkit-mask:var(--ico-check) center/contain no-repeat;mask:var(--ico-check) center/contain no-repeat}
.neu-start .kacheln{display:grid;gap:var(--sp-4);margin-top:var(--sp-10)}
.neu-start .kacheln.drei{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:var(--sp-4)}
@media(max-width:700px){
.neu-start .kacheln.zwei,.neu-start .kacheln.drei{grid-template-columns:minmax(0,1fr)}
}
.neu-start .kachel{box-shadow:var(--shadow-card);border:1px solid var(--border);border-radius:var(--radius);padding:var(--sp-6);display:flex;flex-direction:column;gap:var(--sp-2)}
.neu-start .kachel .zahl{font-size:clamp(2.2rem,4vw,3rem);font-weight:700;letter-spacing:-.03em;line-height:1;color:var(--red)}
.neu-start .kachel .was{color:var(--grey-700);font-size:var(--fs-base)}
.neu-start .kachel.gross{background:var(--grey-50);border-color:var(--almost-black)}
.neu-start .kachel.gross .zahl{color:var(--brand-red)}
.neu-start .einf-flaeche{background:var(--grey-50)}
.neu-start .einf-flaeche .nein div{background:var(--background);border-color:var(--almost-black)}
.neu-start .einf-flaeche .zitat{background:var(--background)}
.neu-start .quelle{margin-top:var(--sp-4);font-size:var(--fs-sm);color:var(--muted-foreground)}
.neu-start .schluss{background:var(--primary);color:var(--primary-foreground);padding:clamp(56px,9vw,120px) 0;text-align:left}
.neu-start .schluss h2{font-size:clamp(1.9rem,4.4vw,3.2rem);line-height:1.08;letter-spacing:-.03em;font-weight:600;max-width:16em}
.neu-start .schluss p{margin-top:var(--sp-4);font-size:var(--fs-lg);opacity:.8;max-width:30em}
.neu-start .schluss .btn{background:var(--primary-foreground);color:var(--primary);border-color:var(--primary-foreground);margin-top:var(--sp-8)}
.neu-start .rv{opacity:0;transform:translateY(8px);transition:opacity .4s var(--ease),transform .4s var(--ease);transition-delay:var(--d,0s)}
.neu-start .rv.in{opacity:1;transform:none}
.neu-start .tun .satz.klein{font-size:var(--fs-md)}
.neu-start .tun .satz.gross{font-size:var(--fs-lg);font-weight:600;color:var(--foreground);line-height:var(--lh-snug)}
.neu-start .anim{position:relative;height:132px;border-radius:var(--radius);background:var(--muted);overflow:hidden;color:var(--muted-foreground)}
.neu-start .anim svg{position:absolute;inset:0;width:100%;height:100%}
.neu-start .kc{position:absolute;left:50%;top:50%;padding:3px 10px;border-radius:8px;background:var(--background);border:1px solid var(--border);font-size:var(--fs-xs);font-weight:600;color:var(--grey-700);box-shadow:var(--shadow-sm);transform:translate(calc(-50% + var(--x) * var(--sx,1)),calc(-50% + var(--y))) rotate(var(--r));animation:neu-einlaufen 6s ease-in-out infinite;animation-delay:var(--d);animation-play-state:paused}
.neu-start .mitte{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(1);padding:8px 18px;border-radius:var(--radius);background:var(--background);border:1px solid var(--red);font-size:var(--fs-md);font-weight:700;color:var(--red);animation:neu-blase 6s ease-in-out infinite;animation-play-state:paused}
.neu-start .anim.live .kc,.neu-start .anim.live .mitte,.neu-start .anim.live .rg,.neu-start .anim.live .ord i{animation-play-state:running}
@media (max-width:400px){.neu-start .anim{--sx:.7}} /* schmale Telefone: die Chips der fünf Kanäle bleiben im Kasten (französisch und rätoromanisch sind länger) */
@keyframes neu-einlaufen{0%{transform:translate(calc(-50% + var(--x) * var(--sx,1)),calc(-50% + var(--y))) rotate(var(--r));opacity:0}12%{opacity:1}50%{transform:translate(calc(-50% + var(--x) * var(--sx,1)),calc(-50% + var(--y))) rotate(var(--r));opacity:1}66%{transform:translate(-50%,-50%) rotate(0deg) scale(.4);opacity:0}100%{opacity:0;transform:translate(-50%,-50%) scale(.4)}}
@keyframes neu-blase{0%,58%{transform:translate(-50%,-50%) scale(.2);opacity:0}68%{transform:translate(-50%,-50%) scale(1.08);opacity:1}74%,92%{transform:translate(-50%,-50%) scale(1);opacity:1}100%{transform:translate(-50%,-50%) scale(.9);opacity:0}}
.neu-start .rg{position:absolute;top:0;left:var(--x);width:16px;height:11px;border-radius:3px;background:var(--background);border:1px solid var(--ring);opacity:0;animation:neu-fall 2.4s ease-in infinite;animation-delay:var(--d);animation-play-state:paused}
@keyframes neu-fall{0%{transform:translateY(-14px) rotate(-8deg);opacity:0}15%{opacity:1}75%{transform:translateY(62px) rotate(6deg);opacity:1}100%{transform:translateY(84px) rotate(0);opacity:0}}
.neu-start .ord{position:absolute;left:12%;right:12%;bottom:8px;display:grid;gap:4px}
.neu-start .ord i{display:block;height:12px;border-radius:4px;background:var(--background);border:1px solid var(--border);animation:neu-ordnen 2.4s ease-in-out infinite;animation-delay:var(--d);animation-play-state:paused}
@keyframes neu-ordnen{0%,60%{background:var(--background);border-color:var(--border)}80%,100%{background:var(--red);border-color:var(--red)}}
.neu-start .anim.still .kc,.neu-start .anim.still .rg{display:none}
.neu-start .anim.still .mitte{animation:none;opacity:1}
.neu-start .anim.still .ord i{animation:none;background:var(--red);border-color:var(--red)}
.neu-start .kn circle{fill:var(--background);stroke:var(--grey-700);stroke-width:1.5}
.neu-start .kn text{fill:var(--grey-700)}
.neu-start .kn.ai circle{stroke:var(--red);fill:var(--red-50)}
.neu-start .kn.ai text{fill:var(--red);font-weight:600}
.neu-start .tun .vn{margin-top:auto}
.neu-start .zitat{position:relative;margin:var(--sp-10) 0 0;max-width:60em;background:var(--grey-50);border:1px solid var(--grey-200);border-left:4px solid var(--almost-black);border-radius:calc(var(--radius) * 1.6);padding:clamp(24px,3vw,40px);display:grid;gap:var(--sp-5)}
.neu-start .zb-person{display:flex;align-items:center;gap:var(--sp-3)}
.neu-start .zb-foto{width:64px;height:64px;border-radius:50%;object-fit:cover;flex:0 0 auto}
.neu-start .zb-name{display:grid;gap:2px}
.neu-start .zb-name b{font-size:var(--fs-sm);font-weight:700}
.neu-start .zb-name span{color:var(--grey-500);font-size:var(--fs-sm)}
.neu-start .zb-text{position:relative;min-width:0}
.neu-start .zb-text::before{content:"«";position:absolute;top:-2.2rem;left:-1.4rem;font-size:6rem;line-height:1;font-weight:700;color:var(--grey-200);pointer-events:none}
.neu-start .zb-text>*{position:relative}
.neu-start .zb-intro{font-size:var(--fs-base);color:var(--grey-700);line-height:var(--lh-snug);margin-bottom:var(--sp-4)}
.neu-start .zitat blockquote{margin:0;font-size:clamp(1.35rem,2.2vw,1.75rem);font-weight:700;letter-spacing:-.02em;line-height:1.3}
@media(min-width:700px){
.neu-start .zitat{grid-template-columns:minmax(0,10rem) minmax(0,1fr);gap:var(--sp-8)}
.neu-start .zb-person{flex-direction:column;align-items:flex-start;gap:var(--sp-3)}
.neu-start .zb-foto{width:96px;height:96px}
}
.neu-start .lead.ehrlich{margin-top:var(--sp-8);max-width:44em;color:var(--foreground)}
.neu-start .reg{display:grid;gap:var(--sp-2);font-size:var(--fs-md);color:var(--grey-700);font-weight:500}
.neu-start .reg span{display:flex;justify-content:space-between;gap:var(--sp-3)}
.neu-start .reg b{color:var(--foreground);font-variant-numeric:tabular-nums}
.neu-start input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:28px;margin:0;cursor:pointer;background:transparent}
.neu-start input[type=range]::-webkit-slider-runnable-track{height:6px;border-radius:999px;background:linear-gradient(to right,var(--almost-black) var(--p,50%),var(--grey-100) var(--p,50%))}
.neu-start input[type=range]::-moz-range-track{height:6px;border-radius:999px;background:linear-gradient(to right,var(--almost-black) var(--p,50%),var(--grey-100) var(--p,50%))}
.neu-start input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;margin-top:-8px;border-radius:50%;background:var(--almost-black);border:3px solid var(--background);box-shadow:var(--shadow-md)}
.neu-start input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--almost-black);border:3px solid var(--background);box-shadow:var(--shadow-md)}
.neu-start .seg{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;background:var(--muted);border-radius:8px;padding:3px;gap:3px}
.neu-start .seg button{border:0;background:transparent;border-radius:6px;min-height:40px;padding:0 var(--sp-3);font:600 var(--fs-md)/1.1 var(--app-font);color:var(--grey-700);cursor:pointer;transition:background .2s,color .2s}
.neu-start .seg button.on{background:var(--primary);color:var(--primary-foreground)}
.neu-start .sw{flex:0 0 auto;width:44px;height:26px;border-radius:999px;border:0;background:var(--border);position:relative;cursor:pointer;transition:background .2s}
.neu-start .sw i{position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:var(--background);box-shadow:var(--shadow-sm);transition:transform .2s}
.neu-start .sw[aria-checked=true]{background:var(--almost-black)}
.neu-start .sw[aria-checked=true] i{transform:translateX(18px)}
.neu-start .hw,.neu-start .lz{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3) 0;border-top:1px solid var(--border)}
.neu-start .hw:first-child,.neu-start .lz:first-child{border-top:0}
.neu-start .hk{flex:1;min-width:0;display:grid;line-height:1.3}
.neu-start .hk b{font-size:var(--fs-md)}
.neu-start .hk .stat,.neu-start .hk .gw{font-size:var(--fs-xs);color:var(--muted-foreground)}
.neu-start .hw.aus .stat{color:var(--grey-700);font-weight:600}
.neu-start .hw.aus .hk b,.neu-start .lz.aus .hk b{color:var(--muted-foreground);text-decoration:line-through}
.neu-start .bf{display:flex;align-items:center;gap:4px;font-size:var(--fs-xs);color:var(--muted-foreground)}
.neu-start .bf input{width:64px;min-height:34px;border:1px solid var(--border);border-radius:var(--radius);padding:0 var(--sp-2);font:600 var(--fs-md)/1 var(--app-font);text-align:right;background:var(--background);color:var(--foreground)}
.neu-start .bf input:disabled{background:var(--muted);color:var(--muted-foreground)}
.neu-start .drei.steuer{align-items:stretch}
.neu-start .steuer .tun{gap:var(--sp-4)}
.neu-start .rechner{margin-top:var(--sp-10);border:1px solid var(--border);border-radius:var(--radius);padding:clamp(16px,3vw,32px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:clamp(20px,3vw,40px);align-items:center}
@media(max-width:900px){
.neu-start .rechner{grid-template-columns:minmax(0,1fr)}
}
.neu-start .r-links{display:grid;gap:var(--sp-5)}
.neu-start .stufe{font-size:var(--fs-md);color:var(--grey-700)}
.neu-start .mind{font-size:var(--fs-sm);color:var(--grey-700);max-width:30em;margin-top:calc(var(--sp-3) * -1)}
.neu-start .r-rechts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-4);min-width:0}
@media(max-width:700px){
.neu-start .r-rechts{grid-template-columns:minmax(0,1fr)}
}
.neu-start .pk{border:1px solid var(--border);border-radius:var(--radius);padding:clamp(16px,2.4vw,26px);min-width:0;background:var(--background)}
.neu-start .pk{box-shadow:var(--shadow-card)}
.neu-start .pk.jahr{background:var(--grey-50);border-color:var(--almost-black)}
.neu-start .pk h3{font-size:var(--fs-lg);letter-spacing:-.01em}
.neu-start .pk .betrag{font-size:clamp(2.2rem,4.4vw,3.2rem);font-weight:700;letter-spacing:-.03em;line-height:1.05;font-variant-numeric:tabular-nums;margin-top:var(--sp-2)}
.neu-start .pk .einheit{color:var(--grey-700);font-size:var(--fs-md)}
.neu-start .pk .misch{color:var(--grey-500);font-size:var(--fs-sm)}
.neu-start .pk .listen{color:var(--grey-500);font-size:var(--fs-sm);margin-top:2px}
.neu-start .marken{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin-top:var(--sp-3);min-height:26px}
.neu-start .abz,.neu-start .spar{font-size:var(--fs-sm);font-weight:700;border-radius:8px;padding:var(--sp-1) var(--sp-3);width:max-content;max-width:100%}
.neu-start .abz{background:var(--background);border:1px solid var(--brand-red);color:var(--brand-red)}
.neu-start .abz.leer,.neu-start .spar.leer{visibility:hidden}
.neu-start .spar{background:var(--background);border:1px solid var(--grey-200);color:var(--foreground);margin:var(--sp-4) 0 0}
.neu-start .summen{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-3);margin:var(--sp-4) 0 0;padding-top:var(--sp-3);border-top:1px solid var(--border)}
.neu-start .summen dt{font-size:var(--fs-sm);color:var(--grey-700)}
.neu-start .summen dd{margin:0;font-size:var(--fs-lg);font-weight:700;letter-spacing:-.01em;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.neu-start .rechner.anfrage .pk{display:none}
.neu-start .anfrage-kasten{display:none;grid-column:1/-1;border:1px solid var(--almost-black);border-radius:calc(var(--radius) * 1.6);padding:clamp(20px,3vw,32px);background:var(--grey-50)}
.neu-start .rechner.anfrage .anfrage-kasten{display:block}
.neu-start .anfrage-kasten h3{font-size:var(--fs-xl);letter-spacing:-.01em}
.neu-start .anfrage-kasten p{margin-top:var(--sp-2);color:var(--grey-700)}
.neu-start .anfrage-kasten .btn{margin-top:var(--sp-4)}
.neu-start .dazu{margin-top:var(--sp-6);max-width:46rem}
.neu-start .dazu h3{margin:0 0 var(--sp-3)}
.neu-start .inkl{width:100%;border-collapse:collapse;max-width:46rem}
.neu-start .inkl td{padding:var(--sp-3) 0;border-top:1px solid var(--border);font-size:var(--fs-base)}
.neu-start .inkl tr:first-child td{border-top:0}
.neu-start .inkl td:last-child{width:3rem;text-align:right}
.neu-start .steuer4{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-5);margin-top:var(--sp-10)}
@media(max-width:800px){
.neu-start .steuer4{grid-template-columns:minmax(0,1fr)}
}
.neu-start .steuer4 .tun{gap:var(--sp-4)}
.neu-start .tline{margin-top:var(--sp-5);display:grid;gap:var(--sp-4)}
.neu-start .lane{box-shadow:var(--shadow-card);border:1px solid var(--border);border-radius:var(--radius);padding:var(--sp-5)}
.neu-start .lane.ai{border-color:var(--almost-black);background:var(--grey-50)}
.neu-start .lane-h{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--sp-3)}
.neu-start .pill{font-size:var(--fs-sm);font-weight:700;border-radius:8px;padding:var(--sp-1) var(--sp-4)}
.neu-start .pill.o{background:var(--grey-50);border:1px solid var(--grey-200)}
.neu-start .pill.w{background:var(--red);color:var(--white)}
.neu-start .lane-l{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-3) var(--sp-5)}
.neu-start .einsatz{display:grid;justify-items:end;text-align:right;line-height:1.1}
.neu-start .ez-l{font-size:var(--fs-sm);color:var(--grey-700);font-weight:600}
.neu-start .ez-z{font-size:clamp(2.2rem,5vw,3.4rem);font-weight:700;letter-spacing:-.03em;font-variant-numeric:tabular-nums;white-space:nowrap}
.neu-start .lane.ai .ez-z{color:var(--brand-red)}
.neu-start .ez-k{font-size:var(--fs-md);color:var(--grey-700);font-variant-numeric:tabular-nums;white-space:nowrap}
.neu-start .ez-k i{font-style:normal;font-weight:700;color:var(--foreground)}
@media(max-width:560px){
.neu-start .einsatz{justify-items:start;text-align:left;width:100%}
}
.neu-start .lane-t{font-weight:600;color:var(--foreground)}
.neu-start .track{margin-top:var(--sp-4)}
.neu-start .bar{height:6px;border-radius:999px;background:var(--border);overflow:hidden}
.neu-start .bar i{display:block;height:100%;width:0;background:var(--grey-400);border-radius:999px}
.neu-start .lane.ai .bar i{background:var(--red)}
.neu-start .nodes{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:var(--sp-2);margin-top:var(--sp-3)}
.neu-start .node{opacity:.35;transition:opacity .4s;font-size:var(--fs-xs);line-height:1.3;min-width:0;overflow-wrap:anywhere}
.neu-start .node.on{opacity:1}
.neu-start .node b{display:block;font-size:var(--fs-sm)}
.neu-start .node span{color:var(--grey-700)}
.neu-start .exc{margin-top:var(--sp-4);font-size:var(--fs-sm);opacity:.4;transition:opacity .4s;display:flex;gap:var(--sp-3);align-items:baseline}
.neu-start .exc.on{opacity:1}
.neu-start .exc-l{font-weight:700;color:var(--foreground);flex:0 0 auto}
.neu-start .ssrc{margin-top:var(--sp-4);font-size:var(--fs-sm);color:var(--muted-foreground);max-width:60em}
@media(max-width:700px){
.neu-start .nodes{grid-template-columns:minmax(0,1fr)}
.neu-start .node{font-size:var(--fs-sm)}
}
.neu-start .ja{display:inline-block;width:1.2em;height:1.2em;background:var(--success);-webkit-mask:var(--ico-check) center/contain no-repeat;mask:var(--ico-check) center/contain no-repeat}
.neu-start #zeitachse .lead{max-width:44em}
.neu-start .kachel .fuss{font-size:var(--fs-xs);color:var(--grey-700);margin-top:auto}
.neu-start .ringe{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-4);margin-top:var(--sp-4)}
@media(max-width:800px){
.neu-start .ringe{grid-template-columns:minmax(0,1fr)}
}
.neu-start .ring-panel{box-shadow:var(--shadow-card);border:1px solid var(--border);border-radius:var(--radius);padding:var(--sp-6);display:flex;flex-direction:column;gap:var(--sp-3)}
.neu-start .ring-panel h3{font-size:var(--fs-lg)}
.neu-start .ring-body{display:flex;align-items:center;gap:var(--sp-6);flex-wrap:wrap}
.neu-start .ring{width:150px;height:150px;flex:0 0 auto}
.neu-start .ring-bg{fill:none;stroke:var(--grey-100);stroke-width:18}
.neu-start .ring-seg{fill:none;stroke-width:18}
.neu-start .ring-mitte{font:700 20px var(--app-font);fill:var(--foreground)}
.neu-start .legende-ring{list-style:none;margin:0;padding:0;display:grid;gap:var(--sp-2);flex:1;min-width:180px}
.neu-start .legende-ring li{display:grid;grid-template-columns:12px minmax(0,1fr) auto auto;gap:var(--sp-2);align-items:baseline;font-size:var(--fs-md)}
.neu-start .legende-ring i{width:10px;height:10px;border-radius:50%;align-self:center}
.neu-start .legende-ring b{font-variant-numeric:tabular-nums}
.neu-start .legende-ring em{font-style:normal;color:var(--grey-700);min-width:3ch;text-align:right}
.neu-start .ring-fuss{font-size:var(--fs-sm);color:var(--muted-foreground)}
.neu-start .tform{margin-top:var(--sp-8);display:grid;gap:var(--sp-5);max-width:720px}
.neu-start .tform .reg,.neu-start .tform .reg b{color:var(--primary-foreground)}
.neu-start .tform .reg span{align-items:center;flex-wrap:wrap}
.neu-start .tform input[type=number]{width:110px;min-height:40px;border-radius:var(--radius);border:1px solid var(--grey-700);background:transparent;color:var(--primary-foreground);padding:0 var(--sp-3);font:700 var(--fs-lg)/1 var(--app-font);text-align:right}
.neu-start .tform input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(to right,var(--white) var(--p,50%),var(--grey-700) var(--p,50%))}
.neu-start .tform input[type=range]::-moz-range-track{background:linear-gradient(to right,var(--white) var(--p,50%),var(--grey-700) var(--p,50%))}
.neu-start .tform input[type=range]::-webkit-slider-thumb{background:var(--white);border-color:var(--almost-black)}
.neu-start .tform input[type=range]::-moz-range-thumb{background:var(--white);border-color:var(--almost-black)}
.neu-start input[type=number]{-moz-appearance:textfield;appearance:textfield}
.neu-start input[type=number]::-webkit-outer-spin-button,.neu-start input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.neu-start .tfelder{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-3)}
@media(max-width:700px){
.neu-start .tfelder{grid-template-columns:minmax(0,1fr)}
}
.neu-start .feld{display:grid;gap:var(--sp-1);font-size:var(--fs-sm)}
.neu-start .feld input{width:100%;min-width:0;min-height:44px;border-radius:var(--radius);border:1px solid var(--grey-700);background:transparent;color:var(--primary-foreground);padding:0 var(--sp-3);font:400 var(--fs-base)/1 var(--app-font)}
.neu-start .feld input::placeholder{color:var(--muted-foreground)}
.neu-start .tform .btn{width:max-content;max-width:100%;margin-top:0}
.neu-start .vertrauen{padding:40px 0;border-top:1px solid var(--border)}
.neu-start .v-kopf{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:var(--sp-3) var(--sp-8)}
.neu-start .vertrauen h2{font-size:var(--fs-xl);font-weight:600;color:var(--grey-700);letter-spacing:-.02em;line-height:1.2;margin-top:var(--sp-1)}
.neu-start .v-zahl{font-size:var(--fs-md);color:var(--grey-700);font-weight:500}
.neu-start .logos{overflow:hidden;margin-top:var(--sp-6);-webkit-mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent)}
.neu-start .logos-spur{display:flex;width:max-content;animation:neu-lauf 40s linear infinite}
.neu-start .logos:hover .logos-spur{animation-play-state:paused}
@keyframes neu-lauf{to{transform:translateX(-50%)}}
.neu-start .logo-item{margin:0;padding-right:72px;display:flex;align-items:center;height:44px;flex:0 0 auto}
.neu-start .logo-bild{display:block;height:36px;width:auto;max-width:220px}
.neu-start .logo-bild.dunkel{width:auto;height:40px;padding:0;border-radius:4px}
.neu-start .stimmen-kopf{margin-top:var(--sp-10)}
.neu-start .stimmen-kopf h3{font-size:var(--fs-xl);font-weight:600;color:var(--grey-700);letter-spacing:-.02em;line-height:1.2;margin-top:var(--sp-1)}
.neu-start .stimmen{list-style:none;margin:var(--sp-6) 0 0;padding:0;width:100%;min-width:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,26rem),1fr));gap:var(--sp-5)}
.neu-start .stimme{margin:0;min-width:0;overflow-wrap:anywhere;background:var(--grey-50);border:1px solid var(--grey-200);border-left:4px solid var(--almost-black);border-radius:calc(var(--radius) * 1.6);padding:clamp(20px,2.4vw,28px);display:flex;flex-direction:column;gap:var(--sp-5)}
.neu-start .stimme-text{margin:0;font-size:var(--fs-md);font-weight:500;line-height:1.5;color:var(--foreground);flex:1}
.neu-start .stimme-text::before{content:'«'}
.neu-start .stimme-text::after{content:'»'}
.neu-start .stimme-wer{margin:0;display:flex;align-items:center;gap:var(--sp-3)}
.neu-start .stimme-foto{width:56px;height:56px;border-radius:50%;object-fit:cover;flex:0 0 auto}
.neu-start .stimme-name{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.neu-start .stimme-name b{font-weight:600;white-space:nowrap}
.neu-start .stimme-name span{color:var(--grey-700);font-size:var(--fs-sm)}
.neu-start .stimme-logo{height:24px;width:auto;max-width:120px;flex:0 0 auto}
.neu-start .stimme-logo.dunkel{height:28px;border-radius:4px}
@media(max-width:700px){.neu-start .stimme-logo{display:none}}
.neu-start .kachel h3{font-size:var(--fs-xl);letter-spacing:-.02em}
@media(max-width:700px){
.neu-start .btn,.neu-start .tform .btn,.neu-start .schluss .btn,.neu-start .anfrage-kasten .btn{display:flex;width:100%;max-width:420px;margin-inline:auto;justify-content:center;text-align:center}
.neu-start .btn.klein{min-height:44px}
.neu-start .cta-row{flex-direction:column;align-items:center}
.neu-start .seg button{min-height:44px}
.neu-start input[type=range]{height:44px}
.neu-start input[type=range]::-webkit-slider-thumb{width:28px;height:28px;margin-top:-11px}
.neu-start input[type=range]::-moz-range-thumb{width:22px;height:22px}
}
@media(prefers-reduced-motion:reduce){
.neu-start *::before,.neu-start *::after{animation:none!important;transition:none!important}
.neu-start .logos{-webkit-mask-image:none;mask-image:none;overflow-x:auto}
.neu-start .logos-spur [aria-hidden=true]{display:none}
}

/* ---------- M7 (09.11.2026): Beispiele nach dem Hero, Aufrufzeilen, Preisstufen als Tabelle, Termin Abschnitt ---------- */
.neu-start .bsp-flaeche{background:var(--grey-50)}
/* M9 (10.11.2026): Beispiele als drei Telefone (Variante A2). Rahmen und WhatsApp Bauteile (.scr, .insel, .sb, .wa-kopf, .msg, .wa-fuss, .balken) sind die der Hero Szene; die Liste im Bildschirm rastet pro Fall ein */
.neu-start .bsp-telefone{margin-top:var(--sp-8);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--sp-8);row-gap:0;align-items:start}
.neu-start .bsp-ph{width:100%;max-width:330px;min-width:0;justify-self:center;display:grid;grid-row:span 4;grid-template-rows:subgrid;row-gap:var(--sp-3)} /* vier Zeilen (Name, Definition, Telefon, Pfeile) laufen quer über die drei Telefone: eine zweizeilige Definition schiebt nicht nur ein Telefon nach unten */
.neu-start .bsp-name{display:flex;align-items:center;margin:0;font-size:var(--fs-lg);font-weight:600;letter-spacing:-.01em;line-height:var(--lh-snug);color:var(--foreground)}
.neu-start .bsp-def{margin:calc(var(--sp-2) * -1) 0 0;font-size:var(--fs-md);line-height:var(--lh-snug);color:var(--grey-700)}
.neu-start .bsp-phone{width:100%;aspect-ratio:330/600;background:var(--foreground);border-radius:44px;padding:9px;box-shadow:var(--shadow-lg);container-type:inline-size;position:relative}
.neu-start .bsp-phone .scr{font-size:max(11px,4.3cqw)}
.neu-start .bsp-phone:lang(fr) .scr{font-size:max(11px,4.05cqw)}
.neu-start .bsp-liste{flex:1;min-height:0;overflow-y:auto;overscroll-behavior-y:contain;scroll-snap-type:y mandatory;scrollbar-width:none;background:var(--muted)}
.neu-start .bsp-liste::-webkit-scrollbar{display:none}
.neu-start .bsp-liste.ende{overscroll-behavior-y:auto}
.neu-start .bsp-liste:focus-visible{outline-offset:-2px}
.neu-start .bsp-fall{height:100%;box-sizing:border-box;scroll-snap-align:start;scroll-snap-stop:always;overflow:hidden;padding:var(--sp-3) var(--sp-2);display:flex;flex-direction:column;gap:7px}
.neu-start .bsp-fall .tag-tag{margin:0 0 3px}
.neu-start .bsp-phone .msg{animation:none;max-width:90%;padding:7px 10px 6px;line-height:1.36;overflow-wrap:anywhere}
.neu-start .bsp-phone .msg b{font-weight:600}
.neu-start .bsp-phone .msg .zeit{font-size:max(10px,.7em)}
.neu-start .bsp-phone .tag-tag{font-size:max(10.5px,.78em)}
.neu-start .bsp-phone .wa-kopf small{font-size:max(11px,.8em)}
.neu-start .bsp-phone .wa-fuss{font-size:max(11px,.85em)}
.neu-start .bsp-erg{margin:auto 0 0;align-self:flex-start;display:inline-flex;align-items:center;gap:6px;max-width:100%;padding:5px 10px;border-radius:999px;background:var(--background);box-shadow:var(--shadow-sm);font-size:max(11px,.9em);font-weight:600;line-height:1.25;color:var(--success)}
.neu-start .bsp-erg::before{content:"";flex:0 0 auto;width:7px;height:7px;border-radius:50%;background:var(--success)}
.neu-start .bsp-erg.grau{color:var(--grey-700)}
.neu-start .bsp-erg.grau::before{background:var(--grey-700)}
.neu-start .bsp-pager{display:flex;align-items:center;justify-content:center;gap:var(--sp-3)}
.neu-start .bsp-pfeil{width:44px;height:44px;display:grid;place-items:center;padding:0;border:1px solid var(--border);border-radius:8px;background:var(--background);color:var(--foreground);cursor:pointer;transition:border-color .12s var(--ease),opacity .12s var(--ease)}
.neu-start .bsp-pfeil:hover:not(:disabled){border-color:var(--grey-300)}
.neu-start .bsp-pfeil:disabled{opacity:.35;cursor:default}
.neu-start .bsp-punkte{display:flex;gap:6px}
.neu-start .bsp-punkte i{display:block;width:6px;height:6px;border-radius:50%;background:var(--grey-300);transition:background .12s var(--ease)}
.neu-start .bsp-punkte i.on{background:var(--foreground)}
.neu-start .bsp-schluss{margin-top:var(--sp-8);max-width:46em;font-size:var(--fs-lg);font-weight:500;line-height:var(--lh-snug);color:var(--foreground)}
.neu-start .bsp-klein{margin-top:var(--sp-4);font-size:var(--fs-sm);color:var(--grey-500)}
@media(prefers-reduced-motion:no-preference){.neu-start .bsp-liste{scroll-behavior:smooth}}
@media(max-width:980px){
.neu-start .bsp-telefone{grid-template-columns:minmax(0,1fr)}
.neu-start .bsp-ph{margin-bottom:var(--sp-10)}
.neu-start .bsp-ph:last-child{margin-bottom:0}
}
.neu-start .aufruf{border-top:1px solid var(--border);background:var(--grey-50);padding:var(--sp-6) 0}
.neu-start .aufruf .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:var(--sp-4) var(--sp-8);text-align:center}
.neu-start .aufruf p{font-size:var(--fs-lg);font-weight:600;letter-spacing:-.01em;line-height:var(--lh-snug)}
.neu-start .aufruf-knoepfe{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--sp-3)}
@media(max-width:700px){
.neu-start .aufruf-knoepfe{flex-direction:column;align-items:center;width:100%}
.neu-start .aufruf-knoepfe .btn{width:100%}
}
.neu-start .stufen{width:100%;border-collapse:collapse;font-size:var(--fs-sm);font-variant-numeric:tabular-nums}
.neu-start .stufen caption{caption-side:top;text-align:left;font-size:var(--fs-sm);font-weight:600;color:var(--grey-700);padding-bottom:var(--sp-2)}
.neu-start .stufen th,.neu-start .stufen td{padding:7px 8px;border-top:1px solid var(--border);text-align:left;font-weight:400;white-space:nowrap}
.neu-start .stufen thead th{border-top:0;border-bottom:1px solid var(--grey-200);font-size:var(--fs-xs);font-weight:600;color:var(--grey-700);white-space:normal;vertical-align:bottom}
.neu-start .stufen .z{text-align:right}
.neu-start .stufen tbody th{font-weight:500}
.neu-start .stufen tbody tr{transition:background .2s var(--ease)}
.neu-start .stufen tr.aktuell{background:var(--grey-50)}
.neu-start .stufen tr.aktuell th,.neu-start .stufen tr.aktuell td{font-weight:700;color:var(--foreground)}
.neu-start .stufen tr.aktuell th{box-shadow:inset 3px 0 0 var(--almost-black)}
.neu-start .schluss .kick{color:var(--grey-300)}
.neu-start .schluss h2{margin-top:var(--sp-3)}
.neu-start .schluss .t-lead{max-width:38em}
.neu-start .tform p{margin:0}
.neu-start .tform .t-erkl{max-width:none;font-size:var(--fs-base);font-weight:600;opacity:.95}
.neu-start .tform .t-klein{max-width:none;font-size:var(--fs-sm);opacity:.65}
@media(max-width:700px){
.neu-start .tform .t-klein{text-align:center}
}

/* ---------- Hero: Text links, Bühne rechts (ab 1180 px zweispaltig, Hero Unterkante = Viewport Unterkante) ---------- */
.neu-start .hero { --hero-pad: clamp(16px, 2vw, 24px); padding: var(--hero-pad) 0 clamp(24px, 4vw, 48px); }
.neu-start .hero-wrap { max-width: 1440px; margin-inline: auto; padding-inline: 24px; }
@media (max-width: 520px) { .neu-start .hero-wrap { padding-inline: 16px; } }
.neu-start .hero-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sp-6); }
.neu-start .hero h1 { font-size: clamp(2rem, 4.2vw, 3.2rem); line-height: 1; letter-spacing: -.045em; font-weight: 700; margin-top: var(--sp-2); }
@media (max-width: 520px) { .neu-start .hero h1 { font-size: 1.9rem; } }
.neu-start .hero .sub { font-size: clamp(1.15rem, 2.2vw, 1.6rem); line-height: 1.25; letter-spacing: -.02em; font-weight: 600; color: var(--foreground); margin-top: var(--sp-4); }
.neu-start .hero .lead { margin-top: var(--sp-3); max-width: 44em; }

/* Schrittleiste: fünf nummerierte Felder, aktives Feld Almost Black mit weisser Schrift, darunter ein Satz zum Schritt */
.neu-start .hs { display: grid; gap: var(--sp-2); min-width: 0; align-content: start; }
.neu-start .hs-leiste { display: grid; gap: var(--sp-2); background: var(--background); }
.neu-start .hs-stufen { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; counter-reset: st; }
.neu-start .hs-stufen li { counter-increment: st; min-width: 0; }
.neu-start .hs-stufen button {
  position: relative; width: 100%; height: 100%; min-height: 44px; padding: 6px 8px 6px 38px; text-align: left; cursor: pointer;
  border: 1.5px solid var(--grey-100); border-radius: 8px; background: var(--white); color: var(--grey-600);
  font: 500 .8125rem/1.25 inherit; transition: background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease);
}
.neu-start .hs-stufen button:hover { border-color: var(--grey-300); }
.neu-start .hs-stufen button::before {
  content: counter(st); position: absolute; left: 9px; top: 50%; transform: translateY(-50%); width: 22px; height: 22px; border-radius: 50%;
  background: var(--grey-100); color: var(--grey-800); display: grid; place-items: center; font-size: 12px; font-weight: 600; transition: background .3s var(--ease), color .3s var(--ease);
}
.neu-start .hs-stufen button.done { color: var(--foreground); border-color: var(--grey-300); }
.neu-start .hs-stufen button.done::before { background: var(--grey-500); color: var(--white); }
.neu-start .hs-stufen button.on { background: var(--almost-black); border-color: var(--almost-black); color: var(--white); }
.neu-start .hs-stufen button.on::before { background: var(--white); color: var(--almost-black); }
.neu-start .hs-satz { margin: 0; min-height: 2.8em; font-size: var(--fs-base); line-height: 1.4; color: var(--grey-700); }

/* Bühne: heller Rahmen (Weiss, 1 px Grey 100, Radius 16 px), links das Telefon, rechts das Board */
.neu-start .hs-rahmen { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sp-4); background: var(--white); border: 1px solid var(--grey-100); border-radius: 16px; padding: var(--sp-3); min-width: 0; }
.neu-start .hs-phone { width: min(100%, 300px); aspect-ratio: 9/19.5; margin-inline: auto; background: var(--foreground); border-radius: 44px; padding: 9px; box-shadow: var(--shadow-lg); container-type: inline-size; position: relative; }
.neu-start .hs-board { position: relative; display: flex; flex-direction: column; min-width: 0; background: var(--white); border: 1px solid var(--grey-100); border-radius: var(--radius); box-shadow: var(--shadow-card); overflow: hidden; color: var(--grey-800); }
.neu-start .hs-bar { height: 48px; flex: none; border-bottom: 1px solid var(--grey-100); display: flex; align-items: center; padding: 0 14px; gap: 14px; }
.neu-start .hs-logo { height: 24px; width: auto; max-width: none; color: var(--almost-black); }
.neu-start .hs-live { margin-left: auto; font-size: 12px; color: var(--grey-600); display: flex; align-items: center; gap: 7px; white-space: nowrap; }
.neu-start .hs-live i { width: 8px; height: 8px; border-radius: 50%; background: var(--success); animation: neu-puls 1.8s infinite; }
@keyframes neu-puls { 0% { box-shadow: 0 0 0 0 rgba(21, 128, 61, .5); } 70% { box-shadow: 0 0 0 8px rgba(21, 128, 61, 0); } 100% { box-shadow: 0 0 0 0 rgba(21, 128, 61, 0); } }
.neu-start .hs-titelzeile { display: flex; align-items: center; gap: 12px; padding: 10px 14px 4px; flex: none; }
.neu-start .hs-titel { font-size: 19px; font-weight: 500; letter-spacing: -.01em; color: var(--almost-black); }
.neu-start .hs-anzahl { color: var(--grey-500); font-size: 13px; padding-left: 10px; border-left: 1px solid var(--grey-100); }
.neu-start .hs-anzahl b { font-weight: 500; font-variant-numeric: tabular-nums; }
.neu-start .hs-filter { display: flex; gap: 6px; padding: 0 14px 8px; opacity: .45; overflow: hidden; flex: none; }
.neu-start .hs-filter span { flex: 0 0 auto; height: 22px; min-width: 76px; border: 1px solid var(--grey-100); border-radius: 4px; font-size: 11px; color: var(--grey-500); padding: 0 8px; display: flex; align-items: center; filter: blur(.5px); }
.neu-start .hs-spalten { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding: 0 14px 14px; flex: 1; min-height: 0; }
.neu-start .hs-sp { display: flex; flex-direction: column; min-width: 0; min-height: 0; }
.neu-start .hs-sp-titel { margin: 0 0 8px; font-size: 12.5px; background: var(--grey-50); padding: 6px 10px; border-radius: 4px; color: var(--grey-800); flex: none; white-space: nowrap; }
.neu-start .hs-sp-titel b { font-weight: 400; color: var(--grey-500); font-variant-numeric: tabular-nums; }
.neu-start .hs-karten { position: relative; display: flex; flex-direction: column; gap: 8px; flex: 1; min-height: 0; overflow: hidden; }
.neu-start .hs-weg { display: none !important; }

/* Karte wie in der PROPbase Demo: Icon, Titel, Nummer; Felder; Abzeichen und Chevron; in «Erledigt» ein grünes Häkchen im Kreis */
.neu-start .hs-karte, .neu-start .hs-flug {
  position: relative; flex: none; background: var(--white); border: 1px solid var(--grey-100); border-radius: 6px; padding: 8px 10px 7px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .1), 0 6px 16px rgba(0, 0, 0, .05); opacity: 0; transform: translateY(-8px);
  transition: opacity .4s, transform .4s, background .4s, border-color .4s; will-change: transform;
}
.neu-start .hs-karte.show, .neu-start .hs-flug.show { opacity: 1; transform: none; }
.neu-start .hs-karte.hs-bereit { transform: none; } /* M8: die echte Karte wartet unsichtbar an ihrem Platz, bis die Ticketkarte landet */
.neu-start .hs-k-kopf { display: flex; gap: 6px; align-items: flex-start; margin-bottom: 4px; }
.neu-start .hs-ic { width: 14px; height: 14px; flex: none; margin-top: 1px; color: var(--grey-700); }
.neu-start .hs-ic svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.neu-start .hs-k-titel { flex: 1; min-width: 0; font-size: 12px; font-weight: 600; line-height: 1.25; color: var(--almost-black); overflow-wrap: normal; word-break: normal; hyphens: manual; }
.neu-start .hs-k-nr { font-size: 11px; color: var(--grey-500); white-space: nowrap; }
.neu-start .hs-zeile { display: flex; flex-wrap: wrap; column-gap: 5px; font-size: 11px; line-height: 1.3; margin: 1px 0; min-width: 0; }
.neu-start .hs-zeile > span:first-child { flex: none; color: var(--grey-500); }
.neu-start .hs-zeile .v { min-width: 0; border-radius: 2px; padding: 0 2px; margin: 0 -2px; transition: background .3s; overflow-wrap: normal; word-break: normal; }
.neu-start .hs-zeile .v b { font-weight: 700; color: var(--almost-black); }
.neu-start .hs-zeile .v.link { color: var(--grey-700); text-decoration: underline; text-decoration-color: var(--grey-300); text-underline-offset: 2px; }
.neu-start .hs-zeile .v.flash { background: var(--grey-100); }
.neu-start .hs-zeile .st { display: inline-flex; align-items: center; gap: 3px; }
.neu-start .hs-zeile .st i { display: inline-grid; place-items: center; width: 12px; height: 12px; border-radius: 50%; color: var(--white); }
.neu-start .hs-zeile .st i svg { width: 8px; height: 8px; fill: none; stroke: currentColor; stroke-width: 3.5; stroke-linecap: round; stroke-linejoin: round; }
.neu-start .hs-zeile .st i.ok { background: var(--success); }
.neu-start .hs-zeile .st i.no { background: var(--danger); }
.neu-start .hs-k-fuss { display: flex; justify-content: space-between; align-items: center; margin-top: 5px; min-height: 16px; color: var(--grey-500); }
.neu-start .hs-karte .tag, .neu-start .hs-flug .tag { font-size: 11px; padding: 1px 7px; border-radius: 9px; background: var(--grey-100); color: var(--grey-700); font-weight: 700; opacity: 0; transition: opacity .3s; }
.neu-start .hs-karte .tag.show, .neu-start .hs-flug .tag.show { opacity: 1; }
.neu-start .hs-karte .tag.ai, .neu-start .hs-flug .tag.ai { background: var(--success); color: var(--white); }
.neu-start .hs-karte .chev svg, .neu-start .hs-flug .chev svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.neu-start .hs-fertig { position: absolute; right: 8px; bottom: 6px; opacity: 0; transition: opacity .3s; }
.neu-start .hs-fertig span { width: 22px; height: 22px; border-radius: 50%; background: var(--success); display: grid; place-items: center; transform: scale(.4); transition: transform .4s cubic-bezier(.2, 1.4, .4, 1); }
.neu-start .hs-fertig svg { width: 13px; height: 13px; stroke: var(--white); stroke-width: 3.5; fill: none; stroke-linecap: round; stroke-linejoin: round; }
.neu-start .hs-karte.is-done { background: color-mix(in srgb, var(--success) 8%, var(--white)); border-color: var(--success); }
.neu-start .hs-karte.is-done .hs-fertig { opacity: 1; }
.neu-start .hs-karte.is-done .hs-fertig span { transform: scale(1); }
.neu-start .hs-karte.is-done .chev { visibility: hidden; }

.neu-start .hs-tools { display: flex; flex-wrap: wrap; gap: 8px 18px; align-items: center; justify-content: center; }
.neu-start .hs-tools .btn { min-height: 44px; }
.neu-start .hs-hinweis { font-size: var(--fs-sm); color: var(--grey-500); }

/* Telefon im Hero */
.neu-start .hs-phone .scr { font-size: max(11px, 4.1cqw); }
/* B11: im Telefon nichts unter 11 px, auch wenn es bei 1280×720 nur 200 px breit ist (die Grundschrift ist schon 11 px, die kleinen Zeilen
   darin rechnen mit em und fielen bis auf 7,5 px). Die Werte entsprechen den Verhältnissen der Regeln weiter oben. */
.neu-start .hs-phone .msg .zeit { font-size: max(11px, .68em); }
.neu-start .hs-phone .chip { font-size: max(11px, .66em); }
.neu-start .hs-phone .tag-tag, .neu-start .hs-phone .sys { font-size: max(11px, .72em); }
.neu-start .hs-phone .mk-duo figcaption { font-size: max(11px, .78em); }
.neu-start .hs-phone .vd { font-size: max(11px, .72em); }
.neu-start .hs-phone .vt { font-size: max(11px, .86em); }
.neu-start .hs-phone .mk-s, .neu-start .hs-phone .mk-r { font-size: max(11px, .8em); }
.neu-start .hs-phone .mk ul { font-size: max(11px, .82em); }
.neu-start .hs-phone .wa-kopf small { font-size: max(11px, .8em); }
.neu-start .hs-phone .wa-fuss { font-size: max(11px, .85em); }
.neu-start .hs-phone .lp-d, .neu-start .hs-phone .lp-av { font-size: max(11px, .92em); }
.neu-start .hs-phone .lp-dom { font-size: max(11px, .84em); }

@media (min-width: 960px) {
  .neu-start .hs-rahmen { grid-template-columns: 300px minmax(560px, 1fr); gap: var(--sp-4); align-items: stretch; }
  .neu-start .hs-phone { margin: 0; }
}
@media (min-width: 1180px) {
  .neu-start .hero-grid { grid-template-columns: minmax(280px, 1fr) minmax(0, 2.8fr); gap: var(--sp-6); align-items: center; }
  .neu-start .hero h1 { font-size: clamp(2.1rem, 3.1vw, 3rem); }
  .neu-start .hero .sub { font-size: clamp(1.15rem, 1.6vw, 1.45rem); }
  .neu-start .hero .lead { max-width: 30em; }
  /* Hero Unterkante = Fensterunterkante: der Hero ist so hoch wie das Fenster unter dem Kopf (56 px plus 1 px Linie), die Bühne füllt den
     Rest (Schrittleiste oben, «Nochmals abspielen» unten, dazwischen Telefon und Board). Kleine Fenster: mindestens 660 px, dann
     läuft der Hero über den Fold hinaus. Hohe Fenster: die Bühne wird höchstens 900 px hoch, der Text und die Bühne stehen mittig. */
  .neu-start .hero { --kopf: calc(var(--neu-nav-h) + 1px); box-sizing: border-box; height: max(calc(100svh - var(--kopf)), 660px); padding-bottom: var(--hero-pad); }
  .neu-start .hero-wrap, .neu-start .hero-grid { height: 100%; }
  .neu-start .hs { height: 100%; min-height: 0; max-height: 900px; align-self: center; grid-template-rows: auto minmax(0, 1fr) auto; align-content: stretch; }
  .neu-start .hs-rahmen { grid-template-columns: auto minmax(560px, 1fr); height: 100%; min-height: 0; gap: var(--sp-3); }
  .neu-start .hs-phone { height: 100%; width: auto; max-width: none; }
  .neu-start .hs-board { height: 100%; min-height: 0; }
  /* B10: die zwei Hero Knöpfe stehen nebeneinander (Abstand 12 px, gleich hoch); in der schmalen Textspalte brechen sie die Beschriftung um */
  .neu-start .hero .cta-row { flex-wrap: nowrap; gap: 12px; align-items: stretch; }
  .neu-start .hero .cta-row .btn { flex: 1 1 auto; padding: 0 var(--sp-4); line-height: 1.15; text-align: center; }
}
/* Gestapelt (unter 960 px): Chat, dann Board mit den drei Spalten untereinander, je eine Karte sichtbar; die Schrittleiste bleibt oben stehen */
@media (max-width: 1179px) {
  .neu-start .hs-leiste { position: sticky; top: var(--neu-nav-h); z-index: 5; padding: var(--sp-2) 0; border-bottom: 1px solid var(--grey-100); }
}
@media (max-width: 959px) {
  .neu-start .hs-spalten { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .neu-start .hs-karten { flex: none; overflow: visible; }
  .neu-start .hs-filter { display: none; }
}
@media (max-width: 639px) {
  .neu-start .hs-stufen button { padding: 0; text-align: center; display: grid; place-items: center; }
  .neu-start .hs-stufen button::before { position: static; transform: none; }
  .neu-start .hs-lab { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .neu-start .hs-satz { font-size: .875rem; min-height: 3.6em; }
  .neu-start .hs-aktiv { display: inline; font-weight: 700; color: var(--foreground); }
  .neu-start .hs-aktiv::after { content: ": "; }
}
.neu-start .hs-aktiv { display: none; }
@media (max-width: 639px) { .neu-start .hs-aktiv { display: inline; } }
/* M8 · Fassung 3: grosse Ticketkarte über dem abgedunkelten Board. Sie füllt sich Zeile für Zeile (Aufblitzen wie .flash), dreht sich um
   die senkrechte Achse und fliegt als kompakte Kanban Karte oben in «Offen» (hero-szene.ts, ticketAblauf). Die Karte folgt dem Ticket der
   Demo (features/demo-neu, 12-ticket.html): Monospace Kopf, Zeilenbezeichner in Grossbuchstaben, Fuss «Von ailean angelegt». */
.neu-start .hs-bar, .neu-start .hs-titelzeile, .neu-start .hs-filter, .neu-start .hs-spalten { transition: opacity .4s; }
.neu-start .hs-board.is-ticket .hs-bar, .neu-start .hs-board.is-ticket .hs-titelzeile, .neu-start .hs-board.is-ticket .hs-filter, .neu-start .hs-board.is-ticket .hs-spalten { opacity: .35; }
.neu-start .hs-ticketlage { position: absolute; inset: 0; z-index: 4; display: grid; place-items: center; padding: 14px; pointer-events: none; overflow: hidden; }
.neu-start .hs-ticketlage[hidden] { display: none; }
.neu-start .tk-karte { position: relative; box-sizing: border-box; width: min(100%, 520px); max-height: 100%; background: var(--white); border: 1px solid var(--grey-100); border-radius: 12px; padding: 16px 18px 14px; box-shadow: 0 12px 40px rgba(0, 0, 0, .12); color: var(--grey-800); font-size: 14px; will-change: transform; }
.neu-start .tk-kopf { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.neu-start .tk-id { font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; font-size: 12px; font-weight: 600; letter-spacing: .02em; color: var(--grey-500); }
.neu-start .tk-status { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; padding: 3px 10px; border-radius: 999px; border: 1px solid var(--red); color: var(--red-600); background: var(--white); white-space: nowrap; }
.neu-start .tk-titel { margin-top: 8px; font-size: 17px; font-weight: 700; letter-spacing: -.015em; line-height: 1.25; color: var(--almost-black); }
.neu-start .tk-zeilen { display: grid; grid-template-columns: max-content minmax(0, 1fr); column-gap: 14px; margin-top: 12px; border-top: 1px solid var(--grey-100); }
.neu-start .tk-zeile { display: contents; }
.neu-start .tk-zeile > span { padding: 6px 0; border-bottom: 1px solid var(--grey-50); line-height: 1.4; transition: opacity .2s, transform .2s, background .3s; }
.neu-start .tk-zeile .k { padding-top: 8px; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--grey-500); white-space: nowrap; }
.neu-start .tk-zeile .v { font-weight: 500; color: var(--almost-black); overflow-wrap: anywhere; border-radius: 2px; }
.neu-start .tk-zeile .v b { font-weight: 700; }
.neu-start .tk-zeile .v { position: relative; }
/* Roter Lichtsaum wie in der Demo (tk-sparkle): zwei weiche rote Verläufe, kurz sichtbar */
.neu-start .tk-glanz { position: relative; }
.neu-start .tk-glanz::after { content: ""; position: absolute; inset: -4px; border-radius: inherit; pointer-events: none; background: radial-gradient(circle at 20% 30%, rgba(255, 0, 0, .18), transparent 40%), radial-gradient(circle at 80% 70%, rgba(255, 0, 0, .15), transparent 40%); animation: neu-tkglanz .9s ease-out forwards; }
@keyframes neu-tkglanz { 0% { opacity: 0; transform: scale(.96); } 30% { opacity: 1; } 100% { opacity: 0; transform: scale(1.04); } }
.neu-start .tk-zeile.is-leer .v { color: var(--grey-400); }
.neu-start .tk-zeile:not(.is-in):not(.is-leer) .v { opacity: 0; transform: translateX(-8px); }
.neu-start .tk-zeile:not(.is-in):not(.is-leer) .k { opacity: .45; }
.neu-start .tk-zeile[data-k="frist"] .k::before, .neu-start .tk-zeile[data-k="kosten"] .k::before { content: "\25C6"; margin-right: 5px; font-size: 9px; color: var(--red); vertical-align: 1px; }
.neu-start .tk-stern { display: inline-block; margin-right: 5px; color: var(--red); animation: neu-tkstern 1s ease-out forwards; }
@keyframes neu-tkstern { 0% { opacity: 0; transform: scale(.4) rotate(-30deg); } 25% { opacity: 1; transform: scale(1.25) rotate(10deg); } 100% { opacity: 0; transform: scale(.8); } }
.neu-start .tk-fuss { margin-top: 10px; display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--grey-500); }
.neu-start .tk-fuss svg { width: 14px; height: 14px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
/* Flieger: die kompakte Kanban Karte, die nach der Drehung zur Spalte «Offen» fliegt (nicht .hs-karte, damit sie nicht als Boardkarte zählt) */
.neu-start .hs-flug { position: absolute; z-index: 5; margin: 0; pointer-events: none; will-change: transform; }
@media (max-height: 760px) and (min-width: 960px) {
  .neu-start .tk-karte { padding: 12px 16px 10px; }
  .neu-start .tk-zeilen { margin-top: 8px; }
  .neu-start .tk-zeile > span { padding-top: 4px; padding-bottom: 4px; }
  .neu-start .tk-zeile .k { padding-top: 6px; }
}
@media (max-width: 959px) { .neu-start .hs-ticketlage { padding: 10px; } .neu-start .tk-karte { width: 100%; } }
@media (prefers-reduced-motion: reduce) {
  .neu-start .hs-live i { animation: none; }
  .neu-start .hs-karte, .neu-start .hs-karte * { transition: none !important; }
  .neu-start .hs-bar, .neu-start .hs-titelzeile, .neu-start .hs-filter, .neu-start .hs-spalten, .neu-start .tk-zeile > span { transition: none !important; }
}

/* ---------- Anpassungen für die Seite im Repo ---------- */
/* Schalter bei «Ihre Regeln»: Tippfläche 52 x 44 px, sichtbare Fläche 44 x 26 px (Mockup: 26 px hoch, hier behoben) */
.neu-start .sw { flex: 0 0 auto; position: relative; width: 52px; height: 44px; padding: 0; border: 0; background: transparent; border-radius: 8px; cursor: pointer; }
.neu-start .sw::before { content: ""; position: absolute; left: 4px; top: 9px; width: 44px; height: 26px; border-radius: 999px; background: var(--border); transition: background .2s; }
.neu-start .sw i { position: absolute; top: 12px; left: 7px; width: 20px; height: 20px; border-radius: 50%; background: var(--background); box-shadow: var(--shadow-sm); transition: transform .2s; }
.neu-start .sw[aria-checked=true] { background: transparent; }
.neu-start .sw[aria-checked=true]::before { background: var(--almost-black); }
.neu-start .sw[aria-checked=true] i { transform: translateX(18px); }
.neu-start .ringe { grid-template-columns: minmax(0, 1fr); }
.neu-start .kachel .zahl [data-kpi-state=unavailable] + .suf { display: none; }
.neu-start .kachel .zahl { display: block; }
.neu-start .logo-bild { width: auto; }
@media (max-width: 700px) {
  .neu-start .bf input { min-height: 44px; }
  .neu-start .tform input[type=number] { min-height: 44px; }
  .neu-start .hs-tools { flex-direction: column; }
}