/* dannyqparker.de · Booking · gleiche Tokens wie site.css (light "label" design) */
@font-face{font-family:'Archivo';font-style:normal;font-weight:100 900;font-stretch:62% 125%;font-display:swap;src:url(assets/archivo-var.woff2) format('woff2')}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:300 700;font-display:swap;src:url(assets/dmsans.woff2) format('woff2')}

:root{
  --bg:#ffffff;
  --ink:#010101;
  --gray:#f8f8f8;
  --gray-2:#efefef;
  --line:#dadada;
  --muted:rgba(0,0,0,.5);
  --muted-2:rgba(0,0,0,.64);
  --gold:#c9a84c;
  --gold-deep:#a8862f;
  --gold-soft:#f6efd9;
  --bad:#b42318;
  --ok:#1f7a4d;
  --wa:#25d366;
  --r-card:20px;
  --r-tile:16px;
  --r-btn:14px;
  --wrap:1368px;
  --ease:cubic-bezier(.16,1,.3,1);
  --font-display:'Archivo',Impact,'Arial Narrow Bold',sans-serif;
  --font-body:'DM Sans',system-ui,-apple-system,sans-serif;
  --top:64px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:84px;scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{font-family:var(--font-body);font-size:16px;line-height:1.5;color:var(--ink);background:var(--bg);overflow-x:hidden;-webkit-font-smoothing:antialiased;caret-color:var(--gold-deep)}
::selection{background:var(--gold);color:var(--ink)}
img{max-width:100%;display:block}
a{color:inherit}
button,input,textarea,select{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer}
fieldset{border:0;min-width:0}
[hidden]:not(.mbar){display:none!important}
legend{padding:0;width:100%}
.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 clamp(16px,2.6vw,36px)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;z-index:300;background:var(--ink);color:#fff;padding:10px 16px;border-radius:10px;text-decoration:none}
.skip:focus{top:12px}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:6px}
h1,h2,h3{font-family:var(--font-display);font-stretch:118%;font-weight:800;text-transform:uppercase;letter-spacing:-.005em;line-height:1;text-wrap:balance}

/* header */
.top{border-bottom:1px solid var(--line);background:rgba(255,255,255,.94);position:relative;z-index:20}
.top__in{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:var(--top);gap:16px}
.top__logo img{height:36px;width:auto}
.top__link{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:500;text-decoration:none;justify-self:start;padding:8px 4px;border-radius:10px;transition:color .2s}
.top__link:hover{color:var(--gold-deep)}
.top__link--wa{justify-self:end}
@media(max-width:560px){.top__link span{display:none}.top__logo img{height:30px}}

/* layout */
.layout{display:grid;grid-template-columns:minmax(0,1fr) 372px;gap:clamp(32px,4vw,64px);align-items:start;padding-top:clamp(36px,5vw,72px);padding-bottom:clamp(64px,8vw,120px)}
.layout__main{min-width:0}
@media(max-width:1100px){.layout{grid-template-columns:minmax(0,1fr)}}

/* intro */
.intro__head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding-bottom:24px;border-bottom:1px solid var(--line)}
.intro h1{font-size:clamp(46px,7.4vw,112px);line-height:.88}
.intro__count{font-family:var(--font-display);font-stretch:118%;font-weight:700;text-transform:uppercase;font-size:clamp(18px,2.6vw,40px);line-height:1;color:var(--line);text-align:right;white-space:nowrap}
.intro__lead{max-width:62ch;font-size:18px;line-height:1.6;color:var(--muted-2);margin-top:22px}
.notice{margin-top:18px;display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;background:var(--gold-soft);border-radius:var(--r-btn);padding:14px 18px;font-size:15px}
.notice a{font-weight:600;text-underline-offset:3px}
@media(max-width:640px){.intro__head{flex-direction:column;align-items:flex-start;gap:8px;padding-bottom:16px}.intro h1{font-size:clamp(30px,8.5vw,46px)}.intro__count{text-align:left}.intro__lead{font-size:16px;line-height:1.5;margin-top:14px}.cal{margin-top:28px}.cal__bar{flex-wrap:nowrap;gap:12px}.cal__title{font-size:22px}.rail{margin-top:14px}}

