/* Acre & Light, justsee.ai/modulhouse. Brand: deep green, warm paper, a gold accent, Instrument Serif and Manrope. */
@font-face{font-family:"Instrument Serif";font-style:normal;font-weight:400;font-display:swap;src:url(./fonts/InstrumentSerif-normal-latin.woff2) format("woff2")}
@font-face{font-family:"Instrument Serif";font-style:italic;font-weight:400;font-display:swap;src:url(./fonts/InstrumentSerif-italic-latin.woff2) format("woff2")}
@font-face{font-family:Manrope;font-style:normal;font-weight:300 700;font-display:swap;src:url(./fonts/Manrope-normal-latin.woff2) format("woff2")}
:root{--paper:#f5f2e9;--green:#173d35;--gold:#b48a52;--ink:#22332d;--soft:#5d6b65;--mist:#e6e7dd;--line:#d8d4c7;--card:#fbf9f4;--side:max(20px,env(safe-area-inset-left,0px))}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:70px;-webkit-text-size-adjust:100%}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
body{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.55 Manrope,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
h1,h2{font-family:"Instrument Serif",Georgia,serif;font-weight:400;color:var(--green);line-height:1.04;letter-spacing:-.01em;margin:0;text-wrap:balance}
h3{font:600 12px/1.3 Manrope,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--soft);margin:0 0 12px}
p{margin:0}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.kicker{font-size:12px;letter-spacing:.15em;text-transform:uppercase;color:#8a6a3c;font-weight:600}
.fine{font-size:12.5px;line-height:1.5;color:var(--soft)}
.gold{border:0;border-radius:999px;background:var(--gold);color:#fff;font-weight:600;padding:14px 26px;min-height:48px}
.gold:hover{background:#a37b45}.gold:disabled{opacity:.8;cursor:progress}

.top{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:20px;padding:10px var(--side);background:#f4f1eaf2;backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.logo{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--green);margin-right:auto}.logo span{display:grid;line-height:1.1}.logo b{font-weight:500;font-size:16px;letter-spacing:.09em}.logo i{font-style:normal;font-size:8.5px;letter-spacing:.3em;color:var(--soft);margin-top:3px}
.top nav{display:flex;gap:22px}.top nav a{font-size:14px;text-decoration:none;padding:12px 0;color:var(--ink)}.top nav a:hover{color:#8a6a3c}
.lang{border:1px solid var(--line);background:var(--card);border-radius:999px;min-width:48px;min-height:44px;font-weight:600;font-size:13px}
@media(max-width:720px){.top nav{display:none}}

.hero{position:relative;display:grid;align-items:end;min-height:min(86svh,800px);background:#10231e;overflow:hidden}
.hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero:before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,#0b1a16eb,#0b1a16a6 40%,#0b1a1600 76%),linear-gradient(0deg,#0b1a16d9,#0b1a1600 46%)}
@media(max-width:720px){.hero:before{background:linear-gradient(0deg,#0b1a16f2,#0b1a16d9 48%,#0b1a1680 72%,#0b1a1600 90%)}}
.hero-in{position:relative;z-index:2;width:100%;max-width:1280px;margin:0 auto;padding:clamp(56px,9vw,120px) var(--side) clamp(24px,3.4vw,40px)}
.hero h1{font-size:clamp(42px,7.2vw,96px);margin:14px 0 18px;color:#fff}.hero .kicker{color:#d9bf94}.hero .lead{color:#e6ece7}.lead{font-weight:300;font-size:clamp(17px,1.6vw,21px);line-height:1.45;max-width:46em}
.hero-go{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}.hero-go a{display:inline-flex;align-items:center;text-decoration:none}
.ghost-l{border:1px solid #f7f3ea8c;border-radius:999px;color:#f7f3ea;font-weight:600;padding:13px 24px;min-height:48px}.ghost-l:hover{background:#f7f3ea1f}
.devices{display:flex;flex-wrap:wrap;gap:6px 26px;margin:clamp(30px,5vw,56px) 0 0;padding:16px 0 0;border-top:1px solid #f7f3ea38;list-style:none;font-size:13.5px;color:#cfd8d1}.devices li:last-child{color:#d9bf94;font-weight:600}
.intro{max-width:1280px;margin:0 auto;padding:clamp(40px,6vw,76px) var(--side) clamp(20px,2.6vw,30px)}.intro h2{font-size:clamp(34px,4.4vw,58px);margin:10px 0 12px}.intro .lead{color:var(--soft)}
.xr{display:grid;grid-template-columns:1.15fr 1fr;align-items:center;gap:clamp(24px,5vw,72px);max-width:1280px;margin:0 auto;padding:clamp(48px,7vw,96px) var(--side)}.xr img{display:block;width:100%;height:auto;border-radius:6px}.xr h2{font-size:clamp(34px,4.4vw,58px);margin:10px 0 14px}
@media(max-width:900px){.xr{grid-template-columns:1fr}}

.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;padding:0 var(--side) clamp(40px,6vw,80px);max-width:1280px;margin:0 auto}
.card{display:grid;grid-template-rows:auto 1fr;padding:0;border:1px solid var(--line);background:var(--card);text-align:left;border-radius:6px;overflow:hidden;transition:transform .25s,box-shadow .25s,border-color .25s}
.card{position:relative}.card:hover{transform:translateY(-3px);box-shadow:0 22px 48px -24px #173d3599}.card.on{border-color:var(--green)}.card img{transition:transform .7s}.card:hover img{transform:scale(1.035)}
.chip{position:absolute;top:12px;left:12px;padding:6px 11px;border-radius:999px;background:#0b1a16b8;color:#f7f3ea;font-size:11.5px;font-weight:600;backdrop-filter:blur(6px)}
.card img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;background:var(--mist)}
.card-body{display:grid;gap:6px;padding:18px 18px 16px}.card-body>b{font:400 32px/1.05 "Instrument Serif",serif;color:var(--green)}
.card-line{font-size:14.5px;line-height:1.45;font-weight:300}.card-facts{font-size:13px;color:var(--soft)}
.card-foot{display:flex;justify-content:space-between;align-items:end;gap:10px;margin-top:10px;padding-top:12px;border-top:1px solid var(--line)}
.card-price{font:400 21px/1.1 "Instrument Serif",serif;color:var(--green);white-space:nowrap}.card-price small{display:block;font:600 10px/1.4 Manrope,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--soft)}
.go{font-size:13px;font-weight:600;color:#8a6a3c;white-space:nowrap}
@media(max-width:900px){.chip{display:none}.cards{grid-template-columns:1fr}.card{grid-template-columns:40% 1fr;grid-template-rows:auto}.card img{height:100%;aspect-ratio:auto}.card-body{padding:14px}.card-body>b{font-size:26px}.card-line{display:none}.card-foot{flex-direction:column;align-items:start;gap:4px}.card-price{font-size:19px}}

.tour{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:0;background:var(--green);color:#f4f1ea;scroll-margin-top:64px}
.stage-slot{position:relative;min-height:min(78vh,760px);background:#dfe7e3}.stage{position:absolute;inset:0;background:#dfe7e3;overflow:hidden}
.stage.is-full{position:fixed;z-index:60}html.is-full{overflow:hidden}.is-full .stage-top{top:max(10px,env(safe-area-inset-top,0px))}.is-full .stage-bottom{bottom:max(12px,env(safe-area-inset-bottom,0px))}
.stage canvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;outline-offset:-4px;transition:opacity .19s;cursor:grab}
.stage canvas:active{cursor:grabbing}.stage canvas.is-blink{opacity:0}
.stage::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(120% 90% at 50% 45%,#0000 62%,#10231d33)}
.stage-top,.stage-bottom{position:absolute;left:14px;right:14px;z-index:3;display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;pointer-events:none}
.stage-top{top:14px}.stage-bottom{bottom:14px;align-items:end}
.seg{display:flex;gap:2px;padding:3px;background:#fbf9f4ee;border-radius:999px;box-shadow:0 6px 20px -10px #0006;pointer-events:auto;max-width:100%}
.seg button{border:0;background:none;border-radius:999px;padding:9px 15px;min-height:40px;font-size:13.5px;font-weight:500;color:var(--ink);white-space:nowrap}
.seg button.on{background:var(--green);color:#fff}.seg button:hover:not(.on){background:#e7e6dc}
.hint{font-size:13px;color:var(--ink);background:#fbf9f4e6;padding:8px 14px;border-radius:999px;pointer-events:none;max-width:100%;transition:opacity .4s}.hint.is-off{opacity:0}
.roombar{display:flex;align-items:center;gap:2px;padding:3px;background:#fbf9f4ee;border-radius:999px;box-shadow:0 6px 20px -10px #0006;pointer-events:auto;color:var(--ink);max-width:100%;min-height:46px}
.roombar .now{min-width:0;display:flex;align-items:baseline;gap:8px;margin:0;padding:0 14px;white-space:nowrap}.roombar .now b{font:400 19px/1.15 "Instrument Serif",serif;color:var(--green);overflow:hidden;text-overflow:ellipsis}.roombar .now span{font-size:12.5px;font-weight:600;color:#8a6a3c}.roombar .round{width:40px;height:40px;flex:none}
.round{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:#fff;font-size:22px;line-height:1}.ghost{border:1px solid var(--line);background:#fff;border-radius:999px;padding:0 16px;min-height:44px;font-size:13px;font-weight:600;white-space:nowrap}
.is-live:not(.inside) #roombar[hidden]{display:none}
.labels{position:absolute;inset:0;z-index:2;pointer-events:none}.labels[hidden]{display:none}
.label{position:absolute;left:0;top:0;display:grid;justify-items:center;gap:1px;border:0;border-radius:10px;padding:6px 10px;background:#fbf9f4f2;box-shadow:0 6px 18px -8px #0008;pointer-events:auto;color:var(--ink);line-height:1.2;white-space:nowrap}
.label[hidden]{display:none}.spot{position:absolute;left:0;top:0;width:84px;height:84px;padding:0;border:0;background:none;pointer-events:auto;cursor:pointer}.spot::before{content:"";position:absolute;inset:0;border:4px solid #fff;border-radius:50%;background:#fff4;box-shadow:0 0 0 2px #0005,0 0 16px #0007;transform:scaleY(var(--f,1))}.spot[hidden]{display:none}.spot:hover::before,.spot:focus-visible::before{background:#fff9}.label b{font-weight:600;font-size:12.5px}.label span{font-size:12px;color:#8a6a3c;font-weight:600}.label:hover{background:#fff}
.poster{position:absolute;inset:0;z-index:4;display:grid;place-items:center;background:var(--mist)}.poster img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.poster .gold{position:relative;box-shadow:0 14px 34px -12px #000a}
.is-live.is-full .poster{display:none}.is-broken .poster .gold{display:none}
/* the tour runs on the whole screen only; in the page the stage shows the picture with the start button */
.stage:not(.is-full) .stage-top,.stage:not(.is-full) .stage-bottom,.stage:not(.is-live) .stage-bottom,.stage:not(.is-full) .joy,.stage:not(.is-full) .labels,.stage:not(.is-live) .seg{display:none}.is-full .stage-top{z-index:5}.stage.is-broken .stage-bottom{display:flex}

.panel{padding:26px 24px 28px;overflow:auto;max-height:min(78vh,760px)}
.panel .kicker{color:#d9bf94}.panel h2{color:#f7f3ea;font-size:40px;margin:8px 0 8px}.p-lead{font-weight:300;font-size:15px;line-height:1.45;color:#dfe6e0}
.price{display:grid;margin:16px 0 20px;padding:12px 0;border-top:1px solid #3c5a51;border-bottom:1px solid #3c5a51}.price span{font:600 10.5px/1.5 Manrope,sans-serif;letter-spacing:.15em;text-transform:uppercase;color:#c9d3cc}.price b{font:400 28px/1.1 "Instrument Serif",serif}
.panel h3{color:#c9d3cc}
.plan{background:var(--card);border-radius:6px;padding:6px}.plan svg{display:block;width:100%;height:auto}.plan [data-room]{cursor:pointer}.plan [data-room]:hover{fill:#f2c879}.plan [data-room]:focus-visible{outline:2px solid var(--green);outline-offset:-2px}
.rooms{list-style:none;margin:14px 0 10px;padding:0;display:grid;gap:4px}
.rooms button{width:100%;display:grid;grid-template-columns:26px 1fr auto;grid-template-areas:"n name area" "n floor area";align-items:center;column-gap:10px;text-align:left;border:1px solid #33544a;background:#213f37;color:#f4f1ea;border-radius:8px;padding:8px 12px;min-height:52px}
.rooms button:hover{background:#2a4c42}.rooms button.on{background:#f4f1ea;color:var(--ink);border-color:#f4f1ea}
.rooms i{grid-area:n;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--gold);color:#fff;font-style:normal;font-size:12px;font-weight:700}
.rooms span{grid-area:name;font-size:14.5px;font-weight:500;line-height:1.2}.rooms em{grid-area:floor;font-style:normal;font-size:11.5px;opacity:.7}.rooms b{grid-area:area;font-weight:600;font-size:15px;white-space:nowrap}
.panel .fine{color:#c9d3cc}
@media(max-width:1000px){.tour{grid-template-columns:1fr}.stage-slot{min-height:72svh}.panel{max-height:none}}
@media(max-width:560px){.stage-top{top:10px;left:10px;right:10px}.stage-bottom{left:10px;right:10px;bottom:10px}.seg{overflow-x:auto;scrollbar-width:none}.seg button{padding:9px 12px;font-size:13px}.hint{font-size:12px}.label b{font-size:11.5px}.ghost{padding:0 12px}}

.budget-sec,.path{max-width:1280px;margin:0 auto;padding:clamp(44px,6vw,84px) var(--side)}
.budget-sec{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,5vw,72px)}
.facts h2{font-size:clamp(30px,3.4vw,44px);margin-bottom:18px}
.facts dl{margin:0;display:grid}.facts dl div{display:flex;justify-content:space-between;gap:16px;padding:11px 0;border-bottom:1px solid var(--line)}.facts dt{color:var(--soft);font-size:14.5px}.facts dd{margin:0;font-weight:500;text-align:right}
.money{background:var(--mist);padding:24px}.money h3{color:var(--ink)}
.bar{display:flex;gap:3px;height:22px;margin:6px 0 16px}.bar i{display:block;flex:1 1 0;min-width:6px}i.a{background:var(--green)}i.b{background:var(--gold)}i.c{background:#a9b8a8}
.bar-key{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.bar-key>div{display:grid;grid-template-columns:12px 1fr;gap:9px}.bar-key>div>i{width:12px;height:12px;margin-top:9px}
.bar-key span{font-size:14px;line-height:1.35}.bar-key b{display:block;font:400 27px/1.1 "Instrument Serif",serif;color:var(--green)}.bar-key em{display:block;font-style:normal;font-size:12px;color:var(--soft)}
.packs{font-size:13.5px;margin:16px 0 8px}
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:12px}.tier{padding:16px;background:var(--card);border-top:4px solid #a9b8a8}.tier.on{border-top-color:var(--gold)}.tier b{font:400 27px/1.1 "Instrument Serif",serif;color:var(--green)}.tier p{font-size:14px;line-height:1.4;margin-top:6px}
.spec{margin-top:30px}.spec ol,.steps{list-style:none;margin:0;padding:0;display:grid;gap:18px}.spec ol{grid-template-columns:1fr 1fr;gap:18px 28px}
.spec li,.steps li{display:grid;grid-template-columns:44px 1fr}.spec li>i,.steps li>i{font:400 30px/1 "Instrument Serif",serif;font-style:normal;color:var(--gold)}
.spec b,.steps b{font-weight:600;font-size:16.5px}.spec p,.steps p{font-size:14.5px;line-height:1.5;color:var(--soft);margin-top:3px}
.fits{margin-top:30px}.fits ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.fits li{font-size:15px;line-height:1.4;padding-top:10px;border-top:2px solid var(--gold)}
@media(max-width:900px){.budget-sec{grid-template-columns:1fr}.bar-key,.tiers,.fits ul,.spec ol{grid-template-columns:1fr}}

.path{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,72px);border-top:1px solid var(--line)}
.path>h2{grid-column:1/-1;font-size:clamp(34px,4.6vw,60px)}
.ask{background:var(--green);color:#f4f1ea;padding:clamp(22px,3vw,36px);border-radius:6px;align-self:start}.ask h2{color:#f7f3ea;font-size:clamp(28px,3vw,40px);margin-bottom:10px}.ask>p{font-size:15px;color:#dfe6e0}.ask>.gold{margin-top:18px}
.names{margin-top:18px;font-size:15px}
@media(max-width:900px){.path{grid-template-columns:1fr}}

.foot{background:#16302a;color:#c9d3cc;padding:34px var(--side) calc(28px + env(safe-area-inset-bottom,0px))}
.foot p{max-width:1100px;margin:0 auto 10px;font-size:12.5px;line-height:1.55}.foot .links{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-top:18px;padding-top:16px;border-top:1px solid #33544a}.foot a{padding:10px 0}
.noscript{padding:20px var(--side);text-align:center}

.list{background:var(--green);color:#f5f2e9}.list-in{max-width:1280px;margin:0 auto;padding:clamp(48px,7vw,96px) var(--side);display:grid;grid-template-columns:1fr 1fr;gap:18px clamp(28px,5vw,72px);align-items:start}
.list .kicker{grid-column:1/-1;color:#d9bf94}.list h2{color:#f7f3ea;font-size:clamp(34px,4.4vw,58px)}.list .lead{color:#dfe6e0;grid-column:1;margin-top:14px}
.list .steps{grid-column:2;grid-row:2/5}.list .steps p{color:#c9d3cc}.list .gold{grid-column:1;justify-self:start;margin-top:22px;text-decoration:none;display:inline-flex;align-items:center}
@media(max-width:900px){.list-in{grid-template-columns:1fr}.list .steps,.list .lead,.list .gold{grid-column:1;grid-row:auto}}
.play{border:0;border-radius:999px;background:var(--gold);color:#fff;font-weight:600;font-size:13.5px;padding:0 18px;min-height:46px;box-shadow:0 6px 20px -10px #0008;pointer-events:auto;white-space:nowrap}.play::before{content:"▶";font-size:10px;margin-right:8px}.play.on{background:#fbf9f4;color:var(--ink)}.play.on::before{content:"❚❚"}
.vr{background:#fbf9f4;color:var(--ink)}
.vr::before{content:"◎";font-size:13px}
/* in a room the other rooms are small points, no words lie over the picture */
.labels[data-mode=inside] .label{width:30px;height:30px;padding:0;background:#173d35cc;border:2px solid #fff;border-radius:50%}.labels[data-mode=inside] .label span{display:none}.labels[data-mode=inside] .label b{font-size:0;width:8px;height:8px;border-radius:50%;background:#fff}.labels[data-mode=inside] .label:hover{background:#173d35}
.top-right{display:flex;gap:8px;align-items:center;min-width:0;max-width:100%}.full{pointer-events:auto;flex:none;display:grid;place-items:center;border:0;background:#fbf9f4ee;box-shadow:0 6px 20px -10px #0006;color:var(--ink)}
/* in a room the help line floats over the bottom row for a moment, so the row does not jump when it leaves */
.is-room .hint{position:absolute;left:0;bottom:calc(100% + 8px)}
.is-room #tabs{display:none}.is-room .stage-top{justify-content:flex-end}.is-room .play{font-size:0;padding:0;width:46px}.is-room .play::before{margin:0;font-size:11px}
.joy{position:absolute;right:18px;top:50%;margin-top:-58px;z-index:3;width:116px;height:116px;border-radius:50%;background:#fbf9f4cc;border:1px solid #fff;box-shadow:0 10px 30px -12px #000a;touch-action:none;display:grid;place-items:center}.joy[hidden]{display:none}
.joy i{width:50px;height:50px;border-radius:50%;background:var(--green);box-shadow:0 4px 12px -4px #0009;pointer-events:none}
@media(max-width:560px){.top-right{order:-1;width:100%;justify-content:space-between}.joy{right:12px;margin-top:-64px;width:104px;height:104px}}
/* arriving by a link with a house on a place (arrive.js): the tour has the whole screen at once, calm until the house stands on its land */
html.is-arrive{overflow:hidden}.is-arrive .stage{position:fixed;z-index:60}.is-arrive .stage canvas{opacity:0}.is-arrive .poster img,.is-arrive .stage:not(.is-loading) .poster .gold{display:none}