.kpm-demo{--kpm-ink:#353a36;--kpm-muted:#69685f;--kpm-paper:#f7f5ef;--kpm-sand:#eae2d0;--kpm-line:#ddd9cf;--kpm-accent:#246d62;--kpm-brown:#5d574e;max-width:1360px;margin:0 auto;padding:64px 32px 40px;color:var(--kpm-ink);font-family:"Open Sans",Arial,sans-serif;font-size:15px;line-height:1.65;isolation:isolate;text-align:left}
.kpm-demo *{box-sizing:border-box}.kpm-demo [hidden]{display:none!important}.kpm-demo h1,.kpm-demo h2,.kpm-demo h3,.kpm-demo p{padding:0;margin:0;color:inherit}.kpm-demo button,.kpm-demo a{font:inherit;letter-spacing:normal;text-transform:none}.kpm-demo button{cursor:pointer}.kpm-demo button:focus-visible,.kpm-demo a:focus-visible,.kpm-demo summary:focus-visible,.kpm-demo [tabindex]:focus-visible{outline:3px solid var(--kpm-accent);outline-offset:4px}.kpm-demo button:disabled{cursor:default}.kpm-demo .kpm-eyebrow{font-size:10px;font-weight:700;letter-spacing:1.8px;text-transform:uppercase;color:var(--kpm-muted);line-height:1.6}.kpm-eyebrow>span{display:inline-block;width:7px;height:7px;background:#a6884b;border-radius:50%;margin-right:9px}.kpm-intro{display:grid;grid-template-columns:1.5fr 1fr;gap:65px;align-items:end;margin-bottom:38px}.kpm-intro h1,.kpm-intro h2{font-family:"Abril Fatface",Georgia,serif;font-size:clamp(32px,3.5vw,53px);line-height:1.14;font-weight:400;margin:16px 0 0;letter-spacing:-1.5px;max-width:780px}.kpm-intro em{font-style:normal;color:#807050}.kpm-intro-side>p{font-size:18px;line-height:1.7;max-width:350px;margin-bottom:25px}.kpm-actions{display:flex;align-items:flex-start;flex-wrap:wrap;gap:17px 24px}.kpm-demo .kpm-button{display:inline-flex;align-items:center;justify-content:center;gap:22px;min-height:48px;background:var(--kpm-brown);color:#fff;border:1px solid var(--kpm-brown);border-radius:4px;padding:12px 20px;text-decoration:none;font-size:13px;font-weight:700;line-height:1.5;transition:background .15s}.kpm-demo .kpm-button:hover{background:#393a33;color:#fff}.kpm-demo .kpm-textlink{color:var(--kpm-ink);display:inline-flex;align-items:center;gap:16px;min-height:48px;font-size:13px;font-weight:600;text-decoration:underline;text-underline-offset:5px}.kpm-track{height:calc(780px + 65vh);position:relative;scroll-margin-top:115px}.kpm-stage{position:sticky;top:var(--kpm-top,100px);background:var(--kpm-paper);border:1px solid var(--kpm-line);border-radius:12px;overflow:hidden;box-shadow:0 20px 60px -40px #766e5e66}.kpm-toolbar{min-height:70px;padding:12px 24px;display:flex;align-items:center;justify-content:space-between;gap:15px;border-bottom:1px solid var(--kpm-line);background:#fbfaf6}.kpm-sector{display:flex;gap:4px;flex-wrap:wrap}.kpm-demo .kpm-sector button{min-height:44px;padding:8px 19px;background:transparent;color:var(--kpm-muted);border:1px solid transparent;border-radius:5px;font-size:13px;font-weight:600}.kpm-demo .kpm-sector button[aria-pressed=true]{background:#fff;border-color:var(--kpm-line);color:var(--kpm-ink);box-shadow:0 2px 4px #00000005}.kpm-demo-label{font-size:10px;text-transform:uppercase;letter-spacing:1.4px;color:var(--kpm-muted)}.kpm-demo-label:before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--kpm-accent);margin-right:7px}.kpm-workspace{display:grid;grid-template-columns:minmax(0,1fr) 304px}.kpm-visual{height:580px;position:relative;min-width:0;overflow:hidden;background:radial-gradient(ellipse at 48% 55%,#fffdf6 0%,#f4f1e8 65%,#ede9de 100%);touch-action:pan-y}.kpm-map-heading{position:absolute;left:28px;top:23px;z-index:3;pointer-events:none}.kpm-map-heading h3{font-size:22px;line-height:1.3;margin:6px 0;font-weight:600;letter-spacing:-.7px}.kpm-map-heading p{font-size:11px;color:var(--kpm-muted)}.kpm-canvas-host,.kpm-fallback,.kpm-markers{position:absolute;inset:0}.kpm-canvas-host canvas{display:block;width:100%;height:100%;touch-action:pan-y}.kpm-fallback{padding:45px 8px 30px;pointer-events:none}.kpm-fallback svg{width:100%;height:100%}.kpm-demo[data-mode=webgl] .kpm-fallback{visibility:hidden}.kpm-demo[data-mode=fallback] .kpm-canvas-host{visibility:hidden}.kpm-markers{pointer-events:none;z-index:4}.kpm-demo .kpm-marker{position:absolute;left:0;top:0;display:flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:6px;transform:translate(-50%,-100%);border:0;background:transparent;color:var(--kpm-ink);pointer-events:auto;white-space:nowrap;gap:6px}.kpm-marker .kpm-pin{width:29px;height:29px;display:grid;place-items:center;border-radius:50% 50% 50% 3px;transform:rotate(-45deg);background:#fff;border:1px solid #a9ada4;box-shadow:0 3px 9px #323c3220;font-size:11px;font-weight:700}.kpm-pin span{transform:rotate(45deg)}.kpm-marker .kpm-marker-label{display:none;position:absolute;top:-20px;background:#fffef9;padding:3px 7px;border:1px solid #ddd9cf;border-radius:4px;font-size:10px;box-shadow:0 2px 5px #00000005}.kpm-marker:hover .kpm-pin,.kpm-marker[aria-pressed=true] .kpm-pin,.kpm-marker:focus-visible .kpm-pin{background:var(--kpm-accent);border-color:var(--kpm-accent);color:white}.kpm-marker:hover .kpm-marker-label,.kpm-marker:focus-visible .kpm-marker-label,.kpm-marker[aria-pressed=true] .kpm-marker-label{display:block}.kpm-demo:not(.kpm-map-open)[data-mode=webgl] .kpm-markers{visibility:hidden}.kpm-view-controls{position:absolute;bottom:21px;left:24px;right:24px;display:flex;justify-content:space-between;gap:8px;z-index:6}.kpm-demo .kpm-view-controls button{min-height:44px;background:#fffffff0;color:var(--kpm-ink);border:1px solid #d1cdc1;border-radius:5px;padding:8px 13px;font-size:11px;box-shadow:0 2px 5px #00000004}.kpm-demo .kpm-lite-toggle{color:var(--kpm-muted)}.kpm-scroll-hint{position:absolute;left:0;right:0;bottom:77px;text-align:center;font-size:11px;letter-spacing:.4px;color:var(--kpm-muted);pointer-events:none}.kpm-scroll-hint>span{margin-right:8px}.kpm-map-open .kpm-scroll-hint{opacity:0}.kpm-rail{min-width:0;padding:24px 22px 18px;background:#fcfbf7;border-left:1px solid var(--kpm-line);position:relative}.kpm-rail>h3{font-family:Georgia,serif;font-size:25px;line-height:1.18;font-weight:400;margin-top:10px}.kpm-demo .kpm-rail-hint{font-size:12px;line-height:1.65;color:var(--kpm-muted);margin:12px 0 16px}.kpm-place-list{display:grid;gap:1px}.kpm-demo .kpm-place-list button{display:flex;align-items:center;gap:10px;text-align:left;background:none;border:0;border-bottom:1px solid #e7e3d9;border-radius:3px;color:var(--kpm-ink);padding:8px 4px;min-height:44px;font-size:12px;line-height:1.3}.kpm-place-name{flex:1}.kpm-place-number{font-size:10px;color:#82745b;font-variant-numeric:tabular-nums}.kpm-demo .kpm-place-list button:hover,.kpm-demo .kpm-place-list button[aria-pressed=true]{background:#edece1}.kpm-detail{position:relative;padding-top:15px}.kpm-detail h3{font-family:Georgia,serif;font-size:29px;line-height:1.2;margin:12px 0}.kpm-demo .kpm-detail-description{font-size:13px;line-height:1.8;margin-bottom:20px}.kpm-demo .kpm-close{float:right;width:44px;height:44px;margin:-15px -8px 0 5px;border:0;background:transparent;color:var(--kpm-muted);font-size:26px}.kpm-more{font-size:12px;line-height:1.75;margin-top:14px}.kpm-more summary{cursor:pointer;min-height:44px;padding:10px 0;color:var(--kpm-muted);text-decoration:underline;text-underline-offset:3px}.kpm-demo .kpm-status{font-size:12px;line-height:1.65;color:var(--kpm-accent);margin-top:18px;min-height:40px}.kpm-demo .kpm-example-note{font-size:10px;line-height:1.65;color:var(--kpm-muted);margin-top:12px}.kpm-rail:has(.kpm-detail:not([hidden])) .kpm-place-list{display:none}.kpm-rail:has(.kpm-detail:not([hidden]))>h3,.kpm-rail:has(.kpm-detail:not([hidden]))>.kpm-rail-hint{display:none}.kpm-steps{display:flex;border-top:1px solid var(--kpm-line);padding:15px 28px;justify-content:space-between;gap:15px;color:#716f67;font-size:11px;background:#fbfaf6}.kpm-steps span{display:flex;gap:12px;align-items:center}.kpm-steps b{font-weight:400}.kpm-steps .is-active{color:var(--kpm-accent);font-weight:700}.kpm-steps .is-active b{font-weight:600}.kpm-explanation{display:grid;grid-template-columns:1fr 1.25fr;gap:70px;margin:70px 0}.kpm-explanation h2{font-family:Georgia,serif;font-size:32px;line-height:1.25;letter-spacing:-.6px;margin-top:15px}.kpm-explanation p+p{margin-top:16px}.kpm-explanation>div>p:not(.kpm-eyebrow){font-size:14px;line-height:1.9;color:var(--kpm-muted)}.kpm-benefits{display:flex;flex-wrap:wrap;gap:10px 20px;font-size:11px;margin-top:20px;color:var(--kpm-ink)}.kpm-benefits span:before{content:"✓";color:var(--kpm-accent);margin-right:6px}.kpm-final-cta{display:grid;grid-template-columns:1.4fr 1fr;gap:50px;background:var(--kpm-sand);padding:38px 40px;align-items:center;border-radius:6px}.kpm-final-cta h2{font-family:Georgia,serif;font-weight:400;font-size:28px;line-height:1.35;margin-top:12px}.kpm-final-cta .kpm-actions{flex-direction:column;gap:8px}.kpm-fallback-route{stroke-dasharray:1000;stroke-dashoffset:0}.kpm-fallback-route.is-routing{animation:kpm-draw 1.8s ease both}@keyframes kpm-draw{from{stroke-dashoffset:1000}to{stroke-dashoffset:0}}
@media(min-width:1000px) and (max-height:850px){.kpm-visual{height:500px}.kpm-rail{padding-top:18px}.kpm-rail>h3{font-size:22px}.kpm-demo .kpm-rail-hint{margin:8px 0}.kpm-demo .kpm-example-note{margin-top:5px}.kpm-demo .kpm-status{margin-top:10px}.kpm-toolbar{min-height:62px;padding:8px 20px}.kpm-steps{padding:10px 24px}}
@media(max-width:999px){.kpm-demo{padding:40px 20px}.kpm-intro{gap:25px}.kpm-intro h1,.kpm-intro h2{font-size:38px}.kpm-intro-side>p{font-size:15px}.kpm-workspace{grid-template-columns:minmax(0,1fr) 264px}.kpm-rail{padding:20px 16px}.kpm-visual{height:570px}.kpm-explanation{gap:35px}.kpm-demo-label{display:none}}
@media(max-width:700px){.kpm-demo{padding:32px 12px;font-size:14px}.kpm-intro{display:block;margin-bottom:24px}.kpm-intro h1,.kpm-intro h2{font-size:35px;letter-spacing:-1px}.kpm-intro-side{margin-top:20px}.kpm-intro-side>p{font-size:15px;margin-bottom:14px}.kpm-actions{gap:10px 20px}.kpm-track{height:auto;scroll-margin-top:80px}.kpm-stage{position:relative;top:auto;overflow:clip;border-radius:8px}.kpm-toolbar{padding:8px;min-height:61px}.kpm-sector{width:100%;gap:2px;justify-content:space-between}.kpm-demo .kpm-sector button{font-size:11px;padding:8px 10px}.kpm-workspace{display:block}.kpm-visual{height:450px}.kpm-map-heading{left:18px;top:17px}.kpm-map-heading h3{font-size:21px}.kpm-map-heading .kpm-eyebrow{font-size:8px}.kpm-map-heading p{font-size:10px}.kpm-view-controls{left:14px;right:14px;bottom:15px}.kpm-scroll-hint{bottom:71px;font-size:10px}.kpm-rail{border-left:0;border-top:1px solid var(--kpm-line);padding:21px 18px}.kpm-rail>h3{font-size:25px}.kpm-rail>h3 br{display:none}.kpm-place-list{grid-template-columns:1fr 1fr;gap:4px 12px}.kpm-demo .kpm-place-list button{font-size:11px;gap:7px;min-height:48px}.kpm-demo .kpm-status{min-height:0;margin-top:13px}.kpm-steps{padding:12px;gap:8px;font-size:9px}.kpm-steps span{gap:5px;align-items:flex-start}.kpm-steps b{max-width:80px;line-height:1.4}.kpm-explanation{display:block;margin:38px 4px}.kpm-explanation h2{font-size:28px;margin-bottom:20px}.kpm-final-cta{display:block;padding:26px 22px}.kpm-final-cta h2{font-size:26px;margin-bottom:22px}.kpm-detail h3{font-size:28px}.kpm-demo .kpm-detail-description{margin-bottom:12px}.kpm-more{margin-top:8px}.kpm-example-note{max-width:280px}}
@media(prefers-reduced-motion:reduce){.kpm-demo *{animation:none!important;transition:none!important;scroll-behavior:auto!important}.kpm-track{height:auto}.kpm-stage{position:relative;top:auto}.kpm-scroll-hint{display:none}}
/* Architectural showroom refinement. All decoration stays inside the component. */
.kpm-demo .kpm-stage{border-radius:14px;box-shadow:0 30px 70px -45px #5a4d354f}
.kpm-demo .kpm-visual{height:auto;min-height:580px;background:radial-gradient(ellipse at 54% 48%,#fffdf6 0%,#f3efe5 60%,#e7e1d3 100%)}
.kpm-demo .kpm-map-heading h3{font-family:Georgia,serif;font-size:27px;font-weight:400}
.kpm-demo .kpm-marker .kpm-pin{background:#fffff8;border:2px solid #fff;box-shadow:0 4px 12px #243d3133,0 0 0 1px #55635435;width:31px;height:31px}
.kpm-demo .kpm-marker[aria-pressed=true] .kpm-pin{background:#286c5b;box-shadow:0 0 0 5px #347d651c,0 6px 13px #243d3133}
.kpm-demo .kpm-marker-label{border-radius:6px;padding:5px 9px;font-size:11px;top:-26px}
.kpm-demo .kpm-view-controls button:first-child{background:#344d43;border-color:#344d43;color:white;box-shadow:0 4px 12px #243d3120;padding:10px 18px;font-weight:600}
.kpm-demo .kpm-scroll-hint{left:auto;right:28px;bottom:81px;font-size:10px;padding:5px 9px;border-radius:4px;background:#fbfaf4b3}
.kpm-orientation{position:absolute;top:24px;right:26px;display:none;align-items:center;flex-direction:column;color:#8c8167;pointer-events:none}.kpm-orientation span{font-size:23px;transform:rotate(-33deg);line-height:1.2}.kpm-orientation b{font-size:8px;letter-spacing:2px;font-weight:500}.kpm-map-open .kpm-orientation{display:flex}
.kpm-showroom-note{position:absolute;left:30px;top:43%;pointer-events:none;transition:opacity .35s;max-width:210px}.kpm-showroom-note>span{font-size:8px;letter-spacing:1.8px;color:#96886d}.kpm-showroom-note strong{display:block;font:32px/1.15 Georgia,serif;color:#71674f;margin:12px 0}.kpm-showroom-note small{font-size:11px;color:#8a8374;line-height:1.8}.kpm-map-open .kpm-showroom-note,.kpm-demo[data-mode=fallback] .kpm-showroom-note{opacity:0}
.kpm-demo .kpm-detail{padding-top:0}.kpm-detail-art{height:100px;position:relative;overflow:hidden;background:linear-gradient(125deg,var(--room-color,#c5b89b),#ede4cf);margin:15px -1px 22px;border:1px solid #c8bea740;border-radius:7px}.kpm-art-number{position:absolute;bottom:-20px;left:12px;font:112px/1 Georgia,serif;color:#fff9;letter-spacing:-10px}.kpm-art-label{position:absolute;left:16px;top:13px;font-size:8px;letter-spacing:1.7px;color:#424a40}.kpm-art-lines{position:absolute;right:12px;top:20px;width:90px;height:80px;border:1px solid #fff9;transform:rotate(-25deg) skew(12deg)}.kpm-art-lines:before,.kpm-art-lines:after{content:'';position:absolute;width:100%;height:100%;border:1px solid #fff7;left:15px;top:-15px}.kpm-art-lines:after{left:30px;top:-30px}.kpm-demo .kpm-close{position:relative;z-index:1}
.kpm-route-preview{position:absolute;right:24px;bottom:90px;max-width:260px;min-width:180px;padding:13px 16px;border:1px solid #d6d8ca;background:#fffff8f5;border-radius:8px;box-shadow:0 10px 30px #25382e12;pointer-events:none;z-index:5}.kpm-route-preview strong{display:block;font-size:12px;font-weight:600;margin:5px 0 9px;color:#315f4e}.kpm-route-progress{height:3px;border-radius:5px;background:#dce5da;overflow:hidden}.kpm-route-progress span{display:block;height:100%;background:#3b8d71;transform-origin:left;animation:kpm-route-fill 1.8s ease-out both}@keyframes kpm-route-fill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media(min-width:1000px) and (max-height:850px){.kpm-demo .kpm-visual{min-height:500px}.kpm-detail-art{height:78px;margin-bottom:14px}.kpm-showroom-note strong{font-size:27px}.kpm-showroom-note{max-width:155px}}
@media(max-width:1100px){.kpm-showroom-note{display:none}}
@media(max-width:999px){.kpm-demo .kpm-visual{min-height:570px}.kpm-demo .kpm-map-heading h3{font-size:24px}}
@media(max-width:700px){.kpm-demo .kpm-visual{height:480px;min-height:0}.kpm-demo .kpm-scroll-hint{right:14px;left:14px;bottom:72px;text-align:center}.kpm-orientation{right:17px;top:22px}.kpm-route-preview{right:13px;bottom:71px;padding:9px 12px;max-width:240px}.kpm-route-preview .kpm-eyebrow{font-size:8px}.kpm-route-preview strong{font-size:10px;margin:3px 0 5px}.kpm-detail-art{height:85px;margin-bottom:18px}.kpm-demo .kpm-view-controls button{font-size:10px}.kpm-demo .kpm-map-heading h3{font-size:22px}}
@media(prefers-reduced-motion:reduce){.kpm-demo .kpm-route-progress span{animation:none}.kpm-demo .kpm-showroom-note{transition:none}}
/* A stable left dock keeps navigation clear of the map model. */
.kpm-map-action{position:absolute;left:24px;top:144px;z-index:7;width:242px;padding:13px 12px 12px;background:#fffffc;border:1px solid #b8c6b8;border-radius:9px;box-shadow:0 9px 26px #263c3526;text-align:left}
.kpm-map-action-title{display:block;padding-right:34px;font-size:13px;line-height:1.5;color:#304d42;margin:0 0 10px;overflow-wrap:anywhere}
.kpm-demo .kpm-map-close{position:absolute;top:1px;right:1px;width:44px;height:44px;padding:0;border:0;border-radius:7px;background:transparent;color:#606d62;font-size:24px;line-height:1}
.kpm-map-action-buttons{display:flex;gap:8px;align-items:center}
.kpm-demo .kpm-map-action .kpm-route-button{background:#315c4c;border-color:#315c4c;min-height:44px;padding:10px 12px;gap:10px;font-size:11px;white-space:nowrap}
.kpm-demo .kpm-map-details{min-height:44px;padding:5px 0;background:transparent;border:0;color:#526453;font-size:10px;text-decoration:underline;text-underline-offset:3px}
.kpm-visual:has(.kpm-map-action:not([hidden])) .kpm-route-preview{display:none}
.kpm-demo[data-route] .kpm-map-action{border-color:#45826c}
@media(min-width:701px) and (max-width:999px){
 .kpm-demo .kpm-workspace{display:block}
 .kpm-demo .kpm-rail{border-left:0;border-top:1px solid var(--kpm-line)}
 .kpm-demo .kpm-place-list{grid-template-columns:1fr 1fr;column-gap:20px}
}
@media(max-width:1359px){
 .kpm-demo .kpm-visual{height:560px;min-height:560px}
 .kpm-demo .kpm-canvas-host{bottom:100px}
 .kpm-demo .kpm-fallback{bottom:100px}
 .kpm-demo .kpm-map-action{left:12px;right:12px;top:auto;bottom:72px;width:auto;padding:11px 12px}
 .kpm-demo .kpm-map-action-title{font-size:12px;margin-bottom:5px}
 .kpm-demo .kpm-map-action-buttons{justify-content:space-between;padding-right:4px}
 .kpm-demo .kpm-map-action .kpm-route-button{font-size:12px;min-width:160px}
 .kpm-demo .kpm-map-details{font-size:11px;padding:5px 10px}
 .kpm-demo .kpm-scroll-hint{bottom:100px}
}
@media(min-width:701px) and (max-width:1359px){
 .kpm-demo .kpm-map-action{left:24px;right:auto;width:300px}
}

/* Keep POI selection from changing the page scroll anchor as rail content changes. */
.kpm-demo{overflow-anchor:none}

/* Crawlable FAQ for common navigational-kiosk questions. */
.kpm-faq{display:grid;grid-template-columns:1fr 1.25fr;gap:70px;margin:0 0 70px}.kpm-faq h2{font-family:Georgia,serif;font-size:32px;line-height:1.25;letter-spacing:-.6px;margin-top:15px}.kpm-faq-list{border-top:1px solid var(--kpm-line)}.kpm-faq-list details{border-bottom:1px solid var(--kpm-line)}.kpm-faq-list summary{position:relative;cursor:pointer;list-style:none;padding:18px 42px 18px 0;font-size:15px;font-weight:700;line-height:1.5}.kpm-faq-list summary::-webkit-details-marker{display:none}.kpm-faq-list summary:after{content:"+";position:absolute;right:8px;top:14px;color:var(--kpm-accent);font-size:24px;font-weight:400}.kpm-faq-list details[open] summary:after{content:"−"}.kpm-demo .kpm-faq-list p{padding:0 38px 20px 0;color:var(--kpm-muted);font-size:13px;line-height:1.8}
@media(max-width:700px){.kpm-faq{display:block;margin:0 4px 38px}.kpm-faq h2{font-size:28px;margin-bottom:20px}.kpm-faq-list summary{font-size:14px}}