.casa-page{height:100vh;height:100dvh;overflow:hidden}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.casa-header{position:fixed;inset:0 0 auto 0;z-index:3;height:64px;padding:0 32px;display:flex;align-items:center;gap:24px;background:var(--paper);border-bottom:1px solid var(--line)}
.casa-header p{margin:0;font-size:12px;color:var(--muted)}.casa-header .languages{margin-left:34px}

/* The site plan fills the window; it zooms and pans in place. */
.stage{position:fixed;inset:0}.site-drawing{position:absolute;inset:0;transition:transform .35s ease}
.site-drawing svg,.sheet-view svg{display:block;width:100%;height:100%;user-select:none;-webkit-user-select:none}.sheet-view svg{touch-action:none;cursor:grab}
.dragging svg,svg.dragging{cursor:grabbing}
.stage-hint{position:absolute;left:50%;bottom:30px;transform:translateX(-50%);margin:0;padding:5px 12px;background:var(--paper);font-size:12px;color:var(--muted);pointer-events:none;transition:opacity .3s;white-space:nowrap}
.menu-open .stage-hint,.menu-open .stage-foot{opacity:0}

/* The house on the site plan: its floors at their place, under the outline. */
.house-hit{fill:transparent;stroke:transparent;stroke-width:14;pointer-events:all;cursor:pointer;outline:none}
.house-line{fill:none;stroke:var(--green);stroke-width:2.6;opacity:0;transition:opacity .25s;pointer-events:none}
.house-focus .house-line{opacity:1;stroke-dasharray:6 5}
.xray{opacity:0;transition:opacity .4s ease;pointer-events:none}.xray-ground{fill:var(--paper)}
.floor{opacity:0;transition:opacity .3s ease}
.cut{opacity:0;transition:opacity .25s;pointer-events:none}.cut path{stroke:var(--green)}
.house-open .xray,.house-open .house-line{opacity:1}
svg[data-floor=terreo] .floor[data-floor=terreo],svg[data-floor=superior] .floor[data-floor=superior],svg[data-cut=corteab] .cut[data-cut=corteab],svg[data-cut=cortecd] .cut[data-cut=cortecd]{opacity:1}

/* Zoom buttons. */
.zoom{position:absolute;left:32px;bottom:26px;z-index:2;display:flex;border:1px solid var(--line);background:var(--paper)}
.zoom button{min-width:36px;height:34px;padding:0 10px;font-size:16px;color:var(--ink)}.zoom button+button{border-left:1px solid var(--line)}
.zoom button[data-zoom=fit]{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}.zoom button:hover{color:var(--green)}

/* The menu that pops from the house when it is clicked: its plans and sections. */
.house-menu{position:absolute;z-index:2;top:0;left:0;display:flex;gap:20px;padding:10px 14px 12px;background:var(--paper);border:1px solid var(--line);box-shadow:0 12px 32px rgba(31,42,34,.08);opacity:0;visibility:hidden;transform:translateY(-10px) scale(.92);transform-origin:var(--notch,50%) 0;transition:opacity .18s ease,transform .22s ease,visibility 0s .22s}
.menu-open .house-menu{opacity:1;visibility:visible;transform:none;transition:opacity .2s ease,transform .32s cubic-bezier(.2,.9,.25,1.15)}
.house-menu::before{content:"";position:absolute;top:-6px;left:var(--notch,50%);width:10px;height:10px;background:var(--paper);border-left:1px solid var(--line);border-top:1px solid var(--line);transform:translateX(-50%) rotate(45deg)}
.house-menu.over::before{display:none}
.menu-group+.menu-group{padding-left:20px;border-left:1px solid var(--line)}
.menu-group h2{font-size:10px;font-weight:400;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 8px}
.menu-row{display:flex;gap:10px}
.sheet-card{display:block;width:104px;padding:0;text-align:left;opacity:0;transform:translateY(-6px);transition:opacity .2s ease,transform .25s ease}
.menu-open .sheet-card{opacity:1;transform:none;transition-delay:calc(var(--i) * 45ms + 60ms)}
.sheet-thumb{display:block;aspect-ratio:1.3;padding:6px;border:1px solid var(--line);transition:border-color .2s}.sheet-thumb img{display:block;width:100%;height:100%;object-fit:contain}
.sheet-card .sheet-label{display:flex;justify-content:space-between;gap:6px;font-size:11px;margin-top:6px}.sheet-label small{font-size:10px;color:var(--muted)}
.sheet-card:hover .sheet-thumb,.sheet-card[aria-current=true] .sheet-thumb,.sheet-card:focus-visible .sheet-thumb{border-color:var(--green)}
.sheet-card[aria-current=true] .sheet-label{color:var(--green)}.sheet-card:focus-visible{outline:none}
.stage-foot{position:absolute;left:32px;bottom:12px;margin:0;font-size:10px;color:var(--muted);pointer-events:none}

/* A sheet, enlarged to the window. */
.sheet-dialog{width:min(1120px,calc(100vw - 200px));height:min(800px,calc(100vh - 180px));height:min(800px,calc(100dvh - 180px));max-width:none;max-height:none;margin:auto;overflow:hidden;background:var(--paper);border:1px solid var(--line);box-shadow:0 24px 64px rgba(31,42,34,.16)}
.sheet-dialog[open]{display:block}.sheet-dialog::backdrop{background:rgba(246,246,239,.4);backdrop-filter:none}
.sheet-dialog.popping{animation:sheet-pop .38s cubic-bezier(.2,.9,.25,1)}
.sheet-dialog.closing{animation:sheet-out .17s ease forwards}
@keyframes sheet-pop{from{opacity:.2;transform:translate(var(--dx,0),var(--dy,0)) scale(var(--s,.9))}to{opacity:1;transform:none}}
@keyframes sheet-out{to{opacity:0;transform:scale(.96)}}
.sheet-bar{position:absolute;inset:0 0 auto 0;z-index:2;height:52px;padding:0 10px 0 24px;display:flex;align-items:center;gap:20px;border-bottom:1px solid var(--line);background:var(--paper)}
.sheet-bar h2{font:19px var(--serif);font-weight:400;margin:0 auto 0 0}
.sheet-close{font-size:26px;width:38px;height:38px;line-height:1}
.sheet-view{position:absolute;inset:52px 0 0 0}.sheet-view svg{outline:none}.sheet-view svg.outside{cursor:zoom-out}

@media(max-width:900px){
  .casa-header{padding:0 20px}.casa-header p{display:none}.casa-header .site-nav{margin-left:0}.casa-header .languages{margin-left:auto}
  .house-menu{gap:14px;padding:10px 12px 12px;flex-wrap:wrap;max-width:calc(100vw - 24px)}.menu-group+.menu-group{padding-left:14px}
  .sheet-card{width:92px}.stage-foot{left:20px;right:20px;text-align:center}
  .zoom{left:20px;bottom:20px}
  .stage-hint{bottom:34px}
  .sheet-dialog{width:calc(100vw - 20px);height:calc(100vh - 84px);height:calc(100dvh - 84px)}
  .sheet-bar{padding:0 6px 0 16px;gap:12px}.sheet-bar h2{font-size:16px}
}
@media(prefers-reduced-motion:reduce){.house-menu,.sheet-card{transition:none!important;transform:none}.sheet-dialog.popping,.sheet-dialog.closing{animation:none}}