/* 360 tours: shared look for every project tour (public/tours/<project>/). */
:root { --lime:#bce62f; --carbon:#090b0a; --warm:#f5f4ee; --glass:rgba(9,11,10,.72); }
/* Greek and Hebrew letters in the site's fonts (Commissioner, Rubik); Latin stays in the system font */
@font-face { font-family:'AKI Greek'; src:url(/tours/fonts/commissioner-greek.woff2) format('woff2'); font-weight:100 900; font-display:swap;
             unicode-range:U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF; }
@font-face { font-family:'AKI Hebrew'; src:url(/tours/fonts/rubik-hebrew.woff2) format('woff2'); font-weight:300 900; font-display:swap;
             unicode-range:U+0307-0308, U+0590-05FF, U+20AA, U+25CC, U+FB1D-FB4F; }
html,body { margin:0; height:100%; background:var(--carbon); font-family:'AKI Greek', 'AKI Hebrew', system-ui, sans-serif; overflow:hidden; }
button { font:inherit; }
#pano { position:absolute; inset:0; direction:ltr; } /* the viewer places its hotspots from the left, also in Hebrew */
.pnlm-controls-container { left:auto; right:12px; top:12px; }
.pnlm-panorama-info { display:none !important; }

.bar { position:absolute; left:16px; top:16px; z-index:5; color:var(--warm); background:var(--glass);
       backdrop-filter:blur(8px); padding:12px 16px; border-radius:14px; max-width:calc(100% - 420px); box-sizing:border-box; }
.bar { display:flex; align-items:center; gap:14px; }
.exit { flex:none; width:34px; height:34px; border-radius:50%; border:1px solid rgba(188,230,47,.6); color:var(--lime);
        display:flex; align-items:center; justify-content:center; font-size:22px; line-height:1; text-decoration:none; }
.exit:hover { background:var(--lime); color:var(--carbon); }
.bar small { display:block; color:var(--lime); letter-spacing:.14em; font-size:11px; text-transform:uppercase; }
.bar strong { font-size:17px; font-weight:600; }
.tools { position:absolute; right:56px; top:16px; z-index:6; display:flex; gap:8px; }
.chip { background:var(--glass); color:var(--warm); border:0; padding:9px 14px; border-radius:999px; font-size:13px;
        cursor:pointer; backdrop-filter:blur(8px); display:flex; align-items:center; gap:7px; white-space:nowrap; }
.chip.on { background:var(--lime); color:var(--carbon); }
.chip[hidden] { display:none; }
.cta { position:absolute; right:16px; bottom:16px; z-index:5; background:var(--lime); color:var(--carbon);
       border:0; border-radius:999px; padding:12px 20px; font-weight:600; font-size:15px; cursor:pointer; }
.rooms { position:absolute; left:16px; bottom:16px; z-index:5; display:flex; gap:8px; flex-wrap:wrap; max-width:calc(100% - 200px); }
.rooms button, .rooms span { background:var(--glass); color:var(--warm); border:0; padding:8px 12px; border-radius:999px;
                             font-size:13px; cursor:pointer; backdrop-filter:blur(8px); }
.rooms span { cursor:default; }
.rooms button.on { background:var(--warm); color:var(--carbon); }

/* room links inside an apartment */
.go { width:46px; height:46px; border-radius:50%; background:rgba(188,230,47,.92); cursor:pointer;
      box-shadow:0 0 0 7px rgba(188,230,47,.28); transition:transform .2s; }
.go:hover { transform:scale(1.12); }
.go span { visibility:hidden; position:absolute; bottom:58px; left:50%; transform:translateX(-50%); white-space:nowrap;
           background:var(--carbon); color:var(--warm); padding:6px 10px; border-radius:8px; font-size:13px; }
.go:hover span { visibility:visible; }

/* apartments on the facade */
.unit { cursor:pointer; }
.unit b { display:block; padding:5px 10px; border-radius:999px; font-size:12.5px; font-weight:700;
          white-space:nowrap; box-shadow:0 2px 10px rgba(0,0,0,.35); transition:transform .2s; }
.unit:hover b { transform:scale(1.12); }
.unit.available b { background:var(--lime); color:var(--carbon); }
.unit.reserved b { background:rgba(245,244,238,.92); color:var(--carbon); }
.unit.sold b { background:rgba(9,11,10,.8); color:rgba(245,244,238,.6); text-decoration:line-through; }
.unit.tour b::after { content:'360°'; margin-left:6px; font-size:10px; font-weight:600; opacity:.75; }

/* floor plans: lime line drawing on a transparent background */
.plan { position:fixed; inset:0; z-index:5; display:none; flex-direction:column; align-items:center; justify-content:center;
        gap:18px; background:rgba(9,11,10,.72); }
body.plan-open .unit, body.plan-open .go { visibility:hidden !important; }
.plan.show { display:flex; }
.plan .box { position:relative; width:min(88vw, 760px); }
.plan .box.unitplan { width:min(88vw, 620px); }
.plan .x { position:fixed; right:58px; top:62px; z-index:8; border:0; background:var(--glass); width:44px; height:44px; border-radius:50%;
           font-size:28px; line-height:1; cursor:pointer; color:var(--lime); opacity:1; }
.plan svg { width:100%; height:auto; display:block; overflow:visible; filter:drop-shadow(0 0 1.5px rgba(0,0,0,.85)); }
.plan svg rect { fill:none; stroke:var(--lime); stroke-width:3; transition:fill .3s; }
.plan svg rect.out { stroke-width:2; stroke-dasharray:7 5; }
.plan svg rect.core { fill:rgba(245,244,238,.08); stroke-width:2; }
.plan svg rect.here { fill:rgba(188,230,47,.22); }
.plan svg text { fill:var(--lime); }
.plan svg text.sub { opacity:.8; }
.plan svg .pill rect { fill:var(--lime); stroke:none; }
.plan svg .pill text { fill:var(--carbon); }
.plan svg .hit { fill:rgba(188,230,47,0); stroke:none; cursor:pointer; }
.plan svg .hit:hover { fill:rgba(188,230,47,.16); }
.plan svg .dot { fill:var(--lime); }
.plan svg .ring { fill:none; stroke:var(--lime); stroke-width:2; animation:pulse 1.8s ease-out infinite; transform-box:fill-box; transform-origin:center; }
.plan svg .compass path { fill:var(--lime); }
.plan svg .compass circle { stroke:var(--lime); }
@keyframes pulse { from { transform:scale(.6); opacity:1 } to { transform:scale(2.2); opacity:0 } }
.floors { display:flex; gap:6px; flex-wrap:wrap; justify-content:center; }
.floors button { background:var(--glass); color:var(--warm); border:1px solid rgba(188,230,47,.35); padding:8px 14px; border-radius:999px; font-size:13px; cursor:pointer; }
.floors button.on { background:var(--lime); color:var(--carbon); border-color:var(--lime); }
.plan .hint { color:rgba(245,244,238,.75); font-size:13px; margin:0; }

/* details panel and unit card */
.panel { position:absolute; left:50%; top:50%; width:340px; max-width:calc(100% - 32px); z-index:7; box-sizing:border-box;
         background:var(--glass); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); color:var(--warm);
         border:1px solid rgba(188,230,47,.25); border-radius:18px; padding:22px; opacity:0; pointer-events:none;
         transform:translate(-50%,-50%) scale(.96); transition:opacity .3s, transform .3s; }
