/* Beispiel-Webseiten von Marlox (Gestaltung 2, 14.10.2026): je Betrieb eigene Farbe und Schrift, echte Fotos, keine Emojis */
@font-face{font-family:"Inter";src:url("fonts/inter.woff2") format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Source Serif 4";src:url("fonts/source-serif-4.woff2") format("woff2");font-weight:200 900;font-display:swap}
@font-face{font-family:"Source Serif 4";src:url("fonts/source-serif-4-kursiv.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Space Grotesk";src:url("fonts/space-grotesk.woff2") format("woff2");font-weight:300 700;font-display:swap}
:root{--akzent:#1d6b72;--akzent-dunkel:#14535a;--akzent-hell:#e8f2f2;--hg:#ffffff;--hg-2:#f6f5f2;--tinte:#17191e;--text:#31353c;--leise:#666c77;--linie:#e3e1db;--titel:"Inter",system-ui,sans-serif;--radius:10px;
  --accent:var(--akzent);--muted:var(--leise);--line:var(--linie)}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--hg);color:var(--text);font:400 17px/1.65 "Inter",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block;-webkit-user-drag:none;-webkit-touch-callout:none}
a{color:var(--akzent)}
h1,h2,h3{font-family:var(--titel);color:var(--tinte);line-height:1.15;margin:0 0 .45em;font-weight:600;letter-spacing:-.01em}
h1{font-size:clamp(2.1rem,4.6vw,3.4rem)}
h2{font-size:clamp(1.6rem,3vw,2.2rem)}
h3{font-size:1.2rem}
p{margin:0 0 1em}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px}
.schmal{max-width:780px}

