/* Shared "city page" styles — philadelphia, pittsburgh, poconos, etc. */

.hero--city .city-hero__grid{
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);
  gap:clamp(2rem, 5vw, 4rem);
  align-items:start;
  position:relative;
}

.hood-grid{
  list-style:none;margin:0;padding:0;
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(230px, 1fr));
  gap:0;
  border-top:1px solid var(--rule);
  border-left:1px solid var(--rule);
}
.hood-card{
  padding:1.2rem 1.3rem;
  border-right:1px solid var(--rule);
  border-bottom:1px solid var(--rule);
  background:transparent;
  transition:background .2s var(--ease);
  position:relative;
}
.hood-card:hover{background:var(--white)}
.hood-card__name{
  font-family:var(--display);font-weight:600;
  font-size:1.1rem;margin:0 0 .15rem;letter-spacing:-.01em;
}
.hood-card__note{
  font-family:var(--mono);font-size:.65rem;
  text-transform:uppercase;letter-spacing:.15em;
  color:var(--slate);margin:0;
}
.hood-card__temp{
  font-family:var(--display);font-weight:700;
  font-size:2.4rem;line-height:1;margin:.7rem 0 .2rem;
  font-variant-numeric:tabular-nums;letter-spacing:-.02em;
}
.hood-card__temp small{font-size:.85rem;color:var(--slate);font-weight:400}
.hood-card__cond{
  font-size:.88rem;color:var(--ink-soft);
  font-style:italic;margin:.2rem 0 .7rem;
}
.hood-card__meta{
  display:flex;gap:.9rem;padding-top:.6rem;
  border-top:1px dashed var(--rule);
  font-family:var(--mono);font-size:.72rem;color:var(--slate);
}
.hood-card__meta strong{color:var(--ink);font-weight:500}

/* three-rivers widget (pittsburgh) */
.rivers{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  border:1px solid var(--ink);
  background:var(--paper);
  margin-top:1rem;
}
.river{
  padding:1.2rem 1.3rem;border-right:1px solid var(--rule);
}
.river:last-child{border-right:0}
.river h4{
  font-family:var(--display);font-size:1.2rem;
  font-weight:600;margin:0 0 .3rem;letter-spacing:-.01em;
}
.river__level{
  font-family:var(--display);font-weight:700;font-size:1.8rem;
  color:var(--ink);line-height:1;margin:.4rem 0 .2rem;
  font-variant-numeric:tabular-nums;
}
.river__level small{font-size:.8rem;font-weight:400;color:var(--slate)}
.river__note{font-family:var(--mono);font-size:.72rem;color:var(--slate);margin:.3rem 0 0;text-transform:uppercase;letter-spacing:.1em}

@media (max-width:900px){
  .hero--city .city-hero__grid{grid-template-columns:1fr}
}