/* Content-sized statistics: the longest value gets the space it needs. */
.public-stats {
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  min-width:0;
}
.public-stats > div {
  box-sizing:border-box;
  flex:1 1 min-content;
  min-width:0;
  max-width:100%;
  width:auto;
  height:auto;
  min-height:210px;
  gap:24px;
}
.public-stats b {
  display:block;
  max-width:100%;
  line-height:1.05;
  overflow-wrap:break-word;
}
.public-stats span { overflow-wrap:break-word; }

@media(min-width:1200px){
  .public-about {
    display:flex;
    flex-direction:row;
    flex-wrap:wrap;
    align-items:flex-end;
    gap:40px;
    height:auto;
    min-height:856px;
  }
  .public-about__copy { flex:1 1 280px; max-width:430px; }
  .public-stats { flex:2 1 760px; align-self:flex-end; }
}
@media(min-width:721px) and (max-width:1199px){
  .public-about { display:flex; flex-direction:column; gap:36px; height:auto; min-height:0; padding:64px 48px; }
  .public-about__copy { position:relative; top:auto; left:auto; width:min(460px,100%); padding:0; z-index:1; }
  .public-stats { position:relative; right:auto; bottom:auto; width:100%; margin:0; z-index:1; }
  .public-stats > div { min-height:180px; padding:22px; }
  .public-stats b { font-size:clamp(48px,7vw,76px); }
}
@media(max-width:720px){
  .public-stats { flex-direction:column; gap:1px; }
  .public-stats > div { flex:none; min-height:128px; padding:20px; gap:16px; }
  .public-stats b { font-size:clamp(36px,12vw,48px); }
}