.booking-modal{position:fixed;inset:0;width:min(880px,calc(100% - 28px));max-width:none;max-height:min(92dvh,850px);margin:auto;padding:0;border:1px solid #dce0d5;border-radius:22px;background:#fff;color:#20231d;box-shadow:0 35px 100px #0008;overflow:auto}
.booking-modal::backdrop{background:#11160fbb;backdrop-filter:blur(7px)}
.booking-modal *{box-sizing:border-box}.booking-modal button,.booking-modal input{font:inherit}
.booking-modal .booking-close{position:absolute;z-index:2;top:18px;right:20px;display:grid;place-items:center;width:36px;height:36px;border:1px solid #dbe0d3;border-radius:50%;background:#fff;color:#20231d;font-size:22px;cursor:pointer}
.booking-modal .booking-intro{padding:33px 42px 23px}.booking-modal .booking-intro h1{margin:8px 0;font-size:clamp(30px,4vw,44px);line-height:1.05;letter-spacing:-.05em}.booking-modal .booking-intro>p:last-child{margin:0;color:#6d7268;font-size:12px;line-height:1.5}
.booking-modal .booking-progress{display:flex;border-block:1px solid #e8ebe4;background:#f9faf7}.booking-modal .booking-progress span{display:flex;align-items:center;gap:9px;flex:1;padding:13px 24px;border-right:1px solid #e8ebe4;color:#90988a;font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase}.booking-modal .booking-progress span:last-child{border:0}.booking-modal .booking-progress b{display:grid;place-items:center;width:25px;height:25px;border:1px solid #dce1d5;border-radius:50%;font-size:9px}.booking-modal .booking-progress [aria-current=step]{color:#24311d}.booking-modal .booking-progress [aria-current=step] b{border-color:#b9ea70;background:#b9ea70}
.booking-modal .booking-progress .can-return{color:#536348;cursor:pointer;touch-action:manipulation}.booking-modal .booking-progress .can-return b{border-color:#9bc95d;color:#24311d}.booking-modal .booking-progress .can-return:hover{background:#f1f7e9}.booking-modal .booking-progress .can-return:focus-visible{position:relative;z-index:1;outline:3px solid #9aca64;outline-offset:-3px}
.booking-modal .booking-layout{display:grid;grid-template-columns:minmax(0,1fr) 240px;min-height:400px}.booking-modal .booking-content{padding:30px 42px 35px}.booking-modal .booking-step[hidden]{display:none}.booking-modal .booking-step h2{margin:9px 0 7px;font-size:clamp(25px,3vw,34px);letter-spacing:-.045em}.booking-modal .booking-step>p:not(.eyebrow){margin:0 0 22px;color:#6c7368;font-size:12px;line-height:1.55}
.booking-modal #booking-app[data-loading] .booking-content{position:relative;min-height:420px}.booking-modal #booking-app[data-loading] [data-step="1"]>*{visibility:hidden}.booking-modal #booking-app[data-loading] [data-step="1"]::before{content:"";position:absolute;z-index:2;top:50%;left:50%;width:58px;height:58px;border-radius:50%;background:conic-gradient(#b9ea70 var(--booking-load,0%),#e8ece3 0);mask:radial-gradient(farthest-side,transparent calc(100% - 7px),#000 0);animation:booking-ring-fill 1.45s cubic-bezier(.22,.75,.2,1) infinite;transform:translate(-50%,-78%)}.booking-modal #booking-app[data-loading] [data-step="1"]::after{content:"Nächster freier Termin wird geladen …";position:absolute;z-index:2;top:calc(50% + 38px);left:50%;width:min(260px,80%);color:#66705f;font-size:11px;font-weight:700;letter-spacing:.04em;text-align:center;transform:translateX(-50%)}
@property --booking-load{syntax:"<percentage>";inherits:false;initial-value:0%}@keyframes booking-ring-fill{0%{--booking-load:0%;transform:translate(-50%,-78%) rotate(-90deg)}72%,100%{--booking-load:100%;transform:translate(-50%,-78%) rotate(-90deg)}}
.booking-modal .booking-next{display:grid;grid-template-columns:1fr auto;gap:5px 18px;align-items:center;margin:20px 0 22px;padding:17px 18px;border:1px solid #a9d56b;border-radius:13px;background:#f2fae7}.booking-modal .booking-next>span{grid-column:1/-1;color:#63833d;font-size:9px;font-weight:800;letter-spacing:.12em}.booking-modal .booking-next strong{font-size:16px;line-height:1.25}.booking-modal .booking-next small{grid-column:1;color:#5e6958;font-size:10px}.booking-modal .booking-next button{grid-column:2;grid-row:2/4;align-self:stretch;padding:9px 13px;border:0;border-radius:9px;background:#b9ea70;color:#17200f;font-size:10px;font-weight:800;cursor:pointer}.booking-modal .booking-next button:hover{background:#a9dc62}.booking-modal .booking-month-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:18px 0 10px}.booking-modal .booking-month-head strong{text-transform:capitalize;font-size:14px}.booking-modal .booking-month-head button{width:34px;height:34px;border:1px solid #dce1d4;border-radius:50%;background:#fff;cursor:pointer}.booking-modal .booking-month-head button:disabled{opacity:.3;cursor:not-allowed}.booking-modal .booking-weekdays,.booking-modal .booking-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px}.booking-modal .booking-weekdays{margin-bottom:5px;color:#8b9287;font-size:8px;font-weight:800;text-align:center;text-transform:uppercase}.booking-modal .booking-days button{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1px;aspect-ratio:1;min-height:48px;padding:3px;border:1px solid transparent;border-radius:9px;background:#f7f8f5;color:#b7bdb3;cursor:not-allowed}.booking-modal .booking-days button small{font-size:7px}.booking-modal .booking-days button strong{font-size:15px}.booking-modal .booking-days button.is-free{border-color:#9bc95d;background:#b9ea70;color:#18210f;cursor:pointer}.booking-modal .booking-days button.is-free:hover,.booking-modal .booking-days button.is-selected{border-color:#24311d;background:#a9dc62;box-shadow:inset 0 0 0 1px #24311d}.booking-modal .booking-day-spacer{min-height:48px}
.booking-modal .booking-text-link{margin:18px 0 0;padding:0;border:0;background:none;color:#526c34;font-size:11px;font-weight:700;text-decoration:underline;text-underline-offset:4px;cursor:pointer}.booking-modal .booking-empty{margin-top:20px!important;padding:14px;border-radius:9px;background:#f5f7f2}.booking-modal .booking-times{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-top:22px}.booking-modal .booking-times button{min-height:62px;border:1px solid #dce2d4;border-radius:10px;background:#f7faf3;color:#202820;font-size:17px;font-weight:700;cursor:pointer}.booking-modal .booking-times small{display:block;margin-top:2px;color:#788176;font-size:10px;font-weight:400}
.booking-modal .booking-mobile-details{display:none}
.booking-modal .booking-layout{grid-template-columns:minmax(0,1fr) minmax(270px,31%)}
.booking-modal .booking-summary{padding:34px 27px}.booking-modal .booking-summary .eyebrow{font-size:12px;letter-spacing:.12em}.booking-modal .booking-summary h3{font-size:23px;line-height:1.18;margin:20px 0 9px}.booking-modal .booking-summary>p{font-size:12px}.booking-modal .booking-summary dl div{font-size:12px;padding:16px 0}.booking-modal .booking-summary .booking-total{font-size:12px}.booking-modal .booking-total strong{font-size:26px}
.booking-modal .booking-calendar{display:grid;grid-template-columns:minmax(0,1fr) 154px;gap:20px;align-items:center;margin:24px 0;padding:20px;border:1px solid #dce7d0;border-radius:15px;background:#f5faed}.booking-modal .booking-calendar[hidden]{display:none}.booking-modal .booking-calendar strong{font-size:15px}.booking-modal .booking-calendar p{margin:8px 0 12px;color:#596455;font-size:11px;line-height:1.5}.booking-modal .booking-calendar a{color:#3c6027;font-size:11px;font-weight:750;text-underline-offset:3px}.booking-modal .booking-calendar-code{width:154px;aspect-ratio:1;padding:7px;border:1px solid #e1e8d8;border-radius:9px;background:#fff}.booking-modal .booking-calendar-code svg{display:block;width:100%;height:100%}
.booking-modal .booking-summary{padding:29px 22px;background:#20231d;color:#fff}.booking-modal .booking-summary .eyebrow{color:#b9ea70}.booking-modal .booking-summary h3{margin:14px 0 4px;font-size:19px;letter-spacing:-.035em}.booking-modal .booking-summary>p,.booking-modal .booking-summary>small{color:#c4cfc0;font-size:11px;line-height:1.5}.booking-modal .booking-summary dl{margin:25px 0;border-top:1px solid #4b5545}.booking-modal .booking-summary dl div{display:flex;justify-content:space-between;gap:8px;padding:13px 0;border-bottom:1px solid #4b5545;font-size:10px}.booking-modal .booking-summary dt{color:#aebcaa}.booking-modal .booking-summary dd{margin:0;text-align:right}.booking-modal .booking-total{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin:23px 0 10px;font-size:11px}.booking-modal .booking-total strong{color:#b9ea70;font-size:22px}
.booking-modal form{display:grid;gap:14px;margin-top:22px}.booking-modal form label:not(.booking-consent){display:grid;gap:6px;font-size:11px;font-weight:700}.booking-modal input:not([type=checkbox]){width:100%;height:46px;padding:10px 12px;border:1px solid #dce2d5;border-radius:9px;background:#fcfdfa}.booking-modal .booking-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}.booking-modal .booking-consent{display:flex;align-items:flex-start;gap:10px;color:#555e52;font-size:10px;line-height:1.5}.booking-modal .booking-consent input{margin:3px 0 0;accent-color:#6c9936}.booking-modal .booking-order{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;padding:14px;border:1px solid #cbdcb8;border-radius:10px;background:#f4faee;font-size:11px}.booking-modal .booking-order strong{font-size:18px}.booking-modal .booking-payment-timing{flex-basis:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:3px;padding:11px 12px;border-radius:8px;background:#20231d;color:#fff}.booking-modal .booking-payment-timing b{color:#b9ea70;font-size:12px;letter-spacing:.01em}.booking-modal .booking-payment-timing span{color:#d8ddd3;font-size:10px;white-space:nowrap}.booking-modal .booking-order small{flex-basis:100%;color:#5b6d4e;line-height:1.45}.booking-modal .booking-payment-pill{display:inline-flex;margin:0 0 5px!important;padding:6px 9px;border:1px solid #7e985d;border-radius:99px;color:#dfffb0!important;font-size:10px!important;font-weight:750;line-height:1.2!important}.booking-modal .booking-submit{width:100%;min-height:48px;padding:12px;border:0;border-radius:9px;background:#b9ea70;color:#101010;font-size:13px;font-weight:800;cursor:pointer}.booking-modal .booking-submit:hover{background:#a9dc62}.booking-modal .booking-submit:disabled{opacity:.55;cursor:wait}.booking-modal .booking-legal{margin:0!important;color:#6d7369;font-size:10px!important;line-height:1.5!important}.booking-modal #booking-status{margin:0!important;padding:12px;border-radius:8px;background:#fff0e9;color:#8d3b25;font-size:11px!important}.booking-modal button:focus-visible,.booking-modal input:focus-visible,.booking-modal a:focus-visible{outline:3px solid #9aca64;outline-offset:2px}
@media(max-width:740px){.booking-modal .booking-layout{grid-template-columns:1fr}.booking-modal .booking-summary{grid-row:1;padding:17px 24px}.booking-modal .booking-summary dl{display:flex;flex-wrap:wrap;gap:13px;margin:12px 0}.booking-modal .booking-summary dl div{border:0;padding:0}.booking-modal .booking-summary>small{display:none}.booking-modal .booking-total{margin:8px 0 0}.booking-modal .booking-content{padding:25px 24px}.booking-modal .booking-progress span{justify-content:center;padding:11px 5px;font-size:9px}}
@media(max-width:510px){.booking-modal{width:100%;max-height:100dvh;height:100dvh;border:0;border-radius:0}.booking-modal .booking-intro{padding:26px 22px 18px}.booking-modal .booking-close{top:15px;right:16px}.booking-modal .booking-intro h1{font-size:31px;max-width:calc(100% - 35px)}.booking-modal .booking-progress span{gap:5px}.booking-modal .booking-progress b{width:22px;height:22px}.booking-modal .booking-content{padding:23px 18px 40px}.booking-modal .booking-summary{padding:17px 18px}.booking-modal .booking-next{grid-template-columns:1fr;padding:15px}.booking-modal .booking-next button{grid-column:1;grid-row:auto;margin-top:7px;min-height:42px}.booking-modal .booking-days,.booking-modal .booking-weekdays{gap:3px}.booking-modal .booking-days button{min-height:39px;border-radius:7px}.booking-modal .booking-days button strong{font-size:14px}.booking-modal .booking-days button small{font-size:6px}.booking-modal .booking-day-spacer{min-height:39px}.booking-modal .booking-times{grid-template-columns:repeat(2,1fr)}.booking-modal .booking-fields{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.booking-modal #booking-app[data-loading] [data-step="1"]::before{--booking-load:70%;animation:none;transform:translate(-50%,-78%) rotate(-90deg)}}
.booking-modal .booking-summary{padding:34px 27px}.booking-modal .booking-summary .eyebrow{font-size:12px}.booking-modal .booking-summary h3{font-size:23px;margin:20px 0 9px}.booking-modal .booking-summary>p{font-size:12px}.booking-modal .booking-summary dl div{font-size:12px;padding:16px 0}.booking-modal .booking-total strong{font-size:26px}
@media(max-width:740px){.booking-modal .booking-layout{grid-template-columns:1fr}.booking-modal .booking-summary{padding:20px 24px}.booking-modal .booking-summary dl div{padding:0}}
@media(max-width:510px){.booking-modal .booking-summary{padding:18px}.booking-modal .booking-calendar{grid-template-columns:minmax(0,1fr) 112px;gap:12px;padding:15px}.booking-modal .booking-calendar-code{width:112px;padding:4px}.booking-modal .booking-calendar strong{font-size:13px}.booking-modal .booking-calendar p{font-size:10px}}

/* Give the payment badge its own line and room above the explanatory copy. */
.booking-modal .booking-summary>.booking-payment-pill{display:flex;width:fit-content;max-width:100%;margin:18px 0 14px!important;padding:9px 12px;line-height:1.45!important;white-space:normal}
@media(min-width:741px){.booking-modal .booking-summary>small{display:block;line-height:1.65}}
@media(max-width:740px){.booking-modal .booking-summary>.booking-payment-pill{margin:14px 0 10px!important;padding:8px 11px}}
@media(max-width:510px){.booking-modal .booking-calendar{grid-template-columns:1fr;gap:14px}.booking-modal .booking-calendar-code{width:min(170px,100%);justify-self:center;padding:6px}}

/* Mobile booking is task-first: the calendar follows the compact service header immediately. */
@media(max-width:510px){
  .booking-modal .booking-intro{min-height:82px;padding:17px 62px 14px 18px}
  .booking-modal .booking-intro .eyebrow{font-size:7px;letter-spacing:.08em;white-space:nowrap}
  .booking-modal .booking-intro h1{margin:6px 0 0;font-size:27px;line-height:1;max-width:none}
  .booking-modal .booking-intro>p:last-child{display:none}
  .booking-modal .booking-close{position:fixed;top:12px;right:13px;width:38px;height:38px;background:#fff}
  .booking-modal .booking-progress{position:sticky;z-index:3;top:0}
  .booking-modal .booking-progress span{min-height:48px;padding:8px 3px;font-size:8px}
  .booking-modal .booking-layout{display:flex;flex-direction:column;min-height:0}
  .booking-modal .booking-content{order:1;padding:14px 16px 28px}
  .booking-modal .booking-summary{order:2;grid-row:auto;padding:17px 18px}
  .booking-modal #booking-app[data-current-step="0"] .booking-summary,
  .booking-modal #booking-app[data-current-step="1"] .booking-summary,
  .booking-modal #booking-app[data-current-step="2"] .booking-summary{display:none}
  .booking-modal #booking-app[data-current-step="1"] [data-step="1"]{display:flex;flex-direction:column}
  .booking-modal #booking-app[data-current-step="1"] [data-step="1"]>.eyebrow,
  .booking-modal #booking-app[data-current-step="1"] [data-step="1"]>h2,
  .booking-modal #booking-app[data-current-step="1"] [data-step="1"]>p:not(.booking-empty){display:none}
  .booking-modal .booking-step h2{margin:5px 0 3px;font-size:29px}
  .booking-modal .booking-step>p:not(.eyebrow){margin-bottom:14px}
  .booking-modal .booking-next{order:-1;margin:0 0 14px;padding:13px 14px}
  .booking-modal .booking-next>span{font-size:8px}
  .booking-modal .booking-next strong{font-size:15px}
  .booking-modal .booking-next small{font-size:9px}
  .booking-modal .booking-next button{min-height:39px;margin-top:5px}
  .booking-modal .booking-month-head{margin:0 0 9px}
  .booking-modal .booking-text-link{margin-top:13px}
  .booking-modal .booking-mobile-details{display:block;margin-top:16px;border-top:1px solid #e2e6dc}
  .booking-modal .booking-mobile-details summary{display:flex;justify-content:space-between;align-items:center;padding:15px 2px;color:#46533c;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;list-style:none}
  .booking-modal .booking-mobile-details summary::-webkit-details-marker{display:none}
  .booking-modal .booking-mobile-details summary span{font-size:20px;font-weight:400;transition:transform .25s ease}
  .booking-modal .booking-mobile-details[open] summary span{transform:rotate(45deg)}
  .booking-modal .booking-mobile-details div{padding:0 2px 15px}
  .booking-modal .booking-mobile-details strong{font-size:14px}
  .booking-modal .booking-mobile-details p{margin:7px 0!important;color:#697064;font-size:10px!important;line-height:1.5!important}
  .booking-modal .booking-mobile-details small{color:#7b8376;font-size:9px}
}
.booking-modal #booking-app[data-current-step="0"] .booking-progress{display:none}.booking-scope-step{padding-block:3px}.booking-scope-options{display:grid;gap:12px;margin-top:23px}.booking-scope-options button{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:18px;width:100%;min-height:92px;padding:17px 19px;border:1px solid #dce1d5;border-radius:14px;background:#fafbf8;color:#20231d;text-align:left;cursor:pointer;transition:border-color .2s,background .2s,transform .2s}.booking-scope-options button:hover{border-color:#91b75d;background:#f5faed;transform:translateY(-1px)}.booking-scope-options button.is-selected{border-color:#91b75d;background:#eef8df;box-shadow:inset 0 0 0 1px #b9ea70}.booking-scope-options button>span{display:grid;gap:6px}.booking-scope-options strong{font-size:15px;line-height:1.25}.booking-scope-options small{color:#6c7468;font-size:10px;line-height:1.45}.booking-scope-options b{font-size:20px;white-space:nowrap}.booking-scope-note{margin:17px 0 0!important;padding-top:15px;border-top:1px solid #e5e8e0;color:#737a6e!important;font-size:10px!important}.booking-change-scope[hidden]{display:none}
@media(max-width:510px){.booking-modal .booking-scope-options{margin-top:17px}.booking-modal .booking-scope-options button{min-height:84px;padding:15px}.booking-modal .booking-scope-options strong{font-size:14px}.booking-modal .booking-scope-options b{font-size:18px}}
@media(max-width:740px){.booking-modal .booking-summary{padding:20px 24px}.booking-modal .booking-summary dl div{padding:0}}
@media(max-width:510px){.booking-modal .booking-summary{padding:18px}.booking-modal .booking-calendar{grid-template-columns:minmax(0,1fr) 112px;gap:12px;padding:15px}.booking-modal .booking-calendar-code{width:112px;padding:4px}.booking-modal .booking-calendar strong{font-size:13px}.booking-modal .booking-calendar p{font-size:10px}}