.panel.open { opacity:1; pointer-events:auto; transform:translate(-50%,-50%); }
.x { position:absolute; right:12px; top:10px; border:0; background:none; font-size:26px; line-height:1; cursor:pointer; color:var(--warm); opacity:.7; }
.x:hover { opacity:1; }
.panel small, .modal small { color:var(--lime); letter-spacing:.14em; font-size:11px; text-transform:uppercase; font-weight:600; }
.panel h2 { margin:6px 0 10px; font-size:22px; font-weight:600; }
.status { display:inline-flex; align-items:center; gap:6px; border:1px solid var(--lime); color:var(--lime); padding:3px 10px;
          border-radius:999px; font-size:12px; font-weight:600; }
.status::before { content:''; width:7px; height:7px; border-radius:50%; background:var(--lime); }
.status.reserved { border-color:rgba(245,244,238,.6); color:var(--warm); }
.status.reserved::before { background:var(--warm); }
.status.sold { border-color:rgba(245,244,238,.3); color:rgba(245,244,238,.6); }
.status.sold::before { background:rgba(245,244,238,.4); }
.facts { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:18px 0 16px; }
.facts div { background:rgba(245,244,238,.07); border:1px solid rgba(245,244,238,.1); border-radius:12px; padding:11px 12px; }
.facts span { display:block; font-size:10.5px; color:rgba(245,244,238,.6); text-transform:uppercase; letter-spacing:.1em; margin-bottom:3px; }
.facts b { font-size:17px; font-weight:600; }
.price { display:flex; align-items:baseline; justify-content:space-between; border-top:1px solid rgba(245,244,238,.12);
         padding-top:14px; margin-bottom:16px; }
.price span { font-size:11px; color:rgba(245,244,238,.6); text-transform:uppercase; letter-spacing:.1em; }
.price b { font-size:28px; font-weight:700; color:var(--lime); }
.lime-btn { width:100%; background:var(--lime); color:var(--carbon); border:0; border-radius:999px; padding:13px;
            font-weight:600; font-size:15px; cursor:pointer; }
.ghost-btn { width:100%; background:transparent; color:var(--warm); border:1px solid rgba(245,244,238,.35); border-radius:999px;
             padding:12px; font-weight:600; font-size:15px; cursor:pointer; margin-top:8px; }
.ghost-btn:disabled { opacity:.45; cursor:default; }

/* apartments list in the building details */
.panel { max-height:calc(100% - 150px); overflow:auto; }
.list-head { display:flex; justify-content:space-between; font-size:10.5px; color:rgba(245,244,238,.6); text-transform:uppercase; letter-spacing:.1em; margin:2px 2px 6px; }
.units { list-style:none; margin:0 0 14px; padding:0 4px 0 0; display:grid; gap:4px; max-height:min(236px, 32vh); overflow:auto; }
.units button { width:100%; display:grid; grid-template-columns:44px 1fr auto; align-items:center; gap:10px; text-align:left; cursor:pointer;
                background:rgba(245,244,238,.05); border:1px solid rgba(245,244,238,.08); color:var(--warm); border-radius:10px; padding:8px 10px; }
