/* 1332: "Find your home in the building" 3D model (availability page). Uses the site tokens from styles.css + property.css. */
.b3-section { padding-top: 0; }
.b3-head { display: grid; gap: var(--s3); margin-bottom: var(--s4); max-width: 760px; }
.b3-head p { margin: 0; color: var(--ink-soft); }
.b3 { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: var(--s4); align-items: start; }
.b3-stage { position: relative; aspect-ratio: 16 / 10; background: linear-gradient(#F1EADD, #E3DACA); border: 1px solid var(--line); overflow: hidden; max-width: 100%; }
.b3-stage canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; touch-action: none; cursor: grab; }
.b3-levels { position: absolute; left: 12px; top: 12px; right: 12px; display: flex; flex-wrap: wrap; gap: 6px; z-index: 2; pointer-events: none; }
.b3-levels button { pointer-events: auto; font: 500 12.5px/1 var(--sans); letter-spacing: .06em; text-transform: uppercase; border: 1px solid rgba(29, 58, 45, .3); background: rgba(250, 246, 238, .94); color: var(--river-deep); padding: 9px 12px; cursor: pointer; }
.b3-levels button[aria-pressed="true"] { background: var(--river-deep); color: var(--paper); border-color: var(--river-deep); }
.b3-levels button:focus-visible { outline: 2px solid var(--brass); outline-offset: 2px; }
.b3-legend { position: absolute; left: 12px; bottom: 12px; display: flex; flex-wrap: wrap; gap: 6px 12px; font: 500 12px var(--sans); color: var(--ink); background: rgba(250, 246, 238, .92); padding: 6px 10px; z-index: 2; max-width: calc(100% - 24px); }
.b3-legend i { display: inline-block; width: 10px; height: 10px; margin-right: 6px; vertical-align: -1px; }
.b3-legend .up { display: none; }
.b3.is-upper .b3-legend .up { display: inline; }
.b3.is-upper .b3-legend .new { display: none; }
.b3-tip { position: absolute; z-index: 3; pointer-events: none; background: var(--river-deep); color: var(--paper); font: 500 12.5px var(--sans); letter-spacing: .02em; padding: 6px 9px; white-space: nowrap; }
.b3-side { display: grid; gap: var(--s3); min-width: 0; }
.b3-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.b3-list button { display: grid; gap: 3px; text-align: left; border: 1px solid var(--line); background: #FFFDF8; padding: 9px 11px; cursor: pointer; font-family: var(--sans); color: var(--ink); min-width: 0; }
.b3-list button .n { font: 400 22px/1 var(--serif); color: var(--river-deep); }
.b3-list button .m { font-size: 12.5px; color: var(--ink-soft); }
.b3-list button:hover { border-color: rgba(169, 130, 69, .6); }
.b3-list button[aria-current="true"] { border-color: var(--brass); box-shadow: inset 0 0 0 1px var(--brass); background: #FBF4E6; }
.b3-card { border: 1px solid var(--line); border-top: 3px solid var(--brass); background: #FFFDF8; padding: var(--s3); display: grid; gap: 6px; }
.b3-card h3 { font: 400 30px/1.05 var(--serif); margin: 0; color: var(--river-deep); }
.b3-card p { margin: 0; }
.b3-eyebrow { font: 600 11px var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--brass-text); }
.b3-facts { font-size: 15px; }
.b3-avail { font-size: 13.5px; color: var(--ink-soft); }
.b3-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
.b3-btn { font: 500 13px/1 var(--sans); letter-spacing: .08em; text-transform: uppercase; text-decoration: none; padding: 11px 14px; background: var(--river-deep); color: var(--paper); border: 1px solid var(--river-deep); cursor: pointer; }
.b3-btn:hover { background: var(--river); }
.b3-btn--ghost { background: transparent; color: var(--river-deep); }
.b3-btn--ghost:hover { background: rgba(29, 58, 45, .06); }
@media (max-width: 900px) {
  .b3 { grid-template-columns: 1fr; }
  .b3-stage { aspect-ratio: 4 / 3; }
  .b3-list { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); }
}
@media (max-width: 600px) {
  .b3-stage { aspect-ratio: 4 / 4.2; }
  .b3-levels { left: 8px; top: 8px; right: 8px; gap: 4px; }
  .b3-levels button { padding: 7px 8px; font-size: 11px; letter-spacing: .04em; }
  .b3-legend { left: 8px; bottom: 8px; font-size: 11px; gap: 4px 10px; }
}
.b3-acc { font: 600 12.5px var(--sans); color: var(--river); }