/* ==========================================================================
   PropertyBazaar — developer microsite  (v1.47, Sprint 49)
   Scoped to .pb-dev, tokens --pbd-*. Seventh carve-out from main.css.

   --pbd-brand is the ONLY developer-settable token, applied inline on the
   wrapper. Everything carrying a judgement uses teal/ink instead.
   ========================================================================== */


/* ============================================================
   PropertyBazaar — developer microsite

   A microsite, not a profile page. The developer controls the
   BRAND LAYER (logo, hero, accent colour, about copy, gallery).
   PropertyBazaar controls the TRUST LAYER (chrome, verification,
   price context, delivery record) and it is not themeable.

   --pbd-brand is the only variable a developer can set. Everything
   that carries a judgement uses --pbd-teal / --pbd-ink so a builder
   cannot recolour their own scorecard.
   ============================================================ */
:root{
  --pbd-teal:#1F6B6B; --pbd-teal-dk:#155252; --pbd-teal-tint:#EAF2F2;
  --pbd-orange:#E8873C; --pbd-orange-dk:#C26A25; --pbd-orange-tint:#FDF0E5;
  --pbd-ink:#0E1F26; --pbd-ink-2:#2B3F47; --pbd-gray:#5F6B70; --pbd-gray-2:#8B979C;
  --pbd-line:#E2E7E8; --pbd-line-2:#EFF3F3; --pbd-ground:#F6F8F8; --pbd-white:#fff;
  --pbd-green:#1F7A5C; --pbd-green-tint:#E7F4EE; --pbd-red:#B4472E;
  --pbd-amber:#B26A00; --pbd-amber-tint:#FBF3E4;
  --pbd-shadow-lg:0 12px 32px rgba(14,31,38,.10);
  --pbd-font:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;

  /* Developer-supplied. The only themeable token. */
  --pbd-brand:#1F6B6B;
  --pbd-brand-tint:#F5EFE6;
}