.units button:hover { border-color:var(--lime); }
.units b { font-size:15px; color:var(--lime); }
.units span { font-size:13px; line-height:1.3; }
.units em { display:block; font-style:normal; font-size:11.5px; color:rgba(245,244,238,.6); }
.units i { font-style:normal; font-size:12px; font-weight:600; color:var(--lime); }
.units i.soon { color:rgba(245,244,238,.45); font-weight:400; }
.units .sold b, .units .sold span { opacity:.5; }

/* booking popup */
.modal { position:fixed; inset:0; z-index:30; display:none; align-items:center; justify-content:center; background:rgba(9,11,10,.55); padding:16px; }
.modal.open { display:flex; }
.card { position:relative; width:400px; max-width:100%; box-sizing:border-box; background:var(--glass); color:var(--warm);
        backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); border:1px solid rgba(188,230,47,.3); border-radius:20px; padding:26px; }
.card { max-height:calc(100svh - 32px); overflow-y:auto; }
.card h3 { margin:6px 0 4px; font-size:22px; font-weight:600; }
.card .lead { margin:0 0 10px; color:rgba(245,244,238,.7); font-size:14px; }
form input { width:100%; box-sizing:border-box; border:0; border-bottom:1px solid rgba(245,244,238,.25); background:transparent;
             color:var(--warm); padding:12px 0; font-size:15px; }
form input::placeholder { color:rgba(245,244,238,.55); }
form input:focus { outline:none; border-color:var(--lime); }
form p { font-size:11px; color:rgba(245,244,238,.55); line-height:1.5; }
form p a { color:var(--lime); }
form .lime-btn { margin-top:10px; }
.sent { padding:18px 0 6px; }
.sent .book { margin-top:14px; }
.sent b { color:var(--lime); font-size:20px; }

@media (max-width:820px) {
  .rooms { max-width:100%; bottom:72px; }
  .bar { max-width:calc(100% - 72px); }
  .tools { top:94px; left:16px; right:auto; flex-wrap:wrap; }
  .plan .x { top:142px; right:16px; }
  .plan { padding-top:120px; box-sizing:border-box; }
  .panel { top:calc(50% + 10px); padding:18px; max-height:calc(100% - 300px); }
  .panel .facts { margin:14px 0 12px; }
}

/* language menu */
.lang { position:relative; }
.lang > .chip { text-transform:uppercase; letter-spacing:.08em; }
.lang ul { display:none; position:absolute; top:calc(100% + 8px); inset-inline-end:0; min-width:170px; margin:0; padding:6px; list-style:none;
           background:var(--glass); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); border:1px solid rgba(245,244,238,.12); border-radius:14px; }
.lang.open ul { display:block; }
.lang a { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:9px 12px; border-radius:9px;
          color:var(--warm); text-decoration:none; font-size:14px; }
.lang a:hover { background:rgba(245,244,238,.08); }
.lang a.on { color:var(--lime); }
.lang a small { font-size:10px; letter-spacing:.14em; color:rgba(245,244,238,.45); }
@media (max-width:820px) { .lang ul { inset-inline-end:auto; inset-inline-start:0; } }

/* Hebrew: the page reads right to left, so the corners swap */
[dir=rtl] .pnlm-controls-container { right:auto; left:12px; }
[dir=rtl] .bar { left:auto; right:16px; }
[dir=rtl] .tools { right:auto; left:56px; }
[dir=rtl] .cta { right:auto; left:16px; }
[dir=rtl] .rooms { left:auto; right:16px; }
[dir=rtl] .plan .x { right:auto; left:58px; }
[dir=rtl] .x { right:auto; left:12px; }
[dir=rtl] .units button { text-align:right; }
[dir=rtl] .units { padding:0 0 0 4px; }
[dir=rtl] .unit b, [dir=rtl] .units b, [dir=rtl] .price b { direction:ltr; unicode-bidi:isolate; }
[dir=rtl] .bar small, [dir=rtl] .panel small, [dir=rtl] .modal small, [dir=rtl] .facts span, [dir=rtl] .price span,
[dir=rtl] .list-head { letter-spacing:0; }
@media (max-width:820px) {
  [dir=rtl] .tools { right:16px; left:auto; }
  [dir=rtl] .plan .x { left:16px; right:auto; }
  [dir=rtl] .lang ul { inset-inline-start:auto; inset-inline-end:0; }
}

/* AI-made tours say so */
.illustration { position:absolute; z-index:4; bottom:70px; inset-inline-end:16px; margin:0; max-width:300px; padding:6px 12px; border-radius:999px;
                background:rgba(9,11,10,.6); backdrop-filter:blur(6px); color:rgba(245,244,238,.8); font-size:11px; line-height:1.35; text-align:center; }
@media (max-width:820px) { .illustration { bottom:120px; inset-inline:16px; max-width:none; } }
