/* ============================================================
   PROBUILD+ MODULE (b): "Buildings that stayed open" (pb-stayed-open.js)
   Self-contained: every rule is scoped to .pbm-stay.
   ============================================================ */
.pbm-stay{
  --pbm-o:var(--orange,#ff5b00);
  --pbm-ob:var(--orange-bright,#ff9244);
  --pbm-line:var(--line,rgba(255,255,255,.08));
  --pbm-line2:var(--line-strong,rgba(255,255,255,.14));
  --pbm-muted:var(--muted,#9a9aa6);
  --pbm-ease:var(--ease,cubic-bezier(.22,.61,.36,1));
  position:relative;
}
.pbm-stay__fallback{ display:flex; flex-wrap:wrap; gap:.6rem; }
.pbm-stay__fallback a{ display:inline-flex; padding:.7rem 1rem; border-radius:999px; border:1px solid var(--pbm-line2); color:#fff; font-weight:600; }

/* ---- building-type tabs ---- */
.pbm-stay__tabs{
  display:flex; gap:.5rem;
  padding:.45rem; border-radius:16px; border:1px solid var(--pbm-line);
  background:rgba(255,255,255,.02); margin-bottom:1.1rem;
}
.pbm-stay__tab{
  -webkit-appearance:none; appearance:none; font:inherit; cursor:pointer; flex:1 1 auto; white-space:nowrap;
  display:flex; align-items:center; justify-content:center; gap:.55rem; min-height:52px;
  padding:.65rem .7rem; border-radius:11px; border:1px solid transparent;
  background:transparent; color:var(--pbm-muted);
  font-family:var(--font-display,system-ui); font-weight:600; font-size:.93rem; line-height:1.2; text-align:center;
  transition:color .25s var(--pbm-ease), background .25s var(--pbm-ease), border-color .25s var(--pbm-ease);
}
.pbm-stay__ico{ flex:none; opacity:.8; }
.pbm-stay__tab:hover{ color:#fff; background:rgba(255,255,255,.04); }
.pbm-stay__tab[aria-selected="true"]{
  color:#0a0a0d; background:var(--grad-orange,linear-gradient(135deg,#ff7a1a,#ff5b00 45%,#e24800));
  box-shadow:0 12px 30px -16px rgba(255,91,0,.85);
}
.pbm-stay__tab[aria-selected="true"] .pbm-stay__ico{ opacity:1; }
.pbm-stay__tab:focus-visible{ outline:2px solid var(--pbm-ob); outline-offset:2px; }

/* ---- project panel ---- */
.pbm-stay__stage{ position:relative; }
.pbm-stay__panel{
  display:grid; grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr); align-items:stretch;
  border-radius:20px; overflow:hidden; border:1px solid var(--pbm-line2);
  background:linear-gradient(165deg, var(--surface,#131318), var(--bg-2,#0e0e12));
}
.pbm-stay__panel[hidden]{ display:none; }
.pbm-stay__panel:focus-visible{ outline:2px solid var(--pbm-ob); outline-offset:3px; }

.pbm-stay__fig{ position:relative; margin:0; min-width:0; min-height:440px; overflow:hidden; background:#0c0c10; }
.pbm-stay__fig img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  filter:saturate(.92) contrast(1.04) brightness(.9);
  animation:pbmStayImg 1.1s var(--pbm-ease) both;
}
.pbm-stay__fig::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(180deg, transparent 55%, rgba(7,7,10,.78)),
             linear-gradient(90deg, transparent 70%, rgba(7,7,10,.35));
}
.pbm-stay__place{
  position:absolute; left:1.1rem; bottom:1rem; z-index:2;
  display:inline-flex; align-items:center; gap:.45rem;
  font-family:var(--font-mono,monospace); font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; color:#fff;
  padding:.4rem .7rem; border-radius:999px; background:rgba(7,7,10,.55); border:1px solid rgba(255,255,255,.14);
  -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
}
.pbm-stay__place svg{ color:var(--pbm-ob); }

.pbm-stay__body{ position:relative; padding:clamp(1.4rem,2.8vw,2.3rem); display:flex; flex-direction:column; min-width:0; }
.pbm-stay__body > *{ animation:pbmStayIn .6s var(--pbm-ease) both; }
.pbm-stay__body > *:nth-child(2){ animation-delay:.05s; }
.pbm-stay__body > *:nth-child(3){ animation-delay:.1s; }
.pbm-stay__body > *:nth-child(4){ animation-delay:.15s; }
.pbm-stay__body > *:nth-child(5){ animation-delay:.2s; }
.pbm-stay__body > *:nth-child(6){ animation-delay:.25s; }
.pbm-stay__body > *:nth-child(7){ animation-delay:.3s; }
.pbm-stay__chips{ display:flex; flex-wrap:wrap; gap:.45rem; margin-bottom:1rem; }
.pbm-stay__chip{
  font-family:var(--font-mono,monospace); font-size:.68rem; letter-spacing:.12em; text-transform:uppercase;
  color:var(--ember,#ffb47a); padding:.36rem .7rem; border-radius:999px;
  border:1px solid rgba(255,91,0,.3); background:rgba(255,91,0,.07);
}
.pbm-stay__name{
  font-family:var(--font-display,system-ui); font-weight:700; font-size:clamp(1.4rem,2.3vw,1.9rem);
  line-height:1.1; letter-spacing:-.02em; color:#fff; margin-bottom:.65rem;
}
.pbm-stay__lead{ color:rgba(255,255,255,.86); font-size:1.02rem; line-height:1.55; margin-bottom:1.2rem; }
.pbm-stay__label{
  font-family:var(--font-mono,monospace); font-size:.7rem; letter-spacing:.18em; text-transform:uppercase;
  color:var(--pbm-ob); margin-bottom:.6rem;
}
.pbm-stay__facts{ list-style:none; margin:0; padding:0; display:grid; gap:.55rem; }
.pbm-stay__facts li{ position:relative; padding-left:1.25rem; color:var(--pbm-muted); font-size:.95rem; line-height:1.5; }
.pbm-stay__facts li::before{
  content:""; position:absolute; left:0; top:.55em; width:7px; height:7px; border-radius:2px;
  background:var(--pbm-o); box-shadow:0 0 8px rgba(255,91,0,.6);
}
.pbm-stay__meta{ display:flex; flex-wrap:wrap; gap:1rem 2.2rem; margin-top:1.4rem; padding-top:1.2rem; border-top:1px solid var(--pbm-line); }
.pbm-stay__stat strong{
  display:block; font-family:var(--font-display,system-ui); font-weight:700; font-size:1.65rem; line-height:1;
  color:#fff; letter-spacing:-.02em; font-variant-numeric:tabular-nums;
}
.pbm-stay__ok{ color:var(--pbm-ob) !important; }
.pbm-stay__stat > span{ display:block; margin-top:.35rem; font-size:.8rem; color:var(--muted-2,#6c6c78); }
.pbm-stay__link{
  align-self:flex-start; margin-top:auto; padding-top:1.4rem;
  display:inline-flex; align-items:center; gap:.5rem;
  font-family:var(--font-mono,monospace); font-size:.76rem; letter-spacing:.16em; text-transform:uppercase; color:var(--pbm-ob);
}
.pbm-stay__link svg{ transition:transform .3s var(--pbm-ease); }
.pbm-stay__link:hover{ color:#fff; }
.pbm-stay__link:hover svg, .pbm-stay__link:focus-visible svg{ transform:translateX(4px); }
.pbm-stay__link:focus-visible{ outline:2px solid var(--pbm-ob); outline-offset:4px; border-radius:4px; }

.pbm-stay.is-waiting .pbm-stay__body > *,
.pbm-stay.is-waiting .pbm-stay__fig img{ animation-play-state:paused; }

@keyframes pbmStayIn{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:none; } }
@keyframes pbmStayImg{ from{ opacity:0; transform:scale(1.06); } to{ opacity:1; transform:scale(1); } }

@media (max-width:1000px){
  .pbm-stay__tabs{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); }
  .pbm-stay__tab{ white-space:normal; }
  .pbm-stay__panel{ grid-template-columns:1fr; }
  .pbm-stay__fig{ aspect-ratio:16 / 10; min-height:0; }
}
@media (max-width:560px){
  .pbm-stay__tabs{ gap:.35rem; padding:.35rem; border-radius:14px; }
  .pbm-stay__tab{ flex-direction:column; gap:.3rem; min-height:64px; padding:.55rem .3rem; font-size:.8rem; }
  .pbm-stay__ico{ width:20px; height:20px; }
  .pbm-stay__panel{ border-radius:16px; }
  .pbm-stay__body{ padding:1.3rem 1.15rem 1.4rem; }
  .pbm-stay__lead{ font-size:.98rem; }
  .pbm-stay__stat strong{ font-size:1.45rem; }
  .pbm-stay__place{ left:.8rem; bottom:.8rem; font-size:.66rem; }
}
@media (prefers-reduced-motion:reduce){
  .pbm-stay *{ animation:none !important; transition:none !important; }
}
