/* Buklea – weiss, blau, schwarz. Systemschriften (keine externen Schriften, datenschutzfreundlich). */
:root{--bg:#fff;--fg:#0b1220;--muted:#5b6578;--line:#e6eaf1;--soft:#f5f7fb;--accent:#1f4fd6;--accent-2:#163fae;--accent-soft:#eef3fe;--accent-line:#cbd8fb;
--ok:#11784a;--ok-soft:#e5f5ed;--warn:#935600;--warn-soft:#fdf3e1;--bad:#b42318;--bad-soft:#fdecea;--shadow:0 1px 2px rgba(15,35,90,.06),0 8px 24px rgba(15,35,90,.07);
--font:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;color-scheme:light}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--fg)}
body{font:16px/1.5 var(--font);-webkit-font-smoothing:antialiased;min-height:100vh;display:flex;flex-direction:column}
main{flex:1;padding-block:20px 48px;width:100%;min-width:0}
.top,.foot{width:100%}
a{color:var(--accent)}
h1,h2,h3{line-height:1.15;letter-spacing:-.02em;margin:0 0 12px;text-wrap:balance}
h1{font-size:clamp(26px,5vw,36px)}h2{font-size:20px;margin-top:24px}h3{font-size:16px}
p{margin:0 0 12px}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.wrap{max-width:980px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}
.narrow{max-width:520px;margin:0 auto}
.muted{color:var(--muted)}.sel{user-select:all}.center{text-align:center;justify-items:center}.big{font-size:18px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
/* Kopf */
.top{position:sticky;top:0;z-index:5;background:rgba(255,255,255,.96);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.topin{display:flex;align-items:center;gap:12px;padding-block:10px}
.logo{display:flex;align-items:center;gap:7px;font-weight:800;font-size:22px;letter-spacing:-.03em;color:var(--fg);text-decoration:none;margin-right:auto}
.logo b{color:var(--accent)}
.nav{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.nav a,.lnk{color:var(--fg);text-decoration:none;font-weight:600;font-size:14.5px;padding:7px 10px;border-radius:10px;background:none;border:0;cursor:pointer;font-family:inherit}
.nav a:hover,.lnk:hover,.nav a.on{background:var(--soft)}
.lnk{color:var(--accent)}
.inl{display:inline}
.langs{position:relative}
.langs summary{list-style:none;cursor:pointer;font-weight:700;font-size:13px;border:1px solid var(--line);border-radius:10px;padding:6px 10px}
.langs summary::-webkit-details-marker{display:none}
.langs div{position:absolute;right:0;top:calc(100% + 6px);background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);display:grid;min-width:140px;padding:6px;z-index:9}
.langs div a{padding:8px 10px}
/* Fuss */
.foot{border-top:1px solid var(--line);color:var(--muted);font-size:13.5px}
.foot .wrap{display:flex;flex-wrap:wrap;gap:8px 20px;justify-content:space-between;padding-block:20px}
.foot a{color:var(--muted);margin-right:12px}
/* Bausteine */
.flash{border-radius:12px;padding:12px 14px;margin:0 0 16px;background:var(--accent-soft);border:1px solid var(--accent-line)}
.flash.ok{background:var(--ok-soft);border-color:#b9e3cc}.flash.err{background:var(--bad-soft);border-color:#f2c4bf}
.info{background:var(--accent-soft);border:1px solid var(--accent-line);border-radius:12px;padding:10px 14px;font-size:14.5px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:700 15px var(--font);border-radius:12px;padding:12px 18px;cursor:pointer;border:1px solid var(--accent);background:var(--accent);color:#fff;text-decoration:none;box-shadow:0 4px 14px rgba(31,79,214,.22)}
.btn:hover{background:var(--accent-2)}
.btn.ghost{background:#fff;color:var(--fg);border-color:var(--line);box-shadow:none}.btn.ghost:hover{background:var(--soft)}
.btn.sm{padding:7px 12px;font-size:13.5px;border-radius:10px;box-shadow:none}
.btn.big{padding:15px 20px;font-size:16px;width:100%}
.btn.danger{background:#fff;color:var(--bad);border-color:#f2c4bf;box-shadow:none}.btn.danger:hover{background:var(--bad-soft)}
.danger{color:var(--bad);font-weight:700;cursor:pointer}
.card{border:1px solid var(--line);border-radius:16px;padding:16px;background:#fff;box-shadow:var(--shadow);margin-bottom:12px}
.stack{display:grid;gap:14px}
.fld{display:grid;gap:5px;font-weight:600;font-size:14px;min-width:0;border:0;padding:0;margin:0}
.fld legend{font-weight:600;font-size:14px;margin-bottom:6px;padding:0}
input,select,textarea{font:16px var(--font);color:var(--fg);background:#fff;border:1px solid var(--line);border-radius:10px;padding:11px 12px;width:100%;min-width:0}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
input[type=checkbox],input[type=radio]{width:18px;height:18px;padding:0;accent-color:var(--accent);flex:none;margin-top:2px}
.chk{display:flex;gap:10px;align-items:flex-start;font-weight:500;font-size:14.5px;cursor:pointer}
.grid2,.grid3,.grid4{display:grid;gap:12px;align-items:end}
.grid2{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.grid3{grid-template-columns:2fr 1fr auto}.grid4{grid-template-columns:2fr 1fr 1fr auto}
@media(max-width:640px){.grid3,.grid4{grid-template-columns:1fr 1fr}.grid3>.fld:first-of-type,.grid4>.fld:first-of-type{grid-column:1/-1}}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.chip{display:inline-flex;align-items:center;gap:6px;border:1.5px solid var(--accent-line);background:#fff;color:var(--fg);border-radius:999px;padding:7px 14px;font-weight:700;font-size:14px;text-decoration:none;font-variant-numeric:tabular-nums}
.chip:hover{border-color:var(--accent)}.chip.sel{background:var(--accent);border-color:var(--accent);color:#fff}
.chip.fit{background:var(--accent-soft)}.chip.off{color:var(--muted);border-color:var(--line);cursor:default}
.pill{display:inline-block;font-size:11.5px;font-weight:800;border-radius:999px;padding:2px 9px;white-space:nowrap}
.p-ok,.p-active{background:var(--ok-soft);color:var(--ok)}.p-pending{background:var(--warn-soft);color:var(--warn)}
.p-cancelled,.p-blocked{background:var(--soft);color:var(--muted)}.p-noshow{background:var(--bad-soft);color:var(--bad)}
.empty{text-align:center;color:var(--muted);padding:40px 0}
/* Start */
.hero{padding-block:16px 8px}.lead{font-size:18px;color:var(--muted);max-width:56ch}
.sbox{display:flex;gap:8px;margin:18px 0}.sbox input{flex:1}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px;margin-bottom:24px}
.bcard{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;border:1px solid var(--line);border-radius:16px;padding:14px;color:var(--fg);text-decoration:none;box-shadow:var(--shadow);background:#fff}
.bcard:hover{border-color:var(--accent)}
.bav{width:48px;height:48px;border-radius:14px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;font-weight:800}
.bav.big{width:64px;height:64px;font-size:20px;margin-top:-32px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow)}
.bt{display:grid;min-width:0}.bt small{color:var(--muted);font-size:13px}
.chev{color:#a3abba;font-size:22px}
.cta{border-radius:20px;padding:24px;background:linear-gradient(120deg,#1f4fd6,#4a78f2);color:#fff;margin-top:24px;display:grid;gap:6px;justify-items:start}
.cta .btn{background:#fff;color:var(--accent);border-color:#fff}
/* Betrieb */
.bhero{border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:var(--shadow);margin-bottom:16px}
.cover{height:88px;background:linear-gradient(120deg,#1f4fd6,#3a6df0 60%,#7aa0ff)}
.bhb{padding:0 16px 14px}.bhb h1{margin:8px 0 2px}
.list{border:1px solid var(--line);border-radius:16px;overflow:hidden;margin-bottom:16px}
.row{display:grid;grid-template-columns:auto 1fr auto auto;gap:12px;align-items:center;padding:13px 14px;border-top:1px solid var(--line);color:var(--fg);text-decoration:none}
.row:first-child{border-top:0}a.row:hover{background:var(--soft)}
.row .rt{display:grid;min-width:0}.row .rt small{color:var(--muted);font-size:13px}.row .ri{color:var(--accent);display:grid}
.row .acts{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;align-items:center}
.price{font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap}
/* Buchung */
.sum{border:1px solid var(--line);border-radius:16px;padding:14px 16px;margin-bottom:16px;box-shadow:var(--shadow);position:relative}
.sum .price{position:absolute;right:16px;top:14px}
.lbl{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.aibox{border:1px solid var(--accent-line);background:linear-gradient(180deg,var(--accent-soft),#fff 85%);border-radius:16px;padding:14px;margin-bottom:16px}
.aihead{display:inline-block;font-weight:800;color:#fff;background:var(--accent);font-size:11px;letter-spacing:.07em;text-transform:uppercase;border-radius:999px;padding:4px 10px}
.aibox p{margin:8px 0 12px;font-size:14px;color:var(--muted)}
.picks{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:8px}
.pick{border:1px solid var(--line);background:#fff;border-radius:12px;padding:10px;color:var(--fg);text-decoration:none;min-width:0}
.pick:hover{border-color:var(--accent)}.pick b{display:block;font-size:22px;font-variant-numeric:tabular-nums}.pick span{display:block;font-size:12.5px;color:var(--muted)}
.dayrow{border-top:1px solid var(--line);padding-top:12px}.dlabel{font-weight:700;margin-bottom:8px}
.policy{border:1px solid var(--line);background:var(--soft);border-radius:12px;padding:12px 14px;font-size:14.5px}
.hero2{text-align:center;padding:16px 0;display:grid;justify-items:center;gap:6px}
.okicon{width:72px;height:72px;border-radius:50%;background:var(--ok-soft);color:var(--ok);display:grid;place-items:center;font-size:34px;font-weight:800;box-shadow:0 0 0 9px #f2faf6}
.okicon.wait{background:var(--warn-soft);color:var(--warn);box-shadow:0 0 0 9px #fffaf0}
.row2{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:16px}.row2 .btn{flex:1 1 180px}
details.card summary{cursor:pointer}
/* Betriebsbereich */
.bh{font-size:24px}
.tabs{display:flex;gap:4px;overflow-x:auto;max-width:100%;border-bottom:1px solid var(--line);margin-bottom:18px}
.tabs a{white-space:nowrap;padding:10px 12px;font-weight:700;font-size:14.5px;color:var(--muted);text-decoration:none;border-bottom:3px solid transparent}
.tabs a.on{color:var(--accent);border-bottom-color:var(--accent)}
.pend{border:1px solid #f1d39b;background:var(--warn-soft);border-radius:14px;padding:12px 14px;margin-bottom:16px}
.prow{display:flex;justify-content:space-between;gap:10px;align-items:center;flex-wrap:wrap;padding:8px 0;border-top:1px solid #f1d39b}
.daynav{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:14px}.daynav input{width:auto}
.cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}
.col h3{display:flex;align-items:center;gap:8px}
.av{width:26px;height:26px;border-radius:50%;background:var(--accent);color:#fff;display:inline-grid;place-items:center;font-size:12px}
.blk{border:1px solid var(--accent-line);background:var(--accent-soft);border-radius:12px;padding:10px 12px;margin-bottom:8px;display:grid;gap:3px;font-size:14.5px}
.blk.s-pending{background:#fff;border:1.5px dashed var(--warn)}.blk.s-cancelled{background:var(--soft);border-color:var(--line);opacity:.7}.blk.s-noshow{background:var(--bad-soft);border-color:#f2c4bf}
.blk .muted{font-size:13.5px}.note{font-size:13.5px;background:#fff;border-radius:8px;padding:6px 8px}
.blk .acts{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin-bottom:16px}
.kpi{border:1px solid var(--line);border-radius:14px;padding:12px 14px}.kpi small{display:block;color:var(--muted)}.kpi b{font-size:24px;font-variant-numeric:tabular-nums}
.qr{background:#fff;padding:8px;border:1px solid var(--line);border-radius:14px;line-height:0}.qr img,.qr canvas{width:220px;height:220px;image-rendering:pixelated}
@media(max-width:640px){.row{grid-template-columns:auto 1fr auto}.row .acts{grid-column:1/-1;justify-content:flex-start}}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
.row.svc{grid-template-columns:1fr auto auto}.row.two{grid-template-columns:1fr auto}
@media(max-width:640px){.row.two{grid-template-columns:1fr}.row.svc{grid-template-columns:1fr auto auto}}
.soon{text-align:center;display:grid;justify-items:center;gap:12px;padding-block:32px 8px}
.soon h1{font-size:clamp(30px,6vw,44px);max-width:16ch}
.soon .lead{margin:0 auto}
.soonlogo{width:96px;height:96px;border-radius:28px;background:var(--accent-soft);display:grid;place-items:center}
.soongrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));gap:12px;width:100%;justify-self:stretch;margin-inline:auto;max-width:720px;text-align:left;margin-top:12px}
.flex2{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap}
.modebox.is-soon{border-color:#f1d39b;background:var(--warn-soft)}.modebox.is-live{border-color:#b9e3cc;background:var(--ok-soft)}
.modebox code{display:block;background:#fff;border:1px solid var(--line);border-radius:10px;padding:8px 10px;font-size:13px;word-break:break-all}