.pb-dev *{box-sizing:border-box}
.pb-dev body{margin:0;background:var(--pbd-ground);color:var(--pbd-ink);font-family:var(--pbd-font);font-size:15px;line-height:1.55;-webkit-font-smoothing:antialiased}
.pb-dev img{display:block;max-width:100%}
.pb-dev button{font-family:inherit;cursor:pointer}
.pb-dev a{color:var(--pbd-teal);text-decoration:none}
.pb-dev .num{font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.pb-dev .wrap{max-width:1240px;margin:0 auto;padding:0 24px}
.pb-dev svg.i{flex:none;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

.pb-dev .btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:11px 18px;border-radius:9px;border:1.5px solid transparent;font-size:13.5px;font-weight:700;line-height:1;transition:.15s}
.pb-dev .btn--sm{padding:8px 12px;font-size:12.5px}
.pb-dev .btn--lg{padding:14px 20px;font-size:14.5px;width:100%}
.pb-dev .btn--teal{background:var(--pbd-teal);color:#fff}
.pb-dev .btn--teal:hover{background:var(--pbd-teal-dk);color:#fff}
.pb-dev .btn--orange{background:var(--pbd-orange);color:#fff}
.pb-dev .btn--out{border-color:var(--pbd-teal);color:var(--pbd-teal)}
.pb-dev .btn--out:hover{background:var(--pbd-teal);color:#fff}
.pb-dev .btn--ghost{border-color:var(--pbd-line);color:var(--pbd-gray);background:var(--pbd-white)}
.pb-dev .btn--ghost:hover{border-color:var(--pbd-teal);color:var(--pbd-teal)}
.pb-dev .btn--brand{background:var(--pbd-brand);color:#fff}
.pb-dev .btn--wa{background:#128C7E;color:#fff}

.pb-dev /* ---- brand layer ---- */
.mshero{position:relative;background:var(--pbd-ink);overflow:hidden}
.pb-dev .mshero img{width:100%;height:340px;object-fit:cover;opacity:.42}
.pb-dev .mshero__in{position:absolute;inset:auto 0 0 0;padding:0 0 26px}
.pb-dev .mshero__id{display:flex;align-items:flex-end;gap:20px;flex-wrap:wrap}
.pb-dev .mshero__logo{width:96px;height:96px;border-radius:18px;background:#fff;padding:10px;object-fit:contain;flex:none;box-shadow:0 8px 24px rgba(0,0,0,.28)}
.pb-dev .mshero__t h1{margin:0 0 5px;font-size:clamp(26px,3vw,38px);font-weight:800;letter-spacing:-.03em;color:#fff}
.pb-dev .mshero__t p{margin:0;color:rgba(255,255,255,.78);font-size:15px}
.pb-dev .mshero__t .est{color:var(--pbd-brand);font-weight:700}
.pb-dev .mshero__acts{margin-left:auto;display:flex;gap:10px;align-self:flex-end}

.pb-dev /* ---- microsite nav ---- */
.msnav{background:var(--pbd-white);border-bottom:1px solid var(--pbd-line);position:sticky;top:56px;z-index:50}
.pb-dev .msnav__in{display:flex;gap:2px;overflow-x:auto}
.pb-dev .msnav a{padding:15px 18px;font-size:13.5px;font-weight:700;color:var(--pbd-gray);white-space:nowrap;border-bottom:2px solid transparent}
.pb-dev .msnav a:hover{color:var(--pbd-ink)}
.pb-dev .msnav a.on{color:var(--pbd-ink);border-bottom-color:var(--pbd-brand)}
.pb-dev .msnav__cta{margin-left:auto;display:flex;align-items:center;padding:8px 0}

.pb-dev /* ---- sections ---- */
.sec{padding:40px 0}
.pb-dev .sec--tight{padding-top:0}
.pb-dev .eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--pbd-teal);margin-bottom:10px}
.pb-dev .eyebrow::before{content:"";width:22px;height:2px;background:var(--pbd-orange);border-radius:2px}
.pb-dev h2.h{font-size:clamp(21px,2.3vw,28px);font-weight:800;letter-spacing:-.028em;margin:0 0 7px}
.pb-dev .sub{margin:0;color:var(--pbd-gray);font-size:14px;max-width:74ch}
.pb-dev .head{margin-bottom:22px}
.pb-dev .head--row{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap}
.pb-dev .panel{background:var(--pbd-white);border:1px solid var(--pbd-line);border-radius:16px;padding:26px}

.pb-dev /* ---- scorecard — PB-owned, .pb-dev brand colours deliberately absent ---- */
.score{display:grid;grid-template-columns:repeat(5,1fr);gap:0;border:1px solid var(--pbd-line);border-radius:16px;overflow:hidden;background:var(--pbd-white)}
.pb-dev .score div{padding:20px;border-right:1px solid var(--pbd-line-2)}
.pb-dev .score div:last-child{border-right:0}
.pb-dev .score span{display:block;font-size:11px;color:var(--pbd-gray-2);margin-bottom:3px}
.pb-dev .score b{font-size:24px;font-weight:800;letter-spacing:-.025em;display:block;line-height:1.1}
.pb-dev .score em{font-style:normal;font-size:11.5px;color:var(--pbd-gray)}
.pb-dev .score .warn{color:var(--pbd-amber)}
.pb-dev .score .good{color:var(--pbd-green)}

.pb-dev .trustnote{display:flex;gap:12px;align-items:flex-start;margin-top:14px;padding:14px 16px;background:var(--pbd-teal-tint);border:1px solid #CFE2E2;border-radius:12px;font-size:12.5px;color:var(--pbd-ink-2);line-height:1.55}
.pb-dev .trustnote svg{color:var(--pbd-teal);margin-top:1px}

.pb-dev /* ---- about ---- */
.about{display:grid;grid-template-columns:1.6fr 1fr;gap:26px;align-items:start}
.pb-dev .about p{font-size:14.5px;line-height:1.75;color:var(--pbd-ink-2);margin:0 0 14px}
.pb-dev .about p:last-child{margin-bottom:0}
.pb-dev .facts div{display:flex;justify-content:space-between;gap:14px;padding:11px 0;border-bottom:1px solid var(--pbd-line-2);font-size:13.5px}
.pb-dev .facts div:last-child{border-bottom:0}
.pb-dev .facts span{color:var(--pbd-gray)}
.pb-dev .facts b{font-weight:700;text-align:right}

.pb-dev /* ---- project tabs ---- */
.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px}
.pb-dev .tab{background:var(--pbd-white);border:1.5px solid var(--pbd-line);color:var(--pbd-gray);padding:9px 16px;border-radius:999px;font-size:13px;font-weight:700}
.pb-dev .tab:hover{border-color:var(--pbd-brand);color:var(--pbd-brand)}
.pb-dev .tab.on{background:var(--pbd-ink);border-color:var(--pbd-ink);color:#fff}
.pb-dev .pane{display:none}.pb-dev .pane.on{display:grid}

.pb-dev .g3{grid-template-columns:repeat(3,1fr);gap:18px}
.pb-dev .pcard{background:var(--pbd-white);border:1px solid var(--pbd-line);border-radius:15px;overflow:hidden;display:flex;flex-direction:column}
.pb-dev .pcard:hover{border-color:var(--pbd-teal);box-shadow:var(--pbd-shadow-lg)}
.pb-dev .pcard__i{position:relative}
.pb-dev .pcard__i img{width:100%;height:186px;object-fit:cover}
.pb-dev .pstat{position:absolute;top:11px;left:11px;border-radius:7px;padding:5px 10px;font-size:11px;font-weight:800;color:#fff}
.pb-dev .pstat--live{background:var(--pbd-amber)}
.pb-dev .pstat--done{background:var(--pbd-green)}
.pb-dev .pstat--soon{background:var(--pbd-ink)}
.pb-dev .pcard__b{padding:16px 17px 18px;display:flex;flex-direction:column;gap:3px;flex:1}
.pb-dev .pcard__b h3{margin:0;font-size:16.5px;font-weight:800;letter-spacing:-.02em}
.pb-dev .pcard__b h3 a{color:var(--pbd-ink)}
.pb-dev .pcard__b .l{font-size:12.5px;color:var(--pbd-gray)}
.pb-dev .pcard__b .c{font-size:13px;color:var(--pbd-ink-2);margin-top:5px}
.pb-dev .pcard__b .p{font-size:16.5px;font-weight:800;margin-top:9px}
.pb-dev .pcard__f{display:flex;align-items:center;gap:8px;margin-top:12px;flex-wrap:wrap}
.pb-dev .mini{font-size:11.5px;color:var(--pbd-gray-2)}

.pb-dev /* ---- inventory: three sources ---- */
.srcbar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}
.pb-dev .src{display:inline-flex;align-items:center;gap:7px;border:1.5px solid var(--pbd-line);background:var(--pbd-white);border-radius:999px;padding:8px 14px;font-size:12.5px;font-weight:700;color:var(--pbd-gray)}
.pb-dev .src.on{background:var(--pbd-ink);border-color:var(--pbd-ink);color:#fff}
.pb-dev .src i{width:8px;height:8px;border-radius:50%;font-style:normal}
.pb-dev .src .d-builder{background:var(--pbd-brand)}
.pb-dev .src .d-partner{background:var(--pbd-teal)}
.pb-dev .src .d-owner{background:var(--pbd-orange)}

.pb-dev .unit{display:grid;grid-template-columns:120px 1fr auto;gap:15px;align-items:center;padding:14px;background:var(--pbd-white);border:1px solid var(--pbd-line);border-radius:13px;margin-bottom:11px;transition:.15s}
.pb-dev .unit:hover{border-color:var(--pbd-teal);box-shadow:var(--pbd-shadow-lg)}
.pb-dev .unit img{width:120px;height:86px;object-fit:cover;border-radius:10px}
.pb-dev .unit b{display:block;font-size:15px;font-weight:800}
.pb-dev .unit .m{font-size:12.5px;color:var(--pbd-gray)}
.pb-dev .utag{display:inline-flex;align-items:center;gap:5px;border-radius:6px;padding:3px 8px;font-size:10.5px;font-weight:800;margin-top:6px}
.pb-dev .utag--builder{background:var(--pbd-brand-tint);color:var(--pbd-brand)}
.pb-dev .utag--partner{background:var(--pbd-teal-tint);color:var(--pbd-teal)}
.pb-dev .utag--owner{background:var(--pbd-orange-tint);color:var(--pbd-orange-dk)}
.pb-dev .unit .p{text-align:right}
.pb-dev .unit .p b{font-size:18px}
.pb-dev .unit .p span{display:block;font-size:11.5px;color:var(--pbd-gray)}
.pb-dev .unit .p .vs{display:inline-block;margin-top:4px;padding:2px 7px;border-radius:5px;font-size:10.5px;font-weight:800}
.pb-dev .vs--under{background:var(--pbd-green-tint);color:var(--pbd-green)}
.pb-dev .vs--over{background:#FBECE7;color:var(--pbd-red)}

.pb-dev /* ---- gallery ---- */
.gal{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.pb-dev .gal img{width:100%;height:150px;object-fit:cover;border-radius:12px}
.pb-dev .gal a:first-child{grid-column:span 2;grid-row:span 2}
.pb-dev .gal a:first-child img{height:310px}

.pb-dev /* ---- contact ---- */
.cta{background:linear-gradient(140deg,var(--pbd-ink),#1B3A44);border-radius:18px;padding:32px;display:grid;grid-template-columns:1.3fr 1fr;gap:32px;align-items:center;color:#fff}
.pb-dev .cta h2{margin:0 0 8px;font-size:24px;font-weight:800;letter-spacing:-.025em;color:#fff}
.pb-dev .cta p{margin:0;color:rgba(255,255,255,.72);font-size:14px;line-height:1.65}
.pb-dev .cform input, .pb-dev .cform select{width:100%;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.08);color:#fff;border-radius:9px;padding:12px 13px;font-family:inherit;font-size:14px;margin-bottom:10px}
.pb-dev .cform input::placeholder{color:rgba(255,255,255,.5)}
.pb-dev .cform .row{display:flex;gap:9px;margin-top:9px}
.pb-dev .cform .row .btn{flex:1}
.pb-dev .cform .note{margin:12px 0 0;font-size:11.5px;color:rgba(255,255,255,.55);line-height:1.55}

@media(max-width:1024px){
  .pb-dev .score{grid-template-columns:repeat(3,1fr)}
  .pb-dev .score div:nth-child(3){border-right:0}
  .pb-dev .about{grid-template-columns:1fr}
  .pb-dev .pane.on{grid-template-columns:repeat(2,1fr)}
  .pb-dev .gal{grid-template-columns:repeat(3,1fr)}
  .pb-dev .cta{grid-template-columns:1fr}
}
@media(max-width:760px){
  .pb-dev .mshero img{height:250px}
  .pb-dev .mshero__logo{width:70px;height:70px;border-radius:14px}
  .pb-dev .mshero__acts{margin-left:0;width:100%}
  .pb-dev .msnav{top:56px}
  .pb-dev .score{grid-template-columns:1fr 1fr}
  .pb-dev .score div{border-right:0;border-bottom:1px solid var(--pbd-line-2)}
  .pb-dev .pane.on{grid-template-columns:1fr}
  .pb-dev .gal{grid-template-columns:repeat(2,1fr)}
  .pb-dev .gal a:first-child{grid-column:span 2}
  .pb-dev .unit{grid-template-columns:88px 1fr}
  .pb-dev .unit img{width:88px;height:66px}
  .pb-dev .unit .p{grid-column:1/-1;text-align:left}
  .pb-dev .cta{padding:22px}
}
.pb-dev :focus-visible{outline:2px solid var(--pbd-orange);outline-offset:2px}


/* --------------------------------------------------------------------------
   Live-page additions.
   Nothing below uses --pbd-brand. That is deliberate: the scorecard, the
   delivery table and their verdict colours are PropertyBazaar's, and a
   developer who could recolour "1 of 2" would turn the page into marketing.
   -------------------------------------------------------------------------- */
.pb-dev .mshero--flat{background:linear-gradient(150deg,var(--pbd-ink),#1B3A44);min-height:250px}
.pb-dev .mshero--flat .mshero__in{position:static;padding:44px 0 26px}
.pb-dev .msnav a{text-decoration:none}
.pb-dev .score b.good{color:var(--pbd-green)}
.pb-dev .score b.warn{color:var(--pbd-amber)}
.pb-dev .score b.mute{color:var(--pbd-gray-2);font-size:17px}
.pb-dev .facts--wide div{align-items:flex-start;gap:20px}
.pb-dev .facts--wide span{flex:1;min-width:0}
.pb-dev .facts--wide b{flex:1;text-align:right;font-weight:600;font-size:13px}
.pb-dev .facts--wide em{font-style:normal;font-weight:700}
.pb-dev .facts--wide .v-good{color:var(--pbd-green)}
.pb-dev .facts--wide .v-warn{color:var(--pbd-amber)}
.pb-dev .facts--wide .v-mute{color:var(--pbd-gray-2)}
.pb-dev .disclaim{font-size:12.5px;color:var(--pbd-gray-2);margin-top:16px;line-height:1.55}
.pb-dev .unit{text-decoration:none;color:inherit}
.pb-dev .pcard[hidden]{display:none}
.pb-dev .cform__done b{display:block;font-size:15px;color:#fff;margin-bottom:4px}
.pb-dev .cform__done span{font-size:13px;color:rgba(255,255,255,.72);line-height:1.6}
.pb-dev .cform__err{margin:0 0 12px;padding:10px 12px;background:rgba(180,71,46,.25);color:#fff;border-radius:8px;font-size:12.5px}
.pb-dev .gal a{display:block}