/* The hero uses the same 14 coordinates as the linked Charleston dining map. */
.demo-stage{position:relative;aspect-ratio:2896/2148}
.hero-demo{display:grid;grid-template-columns:39% 61%;width:100%;height:100%;overflow:hidden;container-type:inline-size;background:#f6f0e6}
.demo-rail{min-width:0;overflow:hidden;background:#fbf7ef;border-left:3px solid #bd5d3c;border-right:1px solid #ded8cb}
.demo-rail-track{height:1400%;display:flex;flex-direction:column;transition:transform 850ms ease-in-out}
.demo-place{height:calc(100% / 14);min-height:0;padding:5% 7%;display:flex;flex-direction:column;align-items:stretch;gap:2.5%;overflow:hidden;color:#183039}
.demo-category{border-top:2px solid #bd5d3c;padding-top:5%;color:#9c4b34;font-size:clamp(7px,1.35cqw,12px);font-weight:750;line-height:1.25}
.demo-place strong{font-size:clamp(12px,3.1cqw,25px);letter-spacing:-.04em;line-height:1.1}
.demo-place p{font-family:Georgia,serif;font-size:clamp(8px,1.7cqw,14px);line-height:1.4;margin:0;color:#273941}
.demo-detail{font-size:clamp(7px,1.3cqw,11px);border-block:1px solid #e5ded2;padding:3% 0;color:#3a6160}
.hero-window .demo-place img{display:block;width:100%;height:0;min-height:0;flex:1;aspect-ratio:auto;object-fit:cover;object-position:center;border-radius:3px}
.demo-map{position:relative;overflow:hidden;background:#eee7d5}
.demo-map-tiles{position:absolute;inset:0;z-index:0}
.demo-map-tiles .leaflet-container{background:#eee7d5}
.demo-map-tiles .leaflet-control-attribution{font-size:8px;background:#fffc!important;color:#526665}
.demo-map-tiles .leaflet-control-attribution a{color:#526665}
.demo-current-pin{display:grid;place-items:center;width:28px;height:28px;border:3px solid #fff;border-radius:50%;background:#bd5d3c;color:#fff;font:800 12px/1 system-ui,sans-serif;box-shadow:0 2px 7px #1b3b3a77}
.demo-current-pin.is-context{background:#477e7d}
.demo-current-pin.is-shared{font-size:8px}
.demo-map-caption{position:absolute;z-index:500;right:3%;bottom:5%;max-width:55%;padding:1% 3%;border-radius:3px;background:#fffdf8ed;color:#173638;box-shadow:0 2px 8px #24433b33;font-size:clamp(7px,1.3cqw,12px);font-weight:750;text-align:center}
.window-bar .demo-toggle{visibility:hidden;border:1px solid #cad3cb;background:#fefcf7;color:#345453;border-radius:4px;padding:4px 8px;font:inherit;font-size:10px;letter-spacing:0;cursor:pointer}
.hero-window.is-ready .demo-toggle{visibility:visible}
.window-bar .demo-toggle:hover,.window-bar .demo-toggle:focus-visible{background:#e7efea}
.hero-window.is-paused .demo-rail-track{transition:none}
.hero-window .hero-still{display:block;position:absolute;inset:0;z-index:501;width:100%;height:100%;aspect-ratio:2896/2148;object-fit:contain}
.hero-window.is-ready .hero-still{display:none}
@media(max-width:700px){.window-bar .demo-toggle{font-size:9px;padding:3px 5px}.demo-place{gap:2%}.demo-place p{line-height:1.25}.demo-map-caption{max-width:65%}}
@media(prefers-reduced-motion:reduce){.hero-window.is-ready .hero-still{display:block}.window-bar .demo-toggle{display:none}}