/* Schriften lokal (keine Verbindung zu Google beim Seitenaufruf). Lizenz: SIL Open Font License 1.1 */
@font-face{font-family:'Black Ops One';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/black-ops-one-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Chakra Petch';font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/chakra-petch-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Chakra Petch';font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/chakra-petch-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Chakra Petch';font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/chakra-petch-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'Chakra Petch';font-style:italic;font-weight:600;font-display:swap;src:url(/fonts/chakra-petch-latin-600-italic.woff2) format('woff2')}
@font-face{font-family:'Chakra Petch';font-style:italic;font-weight:700;font-display:swap;src:url(/fonts/chakra-petch-latin-700-italic.woff2) format('woff2')}
@font-face{font-family:'Figtree';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/figtree-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Figtree';font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/figtree-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Figtree';font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/figtree-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Figtree';font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/figtree-latin-700-normal.woff2) format('woff2')}
/* Layout: Kopfzeile mit Logo, Foto-Hero mit Spielplan-Karte, Kacheln, Buchungsstrecke mit festem Preisfeld, Admin als Tab-Arbeitsfläche.
   Farben stammen aus dem Logo und der Arena: tiefes Marineblau, UV-Blau, Neon-Grün und Orange der Wandmotive, rote Laserlinie. */
:root{
  --bg:#040A24; --bg2:#07123C; --panel:#0A1748; --panel2:#0F2066; --line:rgba(120,170,255,.22);
  --text:#EAF2FF; --muted:#A3B7E6; --blue:#2E8BFF; --glow:#8FD6FF; --violet:#7B5CFF;
  --orange:#9BFF5E; --orange-d:#7BE03E; --pink:#E8217A; --pink-h:#FF3A92; --green:#9BFF5E; --red:#FF4157; --warn:#FFC24A;
  --ink:#06091F;
  --font-d:'Chakra Petch','Arial Narrow',Arial,sans-serif;
  --font-b:'Figtree',system-ui,-apple-system,'Segoe UI',sans-serif;
  color-scheme: dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:var(--font-b); font-size:16px; line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
body::before{content:""; position:fixed; inset:0 0 auto; height:env(safe-area-inset-top,0px); z-index:60; background:var(--bg)}
img{max-width:100%; display:block}
a{color:var(--glow)}
h1,h2,h3,h4{font-family:var(--font-d); margin:0; line-height:1.1; text-wrap:balance}
h1,h2{font-style:italic; text-transform:uppercase; letter-spacing:.01em; font-weight:700}
h2{font-size:clamp(1.7rem,4vw,2.5rem)}
h3{font-size:1.25rem; font-weight:600}
p{margin:0 0 1em}
.wrap{max-width:1140px; margin:0 auto; padding-left:max(16px,env(safe-area-inset-left,0px)); padding-right:max(16px,env(safe-area-inset-right,0px))}
.muted{color:var(--muted)}
.small{font-size:.875rem}
.mono{font-family:var(--font-d); font-variant-numeric:tabular-nums}
:focus-visible{outline:3px solid var(--glow); outline-offset:2px; border-radius:4px}
button{font:inherit; color:inherit}

/* Laserlinie als wiederkehrendes Motiv */
.beam{height:3px; border-radius:2px; background:linear-gradient(90deg,transparent,var(--red) 10%,#FF8A94 50%,var(--red) 90%,transparent); box-shadow:0 0 14px 1px rgba(255,65,87,.7)}

/* Header */
.site-head{position:sticky; top:env(safe-area-inset-top,0px); z-index:50; background:rgba(4,10,36,.92); backdrop-filter:blur(8px); border-bottom:1px solid var(--line)}
.site-head .wrap{display:flex; align-items:center; gap:20px; min-height:64px}
.logo-link{display:flex; align-items:center; flex:0 0 auto}
.logo-link img{height:34px; width:auto}
.nav{display:flex; gap:4px; margin-left:auto; align-items:center}
.nav a{color:var(--text); text-decoration:none; padding:10px 12px; border-radius:8px; font-weight:600; font-size:.95rem}
.nav a:hover{background:rgba(143,214,255,.1)}
.menu-btn{display:none; margin-left:auto; background:none; border:1px solid var(--line); border-radius:10px; padding:8px 14px; cursor:pointer; font-weight:600}
@media (max-width:900px){
  .menu-btn{display:block}
  .nav{display:none; position:absolute; left:0; right:0; top:100%; background:var(--bg2); flex-direction:column; align-items:stretch; padding:10px max(16px,env(safe-area-inset-left,0px)) 16px; border-bottom:1px solid var(--line); margin:0}
  .nav.open{display:flex}
  .nav a{padding:14px 12px}
}

/* Buttons */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:13px 22px; border-radius:10px; border:2px solid transparent; font-family:var(--font-d); font-weight:700; font-size:1rem; text-decoration:none; cursor:pointer; letter-spacing:.02em; text-transform:uppercase; transition:transform .12s, background .12s, box-shadow .12s}
.btn-primary{background:var(--pink); color:#fff; box-shadow:0 0 0 0 rgba(232,33,122,0)}
.btn-primary:hover{background:var(--pink-h); box-shadow:0 6px 24px rgba(232,33,122,.4); transform:translateY(-1px)}
.btn-ghost{background:transparent; color:var(--text); border-color:var(--line)}
.btn-ghost:hover{border-color:var(--glow); background:rgba(143,214,255,.08)}
.btn-danger{background:transparent; color:var(--red); border-color:rgba(255,65,87,.5)}
.btn-danger:hover{background:rgba(255,65,87,.12)}
.btn-ok{background:var(--green); color:var(--ink)}
.btn-sm{padding:8px 14px; font-size:.85rem}
.btn[disabled]{opacity:.45; cursor:not-allowed; transform:none; box-shadow:none}
.nav .btn{padding:10px 16px; color:#fff}
.nav .btn-ghost{color:var(--text); margin-left:6px}
.nav .btn-primary+.btn-primary{margin-left:6px}

/* Hinweisbanner */
.banner{background:var(--orange); color:var(--ink); font-weight:700; text-align:center; padding:10px 0}

/* Hero */
/* Bühne: Foto über die volle Breite, links abgedunkelt für den Text, unten in den Seitenhintergrund auslaufend */
.hero{position:relative; isolation:isolate; overflow:hidden; background:var(--bg); padding-block:clamp(64px,10vw,128px) 56px; min-height:min(84vh,780px); display:flex; align-items:flex-end}
.hero-bg{position:absolute; inset:0; z-index:-2}
.hero-bg img{width:100%; height:100%; object-fit:cover; object-position:62% 40%; animation:heroZoom 14s ease-out both}
.hero-bg::after{content:""; position:absolute; inset:0; background:
  linear-gradient(90deg, rgba(4,10,36,.94) 0%, rgba(4,10,36,.78) 32%, rgba(4,10,36,.18) 62%, rgba(4,10,36,.05) 100%),
  linear-gradient(0deg, var(--bg) 0%, rgba(4,10,36,.55) 18%, transparent 42%),
  linear-gradient(180deg, rgba(4,10,36,.55) 0%, transparent 18%)}
.hero > .wrap{width:100%}
.hero-grid{display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,.8fr); gap:40px; align-items:end}
.hero-text{text-shadow:0 2px 24px rgba(4,10,36,.7)}
.hero-side{display:flex; justify-content:flex-end}
.hero-side .hud{margin:0; width:min(400px,100%); background:rgba(4,10,36,.82); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px)}
/* Laserschuss quer durchs Bild, einmal beim Laden */
.hero-shot{position:absolute; left:0; right:0; top:58%; height:3px; z-index:-1; pointer-events:none; transform-origin:left center;
  background:linear-gradient(90deg, transparent, var(--red) 8%, #FFB3BC 50%, var(--red) 92%, transparent);
  box-shadow:0 0 18px 2px rgba(255,65,87,.85); animation:heroShot 1.6s cubic-bezier(.2,.7,.2,1) .35s both}
@keyframes heroShot{0%{transform:scaleX(0); opacity:1} 55%{transform:scaleX(1); opacity:1} 100%{transform:scaleX(1); opacity:0}}
@keyframes heroZoom{from{transform:scale(1.08)} to{transform:scale(1)}}
.hero .beam{animation:beamPulse 3.2s ease-in-out infinite}
@keyframes beamPulse{0%,100%{box-shadow:0 0 14px 1px rgba(255,65,87,.7)} 50%{box-shadow:0 0 26px 4px rgba(255,65,87,.95)}}
@media (prefers-reduced-motion:reduce){ .hero-bg img,.hero-shot,.hero .beam{animation:none} .hero-shot{display:none} }
.eyebrow{font-family:var(--font-d); font-weight:600; letter-spacing:.14em; text-transform:uppercase; font-size:.8rem; color:var(--glow); margin-bottom:14px}
.hero h1{font-size:clamp(2.6rem,6.4vw,5.2rem); margin-bottom:18px; line-height:.98}
.hero h1 em{font-style:inherit; color:var(--orange)}
.hero .beam{width:min(420px,70%); margin:0 0 22px}
.hero p.lead{font-size:1.15rem; color:var(--text); max-width:34em}
.hero-cta{display:flex; gap:12px; flex-wrap:wrap; margin-top:26px}
.hud{position:relative; margin:-46px 0 0 8%; width:min(420px,88%); background:rgba(4,10,36,.94); border:1px solid var(--line); border-left:4px solid var(--orange); padding:16px 18px; border-radius:6px}
.hud h3{font-size:.82rem; letter-spacing:.14em; text-transform:uppercase; color:var(--glow); margin-bottom:10px; font-weight:600}
.hud-bar{display:flex; height:26px; border-radius:4px; overflow:hidden; gap:2px}
.hud-bar span{display:block; height:100%}
.hud-bar .a{background:var(--orange)}
.hud-bar .b{background:var(--blue)}
.hud-bar .c{background:rgba(163,183,230,.28)}
.hud-meta{display:flex; justify-content:space-between; gap:10px; margin-top:10px; font-family:var(--font-d); font-variant-numeric:tabular-nums; font-size:.9rem; flex-wrap:wrap}
.hud-note{margin:10px 0 0; color:var(--muted); font-size:.82rem}
.qd{display:grid; grid-template-columns:76px 1fr; gap:10px; align-items:center; padding-block:6px; border-top:1px solid var(--line)}
.qd:first-of-type{border-top:0}
.qd-l{font-family:var(--font-d); font-weight:600; font-size:.92rem}
.qd-c{display:flex; flex-wrap:wrap; gap:6px}
.qchip{font-family:var(--font-d); font-weight:600; font-variant-numeric:tabular-nums; font-size:.92rem; padding:6px 11px; min-height:36px; border-radius:7px; border:1px solid rgba(155,255,94,.55); background:rgba(155,255,94,.1); cursor:pointer}
.qchip:hover{background:var(--orange); color:var(--ink); border-color:var(--orange)}
/* Handy: Foto oben als breiter Streifen, Text läuft unten darüber hinein */
@media (max-width:860px){
  .hero{display:block; min-height:0; padding-block:calc(min(72vw,560px) - 96px) 40px}
  .hero-bg{bottom:auto; height:min(72vw,560px)}
  .hero-bg img{object-position:58% 50%}
  .hero-bg::after{background:linear-gradient(0deg, var(--bg) 0%, rgba(4,10,36,.6) 30%, transparent 62%), linear-gradient(180deg, rgba(4,10,36,.4) 0%, transparent 25%)}
  .hero-shot{top:calc(min(72vw,560px) * .55)}
  .hero-grid{grid-template-columns:1fr; gap:28px}
  .hero-side{justify-content:stretch}
  .hero-side .hud{width:100%}
}

/* Fakten */
.facts{background:var(--bg2); border-block:1px solid var(--line)}
.facts ul{list-style:none; margin:0; padding:18px 0; display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:14px 28px}
.facts li{display:flex; flex-direction:column; gap:2px}
.facts b{font-family:var(--font-d); font-size:1.25rem; font-variant-numeric:tabular-nums}
.facts span{color:var(--muted); font-size:.9rem}

/* Sections */
.section{padding-block:72px}
.section.alt{background:var(--bg2)}
.sec-head{display:flex; align-items:flex-end; justify-content:space-between; gap:20px; flex-wrap:wrap; margin-bottom:30px}
.sec-head p{margin:8px 0 0; color:var(--muted); max-width:38em}
@media (max-width:640px){ .section{padding-block:48px} }

/* Platzhalter und Medien */
.ph{position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; gap:4px; padding:16px; width:100%; height:100%; min-height:120px;
  background:repeating-linear-gradient(135deg,rgba(143,214,255,.07) 0 12px,transparent 12px 24px), var(--panel);
  border:2px dashed rgba(143,214,255,.38); color:var(--muted); font-size:.85rem}
.ph b{font-family:var(--font-d); color:var(--glow); letter-spacing:.06em; text-transform:uppercase; font-size:.8rem}
.media-box{position:relative; overflow:hidden; border-radius:10px; background:var(--panel)}
.media-box img{width:100%; height:100%; object-fit:cover}
.r43{aspect-ratio:4/3}.r169{aspect-ratio:16/9}.r11{aspect-ratio:1/1}.r32{aspect-ratio:3/2}

/* Event-Karten */
.cards{display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:20px}
.card{display:flex; flex-direction:column; background:var(--panel); border:1px solid var(--line); border-radius:12px; overflow:hidden; text-decoration:none; color:inherit; transition:transform .15s, border-color .15s}
.card:hover{transform:translateY(-3px); border-color:var(--glow)}
.card .body{padding:18px 20px 22px; display:flex; flex-direction:column; gap:8px; flex:1}
.card p{color:var(--muted); margin:0; flex:1}
.tag{display:inline-block; align-self:flex-start; font-family:var(--font-d); font-size:.72rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; padding:3px 9px; border-radius:4px; background:rgba(155,255,94,.14); color:var(--green)}
.card .from{font-family:var(--font-d); font-weight:600; color:var(--orange); font-variant-numeric:tabular-nums}

/* Spiel */
.split{display:grid; grid-template-columns:1fr 1fr; gap:44px; align-items:center}
@media (max-width:860px){ .split{grid-template-columns:1fr; gap:28px} }
.steps{display:grid; gap:14px; margin:22px 0 0; padding:0; list-style:none}
.steps li{display:grid; grid-template-columns:8.5em minmax(0,1fr); gap:14px; align-items:start}
.steps .t{font-family:var(--font-d); font-weight:700; color:var(--orange); font-variant-numeric:tabular-nums}
@media (max-width:420px){ .steps li{grid-template-columns:1fr; gap:2px} }
.gallery{display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:34px}
@media (max-width:700px){ .gallery{grid-template-columns:1fr 1fr} }

/* Preise */
.price-wrap{overflow-x:auto; border:1px solid var(--line); border-radius:12px; background:var(--panel)}
table.t{width:100%; border-collapse:collapse; min-width:520px}
table.t th,table.t td{padding:12px 16px; text-align:left; border-bottom:1px solid var(--line); vertical-align:middle}
table.t th{font-family:var(--font-d); font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; color:var(--glow); font-weight:600; background:rgba(143,214,255,.05)}
table.t tr:last-child td{border-bottom:0}
table.t td.n,table.t th.n{text-align:right; font-variant-numeric:tabular-nums}
@media (max-width:640px){
  table.t{min-width:0}
  table.t th,table.t td{padding:10px 12px}
  /* Preistabelle am Handy: jedes Paket als Karte statt seitlich scrollen */
  table.t.stack,table.t.stack tbody,table.t.stack tr,table.t.stack td{display:block}
  table.t.stack thead{display:none}
  table.t.stack tr{padding:6px 0 8px; border-bottom:1px solid var(--line)}
  table.t.stack tr:last-child{border-bottom:0}
  table.t.stack td{border:0; padding:5px 14px; display:flex; justify-content:space-between; gap:12px; text-align:right}
  table.t.stack td:first-child{display:block; text-align:left; font-size:1.05rem; padding-top:10px}
  table.t.stack td[data-l]::before{content:attr(data-l); color:var(--muted); text-align:left}
}
.pill{display:inline-block; padding:2px 9px; border-radius:99px; font-size:.75rem; font-weight:700; font-family:var(--font-d); letter-spacing:.04em}
.pill.hot{background:var(--orange); color:var(--ink)}
.price-cols{display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:18px; margin-top:22px}
.box{background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:20px}
.box h3{margin-bottom:6px}
.big-price{font-family:var(--font-d); font-size:2rem; font-weight:700; font-variant-numeric:tabular-nums; color:var(--text)}

/* FAQ */
details.faq{border:1px solid var(--line); border-radius:10px; background:var(--panel); margin-bottom:10px}
details.faq summary{cursor:pointer; padding:16px 20px; font-weight:700; list-style:none; display:flex; justify-content:space-between; gap:14px; align-items:center}
details.faq summary::-webkit-details-marker{display:none}
details.faq summary::after{content:"+"; font-family:var(--font-d); font-size:1.4rem; color:var(--orange); line-height:1}
details.faq[open] summary::after{content:"–"}
details.faq .ans{padding:0 20px 18px; color:var(--muted)}

/* CTA */
.cta-band{background:linear-gradient(110deg,var(--panel2),var(--bg2) 60%); border-block:1px solid var(--line); overflow:hidden}
.cta-band .wrap{display:grid; grid-template-columns:1fr 260px; gap:30px; align-items:center; padding-block:48px}
.cta-band .mascot{border-radius:16px; overflow:hidden; box-shadow:0 0 40px rgba(46,139,255,.5)}
@media (max-width:700px){ .cta-band .wrap{grid-template-columns:1fr} .cta-band .mascot{max-width:200px} }

/* Footer */
.site-foot{background:#030719; padding-block:44px calc(84px + env(safe-area-inset-bottom,0px)); border-top:1px solid var(--line); color:var(--muted); font-size:.92rem}
.foot-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:28px}
.site-foot h4{font-size:.8rem; letter-spacing:.14em; text-transform:uppercase; color:var(--text); margin-bottom:10px}
.site-foot a{color:var(--muted)}
.site-foot a:hover{color:var(--glow)}
.copyable{user-select:all}

/* Formulare */
label.f{display:flex; flex-direction:column; gap:6px; font-weight:600; font-size:.92rem}
input[type=text],input[type=email],input[type=tel],input[type=number],input[type=date],input[type=time],input[type=password],select,textarea{
  width:100%; padding:12px 14px; background:#030719; color:var(--text); border:1px solid rgba(143,214,255,.3); border-radius:8px; font:inherit; font-weight:500}
textarea{min-height:92px; resize:vertical}
input:focus,select:focus,textarea:focus{outline:2px solid var(--glow); outline-offset:1px; border-color:var(--glow)}
input[type=checkbox],input[type=radio]{accent-color:var(--orange); width:20px; height:20px; flex:0 0 auto; margin:2px 0 0}
.check{display:flex; gap:12px; align-items:flex-start; font-weight:500; font-size:.92rem}
.grid2{display:grid; grid-template-columns:1fr 1fr; gap:14px}
@media (max-width:640px){ .grid2{grid-template-columns:1fr} }
.err{color:var(--red); font-weight:600; font-size:.9rem; margin-top:6px}
.note{background:rgba(143,214,255,.08); border:1px solid var(--line); border-left:4px solid var(--glow); border-radius:8px; padding:12px 16px; font-size:.92rem}
.note.warn{border-left-color:var(--warn); background:rgba(255,194,74,.08)}
.note.ok{border-left-color:var(--green); background:rgba(155,255,94,.08)}
.note.bad{border-left-color:var(--red); background:rgba(255,65,87,.1)}

/* Buchung */
.book-head{padding-block:40px 18px}
.book-grid{display:grid; grid-template-columns:minmax(0,1fr) 360px; gap:32px; align-items:start; padding-bottom:40px}
@media (max-width:980px){ .book-grid{grid-template-columns:1fr} }
.bstep{background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:22px; margin-bottom:18px}
.bstep > h3{display:flex; align-items:center; gap:12px; margin-bottom:16px; font-size:1.1rem}
.bstep > h3 .n{display:inline-grid; place-items:center; width:30px; height:30px; border-radius:50%; background:var(--orange); color:var(--ink); font-weight:700; font-size:.95rem}
.stepper{display:flex; align-items:center; gap:10px}
.stepper button{width:44px; height:44px; border-radius:10px; border:1px solid var(--line); background:#030719; cursor:pointer; font-size:1.3rem; font-weight:700}
.stepper button:hover{border-color:var(--glow)}
.stepper input{width:84px; text-align:center; font-family:var(--font-d); font-size:1.3rem; font-weight:700}
.opts{display:grid; grid-template-columns:repeat(auto-fill,minmax(min(150px,100%),1fr)); gap:10px}
.mcal{max-width:380px}
.mcal-head{display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px}
.mcal-head b{font-family:var(--font-d); font-size:1.15rem; letter-spacing:.02em}
.mcal-nav{width:44px; height:44px; border-radius:10px; border:1px solid var(--line); background:#030719; cursor:pointer; font-size:1.5rem; line-height:1}
.mcal-nav:hover:not([disabled]){border-color:var(--glow)}
.mcal-nav[disabled]{opacity:.3; cursor:not-allowed}
.mcal-grid{display:grid; grid-template-columns:repeat(7,1fr); gap:4px}
.mcal-wd{text-align:center; font-family:var(--font-d); font-size:.75rem; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); padding:4px 0}
.mcal-day{aspect-ratio:1; min-height:42px; border-radius:8px; border:1px solid transparent; background:#030719; cursor:pointer; font-family:var(--font-d); font-weight:600; font-size:1rem; font-variant-numeric:tabular-nums}
.mcal-day:hover:not([disabled]){border-color:var(--glow)}
.mcal-day.today{border-color:var(--glow)}
.mcal-day.closed{text-decoration:line-through; opacity:.45}
.mcal-day.ask{border-style:dashed}
.mcal-day.sel{background:var(--orange); color:var(--ink); border-color:var(--orange); font-weight:700}
.mcal-day[disabled]{opacity:.25; cursor:not-allowed; background:transparent}
.opts.five{grid-template-columns:repeat(auto-fit,minmax(min(124px,100%),1fr))}
.book-grid > *{min-width:0}
.opt{min-width:0}
.opt b,.opt .sub{overflow-wrap:anywhere}
.opt{position:relative; display:flex; flex-direction:column; gap:2px; padding:14px 14px; border:2px solid var(--line); border-radius:10px; background:#030719; cursor:pointer; text-align:left; transition:border-color .12s, background .12s}
.opt:hover{border-color:rgba(143,214,255,.6)}
.opt[aria-pressed=true],.opt.sel{border-color:var(--orange); background:rgba(155,255,94,.1)}
.opt b{font-family:var(--font-d); font-size:1.05rem}
.opt .sub{color:var(--muted); font-size:.85rem; font-variant-numeric:tabular-nums}
.opt .pill{position:absolute; top:-10px; right:10px}
.seg{display:grid; grid-template-columns:1fr 1fr; gap:10px}
@media (max-width:520px){ .seg{grid-template-columns:1fr} }
.slots{display:grid; grid-template-columns:repeat(auto-fill,minmax(130px,1fr)); gap:10px}
.slot b{font-size:1.3rem}
.sumbox{position:sticky; top:calc(78px + env(safe-area-inset-top,0px)); background:var(--panel); border:1px solid var(--line); border-top:4px solid var(--orange); border-radius:12px; padding:20px}
@media (max-width:980px){
  .sumbox{position:static}
}
.sumlines{display:grid; gap:6px; margin:12px 0; font-size:.95rem}
.sumlines div{display:flex; justify-content:space-between; gap:12px}
.sumlines .neg{color:var(--green)}
.total{display:flex; justify-content:space-between; align-items:baseline; border-top:1px solid var(--line); padding-top:12px; margin-top:6px}
.total b{font-family:var(--font-d); font-size:2rem; font-variant-numeric:tabular-nums}
.paywhen{display:grid; gap:10px}
.mobile-total{display:none}
@media (max-width:980px){
  .mobile-total{display:flex; position:sticky; bottom:0; z-index:40; justify-content:space-between; align-items:center; gap:10px; background:var(--bg2); border-top:2px solid var(--orange); padding:10px max(16px,env(safe-area-inset-right,0px)) calc(10px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px))}
  .mobile-total b{font-family:var(--font-d); font-size:1.4rem; font-variant-numeric:tabular-nums}
}

/* Erfolg */
.success{max-width:720px; margin:0 auto; padding-block:60px}
.codebox{font-family:var(--font-d); font-size:2.2rem; font-weight:700; letter-spacing:.12em; padding:14px 22px; border:2px dashed var(--orange); border-radius:10px; display:inline-block; margin:10px 0 18px; color:var(--orange)}

/* Gutschein-Karte */
.voucher{position:relative; border-radius:14px; padding:26px; background:linear-gradient(135deg,#0B1D63,#12308F 55%,#2E8BFF); border:1px solid rgba(143,214,255,.5); overflow:hidden; max-width:520px}
.voucher::after{content:""; position:absolute; left:0; right:0; top:62%; height:3px; background:linear-gradient(90deg,transparent,var(--red) 10%,var(--red) 90%,transparent); box-shadow:0 0 14px var(--red)}
.voucher img.vlogo{height:30px; width:auto; margin-bottom:22px}
.voucher .val{font-family:var(--font-d); font-weight:700; font-style:italic; font-size:2.6rem; line-height:1}
.voucher .code{font-family:var(--font-d); letter-spacing:.14em; font-size:1.2rem; margin-top:42px; font-weight:700}

/* Modal und Toast */
.overlay{position:fixed; inset:0; z-index:80; background:rgba(2,5,20,.8); display:flex; align-items:flex-start; justify-content:center; padding:calc(24px + env(safe-area-inset-top,0px)) max(14px,env(safe-area-inset-right,0px)) calc(24px + env(safe-area-inset-bottom,0px)) max(14px,env(safe-area-inset-left,0px)); overflow-y:auto}
.modal{width:100%; max-width:760px; background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:24px; position:relative}
.modal h3{margin-bottom:14px; font-size:1.3rem}
.modal .x{position:absolute; top:12px; right:12px; background:none; border:1px solid var(--line); border-radius:8px; width:38px; height:38px; cursor:pointer; font-size:1.1rem}
.mail{background:#030719; border:1px solid var(--line); border-radius:8px; padding:16px; white-space:pre-wrap; font-size:.9rem; line-height:1.5; max-height:56vh; overflow:auto; font-family:var(--font-b)}
.toast{position:fixed; left:50%; transform:translateX(-50%); bottom:calc(20px + env(safe-area-inset-bottom,0px)); z-index:90; background:var(--green); color:var(--ink); font-weight:700; padding:12px 20px; border-radius:10px; box-shadow:0 8px 30px rgba(0,0,0,.5); max-width:calc(100vw - 32px)}

/* Admin */
.admin{padding-block:28px 60px}
.admin-top{display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; margin-bottom:18px}
.tabs{display:flex; gap:6px; overflow-x:auto; border-bottom:1px solid var(--line); margin-bottom:22px; padding-bottom:0}
.tabs button{background:none; border:0; border-bottom:3px solid transparent; padding:12px 16px; cursor:pointer; font-family:var(--font-d); font-weight:600; letter-spacing:.04em; color:var(--muted); white-space:nowrap}
.tabs button[aria-selected=true]{color:var(--text); border-bottom-color:var(--orange)}
.tabs .cnt{display:inline-block; min-width:22px; padding:0 6px; margin-left:6px; border-radius:99px; background:var(--orange); color:var(--ink); font-size:.75rem; line-height:20px; text-align:center}
.kpis{display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:12px; margin-bottom:22px}
.kpi{background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:14px 16px}
.kpi b{display:block; font-family:var(--font-d); font-size:1.8rem; font-variant-numeric:tabular-nums}
.kpi span{color:var(--muted); font-size:.85rem}
.bcard{background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:18px; margin-bottom:12px; display:grid; grid-template-columns:1fr auto; gap:14px}
@media (max-width:700px){ .bcard{grid-template-columns:1fr} }
.bcard .row{display:flex; flex-wrap:wrap; gap:6px 18px; color:var(--muted); font-size:.92rem}
.bcard .row b{color:var(--text)}
.bcard .acts{display:flex; flex-direction:column; gap:8px; min-width:150px}
.badge{display:inline-block; padding:2px 10px; border-radius:99px; font-size:.75rem; font-weight:700; font-family:var(--font-d); letter-spacing:.05em; text-transform:uppercase}
.b-pending{background:rgba(255,194,74,.18); color:var(--warn)}
.b-confirmed{background:rgba(155,255,94,.16); color:var(--green)}
.b-rejected,.b-cancelled,.b-expired{background:rgba(255,65,87,.16); color:var(--red)}
.slot .tagline{font-family:var(--font-d); font-size:.7rem; letter-spacing:.06em; text-transform:uppercase; color:var(--green)}
.linkbtn{background:none; border:0; padding:0; color:var(--glow); text-decoration:underline; cursor:pointer; font:inherit}
.switch{display:flex; gap:12px; align-items:center; font-weight:600}
.b-demo{background:rgba(143,214,255,.14); color:var(--glow)}
.filters{display:flex; gap:8px; flex-wrap:wrap; margin-bottom:14px; align-items:center}
.chip{padding:8px 14px; border:1px solid var(--line); background:none; border-radius:99px; cursor:pointer; font-weight:600}
.chip[aria-pressed=true]{background:var(--orange); color:var(--ink); border-color:var(--orange)}
.filters input[type=text]{max-width:260px}
tr.click{cursor:pointer}
tr.click:hover td{background:rgba(143,214,255,.06)}

/* Wochenkalender */
.cal-nav{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:14px}
.cal-nav h3{margin:0 8px}
.cal{display:grid; grid-template-columns:52px repeat(7,minmax(112px,1fr)); min-width:880px; border:1px solid var(--line); border-radius:10px; background:var(--panel)}
.cal-scroll{overflow-x:auto; border-radius:10px}
.cal .hd{padding:10px 8px; border-bottom:1px solid var(--line); text-align:center; font-family:var(--font-d); font-weight:600; font-size:.9rem; background:rgba(143,214,255,.05)}
.cal .hd.today{color:var(--orange)}
.cal .hd small{display:block; color:var(--muted); font-weight:500}
.cal .timecol{position:relative; height:784px}
.cal .timecol span{position:absolute; right:8px; transform:translateY(-50%); font-size:.72rem; color:var(--muted); font-variant-numeric:tabular-nums}
.cal .timecol span:first-child{transform:translateY(4px)}
.cal .timecol span:last-child{transform:translateY(-100%)}
.cal .day{position:relative; height:784px; border-left:1px solid var(--line); background-image:repeating-linear-gradient(to bottom,transparent 0 55px,rgba(143,214,255,.1) 55px 56px)}
.cal .closed{position:absolute; left:0; right:0; background:repeating-linear-gradient(135deg,rgba(0,0,0,.35) 0 8px,rgba(0,0,0,.15) 8px 16px)}
.cal .blk{position:absolute; border-radius:6px; padding:4px 6px; overflow:hidden; font-size:.75rem; line-height:1.25; cursor:pointer; border:1px solid; text-align:left; background:var(--blue); color:#fff; border-color:#7BB6FF}
.cal .blk b{display:block; font-family:var(--font-d); font-size:.8rem}
.cal .blk.pending{background:rgba(255,194,74,.2); border:2px dashed var(--warn); color:var(--text)}
.cal .blk.rental{background:var(--violet); border-color:#B7A6FF}
.cal .blk.cancelled,.cal .blk.rejected{display:none}
.legend{display:flex; gap:16px; flex-wrap:wrap; margin-top:12px; font-size:.85rem; color:var(--muted)}
.legend i{display:inline-block; width:14px; height:14px; border-radius:3px; margin-right:6px; vertical-align:-2px}

.formrow{display:grid; gap:14px; margin-bottom:16px}
.kv{display:grid; grid-template-columns:150px 1fr; gap:6px 14px; font-size:.95rem}
.kv dt{color:var(--muted)} .kv dd{margin:0}
@media (max-width:520px){ .kv{grid-template-columns:1fr} .kv dt{margin-top:8px} }
.row-actions{display:flex; gap:8px; flex-wrap:wrap; margin-top:18px}
.hr{border:0; border-top:1px solid var(--line); margin:22px 0}
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} *{transition:none!important} }

/* Anfahrt & Parken */
.park{display:grid; grid-template-columns:44px minmax(0,1fr); gap:14px; align-items:start; padding:14px 16px; margin-top:12px; border:2px solid rgba(46,139,255,.6); border-radius:12px; background:rgba(46,139,255,.08)}
.park-p{width:44px; height:44px; border-radius:8px; display:grid; place-items:center; background:var(--blue); color:#fff; font-family:var(--font-d); font-weight:700; font-size:1.6rem; line-height:1}
.park-alt{border-color:rgba(155,255,94,.5); background:rgba(155,255,94,.06)}
.park-alt .park-p{background:#2FB36E}
.park-tag{font-family:var(--font-d); font-size:.72rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--glow)}
.park-alt .park-tag{color:var(--green)}
.park-time{font-family:var(--font-d); font-weight:700; font-size:1.05rem; font-variant-numeric:tabular-nums; color:var(--glow)}
.park-alt .park-time{color:var(--green)}
.map-btn{display:block; width:100%; padding:0; border:1px solid var(--line); border-radius:12px; overflow:hidden; background:#fff; cursor:zoom-in}
.map-btn img{width:100%; height:auto}

/* Gutscheinseite */
.gv-head{position:relative; isolation:isolate; overflow:hidden; padding-block:clamp(48px,8vw,96px) 8px}
.gv-head h1{font-size:clamp(2.2rem,5.4vw,3.8rem)}
.gv-head .lead{max-width:36em; font-size:1.1rem}
.gv-banner{position:absolute; inset:0; z-index:-1}
.gv-banner img{width:100%; height:100%; object-fit:cover; object-position:50% 35%}
.gv-banner::after{content:""; position:absolute; inset:0; background:linear-gradient(90deg, rgba(4,10,36,.95) 0%, rgba(4,10,36,.75) 45%, rgba(4,10,36,.35) 100%), linear-gradient(0deg, var(--bg) 0%, transparent 55%)}
.gv-layout{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,560px); gap:32px; align-items:start}
.gv-sticky{position:sticky; top:calc(84px + env(safe-area-inset-top,0px))}
@media (max-width:1060px){ .gv-layout{grid-template-columns:1fr} .gv-aside{order:-1} .gv-sticky{position:static} }

/* Gutscheinkarte: weiß, gelber Rahmen, Maskottchen, Stern – wie der gedruckte Gutschein. Höhe ergibt sich aus dem Inhalt. */
.gv{container-type:inline-size; position:relative; width:100%; max-width:620px; background:#fff; color:#0A0A0A; border:solid #F4C20D; border-width:max(4px,1cqi); border-radius:4px; overflow:hidden; font-family:'Chakra Petch',var(--font-b); text-shadow:none; box-shadow:0 18px 50px rgba(0,0,0,.45)}
.gv::before{content:""; position:absolute; left:-10%; top:8%; width:68%; height:86%; background:radial-gradient(closest-side, rgba(46,139,255,.45), rgba(143,214,255,.2) 60%, transparent 85%); pointer-events:none}
.gv > *{position:relative}
.gv-top{display:flex; align-items:center; justify-content:space-between; gap:2cqi; padding:2.4cqi 2.6cqi 0 3cqi}
.gv-title{font-family:'Black Ops One','Chakra Petch',Impact,sans-serif; font-weight:700; font-size:6.2cqi; line-height:1; letter-spacing:.01em; white-space:nowrap}
.gv-codewrap{display:flex; align-items:center; gap:1.2cqi; min-width:0; flex:0 1 42%}
.gv-codelbl{font-family:'Black Ops One','Chakra Petch',Impact,sans-serif; font-weight:700; font-size:3cqi; line-height:1}
.gv-box{border:1.5px solid #333; border-radius:1.2cqi; box-shadow:0 0 0 .55cqi #fff, 0 0 0 calc(.55cqi + 1.5px) #333; background:#fff}
.gv-code{flex:1; min-width:0; padding:1cqi 1.4cqi; font-weight:700; font-size:2.8cqi; letter-spacing:.06em; white-space:nowrap; overflow:hidden; text-align:center; font-variant-numeric:tabular-nums}
.gv-mid{display:grid; grid-template-columns:46% 54%; align-items:stretch; padding-bottom:2.4cqi}
.gv-left{display:flex; flex-direction:column; justify-content:space-between; padding:0 0 0 1.4cqi}
.gv-art img{width:100%; height:auto; display:block; mix-blend-mode:multiply;
  -webkit-mask-image:linear-gradient(to bottom, transparent 0, #000 7%, #000 100%), linear-gradient(to right, transparent 0, #000 6%, #000 94%, transparent 100%); -webkit-mask-composite:source-in;
  mask-image:linear-gradient(to bottom, transparent 0, #000 7%, #000 100%), linear-gradient(to right, transparent 0, #000 6%, #000 94%, transparent 100%); mask-composite:intersect}
.gv-contact{display:grid; grid-template-columns:1fr; padding:.4cqi 0 0 1.8cqi; font-weight:700; font-size:2.3cqi; line-height:1.32}
.gv-contact span{white-space:nowrap}
.gv-fields{display:flex; flex-direction:column; gap:2.2cqi; padding:2.6cqi 2.8cqi 0 1.8cqi; min-width:0}
.gv-val{padding:1.3cqi 2.2cqi}
.gv-val b{font-family:'Black Ops One','Chakra Petch',Impact,sans-serif; font-weight:700; font-size:6.2cqi; line-height:1; font-variant-numeric:tabular-nums}
.gv-valid{font-size:2.2cqi; font-weight:700; color:#123A75; margin-top:.5cqi}
.gv-k{font-size:2.3cqi; font-weight:600; text-transform:uppercase; letter-spacing:.08em; color:#555}
.gv-sub{font-size:2.4cqi; font-weight:600; color:#333}
.gv-who{padding:1.2cqi 2.2cqi; font-size:2.9cqi; line-height:1.3; overflow-wrap:anywhere}
.gv-who b{font-weight:700}
.gv-ph{color:#bbb; font-weight:400}
.gv-note{font-size:2.4cqi; color:#333; margin-top:.3cqi}
.gv-bottom{display:flex; align-items:flex-end; justify-content:space-between; gap:1cqi}
.gv-addr{display:flex; flex-direction:column; font-weight:700; font-size:2.6cqi; line-height:1.28; color:#123A75; min-width:0; white-space:nowrap}
.gv-near{font-weight:700; font-size:2.6cqi; color:#0A0A0A; margin:auto 0 -1.4cqi}
.gv-star{flex:0 0 auto; width:13.5cqi; aspect-ratio:1; display:grid; place-items:center; margin:0 -1cqi -1cqi 0; background:radial-gradient(circle at 40% 35%, #FFE58A, #F4C20D 70%); clip-path:polygon(50.0% 0.0%,56.1% 7.4%,64.1% 2.0%,67.9% 10.9%,77.0% 7.9%,78.2% 17.5%,87.8% 17.3%,86.2% 26.8%,95.5% 29.2%,91.3% 37.9%,99.5% 42.9%,93.0% 50.0%,99.5% 57.1%,91.3% 62.1%,95.5% 70.8%,86.2% 73.2%,87.8% 82.7%,78.2% 82.5%,77.0% 92.1%,67.9% 89.1%,64.1% 98.0%,56.1% 92.6%,50.0% 100.0%,43.9% 92.6%,35.9% 98.0%,32.1% 89.1%,23.0% 92.1%,21.8% 82.5%,12.2% 82.7%,13.8% 73.2%,4.5% 70.8%,8.7% 62.1%,0.5% 57.1%,7.0% 50.0%,0.5% 42.9%,8.7% 37.9%,4.5% 29.2%,13.8% 26.8%,12.2% 17.3%,21.8% 17.5%,23.0% 7.9%,32.1% 10.9%,35.9% 2.0%,43.9% 7.4%); transform:rotate(-14deg)}
.gv-star span{transform:rotate(36deg); font-family:'Black Ops One','Chakra Petch',Impact,sans-serif; font-weight:700; color:#fff; font-size:1.7cqi; line-height:1.05; text-align:center; text-shadow:0 0 .4cqi rgba(0,0,0,.6), 0 .2cqi .2cqi rgba(0,0,0,.4); max-width:10cqi}
/* schmale Karte (Handy): Schrift größer, Kontakt einspaltig, Code-Beschriftung weg */
@container (max-width:480px){
  .gv-title{font-size:7.4cqi}
  .gv-codelbl{display:none}
  .gv-code{font-size:3.3cqi}
  .gv-val b{font-size:7.4cqi}
  .gv-k,.gv-sub,.gv-valid{font-size:2.9cqi}
  .gv-who{font-size:3.5cqi}
  .gv-note{font-size:3cqi}
  .gv-addr{font-size:3.2cqi}
  .gv-contact{font-size:2.9cqi}
  .gv-near{font-size:3.1cqi}
  .gv-addr{white-space:normal}
  .gv-star{width:17cqi}
  .gv-star span{font-size:2.2cqi; max-width:13cqi}
}
.voucher{display:none}

.b-ext{background:rgba(155,255,94,.18); color:var(--orange)}
.slot .tagline{display:block; margin-top:4px}
.cal .blk.ext{box-shadow:0 0 0 2px var(--orange), 0 0 12px rgba(155,255,94,.6)}

/* Firmen: Vorteile, Restaurants */
.perks{list-style:none; margin:22px 0 0; padding:0; display:grid; gap:10px}
.perks li{display:grid; grid-template-columns:24px minmax(0,1fr); column-gap:10px; align-items:start}
.perks li::before{content:"✓"; grid-row:span 2; display:grid; place-items:center; width:24px; height:24px; border-radius:50%; background:rgba(155,255,94,.16); color:var(--green); font-weight:700; font-size:.85rem}
.perks b{font-family:var(--font-d)}
.perks span{color:var(--muted); font-size:.92rem}
.restos{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(auto-fill,minmax(min(240px,100%),1fr)); gap:12px}
.resto{position:relative; display:flex; flex-direction:column; gap:3px; padding:14px 16px; background:var(--panel); border:1px solid var(--line); border-radius:10px}
.resto b{font-family:var(--font-d); font-size:1.02rem}
.resto-partner{border-color:var(--orange); background:rgba(155,255,94,.08)}
.resto .pill{align-self:flex-start; margin-bottom:4px}

.stay-hl{display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; padding:10px 14px; border-radius:10px; background:rgba(46,139,255,.14); border:1px solid rgba(143,214,255,.35)}
.stay-hl b{font-family:var(--font-d); font-size:1.6rem; line-height:1; color:var(--glow); font-variant-numeric:tabular-nums}
.stay-hl span{color:var(--text); font-weight:600; font-size:.92rem}
.hp{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden}

/* Rechtstexte */
.legal h3 { font-size: 1.05rem; margin: 26px 0 8px; }
.legal p, .legal li { line-height: 1.6; color: var(--text); }
.legal ul { padding-left: 20px; margin: 6px 0 12px; }
.legal li { margin: 4px 0; }
.check a { color: inherit; text-decoration: underline; }
.legal { overflow-wrap: break-word; }
.legal h2 { hyphens: auto; overflow-wrap: break-word; }
/* Verpflegung: Personenzahl direkt bei den Extras */
.extras-head { display: flex; align-items: center; gap: 8px; white-space: nowrap; margin-bottom: 14px; }
.stepper.sm button { width: 34px; height: 34px; }
.stepper.sm b { min-width: 34px; text-align: center; display: inline-block; }
.opt.off { opacity: .6; }
.opt.off:hover { opacity: .85; }

/* Laser-Pass */
.pass-page .box { margin-top: 20px; }
.pass-rules ul { padding-left: 20px; margin: 8px 0 0; }
.pass-rules li { margin: 4px 0; }
.pass-ways { display: grid; gap: 20px; grid-template-columns: repeat(auto-fit, minmax(min(380px, 100%), 1fr)); }
.pass-preview { overflow-x: auto; margin-top: 12px; }
.sign { width: 100%; height: auto; aspect-ratio: 10 / 3; background: #fff; border-radius: 10px; touch-action: none; cursor: crosshair; display: block; }
.pcard { display: flex; width: 170mm; height: 55mm; color: #0b1640; background: #fff; font-family: Figtree, Arial, sans-serif; border: 1px dashed #9aa6c8; box-sizing: border-box; }
.pass-preview .pcard { transform: scale(.62); transform-origin: top left; margin-bottom: -21mm; margin-right: -65mm; }
.pc-front, .pc-back { width: 85mm; height: 100%; box-sizing: border-box; padding: 4mm 5mm; display: flex; flex-direction: column; }
.pc-front { background: #fff; color: #0b1640; border-right: 1px dashed #9aa6c8; }
.pc-brand img { height: 9mm; width: auto; display: block; }
.pc-title { font-family: "Chakra Petch", Arial; font-style: italic; font-weight: 700; font-size: 20pt; color: #d4202f; margin: 1mm 0 2mm; }
.pc-line { margin-top: auto; }
.pc-line span { display: block; border-bottom: 1px solid currentColor; height: 5mm; opacity: .8; }
.pc-line small { font-size: 6pt; opacity: .75; }
.pc-front .pc-line { margin-top: 2.5mm; }
.pc-note { font-size: 6.5pt; margin-top: auto; color: #5a6794; }
.pc-back p { font-size: 6.3pt; line-height: 1.3; margin: 0 0 1mm; }
.pc-back .pc-line { margin-top: 1.2mm; }
.pc-back .pc-line span { height: 4mm; }
.pc-two { display: grid; grid-template-columns: 1.4fr 1fr; gap: 3mm; }
.pass-print { display: none; }
@media print {
  @page { size: A4; margin: 12mm; }
  .site-head, .site-foot, .pass-page, .banner, .mobile-total, .toast { display: none !important; }
  body { background: #fff !important; }
  .pass-print { display: block; }
  .pass-print .pcard { margin-bottom: 8mm; -webkit-print-color-adjust: exact; print-color-adjust: exact; break-inside: avoid; }
}

/* Specials */
.sp-feature { display: grid; grid-template-columns: 1.1fr 1fr; gap: 0; border-radius: 18px; overflow: hidden; border: 1px solid rgba(255, 59, 78, .45); background: linear-gradient(135deg, rgba(255, 59, 78, .12), rgba(46, 139, 255, .10)); box-shadow: 0 0 40px rgba(255, 59, 78, .18); color: inherit; text-decoration: none; margin-bottom: 20px; }
.sp-feature .sp-img { min-height: 280px; }
.sp-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sp-feature .sp-body { padding: 28px; display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }
.sp-feature h2 { font-size: clamp(1.7rem, 4vw, 2.6rem); }
.sp-when { color: var(--glow); font-weight: 700; }
.sp-meta { display: flex; gap: 14px; flex-wrap: wrap; align-items: baseline; margin-top: 6px; }
.sp-meta span { color: var(--orange, #9BFF5E); font-weight: 600; }
.sp-page { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; margin-top: 16px; align-items: start; }
.sp-page .sp-img { border-radius: 16px; overflow: hidden; aspect-ratio: 4 / 3; }
.sp-text { margin: 24px 0; max-width: 46em; }
.sp-text p { margin: 0 0 12px; line-height: 1.6; }
@media (max-width: 760px) {
  .sp-feature, .sp-page { grid-template-columns: 1fr; }
  .sp-feature .sp-img { min-height: 200px; aspect-ratio: 16 / 9; }
}
.cal .blk.special { background: linear-gradient(135deg, rgba(255, 59, 78, .85), rgba(123, 92, 255, .8)); border-color: #ff3b4e; }
.cal .blk .blk-info { display: block; opacity: .85; font-size: .7rem; margin-top: 1px; }

/* Tagesansicht */
.today-card { display: grid; grid-template-columns: 74px 1fr; gap: 14px; padding: 14px; border: 1px solid var(--line); border-radius: 14px; background: rgba(255, 255, 255, .03); margin-bottom: 10px; }
.today-card.done { opacity: .6; }
.today-card.special { border-color: rgba(255, 59, 78, .6); background: linear-gradient(135deg, rgba(255, 59, 78, .12), rgba(123, 92, 255, .1)); }
.tc-time { font-family: var(--font-d); font-size: 1.3rem; font-weight: 700; line-height: 1.1; }
.tc-time small { display: block; font-family: inherit; font-size: .7rem; font-weight: 500; color: var(--muted); margin-top: 4px; }
.tc-body > div { margin-top: 3px; }
.tc-note { color: var(--glow); }
.tc-tickets { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.chip.done { opacity: .6; }
.uf-sign { margin-top: 28px; font-size: .85rem; }
@media print {
  body.print-modal > *:not(#overlay) { display: none !important; }
  body.print-modal #overlay { position: static; background: #fff; display: block; }
  body.print-modal .modal { box-shadow: none; border: 0; max-width: none; color: #000; background: #fff; }
  body.print-modal .modal .row-actions, body.print-modal .modal .x { display: none; }
  body.print-modal .kv dt, body.print-modal .kv dd, body.print-modal .muted { color: #000 !important; }
}

/* Was uns ausmacht */
.usp { padding-block: 26px; border-bottom: 1px solid var(--line); }
.usp ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(230px, 100%), 1fr)); gap: 18px 28px; }
.usp li { display: flex; gap: 14px; align-items: flex-start; min-width: 0; }
.usp svg { flex: none; width: 34px; height: 34px; fill: none; stroke: var(--glow); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 0 6px rgba(143, 214, 255, .45)); }
.usp b { display: block; font-family: var(--font-d); font-size: 1.05rem; }
.usp span { color: var(--muted); font-size: .9rem; }

/* Kindergeburtstag hervorgehoben */
.kids-feature { display: grid; grid-template-columns: 1.05fr 1fr; gap: 0; border: 1px solid rgba(255, 159, 28, .5); border-radius: 16px; overflow: hidden; background: var(--panel); margin-bottom: 20px; }
.kids-feature .kf-img { display: block; position: relative; min-height: 300px; min-width: 0; }
.kids-feature .kf-img .media-box { position: absolute; inset: 0; aspect-ratio: auto; border-radius: 0; }
.kf-body { padding: 24px 26px; display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.kf-body h3 { font-size: clamp(1.5rem, 3.5vw, 2rem); }
.kf-prices { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.kf-prices li { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 7px 0; border-bottom: 1px dashed var(--line); }
.kf-prices b { color: var(--orange, #9BFF5E); font-variant-numeric: tabular-nums; }
.kf-steps { margin: 0; padding-left: 20px; color: var(--muted); display: grid; gap: 3px; }
@media (max-width: 760px) { .kids-feature { grid-template-columns: 1fr; } .kids-feature .kf-img { min-height: 0; aspect-ratio: 16 / 9; } }
@media (max-width: 480px) { .kf-prices li { flex-direction: column; gap: 2px; } }

/* WhatsApp-Knopf */
.wa-fab{position:fixed; right:16px; bottom:calc(16px + env(safe-area-inset-bottom,0px)); z-index:60; display:flex; align-items:center; gap:8px; padding:11px 16px 11px 13px; border-radius:999px; background:#25d366; color:#06210f; font-weight:700; font-size:.92rem; text-decoration:none; box-shadow:0 6px 20px rgba(0,0,0,.35)}
.wa-fab svg{width:22px; height:22px}
.wa-fab:hover{filter:brightness(1.07)}
@media (max-width:760px){ .wa-fab span{display:none} .wa-fab{padding:12px} .wa-fab.up{bottom:calc(84px + env(safe-area-inset-bottom,0px))} }
@media print{ .wa-fab{display:none !important} }

/* Newsletter im Fußbereich */
.nl-box{margin-top:32px; padding:20px; border:1px solid var(--line); border-radius:14px; display:grid; gap:12px; grid-template-columns:1fr; background:rgba(255,255,255,.02)}
.nl-box p{margin:4px 0 0}
.nl-form{display:flex; gap:10px; flex-wrap:wrap}
.nl-form input[type=email]{flex:1 1 220px; min-width:0}
@media (min-width:900px){ .nl-box{grid-template-columns:1.1fr 1fr; align-items:center} .nl-box #nl-msg{grid-column:2} }

/* Lobby-Bildschirm */
body.lobby-mode{overflow:hidden}
.lobby{min-height:100vh; display:flex; flex-direction:column; background:radial-gradient(1200px 600px at 80% -10%, rgba(0,200,255,.12), transparent), #040817; color:var(--text); padding:2.2vw 3vw}
.lb-head{display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid var(--line); padding-bottom:1.2vw}
.lb-brand{font-family:var(--font-h); font-size:clamp(22px,2.6vw,48px); letter-spacing:.08em}
.lb-brand span{color:var(--orange)}
.lb-clock{font-family:var(--font-h); font-size:clamp(34px,4.6vw,88px); color:var(--glow); font-variant-numeric:tabular-nums}
.lb-main{flex:1; display:grid; grid-template-columns:1fr 1.4fr; gap:3vw; padding-top:2vw; overflow:hidden}
.lb-col h2{font-size:clamp(18px,1.7vw,32px); text-transform:uppercase; letter-spacing:.12em; color:var(--muted); margin-bottom:1.2vw}
.lb-card{background:rgba(255,255,255,.04); border:1px solid var(--line); border-left:4px solid var(--glow); border-radius:12px; padding:1vw 1.2vw; margin-bottom:.9vw}
.lb-card.sp{border-left-color:var(--orange)}
.lb-name{font-family:var(--font-h); font-size:clamp(20px,2vw,40px); line-height:1.1}
.lb-meta{color:var(--muted); font-size:clamp(14px,1.1vw,22px); margin-top:.3vw}
.lb-left{color:var(--green); font-size:clamp(14px,1.1vw,22px); margin-top:.3vw}
.lb-slot{display:grid; grid-template-columns:auto 1fr; gap:1.4vw; align-items:start; margin-bottom:1.6vw}
.lb-time{font-family:var(--font-h); font-size:clamp(28px,3vw,58px); color:var(--orange); line-height:1; min-width:6ch}
.lb-time small{display:block; font-family:var(--font-b); font-size:clamp(12px,.9vw,18px); color:var(--muted); margin-top:.4vw}
.lb-groups{display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,15vw),1fr)); gap:.8vw}
.lb-groups .lb-card{margin:0}
.lb-together{grid-column:2; color:var(--glow); font-size:clamp(13px,1vw,20px)}
.lb-empty{color:var(--muted); font-size:clamp(16px,1.3vw,26px)}
.lb-foot{border-top:1px solid var(--line); padding-top:1vw; color:var(--muted); font-size:clamp(13px,1.1vw,22px); text-align:center}
.lb-login{color:var(--muted); font-size:.8em; margin-left:1em}
@media (max-width:760px){ body.lobby-mode{overflow:auto} .lb-main{grid-template-columns:1fr} .lb-groups{grid-template-columns:1fr} }

/* Karussell der hervorgehobenen Specials */
.sp-carousel{position:relative; overflow:hidden; border-radius:18px; margin-bottom:20px}
.sp-track{display:flex; transition:transform .6s ease}
.sp-track .sp-feature{flex:0 0 100%; margin:0}
.sp-nav{position:absolute; top:50%; transform:translateY(-50%); width:42px; height:42px; border-radius:50%; border:1px solid var(--line); background:rgba(3,7,25,.7); color:var(--text); font-size:26px; line-height:1; cursor:pointer; display:grid; place-items:center}
.sp-nav.prev{left:10px} .sp-nav.next{right:10px}
.sp-nav:hover{border-color:var(--glow); color:var(--glow)}
.sp-dots{position:absolute; left:0; right:0; bottom:12px; display:flex; justify-content:center; gap:8px}
.sp-dots button{width:10px; height:10px; border-radius:50%; border:0; padding:0; background:rgba(255,255,255,.35); cursor:pointer}
.sp-dots button[aria-current]{background:var(--orange); width:26px; border-radius:6px}
@media (prefers-reduced-motion: reduce){ .sp-track{transition:none} }
@media (max-width:760px){ .sp-nav{display:none} .sp-carousel .sp-feature .sp-body{padding-bottom:40px} }

/* Paket-Berater und Ablauf */
.ber{border-color:rgba(46,139,255,.45); margin-bottom:18px}
.ber-head{display:flex; justify-content:space-between; align-items:baseline; gap:12px; flex-wrap:wrap}
.ber-q{margin-top:16px}
.ber-q > b{display:block; margin-bottom:8px}
.ber-opts{display:flex; flex-wrap:wrap; gap:8px}
.ber-opts .opt{flex:0 1 auto; padding:10px 14px; text-align:left}
.ber-opts .opt small{display:block; font-weight:400; color:var(--muted); font-size:.8rem}
.ber-result{margin-top:20px; padding:18px; border-radius:12px; border:1px solid var(--orange); background:rgba(155,255,94,.07)}
.ber-k{font-size:.75rem; letter-spacing:.14em; text-transform:uppercase; color:var(--orange); font-weight:700}
.ber-what{font-family:var(--font-d); font-size:1.35rem; margin:4px 0 8px}
.ber-facts{display:flex; flex-wrap:wrap; gap:6px 18px; color:var(--muted)}
.ber-facts b{color:var(--text)}
.ber-notes{margin:12px 0 14px; padding-left:18px; color:var(--muted); font-size:.92rem}
.ber-notes li{margin-bottom:4px}
.ber-closed{margin:0 0 14px}
.ablauf{margin:0 0 22px; border:1px solid var(--line); border-radius:12px; background:var(--panel); padding:0 18px}
.ablauf summary{cursor:pointer; padding:14px 0; font-weight:700}
.ablauf-steps{margin:0 0 12px; padding-left:22px}
.ablauf-steps li{margin-bottom:10px}
.ablauf-steps li span{display:block; color:var(--muted); font-size:.93rem}
.ablauf-bring{padding:0 0 16px; color:var(--muted); font-size:.93rem}
.ablauf-bring b{color:var(--text)}
.hero-help{margin:14px 0 0}

/* Laser-Pass teilen (Danke-Seite) */
.pass-share{margin-top:18px; border-color:var(--pink)}
.pass-text{margin:0 0 12px; padding:12px 14px; border-left:3px solid var(--pink); background:rgba(255,255,255,.04); border-radius:6px; font-size:.95rem; line-height:1.5}
.btn-wa{background:#25d366; color:#06210f}
.btn-wa:hover{filter:brightness(1.07)}

/* Einladungs-Kreator */
.inv-grid{display:grid; grid-template-columns:1.1fr 1fr; gap:28px; align-items:start; margin-top:20px}
@media (max-width:900px){ .inv-grid{grid-template-columns:1fr} }
.inv-styles .opt{display:flex; align-items:center; gap:8px}
.inv-sw{width:18px; height:18px; border-radius:50%; display:inline-block; border:1px solid rgba(255,255,255,.3)}
.inv-sw-neon{background:linear-gradient(135deg,#0a0f3a,#E8217A)} .inv-sw-comic{background:#FFD23F} .inv-sw-space{background:radial-gradient(circle at 30% 30%,#7b4dff,#120a3a)} .inv-sw-hell{background:#fff}
.inv{border-radius:14px; overflow:hidden; aspect-ratio:105/148; max-width:420px; position:relative; font-family:var(--font-b)}
.inv-in{height:100%; padding:7% 8%; display:flex; flex-direction:column; gap:3%; box-sizing:border-box}
.inv-kicker{font-size:.72em; letter-spacing:.18em; text-transform:uppercase; font-weight:700}
.inv-h{font-family:var(--font-d); font-style:italic; text-transform:uppercase; font-size:2em; line-height:1.02; margin:0}
.inv-lead{margin:0; font-size:.92em; line-height:1.35}
.inv-dl{display:grid; grid-template-columns:auto 1fr; gap:.35em .8em; margin:0; font-size:.86em; line-height:1.3}
.inv-dl dt{font-weight:800; text-transform:uppercase; font-size:.78em; letter-spacing:.08em; padding-top:.2em}
.inv-dl dd{margin:0}
.inv-pass{display:flex; gap:.8em; align-items:center; font-size:.74em; line-height:1.3; margin-top:auto}
.inv-qr{width:5.2em; height:5.2em; flex:0 0 auto; background:#fff; padding:.3em; border-radius:4px}
.inv-qr svg{width:100%; height:100%; display:block}
.inv-park{font-size:.66em; opacity:.85}
.inv-guest .inv-park{margin-top:auto}
/* Designs */
.inv-neon{background:radial-gradient(120% 80% at 100% 0%,rgba(232,33,122,.55),transparent 55%),radial-gradient(90% 70% at 0% 100%,rgba(46,200,255,.45),transparent 60%),#070b2e; color:#eef3ff}
.inv-neon .inv-kicker{color:#5fe1ff} .inv-neon .inv-h{color:#fff; text-shadow:0 0 12px rgba(232,33,122,.9)} .inv-neon dt{color:#ff6fae}
.inv-comic{background:repeating-radial-gradient(circle at 0 0,rgba(0,0,0,.07) 0 2px,transparent 2px 9px),#FFD23F; color:#111}
.inv-comic .inv-in{border:5px solid #111; border-radius:14px}
.inv-comic .inv-kicker{background:#E8217A; color:#fff; align-self:flex-start; padding:.25em .6em; transform:rotate(-2deg)} .inv-comic .inv-h{color:#111; -webkit-text-stroke:0; text-shadow:3px 3px 0 #ff4157} .inv-comic dt{color:#c4005a}
.inv-space{background:radial-gradient(1.5px 1.5px at 20% 30%,#fff,transparent),radial-gradient(1px 1px at 70% 20%,#fff,transparent),radial-gradient(1.5px 1.5px at 85% 60%,#fff,transparent),radial-gradient(1px 1px at 40% 80%,#fff,transparent),radial-gradient(1px 1px at 60% 50%,#cfc6ff,transparent),radial-gradient(120% 90% at 80% 10%,#4b2bb8,transparent 60%),#0d0827; color:#f1edff}
.inv-space .inv-kicker{color:#b9a6ff} .inv-space .inv-h{color:#fff; text-shadow:0 0 14px rgba(155,120,255,.9)} .inv-space dt{color:#9BFF5E}
.inv-hell{background:#fff; color:#141a33; border:2px solid #E8217A}
.inv-hell .inv-kicker{color:#E8217A} .inv-hell .inv-h{color:#141a33} .inv-hell dt{color:#E8217A}
.inv-preview{font-size:clamp(13px,1.6vw,17px)}
.inv-guest .inv{margin:0 auto 18px; font-size:clamp(14px,4vw,18px); max-width:440px; aspect-ratio:auto}
.inv-guest .inv-in{gap:14px}
#inv-print{display:none}
@media print{
  body.printing-inv > *:not(#app), body.printing-inv .site-head, body.printing-inv .site-foot, body.printing-inv .wa-fab, body.printing-inv .toast{display:none !important}
  body.printing-inv, body.printing-inv main{background:#fff !important; margin:0; padding:0}
  body.printing-inv #inv-print{display:block !important}
  body.printing-inv main > section{display:none !important}
  @page{size:A4; margin:0}
  .inv-sheet{display:grid; grid-template-columns:105mm 105mm; grid-template-rows:148.5mm 148.5mm; width:210mm; height:297mm}
  .inv-sheet .inv{width:105mm; height:148.5mm; max-width:none; aspect-ratio:auto; border-radius:0; font-size:12pt; -webkit-print-color-adjust:exact; print-color-adjust:exact; outline:.2mm dashed #bbb; outline-offset:-.1mm}
}

/* Gutschein-Designs (DIN lang) */
.gv-designs{display:flex; flex-wrap:wrap; gap:8px}
.gv-designs .opt{display:flex; align-items:center; gap:8px; padding:8px 12px}
.gv-sw{width:18px; height:18px; border-radius:50%; display:inline-block; border:1px solid rgba(255,255,255,.35)}
.gv-sw-neon{background:linear-gradient(135deg,#070b2e 40%,#E8217A)} .gv-sw-geburtstag{background:conic-gradient(#ff4fa3,#ffd23f,#5fe1ff,#9bff5e,#ff4fa3)}
.gv-sw-weihnachten{background:linear-gradient(135deg,#0d3b2a 50%,#c8102e)} .gv-sw-elegant{background:linear-gradient(135deg,#111 50%,#c9a24a)} .gv-sw-klassisch{background:#fff; border:3px solid #F4C20D}
.vd{container-type:inline-size; position:relative; width:100%; max-width:620px; aspect-ratio:210/99; overflow:hidden; border-radius:10px; display:grid; grid-template-columns:62% 38%; grid-template-rows:minmax(0,1fr) auto; box-shadow:0 18px 50px rgba(0,0,0,.45); font-family:var(--font-b); text-shadow:none}
.vd > *{position:relative; z-index:1}
.vd-main{padding:3.6cqi 4cqi 1.6cqi 5cqi; display:flex; flex-direction:column; min-width:0}
.vd-kicker{font-size:2.4cqi; letter-spacing:.22em; text-transform:uppercase; font-weight:800}
.vd-val{font-family:var(--font-d); font-style:italic; font-weight:700; font-size:11cqi; line-height:.95; margin-top:1.2cqi; white-space:nowrap}
.vd-sub{font-size:2.6cqi; font-weight:600; opacity:.85; margin-top:.6cqi}
.vd-who{margin-top:auto; font-size:2.9cqi; font-weight:700; line-height:1.3}
.vd-who span{font-size:2.1cqi; text-transform:uppercase; letter-spacing:.12em; font-weight:700; opacity:.7; display:inline-block; min-width:5.5cqi}
.vd-who i{font-style:normal; opacity:.4}
.vd-note{font-size:2.5cqi; font-style:italic; margin-top:.8cqi; opacity:.9; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical}
.vd-side{padding:3.4cqi 4cqi 1.6cqi 2cqi; min-height:0; display:flex; flex-direction:column; align-items:center; text-align:center; border-left:.3cqi dashed currentColor}
.vd-brand{font-family:var(--font-d); font-style:italic; font-weight:700; font-size:3.2cqi; letter-spacing:.06em; line-height:1}
.vd-logo{width:17cqi; height:auto; display:block}
.vd-brand b{display:block; font-size:4.6cqi}
.vd-qr{width:11cqi; height:11cqi; background:#fff; padding:.7cqi; border-radius:1cqi; margin-top:1.4cqi}
.vd-qr svg{width:100%; height:100%; display:block}
.vd-qrt{font-size:1.6cqi; margin-top:.8cqi; opacity:.8}
.vd-code{margin-top:auto; font-family:ui-monospace,Menlo,Consolas,monospace; font-weight:700; font-size:2.7cqi; letter-spacing:.06em; padding:1cqi 1.6cqi; border-radius:1cqi; white-space:nowrap}
.vd-code span{display:block; font-family:var(--font-b); font-size:1.5cqi; letter-spacing:.2em; text-transform:uppercase; opacity:.7}
.vd-valid{font-size:1.9cqi; margin-top:.8cqi; font-weight:600}
.vd-foot{grid-column:1 / -1; font-size:1.6cqi; padding:1.1cqi 3cqi; white-space:nowrap; overflow:hidden; text-align:center; font-weight:600; letter-spacing:.02em}
/* Neon */
.vd-neon{background:radial-gradient(70% 90% at 0% 0%,rgba(232,33,122,.55),transparent 60%),radial-gradient(60% 80% at 100% 100%,rgba(46,200,255,.4),transparent 60%),#060a2b; color:#eef3ff}
.vd-neon .vd-kicker{color:#5fe1ff} .vd-neon .vd-val{color:#fff; text-shadow:0 0 2cqi rgba(232,33,122,.9)} .vd-neon .vd-side{color:#ff6fae} .vd-neon .vd-brand{color:#fff}
.vd-neon .vd-code{background:rgba(255,255,255,.08); color:#fff; border:.25cqi solid #E8217A} .vd-neon .vd-foot{background:rgba(0,0,0,.35); color:#b9c6ff}
/* Geburtstag */
.vd-geburtstag{background:linear-gradient(135deg,#ff4fa3,#ff8a1f 55%,#ffd23f); color:#1a0b2e}
.vd-confetti{position:absolute; inset:0; z-index:0; background:radial-gradient(circle,#fff 0 .6cqi,transparent .7cqi) 0 0/9cqi 9cqi,radial-gradient(circle,#5fe1ff 0 .5cqi,transparent .6cqi) 4cqi 3cqi/11cqi 11cqi,radial-gradient(circle,#9bff5e 0 .45cqi,transparent .55cqi) 2cqi 6cqi/13cqi 13cqi; opacity:.55}
.vd-geburtstag .vd-kicker{color:#fff} .vd-geburtstag .vd-val{color:#fff; text-shadow:.5cqi .5cqi 0 #7a1050} .vd-geburtstag .vd-side{color:#7a1050; background:rgba(255,255,255,.35)}
.vd-geburtstag .vd-code{background:#fff; color:#1a0b2e} .vd-geburtstag .vd-foot{background:#1a0b2e; color:#fff}
/* Weihnachten */
.vd-weihnachten{background:radial-gradient(80% 100% at 100% 0%,#1d6a4a,transparent 70%),#0b2e22; color:#f4efe2}
.vd-snow{position:absolute; inset:0; z-index:0; background:radial-gradient(circle,rgba(255,255,255,.9) 0 .35cqi,transparent .45cqi) 0 0/7cqi 7cqi,radial-gradient(circle,rgba(255,255,255,.6) 0 .25cqi,transparent .35cqi) 3cqi 4cqi/10cqi 10cqi; opacity:.45}
.vd-weihnachten .vd-kicker{color:#e9c46a} .vd-weihnachten .vd-val{color:#fff; text-shadow:0 0 1.6cqi rgba(233,196,106,.6)} .vd-weihnachten .vd-side{color:#e9c46a; background:rgba(200,16,46,.85)} .vd-weihnachten .vd-brand{color:#fff}
.vd-weihnachten .vd-code{background:#fff; color:#0b2e22} .vd-weihnachten .vd-foot{background:#c8102e; color:#fff}
/* Elegant */
.vd-elegant{background:#111; color:#f2efe6}
.vd-elegant .vd-kicker{color:#c9a24a} .vd-elegant .vd-val{color:#c9a24a; font-style:normal; letter-spacing:.02em} .vd-elegant .vd-side{color:#c9a24a} .vd-elegant .vd-brand{color:#f2efe6}
.vd-elegant .vd-code{border:.2cqi solid #c9a24a; color:#f2efe6} .vd-elegant .vd-foot{border-top:.2cqi solid #c9a24a; color:#c9a24a}
#print-area{display:none}
@media print{
  body.printing-gv > *:not(#print-area){display:none !important}
  body.printing-gv{background:#fff !important}
  body.printing-gv #print-area{display:block !important}
  .vd-print{padding:12mm 0 0; display:flex; flex-direction:column; align-items:center}
  .vd-print .vd{width:210mm; max-width:none; border-radius:0; box-shadow:none; outline:.2mm dashed #999; -webkit-print-color-adjust:exact; print-color-adjust:exact}
  .vd-print .gv{width:190mm; max-width:none; -webkit-print-color-adjust:exact; print-color-adjust:exact}
  .vd-cut{font:9pt Arial,sans-serif; color:#666; margin-top:4mm}
}
.opt .sub.anchor{color:var(--green); font-weight:600}

/* Arbeitszeit */
.zt-stamp{display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; padding:18px; border:1px solid var(--line); border-radius:12px; background:var(--panel)}
.zt-stamp.on{border-color:var(--green); background:rgba(155,255,94,.07)}
.zt-stamp-act{display:flex; align-items:flex-end; gap:10px}
.zt-stamp .btn{min-width:130px}
.legal-note{margin:4px 0 0; line-height:1.5}
.kf-benefits{list-style:none; padding:0; margin:14px 0; display:grid; gap:9px}
.kf-benefits li{position:relative; padding-left:28px; line-height:1.45; color:var(--muted)}
.kf-benefits li b{color:var(--text)}
.kf-benefits li::before{content:"✓"; position:absolute; left:0; top:0; width:20px; height:20px; border-radius:50%; background:var(--pink); color:#fff; font-size:.75rem; font-weight:800; display:grid; place-items:center; margin-top:2px}
.kf-price{margin:4px 0 14px; color:var(--muted)}
.kf-price b{color:var(--text); font-size:1.15em}
.kf-benefits.sm{margin:10px 0 12px; gap:6px; font-size:.9rem}

/* Dienstplan */
.dp-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:10px}
.dp-grid.admin{grid-template-columns:repeat(auto-fill,minmax(360px,1fr))}
.dp-day{border:1px solid var(--line); border-radius:10px; padding:12px 14px; background:var(--panel)}
.dp-day.on{border-color:var(--green); background:rgba(155,255,94,.06)}
.dp-head{display:flex; flex-wrap:wrap; align-items:center; gap:4px 10px; margin-bottom:8px}
.dp-btns,.dp-chips,.dp-add{display:flex; flex-wrap:wrap; gap:8px; align-items:center}
.dp-chips{margin-bottom:8px}
.dp-btn{font:inherit; font-size:.88rem; padding:8px 12px; border-radius:8px; border:1px solid var(--line); background:transparent; color:var(--text); cursor:pointer; min-height:40px}
.dp-btn:hover{border-color:var(--blue)}
.dp-btn.on{background:var(--pink,#e91e7a); border-color:var(--pink,#e91e7a); color:#fff; font-weight:600}
.dp-btn.ghost{color:var(--muted)}
.dp-chip{display:inline-flex; align-items:center; gap:6px; padding:4px 4px 4px 10px; border-radius:999px; font-size:.86rem; border:1px solid var(--line)}
.dp-chip.on{border-color:var(--green); background:rgba(155,255,94,.12)}
.dp-chip.wish{border-color:var(--warn); background:rgba(255,194,74,.12)}
.dp-chip.no{color:var(--muted); text-decoration:none; opacity:.8}
.dp-chip button{font:inherit; width:28px; height:28px; border-radius:50%; border:0; background:rgba(255,255,255,.1); color:var(--text); cursor:pointer}
.dp-chip button:hover{background:rgba(255,255,255,.22)}
.dp-add select{width:auto; flex:0 1 auto; font:inherit; font-size:.88rem; padding:6px 8px; border-radius:8px; background:var(--bg); color:var(--text); border:1px solid var(--line)}
.dp-mine{margin:0; padding-left:18px; line-height:1.8}
.cal .hd.duty{background:rgba(155,255,94,.14)}
.cal .hd em{display:block; font-style:normal; font-size:.7rem; color:var(--green); font-weight:600}
.cal .blk.occ{background:rgba(255,255,255,.07); border:1px dashed var(--line); color:var(--muted); font-size:.75rem; cursor:default; pointer-events:none}
.cal .hd .plan{display:flex; flex-direction:column; gap:1px; margin-top:4px; font-family:var(--font-b,inherit); font-weight:500; font-size:.72rem; line-height:1.25}
.cal .hd .plan span{color:var(--text); background:rgba(143,214,255,.12); border-radius:4px; padding:1px 5px}
.cal .hd .plan span.me{background:rgba(155,255,94,.18); color:var(--green)}
.plan-line{display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin-bottom:10px; font-size:.9rem}
.plan-line span{background:rgba(143,214,255,.12); border-radius:6px; padding:2px 8px}
.plan-line span.me{background:rgba(155,255,94,.18); color:var(--green)}
.zt-wage{display:inline-flex; align-items:center; gap:6px; justify-content:flex-end}
.zt-wage input{width:90px; font:inherit; padding:6px 8px; border-radius:8px; border:1px solid var(--line); background:var(--bg); color:var(--text); text-align:right}
.hero-bg video{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:62% 40%; opacity:0; transition:opacity 1.2s ease}
.hero-bg video.on{opacity:1}
@media (max-width:860px){ .hero-bg video{object-position:58% 50%} }
@media (prefers-reduced-motion:reduce){ .hero-bg video{display:none} }

/* Team-Infos: Pinnwand und Aufgaben */
.ti-box{border:1px solid var(--line); border-radius:12px; padding:12px 14px; margin-bottom:14px; background:var(--panel)}
.ti-box h4{margin:0 0 8px}
.ti-msg{display:flex; justify-content:space-between; align-items:flex-start; gap:12px; padding:8px 0; border-top:1px solid var(--line)}
.ti-msg:first-child{border-top:0; padding-top:0}
.ti-msg.hot b{color:var(--warn)}
.ti-msg.read{opacity:.6}
.ti-task{display:flex; gap:12px; align-items:flex-start; width:100%; text-align:left; font:inherit; color:inherit; background:transparent; border:0; border-top:1px solid var(--line); padding:10px 0; cursor:pointer}
.ti-task:first-of-type{border-top:0}
.ti-task:disabled{cursor:default}
.ti-check{flex:none; width:26px; height:26px; border-radius:7px; border:2px solid var(--muted); display:inline-grid; place-items:center; font-weight:700}
.ti-task.done .ti-check{background:var(--green); border-color:var(--green); color:#0b1020}
.ti-task.done b{text-decoration:line-through; opacity:.7}
.ti-form{display:grid; gap:8px; margin-bottom:12px}
.ti-form input[type=text], .ti-form input:not([type]), .ti-form textarea, .ti-form select, .ti-form input[type=date]{font:inherit; padding:9px 10px; border-radius:8px; border:1px solid var(--line); background:rgba(255,255,255,.04); color:inherit}
.ti-line{display:flex; flex-wrap:wrap; gap:10px; align-items:center}
.ti-list{display:grid; gap:8px}
.ti-row{display:flex; justify-content:space-between; gap:12px; align-items:flex-start; border:1px solid var(--line); border-radius:10px; padding:10px 12px}
.ti-row.off{opacity:.55}

.hero-note{display:inline-block; margin:18px 0 0; padding:9px 14px; border-radius:10px; border:1px solid var(--warn); background:rgba(255,194,74,.12); font-size:.95rem; max-width:34em}
.hero-note b{color:var(--warn)}
.hero-note + .hero-cta{margin-top:16px}

/* Gutschein hell: weißer Grund, spart Tinte beim Ausdrucken */
.vd-hell{background:#fff; color:#0b1640; border:.3cqi solid #d5dbec; box-sizing:border-box}
.vd-hell .vd-kicker{color:#e0283c} .vd-hell .vd-val{color:#0b1640} .vd-hell .vd-side{color:#0b1640; border-left-color:#9aa6c8} .vd-hell .vd-brand{color:#0b1640}
.vd-hell .vd-qr{border:.25cqi solid #d5dbec}
.vd-hell .vd-code{background:#f2f5fc; color:#0b1640; border:.25cqi solid #9aa6c8} .vd-hell .vd-foot{background:#0b1640; color:#fff}
.gv-sw-hell{background:#fff; border:1px solid #9aa6c8}

.inv-logo{height:2.5em; width:auto; align-self:flex-start; margin:-1% 0 -1%}

/* Anfahrt: Öffentliche zuerst */
.oepnv{display:flex; align-items:center; gap:20px; padding:22px 24px; margin:0 0 34px; border:2px solid #0B8A3E; border-radius:16px; background:rgba(11,138,62,.14)}
.oepnv .sbahn{flex:0 0 auto; width:72px; height:72px}
.oepnv-t{margin:0 0 6px; font-family:var(--font-d); font-weight:700; font-size:clamp(1.35rem,3.6vw,2rem); line-height:1.2; color:var(--text)}
.oepnv-s{margin:0; font-size:clamp(1.05rem,2.4vw,1.3rem)}
@media (max-width:520px){ .oepnv{gap:14px; padding:16px} .oepnv .sbahn{width:56px; height:56px} }