/* calendar */
.cal{margin-top:clamp(36px,4vw,56px)}
.cal__bar{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.cal__title{font-size:clamp(26px,3vw,40px);font-weight:700;margin-right:auto}
.cal__nav{display:flex;gap:8px}
.iconbtn{width:42px;height:42px;border-radius:50%;border:1px solid var(--line);display:inline-flex;align-items:center;justify-content:center;transition:background .2s,border-color .2s,color .2s,opacity .2s}
.iconbtn:hover:not(:disabled){background:var(--ink);border-color:var(--ink);color:#fff}
.iconbtn:active:not(:disabled){transform:scale(.95)}
.iconbtn:disabled{opacity:.3;cursor:default}

.qchip{height:36px;padding:0 14px;border-radius:99px;background:var(--gray);font-size:14px;font-weight:500;font-variant-numeric:tabular-nums;transition:background .2s,color .2s}
.qchip:hover{background:var(--ink);color:#fff}
.qchip[aria-pressed="true"]{background:var(--gold);color:var(--ink)}

.rail{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 2*28px)/3);gap:28px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;margin-top:22px;padding:4px 2px 14px;scrollbar-width:thin;scrollbar-color:var(--line) transparent;overscroll-behavior-x:contain}
.rail::-webkit-scrollbar{height:6px}
.rail::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px}
@media(max-width:900px){.rail{grid-auto-columns:calc((100% - 20px)/2);gap:20px}}
@media(max-width:600px){.rail{grid-auto-columns:100%;gap:16px}}
@media(prefers-reduced-motion:reduce){.rail{scroll-behavior:auto}}
.month{scroll-snap-align:start;min-width:0}
.month h3{display:flex;align-items:baseline;gap:8px;font-size:22px;font-weight:800;padding-bottom:12px;border-bottom:1px solid var(--ink);margin-bottom:10px}
.month h3 span{font-size:14px;font-weight:600;color:var(--muted);font-stretch:100%;letter-spacing:.02em}
.month__grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.wd{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);text-align:center;padding:4px 0 6px}
.wd--we{color:var(--ink)}
.day{position:relative;aspect-ratio:1;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:500;font-variant-numeric:tabular-nums;background:#fff;box-shadow:inset 0 0 0 1px var(--gray-2);transition:background .18s,box-shadow .18s,color .18s,transform .18s var(--ease)}
.day:hover:not(:disabled){box-shadow:inset 0 0 0 1.5px var(--ink)}
.day:active:not(:disabled){transform:scale(.94)}
.day--we{font-weight:700}
.day--today::after{content:'';position:absolute;bottom:5px;width:4px;height:4px;border-radius:50%;background:var(--gold-deep)}
.day--past{background:transparent;box-shadow:none;color:rgba(0,0,0,.22);cursor:default}
.day--busy{background:var(--gray-2);color:rgba(0,0,0,.4);box-shadow:none;cursor:not-allowed;text-decoration:line-through;text-decoration-thickness:1.5px}
.day--option{background:repeating-linear-gradient(135deg,rgba(201,168,76,.55) 0 2px,var(--gold-soft) 2px 6px);box-shadow:none}
.day[aria-pressed="true"]{background:var(--gold);color:var(--ink);box-shadow:inset 0 0 0 2px var(--ink);font-weight:800;animation:pick .42s var(--ease)}
.day--blank{visibility:hidden}
.month--skel{aspect-ratio:1/1.08;border-radius:var(--r-card);background:linear-gradient(100deg,var(--gray) 40%,#fff 50%,var(--gray) 60%) 0 0/300% 100%;animation:shimmer 1.4s linear infinite}
@keyframes shimmer{to{background-position:-150% 0}}
@keyframes pick{0%{transform:scale(.86)}100%{transform:scale(1)}}
.cal__status{min-height:22px;margin-top:6px;font-size:15px;color:var(--muted-2)}
.cal__status.is-wait{color:var(--muted)}
.cal__status.is-err{color:var(--bad)}
.cal__status.is-ok{color:var(--ink)}

/* step nav */
.steps{position:sticky;top:0;z-index:15;display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;background:rgba(255,255,255,.94);backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px);margin:clamp(40px,5vw,64px) 0 0;padding:12px 0;border-bottom:1px solid var(--line)}
.steps::-webkit-scrollbar{display:none}
.steps a{flex:none;display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 14px 0 10px;border-radius:99px;font-size:14px;font-weight:500;color:var(--muted-2);text-decoration:none;transition:background .2s,color .2s}
.steps a:hover{color:var(--ink);background:var(--gray)}
.steps a.is-current{background:var(--ink);color:#fff}
.steps i{width:16px;height:16px;border-radius:50%;box-shadow:inset 0 0 0 1.5px currentColor;opacity:.55;display:inline-flex;align-items:center;justify-content:center;transition:background .2s,opacity .2s}
.steps a.is-done i{background:var(--gold);box-shadow:none;opacity:1}
.steps a.is-done i::after{content:'';width:7px;height:4px;border:solid var(--ink);border-width:0 0 1.6px 1.6px;transform:translateY(-1px) rotate(-45deg)}

/* form blocks */
.plan{margin-top:8px}
.block{padding:clamp(36px,4vw,56px) 0;border-bottom:1px solid var(--line)}
.block:last-child{border-bottom:0}
.block>legend{float:left;width:100%}
.block>legend+*{clear:both}
.block h2{font-size:clamp(28px,3.2vw,44px);font-weight:700}
.block>legend{padding-bottom:12px}
.block__lead{margin:0 0 30px;max-width:60ch;color:var(--muted-2)}
.field{margin-top:24px}
.field:first-of-type{margin-top:0}
.field__label{display:block;font-size:14px;font-weight:600;margin-bottom:10px}
.opt{font-weight:400;color:var(--muted)}
.field__hint{font-size:13px;color:var(--muted);margin-top:8px;font-variant-numeric:tabular-nums}
.field__err{font-size:13px;color:var(--bad);margin-top:6px;min-height:0}
.field__err:empty{display:none}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}
.grid2 .field{margin-top:24px}
.grid2--zip{grid-template-columns:140px 1fr}
.grid2--zip .field{margin-top:10px}
@media(max-width:640px){.grid2--zip{grid-template-columns:120px 1fr;gap:0 10px}}
@media(max-width:640px){.grid2{grid-template-columns:1fr}}

input[type=text],input[type=email],input[type=tel],input[type=number],input[type=time],textarea{width:100%;background:#fff;border:1px solid var(--line);border-radius:var(--r-btn);padding:13px 16px;font-size:16px;line-height:1.4;outline:none;transition:border-color .2s,box-shadow .2s;-webkit-appearance:none;appearance:none}
input::placeholder,textarea::placeholder{color:rgba(0,0,0,.42)}
input:hover,textarea:hover{border-color:#bdbdbd}
input:focus,textarea:focus{border-color:var(--ink);box-shadow:0 0 0 3px rgba(201,168,76,.28)}
input[aria-invalid=true],textarea[aria-invalid=true]{border-color:var(--bad);box-shadow:0 0 0 3px rgba(180,35,24,.12)}
input:disabled,textarea:disabled{background:var(--gray);color:var(--muted)}
textarea{resize:vertical;min-height:52px}
input[type=time]{font-variant-numeric:tabular-nums;min-height:50px}
input[type=number]{-moz-appearance:textfield}
input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}

/* segmented + chips */
.seg,.chips,.presets{display:flex;flex-wrap:wrap;gap:8px}
.opt-pill{position:relative}
.opt-pill input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.opt-pill span{display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 18px;border-radius:99px;border:1px solid var(--line);font-size:15px;font-weight:500;background:#fff;transition:background .18s,color .18s,border-color .18s,transform .18s var(--ease);user-select:none}
.opt-pill:hover span{border-color:var(--ink)}
.opt-pill input:active+span{transform:scale(.97)}
.opt-pill input:checked+span{background:var(--ink);border-color:var(--ink);color:#fff}
.opt-pill input:focus-visible+span{outline:2px solid var(--ink);outline-offset:3px}
.presets .qchip{height:44px}

/* guests */
.guests{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.stepper{display:flex;align-items:center;border:1px solid var(--line);border-radius:var(--r-btn);background:#fff;transition:border-color .2s,box-shadow .2s}
.stepper:focus-within{border-color:var(--ink);box-shadow:0 0 0 3px rgba(201,168,76,.28)}
.stepper input{width:104px;border:0;box-shadow:none!important;text-align:center;font-family:var(--font-display);font-stretch:112%;font-weight:700;font-size:22px;padding:10px 0;font-variant-numeric:tabular-nums}
.stepper__btn{width:48px;height:50px;display:inline-flex;align-items:center;justify-content:center;color:var(--muted-2);transition:color .2s}
.stepper__btn:hover{color:var(--ink)}
.stepper__btn:active{transform:scale(.92)}

/* times */
.times{display:flex;align-items:center;gap:10px}
.times input{flex:1;min-width:0}
.times__sep{font-size:14px;color:var(--muted)}

/* checkbox */
.check{display:flex;align-items:flex-start;gap:12px;margin-top:22px;cursor:pointer;font-size:15px;position:relative;width:fit-content}
.check input{position:absolute;opacity:0;width:22px;height:22px;margin:0;cursor:pointer}
.check__box{flex:none;width:22px;height:22px;border-radius:7px;border:1.5px solid var(--line);background:#fff;display:inline-flex;align-items:center;justify-content:center;transition:background .18s,border-color .18s}
.check__box::after{content:'';width:9px;height:5px;border:solid #fff;border-width:0 0 2px 2px;transform:translateY(-1px) rotate(-45deg) scale(0);transition:transform .2s var(--ease)}
.check:hover .check__box{border-color:var(--ink)}
.check input:checked+.check__box{background:var(--ink);border-color:var(--ink)}
.check input:checked+.check__box::after{transform:translateY(-1px) rotate(-45deg) scale(1)}
.check input:focus-visible+.check__box{outline:2px solid var(--ink);outline-offset:3px}

/* tiles */
.tiles{display:grid;gap:12px}
.tiles--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.tiles--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.tiles--fx{grid-template-columns:repeat(auto-fill,minmax(232px,1fr));align-items:start}
@media(max-width:700px){.tiles--3{grid-template-columns:1fr}}
@media(max-width:520px){.tiles--2{grid-template-columns:1fr}.tiles--fx{grid-template-columns:1fr}}
.tile{position:relative;display:flex;flex-direction:column;gap:6px;padding:18px 18px 18px;border-radius:var(--r-tile);border:1px solid var(--line);background:#fff;cursor:pointer;transition:border-color .2s,box-shadow .25s var(--ease),transform .2s var(--ease),background .2s}
.tile input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer;z-index:1}
.tile:hover{border-color:#a9a9a9}
.tile:active{transform:scale(.985)}
.tile__ico{width:40px;height:40px;color:var(--ink);margin-bottom:8px}
.tile__ico svg{width:40px;height:40px;display:block}
.tile__title{font-weight:700;font-size:16px;line-height:1.25}
.tile__text{font-size:14px;line-height:1.5;color:var(--muted-2)}
.tile__mark{position:absolute;top:14px;right:14px;width:26px;height:26px;border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--line);display:flex;align-items:center;justify-content:center;transition:background .2s,box-shadow .2s,transform .3s var(--ease)}
.tile__mark::after{content:'';width:10px;height:6px;border:solid var(--gold);border-width:0 0 2px 2px;transform:translateY(-1px) rotate(-45deg) scale(0);transition:transform .25s var(--ease)}
.tile:has(input:checked){border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink),0 10px 24px -14px rgba(0,0,0,.35)}
.tile:has(input:checked) .tile__mark{background:var(--ink);box-shadow:none}
.tile:has(input:checked) .tile__mark::after{transform:translateY(-1px) rotate(-45deg) scale(1)}
.tile:has(input:focus-visible){outline:2px solid var(--ink);outline-offset:3px}
.tile__venue{display:none;align-items:flex-start;gap:7px;margin-top:6px;font-size:13px;line-height:1.4;color:var(--gold-deep);font-weight:600}
.tile__venue svg{flex:none;margin-top:1px}
.tile:has(input:checked) .tile__venue{display:flex}
.tile__extra{display:none;position:relative;z-index:2;margin-top:10px;cursor:default}
.tile:has(input:checked) .tile__extra{display:block}
.tile--light{padding-top:20px}
/* Beispielfotos auf den Kacheln (public/booking/img, Pexels) */
.tile.has-img{overflow:hidden}
.tile__img{display:block;width:calc(100% + 36px);max-width:none;margin:-18px -18px 8px;aspect-ratio:3/2;height:auto;object-fit:cover;background:var(--gray);transition:transform .5s var(--ease)}
.tile--light .tile__img{margin-top:-20px}
.tile.has-img:hover .tile__img{transform:scale(1.03)}
.tile.has-img .tile__mark{z-index:1;background:rgba(255,255,255,.92);box-shadow:0 1px 6px rgba(0,0,0,.25)}
.tile.has-img:has(input:checked) .tile__mark{background:var(--ink)}
@media(max-width:700px){
  .tile.has-img{display:grid;grid-template-columns:88px minmax(0,1fr);column-gap:14px;row-gap:4px;align-items:start}
  .tile.has-img>*{grid-column:2}
  .tile.has-img .tile__img{grid-column:1;grid-row:1/span 3;width:88px;margin:0;aspect-ratio:1;border-radius:10px}
  .tile.has-img .tile__title{padding-right:30px}
  .tile.has-img .tile__extra{grid-column:1/-1}
  .tile.has-img .tile__mark{top:12px;right:12px;background:#fff;box-shadow:inset 0 0 0 1.5px var(--line)}
}
@media(prefers-reduced-motion:reduce){.tile.has-img:hover .tile__img{transform:none}}
.tile--light .tile__ico{width:56px;height:56px}
.tile--light .tile__ico svg{width:56px;height:56px}

@media(max-width:520px){
  .tile,.tile--light{display:grid;grid-template-columns:40px 1fr;column-gap:14px;row-gap:4px;padding:16px 50px 16px 16px;align-items:start}
  .tile__ico,.tile--light .tile__ico{grid-column:1;grid-row:1/span 2;width:40px;height:40px;margin:0}
  .tile--light .tile__ico svg,.tile__ico svg{width:40px;height:40px}
  .tile__title,.tile__text,.tile__venue{grid-column:2}
  .tile__extra{grid-column:1/-1}
}

/* confetti swatches */
.swatches{display:flex;gap:8px;flex-wrap:wrap}
.swatch{position:relative}
.swatch input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer;z-index:1;width:100%;height:100%}
.swatch span{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 12px 0 6px;border-radius:99px;border:1px solid var(--line);font-size:13px;font-weight:500;background:#fff;transition:border-color .18s,box-shadow .18s}
.swatch i{width:22px;height:22px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12);background:var(--gray-2)}
.swatch input:checked+span{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.swatch input:focus-visible+span{outline:2px solid var(--ink);outline-offset:2px}
.cnt{display:flex;align-items:center;gap:10px;margin-bottom:10px;font-size:13px;font-weight:600}
.cnt input{width:72px;padding:8px 10px;font-size:15px;text-align:center}
.tile__extra input[type=text]{margin-top:8px;padding:10px 14px;font-size:15px}

.reveal{margin-top:14px;animation:reveal .35s var(--ease)}
@keyframes reveal{from{opacity:0;transform:translateY(-4px)}}

/* Kundenbereich: Angebot, Rechnungen, Zahlung */
.mine{margin-top:clamp(28px,4vw,44px)}
.mine h2{font-size:clamp(24px,2.6vw,34px);font-weight:700;margin-bottom:16px}
.mine__list{display:grid;gap:14px}
.doc-card{border:1px solid var(--line);border-radius:var(--r-card);padding:20px 22px;background:#fff}
.doc-card__head{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 12px}
.doc-card__kind{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--gold-deep)}
.doc-card__head b{font-weight:700}
.doc-card__pill{font-size:12px;font-weight:600;padding:4px 10px;border-radius:99px;background:var(--gray);color:var(--muted-2)}
.doc-card__pill.is-ok{background:#e7f4ec;color:var(--ok)}
.doc-card__pill.is-warn{background:var(--gold-soft);color:#7a5f1c}
.doc-card__amount{font-family:var(--font-display);font-stretch:112%;font-weight:800;font-size:30px;line-height:1;margin-top:12px;font-variant-numeric:tabular-nums}
.doc-card__meta{font-size:14px;color:var(--muted-2);margin-top:6px}
.doc-card__acts{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.doc-card__acts .btn{font-size:14px}
.pay{display:grid;grid-template-columns:auto 1fr;gap:18px 22px;margin-top:16px;padding-top:16px;border-top:1px solid var(--gray-2)}
.pay__qr{width:150px;height:150px;border-radius:12px;box-shadow:inset 0 0 0 1px var(--line);background:#fff;padding:6px}
.pay__data{display:grid;grid-template-columns:auto 1fr auto;gap:8px 12px;align-items:center;font-size:14px}
.pay__data dt{color:var(--muted)}
.pay__data dd{font-variant-numeric:tabular-nums;overflow-wrap:anywhere;font-weight:600}
.pay__copy{height:30px;padding:0 10px;border-radius:8px;box-shadow:inset 0 0 0 1px var(--line);font-size:12px;font-weight:600;color:var(--muted-2);transition:box-shadow .2s,color .2s}
.pay__copy:hover{box-shadow:inset 0 0 0 1px var(--ink);color:var(--ink)}
.pay__copy.is-ok{color:var(--ok);box-shadow:inset 0 0 0 1px #9fd3b5}
.pay__hint{grid-column:1/-1;font-size:13px;color:var(--muted)}
.pay .gap{grid-column:3}
@media(max-width:640px){
  .pay{grid-template-columns:1fr}
  .pay__qr{width:132px;height:132px}
}

/* Musikliste spaeter / direkt */
.later{margin-top:22px;padding:16px 18px;border-radius:var(--r-tile);background:var(--gray)}
.later .check{margin-top:0}
.later__send{margin-top:12px;font-size:14px;color:var(--muted-2);display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px}
.later__wa{display:inline-flex;align-items:center;gap:7px;height:36px;padding:0 14px;border-radius:99px;background:#fff;box-shadow:inset 0 0 0 1px var(--line);color:#128c4a;font-weight:600;text-decoration:none;transition:box-shadow .2s,background .2s}
.later__wa:hover{box-shadow:inset 0 0 0 1.5px #128c4a}
.later__mail{color:var(--ink);font-weight:600;text-underline-offset:3px}

/* submit */
.submit{display:flex;align-items:center;gap:20px 28px;flex-wrap:wrap;margin-top:34px}
.submit__note{flex:1;min-width:240px;font-size:13px;color:var(--muted);max-width:52ch}
.submit__note a{text-underline-offset:3px}
.form__err{margin-top:16px;color:var(--bad);font-weight:600;font-size:15px}
.form__err:empty{display:none}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* buttons (wie site.css) */
.btn{display:inline-flex;align-items:center;gap:10px;padding:10px 20px 10px 10px;border-radius:var(--r-btn);background:var(--ink);color:#fff;font-size:15px;font-weight:500;line-height:20px;text-decoration:none;transition:background .35s,transform .25s var(--ease),color .35s,opacity .2s}
.btn:hover{background:var(--gold-deep)}
.btn:active{transform:scale(.98)}
.btn__ico{width:32px;height:32px;border-radius:50%;background:#fff;color:var(--ink);display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;transition:transform .3s var(--ease)}
.btn:hover .btn__ico{transform:translateX(2px)}
.btn--big{font-size:17px;padding:12px 26px 12px 12px}
.btn--big .btn__ico{width:38px;height:38px}
.btn--ghost{background:transparent;color:var(--ink);border:1px solid var(--line);padding:11px 18px}
.btn--ghost:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.btn[aria-busy=true]{opacity:.75;pointer-events:none}
.btn[aria-busy=true] .btn__ico svg{display:none}
.btn[aria-busy=true] .btn__ico::after{content:'';width:16px;height:16px;border-radius:50%;border:2px solid var(--line);border-top-color:var(--ink);animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* ticket */
.ticket{position:sticky;top:20px}
.ticket__card{position:relative;background:var(--ink);color:#fff;border-radius:var(--r-card);padding:24px 26px 26px;overflow:hidden;box-shadow:0 30px 60px -30px rgba(0,0,0,.45);
  -webkit-mask:radial-gradient(circle 13px at 0 var(--perf,236px),transparent 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 13px at 100% var(--perf,236px),transparent 98%,#000) right/51% 100% no-repeat;
  mask:radial-gradient(circle 13px at 0 var(--perf,236px),transparent 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 13px at 100% var(--perf,236px),transparent 98%,#000) right/51% 100% no-repeat}
.ticket__card ::selection{background:var(--gold);color:var(--ink)}
.ticket__top{display:flex;justify-content:space-between;align-items:center;gap:12px}
.ticket__brand{font-family:var(--font-display);font-stretch:118%;font-weight:800;text-transform:uppercase;font-size:13px;letter-spacing:.04em}
.ticket__pill{font-size:12px;font-weight:600;padding:5px 10px;border-radius:99px;background:rgba(255,255,255,.1);color:rgba(255,255,255,.8);white-space:nowrap}
.ticket__pill.is-free{background:rgba(201,168,76,.18);color:var(--gold)}
.ticket__pill.is-fix{background:var(--gold);color:var(--ink)}
.ticket__pill.is-warn{background:rgba(255,255,255,.14);color:#fff}
.ticket__date{display:flex;flex-direction:column;margin-top:22px;min-height:168px}
.ticket__wd{font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--gold)}
.ticket__day{font-family:var(--font-display);font-stretch:118%;font-weight:800;font-size:112px;line-height:.86;letter-spacing:-.02em;margin-top:8px;font-variant-numeric:tabular-nums}
.ticket__my{font-family:var(--font-display);font-stretch:112%;font-weight:700;text-transform:uppercase;font-size:20px;margin-top:8px;color:rgba(255,255,255,.88)}
.ticket__date.is-empty .ticket__day{color:rgba(255,255,255,.14)}
.ticket__date.is-empty .ticket__my{font-family:var(--font-body);text-transform:none;font-weight:400;font-size:15px;color:rgba(255,255,255,.6);font-stretch:100%}
.ticket__date.is-new .ticket__day{animation:stampIn .5s var(--ease)}
@keyframes stampIn{0%{opacity:0;transform:translateY(10px) scale(1.06);filter:blur(4px)}100%{opacity:1;transform:none;filter:none}}
.ticket__perf{height:0;border-top:1.5px dashed rgba(255,255,255,.22);margin:22px -2px 18px}
.ticket__rows{display:grid;grid-template-columns:auto 1fr;gap:9px 16px;font-size:14px}
.ticket__rows dt{color:rgba(255,255,255,.55)}
.ticket__rows dd{color:#fff;text-align:right;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.ticket__rows .is-new{animation:rowIn .4s var(--ease)}
.ticket__rows .t-empty{grid-column:1/-1;color:rgba(255,255,255,.5);font-size:14px;text-align:left}
@keyframes rowIn{from{opacity:0;transform:translateX(6px)}}
.ticket__fx{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}
.ticket__fx:empty{display:none}
.ticket__fx span{font-size:12px;font-weight:600;padding:5px 10px;border-radius:99px;box-shadow:inset 0 0 0 1px rgba(201,168,76,.6);color:var(--gold);animation:rowIn .35s var(--ease)}
.ticket__cta{display:flex;align-items:center;justify-content:center;width:100%;height:54px;margin-top:22px;border-radius:var(--r-btn);background:#fff;color:var(--ink);font-weight:600;font-size:16px;transition:background .3s,transform .2s var(--ease)}
.ticket__cta:hover{background:var(--gold)}
.ticket__cta:active{transform:scale(.98)}
.ticket__cta:focus-visible,.ticket__ics:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.ticket__cta:disabled{opacity:.5;cursor:default}
.ticket__ics{display:flex;align-items:center;justify-content:center;gap:8px;height:46px;margin-top:10px;border-radius:var(--r-btn);box-shadow:inset 0 0 0 1px rgba(255,255,255,.25);color:#fff;text-decoration:none;font-size:14px;font-weight:600;transition:box-shadow .2s,color .2s}
.ticket__ics:hover{box-shadow:inset 0 0 0 1px var(--gold);color:var(--gold)}
.ticket__ics[hidden]{display:none}
.ticket__note{margin-top:12px;font-size:12px;color:rgba(255,255,255,.5);text-align:center}
.ticket__stamp{position:absolute;right:22px;top:100px;font-family:var(--font-display);font-stretch:118%;font-weight:800;text-transform:uppercase;font-size:18px;letter-spacing:.04em;color:var(--gold);border:2.5px solid var(--gold);border-radius:10px;padding:6px 12px;transform:rotate(-9deg) scale(1.6);opacity:0;pointer-events:none;mix-blend-mode:screen}
.ticket__stamp.is-on{animation:stamp .55s var(--ease) forwards}
@keyframes stamp{0%{opacity:0;transform:rotate(-9deg) scale(1.6)}60%{opacity:1}100%{opacity:.92;transform:rotate(-9deg) scale(1)}}
@media(max-width:1100px){
  .ticket{position:static;max-width:520px}
  .ticket__date{min-height:0}
}

/* done */
.done{margin-top:clamp(36px,4vw,56px);max-width:860px}
.done:focus{outline:none}
.done h2{font-size:clamp(40px,6vw,80px);line-height:.9}
.done__lead{margin-top:18px;font-size:18px;line-height:1.6;color:var(--muted-2);max-width:60ch}
.done__link{margin:30px 0 26px;background:var(--gray);border-radius:var(--r-card);padding:22px 24px}
.done__label{display:block;font-size:13px;font-weight:600;color:var(--muted-2);margin-bottom:10px}
.done__row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.done__row code{flex:1;min-width:0;font:15px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 14px;overflow-wrap:anywhere}

/* mobile bar */
.mbar{position:fixed;left:12px;right:12px;bottom:12px;z-index:50;display:flex;align-items:center;gap:12px;background:var(--ink);color:#fff;border-radius:18px;padding:10px 10px 10px 18px;box-shadow:0 18px 40px -16px rgba(0,0,0,.5);transform:translateY(0);transition:transform .35s var(--ease),opacity .25s}
.mbar[hidden]{display:flex;transform:translateY(140%);opacity:0;pointer-events:none}
.mbar__info{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.25}
.mbar__info b{font-family:var(--font-display);font-stretch:112%;font-weight:800;text-transform:uppercase;font-size:15px;font-variant-numeric:tabular-nums}
.mbar__info span{font-size:13px;color:rgba(255,255,255,.62);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mbar__btn{flex:none;height:46px;padding:0 20px;border-radius:12px;background:#fff;color:var(--ink);font-weight:600;transition:background .2s}
.mbar__btn:hover{background:var(--gold)}
.mbar__btn:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
@media(min-width:1101px){.mbar{display:none!important}}
@media(max-width:1100px){body.has-mbar .foot{padding-bottom:96px}html:has(body.has-mbar){scroll-padding-bottom:96px}}
.mbar__info span.is-free{color:#7fd69a}.mbar__info span.is-warn{color:var(--gold)}

/* toast */
.toast{position:fixed;left:50%;bottom:24px;z-index:80;transform:translate(-50%,20px);background:var(--ink);color:#fff;padding:12px 18px;border-radius:12px;font-size:14px;font-weight:500;opacity:0;pointer-events:none;transition:opacity .25s,transform .35s var(--ease);max-width:calc(100vw - 32px)}
.toast.is-on{opacity:1;transform:translate(-50%,0)}
@media(max-width:1100px){.toast{bottom:96px}}

/* locked form */
.plan.is-locked{opacity:.6;pointer-events:none}

/* footer */
.foot{border-top:1px solid var(--line);padding:22px 0;font-size:13px;color:var(--muted)}
.foot__in{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
.foot nav{display:flex;gap:18px}
.foot a{text-decoration:none}
.foot a:hover{color:var(--ink)}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

/* Ablauf des Abends */
.tl{display:grid;gap:8px}
.tl__row{display:grid;grid-template-columns:minmax(150px,200px) 112px minmax(0,1fr);gap:10px;align-items:center}
.tl__name{font-size:15px;font-weight:600}
.tl__row input{padding:11px 14px}
@media(max-width:640px){
  .tl{gap:14px}
  .tl__row{grid-template-columns:104px minmax(0,1fr);gap:6px 10px}
  .tl__name{grid-column:1/-1}
}

/* Kundenstimmen */
.quotes{margin-top:36px;display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.quote{margin:0;background:var(--gray);border-radius:var(--r-card);padding:20px 22px}
.quote p{font-size:16px;line-height:1.55}
.quote p::before{content:'„'}
.quote p::after{content:'“'}
.quote footer{margin-top:10px;font-size:13px;font-weight:600;color:var(--muted-2)}

/* Stornobedingungen beim Angebot */
.terms{margin-top:14px;font-size:14px;line-height:1.5}
.terms details{margin-bottom:10px}
.terms summary{cursor:pointer;font-weight:600;text-decoration:underline;text-underline-offset:3px}
.terms__text{margin-top:8px;white-space:pre-line;color:var(--muted-2)}
.btn:disabled{opacity:.4;cursor:not-allowed;transform:none}
.btn:disabled:hover{background:var(--ink)}

/* Hinweis "muss nicht alles wissen", Etikett "kann warten", Angebotswunsch */
.tip{margin-top:18px;max-width:62ch;border-left:3px solid var(--gold);padding:4px 0 4px 16px;font-size:15px;color:var(--muted-2)}
.tip b{color:var(--ink);font-weight:700}
.later{display:inline-block;vertical-align:middle;margin-left:10px;padding:4px 10px;border-radius:99px;background:var(--gray);color:var(--muted-2);font-family:var(--font-body);font-size:12px;font-weight:600;letter-spacing:.02em;transform:translateY(-.15em)}
.offer-ask{margin:28px 0 0;padding:16px 18px;border-radius:var(--r-btn);background:var(--gold-soft)}
.offer-ask.is-asked{background:var(--gray);color:var(--muted-2)}
@media(min-width:521px) and (max-width:700px){.tiles--pick{grid-template-columns:repeat(3,minmax(0,1fr))}}
.offer-ask.is-asked .check__box{display:none}
