/* ---------- 360° tour ---------- */
/* Namespaced .tour, not .pano — .pano is already the full-bleed
   main-floor strip near the top of the page. */

.tour__tabs{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.25rem}
.tour__tab{
  font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--steel);background:transparent;
  border:1px solid rgba(107,119,108,.34);
  padding:.5rem .95rem;cursor:pointer;
  transition:border-color .18s,color .18s,background .18s;
}
.tour__tab:hover{border-color:var(--steel);color:var(--iron)}
.tour__tab.is-on{background:var(--iron);border-color:var(--iron);color:var(--chalk)}

.tour__room{display:none;position:relative}
.tour__room.is-on{display:block}

.tour__stage,
.tour__poster{
  position:relative;width:100%;
  aspect-ratio:2/1;
  overflow:hidden;
  background:var(--iron);
  border:1px solid var(--chalk-2);
}
.tour__stage{position:absolute;inset:0}

.tour__poster{display:block;z-index:2;padding:0;cursor:pointer;transition:opacity .4s ease}
.tour__poster img{width:100%;height:100%;object-fit:cover}
.tour__poster::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(23,28,24,.05) 45%,rgba(23,28,24,.5));
}
.tour__poster.is-gone{opacity:0;pointer-events:none}

.tour__cue{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:1;
  display:inline-flex;align-items:center;gap:.6rem;
  font-family:var(--display);font-weight:700;text-transform:uppercase;
  font-size:1.05rem;letter-spacing:.03em;
  background:var(--paddock);color:#fff;
  padding:.85rem 1.6rem;white-space:nowrap;
  transition:background .18s,transform .18s;
}
.tour__cue svg{width:18px;height:18px}
.tour__poster:hover .tour__cue{background:#3A87FF;transform:translate(-50%,-50%) translateY(-2px)}
.tour__poster:focus-visible{outline:3px solid var(--oxide);outline-offset:3px}

.tour__poster.is-loading{cursor:progress}
.tour__poster.is-loading .tour__cue{animation:tourPulse 1.1s ease-in-out infinite}
@keyframes tourPulse{50%{opacity:.6}}

.tour__hint{
  font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--steel);margin-top:.8rem;
}

/* A 2:1 letterbox is too shallow to explore on a phone. */
@media(max-width:760px){
  .tour__stage,.tour__poster{aspect-ratio:4/3}
  .tour__cue{font-size:.95rem;padding:.75rem 1.25rem}
}
