/* ═══ Nkwata · City bar and rollout notice ══════════════════════════════
   A city that is not open says so, plainly, in the place the houses
   would have been. Honesty is the product. */

.citybar{
  display:flex; gap:8px; overflow-x:auto; padding:10px 0 2px;
  scrollbar-width:none; -ms-overflow-style:none;
}
.citybar::-webkit-scrollbar{display:none}

.citychip{
  flex:0 0 auto; display:inline-flex; align-items:baseline; gap:6px;
  min-height:38px; padding:8px 15px;
  font:600 14px/1 var(--ui, 'Archivo', system-ui, sans-serif);
  color:var(--muted,#6B6154);
  background:var(--bone,#F7F4ED);
  border:1px solid rgba(107,97,84,.22);
  border-radius:999px 999px 8px 8px;      /* the aperture, shallow */
  cursor:pointer; white-space:nowrap;
  transition:border-color .18s ease, color .18s ease, background .18s ease;
}
.citychip:hover{ border-color:rgba(192,64,31,.45); color:var(--basalt,#14120F) }
.citychip.on{
  background:var(--basalt,#14120F); color:var(--bone,#F7F4ED);
  border-color:var(--basalt,#14120F);
}
.citychip.soon{ opacity:.78 }
.citychip.soon i{
  font:600 10px/1 var(--mono,'IBM Plex Mono',monospace);
  font-style:normal; letter-spacing:.06em; text-transform:uppercase;
  color:var(--clay,#C0401F); background:rgba(192,64,31,.10);
  padding:3px 6px; border-radius:4px;
}
.citychip.on.soon i{ color:var(--ochre,#E8A33D); background:rgba(232,163,61,.16) }
.citychip:focus-visible{
  outline:2px solid var(--clay,#C0401F); outline-offset:3px;
}

/* ── The notice that replaces results ─────────────────────────────── */
.citynotice{
  max-width:640px; margin:34px auto 56px; padding:30px 28px 26px;
  background:var(--bone,#F7F4ED);
  border:1px solid rgba(107,97,84,.20);
  border-top:3px solid var(--clay,#C0401F);
  border-radius:20px 20px 10px 10px;      /* the aperture again */
  text-align:left;
}
.cn-flag{
  display:inline-block; margin-bottom:12px;
  font:600 11px/1 var(--mono,'IBM Plex Mono',monospace);
  letter-spacing:.08em; text-transform:uppercase;
  color:var(--clay,#C0401F); background:rgba(192,64,31,.10);
  padding:5px 9px; border-radius:5px;
}
.citynotice h3{
  margin:0 0 10px; font:600 24px/1.2 var(--display,'Fraunces',Georgia,serif);
  color:var(--basalt,#14120F);
}
.citynotice p{
  margin:0 0 18px; font:400 15px/1.62 var(--ui,'Archivo',system-ui,sans-serif);
  color:var(--muted,#6B6154); max-width:54ch;
}
.cn-act{ display:flex; flex-wrap:wrap; gap:10px; margin-bottom:16px }
.cn-small{
  margin:0; padding-top:14px; border-top:1px solid rgba(107,97,84,.16);
  font:400 13px/1.55 var(--ui,'Archivo',system-ui,sans-serif);
  color:var(--muted,#6B6154);
}

/* ── Fee transparency on the card ─────────────────────────────────── */
.hc-fee{
  display:flex; align-items:center; gap:6px;
  margin-top:8px; padding-top:8px;
  border-top:1px solid rgba(107,97,84,.14);
  font:500 12px/1.4 var(--ui,'Archivo',system-ui,sans-serif);
  color:var(--muted,#6B6154);
}
.hc-fee b{ color:var(--basalt,#14120F); font-weight:600 }
.hc-fee.none b{ color:var(--kola,#2F6B4F) }
.hc-fee svg{ flex:0 0 auto; color:var(--kola,#2F6B4F) }

@media (max-width:520px){
  .citynotice{ margin:22px 0 40px; padding:24px 20px 20px; border-radius:16px 16px 8px 8px }
  .citynotice h3{ font-size:21px }
  .cn-act .btn{ width:100% }
}

/* ═══ Business switcher ════════════════════════════════════════════════
   One landlord, several books. The bar says what each is carrying,
   because that is the question the page is opened to answer. */
.bizbar{
  display:flex; gap:8px; overflow-x:auto; padding:4px 0 14px;
  scrollbar-width:none;
}
.bizbar::-webkit-scrollbar{display:none}
.bizchip{
  flex:0 0 auto; display:inline-flex; align-items:center; gap:8px;
  min-height:38px; padding:8px 14px;
  font:600 13px/1 var(--ui,'Archivo',system-ui,sans-serif);
  color:var(--muted,#6B6154); background:var(--bone,#F7F4ED);
  border:1px solid rgba(107,97,84,.22);
  border-radius:999px 999px 9px 9px;
  cursor:pointer; white-space:nowrap;
  transition:border-color .18s ease,color .18s ease,background .18s ease;
}
.bizchip:hover{ border-color:rgba(192,64,31,.45); color:var(--basalt,#14120F) }
.bizchip.on{
  background:var(--basalt,#14120F); color:var(--bone,#F7F4ED);
  border-color:var(--basalt,#14120F);
}
.bizchip .bz-n{
  font:600 11px/1 var(--mono,'IBM Plex Mono',monospace);
  padding:3px 6px; border-radius:5px;
  background:rgba(107,97,84,.14); color:inherit;
}
.bizchip.on .bz-n{ background:rgba(247,244,237,.18) }
.bizchip .bz-d{
  font:600 9px/1 var(--mono,'IBM Plex Mono',monospace); font-style:normal;
  letter-spacing:.06em; text-transform:uppercase; color:var(--kola,#2F6B4F);
}
.bizchip.on .bz-d{ color:var(--ochre,#E8A33D) }
.bizchip.add{ border-style:dashed; color:var(--clay,#C0401F) }
.bizchip:focus-visible{ outline:2px solid var(--clay,#C0401F); outline-offset:3px }

.bizmeta{
  display:flex; align-items:center; flex-wrap:wrap; gap:10px;
  margin:-4px 0 20px;
  font:400 13px/1.5 var(--ui,'Archivo',system-ui,sans-serif);
  color:var(--muted,#6B6154);
}
.bizmeta i{ width:3px; height:3px; border-radius:50%; background:rgba(107,97,84,.5) }
.bz-manage{
  margin-left:auto; background:none; border:0; cursor:pointer;
  font:600 13px/1 var(--ui,'Archivo',system-ui,sans-serif);
  color:var(--clay,#C0401F); border-bottom:1px solid currentColor; padding:0 0 2px;
}
@media (max-width:520px){
  .bz-manage{ margin-left:0 }
}