/* Home page only (12 Nov 2026, variant B of the join hero): the member faces and Bali Startup & Tech
   numbers under the headline, and the label on the wall's pictures (assets/wall.js). Kept out of rb.css,
   which every page loads and which is at its size budget. */
.hero-side{ display:flex; flex-direction:column; align-items:flex-start; gap:18px; }
@media (min-width:960px){ .hero-side{ align-items:flex-end; } .hero-who{ max-width:540px; } }
.hero-who{ display:flex; align-items:center; gap:14px; }
.hero-who p{ margin:0; max-width:52ch; font-size:16px; line-height:1.45; color:var(--plum-2); }
.hero-who p strong{ color:var(--plum); font-weight:650; }
.who-stack{ display:flex; flex:none; padding-left:6px; }
.who-stack a{ width:var(--s); height:var(--s); margin-left:-6px; border-radius:50%; background:var(--tint) var(--sprite) no-repeat;
  background-size:calc(var(--cols) * var(--s)) calc(var(--rows) * var(--s));
  background-position:calc(var(--x) * var(--s) * -1) calc(var(--y) * var(--s) * -1);
  box-shadow:0 0 0 2px var(--jade), 0 0 0 4px var(--blush); }
.who-stack a:hover, .who-stack a:focus-visible{ position:relative; z-index:1; box-shadow:0 0 0 2px var(--pink), 0 0 0 4px var(--blush); }

.hero-proof{ margin-top:18px; }
.hero-stats{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:8px; }
.hero-stats li{ background:var(--white); border-radius:999px; padding:6px 14px; font-size:14px; line-height:1.35; color:var(--plum-2); }
.hero-stats strong{ color:var(--plum); font-size:16px; font-weight:800; }
.hero-stats small{ font-size:12px; }
.hero-stats-note{ margin:10px 0 0; max-width:86ch; font-size:13px; line-height:1.45; color:var(--plum-2); }

.wall-tip{ position:absolute; left:0; top:0; transform:translate(-50%,calc(-100% - 10px)); z-index:4; max-width:min(280px, calc(100vw - 32px));
  background:var(--plum); color:var(--blush); font-size:14px; font-weight:650; line-height:1.3; padding:7px 11px; border-radius:9px;
  text-decoration:none; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.wall-tip small{ display:block; font-size:12px; font-weight:500; color:var(--tint); overflow:hidden; text-overflow:ellipsis; }
.wall-tip[href]:hover{ background:var(--cobalt); color:var(--white); }
.wall-tip[hidden]{ display:none; }

@media (max-width:719px){
  .hero-who{ gap:12px; }
  .hero-who p{ font-size:15px; }
  .hero-stats{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
  .hero-stats li{ border-radius:14px; padding:8px 10px; font-size:12.5px; line-height:1.3; }
  .hero-stats strong{ display:block; font-size:18px; }
  .hero-stats small{ display:block; margin-top:3px; font-size:12px; }
}