/* Real screenshots, scroll-driven walkthrough, isolated drag demonstration. */
.real-screen{display:block;position:relative;width:100%;padding:0;border:0;background:#f5f8f5;cursor:zoom-in;text-align:left;overflow:hidden;color:var(--ink)}
.real-screen img{display:block;width:100%;height:auto;max-height:none}
.hero .official-hero{transform:none;border:1px solid #b7d9ca;animation:none}
.hero .official-hero img{width:100%;height:auto}
.screen-zoom{position:absolute;bottom:12px;right:12px;padding:6px 10px;border:1px solid #d1e6d9;border-radius:20px;background:#fffffff2;color:#245e42;font-size:10px;font-weight:600;opacity:0;transition:opacity .2s}
.real-screen:hover .screen-zoom,.real-screen:focus-visible .screen-zoom{opacity:1}
#modulos{padding-bottom:0}
.scroll-tour{position:relative;display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:54px;align-items:start}
.tour-sticky{position:sticky;top:110px;min-width:0;padding:16px 0;background:#fff}
.tour-sticky .tabs{margin-bottom:8px}
.tour-controls{margin-bottom:16px;font-size:11px}
.scroll-cue{color:#237e59;display:flex;gap:8px;align-items:center}
.scroll-cue span{font-size:18px}
.tour-window{position:relative;display:grid;overflow:clip;border-radius:14px}
.tour-window>.official-preview{grid-area:1/1;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .24s ease,transform .24s ease,visibility .24s;pointer-events:none}
.tour-window>.official-preview.is-current{opacity:1;visibility:visible;transform:none;pointer-events:auto}
.tour-panel{position:relative;display:flex;align-items:center;min-height:82svh;padding:70px 0;scroll-margin-top:110px}
.tour-panel h3{font-family:inherit;font-size:clamp(26px,2.7vw,38px);letter-spacing:-1.2px;line-height:1.15;margin:20px 0}
.tour-panel p{font-size:14px;line-height:1.8}
.tour-panel ul{font-size:12px;line-height:1.6}
.tour-panel li{margin:13px 0}
.scroll-tour .official-preview{padding:0;width:100%;min-height:0;box-shadow:0 10px 40px #173e2e0c}
.scroll-tour .real-screen img{width:100%;height:auto;max-height:calc(100svh - 300px);object-fit:contain}
.scroll-tour .preview-head{padding:12px 16px}
.scroll-tour .preview-label{padding:8px 12px;font-size:9px}
.tour-progress{height:3px;background:#e8f1ec;margin:20px 0 12px;overflow:hidden}
.tour-progress span{display:block;height:100%;background:var(--button);transform:scaleX(.25);transform-origin:left;transition:transform .24s}
.reschedule{padding-top:90px}
.reschedule .section-heading{align-items:center}
.reschedule h2 em{color:#218b63}
.drag-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:12px}
.demo-badge{font-size:11px;color:#21714f;background:#eaf7ef;border:1px solid #cce9d8;border-radius:30px;padding:7px 12px}
.drag-toolbar button{font-size:12px;padding:9px 14px;border:1px solid #bddbc9;border-radius:8px;background:#fff;color:#276747;cursor:pointer}
.drag-toolbar button:first-child{background:var(--button);border-color:var(--button);color:white;margin-right:6px}
#drag-help{font-size:12px;color:#698072;margin:12px 0 18px}
.drag-scroll{width:100%;overflow:auto;border:1px solid #b8d7c7;border-radius:15px;box-shadow:0 22px 65px #173e2e10;overscroll-behavior-x:contain}
.drag-canvas{position:relative;min-width:900px;container-type:inline-size;user-select:none;aspect-ratio:1348/926;overflow:hidden;background:#f6f9f7}
.drag-canvas>img{display:block;width:100%;height:auto;pointer-events:none}
.drag-booking{position:absolute;z-index:3;left:35.385%;top:55.508%;width:9.718%;height:5.724%;padding:.42cqw .5cqw;border:1px solid #84cdb0;border-left:3px solid #1caa78;border-radius:.6cqw;background:#e5f7ee;color:#194a36;text-align:left;box-shadow:0 0 0 3px #26ad7833,0 5px 12px #14593715;cursor:grab;touch-action:none;display:flex;flex-direction:column;justify-content:center;gap:.12cqw;line-height:1.25;font:inherit;transition:box-shadow .2s}
.drag-booking:focus-visible{outline:3px solid #16865c;outline-offset:4px}
.drag-booking.is-dragging{cursor:grabbing;box-shadow:0 12px 30px #123c3440,0 0 0 3px #26ad7840;z-index:5}
.demo-client{display:flex;align-items:center;gap:.35cqw;white-space:nowrap}
.demo-client>span{display:grid;place-items:center;width:1.25cqw;height:1.25cqw;border-radius:50%;background:#ccf0df;color:#188761;font-size:.58cqw;font-weight:700;flex-shrink:0}
.demo-client strong{font-size:.7cqw;overflow:hidden;text-overflow:ellipsis}
.drag-booking small,.demo-time{font-size:.63cqw;color:#507660}
.drag-booking i{position:absolute;right:.25cqw;top:.15cqw;font-style:normal;font-size:1cqw;color:#199467}
.drop-zone{position:absolute;display:none;z-index:2;border:2px dashed #26ad78;background:#26ad7815;border-radius:.6cqw;pointer-events:none}
.demo-pointer{display:none;position:absolute;z-index:6;pointer-events:none;filter:drop-shadow(0 2px 3px #0002)}
.demo-pointer>span{position:absolute;left:24px;top:30px;white-space:nowrap;background:#173d2b;color:white;border-radius:20px;padding:6px 10px;font-size:11px}
.drag-result{display:flex;gap:15px;align-items:center;background:#f2faf5;border:1px solid #d4e9dc;border-radius:12px;margin-top:16px;padding:18px 20px}
.drag-result b{display:block;font-size:13px}.drag-result #drag-result-text{display:block;color:#5a7866;font-size:12px;margin-top:3px}
.local-demo{margin-left:auto;font-size:10px;color:#6b8878;text-align:right}
#screen-dialog{width:min(1450px,96vw);max-width:96vw;max-height:95svh;border:1px solid #d8e9de;border-radius:12px;padding:45px 8px 8px;background:#f6faf7;box-shadow:0 30px 120px #0005;overflow:auto}
#screen-dialog::backdrop{background:#102c20c9;backdrop-filter:blur(5px)}
#screen-dialog img{display:block;width:100%;height:auto}
#close-screen{position:absolute;top:8px;right:12px;background:#1d8058;color:white;border:0;border-radius:6px;padding:6px 14px;cursor:pointer}
@media(max-width:950px){.scroll-tour{gap:28px;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr)}.tour-panel h3{font-size:28px}.tour-panel p{font-size:13px}.tour-sticky .tabs button{padding:12px 5px;font-size:11px}}
@media(max-width:650px){.scroll-tour{display:block}.tour-sticky{position:relative;top:auto;padding:0}.tour-window,.tour-progress,.tour-controls{display:none}.tour-sticky .tabs{margin-bottom:24px}.tour-panel{display:flex;flex-direction:column;align-items:stretch;min-height:0;gap:24px;padding:30px 0 55px}.tour-panel+.tour-panel{border-top:1px solid #e2eee6}.tour-panel h3{font-size:29px;margin:14px 0}.tour-panel h3 br{display:none}.tour-panel p{font-size:13px}.tour-panel ul{font-size:12px}.scroll-tour .real-screen img{max-height:none}.reschedule{padding-top:60px}.drag-toolbar{align-items:flex-start;gap:10px}.drag-toolbar button{font-size:11px;padding:8px 12px}.drag-scroll{border-radius:10px}.drag-result{padding:13px;gap:10px}.local-demo{display:none}.screen-zoom{opacity:1;font-size:8px;bottom:6px;right:6px}.hero .screen-zoom{bottom:14px}}
@media(max-height:680px) and (min-width:651px){.tour-sticky{top:90px}.scroll-tour .real-screen img{max-height:calc(100svh - 255px)}.tour-panel{min-height:90svh}}
@media(prefers-reduced-motion:reduce){.demo-pointer{display:none!important}.tour-progress span,.tour-window>.official-preview{transition:none}}
/* Complete menu tour and separately contracted billing add-on. */
.tour-sticky .tabs{display:flex;flex-wrap:wrap;gap:6px;border:0;margin-bottom:14px;padding:0}
.tour-sticky .tabs button{flex:0 0 auto;border:1px solid #dce9e1;border-radius:7px;padding:8px 10px;font-size:11px;line-height:1.25;background:#fff;white-space:nowrap;color:#5c7467}
.tour-sticky .tabs button span{opacity:.65;font-size:9px;margin-right:3px}
.tour-sticky .tabs button[aria-current=step]{background:#e8f7ef;border-color:#76b899;color:#176a49}
.scroll-tour .real-screen img{max-height:calc(100svh - 385px)}
.billing h2{font-size:clamp(35px,3.7vw,52px)}
.billing h2 em{color:#238c64}
.billing-copy .billing-benefits{padding:0;list-style:none;margin:26px 0;color:#54705f;font-size:13px;line-height:1.7}
.billing-benefits li{position:relative;padding-left:23px;margin:13px 0}
.billing-benefits li:before{content:'✓';position:absolute;left:0;color:#239768}
.billing-benefits b{color:#254d37}
.billing-copy .billing-note{font-size:12px;line-height:1.7;margin:22px 0;color:#62796c}
.billing-note strong{display:block;color:#335d45}
.billing-copy>.button{font-size:12px;gap:18px}
.billing-offer{display:grid;grid-template-columns:1fr auto;gap:44px;align-items:center;background:#eef8f2;border:1px solid #c8e2d2;border-radius:18px;padding:38px;margin-top:46px;scroll-margin-top:115px}
.billing-offer h3{font-size:clamp(24px,2.3vw,32px);letter-spacing:-.8px;line-height:1.2;margin:16px 0}
.billing-offer p{font-size:13px;line-height:1.8;color:#567361;max-width:620px}
.offer-terms{display:block;margin-top:18px;font-size:11px;color:#40694e}
.offer-action{display:flex;flex-direction:column;gap:12px;text-align:center}
.offer-action small{font-size:10px;color:#5b7866}
@media(max-width:950px){.tour-sticky .tabs button{font-size:10px;padding:7px}.scroll-tour .real-screen img{max-height:calc(100svh - 400px)}.billing-offer{grid-template-columns:1fr;gap:26px}.offer-action{align-items:flex-start;text-align:left}}
@media(max-width:650px){.tour-sticky .tabs{gap:6px}.tour-sticky .tabs button{font-size:11px;padding:8px 9px}.scroll-tour .real-screen img{max-height:none}.billing-offer{padding:25px}.billing-copy>.button{max-width:100%;gap:10px}.billing-copy .billing-benefits{font-size:12px}}
@media(max-height:680px) and (min-width:651px){.tour-sticky{top:90px;padding-top:4px}.tour-sticky .tabs{gap:4px;margin-bottom:8px}.tour-sticky .tabs button{padding:5px 8px}.tour-controls{margin-bottom:8px}.scroll-tour .real-screen img{max-height:calc(100svh - 335px)}.tour-progress{margin-top:10px}}