/* Hinweisleiste: klar als Beispiel erkennbar */
.demo-hinweis{background:#17191e;color:#c9ccd2;font-size:13px;line-height:1.4}
.demo-hinweis .wrap{display:flex;justify-content:space-between;align-items:center;gap:4px 16px;padding-top:2px;padding-bottom:2px;flex-wrap:wrap}
.demo-hinweis .wrap > span:first-child{padding:6px 0}
.demo-hinweis b{color:#fff}
.demo-aktionen{display:flex;gap:14px;align-items:center}
.demo-aktionen a,.demo-aktionen button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;color:#fff;font:600 13px/1 "Inter",sans-serif;background:none;border:0;padding:0 2px;cursor:pointer;text-decoration:underline;text-underline-offset:3px}

/* Kopf */
.dk{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.96);border-bottom:1px solid var(--linie);backdrop-filter:blur(6px)}
.dk .wrap{display:flex;align-items:center;gap:24px;height:68px}
.logo{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--tinte);font-family:var(--titel);font-weight:600;font-size:1.2rem}
.logo .zeichen{width:36px;height:36px;border-radius:8px;background:var(--akzent);color:#fff;display:grid;place-items:center;font-size:1rem;letter-spacing:.02em}
.menue{display:flex;align-items:center;gap:24px;margin-left:auto}
.menue a{color:var(--text);text-decoration:none;font-weight:500;font-size:.95rem}
.menue a:hover{color:var(--akzent)}
.menue-knopf{display:none;margin-left:auto;background:none;border:1px solid var(--linie);border-radius:8px;padding:8px 10px;cursor:pointer}
.menue-knopf span{display:block;width:20px;height:2px;background:var(--tinte);margin:4px 0}

/* Knöpfe */
.knopf,.menue a.knopf{display:inline-flex;align-items:center;justify-content:center;padding:12px 20px;border-radius:8px;background:var(--akzent);color:#fff;font-weight:600;font-size:.98rem;text-decoration:none;border:1px solid var(--akzent);transition:background-color .15s}
.knopf:hover,.menue a.knopf:hover{background:var(--akzent-dunkel);border-color:var(--akzent-dunkel);color:#fff}
.knopf.rand{background:transparent;color:var(--tinte);border-color:#cfccc4}
.knopf.rand:hover{border-color:var(--tinte);background:transparent;color:var(--tinte)}
.menue a.knopf{padding:9px 16px;font-size:.92rem}
.zeile{display:flex;gap:12px;flex-wrap:wrap}

/* Startbereich: großes Foto mit Text */
.held-voll{position:relative;min-height:560px;display:flex;align-items:flex-end;color:#fff;background:#222 var(--bild) center/cover no-repeat}
.held-voll::before{content:"";position:absolute;inset:0;background:rgba(15,16,19,.52)}
.held-voll .wrap{position:relative;width:100%;padding-top:96px;padding-bottom:72px}
.held-voll h1,.held-voll .kicker{color:#fff}
.held-voll .lead{color:rgba(255,255,255,.9)}
.held-voll .knopf.rand{color:#fff;border-color:rgba(255,255,255,.6)}
.held-voll .knopf.rand:hover{border-color:#fff;color:#fff}
.held-text{max-width:620px}
.kicker{font-size:.95rem;font-weight:600;color:var(--akzent);margin-bottom:14px}
.lead{font-size:1.15rem;max-width:36em;margin-bottom:26px}
/* Startbereich: Text neben Foto */
.held-teilung{padding:64px 0 56px;background:var(--hg)}
.held-teilung .wrap{display:grid;grid-template-columns:1fr 1.05fr;gap:52px;align-items:center}
.held-teilung .held-bild{border-radius:var(--radius);overflow:hidden;aspect-ratio:16/11}
.held-teilung .held-bild img{width:100%;height:100%;object-fit:cover}
.kursiv h1{font-style:italic;font-weight:400}

/* Infoleiste */
.infos{background:var(--hg-2);border-bottom:1px solid var(--linie)}
.infos .wrap{display:grid;grid-template-columns:repeat(4,1fr)}
.infos .wrap>div{padding:18px 18px 18px 0;border-right:1px solid var(--linie);margin-right:18px}
.infos .wrap>div:last-child{border-right:0;margin-right:0}
.infos span{display:block;font-size:.78rem;color:var(--leise);letter-spacing:.02em}
.infos b{color:var(--tinte);font-weight:600}

/* Abschnitte */
.abschnitt{padding:84px 0}
.abschnitt.hell{background:var(--hg-2)}
.kopf{max-width:660px;margin-bottom:36px}
.kopf p{color:var(--leise);font-size:1.08rem}

/* Preisliste / Leistungsliste */
.preisliste,.leistungsliste{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0 56px}
.preisliste li{display:flex;justify-content:space-between;align-items:baseline;gap:18px;padding:18px 0;border-bottom:1px solid var(--linie)}
.preisliste b,.leistungsliste b{display:block;color:var(--tinte);font-weight:600}
.preisliste span,.leistungsliste span{font-size:.94rem;color:var(--leise)}
.preisliste em{font-style:normal;font-weight:600;color:var(--tinte);white-space:nowrap}
.leistungsliste li{padding:18px 0;border-bottom:1px solid var(--linie)}

/* Über uns */
.teilung{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.teilung img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:var(--radius)}
.punkte{list-style:none;padding:0;margin:20px 0 0}
.punkte li{padding:9px 0 9px 26px;position:relative;border-top:1px solid var(--linie)}
.punkte li::before{content:"";position:absolute;left:2px;top:18px;width:10px;height:10px;border-radius:50%;background:var(--akzent)}

/* Stimmen */
.stimmen{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
.stimme{margin:0;padding-top:20px;border-top:2px solid var(--tinte)}
.sterne{color:var(--akzent);letter-spacing:2px;font-size:.95rem;margin-bottom:10px}
.stimme blockquote{margin:0 0 12px;font-family:var(--titel);font-size:1.12rem;line-height:1.5;color:var(--tinte)}
.stimme figcaption{font-size:.9rem;color:var(--leise)}

/* Kontakt */
.kontakt{display:grid;grid-template-columns:1.2fr 1fr;gap:56px;align-items:start}
.kontakt dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:12px 24px}
.kontakt dt{color:var(--leise);font-size:.92rem}
.kontakt dd{margin:0;color:var(--tinte);font-weight:500}
.anfahrt{background:var(--hg-2);border:1px solid var(--linie);border-radius:var(--radius);padding:26px}
.anfahrt p{margin:0 0 .6em}
.klein{font-size:.9rem;color:var(--leise)}

/* Fuß */
.df{background:#17191e;color:#b9bdc5;padding:40px 0 34px;font-size:.92rem}
.df-oben{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-bottom:18px;border-bottom:1px solid #2c3038;margin-bottom:16px}
.df b{color:#fff;font-family:var(--titel);font-size:1.05rem}
.df a{color:#fff}
.df-hinweis{margin:0;font-size:.85rem;line-height:1.6}

/* Termin-Demo (demo-booking.js) */
.book{background:#fff;border:1px solid var(--linie);border-radius:var(--radius);overflow:hidden;box-shadow:0 10px 30px -14px rgba(20,22,26,.22)}
.bbar{display:flex;gap:6px;padding:14px 20px;background:var(--hg-2);border-bottom:1px solid var(--linie);flex-wrap:wrap}
.bbar .s{flex:1;min-width:0;display:flex;align-items:center;gap:7px;font-size:.84rem;color:var(--leise)}
.bbar .s .n{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-weight:600;font-size:.78rem;background:#fff;border:1px solid var(--linie);flex:none}
.bbar .s.active{color:var(--tinte);font-weight:600}
.bbar .s.active .n{background:var(--akzent);border-color:var(--akzent);color:#fff}
.bbar .s.done .n{background:var(--akzent-hell);border-color:var(--akzent-hell);color:var(--akzent)}
.bbody{padding:24px 20px}
.bstep{display:none}.bstep.active{display:block}
.bh{font-family:var(--titel);font-size:1.25rem;font-weight:600;color:var(--tinte);margin-bottom:14px}
.bopts{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.bopt{text-align:left;background:#fff;border:1px solid #d7d4cc;border-radius:8px;padding:13px 15px;cursor:pointer;font:inherit;color:inherit}
.bopt:hover{border-color:var(--tinte)}
.bopt.sel,.bdate.sel{border-color:var(--akzent);box-shadow:0 0 0 1px var(--akzent) inset;background:var(--akzent-hell)}
.bopt .t{display:block;font-weight:600;color:var(--tinte)}
.bopt .m{font-size:.85rem;color:var(--leise)}
.bopt .p{float:right;font-weight:600;color:var(--tinte)}
.bdates{display:flex;gap:8px;overflow-x:auto;padding-bottom:8px;margin-bottom:14px}
.bdate{flex:none;width:62px;text-align:center;background:#fff;border:1px solid #d7d4cc;border-radius:8px;padding:8px 2px;cursor:pointer;font:inherit;color:inherit}
.bdate .wd,.bdate .mo{font-size:.72rem;color:var(--leise)}
.bdate .d{font-size:1.2rem;font-weight:600;color:var(--tinte)}
.bslots{display:grid;grid-template-columns:repeat(auto-fill,minmax(78px,1fr));gap:8px}
.bslot{background:#fff;border:1px solid #d7d4cc;border-radius:7px;padding:9px 0;cursor:pointer;font:inherit;color:var(--tinte);font-weight:500}
.bslot.sel{background:var(--akzent);border-color:var(--akzent);color:#fff}
.bslot:disabled{opacity:.35;cursor:not-allowed;text-decoration:line-through}
.bfields{display:grid;gap:14px}
.bfields label{display:block;font-size:.9rem;font-weight:600;color:var(--tinte);margin-bottom:5px}
.bfields input{width:100%;font:inherit;border:1px solid #d7d4cc;border-radius:7px;padding:11px 13px;background:#fff;color:var(--tinte)}
.bfields input:focus{outline:none;border-color:var(--akzent);box-shadow:0 0 0 3px var(--akzent-hell)}
.bnote{font-size:.88rem;color:var(--leise);margin:12px 0 0}
.bnav{display:flex;justify-content:space-between;gap:10px;margin-top:20px}
.btn{display:inline-flex;align-items:center;gap:8px;padding:14px 18px;min-height:44px;border-radius:8px;font:600 .95rem/1 "Inter",sans-serif;border:1px solid transparent;cursor:pointer}
.btn-primary{background:var(--akzent);color:#fff}
.btn-ghost{background:#fff;color:var(--tinte);border-color:#d7d4cc}
.bcode-box{background:var(--hg-2);border:1px dashed #cfccc4;border-radius:8px;padding:12px 14px;margin:12px 0}
.bcode-box .lbl{font-size:.82rem;color:var(--leise)}
.bcode-box .code{font:600 1.6rem/1.2 "Space Grotesk","Inter",monospace;letter-spacing:.3em;color:var(--tinte)}
.bcode-in{letter-spacing:.3em;font-size:1.2rem}
.bdone{text-align:center;padding:16px 0}
.bdone .ico{width:54px;height:54px;border-radius:50%;background:var(--akzent-hell);color:var(--akzent);display:grid;place-items:center;font-size:1.5rem;margin:0 auto 12px}
.demo-pill{display:inline-block;font-size:.78rem;font-weight:600;color:var(--leise);margin-bottom:8px}
.bsum{background:var(--hg-2);border:1px solid var(--linie);border-radius:8px;padding:12px 14px}
.bsum div{display:flex;justify-content:space-between;gap:14px;padding:5px 0;font-size:.93rem}
.bsum div span:first-child{color:var(--leise)}
.bsum div span:last-child{font-weight:600;color:var(--tinte);text-align:right}

/* Schwarz-Weiß-Ansicht */
html.bw{filter:grayscale(100%)}

/* Handy & Tablet */
@media (max-width:960px){
  .held-teilung .wrap,.teilung,.kontakt{grid-template-columns:1fr;gap:32px}
  .stimmen{grid-template-columns:1fr;gap:24px}
  .infos .wrap{grid-template-columns:1fr 1fr}
  .infos .wrap>div:nth-child(2){border-right:0;margin-right:0}
}
@media (max-width:820px){
  .menue-knopf{display:block}
  .menue{display:none;position:absolute;top:68px;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;background:#fff;border-bottom:1px solid var(--linie);padding:6px 24px 16px}
  .menue.offen{display:flex}
  .menue a{padding:12px 0;border-bottom:1px solid var(--linie)}
  .menue a.knopf{margin-top:12px;border-bottom:0}
  .preisliste,.leistungsliste{grid-template-columns:1fr}
}
@media (max-width:560px){
  .wrap{padding:0 18px}
  body{font-size:16px}
  .abschnitt{padding:60px 0}
  .held-voll{min-height:480px}
  .held-voll .wrap{padding-top:72px;padding-bottom:48px}
  .held-teilung{padding:40px 0}
  .bopts{grid-template-columns:1fr}
  .bbar .s span:not(.n){display:none}
  .demo-hinweis .wrap{font-size:12px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Knopf-Links ohne Unterstreichung */
.btn{text-decoration:none}
a.btn-primary{color:#fff}

/* Online-Bestellung (demo-bestellung.js) */
.bs-kats{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.bs-kat{flex:none;padding:10px 15px;min-height:44px;border-radius:99px;border:1px solid #d7d4cc;background:#fff;font:600 .9rem/1 "Inter",sans-serif;color:var(--tinte);cursor:pointer}
.bs-kat.sel{background:var(--akzent);border-color:var(--akzent);color:#fff}
.bs-liste{list-style:none;margin:0;padding:0;border-top:1px solid var(--linie)}
.bs-gericht{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:12px 0;border-bottom:1px solid var(--linie)}
.bs-info b{display:block;color:var(--tinte)}
.bs-info span{font-size:.86rem;color:var(--leise)}
.bs-rechts{display:flex;align-items:center;gap:12px;flex:none}
.bs-preis{font-weight:600;color:var(--tinte);white-space:nowrap}
.bs-dazu{min-height:44px;padding:0 14px;border-radius:8px;border:1px solid #d7d4cc;background:#fff;font:600 .88rem/1 "Inter",sans-serif;color:var(--tinte);cursor:pointer;white-space:nowrap}
.bs-dazu:hover{border-color:var(--akzent)}
.bs-menge{display:inline-flex;align-items:center;border:1px solid var(--akzent);border-radius:8px;overflow:hidden}
.bs-menge button{width:44px;height:44px;border:0;background:#fff;font:600 1.15rem/1 "Inter",sans-serif;color:var(--akzent);cursor:pointer}
.bs-menge span{min-width:26px;text-align:center;font-weight:600;color:var(--tinte)}
.bs-korb{margin-top:14px;padding:12px 14px;background:var(--hg-2);border-radius:8px;color:var(--tinte)}
.bs-asap{grid-column:1/-1}
.bs-warn{color:#8a4b0f}
.bs-summe{width:100%;border-collapse:collapse;margin-bottom:6px}
.bs-summe td{padding:9px 0;border-bottom:1px solid var(--linie)}
.bs-summe td:last-child{text-align:right;white-space:nowrap;font-weight:600}
.bs-summe .bs-gesamt td{font-weight:700;font-size:1.1rem;border-bottom:0;color:var(--tinte)}
.bs-fertig{text-align:center}
.bs-haken{width:56px;height:56px;border-radius:50%;background:var(--akzent-hell);color:var(--akzent);display:grid;place-items:center;font-size:1.6rem;font-weight:700;margin:4px auto 12px}
.bs-ende{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:1.3rem}
@media (max-width:520px){.bs-gericht{flex-wrap:wrap}.bs-rechts{width:100%;justify-content:space-between}}

/* „Jetzt geöffnet“ (demo-extras.js) */
.offen-status{display:inline-flex;align-items:center;gap:8px;margin:0 0 14px;padding:6px 12px;border-radius:99px;font:600 .86rem/1.2 "Inter",sans-serif;background:#fff;color:#1d1f23;border:1px solid rgba(0,0,0,.08)}
.offen-status::before{content:"";width:9px;height:9px;border-radius:50%;background:#9aa0a6;flex:none}
.offen-status.ja::before{background:#1f9d55;box-shadow:0 0 0 3px rgba(31,157,85,.18)}
/* Hinweis-Blase */
.demo-toast{position:fixed;left:50%;bottom:96px;transform:translate(-50%,16px);opacity:0;pointer-events:none;z-index:80;width:max-content;max-width:min(92vw,460px);padding:12px 16px;border-radius:12px;background:#1d1f23;color:#fff;font:500 .9rem/1.45 "Inter",sans-serif;box-shadow:0 12px 30px -10px rgba(0,0,0,.45);transition:opacity .2s,transform .2s}
.demo-toast.zeigen{opacity:1;transform:translate(-50%,0)}
@media (min-width:761px){.demo-toast{bottom:28px}}
/* Handy-Leiste */
.handy-leiste{display:none}
@media (max-width:760px){
  .handy-leiste{position:fixed;left:0;right:0;bottom:0;z-index:70;display:grid;grid-template-columns:repeat(3,1fr) 1.5fr;gap:6px;padding:8px 10px calc(8px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid var(--linie);box-shadow:0 -8px 24px -14px rgba(0,0,0,.3)}
  .handy-leiste button,.handy-leiste a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:52px;border:0;border-radius:10px;background:var(--hg-2);font:600 .8rem/1.1 "Inter",sans-serif;color:var(--tinte);text-decoration:none;cursor:pointer;padding:4px}
  .handy-leiste svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
  .handy-leiste .hl-cta{background:var(--akzent);color:#fff;font-size:.88rem;text-align:center}
  body.mit-leiste{padding-bottom:78px}
}
/* Bearbeiten (demo-bearbeiten.js) */
.bearbeiten [data-edit]{outline:2px dashed currentColor;outline-offset:3px;border-radius:3px;cursor:text}
.bearbeiten [data-edit]:focus{outline:2px solid var(--akzent);outline-offset:3px}
.bearbeiten-leiste{position:fixed;left:50%;transform:translateX(-50%);top:10px;z-index:90;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 14px;width:max-content;max-width:min(94vw,760px);padding:10px 12px 10px 16px;border-radius:12px;background:#1d1f23;color:#e8e9ec;font:500 .86rem/1.4 "Inter",sans-serif;box-shadow:0 12px 30px -10px rgba(0,0,0,.5)}
.bearbeiten-leiste b{color:#fff}
.bearbeiten-leiste .bl-knoepfe{display:flex;gap:8px}
.bearbeiten-leiste button{min-height:44px;padding:0 14px;border-radius:8px;border:1px solid rgba(255,255,255,.3);background:transparent;color:#fff;font:600 .85rem/1 "Inter",sans-serif;cursor:pointer}
.bearbeiten-leiste .primaer{background:#fff;color:#1d1f23;border-color:#fff}
/* Gutscheine (demo-gutschein.js) */
.gs-betraege{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px}
.gs-betraege .bslot{min-height:48px;font-size:1rem}
.gs-raster{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}
.gs-motive{display:flex;gap:8px;margin-bottom:14px;flex-wrap:wrap}
.gs-motiv{flex:1;min-width:88px;min-height:52px;border-radius:10px;border:2px solid transparent;cursor:pointer;color:#fff;font:600 .82rem/1 "Inter",sans-serif;display:flex;align-items:flex-end;padding:8px}
.gs-motiv.sel{border-color:var(--tinte);box-shadow:0 0 0 2px #fff inset}
.gs-klassisch{background:linear-gradient(135deg,var(--akzent),var(--akzent-dunkel))}
.gs-festlich{background:linear-gradient(135deg,#1f2228,#3a3326);color:#e9c46a}
.gs-froh{background:linear-gradient(135deg,#f08a5d,#f6c453)}
.gs-karte{display:flex;flex-direction:column;gap:6px;min-height:200px;padding:20px 22px;border-radius:16px;color:#fff;box-shadow:0 16px 34px -18px rgba(0,0,0,.5);position:relative;overflow:hidden}
.gs-karte::after{content:"";position:absolute;right:-40px;top:-40px;width:150px;height:150px;border-radius:50%;background:rgba(255,255,255,.12)}
.gs-karte.gs-festlich{color:#f3dfae}
.gs-name{font:600 .85rem/1.2 "Inter",sans-serif;letter-spacing:.06em;text-transform:uppercase;opacity:.9}
.gs-titel{font:600 1rem/1.2 var(--titel)}
.gs-wert{font:700 2rem/1.1 var(--titel);margin:4px 0}
.gs-fuer,.gs-text{font-size:.92rem;opacity:.95}
.gs-text{font-style:italic}
.gs-fuss{margin-top:auto;font:600 .76rem/1.3 "Inter",sans-serif;opacity:.85;letter-spacing:.03em}
.gs-ende{max-width:360px;margin:16px auto}
@media (max-width:640px){.gs-raster{grid-template-columns:1fr}.gs-vorschau{order:-1}}
/* Verwaltung (demo-verwaltung.js) */
.vw-seite{background:#f4f5f7}
.vw-kopf{background:var(--akzent-dunkel);color:#fff}
.vw-kopf .wrap{display:flex;justify-content:space-between;align-items:center;min-height:64px}
.vw-marke{display:flex;align-items:center;gap:12px}
.vw-marke .zeichen{width:38px;height:38px;border-radius:10px;background:#fff;color:var(--akzent-dunkel);display:grid;place-items:center;font:700 .95rem/1 "Inter",sans-serif}
.vw-titel{margin:0;font:400 1rem/1.3 "Inter",sans-serif;color:inherit}
.vw-marke b{display:block;font:700 1.05rem/1.2 "Inter",sans-serif}
.vw-marke span{font-size:.84rem;opacity:.85}
.vw-demo{font:700 .78rem/1 "Inter",sans-serif;letter-spacing:.08em;text-transform:uppercase;background:rgba(255,255,255,.18);padding:6px 10px;border-radius:99px}
.vw-inhalt{padding-top:18px;padding-bottom:40px}
.vw-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:16px}
.vw-tabs button{min-height:44px;padding:0 16px;border-radius:10px;border:1px solid #dcdfe4;background:#fff;font:600 .9rem/1 "Inter",sans-serif;color:#30343b;cursor:pointer}
.vw-tabs button.sel{background:var(--akzent);border-color:var(--akzent);color:#fff}
.vw-flaeche{background:#fff;border:1px solid #e3e5e9;border-radius:14px;padding:20px}
.vw-zahlen{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:6px}
.vw-zahlen div{background:var(--hg-2);border-radius:12px;padding:14px}
.vw-zahlen b{display:block;font:700 1.6rem/1.1 "Inter",sans-serif;color:var(--tinte)}
.vw-zahlen span{font-size:.84rem;color:var(--leise)}
.vw-h{font:700 1.02rem/1.3 "Inter",sans-serif;color:var(--tinte);margin:22px 0 10px}
.vw-h span{font-weight:600;color:var(--leise);margin-left:4px}
.vw-liste{list-style:none;margin:0;padding:0;border-top:1px solid #eceef1}
.vw-eintrag{display:grid;grid-template-columns:96px 1fr auto;gap:12px;align-items:center;padding:12px 4px;border-bottom:1px solid #eceef1}
.vw-eintrag.eigen{background:#fff8e1;border-radius:8px}
.vw-zeit b{display:block;font:700 1rem/1.2 "Inter",sans-serif;color:var(--tinte)}
.vw-zeit span,.vw-was span{font-size:.82rem;color:var(--leise)}
.vw-was b{display:block;color:var(--tinte);font-weight:600}
.vw-aktion{display:flex;gap:6px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.vw-pill{font:700 .78rem/1 "Inter",sans-serif;padding:6px 9px;border-radius:99px;background:#eef0f3;color:#4a4f58}
.vw-pill.neu{background:#fff1d6;color:#8a5a00}
.vw-pill.ok{background:#e3f4ea;color:#1b6b3f}
.vw-pill.fertig{background:#e7eefb;color:#24508f}
.vw-pill.aus{background:#f1f1f1;color:#7a7f87;text-decoration:line-through}
.vw-knopf{min-height:40px;padding:0 12px;border-radius:8px;border:1px solid #d5d8de;background:#fff;font:600 .84rem/1 "Inter",sans-serif;color:#30343b;cursor:pointer}
.vw-knopf.primaer{background:var(--akzent);border-color:var(--akzent);color:#fff}
.vw-leer,.vw-hinweis{color:var(--leise);font-size:.88rem;margin:8px 0 0}
.vw-woche{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}
.vw-tag{background:var(--hg-2);border-radius:10px;padding:8px;min-height:140px}
.vw-tag-kopf{font-size:.84rem;color:var(--leise);margin-bottom:6px}
.vw-tag-kopf b{color:var(--tinte)}
.vw-block{background:#fff;border-left:3px solid var(--akzent);border-radius:6px;padding:5px 7px;margin-bottom:5px;font-size:.78rem;line-height:1.3;color:#30343b}
.vw-block.eigen{background:#fff8e1;border-left-color:#e0a800}
.vw-tafel{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.vw-spalte{background:var(--hg-2);border-radius:12px;padding:4px 10px 10px}
.vw-karte{background:#fff;border:1px solid #e3e5e9;border-radius:10px;padding:10px 12px;margin-bottom:8px}
.vw-karte.eigen{border-color:#e0a800;background:#fffdf3}
.vw-karte-kopf{display:flex;justify-content:space-between;gap:8px;font-size:.84rem;color:var(--leise)}
.vw-karte-kopf b{color:var(--tinte);font-size:.95rem}
.vw-karte ul{margin:8px 0;padding-left:18px;font-size:.88rem;color:#30343b}
.vw-karte-fuss{display:flex;justify-content:space-between;gap:8px;font-size:.82rem;color:var(--leise)}
.vw-karte-fuss em{font-style:normal;font-weight:700;color:#8a5a00}
.vw-karte-knoepfe{display:flex;gap:6px;justify-content:flex-end;margin-top:8px}
.vw-schalter,.vw-zeiten{list-style:none;margin:0;padding:0;border-top:1px solid #eceef1}
.vw-schalter li,.vw-zeiten li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 2px;border-bottom:1px solid #eceef1;font-size:.92rem;color:#30343b}
.vw-switch{width:52px;height:30px;border-radius:99px;border:0;background:#cfd3d9;position:relative;cursor:pointer;flex:none}
.vw-switch i{position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:#fff;transition:left .15s}
.vw-switch.an{background:var(--akzent)}
.vw-switch.an i{left:25px}
.vw-cta{display:flex;justify-content:space-between;align-items:center;gap:12px 20px;flex-wrap:wrap;margin-top:18px;padding:16px 18px;background:#fff;border:1px solid #e3e5e9;border-radius:14px}
.vw-cta p{margin:0;color:#30343b}
.vw-bon{position:fixed;inset:0;z-index:95;background:rgba(15,17,21,.55);display:grid;place-items:center;padding:16px}
.vw-bon[hidden]{display:none}
.vw-bon-fenster{background:#fff;border-radius:14px;padding:18px;max-width:340px;width:100%;display:grid;gap:12px}
.vw-bon-papier{white-space:pre-wrap;font:500 .86rem/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;background:#fbfaf6;border:1px dashed #cfcabf;border-radius:8px;padding:14px;color:#1d1f23}
@media (max-width:760px){
  .vw-woche{grid-template-columns:repeat(2,1fr)}
  .vw-tafel{grid-template-columns:1fr}
  .vw-eintrag{grid-template-columns:72px 1fr}
  .vw-aktion{grid-column:1/-1;justify-content:flex-start}
  .vw-zahlen{grid-template-columns:1fr 1fr 1fr}
  .vw-zahlen b{font-size:1.3rem}
}

/* „hidden“ muss gegen display:flex/inline-flex gewinnen */
.bearbeiten-leiste[hidden],.offen-status[hidden],.handy-leiste[hidden]{display:none!important}
/* Hinweisleiste am Handy: kurze Bezeichnungen */
.nur-klein{display:none}
@media (max-width:560px){.demo-hinweis .nur-gross{display:none}.demo-hinweis .nur-klein{display:inline}.demo-aktionen{gap:16px}}

/* Neuigkeiten und Termine (Verein, Fahrschule) */
.news{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.news-karte{background:#fff;border:1px solid var(--linie);border-radius:var(--radius);padding:20px}
.news-datum{font:600 .78rem/1 "Inter",sans-serif;color:var(--akzent);text-transform:uppercase;letter-spacing:.06em}
.news-karte h3{margin:.55rem 0 .4rem;font-size:1.12rem}
.news-karte p{margin:0;color:var(--leise);font-size:.95rem}
.termine-liste{list-style:none;margin:0;padding:0;border-top:1px solid var(--linie)}
.termine-liste li{display:flex;gap:16px;align-items:center;padding:14px 0;border-bottom:1px solid var(--linie)}
.tl-datum{flex:none;width:64px;height:64px;border-radius:12px;background:var(--akzent-hell);color:var(--akzent-dunkel);display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:.8rem;text-align:center}
.tl-datum b{font:700 1.15rem/1.1 var(--titel)}
.tl-was b{display:block;color:var(--tinte)}
.tl-was span{color:var(--leise);font-size:.92rem}
@media (max-width:820px){.news{grid-template-columns:1fr}}
/* Belegungskalender (demo-kalender.js) */
.kal-leiste{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.kal-leiste .bh{text-align:center;font-size:1.05rem}
.kal-nav{flex:none;width:44px;height:44px;border-radius:10px;border:1px solid #d7d4cc;background:#fff;font-size:1.4rem;line-height:1;cursor:pointer;color:var(--tinte)}
.kal-nav:disabled{opacity:.3;cursor:not-allowed}
.kal-monate{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.kal-kopf{font:600 1rem/1.2 var(--titel);margin-bottom:8px;color:var(--tinte)}
.kal-wt,.kal-tage{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}
.kal-wt span{font-size:.8rem;color:var(--leise);text-align:center;padding:4px 0}
.kal-tag{aspect-ratio:1;min-height:34px;border-radius:8px;border:1px solid #e4e1d9;background:#fff;font:500 .9rem/1 "Inter",sans-serif;color:var(--tinte);cursor:pointer;padding:0}
.kal-tag:hover:not(:disabled){border-color:var(--akzent)}
.kal-tag.belegt{background:repeating-linear-gradient(135deg,#f1eee8 0 6px,#e6e2da 6px 12px);color:#9a958b;text-decoration:line-through;cursor:not-allowed}
.kal-tag.vorbei{background:transparent;border-color:transparent;color:#c9c5bc;cursor:default}
.kal-tag.heute{box-shadow:inset 0 0 0 2px var(--akzent-hell)}
.kal-tag.drin{background:var(--akzent-hell);border-color:var(--akzent-hell);text-decoration:none;color:var(--tinte)}
.kal-tag.an,.kal-tag.ab{background:var(--akzent);border-color:var(--akzent);color:#fff;font-weight:700;text-decoration:none}
.kal-legende{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:.85rem;color:var(--leise);margin:12px 0 0}
.kal-punkt{display:inline-block;width:14px;height:14px;border-radius:4px;border:1px solid #e4e1d9;background:#fff;vertical-align:middle}
.kal-punkt.belegt{background:repeating-linear-gradient(135deg,#f1eee8 0 3px,#e6e2da 3px 6px)}
.kal-preis{margin-top:16px;padding-top:14px;border-top:1px solid var(--linie)}
.kal-zeitraum{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;margin-bottom:10px;font-size:.95rem}
.kal-gaeste{display:inline-flex;align-items:center;gap:8px;margin-left:auto;font-weight:600}
.kal-gaeste select{min-height:44px;padding:0 10px;border-radius:8px;border:1px solid #d7d4cc;font:inherit;font-size:16px;background:#fff}
@media (max-width:640px){.kal-monate{grid-template-columns:1fr}.kal-gaeste{margin-left:0}}
@media (max-width:420px){#kalender .bbody{padding:20px 10px}.kal-tage{gap:2px}.kal-tag{aspect-ratio:auto;min-height:40px}}
/* Belegungsplan in der Verwaltung */
.vw-kalender{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.vw-km b{display:block;margin-bottom:8px;color:var(--tinte)}
.vw-kg{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}
.vw-kg i{font-style:normal;font-size:.8rem;color:var(--leise);text-align:center}
.vw-kt{display:grid;place-items:center;aspect-ratio:1;border-radius:6px;background:#f3f4f6;font-size:.82rem;color:#4a4f58}
.vw-kt.belegt{background:var(--akzent);color:#fff}
.vw-kt.neu{background:#f6c344;color:#1d1f23}
@media (max-width:640px){.vw-kalender{grid-template-columns:1fr}}