/* La Luciole Bleue 3D view: map with a panel beside it (below it on phones); full-screen mode for exploring (version 6.3) */
.l3d{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:0;height:640px;max-width:100%;border:1px solid #e3ddd0;border-radius:10px;overflow:hidden;background:#fbf9f4;font:14px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#1d2a44;box-sizing:border-box;text-align:left}
.l3d *,.l3d *::before,.l3d *::after{box-sizing:border-box}
.l3d-map{position:relative;min-height:0;background:#e9e4d8}
.l3d .l3d-canvas{position:absolute!important;top:0;left:0;right:0;bottom:0;width:auto;height:auto}
.l3d-poster{position:absolute;inset:0;z-index:1;background:#e9e4d8 center/cover no-repeat;pointer-events:none;transition:opacity .7s ease}
.l3d.l3d-ready .l3d-poster{opacity:0}
.l3d-status{position:absolute;left:12px;bottom:12px;z-index:3;max-width:calc(100% - 24px);background:rgba(255,255,255,.94);padding:7px 11px;border-radius:6px;font-size:13px;box-shadow:0 1px 3px rgba(0,0,0,.18)}
.l3d-status[hidden],.l3d-go[hidden],.l3d-close[hidden],.l3d-card[hidden]{display:none!important}
.l3d-status button{font:inherit;font-weight:600;color:#23526d;background:none;border:0;padding:0;text-decoration:underline;cursor:pointer}
.l3d-go{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);z-index:3;font:600 15px/1.2 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#fff;background:#23526d;border:0;border-radius:999px;padding:12px 20px;box-shadow:0 2px 10px rgba(0,0,0,.25);cursor:pointer;white-space:nowrap}
.l3d-close{position:absolute;left:12px;top:12px;z-index:3;width:42px;height:42px;border-radius:50%;border:0;background:rgba(255,255,255,.95);color:#1d2a44;font-size:20px;line-height:42px;padding:0;text-align:center;box-shadow:0 1px 4px rgba(0,0,0,.25);cursor:pointer}
.l3d-panel{overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:14px 14px 18px;border-left:1px solid #e3ddd0;background:#fbf9f4}
.l3d-group{margin-bottom:14px}
.l3d h3{margin:0 0 7px;padding:0;font-size:12px;line-height:1.3;letter-spacing:.06em;text-transform:uppercase;color:#6b6250;font-weight:600}
.l3d-seg{display:flex;flex-wrap:wrap;gap:6px}
.l3d-panel button{font:inherit;cursor:pointer;border:1px solid #cfc6b2;background:#fff;color:#1d2a44;border-radius:999px;padding:6px 12px;line-height:1.2;margin:0}
.l3d-panel button:hover{border-color:#23526d}
.l3d-panel button[aria-pressed="true"]{background:#23526d;border-color:#23526d;color:#fff}
.l3d button:focus-visible{outline:2px solid #d9a53a;outline-offset:2px}
.l3d-floor{font-size:12px;color:#6b6250;margin:8px 0 5px}
.l3d-roomlist{display:flex;flex-wrap:wrap;gap:6px}
.l3d-panel .l3d-room{border-radius:6px;padding:6px 10px}
.l3d-card{border-top:1px solid #e3ddd0;padding-top:12px}
.l3d-card h3{font-size:16px;text-transform:none;letter-spacing:0;color:#1d2a44;margin-bottom:8px}
.l3d-photos{display:flex;gap:6px;overflow-x:auto;margin-bottom:8px}
.l3d .l3d-photos img{height:120px!important;width:auto!important;max-width:none!important;border-radius:6px;flex:none;margin:0}
.l3d-card ul{margin:0!important;padding:0 0 0 18px!important;list-style:disc!important;line-height:1.45}
.l3d-card li{margin:2px 0;padding:0}
.l3d:lang(th) h3{letter-spacing:0;font-size:13px}
.l3d-turn button{font-size:17px;line-height:29px;color:#1d2a44}
/* location mode (home page): the map only, with a link to the page of the whole house */
.l3d.l3d-loc{grid-template-columns:minmax(0,1fr);height:460px}
.l3d-loc .l3d-panel{display:none}
.l3d a.l3d-link{position:absolute;left:50%;bottom:36px;transform:translateX(-50%);z-index:3;font:600 15px/1.2 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#fff!important;background:#23526d;border-radius:999px;padding:12px 20px;box-shadow:0 2px 10px rgba(0,0,0,.25);text-decoration:none!important;white-space:nowrap}
.l3d a.l3d-link:hover{background:#1b4258}
.l3d-loc .l3d-go{top:50%;bottom:auto;transform:translate(-50%,-50%)}
/* full screen (fixed over the page, above Divi's header) */
.l3d.l3d-full{position:fixed!important;top:0;left:0;right:0;bottom:0;z-index:1000000;width:100%;height:100vh;height:100dvh;max-width:none;margin:0;border:0;border-radius:0}
html.l3d-lock,html.l3d-lock body{overflow:hidden!important}
/* phones and narrow windows: the panel goes below the map */
@media (max-width:860px){
  .l3d{grid-template-columns:1fr;height:auto}
  .l3d-map{height:62vh;min-height:340px}
  .l3d-panel{border-left:0;border-top:1px solid #e3ddd0}
  .l3d.l3d-full{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto}
  .l3d.l3d-full .l3d-map{height:auto;min-height:0}
  .l3d.l3d-full .l3d-panel{max-height:34vh;max-height:34dvh;overflow-y:auto}
  .l3d.l3d-loc{height:auto}
  .l3d.l3d-loc .l3d-map{height:56vh;min-height:300px}
}
